| author | ymh <ymh.work@gmail.com> |
| Fri, 25 Oct 2013 01:20:25 +0200 | |
| changeset 211 | d87f6bdee43d |
| parent 196 | 2a2fcec209d0 |
| child 293 | fba23fde14ba |
| permissions | -rw-r--r-- |
| 195 | 1 |
(function(Rkns) { |
| 196 | 2 |
"use strict"; |
3 |
||
4 |
var _ = Rkns._; |
|
| 26 | 5 |
|
| 195 | 6 |
var Ldt = Rkns.Ldt = {}; |
7 |
||
8 |
var Bin = Ldt.Bin = function(_renkan, _opts) { |
|
| 160 | 9 |
if (_opts.ldt_type) { |
| 195 | 10 |
var resclass = Ldt[_opts.ldt_type+"Bin"]; |
| 160 | 11 |
if (resclass) { |
12 |
return new resclass(_renkan, _opts); |
|
13 |
} |
|
14 |
} |
|
15 |
console.error("No such LDT Bin Type"); |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
16 |
}; |
|
78
af9e716b01bc
Renkan bin configuration now with class names instead of classes themselves
veltr
parents:
68
diff
changeset
|
17 |
|
| 195 | 18 |
var ProjectBin = Ldt.ProjectBin = Rkns.Utils.inherit(Rkns._BaseBin); |
| 34 | 19 |
|
| 196 | 20 |
ProjectBin.prototype.tagTemplate = _.template( |
| 132 | 21 |
'<li class="Rk-Bin-Item" draggable="true" data-image="<%- Rkns.Utils.getFullURL(static_url+\'img/ldt-tag.png\') %>" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/search/?search=<%=encodedtitle%>&field=all" data-title="<%-title%>" data-description="Tag \'<%-title%>\'">' |
| 58 | 22 |
+ '<img class="Rk-Ldt-Tag-Icon" src="<%-static_url%>img/ldt-tag.png" /><h4><%=htitle%></h4><div class="Rk-Clear"></div></li>' |
| 26 | 23 |
); |
24 |
||
| 196 | 25 |
ProjectBin.prototype.annotationTemplate = _.template( |
| 132 | 26 |
'<li class="Rk-Bin-Item" draggable="true" data-image="<%- Rkns.Utils.getFullURL(image) %>" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/player/<%=mediaid%>/#id=<%=annotationid%>" data-title="<%-title%>" data-description="<%-description%>">' |
| 44 | 27 |
+ '<img class="Rk-Ldt-Annotation-Icon" src="<%=image%>"/><h4><%=htitle%></h4><p><%=hdescription%></p><p>Start: <%=start%>, End: <%=end%>, Duration: <%=duration%></p><div class="Rk-Clear"></div></li>' |
| 26 | 28 |
); |
29 |
||
| 195 | 30 |
ProjectBin.prototype._init = function(_renkan, _opts) { |
| 61 | 31 |
this.renkan = _renkan; |
| 26 | 32 |
this.proj_id = _opts.project_id; |
| 28 | 33 |
this.ldt_platform = _opts.ldt_platform || "http://ldt.iri.centrepompidou.fr/"; |
| 26 | 34 |
this.title_$.html(_opts.title); |
| 64 | 35 |
this.title_icon_$.addClass('Rk-Ldt-Title-Icon'); |
| 42 | 36 |
this.refresh(); |
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
37 |
}; |
| 42 | 38 |
|
| 196 | 39 |
ProjectBin.prototype.render = function(searchbase) { |
40 |
var search = searchbase || Rkns.Utils.regexpFromTextOrArray(); |
|
| 44 | 41 |
function highlight(_text) { |
| 196 | 42 |
var _e = _(_text).escape(); |
43 |
return search.isempty ? _e : search.replace(_e, "<span class='searchmatch'>$1</span>"); |
|
| 44 | 44 |
} |
| 26 | 45 |
function convertTC(_ms) { |
46 |
function pad(_n) { |
|
47 |
var _res = _n.toString(); |
|
48 |
while (_res.length < 2) { |
|
49 |
_res = '0' + _res; |
|
50 |
} |
|
51 |
return _res; |
|
52 |
} |
|
53 |
var _totalSeconds = Math.abs(Math.floor(_ms/1000)), |
|
54 |
_hours = Math.floor(_totalSeconds / 3600), |
|
55 |
_minutes = (Math.floor(_totalSeconds / 60) % 60), |
|
56 |
_seconds = _totalSeconds % 60, |
|
57 |
_res = ''; |
|
58 |
if (_hours) { |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
59 |
_res += pad(_hours) + ':'; |
| 26 | 60 |
} |
61 |
_res += pad(_minutes) + ':' + pad(_seconds); |
|
62 |
return _res; |
|
63 |
} |
|
| 44 | 64 |
|
65 |
var _html = '<li><h3>Tags</h3></li>', |
|
66 |
_projtitle = this.data.meta["dc:title"], |
|
67 |
_this = this, |
|
68 |
count = 0; |
|
69 |
_this.title_$.text('LDT Project: "' + _projtitle + '"'); |
|
| 196 | 70 |
_(_this.data.tags).map(function(_tag) { |
| 44 | 71 |
var _title = _tag.meta["dc:title"]; |
| 196 | 72 |
if (!search.isempty && !search.test(_title)) { |
| 44 | 73 |
return; |
74 |
} |
|
75 |
count++; |
|
76 |
_html += _this.tagTemplate({ |
|
77 |
ldt_platform: _this.ldt_platform, |
|
78 |
title: _title, |
|
79 |
htitle: highlight(_title), |
|
| 58 | 80 |
encodedtitle : encodeURIComponent(_title), |
|
114
110f99eb417e
moved options to defaults.js and improved read-only switching
veltr
parents:
113
diff
changeset
|
81 |
static_url: _this.renkan.options.static_url |
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
82 |
}); |
| 44 | 83 |
}); |
84 |
_html += '<li><h3>Annotations</h3></li>'; |
|
| 196 | 85 |
_(_this.data.annotations).map(function(_annotation) { |
| 44 | 86 |
var _description = _annotation.content.description, |
87 |
_title = _annotation.content.title.replace(_description,""); |
|
| 196 | 88 |
if (!search.isempty && !search.test(_title) && !search.test(_description)) { |
| 44 | 89 |
return; |
90 |
} |
|
91 |
count++; |
|
92 |
var _duration = _annotation.end - _annotation.begin, |
|
93 |
_img = ( |
|
94 |
(_annotation.content && _annotation.content.img && _annotation.content.img.src) |
|
95 |
? _annotation.content.img.src |
|
|
114
110f99eb417e
moved options to defaults.js and improved read-only switching
veltr
parents:
113
diff
changeset
|
96 |
: ( _duration ? _this.renkan.options.static_url+"img/ldt-segment.png" : _this.renkan.options.static_url+"img/ldt-point.png" ) |
| 44 | 97 |
); |
98 |
_html += _this.annotationTemplate({ |
|
99 |
ldt_platform: _this.ldt_platform, |
|
100 |
title: _title, |
|
101 |
htitle: highlight(_title), |
|
102 |
description: _description, |
|
103 |
hdescription: highlight(_description), |
|
104 |
start: convertTC(_annotation.begin), |
|
105 |
end: convertTC(_annotation.end), |
|
106 |
duration: convertTC(_duration), |
|
107 |
mediaid: _annotation.media, |
|
108 |
annotationid: _annotation.id, |
|
| 58 | 109 |
image: _img, |
|
114
110f99eb417e
moved options to defaults.js and improved read-only switching
veltr
parents:
113
diff
changeset
|
110 |
static_url: _this.renkan.options.static_url |
| 44 | 111 |
}); |
112 |
}); |
|
113 |
|
|
114 |
this.main_$.html(_html); |
|
| 196 | 115 |
if (!search.isempty && count) { |
| 44 | 116 |
this.count_$.text(count).show(); |
117 |
} else { |
|
118 |
this.count_$.hide(); |
|
119 |
} |
|
| 196 | 120 |
if (!search.isempty && !count) { |
| 44 | 121 |
this.$.hide(); |
122 |
} else { |
|
123 |
this.$.show(); |
|
124 |
} |
|
| 61 | 125 |
this.renkan.resizeBins(); |
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
126 |
}; |
| 44 | 127 |
|
| 195 | 128 |
ProjectBin.prototype.refresh = function() { |
| 44 | 129 |
var _this = this; |
| 42 | 130 |
Rkns.$.ajax({ |
131 |
url: this.ldt_platform + 'ldtplatform/ldt/cljson/id/' + this.proj_id, |
|
132 |
dataType: "jsonp", |
|
133 |
success: function(_data) { |
|
| 44 | 134 |
_this.data = _data; |
135 |
_this.render(); |
|
| 26 | 136 |
} |
| 42 | 137 |
}); |
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
138 |
}; |
| 64 | 139 |
|
| 195 | 140 |
var Search = Ldt.Search = function(_renkan, _opts) { |
| 64 | 141 |
this.renkan = _renkan; |
142 |
this.lang = _opts.lang || "en"; |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
143 |
}; |
| 64 | 144 |
|
| 195 | 145 |
Search.prototype.getBgClass = function() { |
| 64 | 146 |
return "Rk-Ldt-Icon"; |
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
147 |
}; |
| 64 | 148 |
|
| 195 | 149 |
Search.prototype.getSearchTitle = function() { |
| 66 | 150 |
return this.renkan.translate("Lignes de Temps"); |
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
151 |
}; |
| 64 | 152 |
|
| 195 | 153 |
Search.prototype.search = function(_q) { |
| 64 | 154 |
this.renkan.tabs.push( |
| 195 | 155 |
new ResultsBin(this.renkan, { |
| 64 | 156 |
search: _q |
157 |
}) |
|
158 |
); |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
159 |
}; |
| 64 | 160 |
|
| 195 | 161 |
var ResultsBin = Ldt.ResultsBin = Rkns.Utils.inherit(Rkns._BaseBin); |
| 64 | 162 |
|
| 196 | 163 |
ResultsBin.prototype.segmentTemplate = _.template( |
| 132 | 164 |
'<li class="Rk-Bin-Item" draggable="true" data-image="<%- Rkns.Utils.getFullURL(image) %>" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/player/<%=mediaid%>/#id=<%=annotationid%>" data-title="<%-title%>" data-description="<%-description%>">' |
| 64 | 165 |
+ '<img class="Rk-Ldt-Annotation-Icon" src="<%=image%>"/><h4><%=htitle%></h4><p><%=hdescription%></p><p>Start: <%=start%>, End: <%=end%>, Duration: <%=duration%></p><div class="Rk-Clear"></div></li>' |
166 |
); |
|
167 |
||
| 195 | 168 |
ResultsBin.prototype._init = function(_renkan, _opts) { |
| 64 | 169 |
this.renkan = _renkan; |
170 |
this.ldt_platform = _opts.ldt_platform || "http://ldt.iri.centrepompidou.fr/"; |
|
171 |
this.max_results = _opts.max_results || 50; |
|
172 |
this.search = _opts.search; |
|
173 |
this.title_$.html('Lignes de Temps: "' + _opts.search + '"'); |
|
174 |
this.title_icon_$.addClass('Rk-Ldt-Title-Icon'); |
|
175 |
this.refresh(); |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
176 |
}; |
| 64 | 177 |
|
| 196 | 178 |
ResultsBin.prototype.render = function(searchbase) { |
179 |
if (!this.data) { |
|
180 |
return; |
|
| 64 | 181 |
} |
| 196 | 182 |
var search = searchbase || Rkns.Utils.regexpFromTextOrArray(); |
183 |
var highlightrx = (search.isempty ? Rkns.Utils.regexpFromTextOrArray(this.search) : search); |
|
| 64 | 184 |
function highlight(_text) { |
| 196 | 185 |
return highlightrx.replace(_(_text).escape(), "<span class='searchmatch'>$1</span>"); |
| 64 | 186 |
} |
187 |
function convertTC(_ms) { |
|
188 |
function pad(_n) { |
|
189 |
var _res = _n.toString(); |
|
190 |
while (_res.length < 2) { |
|
191 |
_res = '0' + _res; |
|
192 |
} |
|
193 |
return _res; |
|
194 |
} |
|
195 |
var _totalSeconds = Math.abs(Math.floor(_ms/1000)), |
|
196 |
_hours = Math.floor(_totalSeconds / 3600), |
|
197 |
_minutes = (Math.floor(_totalSeconds / 60) % 60), |
|
198 |
_seconds = _totalSeconds % 60, |
|
199 |
_res = ''; |
|
200 |
if (_hours) { |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
201 |
_res += pad(_hours) + ':'; |
| 64 | 202 |
} |
203 |
_res += pad(_minutes) + ':' + pad(_seconds); |
|
204 |
return _res; |
|
205 |
} |
|
206 |
|
|
207 |
var _html = '', |
|
208 |
_this = this, |
|
209 |
count = 0; |
|
| 196 | 210 |
_(this.data.objects).each(function(_segment) { |
|
211
d87f6bdee43d
upgrade libs + add no minified versions of libs + improve build + allow disabling zoom on scroll
ymh <ymh.work@gmail.com>
parents:
196
diff
changeset
|
211 |
var _description = _segment['abstract'], |
| 64 | 212 |
_title = _segment.title; |
| 196 | 213 |
if (!search.isempty && !search.test(_title) && !search.test(_description)) { |
| 64 | 214 |
return; |
215 |
} |
|
216 |
count++; |
|
217 |
var _duration = _segment.duration, |
|
218 |
_begin = _segment.start_ts, |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
219 |
_end = + _segment.duration + _begin, |
| 64 | 220 |
_img = ( |
221 |
_duration |
|
|
114
110f99eb417e
moved options to defaults.js and improved read-only switching
veltr
parents:
113
diff
changeset
|
222 |
? _this.renkan.options.static_url + "img/ldt-segment.png" |
|
110f99eb417e
moved options to defaults.js and improved read-only switching
veltr
parents:
113
diff
changeset
|
223 |
: _this.renkan.options.static_url + "img/ldt-point.png" |
| 64 | 224 |
); |
225 |
_html += _this.segmentTemplate({ |
|
226 |
ldt_platform: _this.ldt_platform, |
|
227 |
title: _title, |
|
228 |
htitle: highlight(_title), |
|
229 |
description: _description, |
|
230 |
hdescription: highlight(_description), |
|
231 |
start: convertTC(_begin), |
|
232 |
end: convertTC(_end), |
|
233 |
duration: convertTC(_duration), |
|
234 |
mediaid: _segment.iri_id, |
|
| 68 | 235 |
//projectid: _segment.project_id, |
236 |
//cuttingid: _segment.cutting_id, |
|
| 64 | 237 |
annotationid: _segment.element_id, |
238 |
image: _img |
|
239 |
}); |
|
240 |
}); |
|
241 |
|
|
242 |
this.main_$.html(_html); |
|
| 196 | 243 |
if (!search.isempty && count) { |
| 64 | 244 |
this.count_$.text(count).show(); |
245 |
} else { |
|
246 |
this.count_$.hide(); |
|
247 |
} |
|
| 196 | 248 |
if (!search.isempty && !count) { |
| 64 | 249 |
this.$.hide(); |
250 |
} else { |
|
251 |
this.$.show(); |
|
252 |
} |
|
253 |
this.renkan.resizeBins(); |
|
|
170
603ffa4c6fa5
correct ";" and "," in javascripts
ymh <ymh.work@gmail.com>
parents:
160
diff
changeset
|
254 |
}; |
| 64 | 255 |
|
| 195 | 256 |
ResultsBin.prototype.refresh = function() { |
| 64 | 257 |
var _this = this; |
258 |
Rkns.$.ajax({ |
|
259 |
url: this.ldt_platform + 'ldtplatform/api/ldt/1.0/segments/search/', |
|
260 |
data: { |
|
261 |
format: "jsonp", |
|
262 |
q: this.search, |
|
263 |
limit: this.max_results |
|
264 |
}, |
|
265 |
dataType: "jsonp", |
|
266 |
success: function(_data) { |
|
267 |
_this.data = _data; |
|
268 |
_this.render(); |
|
269 |
} |
|
270 |
}); |
|
| 195 | 271 |
}; |
272 |
||
273 |
})(window.Rkns); |