diff -r 9e14b6f964fe -r 42919bf5d4e1 integration/js/edition.js
--- a/integration/js/edition.js	Wed May 29 18:14:23 2013 +0200
+++ b/integration/js/edition.js	Fri May 31 17:32:56 2013 +0200
@@ -7,13 +7,12 @@
 $(function(){
 
 var global = {
-    idAnnotation : null,
     colorsIndex : 0,
     colors : 
         ['#f39c12', '#2ecc71', '#3498db', '#9b59b6',  
-        '#f1c40f', '#e67e22', '#e74c3c', '#ecf0f1', 
+        '#f1c40f', '#e67e22', '#e74c3c', 
         '#16a085', '#27ae60', '#2980b9', '#8e44ad', 
-        '#f39c12', '#d35400', '#c0392b', '#bdc3c7']
+         '#d35400', '#c0392b', '#bdc3c7']
 };
 
 
@@ -35,7 +34,8 @@
 myProject.onLoad(function() {
 
     $(".project-title").text(myProject.title);
-    
+    $('.project-title-nav').text(myProject.title);
+
     myMedia = myProject.getCurrentMedia();
 
 //load Chapitre
@@ -68,11 +68,6 @@
     });
 }
 
-
-    //chargement des chapitres et annotations existants
-  //  loadInitChapters();
-    //loadInitAnnotation();
-
     IriSP.htmlPlayer(
         myMedia,
         $(".main-video"),
@@ -169,12 +164,7 @@
 //########### modal
 
     $(document).on('click', 'a.open-modal', function(e){
-        var idAnnotation = $(this).attr('data-id');
 
-
-        if(idAnnotation !== undefined){
-            global.idAnnotation = idAnnotation;
-        }
     });
 
 //edition image
@@ -195,35 +185,20 @@
     });
 
 //--title-editor
-$('.project-title-editor ._popover').bind('click',function(e){e.preventDefault()});
-    $('.project-title-editor ._popover').popover({
-        html : true,
-        content : function(){
-            var previousValue = $('.project-title').text(),
-                formInput = 
-                    '<form action="#" class="project-title-editor-form">'+
-                        '<input type="text" class="project-title-editor-input" value="'+previousValue+'">'+
-                    '</form>';
-            return formInput;
-        }
+    $(document).on('click', '.project-title-editor i, .project-title', function () {
+        var html = $('.project-title').html();
+        var input = $('<input type="text" />');
+        input.val(html);
+        $('.project-title').replaceWith(input);
+        input.focus();
+    });
+    $(document).on('blur', '.project-title-editor input', function(){
+        var newTitle = $(this).val();
+        myProject.title = newTitle;
+        $(this).replaceWith('<span class="project-title">'+newTitle+'</span></td>');
+        $('.project-title-nav').text(newTitle);
     });
 
-    $('body').on('click', function (e) {
-        $('._popover').each(function () {
-            if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
-                $(this).popover('hide');
-            }
-        });
-    });
-
-    $('body').on('submit', '.project-title-editor-form', function(e){
-        e.preventDefault();
-        $('._popover').popover('hide');
-    });
-
-    $(document).on('keyup', '.project-title-editor-input', function() {
-        $('.project-title').html($(this).val());
-    });
 
 //######################## chapter
 
@@ -265,17 +240,17 @@
         currentChapter.beginTangle = beginTangle;
         currentChapter.endTangle = endTangle;
 
-        $.get('template.html', function(templates){
-            var tpl = $(templates).filter('#tpl-chapter-edit').html();
+        var tpl = getTemplate('#tpl-chapter-edit');
             tpl = Mustache.render(tpl, currentChapter);
             chapterWrap.empty().append(tpl);
             chapterWrap.find('.tag-it').tagit(tagitParam);
-        });
 
         myMedia.setCurrentTime(currentChapter.begin);
     }
 
-
+    function getTemplate(idTpl){
+        return $('#templates').find(idTpl).html();
+    }
 //supprimer
 $('.list-chapter-wrap').on('click', '.btn-delete-chapter', function(e){
     e.preventDefault();
@@ -362,7 +337,7 @@
 
         chapterSegmentWrap.empty();
         chapterList.empty();
-        $.get('template.html', function(templates){
+       
             $.each(chapters, function(k, v){
 
                 //segments
@@ -375,42 +350,17 @@
                 chapterSegmentWrap.append(segment);
 
                 //liste
-                var tplChapterRow = $(templates).filter('#tpl-chapter-row').html();
+                var tplChapterRow = getTemplate('#tpl-chapter-row');
                 tplChapterRow = Mustache.render(tplChapterRow, v);
                 chapterList.append(tplChapterRow);
             });
-        });
+     
     }//renderChapter()
 
-//init
-    function loadInitChapters(){//nouveau projet, 1 chapitre
-        var dataChapter = {
-                title : 'New',
-                begin : 0,
-                end : myMedia.duration,
-                description : 'description',
-                keywords : ['tag1','tag2']
-            };
-
-        newChapter(dataChapter);
-    }
 
 
 //######################## annotation
     
-    function loadInitAnnotation(){//nouveau projet, 1 chapitre
-        var dataAnnotation = {
-                title : 'Titre azerty',
-                begin : myMedia.duration/5,
-                end : myMedia.duration/3,
-                description : 'description',
-                type : 'video',
-                keywords : ['ideal', 'tag']
-            };
-
-        newAnnotation(dataAnnotation);
-        renderAnnotation();
-    }
 
     function newAnnotation(dataAnnotation){
         var annotation = new IriSP.Model.Annotation(false, myProject);
@@ -438,7 +388,7 @@
             return c.begin;
         });
 
-        timeline.empty();
+        timeline.empty().append('<li>');
         annotationList.empty();
 
         $.each(annotations, function(k, v){
@@ -451,19 +401,46 @@
                     width : width,
                     backgroundColor : v.color
                 }).addClass('annotation').attr('id', 'annotation-timeline-'+v.id);
-    
-            timeline.append(segment);
+
+            var isInTimeline = false;
+            $.each(timeline.find('li'), function(a, b){
+                if(isInTimeline) return;
+                var row = $(this);
+                if(row.children().length){
+                    var canBeInRow = true;
+                    $.each(row.find('.annotation'), function(c, d){
+                        var oAL = parseInt($(d).css('left')),
+                            oAR = oAL + $(d).width(),
+                            segmentR = left + width;
+                        if(oAL<=left && oAR>=left || oAL<=segmentR && oAR>= segmentR){
+                            canBeInRow = false;
+                        }
+                    });
+                    if(canBeInRow){
+                        row.append(segment);
+                        isInTimeline = true;
+                    }
+                }else{
+                    row.append(segment);
+                    isInTimeline = true;
+                }
+            });
+
+            if(!isInTimeline){
+                timeline.append('<li>');
+                timeline.find('li:last-child').append(segment);
+            }
+            
            
             //liste
-            $.get('template.html', function(templates){
-                var tplAnnotationRow = $(templates).filter('#tpl-list-annotation-row').html();
+                var tplAnnotationRow = getTemplate('#tpl-list-annotation-row');
                 tplAnnotationRow = Mustache.render(tplAnnotationRow, v);
                 annotationList.append(tplAnnotationRow);
 
-            });
+        });
 
-        });
-    }
+
+    }//renderAnnotation
 
     //edit annotation
     $('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){
@@ -540,10 +517,10 @@
 
         currentAnnotation = _.find(annotations, function(c){ return c.id == idAnnotation; });
 
-        $.get('template.html', function(templates){
+      
 
             //head commun à tous
-            var tplHead = $(templates).filter('#tpl-head').html();
+            var tplHead = getTemplate('#tpl-head');
             var output = Mustache.render(tplHead, dataView);
             $(tabContent).append(output);
             $(tabContent).find(".slider-duration").slider(configSlider(dataView));
@@ -553,7 +530,7 @@
                 id : idAnnotation,
                 content : dataView.content
             };
-            var tpl = $(templates).filter('#tpl-'+type).html();
+            var tpl = getTemplate('#tpl-'+type);
 
             tpl = Mustache.render(tpl, viewType);
             $(tabContent).append(tpl);
@@ -566,18 +543,8 @@
                 case 'video':
                     
                     if(viewType.content.url != ""){
-                   /*
-                        var videoWrap = $(tabContent).find('.annotation-video-content'),
-                            tplVideo = $(templates).filter('#tpl-video-row').html();
-                        tplVideo = Mustache.render(tplVideo, viewType.content);
-                        videoWrap.empty().append(tplVideo);
 
-    
-                        var videoWrap = $(tabContent).find(".video-container"),
-                            src = viewType.content.url;
-                        getVideoPlayer(src, videoWrap);
-*/
- var videoWrap = $(tabContent).find('.annotation-video-content');
+                        var videoWrap = $(tabContent).find('.annotation-video-content');
                         renderVideoInfo(videoWrap, viewType.content);
    
                     }
@@ -627,12 +594,12 @@
             }
 
             dataView.iconTab = getIcon(type);
-            var tplOnglet = $(templates).filter('#tpl-onglet').html();
+            var tplOnglet = getTemplate('#tpl-onglet');
             var onglet = Mustache.render(tplOnglet, dataView);
 
             $(".nav-tabs li:last-child").after(onglet);
             $('a[href=#tab-annotation-'+idAnnotation+']').tab('show');
-        });
+  
     }//openTab()
 
     function getIcon(type){
@@ -642,8 +609,7 @@
                 break;
             case 'video': icon = 'film';
                 break;
-            case 'text': 
-                icon = 'align-left';
+            case 'text': icon = 'align-left';
                 break;
             case 'html': icon = 'code';
                 break;
@@ -687,15 +653,15 @@
 
 //video
     function renderVideoInfo(videoWrap, dataVideo){
-        $.get('template.html', function(templates){
-            var tplVideo = $(templates).filter('#tpl-video-row').html();
-            tplVideo = Mustache.render(tplVideo, dataVideo);
-            
-            videoWrap.empty().append(tplVideo);
+    
+        var tplVideo = getTemplate('#tpl-video-row');
+        tplVideo = Mustache.render(tplVideo, dataVideo);
+        
+        videoWrap.empty().append(tplVideo);
 
-            videoWrap = videoWrap.find(".video-container");
-            getVideoPlayer(dataVideo.url, videoWrap);
-        });
+        videoWrap = videoWrap.find(".video-container");
+        getVideoPlayer(dataVideo.url, videoWrap);
+     
     }
     $('.popup').on('click', '.bibliotheque-video a', function(e){
         e.preventDefault();
@@ -712,18 +678,7 @@
 
         var videoWrap = $('#tab-annotation-'+currentAnnotation.id).find('.annotation-video-content');
         renderVideoInfo(videoWrap, currentAnnotation.content);
-/*
-        $.get('template.html', function(templates){
-            var videoWrap = $('#tab-annotation-'+currentAnnotation.id).find('.annotation-video-content'),
-                tplVideo = $(templates).filter('#tpl-video-row').html();
-            tplVideo = Mustache.render(tplVideo, currentAnnotation.content);
-            videoWrap.empty().append(tplVideo);
 
-            var videoWrap = videoWrap.find(".video-container"),
-                src = url;
-            getVideoPlayer(src, videoWrap);
-        });
-*/
         
     });
 
@@ -750,12 +705,12 @@
     });
 
     function addImageToDiaporama(diaporama, dataView){
-        $.get('template.html', function(templates){
-            var tplDiapo = $(templates).filter('#tpl-diaporama-row').html();
-            tplDiapo = Mustache.render(tplDiapo, dataView);
-            diaporama.append(tplDiapo);
-            disabledBtnSortable(diaporama);
-        });
+   
+        var tplDiapo = getTemplate('#tpl-diaporama-row');
+        tplDiapo = Mustache.render(tplDiapo, dataView);
+        diaporama.append(tplDiapo);
+        disabledBtnSortable(diaporama);
+    
     };
 
     //bouton up / down
@@ -801,17 +756,18 @@
 $('.tab-content').on('click', '.delete-link', function(e){
     e.preventDefault();
     var row = $(this).parents('tr'),
-        tbody = $(this).find('tbody');
+        tbody = $(this).parents('tbody');
+
     row.remove();
     updateLinks(tbody);
 });
 function addLinkRow(tbody, dataView){
-    $.get('template.html', function(templates){
+
         //head commun à tous
-        var tplLinkRow = $(templates).filter('#tpl-links-row').html();
+        var tplLinkRow = getTemplate('#tpl-links-row');
         var output = Mustache.render(tplLinkRow, dataView);
         tbody.append(output);
-    });
+
 }
 $('.tab-content').on('keyup', '.links-rows input', function(e){
     var tbody = $(this).parents('.links-rows');
@@ -819,6 +775,7 @@
 });
 function updateLinks(tbody){
     links = new Array();
+
     $.each(tbody.find('tr'), function(k, v){
         var urlLink = $(v).find('.url-link').val(),
             titleLink = $(v).find('.title-link').val(),
@@ -827,23 +784,11 @@
                 title : titleLink
             };
             links.push(link);
+
     });
     currentAnnotation.content.links = links;
 }
 
-
-//annotation html
-/*
-$('.tab-content').on('click', '.btn-html-apercu', function(e){
-    e.preventDefault();
-
-    var apercuWrap = $(this).parents('.edit-annotation-html').find('.html-apercu'),
-        htmlTextarea = $(this).parents('.edit-annotation-html').find('textarea');
-
-    apercuWrap.empty().html(htmlTextarea.val());
-});
-*/
-
 //annotation audio
 $('.tab-content').on('keyup', '.annotation-audio-content input, .annotation-audio-content textarea', function(){
     var name = $(this).attr('name'),
@@ -860,7 +805,6 @@
     currentAnnotation.content.autostart = autostart;
 });
 
-
 $('.tab-content').on('change keyup', '.config-diaporama input[name=duration]', function(){
     var value = $(this).val();
     if(!isNaN(value)){
@@ -916,7 +860,6 @@
 
 //slider
 function configSlider(data){
-
     return {
         range: true,
         values: [ data.begin.milliseconds, data.end.milliseconds ],
@@ -942,11 +885,16 @@
                 width :width
             });
 
+
+
+        },
+        stop : function(){
+            renderAnnotation()
         }
     };
-
 }
 
+//init annotation content data
 function getContentAnnotationByType(type){
     var content;
     switch(type){
@@ -993,21 +941,6 @@
 
 
 //test
-//a = $(".wysiwyg").cleditor(wysiwygConfig);
-
-
-$('.number-spin').spin(spinParam);
-
-disabledBtnSortable($('.ui-sortable'))
-$('.ui-sortable').sortable({
-    stop : function(event, ui){
-        disabledBtnSortable($(this));
-    }
-});
-
-$('.slider-duration').slider(configSlider);
-
-$(".tag-it").tagit();
 
 $('.log-annotations').bind('click', function(e){
     e.preventDefault();
@@ -1018,8 +951,10 @@
     e.preventDefault();
     console.log(chapters.length + ' chapitres',chapters);
 });
+
 });//ready
 
+//Utilitaires
 Array.prototype.move = function (old_index, new_index) {
     if (new_index >= this.length) {
         var k = new_index - this.length;
@@ -1028,7 +963,7 @@
         }
     }
     this.splice(new_index, 0, this.splice(old_index, 1)[0]);
-    return this; // for testing purposes
+    return this; 
 };
 
 
@@ -1144,4 +1079,4 @@
         autoplay: "" + autoplay
     }));
                 
-}
\ No newline at end of file
+}//getVideoPlayer
\ No newline at end of file