diff -r 40909e8d6855 -r 5a5024bc74e6 integration/js/editor.js
--- a/integration/js/editor.js	Fri Nov 09 18:56:29 2012 +0100
+++ b/integration/js/editor.js	Fri Nov 16 19:23:20 2012 +0100
@@ -10,7 +10,8 @@
     From_: "De :",
     to_: "à :",
     segment_title_placeholder: "Segment sans titre",
-    mashup_title_placeholder: "Hashcut sans titre"
+    mashup_title_placeholder: "Hashcut sans titre",
+    copy_of_: "Copie de ",
 }
 
 IriSP.editor = function(options) {
@@ -24,22 +25,24 @@
             serializer: IriSP.serializers.medialist
         }),
         mashup = new IriSP.Model.Mashup(false, project),
-        mediatemplate = _.template('<li class="item-video media" data-media-id="<%= id %>"><img src="<%= thumbnail %>" alt="<%= title %>" />'
-            + '<span class="video-info"><span class="title-video"><%= title %></span><span class="author"><%= description %></span>'
-            + '<span class="time-length"><%= IriSP.hc_messages.Duration_ %> <span><%= duration.toString() %></span></span></span></li>'),
+        mediatemplate = _.template('<li class="item-video media" data-media-id="<%= id %>"><div class="media-count-wrap"><span class="media-count"></span></div>'
+            + '<img src="<%= thumbnail %>" alt="<%= title %>" />'
+            + '<div class="video-info"><h3 class="title-video"><%= title %></h3><p class="description"><%= description %></p>'
+            + '<p class="time-length"><%= IriSP.hc_messages.Duration_ %> <span><%= duration.toString() %></span></p></div></li>'),
         segmenttemplate = _.template('<li class="item-video annotation" data-segment-id="<%= annotation.id %>" data-media-id="<%= annotation.getMedia().id %>">'
-            + '<img src="<%= annotation.getMedia().thumbnail %>" alt="<%= annotation.getMedia().title %>" />'
-            + '<div class="validate <%= annotation.status %>"><div class="validate-tooltip"><ul><li><%= annotation.status_messages.join("</li><li>") %></li></ul></div></div><span class="video-info"><span class="title-video"><%= annotation.getMedia().title %></span>'
-            + '<span class="subtitle"><%= annotation.title %></span><span class="duration"><%= annotation.begin.toString() %> - <%= annotation.end.toString() %> (<%= annotation.getDuration().toString() %>)</span>'
+            + '<img src="<%= annotation.thumbnail %>" alt="<%= annotation.getMedia().title %>" />'
+            + '<div class="validate <%= annotation.status %>"><div class="validate-tooltip"><ul><li><%= annotation.status_messages.join("</li><li>") %></li></ul></div></div><div class="video-info"><h3 class="title-video"><%= annotation.getMedia().title %></h3>'
+            + '<p class="subtitle"><%= annotation.title %></p><p class="duration"><%= annotation.begin.toString() %> - <%= annotation.end.toString() %> (<%= annotation.getDuration().toString() %>)</p>'
             + '<ul class="tools"><li><a class="edit" href="#" title="<%= IriSP.hc_messages.edit_segment %>"></a></li><li><a class="bottom" href="#" title="<%= IriSP.hc_messages.segment_down %>"></a></li>'
-            + '<li><a class="top" href="#" title="<%= IriSP.hc_messages.segment_up %>"></a></li><li><a class="delete" href="#" title="<%= IriSP.hc_messages.delete_segment %>"></a></li></ul></span></li>'),
+            + '<li><a class="top" href="#" title="<%= IriSP.hc_messages.segment_up %>"></a></li><li><a class="delete" href="#" title="<%= IriSP.hc_messages.delete_segment %>"></a></li></ul></div></li>'),
         mediasegmenttemplate = _.template('<div class="media-segments-list"><div class="media-segment">'
-            + '<div class="media-section media-segment-section" style="left:<%= left %>px; width:<%= width %>px; background:<%= annotation.color %>"></div>'
+            + '<div class="media-section media-segment-section" style="left:<%= left %>px; width:<%= width %>px; background:<%= color %>"></div>'
             + '<div class="media-section media-current-section" style="left:<%= currentleft %>px; width:<%= currentwidth %>px;"><div class="media-current-section-inner"></div></div>'
             + '<div class="popin media-segment-popin" style="left:<%= popleft %>px"><img style="left:<%= pointerpos %>px;" class="pointer" src="img/popin-triangle.png" alt="" /><div class="popin-content">'
             + '<h3><%= annotation.title %></h3><a href="#" class="button reprendre-segment" data-segment-id="<%= annotation.id %>"><%= IriSP.hc_messages.clone_segment %></a>'
             + '<p><%= IriSP.hc_messages.From_ %> <span><%= annotation.begin.toString() %></span> <%= IriSP.hc_messages.to_ %> <span><%= annotation.end.toString() %></span> (<%= IriSP.hc_messages.duration_ %> <span><%= annotation.getDuration().toString() %></span>)</p>'
             + '</div></div></div></div>'),
+        mashupstatus = '',
         addMode, currentMedia, currentSegment;
     
     IriSP.mashupcore(project, mashup);
@@ -112,6 +115,47 @@
             html += mediatemplate(_m);
         });
         $(".col-left .list-video").html(html);
+        project.getMedias().forEach(function(_m) {
+/*            var dataType = (IriSP.Model.isLocalURL(options.segment_api_endpoint) ? "json" : "jsonp");
+            $.ajax({
+                url: ,
+                dataType: dataType,
+                data: {
+                    format: dataType,
+                    iri_id: _m.id
+                },
+                success: function(data) {
+                    console.log(data);
+                    if (data.objects && data.objects.length) {
+                        var mediaid = data.objects[0].iri_id;
+                        mediasegmentscache[mediaid] = data.objects;
+                       if (currentMedia && mediaid === currentMedia.id && currentSegment) {
+                            showOtherSegments();
+                        }
+                    }
+                }
+            }); */
+            apidirectory.remoteSource({
+                url: options.segment_api_endpoint,
+                url_params: {
+                    iri_id: _m.id,
+                    limit: 0
+                },
+                serializer: IriSP.serializers.segmentapi
+            }).onLoad(function() {
+                var medias = this.getMedias(),
+                    annotations = this.getAnnotations();
+                if (medias && medias.length) {
+                    var mediaid = medias[0].id;
+                    el = $(".item-video[data-media-id='" + mediaid + "'] .media-count");
+                    el.text(annotations.length).parent().show();
+                    mediasegmentscache[mediaid] = annotations;
+                    if (currentMedia && mediaid === currentMedia.id && currentSegment) {
+                        showOtherSegments();
+                    }
+                }
+            });
+        });
     });
     
     /* Search Media with left column form */
@@ -170,6 +214,8 @@
         if (!messages.length) {
             messages.push("Le hashcut est valide !");
         }
+        mashupstatus = ' - ' + messages.join('\n - ');
+        
         $(".publier-button").toggleClass("disable", critical);
         
         $(".liste-segment .validate").removeClass("critical warning valid").addClass(mashup.status);
@@ -301,6 +347,7 @@
                 currentSegment.setEnd(currentMedia.duration);
                 currentSegment.title = IriSP.hc_messages.segment_title_placeholder;
                 currentSegment.color = currentMedia.color;
+                currentSegment.thumbnail = currentMedia.thumbnail;
                 currentSegment.created = new Date();
                 currentSegment.keywords = [];
                 currentSegment.description = "";
@@ -339,7 +386,7 @@
                 return _s.getMedia() === currentMedia && _s.annotation !== currentSegment;
             });
             var html = "",
-                k = $(".Ldt-Slider").width() / currentSegment.getMedia().duration,
+                k = $(".Ldt-Slider").width() / currentMedia.duration,
                 currentleft = k * currentSegment.begin,
                 currentwidth = k * currentSegment.getDuration();
             if (relatedSegments.length) {
@@ -362,40 +409,59 @@
                 $(".self-media-segments").hide();
             }
             $(".self-media-segments .media-segments-list").html(html);
-            
-            $(".other-media-segments").hide();
-            apidirectory.remoteSource({
-                url: options.segment_api_endpoint + currentMedia.id + "/0/" + currentMedia.duration.milliseconds + "?format=json",
-                serializer:  IriSP.serializers.ldt
-            }).onLoad(function() {
-                var medias = this.getMedias(),
-                    annotations = this.getAnnotations();
-                if (medias && medias.length && medias[0].id === currentMedia.id && annotations && annotations.length ) {
-                    var html = "";
-                    annotations.forEach(function(_a) {
-                        var pos = k * (_a.begin + _a.end) / 2,
-                            corrpos = Math.max(145, Math.min(305, pos));
-                        vizdata = {
-                            annotation : _a,
-                            currentleft : currentleft,
-                            currentwidth : currentwidth,
-                            popleft : corrpos,
-                            left : k * _a.begin,
-                            width : k * _a.getDuration(),
-                            pointerpos : (pos - corrpos)
-                        }
-                        html += mediasegmenttemplate(vizdata);
-                    });
-                    $(".other-media-segments").show();
-                    $(".other-media-segments .media-segments-list").html(html);
-                }
-            });
+            showOtherSegments();
+            project.trigger("mouseout-annotation");
         }
         if (currentMedia.elementType === "mashup") {
             showPreview();
         }
     }
-        
+    
+    /* Show Related Segments */
+    
+    function showOtherSegments() {
+        var annotations = mediasegmentscache[currentMedia.id]
+        if (annotations && annotations.length) {
+            var html = "",
+                k = $(".Ldt-Slider").width() / currentMedia.duration,
+                currentleft = k * currentSegment.begin,
+                currentwidth = k * currentSegment.getDuration();
+            annotations.forEach(function(_a) {
+                var pos = k * (_a.begin + _a.end) / 2,
+                    corrpos = Math.max(145, Math.min(305, pos));
+                vizdata = {
+                    annotation : _a,
+                    currentleft : currentleft,
+                    currentwidth : currentwidth,
+                    popleft : corrpos,
+                    left : k * _a.begin,
+                    width : k * _a.getDuration(),
+                    pointerpos : (pos - corrpos),
+                    color: currentMedia.color
+                }
+                html += mediasegmenttemplate(vizdata);
+            });
+            $(".other-media-segments").show();
+            $(".other-media-segments .media-segments-list").html(html);
+        }
+        else {
+            $(".other-media-segments").hide();
+            $(".other-media-segments .media-segments-list").html("");
+        }
+     }
+    /* Set In, Out */
+   
+    $(".Ldt-Ctrl-SetIn").click(function() {
+        if (currentMedia && currentSegment) {
+            currentSegment.setBegin(currentMedia.getCurrentTime());
+        }
+    });
+    $(".Ldt-Ctrl-SetOut").click(function() {
+        if (currentMedia && currentSegment) {
+            currentSegment.setEnd(currentMedia.getCurrentTime());
+        }
+    });
+       
     /* Segment Form interaction */
    
     $("#segment-title").on("keyup change input paste", function() {
@@ -405,6 +471,11 @@
             mashup.trigger("change");
         }
     });
+    $("#segment-title").on("focus click", function() {
+        if ($(this).val() === IriSP.hc_messages.segment_title_placeholder) {
+            $(this).val("");
+        }
+    });
     $("#segment-description").on("keyup change input paste", function() {
         if (currentMedia && currentSegment) {
             currentSegment.description = $(this).val();
@@ -482,7 +553,7 @@
         $(".media[data-media-id='" + mediaid + "']").addClass("active");
     });
     
-    project.on("mouseout-annotation", function(annotation) {
+    project.on("mouseout-annotation", function() {
         $(".media").removeClass("active");
         var mediaid = undefined;
         if (currentMedia && currentMedia.elementType === "media") {
@@ -604,10 +675,11 @@
     /* Click on current segment in Preview */
     
     $(".mashup-description .edit").click(function() {
-        if (mashupCurrentAnnotation) {
-            currentSegment = mashupCurrentAnnotation.annotation;
-            setMedia(mashupCurrentAnnotation.getMedia());
+        if (mashup.currentAnnotation) {
+            currentSegment = mashup.currentAnnotation.annotation;
+            setMedia(mashup.currentAnnotation.getMedia());
         }
+        return false;
     });
     
     /* Handling related segments */
@@ -619,22 +691,18 @@
     }).on("click", ".reprendre-segment", function() {
         var sid = $(this).attr("data-segment-id"),
             s = directory.getElement(sid) || apidirectory.getElement(sid);
-        currentSegment.title = s.title;
+        currentSegment.title = IriSP.hc_messages.copy_of_ + s.title;
         currentSegment.description = s.description;
-        $("#segment-title").val(s.title);
+        $("#segment-title").val(IriSP.hc_messages.copy_of_ + s.title);
         $("#segment-description").val(s.description);
         currentSegment.setBegin(s.begin);
         currentSegment.setEnd(s.end);
+        //TODO: ET LES TAGS !
         return false;
     });
     
     /* Changing Hashcut Title and description */
     
-    $("#hashcut-tags").tagit({
-        onTagRemoved: updateSegmentTags,
-        onTagAdded: updateSegmentTags
-    });
-    
     mashup.title = IriSP.hc_messages.mashup_title_placeholder;
     $(".title-video-wrap a").text(mashup.title);
     $("#hashcut-title").val(mashup.title);
@@ -644,37 +712,67 @@
         $(".title-video-wrap a").text(mashup.title);
         mashup.trigger("change");
     });
+    $("#hashcut-title").on("focus click", function() {
+        if ($(this).val() === IriSP.hc_messages.mashup_title_placeholder) {
+            $(this).val("");
+        }
+    });
     
     $("#hashcut-description").on("keyup change input paste", function() {
         mashup.description = $(this).val();
         mashup.trigger("change");
     });
     
-    function updateMashupTags() {
-        window.setTimeout(function() {
-            mashup.keywords = $("#segment-tags").tagit("assignedTags");
-        }, 0);
-    }
+    $("#hashcut-form").submit(function() {
+        $(".update-title").hide();
+        return false;
+    })
     
     /* Publication */
    
     $(".publier-button").click(function() {
+        if ($(this).hasClass("disable")) {
+            alert("Le Mashup ne peut pas être publié pour les raisons suivantes :\n\n"+mashupstatus);
+            return false;
+        }
         var postproject = directory.newLocalSource(),
-            anntype = new IriSP.Model.AnnotationType(false, postproject),
+            medias = mashup.getMedias()
             annotations = mashup.getOriginalAnnotations();
-        anntype.title = "hashcut-segments";
-        annotations.forEach(function(_a) {
-            _a.setAnnotationType(anntype.id);
+        postproject.addList("annotationType");
+        postproject.addList("tag");
+        medias.forEach(function(_m) {
+            var anntype = new IriSP.Model.AnnotationType(false, postproject);
+            anntype.title = "Segments from " + _m.title;
+            anntype.media = _m;
+            postproject.getAnnotationTypes().push(anntype);
         });
-        postproject.addList("media",mashup.getMedias());
-        postproject.addList("annotationType",[anntype]);
+        annotations.forEach(function(_a) {
+            _a.setAnnotationType(
+                postproject.getAnnotationTypes().filter(
+                    function(_at) { return _at.media === _a.getMedia() }
+                )[0].id);
+            var tagids = [];
+            _(_a.keywords).each(function(keyword) {
+                var tags = postproject.getTags().searchByTitle(keyword);
+                if (tags.length) {
+                    tagids.push(tags[0].id);
+                } else {
+                    var tag = new IriSP.Model.Tag(false, postproject);
+                    tag.title = tag.description = keyword;
+                    postproject.getTags().push(tag);
+                    tagids.push(tag.id);
+                }
+            });
+            _a.setTags(tagids);
+        });
         postproject.addList("annotation",annotations);
+        postproject.addList("media",medias);
         postproject.addList("mashup",[mashup]);
-        postproject.addList("tag");
-        postproject.creator = "IRI";
+        postproject.creator = "admin";
+        postproject.created = new Date();
+        postproject.modified = new Date();
         postproject.title = mashup.title;
         postproject.description = mashup.description;
-        console.log(IriSP.serializers.ldt.serialize(postproject));
         $.ajax({
             type: "POST",
             url: options.project_api_endpoint,
@@ -682,12 +780,13 @@
             contentType: "application/cinelab",
 //            headers: {"X-CSRFToken": "{{csrf_token}}"},
             success: function(data, status, request){
-                    alert("api post success");
+                console.log(request.getResponseHeader("Location"));
             },
             error: function(jqXHR, textStatus, errorThrown){
                 alert(errorThrown);
             }
         });
+        return false;
     });
     
     mashup.trigger("change");