13 project_id: false, |
13 project_id: false, |
14 api_serializer: "ldt_annotate", |
14 api_serializer: "ldt_annotate", |
15 api_method: "PUT", |
15 api_method: "PUT", |
16 api_endpoint_template: "", |
16 api_endpoint_template: "", |
17 new_tag_button: true, |
17 new_tag_button: true, |
|
18 show_headers: false, |
18 }; |
19 }; |
19 |
20 |
20 IriSP.Widgets.CurrentSegmentInfobox.prototype.template = |
21 IriSP.Widgets.CurrentSegmentInfobox.prototype.template = |
21 '<div class="Ldt-CurrentSegmentInfobox">' |
22 '<div class="Ldt-CurrentSegmentInfobox">' |
22 + '{{#editable_segments}}<div class="Ldt-CurrentSegmentInfobox-EditButton">{{edit}}</div>{{/editable_segments}}' |
23 + '{{#editable_segments}}<div class="Ldt-CurrentSegmentInfobox-EditButton">{{edit}}</div>{{/editable_segments}}' |
37 + '</div>' |
38 + '</div>' |
38 + '</div>' |
39 + '</div>' |
39 |
40 |
40 IriSP.Widgets.CurrentSegmentInfobox.prototype.editTemplate = |
41 IriSP.Widgets.CurrentSegmentInfobox.prototype.editTemplate = |
41 '<div class="Ldt-CurrentSegmentInfobox">' |
42 '<div class="Ldt-CurrentSegmentInfobox">' |
|
43 + '{{#headers}}<div class="Ldt-CurrentSegmentInfobox-FieldsHeader">{{fields_header}}</div>{{/headers}}' |
42 + '<input type="text" class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-TitleInput Ldt-CurrentSegmentInfobox-Title" value="{{title}}"></input>' |
44 + '<input type="text" class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-TitleInput Ldt-CurrentSegmentInfobox-Title" value="{{title}}"></input>' |
43 + '<div class="Ldt-CurrentSegmentInfobox-CancelButton">{{cancel}}</div>' |
45 + '<div class="Ldt-CurrentSegmentInfobox-CancelButton">{{cancel}}</div>' |
44 + '<div class="Ldt-CurrentSegmentInfobox-SubmitButton">{{submit}}</div>' |
46 + '<div class="Ldt-CurrentSegmentInfobox-SubmitButton">{{submit}}</div>' |
45 + '<textarea class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-DescriptionInput Ldt-CurrentSegmentInfobox-Description">{{description}}</textarea>' |
47 + '<textarea class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-DescriptionInput Ldt-CurrentSegmentInfobox-Description">{{description}}</textarea>' |
46 + '<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Tags">' |
48 + '<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Tags">' |
|
49 + '{{#headers}}<div class="Ldt-CurrentSegmentInfobox-TagsHeader">{{tags_header}}</div>{{/headers}}' |
47 + '{{#new_tag_button}}' |
50 + '{{#new_tag_button}}' |
48 + '<div class="Ldt-CurrentSegmentInfobox-CreateTagButton">{{new_tag}}</div>' |
51 + '<div class="Ldt-CurrentSegmentInfobox-CreateTagButton">{{new_tag}}</div>' |
49 + '{{/new_tag_button}}' |
52 + '{{/new_tag_button}}' |
50 + '{{^new_tag_button}}' |
53 + '{{^new_tag_button}}' |
51 + '<input class="Ldt-CurrentSegmentInfobox-CreateTagInput" placeholder="{{new_tag}}"></input>' |
54 + '<input class="Ldt-CurrentSegmentInfobox-CreateTagInput" placeholder="{{new_tag}}"></input>' |
|
55 + '<div class="Ldt-CurrentSegmentInfobox-CreateTagInput-Add">+</div>' |
52 + '{{/new_tag_button}}' |
56 + '{{/new_tag_button}}' |
53 + '{{#tags.length}}' |
57 + '{{#tags.length}}' |
54 + '<ul class="Ldt-CurrentSegmentInfobox-Tags-Ul">' |
58 + '<ul class="Ldt-CurrentSegmentInfobox-Tags-Ul">' |
55 + '{{#tags}}' |
59 + '{{#tags}}' |
56 + '{{#.}}' |
60 + '{{#.}}' |
70 submit : "Soumettre", |
74 submit : "Soumettre", |
71 cancel : "Annuler", |
75 cancel : "Annuler", |
72 edit : "Editer", |
76 edit : "Editer", |
73 new_tag : "Nouveau tag", |
77 new_tag : "Nouveau tag", |
74 delete_tag : "Supprimer", |
78 delete_tag : "Supprimer", |
|
79 fields_header : "Contenu du segment courant", |
|
80 tags_header : "Mots-clés du segment courant", |
75 empty : "Le player vidéo ne lit actuellement aucun segment" |
81 empty : "Le player vidéo ne lit actuellement aucun segment" |
76 }, |
82 }, |
77 en: { |
83 en: { |
78 submit : "Submit", |
84 submit : "Submit", |
79 cancel : "Cancel", |
85 cancel : "Cancel", |
80 edit : "Edit", |
86 edit : "Edit", |
81 new_tag : "New tag", |
87 new_tag : "New tag", |
82 delete_tag : "Delete tag", |
88 delete_tag : "Delete tag", |
|
89 fields_header : "Current segment content", |
|
90 tags_header : "Current segment tags", |
83 empty : "The player currently doesn't read any segment" |
91 empty : "The player currently doesn't read any segment" |
84 } |
92 } |
85 } |
93 } |
86 |
94 |
87 IriSP.Widgets.CurrentSegmentInfobox.prototype.draw = function() { |
95 IriSP.Widgets.CurrentSegmentInfobox.prototype.draw = function() { |
129 title: this.currentSegment.title, |
137 title: this.currentSegment.title, |
130 description : this.currentSegment.description, |
138 description : this.currentSegment.description, |
131 tags : this.currentSegment.getTagTexts(), |
139 tags : this.currentSegment.getTagTexts(), |
132 submit : this.l10n.submit, |
140 submit : this.l10n.submit, |
133 cancel : this.l10n.cancel, |
141 cancel : this.l10n.cancel, |
|
142 headers : this.show_headers, |
|
143 tags_header : this.custom_tags_header ? this.custom_tags_header : this.l10n.tags_header, |
|
144 fields_header : this.custom_fields_header ? this.custom_fields_header : this.l10n.fields_header, |
134 new_tag : this.l10n.new_tag, |
145 new_tag : this.l10n.new_tag, |
135 delete_tag : this.l10n.delete_tag, |
146 delete_tag : this.l10n.delete_tag, |
136 new_tag_button : this.new_tag_button, |
147 new_tag_button : this.new_tag_button, |
137 } |
148 } |
138 this.$.toggleClass("editing", true); |
149 this.$.toggleClass("editing", true); |
139 this.$.html(Mustache.to_html(this.editTemplate, _data)); |
150 this.$.html(Mustache.to_html(this.editTemplate, _data)); |
140 this.$.find(".Ldt-CurrentSegmentInfobox-CancelButton").click(this.functionWrapper("disableEditMode")); |
151 this.$.find(".Ldt-CurrentSegmentInfobox-CancelButton").click(this.functionWrapper("disableEditMode")); |
141 if (this.new_tag_button){ |
152 if (this.new_tag_button){ |
142 this.$.find(".Ldt-CurrentSegmentInfobox-CreateTagButton").click(this.functionWrapper("insertTagInput")); |
153 this.$.find(".Ldt-CurrentSegmentInfobox-CreateTagButton").click(this.functionWrapper("insertTagInput")); |
143 } else { |
154 } else { |
144 this.$.find(".Ldt-CurrentSegmentInfobox-CreateTagInput").keypress(this.functionWrapper("insertTagInputKeypress")); |
155 this.$.find(".Ldt-CurrentSegmentInfobox-CreateTagInput").keypress(this.functionWrapper("insertTagInputKeypress")); |
|
156 this.$.find(".Ldt-CurrentSegmentInfobox-CreateTagInput-Add").click(this.functionWrapper("insertTagInputKeypress")); |
145 } |
157 } |
146 this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Li-DeleteTagButton").click(this.functionWrapper("deleteTagInput")); |
158 this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Li-DeleteTagButton").click(this.functionWrapper("deleteTagInput")); |
147 this.$.find(".Ldt-CurrentSegmentInfobox-SubmitButton").click(this.functionWrapper("onSubmit")) |
159 this.$.find(".Ldt-CurrentSegmentInfobox-SubmitButton").click(this.functionWrapper("onSubmit")) |
148 } |
160 } |
149 } |
161 } |
175 this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Li-DeleteTagButton").click(this.functionWrapper("deleteTagInput")); |
187 this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Li-DeleteTagButton").click(this.functionWrapper("deleteTagInput")); |
176 } |
188 } |
177 |
189 |
178 IriSP.Widgets.CurrentSegmentInfobox.prototype.insertTagInputKeypress = function(event) { |
190 IriSP.Widgets.CurrentSegmentInfobox.prototype.insertTagInputKeypress = function(event) { |
179 var keycode = (event.keyCode ? event.keyCode : event.which); |
191 var keycode = (event.keyCode ? event.keyCode : event.which); |
180 if(keycode == '13'){ |
192 if(keycode == '13' || event.type == 'click'){ |
181 if((!this.currentSegment.getTagTexts().length)&&(!this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Ul").length)){ |
193 if((!this.currentSegment.getTagTexts().length)&&(!this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Ul").length)){ |
182 this.$.find(".Ldt-CurrentSegmentInfobox-Tags").prepend('<ul class="Ldt-CurrentSegmentInfobox-Tags-Ul"></ul>') |
194 this.$.find(".Ldt-CurrentSegmentInfobox-Tags").prepend('<ul class="Ldt-CurrentSegmentInfobox-Tags-Ul"></ul>') |
183 } |
195 } |
184 this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Ul").append( |
196 this.$.find(".Ldt-CurrentSegmentInfobox-Tags-Ul").append( |
185 '<li class="Ldt-CurrentSegmentInfobox-Tags-Li">' |
197 '<li class="Ldt-CurrentSegmentInfobox-Tags-Li">' |