add integration modifs
authorcavaliet
Tue, 04 Jun 2013 17:17:17 +0200
changeset 77 0e4fa3991906
parent 76 1c57dae87b57
child 78 5dddae65a99a
add integration modifs
src/metadatacomposer/static/metadatacomposer/css/style.css
src/metadatacomposer/static/metadatacomposer/js/common.js
src/metadatacomposer/static/metadatacomposer/js/edition.js
src/metadatacomposer/static/metadatacomposer/js/tangle.js
src/metadatacomposer/templates/metadatacomposer_home.html
--- a/src/metadatacomposer/static/metadatacomposer/css/style.css	Tue Jun 04 17:03:45 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/css/style.css	Tue Jun 04 17:17:17 2013 +0200
@@ -1,4 +1,8 @@
 .wrap{color: #2c3e50;}
+.vignette-projet{position: relative;}
+.vignette-projet:hover a{display: block;}
+.vignette-projet a{ display:none;position: absolute; width: 50%; height: 100%; font-size: 50px; text-align: center; line-height: 140px; text-decoration: none;}
+.vignette-projet a.btn-apercu{right: 0; top: 0;}
 header{background-color: #2980b9;height: 60px;border-bottom: 1px solid #E5E5E5;}
 header .row > div{margin-bottom: 0; }
 h1{color: #FFF;}
@@ -49,8 +53,8 @@
 .chapitre-cut-wrap{position: relative; height: 50px; margin-bottom: 10px;}
 .btn-cut-chapter{position: absolute;top: 20px;left: 11px; width: 40px;}
 .indicateur-chapter, .indicateur-annotation{z-index:100; left:10px; width: 1px; height: 100%;background-color: #000; position: absolute;}
-.chapter-segments {width: 100%; height: 20px; margin: 0;}
-.chapter-segments li{cursor:pointer; float: left; list-style: none; line-height: 20px; height: 20px; text-align: center; overflow: hidden;}
+.chapter-segments {overflow:hidden; width: 100%; height: 20px; margin: 0; position: relative;}
+.chapter-segments li{position: absolute; top: 0; cursor:pointer; float: left; list-style: none; line-height: 20px; height: 20px; text-align: center; overflow: hidden;}
 .list-chapter-wrap, .list-annotation-wrap, .section{background-color: #F5F5F5; border: 1px solid #E5E5E5;}
 .list-chapter-wrap table, .list-annotation-wrap table{margin-bottom: 0;}
 .list-chapter-wrap h4, .form-chapter-edit h4, .list-annotation-wrap h4, .title-section{padding: 10px; border-bottom: 1px solid; margin-bottom: 10px;}
@@ -83,8 +87,8 @@
 .html-apercu{overflow: auto; margin-top: 10px;}
 .input-image-url{display: none;}
 .timeline-annotations-wrap{position: relative;background-color: #202020;}
-.timeline-annotations{width: 460px;height: auto; position: relative; margin: 0; padding: 10px 0;}
-.timeline-annotations li{display: block; width: 460px;height: 10px; position: relative;}
+.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;}
 ul.tagit{margin-left: 10px;-webkit-border-radius: 0px;
 -moz-border-radius: 0px;
--- a/src/metadatacomposer/static/metadatacomposer/js/common.js	Tue Jun 04 17:03:45 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/common.js	Tue Jun 04 17:17:17 2013 +0200
@@ -40,6 +40,7 @@
         if($(this).hasClass('btn-cancel')){
             $(this).parents('.popup').modal('hide');
         }
+
     });
 
 //confirmation suppression
@@ -53,11 +54,7 @@
     });
 
     $("#modal-confirm").on('shown', function() {
-        $("#modal-confirm #btn-delete-modal").focus()
-    });
-    
-    $("#modal-confirm").on('click', '#btn-delete-modal', function(e){
-
+        $("#modal-confirm #btn-delete-modal").focus();
     });
     
 });
\ No newline at end of file
--- a/src/metadatacomposer/static/metadatacomposer/js/edition.js	Tue Jun 04 17:03:45 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/edition.js	Tue Jun 04 17:17:17 2013 +0200
@@ -181,9 +181,22 @@
 
     //confirmation suppression
     $("#modal-confirm").on('click', '#btn-delete-modal', function(e){
+        
+        var typeDelete = $(this).attr('data-type-delete'),
+            idAnnotation = $(this).attr('data-id');
 
+        if(typeDelete == 'chapter' || typeDelete == 'annotation'){
+            e.preventDefault();
+            if(typeDelete == 'chapter') deleteChapter(idAnnotation);
+            if(typeDelete == 'annotation') deleteAnnotation(idAnnotation);
+        }
     });
 
+//--apercu projet
+$(document).on('click', '.btn-apercu-projet.disabled', function(e){
+    e.preventDefault();
+});
+
 //--title-editor
     $(document).on('click', '.project-title-editor i, .project-title', function () {
         var html = $('.project-title').html();
@@ -256,7 +269,12 @@
     e.preventDefault();
 
     if(chapters.length == 1){alert('Le projet doit contenir au moins un chapitre.'); return;}
-
+    var idChapter = $(this).attr('data-chapter-id'),
+        btnDeleteModal = $("#modal-confirm #btn-delete-modal");
+    btnDeleteModal.attr('data-type-delete', 'chapter');
+    btnDeleteModal.attr('data-id', idChapter);
+   // $("#modal-confirm #btn-delete-modal").attr('onclick', 'deleteChapter("'+idChapter+'")')
+/*
     var idChapter = $(this).attr('data-chapter-id'),
         chapter = _.find(chapters, function(c){ return c.id == idChapter; }),
         indexChapter = _.indexOf(chapters, chapter),
@@ -275,8 +293,31 @@
     if($('#form-chapter-edit-'+idChapter).length){
         $('#form-chapter-edit-'+idChapter).remove();
     }
+*/
+
 });
 
+function deleteChapter(idChapter){
+    $("#modal-confirm").modal('hide')
+    var chapter = _.find(chapters, function(c){ return c.id == idChapter; }),
+        indexChapter = _.indexOf(chapters, chapter),
+        chapterModify;
+    if(indexChapter == 0){
+        chapterModify = chapters[1];
+        chapterModify.setBegin(0);
+    }else{
+        chapterModify = chapters[indexChapter-1];
+        //var newEnd = new IriSP.Model.Time(chapter.end)
+        chapterModify.setEnd(chapter.end);
+    }
+    chapters = _(chapters).reject(function(c) { return c.id == idChapter; });
+    renderChapter();
+    //si le formulaire est visible
+    if($('#form-chapter-edit-'+idChapter).length){
+        $('#form-chapter-edit-'+idChapter).remove();
+    }
+}
+
 function getRandomColor(){
     return global.colors[(global.colorsIndex<global.colors.length) ? global.colorsIndex++ : (global.colorsIndex=0)];
 }
@@ -341,8 +382,10 @@
             $.each(chapters, function(k, v){
 
                 //segments
-                var width = Math.floor(v.getDuration() * wChapterSegmentWrap / myMedia.duration),
+                var width = v.getDuration() * wChapterSegmentWrap / myMedia.duration,
+                    left = v.begin * wChapterSegmentWrap / myMedia.duration,
                     segment = $('<li>'+v.title+'</li>').css({
+                        left : left,
                         width : width,
                         backgroundColor : v.color
                     }).attr('id', v.id);
@@ -433,6 +476,7 @@
             
            
             //liste
+                v.iconTab = getIcon(v.type);
                 var tplAnnotationRow = getTemplate('#tpl-list-annotation-row');
                 tplAnnotationRow = Mustache.render(tplAnnotationRow, v);
                 annotationList.append(tplAnnotationRow);
@@ -469,14 +513,25 @@
     //delete annotation
     $(document).on('click','.btn-delete-annotation', function(e){
         e.preventDefault();
-
+        /*
         var idAnnotation = $(this).attr('data-id');
         annotations = _(annotations).reject(function(c) { return c.id == idAnnotation; });
         closeTab(idAnnotation);
         if(!$(this).hasAttr('data-no-render'))//si on ferme à partir de la tab renderAnnotation sera appelé 2 fois
             renderAnnotation();
+        */
+        var idAnnotation = $(this).attr('data-id'),
+            btnDeleteModal = $("#modal-confirm #btn-delete-modal");
+        btnDeleteModal.attr('data-type-delete', 'annotation');
+        btnDeleteModal.attr('data-id', idAnnotation);
+    });
 
-    });
+    function deleteAnnotation(idAnnotation){
+        $("#modal-confirm").modal('hide');
+        annotations = _(annotations).reject(function(c) { return c.id == idAnnotation; });
+        closeTab(idAnnotation);
+        renderAnnotation();
+    }
 
 //tab
     $('#onglet-annotations').on('click', 'a', function(e){
--- a/src/metadatacomposer/static/metadatacomposer/js/tangle.js	Tue Jun 04 17:03:45 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/tangle.js	Tue Jun 04 17:17:17 2013 +0200
@@ -34,11 +34,15 @@
     function updateRenderChapter(chapterData){
         var segment = $('.chapter-segments li#'+chapterData.id),
             wChapterSegmentWrap = $('.chapter-segments').width(),
-            wSegmentNew = Math.floor(chapterData.getDuration() * wChapterSegmentWrap / myMedia.duration),
+            wSegmentNew = chapterData.getDuration() * wChapterSegmentWrap / myMedia.duration,
+            lSegmentNew = chapterData.begin * wChapterSegmentWrap / myMedia.duration,
             row = $('#row-list-chapter-'+chapterData.id),
             form = ($('#form-chapter-edit-'+chapterData.id).length) ? $('#form-chapter-edit-'+chapterData.id) : false;
 
-        segment.width(wSegmentNew);
+        segment.css({
+            width : wSegmentNew,
+            left : lSegmentNew
+        });
 
         row.find('.begin').text(chapterData.begin);
         row.find('.duration').text(chapterData.getDuration());
--- a/src/metadatacomposer/templates/metadatacomposer_home.html	Tue Jun 04 17:03:45 2013 +0200
+++ b/src/metadatacomposer/templates/metadatacomposer_home.html	Tue Jun 04 17:17:17 2013 +0200
@@ -57,8 +57,12 @@
                 <div class="row">
                   {% for p in projects %}
                     <div class="span2">
-                        <a href="{% url 'composer_edit' branding=branding ldt_id=p.ldt_id %}">{% thumbnail p.image "140x140" crop="center" format="PNG" as im %}<img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" />{% empty %}<img src="{% static 'metadatacomposer/img/140x140.gif' %}" width="140px" height="140px" />{% endthumbnail %}
-                        <h4>{{ p.title }}</h4></a>
+                        <div class="vignette-projet">
+	                        <a class="btn-editer" title="éditer le projet" href="{% url 'composer_edit' branding=branding ldt_id=p.ldt_id %}"><i class="icon-pencil"></i></a>
+	                        <a class="btn-apercu" title="voir le projet" href="{% url 'composer_preview_player' branding=branding ldt_id=p.ldt_id %}"><i class="icon-eye-open"></i></a>
+	                        {% thumbnail p.image "140x140" crop="center" format="PNG" as im %}<img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" />{% empty %}<img src="{% static 'metadatacomposer/img/140x140.gif' %}" width="140px" height="140px" />{% endthumbnail %}
+	                    </div>
+                        <h4><a href="#">{{ p.title }}</a></h4>
                     </div>
                   {% endfor %}
                 </div>