2 |
2 |
3 Rkns.Ldt.ProjectBin = Rkns.Utils.inherit(Rkns._BaseBin); |
3 Rkns.Ldt.ProjectBin = Rkns.Utils.inherit(Rkns._BaseBin); |
4 |
4 |
5 Rkns.Ldt.ProjectBin.prototype.tagTemplate = Rkns._.template( |
5 Rkns.Ldt.ProjectBin.prototype.tagTemplate = Rkns._.template( |
6 '<li class="Rk-Bin-Item" data-image="img/ldt-tag.png" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/search/?search=<%=encodedtitle%>&field=all" data-title="<%-title%>" data-description="Tag \'<%-title%>\'">' |
6 '<li class="Rk-Bin-Item" data-image="img/ldt-tag.png" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/search/?search=<%=encodedtitle%>&field=all" data-title="<%-title%>" data-description="Tag \'<%-title%>\'">' |
7 + '<img class="Rk-Ldt-Tag-Icon" src="img/ldt-tag.png" /><h4><%-title%></h4><div class="Rk-Clear"></div></li>' |
7 + '<img class="Rk-Ldt-Tag-Icon" src="img/ldt-tag.png" /><h4><%=htitle%></h4><div class="Rk-Clear"></div></li>' |
8 ); |
8 ); |
9 |
9 |
10 Rkns.Ldt.ProjectBin.prototype.annotationTemplate = Rkns._.template( |
10 Rkns.Ldt.ProjectBin.prototype.annotationTemplate = Rkns._.template( |
11 '<li class="Rk-Bin-Item" data-image="<%=image%>" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/player/<%=mediaid%>/#id=<%=annotationid%>" data-title="<%-title%>" data-description="<%-description%>">' |
11 '<li class="Rk-Bin-Item" data-image="<%=image%>" data-uri="<%=ldt_platform%>ldtplatform/ldt/front/player/<%=mediaid%>/#id=<%=annotationid%>" data-title="<%-title%>" data-description="<%-description%>">' |
12 + '<img class="Rk-Ldt-Annotation-Icon" src="<%=image%>"/><h4><%-title%></h4><p><%-description%></p><p>Start: <%=start%>, End: <%=end%>, Duration: <%=duration%></p><div class="Rk-Clear"></div></li>' |
12 + '<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>' |
13 ); |
13 ); |
14 |
14 |
15 Rkns.Ldt.ProjectBin.prototype._init = function(_renkan, _opts) { |
15 Rkns.Ldt.ProjectBin.prototype._init = function(_renkan, _opts) { |
16 this.proj_id = _opts.project_id; |
16 this.proj_id = _opts.project_id; |
17 this.ldt_platform = _opts.ldt_platform || "http://ldt.iri.centrepompidou.fr/"; |
17 this.ldt_platform = _opts.ldt_platform || "http://ldt.iri.centrepompidou.fr/"; |
18 this.title_$.html(_opts.title); |
18 this.title_$.html(_opts.title); |
19 this.refresh(); |
19 this.refresh(); |
20 } |
20 } |
21 |
21 |
22 Rkns.Ldt.ProjectBin.prototype.refresh = function() { |
22 Rkns.Ldt.ProjectBin.prototype.render = function(searchstr) { |
23 var _this = this; |
23 if (searchstr) { |
|
24 var rxbase = searchstr.replace(/(\W)/g,'\\$1'), |
|
25 _rgxp = new RegExp('('+rxbase+')','gi'), |
|
26 rxtest = new RegExp(rxbase,'i') |
|
27 } |
|
28 function highlight(_text) { |
|
29 return searchstr ? _text.replace(_rgxp, "<span class='searchmatch'>$1</span>") : _text; |
|
30 } |
24 function convertTC(_ms) { |
31 function convertTC(_ms) { |
25 function pad(_n) { |
32 function pad(_n) { |
26 var _res = _n.toString(); |
33 var _res = _n.toString(); |
27 while (_res.length < 2) { |
34 while (_res.length < 2) { |
28 _res = '0' + _res; |
35 _res = '0' + _res; |
38 _res += pad(_hours) + ':' |
45 _res += pad(_hours) + ':' |
39 } |
46 } |
40 _res += pad(_minutes) + ':' + pad(_seconds); |
47 _res += pad(_minutes) + ':' + pad(_seconds); |
41 return _res; |
48 return _res; |
42 } |
49 } |
|
50 |
|
51 var _html = '<li><h3>Tags</h3></li>', |
|
52 _projtitle = this.data.meta["dc:title"], |
|
53 _this = this, |
|
54 count = 0; |
|
55 _this.title_$.text('LDT Project: "' + _projtitle + '"'); |
|
56 Rkns._(_this.data.tags).map(function(_tag) { |
|
57 var _title = _tag.meta["dc:title"]; |
|
58 if (searchstr && !rxtest.test(_title)) { |
|
59 return; |
|
60 } |
|
61 count++; |
|
62 _html += _this.tagTemplate({ |
|
63 ldt_platform: _this.ldt_platform, |
|
64 title: _title, |
|
65 htitle: highlight(_title), |
|
66 encodedtitle : encodeURIComponent(_title) |
|
67 }) |
|
68 }); |
|
69 _html += '<li><h3>Annotations</h3></li>'; |
|
70 Rkns._(_this.data.annotations).map(function(_annotation) { |
|
71 var _description = _annotation.content.description, |
|
72 _title = _annotation.content.title.replace(_description,""); |
|
73 if (searchstr && !rxtest.test(_title) && !rxtest.test(_description)) { |
|
74 return; |
|
75 } |
|
76 count++; |
|
77 var _duration = _annotation.end - _annotation.begin, |
|
78 _img = ( |
|
79 (_annotation.content && _annotation.content.img && _annotation.content.img.src) |
|
80 ? _annotation.content.img.src |
|
81 : ( _duration ? "img/ldt-segment.png" : "img/ldt-point.png" ) |
|
82 ); |
|
83 _html += _this.annotationTemplate({ |
|
84 ldt_platform: _this.ldt_platform, |
|
85 title: _title, |
|
86 htitle: highlight(_title), |
|
87 description: _description, |
|
88 hdescription: highlight(_description), |
|
89 start: convertTC(_annotation.begin), |
|
90 end: convertTC(_annotation.end), |
|
91 duration: convertTC(_duration), |
|
92 mediaid: _annotation.media, |
|
93 annotationid: _annotation.id, |
|
94 image: _img |
|
95 }); |
|
96 }); |
|
97 |
|
98 this.main_$.html(_html); |
|
99 if (searchstr && count) { |
|
100 this.count_$.text(count).show(); |
|
101 } else { |
|
102 this.count_$.hide(); |
|
103 } |
|
104 if (searchstr && !count) { |
|
105 this.$.hide(); |
|
106 } else { |
|
107 this.$.show(); |
|
108 } |
|
109 _renkan.resizeBins(); |
|
110 } |
|
111 |
|
112 Rkns.Ldt.ProjectBin.prototype.refresh = function() { |
|
113 var _this = this; |
43 Rkns.$.ajax({ |
114 Rkns.$.ajax({ |
44 url: this.ldt_platform + 'ldtplatform/ldt/cljson/id/' + this.proj_id, |
115 url: this.ldt_platform + 'ldtplatform/ldt/cljson/id/' + this.proj_id, |
45 dataType: "jsonp", |
116 dataType: "jsonp", |
46 success: function(_data) { |
117 success: function(_data) { |
47 var _html = '<li><h3>Tags</h3></li>', |
118 _this.data = _data; |
48 _projtitle = _data.meta["dc:title"]; |
119 _this.render(); |
49 _this.title_$.html('LDT Project: "' + _projtitle + '"'); |
|
50 _html += Rkns._(_data.tags).map(function(_tag) { |
|
51 var _title = _tag.meta["dc:title"] |
|
52 return _this.tagTemplate({ |
|
53 ldt_platform: _this.ldt_platform, |
|
54 title: _title, |
|
55 encodedtitle : encodeURIComponent(_title) |
|
56 }) |
|
57 }).join(""); |
|
58 _html += '<li><h3>Annotations</h3></li>'; |
|
59 _html += Rkns._(_data.annotations).map(function(_annotation) { |
|
60 var _description = _annotation.content.description, |
|
61 _title = _annotation.content.title.replace(_description,""), |
|
62 _duration = _annotation.end - _annotation.begin, |
|
63 _img = ( |
|
64 (_annotation.content && _annotation.content.img && _annotation.content.img.src) |
|
65 ? _annotation.content.img.src |
|
66 : ( _duration ? "img/ldt-segment.png" : "img/ldt-point.png" ) |
|
67 ); |
|
68 return _this.annotationTemplate({ |
|
69 ldt_platform: _this.ldt_platform, |
|
70 title: _title, |
|
71 description: _description, |
|
72 start: convertTC(_annotation.begin), |
|
73 end: convertTC(_annotation.end), |
|
74 duration: convertTC(_duration), |
|
75 mediaid: _annotation.media, |
|
76 annotationid: _annotation.id, |
|
77 image: _img |
|
78 }); |
|
79 }).join(""); |
|
80 |
|
81 _this.main_$.html(_html); |
|
82 _renkan.resizeBins(); |
|
83 } |
120 } |
84 }); |
121 }); |
85 } |
122 } |