update slideshow row
authorAnthony Ly <anthonyly.com@gmail.com>
Tue, 18 Jun 2013 15:51:39 +0200
changeset 136 ac4dc3d6400b
parent 135 60ca0705ec30
child 137 3246a70209f0
update slideshow row
integration/edition.html
integration/js/edition.js
--- a/integration/edition.html	Tue Jun 18 15:18:30 2013 +0200
+++ b/integration/edition.html	Tue Jun 18 15:51:39 2013 +0200
@@ -402,10 +402,10 @@
 <tr id="rid-{{ridid}}" class="row-image-slideshow">
 	<td class="image-slideshow-row"><img data-url="{{url}}" src="{{url}}?width=60&height=60" alt="{{title}}"> </td>
 	<td class="title-slideshow-row" data-input="input" data-name="title">
-		<span>{{title}}</span> <i class="icon-pencil"></i>
+		<span>{{#limitLength}}{{title}}{{/limitLength}}</span> <i class="icon-pencil"></i>
 	</td>
 	<td class="description-slideshow-row" data-input="textarea" data-name="description">
-		<span>{{description}}</span> <i class="icon-pencil"></i>
+		<span>{{#limitLength}}{{description}}{{/limitLength}}</span> <i class="icon-pencil"></i>
 	</td>
 	<td>
 		<table>
--- a/integration/js/edition.js	Tue Jun 18 15:18:30 2013 +0200
+++ b/integration/js/edition.js	Tue Jun 18 15:51:39 2013 +0200
@@ -4,7 +4,8 @@
         currentChapter = undefined,
         currentAnnotation = undefined,
         currentSlider = undefined,
-        secMiniChapter = 10;
+        secMiniChapter = 10,
+        lengthStringDiapo = 40;
 
 /* Colors */
     var annotationsColors = {
@@ -220,7 +221,7 @@
 
     $(document).on('click', '.project-title-editor i, .project-title', function () {
         
-        var html = $('.project-title').html();
+        var html = myProject.title;
         var input = $('<input type="text" />');
         input.val(html);
         $('.project-title').replaceWith(input);
@@ -486,7 +487,7 @@
             case 'slideshow': 
                 content = {
                     mimetype : "application/x-ldt-slideshow",
-                    slideduration : 1000,
+                    slideduration : 3000,
                     autostart : false,
                     images : []
                 };
@@ -702,7 +703,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({
@@ -854,18 +855,28 @@
 
     function addImageToSlideshow(slideshow, dataView){
         var tplDiapo = getTemplate('#tpl-slideshow-row');
+        dataView.limitLength = function(){
+            return function(text, render) {
+                if(render(text).length > lengthStringDiapo){
+                    return render(text).substr(0,lengthStringDiapo) + '...';
+                }else{
+                    return render(text);
+                }
+            }
+        }
         tplDiapo = Mustache.render(tplDiapo, dataView);
         slideshow.append(tplDiapo);
         disabledBtnSortable(slideshow);
     };
 
     //edit 
-    $('.tab-content').on('click', '.title-slideshow-row, .description-slideshow-row, .video-title-edit, .video-description-edit', function(){
+    $('.tab-content').on('click', '.title-slideshow-row, .description-slideshow-row', function(){
         if($(this).find('input').length) return;
-        var html = $(this).find('span').html(),
+        var index = $(this).parents('.row-image-slideshow').index(),
             inputType = $(this).attr('data-input'),
             name = $(this).attr('data-name'),
-            input = $('<'+inputType+'>').attr('name', name);
+            input = $('<'+inputType+'>').attr('name', name),
+            html = currentAnnotation.content.images[index][name];
         input.val(html);
         $(this).find('span').replaceWith(input);
         input.focus().keypress(function(e){
@@ -877,19 +888,14 @@
     $(document).on('blur', '.title-slideshow-row input, .description-slideshow-row textarea', function(){
         var newValue = $(this).val(),
             name = $(this).attr('name'),
-            span = $('<span>').html(newValue),
             indexRow = $(this).parents('.row-image-slideshow').index();
-        $(this).replaceWith(span);
         currentAnnotation.content.images[indexRow][name] = newValue;
-        disabledPreview();
-    });
-
-    $(document).on('blur', '.video-title-edit input, .video-description-edit textarea', function(){
-        var newValue = $(this).val(),
-            name = $(this).attr('name'),
-            span = $('<span>').html(newValue);
+        if(newValue.length>lengthStringDiapo){
+            newValue = newValue.substr(0,lengthStringDiapo) + '...';
+        }
+        var span = $('<span>').html(newValue);
         $(this).replaceWith(span);
-        currentAnnotation.content[name] = newValue;
+        
         disabledPreview();
     });