# HG changeset patch
# User cavaliet
# Date 1370515390 -7200
# Node ID 64e6a45730e5dcea2da38942c25a589b06b71b1e
# Parent  8e016726669b83def5bfb71ea78c5e69252367cf
add integration modifs

diff -r 8e016726669b -r 64e6a45730e5 src/metadatacomposer/static/metadatacomposer/css/style.css
--- a/src/metadatacomposer/static/metadatacomposer/css/style.css	Thu Jun 06 12:42:03 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/css/style.css	Thu Jun 06 12:43:10 2013 +0200
@@ -44,6 +44,7 @@
 .project-action a:last-child{margin-right: 20px;}
 .chapter-widget-info{margin-bottom: 20px;}
 .chapter-widget form{ margin: 0;}
+.form-info-general-annotation{background-color: #ecf0f1;}
 .chapter-widget input, .form-info-general-annotation input, .form-info-general-annotation textarea{width: 196px; max-width: 196px;	}
 .chapter-widget textarea{width: 426px; max-width: 426px; min-width: 426px; height: 20px;-webkit-transition: height .3s ease;-moz-transition: height .3s ease;transition: height .3s ease;}
 .form-chapter-edit{}
@@ -86,10 +87,11 @@
 .close-tab:hover{color:#2c3e50;}
 .html-apercu{overflow: auto; margin-top: 10px;}
 .input-image-url{display: none;}
+.slider-duration.ui-slider.ui-slider-horizontal.ui-widget.ui-widget-content.ui-corner-all{ background: #202020;}
 .timeline-annotations-wrap{position: relative;background-color: #202020;}
 .timeline-annotations{width: 460px;height: auto; position: relative; margin: 0; padding-top: 4px;}
 .timeline-annotations li{display: block; width: 460px;height: 10px; position: relative; padding-bottom: 4px;}
-.timeline-annotations .annotation{width: 10px; height: 10px; background-color: #c0392b; position: absolute; top:0px;}
+.timeline-annotations .annotation{ color:#000; text-align:center; font-size : 10px; overflow: hidden; line-height: 9px; width: 10px; height: 10px; background-color: #c0392b; position: absolute; top:0px;}
 ul.tagit{margin-left: 10px;-webkit-border-radius: 0px;
 -moz-border-radius: 0px;
 border-radius: 0px;}
@@ -111,6 +113,10 @@
 td.image-slideshow-row img{width: 60px; height: 60px;}
 .project-title-editor input{margin-bottom: 0;}
 #templates{display: none;}
+
+.title-slideshow-row{word-wrap: break-word;width: 76px;}
+.description-slideshow-row{word-wrap: break-word; width: 180px;}
+.description-slideshow-row textarea{width: 164px; max-width: 164px; height: 164px;}
 /* Tangle */
 .time-tangle {
 	color: #2c3e50; cursor: w-resize; position: relative;
diff -r 8e016726669b -r 64e6a45730e5 src/metadatacomposer/static/metadatacomposer/js/edition.js
--- a/src/metadatacomposer/static/metadatacomposer/js/edition.js	Thu Jun 06 12:42:03 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/edition.js	Thu Jun 06 12:43:10 2013 +0200
@@ -1,6 +1,6 @@
-var myMedia = null,
-    currentChapter = null,
-    currentAnnotation = null,
+var myMedia = undefined,
+    currentChapter = undefined,
+    currentAnnotation = undefined,
     chapters = [],
     annotations = [];
 
@@ -9,10 +9,10 @@
 var global = {
     colorsIndex : 0,
     colors : 
-        ['#f39c12', '#2ecc71', '#3498db', '#9b59b6',  
-        '#f1c40f', '#e67e22', '#e74c3c', 
-        '#16a085', '#27ae60', '#2980b9', '#8e44ad', 
-         '#d35400', '#c0392b', '#bdc3c7']
+        ['#1abc9c', '#3498db', '#9b59b6', '#2ecc71',  
+        '#f1c40f', '#ecf0f1', '#e67e22', '#e74c3c', '#95a5a6',
+        '#16a085', '#2980b9', '#8e44ad', '#27ae60', 
+         '#f39c12', '#c0392b', '#bdc3c7', '#d35400', '#7f8c8d']
 };
 
 
@@ -79,10 +79,10 @@
             url_transform: function(src) {
                 return [{
                     type: "video/mp4",
-                    src: src.replace(/\.[\d\w]+$/,'.mp4').replace('rtmp://media.iri.centrepompidou.fr/ddc_player', 'http://media.iri.centrepompidou.fr')
+                    src: src.replace(/\.[\d\w]+$/,'.mp4')
                 }, {
                     type: "video/webm",
-                    src: src.replace(/\.[\d\w]+$/,'.webm').replace('rtmp://media.iri.centrepompidou.fr/ddc_player', 'http://media.iri.centrepompidou.fr')
+                    src: src.replace(/\.[\d\w]+$/,'.webm')
                 }];
             }
         }
@@ -102,47 +102,57 @@
         }else{
             btnCutChapter.css("left",pos);
         }
-
         //annotations view
-        var currentAnnotationsDisplay = new Array();
-        $.each(annotations, function(k, v){
-
-            if(v.begin <= t && v.end >= t){
-                currentAnnotationsDisplay.push(v.id);
-                if(!$('#item-current-annotation-'+v.id).length){
-                    var itemAnnotation = 
-                        $('<li>')
-                            .attr('id', 'item-current-annotation-'+v.id)
-                            .attr('data-id', v.id)
-                            .append(
-                                $('<a>')
-                                    .css('backgroundColor', v.color)
-                                    .attr('data-id', v.id)
-                                    .attr('href', '#')
-                                    .append(
-                                        $('<i>').addClass('icon-'+getIcon(v.type))
-                                    )
-                            );
-                    $('.list-current-annotations').append(itemAnnotation)
-                }
-            }
-        });
-        $.each($('.list-current-annotations li'), function(k, v){
-            var idAnnotation = $(this).attr('data-id'),
-                annotationDisplayView = $('.annotation-display-view');
-            if($.inArray(idAnnotation, currentAnnotationsDisplay)<0){//il ne doit plus être affiché
-                $('#item-current-annotation-'+idAnnotation).remove();
-                if(annotationDisplayView.attr('data-id') == idAnnotation && annotationDisplayView.is(":visible")){
-                    annotationDisplayView.hide();
-                }
-            }
-        });
-
+        refreshAnnotationDisplay(t);
 
     });//timeupdate
     
 });//myProject.onLoad
 
+function refreshAnnotationDisplay(t){
+    
+    var currentAnnotationsDisplay = new Array();
+    $.each(annotations, function(k, v){
+
+        if(v.begin <= t && v.end >= t){
+            currentAnnotationsDisplay.push(v.id);
+            if(!$('#item-current-annotation-'+v.id).length){
+                var itemAnnotation = 
+                    $('<li>')
+                        .attr('id', 'item-current-annotation-'+v.id)
+                        .attr('data-id', v.id)
+                        .append(
+                            $('<a>')
+                                .css('backgroundColor', v.color)
+                                .attr('data-id', v.id)
+                                .attr('href', '#')
+                                .append(
+                                    $('<i>').addClass('icon-'+getIcon(v.type))
+                                )
+                        );
+                $('.list-current-annotations').append(itemAnnotation)
+            }
+        }
+    });
+    $.each($('.list-current-annotations li'), function(k, v){
+        var idAnnotation = $(this).attr('data-id'),
+            annotationDisplayView = $('.annotation-display-view');
+        if($.inArray(idAnnotation, currentAnnotationsDisplay)<0){//il ne doit plus être affiché
+            $('#item-current-annotation-'+idAnnotation).remove();
+            if(annotationDisplayView.attr('data-id') == idAnnotation && annotationDisplayView.is(":visible")){
+                annotationDisplayView.hide();
+            }
+        }
+    });
+    if(currentAnnotation !== undefined){ 
+        showCurrentAnnotationInTimeline(currentAnnotation.id);
+    }
+}
+
+function showCurrentAnnotationInTimeline(idAnnotation){
+    $('.timeline-annotations .annotation').empty();
+    $('#annotation-timeline-'+idAnnotation).text('en cours');
+}
 //display annotation view
 $('.list-current-annotations').on('click', 'a', function(e){
     e.preventDefault();
@@ -176,9 +186,6 @@
 
 //select on bibliotheque
 
-    
-    
-
     //confirmation suppression
     $("#modal-confirm").on('click', '#btn-delete-modal', function(e){
         
@@ -203,7 +210,10 @@
         var input = $('<input type="text" />');
         input.val(html);
         $('.project-title').replaceWith(input);
-        input.focus();
+        input.focus().keypress(function(e){
+            code = (e.keyCode ? e.keyCode : e.which);
+            if (code == 13) $(this).blur();
+        });
     });
     $(document).on('blur', '.project-title-editor input', function(){
         var newTitle = $(this).val();
@@ -500,7 +510,7 @@
         } 
     });
 
-    $('.tab-content').on('keyup', 'input[name=title], textarea', function(e){
+    $('.tab-content').on('keyup', '.form-info-general-annotation input[name=title], .form-info-general-annotation textarea', function(e){
         var name = $(this).attr('name'),
             value = $(this).val();
         currentAnnotation[name] = value;
@@ -547,7 +557,7 @@
     });
 
     function openTab(type, data){
-        
+
         var dataView;
         if(_.isUndefined(data)){//nouveau
             var currentTimePlusUnMin = 60 * 1000 + myMedia.currentTime,
@@ -571,14 +581,13 @@
             iconTab;
 
         currentAnnotation = _.find(annotations, function(c){ return c.id == idAnnotation; });
-
-      
-
+        showCurrentAnnotationInTimeline(idAnnotation);
             //head commun à tous
             var tplHead = getTemplate('#tpl-head');
             var output = Mustache.render(tplHead, dataView);
             $(tabContent).append(output);
             $(tabContent).find(".slider-duration").slider(configSlider(dataView));
+            $(tabContent).find(".ui-slider-range.ui-widget-header.ui-corner-all").css('background', dataView.color);
             $(tabContent).find('.tag-it').tagit(tagitParam);
             //type
             var viewType = {
@@ -680,10 +689,12 @@
     $('#onglet-annotations').on('show', 'a[data-toggle="annotation"]', function (e) {
         var idAnnotation = $(e.target).attr('data-id');
         currentAnnotation = _.find(annotations, function(c){ return c.id == idAnnotation; });
+        showCurrentAnnotationInTimeline(idAnnotation);
     });
 
     //rafraichit annotations au retour sur la liste
     $('#onglet-annotations').on('show', 'a[data-toggle="list-annotations"]', function (e) {
+        currentAnnotation = undefined;
         renderAnnotation();
     });
 
@@ -768,6 +779,41 @@
     
     };
 
+    //edit title / description
+    $('.tab-content').on('click', '.title-slideshow-row', function(){
+        if($(this).find('input').length) return;
+        var html = $(this).find('span').html();
+        var input = $('<input type="text" />').addClass('input-mini').attr('name', 'title');
+        input.val(html);
+        $(this).find('span').replaceWith(input);
+        input.focus().keypress(function(e){
+            code = (e.keyCode ? e.keyCode : e.which);
+            if (code == 13) $(this).blur();
+        });
+    });
+
+    $('.tab-content').on('click', '.description-slideshow-row', function(){
+        if($(this).find('textarea').length) return;
+        var html = $(this).find('span').html();
+        var input = $('<textarea>').attr('name', 'description');
+        input.val(html);
+        $(this).find('span').replaceWith(input);
+        input.focus().keypress(function(e){
+            code = (e.keyCode ? e.keyCode : e.which);
+            if (code == 13) $(this).blur();
+        });
+    });
+
+    $(document).on('blur', '.title-slideshow-row input, .description-slideshow-row textarea', function(){
+        var newValue = $(this).val(),
+            name = $(this).attr('name'),
+            span = $('<span>').html(newValue),
+            indexRow = $(this).parents('.row-image-diaporama').index();
+        $(this).replaceWith(span);
+
+        currentAnnotation.content.images[indexRow][name] = newValue;
+    });
+
     //bouton up / down
     $(document).on('click', '.ui-sortable .btn-sort', function(e){
         e.preventDefault();
@@ -946,7 +992,8 @@
             annotationTimeline.css('z-index',100);
         },
         stop : function(){
-            renderAnnotation()
+            renderAnnotation();
+            refreshAnnotationDisplay(myMedia.getCurrentTime());
         }
     };
 }