|
1 /* |
|
2 * Widget that ties AnnotationList and CreateAnnotation together |
|
3 * using buttons to hide/show AnnotationList and CreateAnnotation widgets. |
|
4 * |
|
5 */ |
|
6 |
|
7 IriSP.Widgets.AnnotationsController = function(player, config){ |
|
8 IriSP.Widgets.Widget.call(this, player, config); |
|
9 }; |
|
10 |
|
11 IriSP.Widgets.AnnotationsController.prototype = new IriSP.Widgets.Widget(); |
|
12 |
|
13 IriSP.Widgets.AnnotationsController.prototype.defaults = { |
|
14 // If true, displaying AnnotationList will hide CreateAnnotation and vice versa. |
|
15 display_or_write: false, |
|
16 starts_hidden: false, |
|
17 hide_without_segment: false, |
|
18 segments_annotation_type: "chap" |
|
19 }; |
|
20 |
|
21 IriSP.Widgets.AnnotationsController.prototype.template = |
|
22 "<div class='Ldt-AnnotationsController'>" |
|
23 + "<div class='Ldt-AnnotationsController-ButtonsContainer'>" |
|
24 + " <div class='Ldt-AnnotationsController-Button Ldt-AnnotationsController-ShowAnnotationsListButton'>{{l10n.display}}</div>" |
|
25 + " <div class='Ldt-AnnotationsController-Button Ldt-AnnotationsController-ShowCreateAnnotationButton'>{{l10n.write}}</div>" |
|
26 + "</div>" |
|
27 + "</div>" |
|
28 |
|
29 IriSP.Widgets.AnnotationsController.prototype.messages = { |
|
30 en : { |
|
31 write : "Write", |
|
32 display : "Display", |
|
33 }, |
|
34 fr : { |
|
35 write : "Ecrire", |
|
36 display : "Voir" |
|
37 } |
|
38 }; |
|
39 |
|
40 IriSP.Widgets.AnnotationsController.prototype.draw = function() { |
|
41 this.renderTemplate(); |
|
42 var _this = this; |
|
43 this.element_$ = this.$.find(".Ldt-AnnotationsController") |
|
44 |
|
45 this.displayButton_$ = this.$.find(".Ldt-AnnotationsController-ShowAnnotationsListButton"); |
|
46 this.writeButton_$ = this.$.find(".Ldt-AnnotationsController-ShowCreateAnnotationButton"); |
|
47 |
|
48 this.writeButton_$.click(function(){ |
|
49 _this.player.trigger("CreateAnnotation.toggle"); |
|
50 if (_this.display_or_write){ |
|
51 _this.player.trigger("AnnotationsList.hide"); |
|
52 } |
|
53 }); |
|
54 this.displayButton_$.click(function(){ |
|
55 _this.player.trigger("AnnotationsList.toggle"); |
|
56 if (_this.display_or_write){ |
|
57 _this.player.trigger("CreateAnnotation.hide"); |
|
58 } |
|
59 }) |
|
60 this.onMediaEvent("timeupdate", "onTimeUpdate") |
|
61 |
|
62 if (this.starts_hidden) { |
|
63 this.visible = true |
|
64 this.hide(); |
|
65 } |
|
66 else{ |
|
67 this.visible = false |
|
68 this.show(); |
|
69 } |
|
70 |
|
71 }; |
|
72 |
|
73 IriSP.Widgets.AnnotationsController.prototype.onTimeUpdate = function(){ |
|
74 if (this.hide_without_segment){ |
|
75 _currentTime = this.media.getCurrentTime() |
|
76 _segmentsAnnotations = this.source.getAnnotationsByTypeTitle(this.segments_annotation_type) |
|
77 _currentSegments = _segmentsAnnotations.filter(function(_segment){ |
|
78 return (_currentTime >= _segment.begin && _currentTime <= _segment.end) |
|
79 }); |
|
80 if (_currentSegments.length == 0){ |
|
81 if (this.visible){ |
|
82 this.hide(); |
|
83 _this.player.trigger("CreateAnnotation.hide"); |
|
84 _this.player.trigger("AnnotationsList.hide"); |
|
85 } |
|
86 } |
|
87 else { |
|
88 if (!this.visible){ |
|
89 this.show(); |
|
90 _this.player.trigger("CreateAnnotation.hide"); |
|
91 _this.player.trigger("AnnotationsList.hide"); |
|
92 } |
|
93 } |
|
94 } |
|
95 } |
|
96 |
|
97 IriSP.Widgets.AnnotationsController.prototype.hide = function() { |
|
98 if (this.visible){ |
|
99 this.visible = false; |
|
100 this.element_$.hide() |
|
101 } |
|
102 } |
|
103 |
|
104 IriSP.Widgets.AnnotationsController.prototype.show = function() { |
|
105 if(!this.visible){ |
|
106 this.visible = true; |
|
107 this.element_$.show() |
|
108 } |
|
109 } |