5 |
5 |
6 IriSP.Widgets.SlideVideoPlayer.prototype = new IriSP.Widgets.Widget(); |
6 IriSP.Widgets.SlideVideoPlayer.prototype = new IriSP.Widgets.Widget(); |
7 |
7 |
8 |
8 |
9 IriSP.Widgets.SlideVideoPlayer.prototype.defaults = { |
9 IriSP.Widgets.SlideVideoPlayer.prototype.defaults = { |
|
10 playerModule: "HtmlPlayer", |
|
11 // mode is either "sidebyside" or "pip" |
|
12 mode: "sidebyside" |
10 }; |
13 }; |
11 |
14 |
12 IriSP.Widgets.SlideVideoPlayer.prototype.template = '<div class="Ldt-SlideVideoPlayer">\ |
15 IriSP.Widgets.SlideVideoPlayer.prototype.template = '<div class="Ldt-SlideVideoPlayer">\ |
13 <div class="Ldt-SlideVideoPlayer-slide Ldt-SlideVideoPlayer-panel">\ |
16 <div class="Ldt-SlideVideoPlayer-slide Ldt-SlideVideoPlayer-panel">\ |
14 </div>\ |
17 </div>\ |
15 <div class="Ldt-SlideVideoPlayer-video Ldt-SlideVideoPlayer-panel"></div>\ |
18 <div class="Ldt-SlideVideoPlayer-video Ldt-SlideVideoPlayer-panel">\ |
|
19 </div>\ |
16 </div>'; |
20 </div>'; |
17 |
21 |
18 IriSP.Widgets.SlideVideoPlayer.prototype.draw = function() { |
22 IriSP.Widgets.SlideVideoPlayer.prototype.draw = function() { |
19 var _this = this; |
23 var _this = this; |
20 |
24 |
21 _this.renderTemplate(); |
25 _this.renderTemplate(); |
22 this.insertSubwidget( |
26 this.insertSubwidget( |
23 _this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-slide"), |
27 _this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-slide"), |
24 { |
28 { |
25 type: "ImageDisplay", |
29 type: "ImageDisplay", |
26 annotation_type: _this.annotation_type, |
30 annotation_type: _this.annotation_type |
27 width: '100%' |
|
28 }, |
31 }, |
29 "slide" |
32 "slide" |
30 ); |
33 ); |
31 this.insertSubwidget( |
34 this.insertSubwidget( |
32 _this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-video"), |
35 _this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-video"), |
33 { |
36 { |
34 type: "HtmlPlayer", |
37 type: _this.playerModule, |
35 video: _this.video, |
38 video: _this.video, |
36 width: '100%', |
39 width: '100%', |
37 url_transform: _this.url_transform |
40 url_transform: _this.url_transform |
38 }, |
41 }, |
39 "player" |
42 "player" |
40 ); |
43 ); |
41 // FIXME: this should be better implemented through a signal sent |
44 |
42 // when widgets are ready (and not just loaded) |
45 if (_this.mode == 'pip') { |
43 window.setTimeout(function () { |
46 _this.$.find(".Ldt-SlideVideoPlayer-panel").append('<div class="Ldt-SlideVideoPlayer-pip-menu"><div class="Ldt-SlideVideoPlayer-pip-menu-toggle"></div></div>'); |
44 _this.$.find(".Ldt-SlideVideoPlayer").split({ orientation: 'vertical' }); |
47 _this.$.on("click", ".Ldt-SlideVideoPlayer-pip-menu-toggle", function () { |
45 }, 1000); |
48 _this.toggleMainDisplay(); |
|
49 }); |
|
50 window.setTimeout(function () { |
|
51 _this.setMainDisplay('video'); |
|
52 }, 1500); |
|
53 } else { |
|
54 // Default : side by side |
|
55 // FIXME: this should be better implemented through a signal sent |
|
56 // when widgets are ready (and not just loaded) |
|
57 window.setTimeout(function () { |
|
58 _this.$.find(".Ldt-SlideVideoPlayer").touchSplit({ orientation: (screen.height > screen.width) ? 'vertical' : 'horizontal', |
|
59 leftMin: 20, |
|
60 topMin: 20 |
|
61 }); |
|
62 }, 1500); |
|
63 } |
|
64 }; |
|
65 |
|
66 IriSP.Widgets.SlideVideoPlayer.prototype.toggleMainDisplay = function() { |
|
67 if (this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-video").hasClass("Ldt-SlideVideoPlayer-pip-main")) { |
|
68 this.setMainDisplay('slides'); |
|
69 } else { |
|
70 this.setMainDisplay('video'); |
|
71 } |
|
72 }; |
|
73 |
|
74 // Set main display (in case of a "switch" display mode) |
|
75 // main is either 'video' or 'slides' |
|
76 IriSP.Widgets.SlideVideoPlayer.prototype.setMainDisplay = function(video_or_slides) { |
|
77 var main = this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-video"); |
|
78 var pip = this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-slide"); |
|
79 if (video_or_slides == 'slides') { |
|
80 var temp = main; |
|
81 main = pip; |
|
82 pip = temp; |
|
83 }; |
|
84 main.removeClass('Ldt-SlideVideoPlayer-pip-pip').addClass('Ldt-SlideVideoPlayer-pip-main'); |
|
85 pip.removeClass('Ldt-SlideVideoPlayer-pip-main').addClass('Ldt-SlideVideoPlayer-pip-pip'); |
46 } |
86 } |