blob: abade926e46075ecc0298594960b0914cef10303 [file] [log] [blame]
'use strict';
/**
* Inject required CSS and JS into html fragment loaded into an <iframe>
* @type {{}}
*/
var mdlIframeLoader = {};
(function(self) {
// The CSS and JS needed to run MDL snippets in an <iframe>
// https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent
try {
new window.CustomEvent('test');
} catch(e) {
var CustomEvent = function(event, params) {
var evt;
params = params || {
bubbles: false,
cancelable: false,
detail: undefined
};
evt = document.createEvent('CustomEvent');
evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
return evt;
};
CustomEvent.prototype = window.Event.prototype;
window.CustomEvent = CustomEvent; // expose definition to window
}
var docs = [
{ 'type': 'css', 'id': 'font-roboto-css', 'src': 'https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' },
{ 'type': 'css', 'id': 'material-icon-css', 'src': 'https://fonts.googleapis.com/icon?family=Material+Icons' },
{ 'type': 'css', 'id': 'dialog-polyfill-css', 'src': 'demo/styles/dialog-polyfill.css' },
{ 'type': 'css', 'id': 'material-css', 'src': 'https://code.getmdl.io/1.1.3/material.grey-orange.min.css' },
{ 'type': 'css', 'id': 'mdlext-css', 'src': 'lib/mdl-ext-eqjs.css' },
{ 'type': 'css', 'id': 'demo-css', 'src': 'demo/styles/demo.css' },
{ 'type': 'js', 'id': 'dialog-polyfill-js', 'src': 'demo/scripts/dialog-polyfill.js' },
{ 'type': 'js', 'id': 'material-js', 'src': 'https://code.getmdl.io/1.1.3/material.min.js' },
{ 'type': 'js', 'id': 'eq-js', 'src': 'demo/scripts/eq.min.js' },
{ 'type': 'js', 'id': 'mdlext-js', 'src': 'lib/index.js' }
];
var joinOrigin = function(origin, src) {
return src.startsWith('http') ? src : origin.concat(src);
};
var loadResources = function( origin, loadCompleted ) {
var expectToLoad = docs.length;
var filesLoaded = 0;
for (var i = 0; i < docs.length; i++) {
if (document.getElementById(docs[i].id) === null) {
var el;
var src = joinOrigin(origin, docs[i].src);
if (docs[i].type === 'css') {
el = document.createElement('link');
el.href = src;
el.rel = 'stylesheet';
el.type = 'text/css';
}
else {
el = document.createElement('script');
el.src = src;
el.type = 'text/javascript';
el.async = false;
el.charset = 'utf-8';
}
el.id = docs[i].id;
el.onload = function () {
filesLoaded++;
if(filesLoaded >= expectToLoad) {
loadCompleted();
}
};
document.head.appendChild(el);
}
else {
expectToLoad--;
}
}
};
/**
* Inject required CSS and JS into html fragment loaded into an <iframe>
* @param origin path relative to root of this project, e.g. "../../../
*/
self.load = function( origin ) {
loadResources( origin, function () {
if(window.componentHandler) {
window.componentHandler.upgradeDom();
}
});
};
return self;
})(mdlIframeLoader);