function MistUI(MistVideo,structure) { MistVideo.UI = this; this.elements = []; this.buildStructure = function(structure){ if (typeof structure == "function") { structure = structure.call(MistVideo); } if ("if" in structure) { var result = false; if (structure.if.call(MistVideo,structure)) { result = structure.then; } else if ("else" in structure) { result = structure.else; } if (!result) { return; } //append the result with structure options for (var i in structure) { if (["if","then","else"].indexOf(i) < 0) { if (i in result) { if (!(result[i] instanceof Array)) { result[i] = [result[i]]; } result[i] = result[i].concat(structure[i]); } else { result[i] = structure[i]; } } } return this.buildStructure(result); } if ("type" in structure) { if (structure.type in MistVideo.skin.blueprints) { //create the element; making sure to pass "this" to blueprint function var container = MistVideo.skin.blueprints[structure.type].call(MistVideo,structure); if (!container) { return; } MistUtil.class.add(container,"mistvideo-"+structure.type); if ("css" in structure) { var uid = MistUtil.createUnique(); structure.css = [].concat(structure.css); //convert to array; should be in string format with colors already applied for (var i in structure.css) { var style = MistUtil.css.createStyle(structure.css[i],uid); container.appendChild(style); } MistUtil.class.add(container,uid); container.uid = uid; } if ("classes" in structure) { for (var i in structure.classes) { MistUtil.class.add(container,structure.classes[i]); } } if ("title" in structure) { container.title = structure.title; } if ("style" in structure) { for (var i in structure.style) { container.style[i] = structure.style[i]; } } if ("children" in structure) { for (var i in structure.children) { var child = this.buildStructure(structure.children[i]); if (child) { container.appendChild(child); } } } //save the returned element so they can be killed on unload MistVideo.UI.elements.push(container); return container; } } return false; }; this.build = function(){ return this.buildStructure(structure ? structure : MistVideo.skin.structure.main); }; var container = this.build(); //apply skin CSS var uid = MistUtil.createUnique(); var toload = MistVideo.skin.css.length; if (toload) { container.style.opacity = "0"; } for (var i in MistVideo.skin.css) { var style = MistVideo.skin.css[i]; style.callback = function(css) { this.textContent = MistUtil.css.prependClass(css,uid,true); toload--; if (toload <= 0) { container.style.opacity = ""; } }; if (style.textContent != "") { //it has already loaded style.callback(style.textContent); } container.appendChild(style); } MistUtil.class.add(container,uid); //add browser class var browser = MistUtil.getBrowser(); if (browser) { MistUtil.class.add(container,"browser-"+browser); } return container; }