1 /* init.js - initialization and configuration of Popcorn and the widgets |
1 /* init.js - initialization and configuration of Popcorn and the widgets |
2 exemple json configuration: |
|
3 |
|
4 */ |
|
5 |
|
6 /** |
|
7 set up the IriSP.__dataloader instance - |
|
8 we need it because we have to get the metadata |
|
9 about the video before that the widget have even |
|
10 loaded. |
|
11 */ |
2 */ |
12 IriSP.setupDataLoader = function() { |
3 |
13 /* we set it up separately because we need to |
4 if (typeof window.IriSP === "undefined") { |
14 get data at the very beginning, for instance when |
5 IriSP = {}; |
15 setting up the video */ |
6 } |
16 IriSP.__dataloader = new IriSP.DataLoader(); |
7 |
|
8 /* The Metadataplayer Object, single point of entry, replaces IriSP.init_player */ |
|
9 |
|
10 IriSP.Metadataplayer = function(config) { |
|
11 IriSP.log("IriSP.Metadataplayer constructor"); |
|
12 for (var key in IriSP.guiDefaults) { |
|
13 if (IriSP.guiDefaults.hasOwnProperty(key) && !config.gui.hasOwnProperty(key)) { |
|
14 config.gui[key] = IriSP.guiDefaults[key] |
|
15 } |
|
16 } |
|
17 var _container = document.getElementById(config.gui.container); |
|
18 _container.innerHTML = '<h3 class="Ldt-Loader">Loading... Chargement...</h3>'; |
|
19 this.sourceManager = new IriSP.Model.Directory(); |
|
20 this.config = config; |
|
21 this.callbackQueue = []; |
|
22 this.isLoaded = false; |
|
23 this.loadLibs(); |
|
24 } |
|
25 |
|
26 IriSP.Metadataplayer.prototype.toString = function() { |
|
27 return 'Metadataplayer in #' + this.config.gui.container; |
|
28 } |
|
29 |
|
30 IriSP.Metadataplayer.prototype.deferCallback = function(_callback) { |
|
31 var _this = this; |
|
32 IriSP._.defer(function() { |
|
33 _callback.call(_this); |
|
34 }); |
|
35 } |
|
36 |
|
37 IriSP.Metadataplayer.prototype.handleCallbacks = function() { |
|
38 this.isLoaded = true; |
|
39 while (this.callbackQueue.length) { |
|
40 this.deferCallback(this.callbackQueue.splice(0,1)[0]); |
|
41 } |
|
42 } |
|
43 |
|
44 IriSP.Metadataplayer.prototype.onLoad = function(_callback) { |
|
45 if (this.isLoaded) { |
|
46 this.deferCallback(_callback); |
|
47 } else { |
|
48 this.callbackQueue.push(_callback); |
|
49 } |
|
50 } |
|
51 |
|
52 IriSP.Metadataplayer.prototype.loadLibs = function() { |
|
53 IriSP.log("IriSP.Metadataplayer.prototype.loadLibs"); |
|
54 var $L = $LAB |
|
55 .script(IriSP.getLib("underscore")) |
|
56 .script(IriSP.getLib("Mustache")) |
|
57 .script(IriSP.getLib("jQuery")) |
|
58 .script(IriSP.getLib("swfObject")); |
|
59 |
|
60 if (typeof JSON == "undefined") { |
|
61 $L.script(IriSP.getLib("json")); |
|
62 } |
|
63 |
|
64 $L.wait() |
|
65 .script(IriSP.getLib("jQueryUI")); |
|
66 |
|
67 if (this.config.player.type === "jwplayer" || this.config.player.type === "auto") { |
|
68 $L.script(IriSP.getLib("jwplayer")); |
|
69 } |
|
70 |
|
71 if (this.config.player.type !== "jwplayer" && this.config.player.type !== "allocine" && this.config.player.type !== "dailymotion") { |
|
72 $L.script(IriSP.getLib("popcorn")); |
|
73 } |
|
74 |
|
75 /* widget specific requirements */ |
|
76 for(var _i = 0; _i < this.config.gui.widgets.length; _i++) { |
|
77 var _t = this.config.gui.widgets[_i].type; |
|
78 if (typeof IriSP.widgetsRequirements[_t] !== "undefined" && typeof IriSP.widgetsRequirements[_t].requires !== "undefined" ) { |
|
79 for (var _j = 0; _j < IriSP.widgetsRequirements[_t].requires.length; _j++) { |
|
80 $L.script(IriSP.getLib(IriSP.widgetsRequirements[_t].requires[_j])); |
|
81 } |
|
82 } |
|
83 } |
|
84 |
|
85 var _this = this; |
|
86 |
|
87 $L.wait(function() { |
|
88 _this.onLibsLoaded(); |
|
89 }); |
|
90 } |
|
91 |
|
92 IriSP.Metadataplayer.prototype.onLibsLoaded = function() { |
|
93 IriSP.log("IriSP.Metadataplayer.prototype.onLibsLoaded"); |
|
94 if (typeof IriSP.jQuery === "undefined" && typeof window.jQuery !== "undefined") { |
|
95 IriSP.jQuery = window.jQuery.noConflict(); |
|
96 } |
|
97 if (typeof IriSP._ === "undefined" && typeof window._ !== "undefined") { |
|
98 IriSP._ = window._; |
|
99 } |
|
100 IriSP.loadCss(IriSP.getLib("cssjQueryUI")); |
|
101 IriSP.loadCss(this.config.gui.css); |
|
102 |
|
103 this.videoData = this.loadMetadata(this.config.player.metadata); |
|
104 this.$ = IriSP.jQuery('#' + this.config.gui.container); |
|
105 this.$.css({ |
|
106 "width": this.config.gui.width, |
|
107 "clear": "both" |
|
108 }); |
|
109 if (typeof this.config.gui.height !== "undefined") { |
|
110 this.$.css("height", this.config.gui.height); |
|
111 } |
|
112 |
|
113 var _this = this; |
|
114 this.videoData.onLoad(function() { |
|
115 _this.onVideoDataLoaded(); |
|
116 }); |
|
117 } |
|
118 |
|
119 IriSP.Metadataplayer.prototype.loadMetadata = function(_metadataInfo) { |
|
120 if (typeof _metadataInfo.serializer === "undefined" && typeof _metadataInfo.format !== "undefined") { |
|
121 _metadataInfo.serializer = IriSP.serializers[_metadataInfo.format]; |
|
122 } |
|
123 if (typeof _metadataInfo.url === "undefined" && typeof _metadataInfo.src !== "undefined") { |
|
124 _metadataInfo.url = _metadataInfo.src; |
|
125 } |
|
126 if (typeof _metadataInfo.url !== "undefined" && typeof _metadataInfo.serializer !== "undefined") { |
|
127 return this.sourceManager.remoteSource(_metadataInfo); |
|
128 } else { |
|
129 return this.sourceManager.newLocalSource(_metadataInfo); |
|
130 } |
|
131 } |
|
132 |
|
133 IriSP.Metadataplayer.prototype.onVideoDataLoaded = function() { |
|
134 |
|
135 /* Setting default media from metadata */ |
|
136 |
|
137 if (typeof this.videoData !== "undefined") { |
|
138 |
|
139 var _media; |
|
140 |
|
141 if (typeof this.videoData.mainMedia !== "undefined") { |
|
142 _media = this.videoData.getElement(this.videoData.mainMedia); |
|
143 } |
|
144 |
|
145 if (this.config.player.type === "mashup" || this.config.player.type === "mashup-html") { |
|
146 if (typeof _media === "undefined" || _media.elementType !== "mashup") { |
|
147 var _mashups = this.videoData.getMashups(); |
|
148 if (_mashups.length) { |
|
149 _media = _mashups[0]; |
|
150 } |
|
151 } |
|
152 } else { |
|
153 if (typeof _media === "undefined" || _media.elementType !== "media") { |
|
154 var _medias = this.videoData.getMedias(); |
|
155 if (_medias.length) { |
|
156 _media = _medias[0]; |
|
157 } |
|
158 } |
|
159 } |
|
160 |
|
161 this.videoData.currentMedia = _media; |
|
162 |
|
163 /* Getting video URL from metadata if it's not in the player config options */ |
|
164 |
|
165 if (typeof _media !== "undefined" && typeof _media.video !== "undefined" && typeof this.config.player.video === "undefined") { |
|
166 this.config.player.video = _media.video; |
|
167 if (typeof this.config.player.streamer == "undefined" && typeof _media.streamer !== "undefined") { |
|
168 this.config.player.streamer = _media.streamer; |
|
169 } |
|
170 } |
|
171 |
|
172 } |
|
173 |
|
174 if (typeof this.config.player.video === "string" && this.config.player.url_transform === "function") { |
|
175 this.config.player.video = this.config.player.url_transform(this.config.player.video); |
|
176 } |
|
177 |
|
178 var _pop, |
|
179 _divs = this.layoutDivs("video",this.config.player.height || undefined), |
|
180 containerDiv = _divs[0], |
|
181 spacerDiv = _divs[1], |
|
182 _this = this, |
|
183 _types = { |
|
184 "html5" : /\.(ogg|ogv|webm)$/, |
|
185 "youtube" : /^(https?:\/\/)?(www\.)?youtube\.com/, |
|
186 "vimeo" : /^(https?:\/\/)?(www\.)?vimeo\.com/, |
|
187 "dailymotion" : /^(https?:\/\/)?(www\.)?dailymotion\.com/ |
|
188 }; |
|
189 |
|
190 if (this.config.player.type === "auto") { |
|
191 this.config.player.type = "jwplayer"; |
|
192 IriSP._(_types).each(function(_v, _k) { |
|
193 if (_v.test(_this.config.player.video)) { |
|
194 _this.config.player.type = _k |
|
195 } |
|
196 }); |
|
197 } |
|
198 |
|
199 switch(this.config.player.type) { |
|
200 case "html5": |
|
201 var _tmpId = Popcorn.guid("video"), |
|
202 _videoEl = IriSP.jQuery('<video>'); |
|
203 |
|
204 _videoEl.attr({ |
|
205 "src" : this.config.player.video, |
|
206 "id" : _tmpId |
|
207 }) |
|
208 |
|
209 if(this.config.player.hasOwnProperty("width")) { |
|
210 _videoEl.attr("width", this.config.player.width); |
|
211 } |
|
212 if(this.config.player.hasOwnProperty("height")) { |
|
213 _videoEl.attr("height", this.config.player.height); |
|
214 } |
|
215 IriSP.jQuery("#" + containerDiv).append(_videoEl); |
|
216 _pop = Popcorn("#" + _tmpId); |
|
217 break; |
|
218 |
|
219 case "html5-audio": |
|
220 var _tmpId = Popcorn.guid("audio"), |
|
221 _videoEl = IriSP.jQuery('<audio>'); |
|
222 |
|
223 _videoEl.attr({ |
|
224 "src" : this.config.player.video, |
|
225 "id" : _tmpId |
|
226 }) |
|
227 |
|
228 if(this.config.player.hasOwnProperty("width")) { |
|
229 _videoEl.attr("width", this.config.player.width); |
|
230 } |
|
231 if(this.config.player.hasOwnProperty("height")) { |
|
232 _videoEl.attr("height", this.config.player.height); |
|
233 } |
|
234 IriSP.jQuery("#" + containerDiv).append(_videoEl); |
|
235 _pop = Popcorn("#" + _tmpId); |
|
236 break; |
|
237 |
|
238 case "jwplayer": |
|
239 var opts = IriSP.jQuery.extend({}, this.config.player); |
|
240 delete opts.container; |
|
241 delete opts.type; |
|
242 if (typeof opts.streamer === "function") { |
|
243 opts.streamer = opts.streamer(opts.video); |
|
244 } |
|
245 if (typeof opts.streamer === "string") { |
|
246 opts.video = opts.video.replace(opts.streamer,""); |
|
247 } |
|
248 opts.file = opts.video; |
|
249 delete opts.video; |
|
250 delete opts.metadata; |
|
251 |
|
252 if(!opts.hasOwnProperty("flashplayer")) { |
|
253 opts.flashplayer = IriSP.getLib("jwPlayerSWF"); |
|
254 } |
|
255 |
|
256 if(!opts.hasOwnProperty("controlbar.position")) { |
|
257 opts["controlbar.position"] = "none"; |
|
258 } |
|
259 _pop = new IriSP.PopcornReplacement.jwplayer("#" + containerDiv, opts); |
|
260 break; |
|
261 |
|
262 case "youtube": |
|
263 // Popcorn.youtube wants us to specify the size of the player in the style attribute of its container div. |
|
264 IriSP.jQuery("#" + containerDiv).css({ |
|
265 width : this.config.player.width + "px", |
|
266 height : this.config.player.height + "px" |
|
267 }); |
|
268 var _urlparts = this.config.player.video.split(/[?&]/), |
|
269 _params = {}; |
|
270 for (var _j = 1; _j < _urlparts.length; _j++) { |
|
271 var _ppart = _urlparts[_j].split('='); |
|
272 _params[_ppart[0]] = decodeURIComponent(_ppart[1]); |
|
273 } |
|
274 _params.controls = 0; |
|
275 _params.modestbranding = 1; |
|
276 _url = _urlparts[0] + '?' + IriSP.jQuery.param(_params); |
|
277 _pop = Popcorn.youtube("#" + containerDiv, _url); |
|
278 break; |
|
279 |
|
280 case "vimeo": |
|
281 // Popcorn.vimeo wants us to specify the size of the player in the style attribute of its container div. |
|
282 IriSP.jQuery("#" + containerDiv).css({ |
|
283 width : this.config.player.width + "px", |
|
284 height : this.config.player.height + "px" |
|
285 }); |
|
286 _pop = Popcorn.vimeo("#" + containerDiv, this.config.player.video); |
|
287 break; |
|
288 |
|
289 case "dailymotion": |
|
290 _pop = new IriSP.PopcornReplacement.dailymotion("#" + containerDiv, this.config.player); |
|
291 break; |
|
292 |
|
293 case "mashup": |
|
294 _pop = new IriSP.PopcornReplacement.mashup("#" + containerDiv, this.config.player); |
|
295 break; |
|
296 |
|
297 case "allocine": |
|
298 _pop = new IriSP.PopcornReplacement.allocine("#" + containerDiv, this.config.player); |
|
299 break; |
|
300 |
|
301 case "mashup-html": |
|
302 _pop = new IriSP.PopcornReplacement.htmlMashup("#" + containerDiv, this.config.player, this.videoData); |
|
303 break; |
|
304 |
|
305 default: |
|
306 _pop = undefined; |
|
307 }; |
|
308 |
|
309 this.popcorn = _pop; |
|
310 |
|
311 /* Now Loading Widgets */ |
|
312 |
|
313 this.widgets = []; |
|
314 var _this = this; |
|
315 for(var i = 0; i < this.config.gui.widgets.length; i++) { |
|
316 this.loadWidget(this.config.gui.widgets[i], function(_widget) { |
|
317 _this.widgets.push(_widget) |
|
318 }); |
|
319 }; |
|
320 this.$.find('.Ldt-Loader').detach(); |
|
321 this.handleCallbacks(); |
|
322 } |
|
323 |
|
324 IriSP.Metadataplayer.prototype.loadWidget = function(_widgetConfig, _callback) { |
|
325 /* Creating containers if needed */ |
|
326 if (typeof _widgetConfig.container === "undefined") { |
|
327 var _divs = this.layoutDivs(_widgetConfig.type); |
|
328 _widgetConfig.container = _divs[0]; |
|
329 } |
|
330 |
|
331 var _this = this; |
|
332 |
|
333 if (typeof IriSP.Widgets[_widgetConfig.type] !== "undefined") { |
|
334 IriSP._.defer(function() { |
|
335 _callback(new IriSP.Widgets[_widgetConfig.type](_this, _widgetConfig)); |
|
336 }); |
|
337 } else { |
|
338 /* Loading Widget CSS */ |
|
339 if (typeof IriSP.widgetsRequirements[_widgetConfig.type] === "undefined" || typeof IriSP.widgetsRequirements[_widgetConfig.type].noCss === "undefined" || !IriSP.widgetsRequirements[_widgetConfig.type].noCss) { |
|
340 IriSP.loadCss(IriSP.widgetsDir + '/' + _widgetConfig.type + '.css'); |
|
341 } |
|
342 /* Loading Widget JS */ |
|
343 $LAB.script(IriSP.widgetsDir + '/' + _widgetConfig.type + '.js').wait(function() { |
|
344 _callback(new IriSP.Widgets[_widgetConfig.type](_this, _widgetConfig)); |
|
345 }); |
|
346 } |
|
347 } |
|
348 |
|
349 /** create a subdiv with an unique id, and a spacer div as well. |
|
350 @param widgetName the name of the widget. |
|
351 @return an array of the form [createdivId, spacerdivId]. |
|
352 */ |
|
353 IriSP.Metadataplayer.prototype.layoutDivs = function(_name, _height) { |
|
354 if (typeof(_name) === "undefined") { |
|
355 _name = ""; |
|
356 } |
|
357 var newDiv = IriSP._.uniqueId(this.config.gui.container + "_widget_" + _name + "_"), |
|
358 spacerDiv = IriSP._.uniqueId("LdtPlayer_spacer_"), |
|
359 divHtml = IriSP.jQuery('<div>') |
|
360 .attr("id",newDiv) |
|
361 .css({ |
|
362 width: this.config.gui.width + "px", |
|
363 position: "relative", |
|
364 clear: "both" |
|
365 }), |
|
366 spacerHtml = IriSP.jQuery('<div>') |
|
367 .attr("id",spacerDiv) |
|
368 .css({ |
|
369 width: this.config.gui.width + "px", |
|
370 height: this.config.gui.spacer_div_height + "px", |
|
371 position: "relative", |
|
372 clear: "both" |
|
373 }); |
|
374 if (typeof _height !== "undefined") { |
|
375 divHtml.css("height", _height); |
|
376 } |
|
377 |
|
378 this.$.append(divHtml); |
|
379 this.$.append(spacerHtml); |
|
380 |
|
381 return [newDiv, spacerDiv]; |
17 }; |
382 }; |
18 |
|
19 /** do some magic to configure popcorn according to the options object passed. |
|
20 Works for html5, jwplayer and youtube videos |
|
21 */ |
|
22 IriSP.configurePopcorn = function (layoutManager, options) { |
|
23 var pop; |
|
24 var ret = layoutManager.createDiv(); |
|
25 var containerDiv = ret[0]; |
|
26 var spacerDiv = ret[1]; |
|
27 |
|
28 /* insert one pixel of margin between the video and the first widget, using the |
|
29 spacer. |
|
30 */ |
|
31 IriSP.jQuery("#" + spacerDiv).css("height", "1px"); |
|
32 |
|
33 switch(options.type) { |
|
34 /* |
|
35 todo : dynamically create the div/video tag which |
|
36 will contain the video. |
|
37 */ |
|
38 case "html5": |
|
39 var tmpId = Popcorn.guid("video"); |
|
40 IriSP.jQuery("#" + containerDiv).append("<video src='" + options.file + "' id='" + tmpId + "'></video>"); |
|
41 |
|
42 if (options.hasOwnProperty("width")) |
|
43 IriSP.jQuery("#" + containerDiv).css("width", options.width); |
|
44 |
|
45 if (options.hasOwnProperty("height")) |
|
46 IriSP.jQuery("#" + containerDiv).css("height", options.height); |
|
47 |
|
48 pop = Popcorn("#" + tmpId); |
|
49 break; |
|
50 |
|
51 case "jwplayer": |
|
52 var opts = IriSP.jQuery.extend({}, options); |
|
53 delete opts.container; |
|
54 delete opts.type; |
|
55 |
|
56 |
|
57 /* Try to guess options.file and options.streamer only if file and streamer |
|
58 are not already defined in the configuration */ |
|
59 if (options.provider === "rtmp" && !opts.hasOwnProperty("file") && !opts.hasOwnProperty("streamer")) { |
|
60 /* exit if we can't access the metadata */ |
|
61 if (typeof(IriSP.__jsonMetadata) === "undefined") { |
|
62 break; |
|
63 }; |
|
64 |
|
65 // the json format is totally illogical |
|
66 //opts.streamer = IriSP.__jsonMetadata["medias"][0]["meta"]["item"]["value"]; |
|
67 //var source = IriSP.__jsonMetadata["medias"][0]["href"]; |
|
68 |
|
69 // the source if a full url but jwplayer wants an url relative to the |
|
70 // streamer url, so we've got to remove the common part. |
|
71 //opts.file = source.slice(opts.streamer.length); |
|
72 |
|
73 /* sometimes we get served a file with a wrong path and streamer. |
|
74 as a streamer is of the form rtmp://domain/path/ and the media is |
|
75 the rest, we uglily do this : |
|
76 */ |
|
77 opts.file = ""; |
|
78 opts.streamer = ""; |
|
79 var fullPath = IriSP.get_aliased(IriSP.__jsonMetadata["medias"][0], ["href","url"]); |
|
80 |
|
81 if (fullPath === null) { |
|
82 console.log("no url or href field defined in the metadata."); |
|
83 } |
|
84 |
|
85 var pathSplit = fullPath.split('/'); |
|
86 |
|
87 for (var i = 0; i < pathSplit.length; i++) { |
|
88 if (i < 4) { |
|
89 opts.streamer += pathSplit[i] + "/"; |
|
90 } else { |
|
91 opts.file += pathSplit[i]; |
|
92 /* omit the last slash if we're on the last element */ |
|
93 if (i < pathSplit.length - 1) |
|
94 opts.file += "/"; |
|
95 } |
|
96 } |
|
97 } else { |
|
98 /* other providers type, video for instance - |
|
99 pass everything as is */ |
|
100 } |
|
101 |
|
102 if (!options.hasOwnProperty("flashplayer")) { |
|
103 opts.flashplayer = IriSP.jwplayer_swf_path; |
|
104 } |
|
105 |
|
106 if (!options.hasOwnProperty("controlbar.position")) { |
|
107 opts["controlbar.position"] = "none"; |
|
108 } |
|
109 |
|
110 pop = new IriSP.PopcornReplacement.jwplayer("#" + containerDiv, opts); |
|
111 break; |
|
112 |
|
113 case "youtube": |
|
114 var opts = IriSP.jQuery.extend({}, options); |
|
115 delete opts.container; |
|
116 opts.controls = 0; |
|
117 opts.autostart = false; |
|
118 templ = "width: {{width}}px; height: {{height}}px;"; |
|
119 var str = Mustache.to_html(templ, {width: opts.width, height: opts.height}); |
|
120 // Popcorn.youtube wants us to specify the size of the player in the style attribute of its container div. |
|
121 IriSP.jQuery("#" + containerDiv).attr("style", str); |
|
122 |
|
123 pop = Popcorn.youtube("#" + containerDiv, opts.video, opts); |
|
124 break; |
|
125 |
|
126 case "dailymotion": |
|
127 pop = new IriSP.PopcornReplacement.dailymotion("#" + containerDiv, options); |
|
128 break; |
|
129 |
|
130 case "allocine": |
|
131 /* pass the options as-is to the allocine player and let it handle everything */ |
|
132 pop = new IriSP.PopcornReplacement.allocine("#" + containerDiv, options); |
|
133 break; |
|
134 |
|
135 default: |
|
136 pop = undefined; |
|
137 }; |
|
138 |
|
139 return pop; |
|
140 }; |
|
141 |
|
142 /** Configure the gui and instantiate the widgets passed as parameters |
|
143 @param guiOptions the gui object as seen in the examples. |
|
144 */ |
|
145 IriSP.configureWidgets = function (popcornInstance, layoutManager, guiOptions) { |
|
146 |
|
147 var serialFactory = new IriSP.SerializerFactory(IriSP.__dataloader); |
|
148 var params = {width: guiOptions.width, height: guiOptions.height}; |
|
149 |
|
150 var default_options = guiOptions.default_options; |
|
151 if (IriSP.null_or_undefined(default_options)) |
|
152 default_options = {}; |
|
153 |
|
154 var ret_widgets = []; |
|
155 var index; |
|
156 for (index = 0; index < guiOptions.widgets.length; index++) { |
|
157 var widget = IriSP.instantiateWidget(popcornInstance, serialFactory, layoutManager, guiOptions.widgets[index], default_options); |
|
158 |
|
159 ret_widgets.push(widget); |
|
160 }; |
|
161 |
|
162 return ret_widgets; |
|
163 }; |
|
164 |
|
165 /** configure modules. @see configureWidgets */ |
|
166 IriSP.configureModules = function (popcornInstance, modulesList) { |
|
167 if (IriSP.null_or_undefined(modulesList)) |
|
168 return; |
|
169 |
|
170 var serialFactory = new IriSP.SerializerFactory(IriSP.__dataloader); |
|
171 var ret_modules = []; |
|
172 var index; |
|
173 |
|
174 for (index = 0; index < modulesList.length; index++) { |
|
175 var moduleConfig = modulesList[index]; |
|
176 |
|
177 var serializer = serialFactory.getSerializer(moduleConfig.metadata); |
|
178 var module = new IriSP[moduleConfig.type](popcornInstance, moduleConfig, serializer); |
|
179 ret_modules.push(module); |
|
180 }; |
|
181 |
|
182 return ret_modules; |
|
183 }; |
|
184 |
|
185 /** instantiate a widget - only called by configureWidgets, never by the user. Handles widget |
|
186 dependencies. |
|
187 @param popcornInstance popcorn instance the widget will user |
|
188 @param serialFactory serializer factory to instantiate the widget with |
|
189 @param layoutManager layout manager |
|
190 @param widgetConfig configuration options for the widget |
|
191 @param defaultOptions a dictionnary with some options defined for every widget. |
|
192 */ |
|
193 IriSP.instantiateWidget = function(popcornInstance, serialFactory, layoutManager, widgetConfig, defaultOptions) { |
|
194 |
|
195 if (IriSP.null_or_undefined(defaultOptions)) { |
|
196 defaultOptions = {}; |
|
197 } |
|
198 if (IriSP.null_or_undefined(widgetConfig)) { |
|
199 return; |
|
200 } |
|
201 |
|
202 widgetConfig = IriSP.underscore.defaults(widgetConfig, defaultOptions); |
|
203 |
|
204 var arr = IriSP.jQuery.extend({}, widgetConfig); |
|
205 |
|
206 /* create a div for those widgets who didn't already specify a container; */ |
|
207 if (!arr.hasOwnProperty("container")) { |
|
208 /* create div returns us a container for the widget and a spacer */ |
|
209 var ret = layoutManager.createDiv(widgetConfig.type); |
|
210 var container = ret[0]; |
|
211 var spacer = ret[1]; |
|
212 arr.container = container; |
|
213 arr.spacer = spacer; |
|
214 arr.layoutManager = layoutManager; |
|
215 } |
|
216 var serializer = serialFactory.getSerializer(widgetConfig.metadata); |
|
217 |
|
218 if (typeof serializer == "undefined") |
|
219 debugger; |
|
220 |
|
221 // instantiate the object passed as a string |
|
222 var widget = new IriSP[widgetConfig.type](popcornInstance, arr, serializer); |
|
223 |
|
224 if (widgetConfig.hasOwnProperty("requires")) { |
|
225 // also create the widgets this one depends on. |
|
226 // the dependency widget is available in the parent widget context as |
|
227 // this.WidgetName (for instance, this.TipWidget); |
|
228 |
|
229 var i = 0; |
|
230 for(i = 0; i < widgetConfig.requires.length; i++) { |
|
231 var widgetName = widgetConfig.requires[i]["type"], |
|
232 _configobj = IriSP.jQuery.extend({}, widgetConfig.requires[i]), |
|
233 _div = document.createElement('div'), |
|
234 _container = IriSP.guid(arr.container + '_' + widgetName + '_'); |
|
235 _configobj.container = _container; |
|
236 _div.id = _container; |
|
237 widget.selector.append(_div); |
|
238 widget[widgetName] = IriSP.instantiateWidget(popcornInstance, serialFactory, layoutManager, _configobj, defaultOptions); |
|
239 } |
|
240 } |
|
241 |
|
242 serializer.sync(IriSP.wrap(widget, function() { this.draw(); })); |
|
243 return widget; |
|
244 }; |
|
245 |
|
246 /** single point of entry for the metadataplayer */ |
|
247 IriSP.initPlayer = function(config, metadata_url) { |
|
248 document.getElementById(config.gui.container).innerHTML = IriSP.templToHTML(IriSP.loading_template, config.gui); |
|
249 IriSP.loadLibs(config, metadata_url, |
|
250 function() { |
|
251 |
|
252 var layoutManager = new IriSP.LayoutManager(config.gui); |
|
253 |
|
254 var pop = IriSP.configurePopcorn(layoutManager, config.player); |
|
255 |
|
256 IriSP._widgets = IriSP.configureWidgets(pop, layoutManager, config.gui); |
|
257 IriSP._modules = IriSP.configureModules(pop, config.modules); |
|
258 IriSP.jQuery('#Ldt-loader').detach(); |
|
259 }); |
|
260 }; |
|