--- a/src/metadatacomposer/static/metadatacomposer/js/edition.js Fri May 24 17:23:35 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/edition.js Fri May 24 17:24:11 2013 +0200
@@ -1,16 +1,23 @@
+var myMedia = null,
+ currentChapter = null,
+ chapters = [],
+ annotations = [];
+
$(function(){
var global = {
diaporama : null,
idAnnotation : null,
- colors : ['#f39c12', '#2ecc71', '#3498db', '#9b59b6',
- '#f1c40f', '#e67e22', '#e74c3c', '#ecf0f1',
- '#16a085', '#27ae60', '#2980b9', '#8e44ad', '#2c3e50',
- '#f39c12', '#d35400', '#c0392b', '#bdc3c7', '#7f8c8d']
-},
-currentChapter = null,
-chapters = [],
-annotations = [];
+ colorsIndex : 0,
+ colors :
+ ['#f39c12', '#2ecc71', '#3498db', '#9b59b6',
+ '#f1c40f', '#e67e22', '#e74c3c', '#ecf0f1',
+ '#16a085', '#27ae60', '#2980b9', '#8e44ad',
+ '#f39c12', '#d35400', '#c0392b', '#bdc3c7']
+};
+
+
+
myProject.onLoad(function() {
@@ -18,7 +25,7 @@
myMedia = myProject.getCurrentMedia();
- loadChapters();
+ loadInitChapters();
IriSP.htmlPlayer(
myMedia,
@@ -45,27 +52,6 @@
}else{
btnCutChapter.css("left",pos);
}
-
- /*
- //chapitre edit
- var formChapter = $('.form-chapter-edit'),
- inputBeginChapter = formChapter.find('input[name=begin]'),
- inputDurationChapter = formChapter.find('input[name=duration]'),
- inputEndChapter = formChapter.find('input[name=end]'),
- viewBeginChapter = formChapter.find('.begin'),
- viewDurationChapter = formChapter.find('.duration'),
- viewEndChapter = formChapter.find('.end'),
- timeBegin = 0,
- timeEnd = t.milliseconds,
- timeDuration = timeEnd - timeBegin;
-
- inputBeginChapter.val(timeBegin);
- inputEndChapter.val(timeEnd);
- inputDurationChapter.val(timeDuration);
- viewBeginChapter.html(millisecondsToString(timeBegin));
- viewDurationChapter.html(millisecondsToString(timeDuration));
- viewEndChapter.html(millisecondsToString(timeEnd));
- */
});//timeupdate
});//myProject.onLoad
@@ -166,7 +152,6 @@
e.preventDefault();
var idChapter = $(this).attr('data-chapter-id');
loadFormChapter(idChapter);
- currentChapter = _.find(chapters, function(c){ return c.id == idChapter; });
});
$('.chapter-segments').on('click', 'li', function(){
@@ -187,8 +172,8 @@
function onTagItChange(e, ui) {
var idChapter = $(this).parents('form').attr('data-chapter-id'),
- value = $('input[name=tags]').val();
- currentChapter.tags = value;
+ value = $('input[name=keywords]').val();
+ currentChapter.keywords = value;
$('#row-list-chapter-'+idChapter).find('.list-chapter-tags').text(value);
}
@@ -198,14 +183,18 @@
}
function loadFormChapter(idChapter){
- var chapterData = _.find(chapters, function(c){ return c.id == idChapter; }),
- chapterWrap = $('.chapter-widget-info');
+ currentChapter = _.find(chapters, function(c){ return c.id == idChapter; });
+ var chapterWrap = $('.chapter-widget-info'),
+ indexChapter = _.indexOf(chapters, currentChapter),
+ beginTangle = (indexChapter>0) ? true : false,
+ endTangle = (indexChapter<(chapters.length-1)) ? true : false;
- currentChapter = chapterData;
+ currentChapter.beginTangle = beginTangle;
+ currentChapter.endTangle = endTangle;
$.get('template.html', function(templates){
var tpl = $(templates).filter('#tpl-chapter-edit').html();
- tpl = Mustache.render(tpl, chapterData);
+ tpl = Mustache.render(tpl, currentChapter);
chapterWrap.empty().append(tpl);
chapterWrap.find('.tag-it').tagit(tagitParam);
});
@@ -217,18 +206,18 @@
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;
+ chapterModify.setBegin(0);
}else{
chapterModify = chapters[indexChapter-1];
- chapterModify.end = chapter.end;
- chapterModify.duration = chapterModify.end - chapterModify.begin;
+ //var newEnd = new IriSP.Model.Time(chapter.end)
+ chapterModify.setEnd(chapter.end);
}
chapters = _(chapters).reject(function(c) { return c.id == idChapter; });
renderChapter();
@@ -239,33 +228,34 @@
});
//nouveau chapitre
+ function newChapter(dataChapter){
+ var chapter = new IriSP.Model.Annotation(false, myProject);
+ chapter.setMedia(myMedia.id);
+ chapter.setBegin(dataChapter.begin);
+ chapter.setEnd(dataChapter.end);
+ chapter.title = dataChapter.title;
+ chapter.description = dataChapter.description;
+ chapter.keywords = dataChapter.keywords;
+ chapter.color = global.colors[(global.colorsIndex<global.colors.length) ? global.colorsIndex++ : (global.colorsIndex=0)];
+
+ chapters.push(chapter);
+ renderChapter();
+ loadFormChapter(chapter.id);
+ }
+
$('.chapter-widget').on('click', '.btn-cut-chapter', function(e){
e.preventDefault();
- var uniqId = 'id' + (new Date()).getTime();
-
- var title = 'New',
- tags = 'tag',
- begin = myMedia.currentTime.milliseconds,
- end = organizeNewChapter(begin),
- duration = end - begin,
- description = '',
- id = uniqId;
+ var dataChapter = {
+ title : 'New',
+ begin : myMedia.currentTime,
+ end : organizeNewChapter(myMedia.currentTime),
+ description : 'description',
+ keywords : 'tag1,tag2'
+ };
- var dataChapter = {
- title : title,
- tags : tags,
- begin : begin,
- duration : duration,
- end : end,
- description : description,
- color : global.colors[chapters.length],
- id : uniqId
- };
-
- chapters.push(dataChapter);
- renderChapter();
- loadFormChapter(id);
+ newChapter(dataChapter);
+
});
function organizeNewChapter(beginNew){
@@ -275,11 +265,11 @@
var begin = v.begin,
end = v.end;
if(beginNew>=begin && beginNew<=end){
- v.end = beginNew;
- v.duration = v.end - v.begin;
- returnEnd = end;
+ returnEnd = new IriSP.Model.Time(end);
+ v.setEnd(beginNew);
}
});
+
return returnEnd;
}
@@ -296,24 +286,21 @@
chapterList.empty();
$.each(chapters, function(k, v){
-
+ //form
+ if($('#form-chapter-edit-'+v.id).length){
+ loadFormChapter(v.id);
+ }
//segments
- color = global.colors[k],
- width = Math.floor(v.duration * wChapterSegmentWrap / myMedia.duration.milliseconds),
+ var width = Math.floor(v.getDuration() * wChapterSegmentWrap / myMedia.duration),
segment = $('<li>'+v.title+'</li>').css({
width : width,
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);
@@ -323,37 +310,21 @@
}
//init
- function loadChapters(){//nouveau projet, 1 chapitre
-
- var uniqId = 'id' + (new Date()).getTime();
-
- var title = 'chapitre 1',
- tags = 'tag1,tag2',
- begin = 0,
- duration = myMedia.duration.milliseconds,
- end = myMedia.duration.milliseconds,
- description = 'description du chapitre 1',
- id = uniqId;
-
+ function loadInitChapters(){//nouveau projet, 1 chapitre
var dataChapter = {
- title : title,
- tags : tags,
- begin : begin,
- duration : duration,
- end : end,
- description : description,
- color : global.colors[chapters.length],
- id : id
- };
+ title : 'New',
+ begin : 0,
+ end : myMedia.duration,
+ description : 'description',
+ keywords : 'tag1,tag2'
+ };
- chapters.push(dataChapter);
- renderChapter();
+ newChapter(dataChapter);
}
-
//edit annotation
$('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){
e.preventDefault();
--- a/src/metadatacomposer/static/metadatacomposer/js/tangle.js Fri May 24 17:23:35 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/tangle.js Fri May 24 17:24:11 2013 +0200
@@ -6,16 +6,15 @@
tangleHasMoved;
$('.chapter-widget-info').on('mousedown', '.time-tangle', function(evt){
- // $(".time-tangle").mousedown(function(evt) {
-
activeTangle = $(this);
activeTangle.addClass("active");
tangleStartVal = +activeTangle.attr("data-milliseconds");
tangleStartX = evt.pageX;
tangleHasMoved = false;
- $(this).siblings(".time-tangle").addClass("deactivate");
+ $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate");
return false;
});
+
$(document)
.mousemove(function(evt) {
if (activeTangle) {
@@ -27,23 +26,77 @@
})
.mouseup(function() {
if (activeTangle) {
- activeTangle.text(activeTangle.text().replace(/\.\d+$/,''));
$(".time-tangle").removeClass("active deactivate");
activeTangle = undefined;
}
});
+
+ function updateRenderChapter(chapterData){
+ var segment = $('.chapter-segments li#'+chapterData.id),
+ wChapterSegmentWrap = $('.chapter-segments').width(),
+ wSegmentNew = Math.floor(chapterData.getDuration() * 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);
+
+ row.find('.begin').text(chapterData.begin);
+ row.find('.duration').text(chapterData.getDuration());
+ row.find('.end').text(chapterData.end);
+
+ if(form){
+ form.find('.begin').text(chapterData.begin);
+ form.find('.begin').attr('data-milliseconds',chapterData.begin);
+ form.find('.duration').text(chapterData.getDuration());
+ form.find('.end').text(chapterData.end);
+ form.find('.end').attr('data-milliseconds',chapterData.end);
+ }
+ }
+
+ function updateChapterDuration(val, chapterBefore, chapterAfter){
+ if (val<chapterAfter.end && val>chapterBefore.begin) {
+ chapterAfter.setBegin(val);
+ chapterBefore.setEnd(val);
+
+ updateRenderChapter(chapterAfter);
+ updateRenderChapter(chapterBefore);
+ }
+ }
+
+ $('.chapter-widget-info').on('valuechange', '.tangle-start', function(evt, val){
+ var indexChapter = _.indexOf(chapters, currentChapter);
+ if(indexChapter == 0 || chapters.length<=1) return;
+ var chapterBefore = chapters[indexChapter-1],
+ chapterAfter = currentChapter;
+
+ updateChapterDuration(val, chapterBefore, chapterAfter);
+ });
+
+ $('.chapter-widget-info').on('valuechange', '.tangle-end', function(evt, val){
+ var indexChapter = _.indexOf(chapters, currentChapter);
+ if(indexChapter == chapters.length-1 || chapters.length<=1) return;
+
+ var chapterAfter = chapters[indexChapter+1],
+ chapterBefore = currentChapter;
+
+ updateChapterDuration(val, chapterBefore, chapterAfter);
+ });
+ /*
$(".tangle-start")
.mouseup(function(evt) {
+
if (!tangleHasMoved && currentMedia && currentSegment) {
currentMedia.setCurrentTime(currentSegment.begin);
}
})
.on("valuechange", function(evt, val) {
+
if (currentMedia && currentSegment) {
currentSegment.setBegin(val);
}
});
+
$(".tangle-end")
.mouseup(function(evt) {
if (!tangleHasMoved && currentMedia && currentSegment) {
@@ -59,4 +112,5 @@
if (currentMedia && currentSegment) {
currentSegment.setDuration(val);
}
- });
\ No newline at end of file
+
+ }); */
\ No newline at end of file