src/widgets/CurrentSegmentInfobox.js
changeset 1069 2409cb4cebaf
parent 1067 539c9bee5372
child 1072 ac1eacb3aa33
--- a/src/widgets/CurrentSegmentInfobox.js	Fri Oct 02 11:27:17 2015 +0200
+++ b/src/widgets/CurrentSegmentInfobox.js	Mon Dec 28 15:50:04 2015 +0100
@@ -16,13 +16,17 @@
     api_endpoint_template: "",
     new_tag_button: true,
     show_headers: false,
+    custom_edit_text: false,
+    empty_description_placeholder: false,
 };
 
 IriSP.Widgets.CurrentSegmentInfobox.prototype.template = 
       '<div class="Ldt-CurrentSegmentInfobox">'
+    +   '<div class="Ldt-CurrentSegmentInfobox-SelectedSegment">'
     +     '{{#editable_segments}}<div class="Ldt-CurrentSegmentInfobox-EditButton">{{edit}}</div>{{/editable_segments}}'
     +     '<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Title">{{title}}</div>'
     +     '<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Description">{{description}}</div>' 
+    +     '{{^description}}{{^tags.length}}{{#description_placeholder}}<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Description-placeholder">{{description_placeholder}}</div>{{/description_placeholder}}{{/tags.length}}{{/description}}' 
     +     '<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Tags">'
     +         '{{#tags.length}}'
     +         '<ul class="Ldt-CurrentSegmentInfobox-Tags-Ul">'
@@ -36,14 +40,14 @@
     +         '</ul>'
     +         '{{/tags.length}}'
     +     '</div>'
+    +   '</div>'
     + '</div>'
 
 IriSP.Widgets.CurrentSegmentInfobox.prototype.editTemplate = 
       '<div class="Ldt-CurrentSegmentInfobox">'
+    +   '<div class="Ldt-CurrentSegmentInfobox-SelectedSegment">'
     +     '{{#headers}}<div class="Ldt-CurrentSegmentInfobox-FieldsHeader">{{fields_header}}</div>{{/headers}}'
     +     '<input type="text" class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-TitleInput Ldt-CurrentSegmentInfobox-Title" value="{{title}}"></input>'   
-    +     '<div class="Ldt-CurrentSegmentInfobox-CancelButton">{{cancel}}</div>'
-    +     '<div class="Ldt-CurrentSegmentInfobox-SubmitButton">{{submit}}</div>'
     +     '<textarea class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-DescriptionInput Ldt-CurrentSegmentInfobox-Description">{{description}}</textarea>'
     +     '<div class="Ldt-CurrentSegmentInfobox-Element Ldt-CurrentSegmentInfobox-Tags">'
     +         '{{#headers}}<div class="Ldt-CurrentSegmentInfobox-TagsHeader">{{tags_header}}</div>{{/headers}}'
@@ -54,7 +58,6 @@
     +         '<input class="Ldt-CurrentSegmentInfobox-CreateTagInput" placeholder="{{new_tag}}"></input>'
     +         '<div class="Ldt-CurrentSegmentInfobox-CreateTagInput-Add">+</div>'
     +     '{{/new_tag_button}}'
-    +         '{{#tags.length}}'
     +         '<ul class="Ldt-CurrentSegmentInfobox-Tags-Ul">'
     +         '{{#tags}}'
     +             '{{#.}}'
@@ -65,8 +68,10 @@
     +             '{{/.}}'
     +         '{{/tags}}'
     +         '</ul>'
-    +         '{{/tags.length}}'
     +     '</div>'
+    +     '<div class="Ldt-CurrentSegmentInfobox-SubmitButton">{{submit}}</div>'
+    +     '<div class="Ldt-CurrentSegmentInfobox-CancelButton">{{cancel}}</div>'
+    +   '</div>'
     + '</div>'
     
 IriSP.Widgets.CurrentSegmentInfobox.prototype.messages = {
@@ -76,8 +81,8 @@
         edit : "Editer",
         new_tag : "Nouveau tag",
         delete_tag : "Supprimer",
-        fields_header : "Contenu du segment courant",
-        tags_header : "Mots-clés du segment courant",
+        fields_header : "Commentaire associé à ce segment",
+        tags_header : "Mots-clés associés à ce segment",
         empty : "Le player vidéo ne lit actuellement aucun segment"
     },
     en: {
@@ -112,9 +117,10 @@
                 _this.currentSegment = _list[0];
                 _data = {
                         editable_segments: _this.editable_segments,
-                        edit: _this.l10n.edit,
+                        edit: _this.custom_edit_text ? _this.custom_edit_text : _this.l10n.edit,
                         title: _this.currentSegment.title,
                         description : _this.currentSegment.description,
+                        description_placeholder : _this.empty_description_placeholder,
                         tags : _this.currentSegment.getTagTexts()
                 }
                 _this.$.html(Mustache.to_html(_this.template, _data))
@@ -164,9 +170,10 @@
     if(this.currentSegment){
         _data = {
                 editable_segments: this.editable_segments,
-                edit: this.l10n.edit,
+                edit: this.custom_edit_text ? this.custom_edit_text : this.l10n.edit,
                 title: this.currentSegment.title,
                 description : this.currentSegment.description,
+                description_placeholder : this.empty_description_placeholder,
                 tags : this.currentSegment.getTagTexts()
             }
         this.$.toggleClass("editing", false);
@@ -268,9 +275,10 @@
             _this.currentSegment = _annotation
             _data = {
                     editable_segments: _this.editable_segments,
-                    edit: _this.l10n.edit,
+                    edit: _this.custom_edit_text ? _this.custom_edit_text : _this.l10n.edit,
                     title: _this.currentSegment.title,
                     description : _this.currentSegment.description,
+                    description_placeholder : _this.empty_description_placeholder,
                     tags : _this.currentSegment.getTagTexts()
                 }
             _this.$.html(Mustache.to_html(_this.template, _data))
@@ -298,9 +306,10 @@
                 this.currentSegment = _list[0];
                 _data = {
                     editable_segments: this.editable_segments,
-                    edit: this.l10n.edit,
+                    edit: this.custom_edit_text ? this.custom_edit_text : this.l10n.edit,
                     title: this.currentSegment.title,
                     description : this.currentSegment.description,
+                    description_placeholder : this.empty_description_placeholder,
                     tags : this.currentSegment.getTagTexts()
                 }
                 this.$.html(Mustache.to_html(this.template, _data))