Small fixes on css, buttons text and placeholder text
authordurandn
Thu, 12 Nov 2015 18:10:25 +0100
changeset 180 4a9743b78a49
parent 179 e0c516958834
child 181 f2d46072794a
Small fixes on css, buttons text and placeholder text
server/src/remie/static/remie/css/style.css
server/src/remie/static/remie/css/teacher.css
server/src/remie/static/remie/metadataplayer/AnnotationsController.js
server/src/remie/static/remie/metadataplayer/AnnotationsList.js
server/src/remie/static/remie/metadataplayer/CurrentSegmentInfobox.js
server/src/remie/static/remie/metadataplayer/Segments.js
server/src/remie/templates/remie/iframe_segments_group.html
server/src/remie/templates/remie/iframe_segments_preview.html
server/src/remie/templates/remie/iframe_segments_single.html
server/src/remie/templates/remie/iframe_teacher.html
--- a/server/src/remie/static/remie/css/style.css	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/static/remie/css/style.css	Thu Nov 12 18:10:25 2015 +0100
@@ -87,6 +87,12 @@
     text-indent: 2px;
 }
 
+.Ldt-CurrentSegmentInfobox-Element.Ldt-CurrentSegmentInfobox-Description-placeholder{
+	font-size: 15px;
+	font-style: italic;
+	width: 320px;
+}
+
 .Ldt-CurrentSegmentInfobox-Element.Ldt-CurrentSegmentInfobox-NoSegment,
 .Ldt-CurrentSegmentInfobox-Element.Ldt-CurrentSegmentInfobox-Title{
     background-color: #F3F7F8 !important;
@@ -299,7 +305,9 @@
     height: 27px;
     margin: 0 5px 0 0;
     padding-top: 0px;
-    width: 80px;
+    width: auto;
+    padding-left: 10px;
+    padding-right: 10px;
     float: left;
 }
 
--- a/server/src/remie/static/remie/css/teacher.css	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/static/remie/css/teacher.css	Thu Nov 12 18:10:25 2015 +0100
@@ -19,6 +19,10 @@
     margin: 5px;
 }
 
+.Ldt-CurrentSegmentInfobox-EditButton{
+	width: 130px !important;
+}
+
 .Ldt-CurrentSegmentInfobox-Element.Ldt-CurrentSegmentInfobox-Tags {
     margin-left: 0;
 }
@@ -51,6 +55,10 @@
 	background-color: white;
 }
 
+.Ldt-AnnotationsList-li span.Ldt-AnnotationsList-Creator{
+	width: 80px;
+}
+
 ul.Ldt-AnnotationsList-ul {
 	padding: 0px;
 	margin: 0px;
--- a/server/src/remie/static/remie/metadataplayer/AnnotationsController.js	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/static/remie/metadataplayer/AnnotationsController.js	Thu Nov 12 18:10:25 2015 +0100
@@ -20,13 +20,15 @@
     starting_widget: false,
     always_show_widget: false,
     segments_annotation_type: "chap",
+    custom_write_text: false,
+    custom_display_text: false,
 };
 
 IriSP.Widgets.AnnotationsController.prototype.template = 
     "<div class='Ldt-AnnotationsController'>"
     + "<div class='Ldt-AnnotationsController-ButtonsContainer'>"
-    + "    <div class='Ldt-AnnotationsController-Button Ldt-AnnotationsController-ShowCreateAnnotationButton'>{{l10n.write}}</div>"
-    + "    <div class='Ldt-AnnotationsController-Button Ldt-AnnotationsController-ShowAnnotationsListButton'>{{l10n.display}}</div>"
+    + "    <div class='Ldt-AnnotationsController-Button Ldt-AnnotationsController-ShowCreateAnnotationButton'>{{#custom_write_text}}{{/custom_write_text}}{{custom_write_text}}{{^custom_write_text}}{{l10n.write}}{{/custom_write_text}}</div>"
+    + "    <div class='Ldt-AnnotationsController-Button Ldt-AnnotationsController-ShowAnnotationsListButton'>{{#custom_display_text}}{{/custom_display_text}}{{custom_display_text}}{{^custom_display_text}}{{l10n.display}}{{/custom_display_text}}</div>"
     + "</div>"
     + "</div>"
 
--- a/server/src/remie/static/remie/metadataplayer/AnnotationsList.js	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/static/remie/metadataplayer/AnnotationsList.js	Thu Nov 12 18:10:25 2015 +0100
@@ -657,6 +657,12 @@
                     _annotation.trigger("unselect");
                 })
                 .click(function() {
+                    if (_this.filter_by_segments && _this.media.getTimeRange()){
+                        _ann_time = ( _annotation.begin + _annotation.end ) / 2;
+                        if ((_ann_time <= _this.media.getTimeRange()[0]) || (_ann_time >= _this.media.getTimeRange()[1])){
+                            _this.media.resetTimeRange()
+                        }
+                    }
                     _annotation.trigger("click");
                 })
                 .appendTo(_this.list_$);
--- a/server/src/remie/static/remie/metadataplayer/CurrentSegmentInfobox.js	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/static/remie/metadataplayer/CurrentSegmentInfobox.js	Thu Nov 12 18:10:25 2015 +0100
@@ -16,6 +16,8 @@
     api_endpoint_template: "",
     new_tag_button: true,
     show_headers: false,
+    custom_edit_text: false,
+    empty_description_placeholder: false,
 };
 
 IriSP.Widgets.CurrentSegmentInfobox.prototype.template = 
@@ -24,6 +26,7 @@
     +     '{{#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">'
@@ -114,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))
@@ -166,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);
@@ -270,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))
@@ -300,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))
--- a/server/src/remie/static/remie/metadataplayer/Segments.js	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/static/remie/metadataplayer/Segments.js	Thu Nov 12 18:10:25 2015 +0100
@@ -186,6 +186,14 @@
         });
     });
     
+    this.onMediaEvent("resettimerange", function(){
+        
+        _this.$segments.each(function(){
+            var _segment = IriSP.jQuery(this);
+            _segment.removeClass("selected");
+        })
+    });
+    
     this.$.css({
         width : this.width + "px",
         height : (((1 - this.overlap) * lines.length + this.overlap) * this.line_height) + "px",
--- a/server/src/remie/templates/remie/iframe_segments_group.html	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/templates/remie/iframe_segments_group.html	Thu Nov 12 18:10:25 2015 +0100
@@ -92,6 +92,7 @@
             starting_widget: "AnnotationsList",
             toggle_widgets: false,
             hide_when_writing: true,
+            custom_write_text: "Annoter ce segment",
         },{
             type: "CreateAnnotation",
             container: "CreateAnnotation_container",
@@ -183,7 +184,8 @@
          	annotation_type: "découpage",
          	container: "CurrentSegmentInfobox_container",
          	empty_message: "Clique sur un segment pour ouvrir le chapitre",
-         	pause_on_segment_end: true
+         	pause_on_segment_end: true,
+            empty_description_placeholder: "Pas de consigne sur ce segment ..."
         }
         
       ]
--- a/server/src/remie/templates/remie/iframe_segments_preview.html	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/templates/remie/iframe_segments_preview.html	Thu Nov 12 18:10:25 2015 +0100
@@ -125,6 +125,7 @@
             starting_widget: "AnnotationsList",
             toggle_widgets: false,
             hide_when_writing: true,
+            custom_write_text: "Annoter ce segment",
         },{
             type: "AnnotationsList",
             container: "AnnotationsList_container",
@@ -181,7 +182,8 @@
          	annotation_type: "découpage",
          	container: "CurrentSegmentInfobox_container",
          	empty_message: "Clique sur un segment pour ouvrir le chapitre",
-         	pause_on_segment_end: true
+         	pause_on_segment_end: true,
+            empty_description_placeholder: "Pas de consigne sur ce segment ..."
         }
         
       ]
--- a/server/src/remie/templates/remie/iframe_segments_single.html	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/templates/remie/iframe_segments_single.html	Thu Nov 12 18:10:25 2015 +0100
@@ -115,7 +115,7 @@
             project_id: "{{project_id}}",
             pause_when_displaying: true,
             custom_send_button: "Sauver",
-            custom_description_placeholder: "Je rédige une annotation ...",
+            custom_description_placeholder: "Je rédige mon annotation ...",
         },{
             type: "AnnotationsController",
             container: "AnnotationsController_container",
@@ -126,6 +126,7 @@
             starting_widget: "AnnotationsList",
             toggle_widgets: false,
             hide_when_writing: true,
+            custom_write_text: "Annoter ce segment",
         },{
             type: "AnnotationsList",
             container: "AnnotationsList_container",
@@ -178,6 +179,7 @@
           annotation_type: "découpage",
           container: "CurrentSegmentInfobox_container",
           empty_message: "Clique sur un segment pour ouvrir le chapitre",
+          empty_description_placeholder: "Pas de consigne sur ce segment ..."
         }
         
       ]
--- a/server/src/remie/templates/remie/iframe_teacher.html	Fri Nov 06 12:20:13 2015 +0100
+++ b/server/src/remie/templates/remie/iframe_teacher.html	Thu Nov 12 18:10:25 2015 +0100
@@ -91,6 +91,7 @@
             starting_widget: "AnnotationsList",
             toggle_widgets: false,
             hide_when_writing: true,
+            custom_write_text: "Annoter ce segment",
         },{
             type: "CreateAnnotation",
             container: "CreateAnnotation_container",
@@ -178,15 +179,17 @@
                 return display_string;
             },
         },{
-          type: "CurrentSegmentInfobox",
-          annotation_type: "découpage",
-          container: "CurrentSegmentInfobox_container",
-          empty_message: "Clique sur un segment pour ouvrir le chapitre",
-          editable_segments: true,
-          project_id : "{{project_id}}",
-          api_endpoint_template: "{% url 'api_dispatch_list' resource_name='annotations' api_name='1.0' %}{% templatetag openvariable %}annotation_id{% templatetag closevariable %}",
-          new_tag_button: false,
-          show_headers: true,
+            type: "CurrentSegmentInfobox",
+            annotation_type: "découpage",
+            container: "CurrentSegmentInfobox_container",
+            empty_message: "Clique sur un segment pour ouvrir le chapitre",
+            editable_segments: true,
+            project_id : "{{project_id}}",
+            api_endpoint_template: "{% url 'api_dispatch_list' resource_name='annotations' api_name='1.0' %}{% templatetag openvariable %}annotation_id{% templatetag closevariable %}",
+            new_tag_button: false,
+            show_headers: true,
+         	custom_edit_text : "Editer ce segment",
+         	empty_description_placeholder: "Informations associées au segment (titre, consigne, mots-clés, ...)",
         }
         
       ]