update edition
authorAnthony Ly <anthonyly.com@gmail.com>
Fri, 07 Jun 2013 12:41:45 +0200
changeset 95 5f42ac58d262
parent 94 79c19e74a121
child 96 7cbaa8d0a7a6
child 101 e40637c085b0
update edition
integration/css/style.css
integration/data/rigoletto.json
integration/edition.html
integration/js/edition.js
--- a/integration/css/style.css	Fri Jun 07 11:32:20 2013 +0200
+++ b/integration/css/style.css	Fri Jun 07 12:41:45 2013 +0200
@@ -10,6 +10,7 @@
 h1 img{margin-right: 8px;}
 h1 a span{font-size: 16px; line-height: 20px; color: #FFF;}
 h1 span{font-size: 24px;}
+.btn-ok-chapter{margin-right: 10px;}
 .nav-bar{margin-top: 10px; }
 .nav-bar a:hover{text-decoration: none; color: #34495e;}
 section{padding-top: 20px;}
@@ -93,7 +94,10 @@
 .timeline-annotations{width: 460px;height: auto; position: relative; margin: 0; padding-top: 4px;}
 .timeline-annotations li{display: block; width: 460px;height: 12px; position: relative; padding-bottom: 4px;}
 .timeline-annotations .annotation{cursor: pointer; display:block; text-decoration:none; color:#000; text-align:center; font-size : 10px; overflow: hidden; line-height: 12px; width: 10px; height: 12px; background-color: #c0392b; position: absolute; top:0px;}
-.timeline-annotations .annotation span{display: none;}
+.timeline-annotations .annotation span, .timeline-annotations .annotation i{display: none;}
+.timeline-annotations .annotation:hover span,
+.annotation.editing span, 
+.annotation.editing i{display: inline;}
 ul.tagit{margin-left: 10px;-webkit-border-radius: 0px;
 -moz-border-radius: 0px;
 border-radius: 0px;}
--- a/integration/data/rigoletto.json	Fri Jun 07 11:32:20 2013 +0200
+++ b/integration/data/rigoletto.json	Fri Jun 07 12:41:45 2013 +0200
@@ -555,7 +555,7 @@
                 "mimetype": "application/x-ldt-slideshow",
                 "description": "",
                 "title": "Portrait de Giuseppe Verdi",
-                "slide-duration": 3000,
+                "slideduration": 3000,
                 "autostart": false,
                 "images": [
                     {
--- a/integration/edition.html	Fri Jun 07 11:32:20 2013 +0200
+++ b/integration/edition.html	Fri Jun 07 12:41:45 2013 +0200
@@ -844,10 +844,10 @@
 	</div>
 	<div class="row">
 		<div class="span6 text-right">
-			<a class="btn btn-danger btn-delete btn-delete-annotation" data-title="{{title}}" data-id="{{id}}" data-no-render>
+			<a data-title="{{title}}" title="Supprimer le chapitre" data-chapter-id="{{id}}" href="#row-list-chapter-{{id}}" class="btn btn-delete btn-danger btn-delete-chapter">
 				<i class="icon-trash"></i> Delete
 			</a>
-			<a class="btn btn-primary btn-save-annotation" data-id="{{id}}">
+			<a class="btn btn-primary btn-ok-chapter" href="#" data-id="{{id}}">
 				<i class="icon-ok"></i> Ok
 			</a>
 		</div>
@@ -857,9 +857,14 @@
 
 <script id="tpl-annotation-in-timeline" type="text/html">
 <a style="left:{{left}}px; width:{{width}}px; background-color:{{color}};" data-id="{{id}}" id="annotation-timeline-{{id}}" class="annotation">
-	<span><i class="icon-pencil"></i> édition en cours</span>
+	<i class="icon-pencil"></i> <span>{{title}}</span>
 </a>
 </script>	
+
+<script id="tpl-item-annotation-display" type="text/html">
+<li id="item-current-annotation-{{id}}" data-id="{{id}}"><a style="background-color: {{color}};" data-id="{{id}}" href="#" title="{{title}}"><i class="icon-align-left"></i></a></li>
+</script>
+
 </div><!-- /#templates -->
 
 	<script src="lib/jquery-1.9.1.min.js"></script>
--- a/integration/js/edition.js	Fri Jun 07 11:32:20 2013 +0200
+++ b/integration/js/edition.js	Fri Jun 07 12:41:45 2013 +0200
@@ -29,7 +29,11 @@
     var idAnnotation = $(this).attr('data-id'),
         annotation = _.find(annotations, function(c){ return c.id == idAnnotation; });
     myMedia.setCurrentTime(annotation.begin);
-    openTab(annotation.type, annotation);
+    if($('#tab-annotation-'+idAnnotation).length){
+        $('a[href=#tab-annotation-'+idAnnotation+']').tab('show');
+    }else{
+        openTab(annotation.type, annotation);
+    }
 });
 
 myProject.onLoad(function() {
@@ -86,10 +90,10 @@
             url_transform: function(src) {
                 return [{
                     type: "video/mp4",
-                    src: src.replace(/\.[\d\w]+$/,'.mp4')
+                    src: src.replace(/\.[\d\w]+$/,'.mp4').replace('rtmp://media.iri.centrepompidou.fr/ddc_player', 'http://media.iri.centrepompidou.fr')
                 }, {
                     type: "video/webm",
-                    src: src.replace(/\.[\d\w]+$/,'.webm')
+                    src: src.replace(/\.[\d\w]+$/,'.webm').replace('rtmp://media.iri.centrepompidou.fr/ddc_player', 'http://media.iri.centrepompidou.fr')
                 }];
             }
         }
@@ -125,19 +129,8 @@
         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))
-                                )
-                        );
+                var itemAnnotation = getTemplate('#tpl-item-annotation-display');
+                itemAnnotation = Mustache.render(itemAnnotation, v);
                 $('.list-current-annotations').append(itemAnnotation)
             }
         }
@@ -158,8 +151,8 @@
 }
 
 function showCurrentAnnotationInTimeline(idAnnotation){
-    $('.timeline-annotations .annotation span').hide();
-    $('#annotation-timeline-'+idAnnotation+' span').show();
+    $('.annotation').removeClass('editing');
+    $('#annotation-timeline-'+idAnnotation).addClass('editing');
 }
 //display annotation view
 $('.list-current-annotations').on('click', 'a', function(e){
@@ -249,6 +242,7 @@
             var idChapter = $(this).parents('form').attr('data-chapter-id');
             $('.chapter-segments').find('#'+idChapter).text(value);
             $('#row-list-chapter-'+idChapter).find('td:first').text(value);
+            $(this).parents('form').find('.btn-delete-chapter').attr('data-title', value);
         }
     });
 
@@ -280,7 +274,7 @@
         return $('#templates').find(idTpl).html();
     }
 //supprimer
-$('.list-chapter-wrap').on('click', '.btn-delete-chapter', function(e){
+$(document).on('click', '.btn-delete-chapter', function(e){
     e.preventDefault();
 
     if(chapters.length == 1){alert('Le projet doit contenir au moins un chapitre.'); return;}
@@ -290,6 +284,10 @@
     btnDeleteModal.attr('data-id', idChapter);
 
 });
+$(document).on('click', '.btn-ok-chapter', function(e){
+    e.preventDefault();
+    $('.form-chapter-edit').remove();
+})
 
 function deleteChapter(idChapter){
     disabledPreview();
@@ -339,12 +337,12 @@
         e.preventDefault();
 
         var dataChapter = {
-                title : 'New',
-                begin : myMedia.currentTime,
-                end : organizeNewChapter(myMedia.currentTime),
-                description : 'description',
-                keywords : ['tag1','tag2']
-            };
+            title : 'New',
+            begin : myMedia.currentTime,
+            end : organizeNewChapter(myMedia.currentTime),
+            description : 'description',
+            keywords : ['tag1','tag2']
+        };
 
         newChapter(dataChapter, true);
 
@@ -447,20 +445,13 @@
                     left : left,
                     width : width,
                     color : v.color,
-                    id : v.id
+                    id : v.id,
+                    title : v.title
                 },
                 segment = getTemplate('#tpl-annotation-in-timeline');
                 segment = Mustache.render(segment, dataAnntim);
 
-                /*
-                segment = $('<a>').css({
-                    left : left,
-                    width : width,
-                    backgroundColor : v.color
-                }).addClass('annotation')
-                .attr('data-id', v.id)
-                .attr('id', 'annotation-timeline-'+v.id);
-                */
+
             var isInTimeline = false;
             $.each(timeline.find('li'), function(a, b){
                 if(isInTimeline) return;
@@ -525,6 +516,7 @@
             var idAnnotation = $(this).parents('form').attr('data-id');
             $('#onglet-title-'+idAnnotation).text(value);
             $(this).parents('form').find('.btn-delete-annotation').attr('data-title', value);
+            $('#annotation-timeline-'+ idAnnotation+' span').text(value);
         }
     });
 
@@ -564,6 +556,7 @@
         
         var dataView;
         if(_.isUndefined(data)){//nouveau
+
             var currentTimePlusUnMin = 60 * 1000 + myMedia.currentTime,
                 endAnnotation = (currentTimePlusUnMin<myMedia.duration) ? currentTimePlusUnMin : myMedia.duration;
             var dataAnnotation = {
@@ -635,6 +628,7 @@
                     break;
 
                 case 'slideshow': 
+                    console.log(currentAnnotation)
                     $(tabContent).find('.number-spin').val(dataView.content.slideduration/1000);
                     $(tabContent).find('.number-spin').spin(spinParam);
                     $(tabContent).find('.ui-sortable').sortable({
@@ -869,10 +863,10 @@
 });
 function addLinkRow(tbody, dataView){
 
-        //head commun à tous
-        var tplLinkRow = getTemplate('#tpl-links-row');
-        var output = Mustache.render(tplLinkRow, dataView);
-        tbody.append(output);
+    //head commun à tous
+    var tplLinkRow = getTemplate('#tpl-links-row');
+    var output = Mustache.render(tplLinkRow, dataView);
+    tbody.append(output);
 
 }
 $('.tab-content').on('keyup', '.links-rows input', function(e){
@@ -922,15 +916,15 @@
 $('.btn-save-project').bind('click', function(e){
     $('.btn-apercu-projet').removeClass('disabled');
 
-    console.log(JSON.parse(myProject.serialize()));
-/*
+    console.log(myProject.serialize());
+
     $.ajax({
         type: "POST",
         url: urlSaveProject,
         data: myProject.serialize(),
         contentType: "application/cinelab",
         headers: {
-            //"X-CSRFToken": options.csrf_token
+            "X-CSRFToken": tokenSaveProject
         },
         success: function(data, status, request){
             console.log('data : ', data);
@@ -942,7 +936,7 @@
             alert(gettext("Server error\nYour hashcut couldn't be published"));
         }
     });
-*/
+
 
 });
 
@@ -1057,7 +1051,7 @@
             content = {
                 mimetype : "application/x-ldt-text",
                 markup : "html",
-                text : "azerty"
+                text : ""
             };
             break;
         case 'links':