diff -r c0e4d761bcb6 -r 9144b17b390e integration/js/edition.js
--- a/integration/js/edition.js	Mon Jun 10 18:02:41 2013 +0200
+++ b/integration/js/edition.js	Tue Jun 11 10:43:19 2013 +0200
@@ -1,30 +1,29 @@
-var myMedia = undefined,
-    currentChapter = undefined,
-    currentAnnotation = undefined,
-    currentSlider = undefined,
-    secMiniChapter = 10;
-
-
-
-
 $(function(){
 
+    var myMedia = undefined,
+        currentChapter = undefined,
+        currentAnnotation = undefined,
+        currentSlider = undefined,
+        secMiniChapter = 10;
+
+/* Colors */
     var annotationsColors = {
         'video' : '#BE4477',
         'text' : '#5E90CB',
         'slideshow' : '#F69058',
         'audio' : '#63BE6C',
         'links' : '#8985BB'
-    }
-
-    var global = {
-        colorsIndex : 0,
-        colors : 
-            ['#FF6138', '#FFFF9D', '#BEEB9F', '#79BD8F',  '#00A388',
+        },
+        colorsRangeIndex = 0,
+        colorsRange = [
+            '#FF6138', '#FFFF9D', '#BEEB9F', '#79BD8F',  '#00A388',
              '#1695A3', '#ACF0F2', '#F3FFE2', '#EB7F00', '#FF8000',
              '#FFD933', '#CCCC52', '#8FB359', '#FFD393', '#F54F29'
-            ]
-    };
+        ];
+
+    function getRandomColor(){
+        return colorsRange[(colorsRangeIndex<colorsRange.length) ? colorsRangeIndex++ : (colorsRangeIndex=0)];
+    }
 
     function getTemplate(idTpl){
         return $('#templates').find(idTpl).html();
@@ -38,6 +37,7 @@
 
         myMedia = myProject.getCurrentMedia();
 
+        //load Chapitre
         var anntypes = myProject.getAnnotationTypes().searchByTitle("chapitrage");
         if (!anntypes.length) {
             chapterAnnType = new IriSP.Model.AnnotationType(false, myProject);
@@ -47,7 +47,6 @@
             chapterAnnType = anntypes[0];
         }
 
-        //load Chapitre
         chapters = chapterAnnType.getAnnotations();
         if(!chapters.length){
             var dataChapter = {
@@ -83,7 +82,7 @@
         });
         renderAnnotation();
 
-
+        //player
         IriSP.htmlPlayer(
             myMedia,
             $(".main-video"),
@@ -105,7 +104,6 @@
         );
 
         myMedia.on("timeupdate", function(t) {
-
             //curseur chapitre
             var wContainer = $('.chapitre-cut-wrap').width() - 1,
                 pos = wContainer * t / myMedia.duration,
@@ -118,17 +116,17 @@
             }else{
                 btnCutChapter.css("left",pos);
             }
-            $('.info-time').text(t)
-            //annotations view
+            $('.info-time').text(t);
+
+            //display annotations
             refreshAnnotationDisplay(t);
-
         });//timeupdate
         
     });//myProject.onLoad
 
 /* Display annotation in timeline */
 
-    //survol
+    //hover
     $(document).on('mouseover', '.timeline-annotations .annotation, #list-annotations-rows tr, .item-display-annotation' , function(){
         if(!$(this).hasClass('shadow')) {
             var idAnnotation = $(this).attr('data-id');
@@ -214,8 +212,6 @@
         }
     });
 
-
-
 /* Title project */
 
     $(document).on('click', '.project-title-editor i, .project-title', function () {
@@ -247,11 +243,6 @@
         loadFormChapter(idChapter);
     });
 
-    $('.chapter-segments').on('click', 'li', function(){
-        var idChapter = $(this).attr('id');
-        loadFormChapter(idChapter);
-    });
-
     $('.chapter-widget-info').on('keyup', 'input[name=title], textarea', function(e){
         var name = $(this).attr('name'),
             value = $(this).val();
@@ -265,6 +256,12 @@
         disabledPreview();
     });
 
+    //form chapter
+    $('.chapter-segments').on('click', 'li', function(){
+        var idChapter = $(this).attr('id');
+        loadFormChapter(idChapter);
+    });
+
     function loadFormChapter(idChapter){
         currentChapter = _.find(chapters, function(c){ return c.id == idChapter; });
         var chapterWrap = $('.chapter-widget-info'),
@@ -283,6 +280,12 @@
         myMedia.setCurrentTime(currentChapter.begin);
     }
 
+    //close chapter form
+    $(document).on('click', '.btn-ok-chapter', function(e){
+        e.preventDefault();
+        $('.form-chapter-edit').remove();
+    });
+
     //delete chapter
     $(document).on('click', '.btn-delete-chapter', function(e){
         e.preventDefault();
@@ -305,10 +308,6 @@
         $("#modal-confirm").modal('show');
 
     });
-    $(document).on('click', '.btn-ok-chapter', function(e){
-        e.preventDefault();
-        $('.form-chapter-edit').remove();
-    });
 
     function deleteChapter(idChapter){
         
@@ -334,10 +333,7 @@
         disabledPreview();
     }
 
-    function getRandomColor(){
-        return global.colors[(global.colorsIndex<global.colors.length) ? global.colorsIndex++ : (global.colorsIndex=0)];
-    }
-    //nouveau chapitre
+    //new chapter
     function newChapter(dataChapter, render){
         var chapter = new IriSP.Model.Annotation(false, myProject);
             chapter.setMedia(myMedia.id);
@@ -377,7 +373,6 @@
         };
 
         newChapter(dataChapter, true);
-
     });
     
     function organizeNewChapter(beginNew){
@@ -455,9 +450,51 @@
         return annotation;
     }
 
+    //annotation content data init
+    function getContentAnnotationByType(type){
+        var content;
+        switch(type){
+            case 'audio':
+                content = {
+                    mimetype : "application/x-ldt-audio",
+                    url : "",
+                    embedcode : ""
+                };
+                break;
+            case 'video':
+                content = {
+                    mimetype : "application/x-ldt-video",
+                    url : "",
+                    embedcode : ""
+                };
+                break;
+            case 'text': 
+                content = {
+                    mimetype : "application/x-ldt-text",
+                    markup : "html",
+                    text : ""
+                };
+                break;
+            case 'links': 
+                content = {
+                    mimetype : "application/x-ldt-links",
+                    links : []
+                };
+                break;
+            case 'slideshow': 
+                content = {
+                    mimetype : "application/x-ldt-slideshow",
+                    slideduration : 1000,
+                    autostart : false,
+                    images : []
+                };
+                break;
+        }
+        return content;
+    }
+
     function renderAnnotation(){
         
-
         var timeline = $('.timeline-annotations'),
             wTimeline = timeline.width(),
             annotationList = $('#list-annotations-rows');
@@ -514,16 +551,12 @@
                 timeline.find('li:last-child').append(segment);
             }
             
-           
             //liste
                 v.iconTab = getIcon(v.type);
                 var tplAnnotationRow = getTemplate('#tpl-list-annotation-row');
                 tplAnnotationRow = Mustache.render(tplAnnotationRow, v);
                 annotationList.append(tplAnnotationRow);
-
         });
-
-
     }//renderAnnotation
 
     //edit annotation
@@ -541,7 +574,6 @@
     });
 
     $('.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;
@@ -582,7 +614,7 @@
         $(this).tab('show');
     });
 
-    //ouvrir tab
+    //open tab
     $(document).on('click', '.open-tab', function(e){
         e.preventDefault();
         var type = $(this).attr('data-type');
@@ -592,8 +624,7 @@
     function openTab(type, data){
         
         var dataView, isNew = false;
-        if(_.isUndefined(data)){//nouveau
-
+        if(_.isUndefined(data)){//new
             var currentTimePlusUnMin = 60 * 1000 + myMedia.currentTime,
                 endAnnotation = (currentTimePlusUnMin<myMedia.duration) ? currentTimePlusUnMin : myMedia.duration;
             var dataAnnotation = {
@@ -607,7 +638,7 @@
             dataView = newAnnotation(dataAnnotation);
             renderAnnotation();
             isNew = true;
-        }else{//édition
+        }else{//edition
             dataView = data;
         }
 
@@ -637,7 +668,7 @@
             $(tabContent).append(tpl);
             $('.tab-content').append(tabContent);
 
-            //particularité selon type
+            //data by type
             switch(type){
                 case 'audio':
                     break;
@@ -704,7 +735,7 @@
 
             if(isNew){$(tabContent).find('.head-title').focus();}
   
-    }//openTab()
+    }//openTab
 
     function getIcon(type){
         var icon;
@@ -725,7 +756,7 @@
         return icon;
     }
 
-    //définit currentAnnotation quand la tab s'ouvre
+    //define currentAnnotation by open tab
     $('#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; });
@@ -733,13 +764,19 @@
         showCurrentAnnotationInTimeline(idAnnotation);
     });
 
-    //rafraichit annotations au retour sur la liste
+    //refresh annotation data view when back on annotation list tab
     $('#onglet-annotations').on('show', 'a[data-toggle="list-annotations"]', function (e) {
         currentAnnotation = undefined;
         renderAnnotation();
     });
 
-    //fermer tab
+    //close tab
+    function closeTab(idAnnotation){
+        $('#onglet-'+idAnnotation).remove();
+        $('.tab-content #tab-annotation-'+idAnnotation).remove();
+        $('#tab-list-annotation').tab('show');
+    }
+
     $('#onglet-annotations').on('click', 'span.close-tab', function(e){
         e.preventDefault();e.stopPropagation();
         var idAnnotation = $(this).parents('a').attr('data-id');
@@ -752,15 +789,9 @@
         closeTab(idAnnotation);
     });
 
-    function closeTab(idAnnotation){
-        $('#onglet-'+idAnnotation).remove();
-        $('.tab-content #tab-annotation-'+idAnnotation).remove();
-        $('#tab-list-annotation').tab('show');
-    }
+/* Video */
 
-    //video
     function renderVideoInfo(videoWrap, dataVideo){
-    
         var tplVideo = getTemplate('#tpl-video-row');
         tplVideo = Mustache.render(tplVideo, dataVideo);
         
@@ -768,8 +799,9 @@
 
         videoWrap = videoWrap.find(".video-container");
         getVideoPlayer(dataVideo.url, videoWrap);
-     
     }
+
+    //select video on modal
     $('.popup').on('click', '.bibliotheque-video a:not(.pagination a)', function(e){
         e.preventDefault();
 
@@ -797,7 +829,7 @@
 
 /* Slideshow */
 
-    //bibliotheque
+    //select image on modal 
     $('.popup').on('click', '.bibliotheque-image a:not(.pagination a)', function(e){
         e.preventDefault();
 
@@ -819,15 +851,13 @@
     });
 
     function addImageToDiaporama(diaporama, dataView){
-   
         var tplDiapo = getTemplate('#tpl-diaporama-row');
         tplDiapo = Mustache.render(tplDiapo, dataView);
         diaporama.append(tplDiapo);
         disabledBtnSortable(diaporama);
-    
     };
 
-    //edit title / description
+    //edit 
     $('.tab-content').on('click', '.title-slideshow-row, .description-slideshow-row, .video-title-edit, .video-description-edit', function(){
         if($(this).find('input').length) return;
         var html = $(this).find('span').html(),
@@ -861,7 +891,7 @@
         disabledPreview();
     });
 
-    //bouton up / down
+    //button up / down
     $(document).on('click', '.ui-sortable .btn-sort', function(e){
         e.preventDefault();
         var row = $(this).parents('tr.row-image-diaporama'),
@@ -880,6 +910,13 @@
         disabledPreview();
     });
 
+    function disabledBtnSortable(listDiaporama){
+        listDiaporama.find('.btn-sort.disabled').removeClass('disabled');
+        listDiaporama.find('tr.row-image-diaporama:first-child').find('.btn-sort.up').addClass('disabled');
+        listDiaporama.find('tr.row-image-diaporama:last-child').find('.btn-sort.down').addClass('disabled');
+    }
+
+    //delete image on slideshow
     $('.tab-content').on('click','.btn-delete-image', function(e){
         e.preventDefault();
         var rowImage = $(this).parents('tr.row-image-diaporama'),
@@ -890,18 +927,23 @@
         disabledPreview();
     });
 
-    function disabledBtnSortable(listDiaporama){
-        listDiaporama.find('.btn-sort.disabled').removeClass('disabled');
-        listDiaporama.find('tr.row-image-diaporama:first-child').find('.btn-sort.up').addClass('disabled');
-        listDiaporama.find('tr.row-image-diaporama:last-child').find('.btn-sort.down').addClass('disabled');
+/* Links */
+
+    //add
+    function addLinkRow(tbody, dataView){
+        var tplLinkRow = getTemplate('#tpl-links-row');
+        var output = Mustache.render(tplLinkRow, dataView);
+        tbody.append(output);
+
     }
 
-    //links
     $('.tab-content').on('click', '.add-link', function(e){
         e.preventDefault();
         var tbody = $(this).parents('tfoot').siblings('tbody');
         addLinkRow(tbody);
     });
+
+    //delete
     $('.tab-content').on('click', '.delete-link', function(e){
         e.preventDefault();
         var row = $(this).parents('tr'),
@@ -910,18 +952,13 @@
         row.remove();
         updateLinks(tbody);
     });
-    function addLinkRow(tbody, dataView){
-
-        //head commun à tous
-        var tplLinkRow = getTemplate('#tpl-links-row');
-        var output = Mustache.render(tplLinkRow, dataView);
-        tbody.append(output);
-
-    }
+    
+    //edit
     $('.tab-content').on('keyup', '.links-rows input', function(e){
         var tbody = $(this).parents('.links-rows');
         updateLinks(tbody);   
     });
+
     function updateLinks(tbody){
         links = new Array();
 
@@ -938,9 +975,13 @@
         currentAnnotation.content.links = links;
         disabledPreview();
     }
+
     $('.tab-content').on('focus', '.url-link', function(){
         var td = $(this).parents('td');
-        if(td.hasClass('error')) td.removeClass('error')
+        if(td.hasClass('error')) {
+            td.removeClass('error');
+            td.find('.help-inline').hide();
+        }
     });
     
     $('.tab-content').on('blur', '.url-link', function(){
@@ -948,6 +989,7 @@
             td = $(this).parents('td');
         if(!isValidLink(url)){
             td.addClass('error');
+            td.find('.help-inline').show();
         }
     });
 
@@ -955,7 +997,26 @@
         return /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/.test(url);
     }
 
-    //annotation audio
+    //autostart
+    $('.tab-content').on('click', '.btn-autostart', function(){
+        var autostart = $(this).attr('data-autostart');
+        if(autostart == "true"){ autostart = true;}
+        else {autostart = false;}
+        disabledPreview();
+        currentAnnotation.content.autostart = autostart;
+    });
+
+    //duration
+    $('.tab-content').on('change keyup', '.config-diaporama input[name=duration]', function(){
+        var value = $(this).val();
+        if(!isNaN(value)){
+            disabledPreview();
+            currentAnnotation.content.slideduration = value * 1000;
+        }
+    });
+
+/* Audio */
+
     $('.tab-content').on('keyup', '.annotation-audio-content input, .annotation-audio-content textarea', function(){
         var name = $(this).attr('name'),
             value = $(this).val();
@@ -964,25 +1025,8 @@
         disabledPreview();
     });
 
-    //annotation slideshow
-    $('.tab-content').on('click', '.btn-autostart', function(){
-        var autostart = $(this).attr('data-autostart');
-        if(autostart == "true"){ autostart = true;}
-        else {autostart = false;}
-        disabledPreview();
-        currentAnnotation.content.autostart = autostart;
-    });
+/* Save project */
 
-    $('.tab-content').on('change keyup', '.config-diaporama input[name=duration]', function(){
-        var value = $(this).val();
-        if(!isNaN(value)){
-            disabledPreview();
-            currentAnnotation.content.slideduration = value * 1000;
-        }
-    });
-
-    
-    //save project
     $('.btn-save-project').bind('click', function(e){
         e.preventDefault();
         if($(this).hasClass('disabled')) return;
@@ -1027,7 +1071,7 @@
         e.preventDefault();
     });
 
-    //alert
+    //alert save info
     $('.alert').bind('close', function (e) {
         e.preventDefault();
         $(this).hide();
@@ -1037,7 +1081,9 @@
         $('.alert').hide();
         $('.'+className).show();
     }
-//################ config
+
+/* Config */
+
     //tagit
     function onTagItChange(e, ui) {
         var tagitType = $(this).attr('data-type'), 
@@ -1060,7 +1106,7 @@
         afterTagAdded : onTagItChange
     }
 
-    //CLEditor annotation > text (wysiwyg) http://premiumsoftware.net/cleditor/docs/GettingStarted.html#optionalParameters
+    //CLEditor (wysiwyg) http://premiumsoftware.net/cleditor/docs/GettingStarted.html#optionalParameters
     var wysiwygConfig = {
         width:        450, 
         height:       250, 
@@ -1128,49 +1174,6 @@
         };
     }
 
-    //init annotation content data
-    function getContentAnnotationByType(type){
-        var content;
-        switch(type){
-            case 'audio':
-                content = {
-                    mimetype : "application/x-ldt-audio",
-                    url : "",
-                    embedcode : ""
-                };
-                break;
-            case 'video':
-                content = {
-                    mimetype : "application/x-ldt-video",
-                    url : "",
-                    embedcode : ""
-                };
-                break;
-            case 'text': 
-                content = {
-                    mimetype : "application/x-ldt-text",
-                    markup : "html",
-                    text : ""
-                };
-                break;
-            case 'links': 
-                content = {
-                    mimetype : "application/x-ldt-links",
-                    links : []
-                };
-                break;
-            case 'slideshow': 
-                content = {
-                    mimetype : "application/x-ldt-slideshow",
-                    slideduration : 1000,
-                    autostart : false,
-                    images : []
-                };
-                break;
-        }
-        return content;
-    }//getContentAnnotationByType
-
     //unload
     $(window).on("beforeunload", onLeave);
     function onLeave(){
@@ -1184,26 +1187,6 @@
         tangleStartVal,
         tangleHasMoved;
     
-    $('.chapter-widget-info').on('mousedown', '.time-tangle', function(evt){
-        activeTangle = $(this);
-        activeTangle.addClass("active");
-        tangleStartVal = +activeTangle.attr("data-milliseconds");
-        tangleStartX = evt.pageX;
-        tangleHasMoved = false;
-        $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate");
-        return false;
-    });
-
-    $('.tab-content').on('mousedown', '.time-tangle', function(evt){
-        activeTangle = $(this);
-        activeTangle.addClass("active");
-        tangleStartVal = +activeTangle.attr("data-milliseconds");
-        tangleStartX = evt.pageX;
-        tangleHasMoved = false;
-        $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate");
-        return false;
-    });
-
     $(document)
         .mousemove(function(evt) {
             if (activeTangle) {
@@ -1216,7 +1199,7 @@
         .mouseup(function() {
 
             if (activeTangle) {
-                if(activeTangle.hasClass('slider-tangle')){
+                if(activeTangle.hasClass('slider-tangle')){//annotation
                     renderAnnotation();
                     refreshAnnotationDisplay(myMedia.getCurrentTime());
                 }
@@ -1226,6 +1209,16 @@
         });
 
     //chapters
+    $('.chapter-widget-info').on('mousedown', '.time-tangle', function(evt){
+        activeTangle = $(this);
+        activeTangle.addClass("active");
+        tangleStartVal = +activeTangle.attr("data-milliseconds");
+        tangleStartX = evt.pageX;
+        tangleHasMoved = false;
+        $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate");
+        return false;
+    });
+
     function updateRenderChapter(chapterData){
         var segment = $('.chapter-segments li#'+chapterData.id),
             wChapterSegmentWrap = $('.chapter-segments').width(),
@@ -1285,7 +1278,16 @@
             updateChapterDuration(val, chapterBefore, chapterAfter);
     });
 
-//annotations
+    //annotations
+    $('.tab-content').on('mousedown', '.time-tangle', function(evt){
+        activeTangle = $(this);
+        activeTangle.addClass("active");
+        tangleStartVal = +activeTangle.attr("data-milliseconds");
+        tangleStartX = evt.pageX;
+        tangleHasMoved = false;
+        $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate");
+        return false;
+    });
 
     $('.tab-content').on('valuechange', '.tangle-start', function(evt, val){
         var max = currentSlider.slider('values')[1],
@@ -1334,21 +1336,10 @@
         }
     }
 
-    //test
-    $('.log-annotations').bind('click', function(e){
-        e.preventDefault();
-        console.log(annotations.length + ' annotations', annotations);
-        currentSlider.slider( "values", 0, 55 );
-    });
-
-    $('.log-chapters').bind('click', function(e){
-        e.preventDefault();
-        console.log(chapters.length + ' chapitres',chapters);
-    });
-
 });//ready
 
-//Utilitaires
+/* Utility */
+
 Array.prototype.move = function (old_index, new_index) {
     if (new_index >= this.length) {
         var k = new_index - this.length;