|
1 IriSP.Widgets.MultiSegments = function(player, config) { |
|
2 IriSP.Widgets.Widget.call(this, player, config); |
|
3 }; |
|
4 |
|
5 IriSP.Widgets.MultiSegments.prototype = new IriSP.Widgets.Widget(); |
|
6 |
|
7 IriSP.Widgets.MultiSegments.prototype.defaults = { |
|
8 annotation_show_arrow: true, |
|
9 annotation_start_minimized: true, |
|
10 annotation_show_annotation_type: true, |
|
11 show_all: false |
|
12 } |
|
13 |
|
14 IriSP.Widgets.MultiSegments.prototype.draw = function() { |
|
15 var _this = this, |
|
16 lines = [], |
|
17 currentLine = null, |
|
18 segmentsopts = {}, |
|
19 annotationopts = {}; |
|
20 IriSP._(this).each(function(_v,_k) { |
|
21 if (/^segments_/.test(_k)) { |
|
22 segmentsopts[_k.replace(/^segments_/,"")] = _v; |
|
23 } |
|
24 if (/^annotation_/.test(_k)) { |
|
25 annotationopts[_k.replace(/^annotation_/,"")] = _v; |
|
26 } |
|
27 }) |
|
28 this.source.getAnnotationTypes().forEach(function(_anntype) { |
|
29 var segments = _anntype.getAnnotations().filter(function(_ann) { |
|
30 return _ann.getDuration() > 0; |
|
31 }); |
|
32 if (segments.length) { |
|
33 |
|
34 var visible = false; |
|
35 |
|
36 var line = { |
|
37 segmentWidget: IriSP.jQuery("<div>"), |
|
38 annotationWidget: IriSP.jQuery("<div>"), |
|
39 hasSegmentsNow: function() { |
|
40 var _time = _this.media.getCurrentTime(); |
|
41 return !!segments.filter(function(_annotation) { |
|
42 return _annotation.begin <= _time && _annotation.end > _time; |
|
43 }).length; |
|
44 }, |
|
45 hide: function() { |
|
46 if (visible) { |
|
47 visible = false; |
|
48 this.annotationWidget.slideUp(); |
|
49 } |
|
50 }, |
|
51 show: function() { |
|
52 if (!visible) { |
|
53 visible = true; |
|
54 this.annotationWidget.slideDown(); |
|
55 } |
|
56 } |
|
57 } |
|
58 |
|
59 |
|
60 line.segmentWidget |
|
61 .addClass("Ldt-MultiSegments-Segment") |
|
62 .appendTo(_this.$); |
|
63 |
|
64 if (!_this.show_all) { |
|
65 line.segmentWidget.mouseenter(function() { |
|
66 if (line.hasSegmentsNow()) { |
|
67 currentLine = line; |
|
68 checkVisibilities(); |
|
69 } |
|
70 }); |
|
71 } |
|
72 |
|
73 line.annotationWidget |
|
74 .addClass("Ldt-MultiSegments-Annotation") |
|
75 .appendTo(_this.$) |
|
76 .hide(); |
|
77 |
|
78 _this.insertSubwidget( |
|
79 line.segmentWidget, |
|
80 IriSP._({ |
|
81 type: "Segments", |
|
82 annotation_type: _anntype |
|
83 }).extend(segmentsopts) |
|
84 ); |
|
85 |
|
86 _this.insertSubwidget( |
|
87 line.annotationWidget, |
|
88 IriSP._({ |
|
89 type: "Annotation", |
|
90 annotation_type: _anntype |
|
91 }).extend(annotationopts) |
|
92 ); |
|
93 |
|
94 lines.push(line); |
|
95 } |
|
96 }); |
|
97 var _annotationWidgets = _this.$.find(".Ldt-MultiSegments-Annotation") |
|
98 |
|
99 function checkVisibilities(_time) { |
|
100 if (!_this.show_all && currentLine && !currentLine.hasSegmentsNow()) { |
|
101 currentLine = undefined; |
|
102 } |
|
103 IriSP._(lines).each(function(line) { |
|
104 if (line.hasSegmentsNow()) { |
|
105 if (!_this.show_all && !currentLine) { |
|
106 currentLine = line; |
|
107 } |
|
108 if (_this.show_all || line === currentLine) { |
|
109 line.show(); |
|
110 } else { |
|
111 line.hide(); |
|
112 } |
|
113 } else { |
|
114 line.hide(); |
|
115 } |
|
116 }); |
|
117 } |
|
118 |
|
119 this.onMediaEvent("timeupdate", checkVisibilities); |
|
120 } |