41 + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>' |
42 + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>' |
42 + '</div></div></div></div>'; |
43 + '</div></div></div></div>'; |
43 |
44 |
44 IriSP.Widgets.Annotation.prototype.defaults = { |
45 IriSP.Widgets.Annotation.prototype.defaults = { |
45 annotation_type : "chap", |
46 annotation_type : "chap", |
46 start_minimized: true, |
47 start_minimized: false, |
47 show_top_border : false, |
48 show_arrow : true, |
48 site_name : "Lignes de Temps", |
49 site_name : "Lignes de Temps", |
49 search_on_tag_click: true |
50 search_on_tag_click: true |
50 } |
51 } |
51 |
52 |
52 IriSP.Widgets.Annotation.prototype.draw = function() { |
53 IriSP.Widgets.Annotation.prototype.draw = function() { |
|
54 |
|
55 var _this = this; |
|
56 |
|
57 function timeupdate(_time) { |
|
58 var _list = _this.getWidgetAnnotationsAtTime(); |
|
59 if (!_list.length) { |
|
60 _this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty"); |
|
61 if (_this.arrow) { |
|
62 _this.arrow.moveToTime(_time); |
|
63 } |
|
64 _this.bounds = [ _time, _time ]; |
|
65 _this.sendBounds(); |
|
66 } |
|
67 } |
|
68 |
|
69 function drawAnnotation(_annotation) { |
|
70 var _url = (typeof _annotation.url !== "undefined" |
|
71 ? _annotation.url |
|
72 : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id)), |
|
73 _text = _this.l10n.watching + _annotation.title + (_this.site_name ? _this.l10n.on_site + _this.site_name : ''), |
|
74 _tags = _annotation.getTags(), |
|
75 _tagblock = _this.$.find(".Ldt-Annotation-Tags"); |
|
76 if (_tags.length) { |
|
77 _this.$.find(".Ldt-Annotation-Tags-Block").removeClass("Ldt-Annotation-EmptyBlock"); |
|
78 _tags.forEach(function(_tag) { |
|
79 var _trimmedTitle = _tag.title.replace(/(^\s+|\s+$)/g,''); |
|
80 if (_trimmedTitle) { |
|
81 var _el = IriSP.jQuery('<li class="Ldt-Annotation-TagLabel"></li>').append(IriSP.jQuery('<span>').text(_trimmedTitle)); |
|
82 _el.click(function() { |
|
83 if (_this.search_on_tag_click) { |
|
84 _this.player.trigger("search.triggeredSearch",_trimmedTitle); |
|
85 } |
|
86 _tag.trigger("click"); |
|
87 }); |
|
88 _tagblock.append(_el); |
|
89 } |
|
90 }); |
|
91 } else { |
|
92 _this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock"); |
|
93 } |
|
94 _this.$.find(".Ldt-Annotation-Title").html(_annotation.title); |
|
95 var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,''); |
|
96 if (_desc) { |
|
97 _this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock"); |
|
98 _this.$.find(".Ldt-Annotation-Description").html(_desc); |
|
99 } else { |
|
100 _this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock"); |
|
101 } |
|
102 _this.$.find(".Ldt-Annotation-Begin").html(_annotation.begin.toString()); |
|
103 _this.$.find(".Ldt-Annotation-End").html(_annotation.end.toString()); |
|
104 if (_annotation.elementType === "mashedAnnotation") { |
|
105 _this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup"); |
|
106 _this.$.find(".Ldt-Annotation-MashupMedia").html(_annotation.getMedia().title); |
|
107 _this.$.find(".Ldt-Annotation-MashupBegin").html(_annotation.annotation.begin.toString()); |
|
108 _this.$.find(".Ldt-Annotation-MashupEnd").html(_annotation.annotation.end.toString()); |
|
109 } else { |
|
110 _this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup"); |
|
111 } |
|
112 if (typeof _this.socialWidget !== "undefined") { |
|
113 _this.socialWidget.updateUrls(_url, _text); |
|
114 } else { |
|
115 setTimeout(function() { |
|
116 if (typeof _this.socialWidget !== "undefined") { |
|
117 _this.socialWidget.updateUrls(_url, _text); |
|
118 } |
|
119 },800); |
|
120 } |
|
121 _this.$.find(".Ldt-Annotation-Inner").removeClass("Ldt-Annotation-Empty"); |
|
122 _this.bounds = [ _annotation.begin, _annotation.end ]; |
|
123 if (_this.arrow) { |
|
124 _this.arrow.moveToTime((_annotation.begin + _annotation.end)/2); |
|
125 } |
|
126 _this.sendBounds(); |
|
127 } |
|
128 |
53 this.renderTemplate(); |
129 this.renderTemplate(); |
54 this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget"); |
130 this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget"); |
55 this.onMediaEvent("timeupdate","onTimeupdate"); |
131 this.insertSubwidget(this.$.find(".Ldt-Annotation-Arrow"), { type: "Arrow" }, "arrow"); |
|
132 this.onMediaEvent("timeupdate",timeupdate); |
56 this.onMdpEvent("Annotation.hide","hide"); |
133 this.onMdpEvent("Annotation.hide","hide"); |
57 this.onMdpEvent("Annotation.show","show"); |
134 this.onMdpEvent("Annotation.show","show"); |
58 this.onMdpEvent("Annotation.minimize","minimize"); |
135 this.onMdpEvent("Annotation.minimize","minimize"); |
59 this.onMdpEvent("Annotation.maximize","maximize"); |
136 this.onMdpEvent("Annotation.maximize","maximize"); |
60 this.onMdpEvent("Annotation.getBounds","sendBounds"); |
137 this.onMdpEvent("Annotation.getBounds","sendBounds"); |
61 this.$.find(".Ldt-Annotation-MaxMinButton").click(this.functionWrapper("toggleSize")); |
138 this.$.find(".Ldt-Annotation-MaxMinButton").click(this.functionWrapper("toggleSize")); |
62 this.onTimeupdate(); |
139 this.getWidgetAnnotations().forEach(function(_a) { |
63 } |
140 _a.on("enter", function() { |
64 |
141 drawAnnotation(_a) |
65 IriSP.Widgets.Annotation.prototype.onTimeupdate = function(_time) { |
142 }); |
66 var _list = this.getWidgetAnnotationsAtTime(); |
143 }); |
67 if (_list.length) { |
|
68 if (_list[0].id !== this.lastAnnotation) { |
|
69 this.drawAnnotation(_list[0]); |
|
70 this.bounds = [ _list[0].begin.valueOf(), _list[0].end.valueOf() ]; |
|
71 } |
|
72 this.player.trigger("Arrow.updatePosition",{widget: this.type, time: ( _list[0].begin + _list[0].end ) / 2}); |
|
73 } |
|
74 else { |
|
75 this.lastAnnotation = false; |
|
76 this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty"); |
|
77 this.player.trigger("Arrow.updatePosition",{widget: this.type, time: _time}); |
|
78 this.bounds = [ _time, _time ]; |
|
79 } |
|
80 this.sendBounds(); |
|
81 } |
144 } |
82 |
145 |
83 IriSP.Widgets.Annotation.prototype.sendBounds = function() { |
146 IriSP.Widgets.Annotation.prototype.sendBounds = function() { |
84 this.player.trigger("Annotation.boundsChanged",this.bounds); |
147 this.player.trigger("Annotation.boundsChanged",this.bounds); |
85 } |
148 } |
86 |
149 |
87 IriSP.Widgets.Annotation.prototype.drawAnnotation = function(_annotation) { |
150 IriSP.Widgets.Annotation.prototype.drawAnnotation = function(_annotation) { |
88 this.lastAnnotation = _annotation.id; |
151 this.lastAnnotation = _annotation.id; |
89 var _url = (typeof _annotation.url !== "undefined" |
152 |
90 ? _annotation.url |
|
91 : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id)), |
|
92 _text = this.l10n.watching + _annotation.title + (this.site_name ? this.l10n.on_site + this.site_name : ''), |
|
93 _tags = _annotation.getTags(), |
|
94 _tagblock = this.$.find(".Ldt-Annotation-Tags"), |
|
95 _this = this; |
|
96 _tagblock.empty(); |
|
97 if (_tags.length) { |
|
98 this.$.find(".Ldt-Annotation-Tags-Block").removeClass("Ldt-Annotation-EmptyBlock"); |
|
99 _tags.forEach(function(_tag) { |
|
100 var _trimmedTitle = _tag.title.replace(/(^\s+|\s+$)/g,''); |
|
101 if (_trimmedTitle) { |
|
102 var _el = IriSP.jQuery('<li class="Ldt-Annotation-TagLabel"></li>').append(IriSP.jQuery('<span>').text(_trimmedTitle)); |
|
103 _el.click(function() { |
|
104 if (_this.search_on_tag_click) { |
|
105 _this.player.trigger("search.triggeredSearch",_trimmedTitle); |
|
106 } |
|
107 _tag.trigger("click"); |
|
108 }); |
|
109 _tagblock.append(_el); |
|
110 } |
|
111 }); |
|
112 } else { |
|
113 this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock"); |
|
114 } |
|
115 this.$.find(".Ldt-Annotation-Title").html(_annotation.title); |
|
116 var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,''); |
|
117 if (_desc) { |
|
118 this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock"); |
|
119 this.$.find(".Ldt-Annotation-Description").html(_desc); |
|
120 } else { |
|
121 this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock"); |
|
122 } |
|
123 this.$.find(".Ldt-Annotation-Begin").html(_annotation.begin.toString()); |
|
124 this.$.find(".Ldt-Annotation-End").html(_annotation.end.toString()); |
|
125 if (_annotation.elementType === "mashedAnnotation") { |
|
126 this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup"); |
|
127 this.$.find(".Ldt-Annotation-MashupMedia").html(_annotation.getMedia().title); |
|
128 this.$.find(".Ldt-Annotation-MashupBegin").html(_annotation.annotation.begin.toString()); |
|
129 this.$.find(".Ldt-Annotation-MashupEnd").html(_annotation.annotation.end.toString()); |
|
130 } else { |
|
131 this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup"); |
|
132 } |
|
133 if (typeof this.socialWidget !== "undefined") { |
|
134 this.socialWidget.updateUrls(_url, _text); |
|
135 } else { |
|
136 setTimeout(function() { |
|
137 if (typeof _this.socialWidget !== "undefined") { |
|
138 _this.socialWidget.updateUrls(_url, _text); |
|
139 } |
|
140 },800); |
|
141 } |
|
142 this.$.find(".Ldt-Annotation-Inner").removeClass("Ldt-Annotation-Empty"); |
|
143 } |
153 } |
144 |
154 |
145 IriSP.Widgets.Annotation.prototype.hide = function() { |
155 IriSP.Widgets.Annotation.prototype.hide = function() { |
146 this.$.slideUp(); |
156 this.$.slideUp(); |
147 } |
157 } |