diff -r abd04f346dbe -r 0e02c3a28491 integration/js/edition.js
--- a/integration/js/edition.js Fri May 17 12:41:30 2013 +0200
+++ b/integration/js/edition.js Tue May 21 16:40:05 2013 +0200
@@ -3,10 +3,12 @@
var global = {
diaporama : null,
idAnnotation : null,
- beginCurrentChapter : 0,
- mediaDuration : 0,
- colors : ['#1abc9c', '#3498db', '#9b59b6', '#f1c40f', '#e67e22', '#e74c3c']
+ colors : ['#f39c12', '#2ecc71', '#3498db', '#9b59b6',
+ '#f1c40f', '#e67e22', '#e74c3c', '#ecf0f1',
+ '#16a085', '#27ae60', '#2980b9', '#8e44ad', '#2c3e50',
+ '#f39c12', '#d35400', '#c0392b', '#bdc3c7', '#7f8c8d']
},
+currentChapter = null,
chapters = [],
annotations = [];
@@ -31,9 +33,6 @@
myMedia.on("timeupdate", function(t) {
- //init
- global.mediaDuration = myMedia.duration.milliseconds;
-
//curseur chapitre
var wContainer = $('.chapitre-cut-wrap').width() - 1,
pos = wContainer * t / myMedia.duration,
@@ -47,6 +46,7 @@
btnCutChapter.css("left",pos);
}
+ /*
//chapitre edit
var formChapter = $('.form-chapter-edit'),
inputBeginChapter = formChapter.find('input[name=begin]'),
@@ -55,7 +55,7 @@
viewBeginChapter = formChapter.find('.begin'),
viewDurationChapter = formChapter.find('.duration'),
viewEndChapter = formChapter.find('.end'),
- timeBegin = global.beginCurrentChapter,
+ timeBegin = 0,
timeEnd = t.milliseconds,
timeDuration = timeEnd - timeBegin;
@@ -65,6 +65,7 @@
viewBeginChapter.html(millisecondsToString(timeBegin));
viewDurationChapter.html(millisecondsToString(timeDuration));
viewEndChapter.html(millisecondsToString(timeEnd));
+ */
});//timeupdate
});//myProject.onLoad
@@ -81,13 +82,15 @@
if(idAnnotation !== undefined){
global.idAnnotation = idAnnotation;
}
- })
+ });
+
//edition image
$('.popup').on('change', '#media-type-select', function(e){
var typeImage = $(this).val();
$('.input-image-url, .input-image-upload').hide();
$('.input-image-'+typeImage).show();
});
+
//bibliotheque
//video
$('.popup').on('click', '.bibliotheque-video a', function(e){
@@ -108,16 +111,16 @@
$('.popup').modal('hide');
});
- $(document).on('click','.btn-delete', function(e){
+ $(document).on('click','.btn-delete-annotation', function(e){
e.preventDefault();
//si c'est une annotation et que la tab est ouverte, on la ferme
var type = $(this).attr('data-type');
- if(type == 'annotation'){
- var idAnnotation = $(this).attr('data-id');
- $('a[href=#annotation-'+idAnnotation+']').closest('li').remove();
- $('.tab-content #annotation'+idAnnotation).remove();
- $('#tab-list-annotation').tab('show');
- }
+
+ var idAnnotation = $(this).attr('data-id');
+ $('a[href=#annotation-'+idAnnotation+']').closest('li').remove();
+ $('.tab-content #annotation'+idAnnotation).remove();
+ $('#tab-list-annotation').tab('show');
+
});
//confirmation suppression
@@ -157,37 +160,92 @@
});
//--chapter
- $('.list-chapter-wrap').on('click', '.edit-chapter', function(e){
+
+//edit
+ $('.list-chapter-wrap').on('click', '.btn-edit-chapter', function(e){
e.preventDefault();
- var viewChapter = {
- titre : 'titre du chapitre',
- tags : 'tag 1, tag 2, tag 3',
- description : 'lorem ipsum'
+ var idChapter = $(this).attr('data-chapter-id');
+ loadFormChapter(idChapter);
+ currentChapter = _.find(chapters, function(c){ return c.id == idChapter; });
+ });
+
+
+ $('.chapter-widget-info').on('keyup', 'input[name=title], textarea', function(e){
+ var name = $(this).attr('name'),
+ value = $(this).val();
+ currentChapter[name] = value;
+ if(name == 'title'){
+ var idChapter = $(this).parents('form').attr('data-chapter-id');
+ $('.chapter-segments').find('#'+idChapter).text(value);
+ $('#row-list-chapter-'+idChapter).find('td:first').text(value);
}
-
+ });
+
+ function onTagItChange(e, ui) {
+ var idChapter = $(this).parents('form').attr('data-chapter-id'),
+ value = $('input[name=tags]').val();
+ currentChapter.tags = value;
+ $('#row-list-chapter-'+idChapter).find('.list-chapter-tags').text(value);
+ }
+
+ var tagitParam = {
+ afterTagRemoved : onTagItChange,
+ afterTagAdded : onTagItChange
+ }
+
+ function loadFormChapter(idChapter){
+ var chapterData = _.find(chapters, function(c){ return c.id == idChapter; }),
+ chapterWrap = $('.chapter-widget-info');
+
+ currentChapter = chapterData;
+
$.get('template.html', function(templates){
var tpl = $(templates).filter('#tpl-chapter-edit').html();
- var tpl = Mustache.render(tpl, viewChapter);
- $('.form-chapter-edit').empty().append(tpl);
- $('.form-chapter-edit').find('.tag-it').tagit();
+ tpl = Mustache.render(tpl, chapterData);
+ chapterWrap.empty().append(tpl);
+ chapterWrap.find('.tag-it').tagit(tagitParam);
});
- });
- //nouveau chapitre
+ }
+
+
+//supprimer
+$('.list-chapter-wrap').on('click', '.btn-delete-chapter', function(e){
+ e.preventDefault();
+
+ if(chapters.length == 1){alert('Le projet doit contenir au moins un chapitre.'); return;}
+ var idChapter = $(this).attr('data-chapter-id'),
+ chapter = _.find(chapters, function(c){ return c.id == idChapter; }),
+ indexChapter = _.indexOf(chapters, chapter),
+ chapterModify;
+ if(indexChapter == 0){
+ chapterModify = chapters[1];
+ chapterModify.begin = 0;
+ chapterModify.duration = chapterModify.end;
+ }else{
+ chapterModify = chapters[indexChapter-1];
+ chapterModify.end = chapter.end;
+ chapterModify.duration = chapterModify.end - chapterModify.begin;
+ }
+ 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();
+ }
+});
+
+//nouveau chapitre
$('.chapter-widget').on('click', '.btn-cut-chapter', function(e){
e.preventDefault();
var uniqId = 'id' + (new Date()).getTime();
-
- var formChapter = $('.form-chapter-edit'),
- title = formChapter.find('input[name=title]').val(),
- tags = formChapter.find('input[name=tags]').val(),
- begin = formChapter.find('input[name=begin]').val(),
- duration = formChapter.find('input[name=duration]').val(),
- end = formChapter.find('input[name=end]').val(),
- beginString = millisecondsToString(begin),
- durationString = millisecondsToString(duration),
- endString = millisecondsToString(end),
- description = formChapter.find('textarea[name=description]').val(),
+
+ var title = 'New',
+ tags = 'tag',
+ begin = myMedia.currentTime.milliseconds,
+ end = organizeNewChapter(begin),
+ duration = end - begin,
+ description = '',
id = uniqId;
var dataChapter = {
@@ -197,48 +255,72 @@
duration : duration,
end : end,
description : description,
- beginString : beginString,
- durationString : durationString,
- endString : endString,
- id : id
+ color : global.colors[chapters.length],
+ id : uniqId
};
-
- addChapter(dataChapter);
+
+ chapters.push(dataChapter);
+ renderChapter();
+ loadFormChapter(id);
});
+
+ function organizeNewChapter(beginNew){
- function addChapter(dataChapter){
- chapters.push(dataChapter);
+ var returnEnd;
+ $.each(chapters, function(k, v){
+ var begin = v.begin,
+ end = v.end;
+ if(beginNew>=begin && beginNew<=end){
+ v.end = beginNew;
+ v.duration = v.end - v.begin;
+ returnEnd = end;
+ }
+ });
+ return returnEnd;
+ }
+
+ function renderChapter(){
+ var chapterSegmentWrap = $('.chapter-segments'),
+ wChapterSegmentWrap = chapterSegmentWrap.width(),
+ chapterList = $('.list-chapter-rows-wrap');
- //vue liste chapitre
- $.get('template.html', function(templates){
- var tplChapterRow = $(templates).filter('#tpl-chapter-row').html();
- tplChapterRow = Mustache.render(tplChapterRow, dataChapter);
- $('.list-chapter-rows-wrap').append(tplChapterRow);
-
- updateChapterSegments();
+ chapters = _.sortBy(chapters, function(c){
+ return c.begin;
});
- }
-
- function updateChapterSegments(){
- var chapterSegmentWrap = $('.chapter-segments'),
- wChapterSegmentWrap = chapterSegmentWrap.width();
chapterSegmentWrap.empty();
+ chapterList.empty();
$.each(chapters, function(k, v){
- var chapter = v,
+
+ //segments
color = global.colors[k],
- width = chapter.duration * wChapterSegmentWrap / global.mediaDuration,
- segment = $(''+chapter.title+'').css({
+ width = Math.floor(v.duration * wChapterSegmentWrap / myMedia.duration.milliseconds),
+ segment = $(''+v.title+'').css({
width : width,
- backgroundColor : color
- }).attr('id', chapter.id);
- chapterSegmentWrap.append(segment)
+ backgroundColor : v.color
+ }).attr('id', v.id);
+
+ chapterSegmentWrap.append(segment);
+
+ //liste
+ $.get('template.html', function(templates){
+
+ v.beginString = millisecondsToString(v.begin);
+ v.durationString = millisecondsToString(v.duration);
+ v.endString = millisecondsToString(v.end);
+
+ var tplChapterRow = $(templates).filter('#tpl-chapter-row').html();
+ tplChapterRow = Mustache.render(tplChapterRow, v);
+ chapterList.append(tplChapterRow);
+
+ });
});
}
- function loadChapters(){
- //nouveau projet, 1 chapitre
+//init
+ function loadChapters(){//nouveau projet, 1 chapitre
+
var uniqId = 'id' + (new Date()).getTime();
var title = 'chapitre 1',
@@ -246,9 +328,6 @@
begin = 0,
duration = myMedia.duration.milliseconds,
end = myMedia.duration.milliseconds,
- beginString = millisecondsToString(begin),
- durationString = millisecondsToString(duration),
- endString = millisecondsToString(end),
description = 'description du chapitre 1',
id = uniqId;
@@ -259,15 +338,18 @@
duration : duration,
end : end,
description : description,
- beginString : beginString,
- durationString : durationString,
- endString : endString,
+ color : global.colors[chapters.length],
id : id
};
- addChapter(dataChapter);
+ chapters.push(dataChapter);
+ renderChapter();
}
+
+
+
+
//edit annotation
$('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){
e.preventDefault();