--- a/src/metadatacomposer/static/metadatacomposer/js/edition.js Mon Jun 03 13:33:16 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/edition.js Mon Jun 03 13:33:35 2013 +0200
@@ -7,13 +7,12 @@
$(function(){
var global = {
- idAnnotation : null,
colorsIndex : 0,
colors :
['#f39c12', '#2ecc71', '#3498db', '#9b59b6',
- '#f1c40f', '#e67e22', '#e74c3c', '#ecf0f1',
+ '#f1c40f', '#e67e22', '#e74c3c',
'#16a085', '#27ae60', '#2980b9', '#8e44ad',
- '#f39c12', '#d35400', '#c0392b', '#bdc3c7']
+ '#d35400', '#c0392b', '#bdc3c7']
};
@@ -35,7 +34,8 @@
myProject.onLoad(function() {
$(".project-title").text(myProject.title);
-
+ $('.project-title-nav').text(myProject.title);
+
myMedia = myProject.getCurrentMedia();
//load Chapitre
@@ -68,11 +68,6 @@
});
}
-
- //chargement des chapitres et annotations existants
- // loadInitChapters();
- //loadInitAnnotation();
-
IriSP.htmlPlayer(
myMedia,
$(".main-video"),
@@ -169,12 +164,7 @@
//########### modal
$(document).on('click', 'a.open-modal', function(e){
- var idAnnotation = $(this).attr('data-id');
-
- if(idAnnotation !== undefined){
- global.idAnnotation = idAnnotation;
- }
});
//edition image
@@ -195,35 +185,20 @@
});
//--title-editor
-$('.project-title-editor ._popover').bind('click',function(e){e.preventDefault()});
- $('.project-title-editor ._popover').popover({
- html : true,
- content : function(){
- var previousValue = $('.project-title').text(),
- formInput =
- '<form action="#" class="project-title-editor-form">'+
- '<input type="text" class="project-title-editor-input" value="'+previousValue+'">'+
- '</form>';
- return formInput;
- }
+ $(document).on('click', '.project-title-editor i, .project-title', function () {
+ var html = $('.project-title').html();
+ var input = $('<input type="text" />');
+ input.val(html);
+ $('.project-title').replaceWith(input);
+ input.focus();
+ });
+ $(document).on('blur', '.project-title-editor input', function(){
+ var newTitle = $(this).val();
+ myProject.title = newTitle;
+ $(this).replaceWith('<span class="project-title">'+newTitle+'</span></td>');
+ $('.project-title-nav').text(newTitle);
});
- $('body').on('click', function (e) {
- $('._popover').each(function () {
- if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
- $(this).popover('hide');
- }
- });
- });
-
- $('body').on('submit', '.project-title-editor-form', function(e){
- e.preventDefault();
- $('._popover').popover('hide');
- });
-
- $(document).on('keyup', '.project-title-editor-input', function() {
- $('.project-title').html($(this).val());
- });
//######################## chapter
@@ -265,17 +240,17 @@
currentChapter.beginTangle = beginTangle;
currentChapter.endTangle = endTangle;
- $.get('template.html', function(templates){
- var tpl = $(templates).filter('#tpl-chapter-edit').html();
+ var tpl = getTemplate('#tpl-chapter-edit');
tpl = Mustache.render(tpl, currentChapter);
chapterWrap.empty().append(tpl);
chapterWrap.find('.tag-it').tagit(tagitParam);
- });
myMedia.setCurrentTime(currentChapter.begin);
}
-
+ function getTemplate(idTpl){
+ return $('#templates').find(idTpl).html();
+ }
//supprimer
$('.list-chapter-wrap').on('click', '.btn-delete-chapter', function(e){
e.preventDefault();
@@ -362,7 +337,7 @@
chapterSegmentWrap.empty();
chapterList.empty();
- $.get('template.html', function(templates){
+
$.each(chapters, function(k, v){
//segments
@@ -375,42 +350,17 @@
chapterSegmentWrap.append(segment);
//liste
- var tplChapterRow = $(templates).filter('#tpl-chapter-row').html();
+ var tplChapterRow = getTemplate('#tpl-chapter-row');
tplChapterRow = Mustache.render(tplChapterRow, v);
chapterList.append(tplChapterRow);
});
- });
+
}//renderChapter()
-//init
- function loadInitChapters(){//nouveau projet, 1 chapitre
- var dataChapter = {
- title : 'New',
- begin : 0,
- end : myMedia.duration,
- description : 'description',
- keywords : ['tag1','tag2']
- };
-
- newChapter(dataChapter);
- }
//######################## annotation
- function loadInitAnnotation(){//nouveau projet, 1 chapitre
- var dataAnnotation = {
- title : 'Titre azerty',
- begin : myMedia.duration/5,
- end : myMedia.duration/3,
- description : 'description',
- type : 'video',
- keywords : ['ideal', 'tag']
- };
-
- newAnnotation(dataAnnotation);
- renderAnnotation();
- }
function newAnnotation(dataAnnotation){
var annotation = new IriSP.Model.Annotation(false, myProject);
@@ -438,7 +388,7 @@
return c.begin;
});
- timeline.empty();
+ timeline.empty().append('<li>');
annotationList.empty();
$.each(annotations, function(k, v){
@@ -451,19 +401,46 @@
width : width,
backgroundColor : v.color
}).addClass('annotation').attr('id', 'annotation-timeline-'+v.id);
-
- timeline.append(segment);
+
+ var isInTimeline = false;
+ $.each(timeline.find('li'), function(a, b){
+ if(isInTimeline) return;
+ var row = $(this);
+ if(row.children().length){
+ var canBeInRow = true;
+ $.each(row.find('.annotation'), function(c, d){
+ var oAL = parseInt($(d).css('left')),
+ oAR = oAL + $(d).width(),
+ segmentR = left + width;
+ if(oAL<=left && oAR>=left || oAL<=segmentR && oAR>= segmentR){
+ canBeInRow = false;
+ }
+ });
+ if(canBeInRow){
+ row.append(segment);
+ isInTimeline = true;
+ }
+ }else{
+ row.append(segment);
+ isInTimeline = true;
+ }
+ });
+
+ if(!isInTimeline){
+ timeline.append('<li>');
+ timeline.find('li:last-child').append(segment);
+ }
+
//liste
- $.get('template.html', function(templates){
- var tplAnnotationRow = $(templates).filter('#tpl-list-annotation-row').html();
+ var tplAnnotationRow = getTemplate('#tpl-list-annotation-row');
tplAnnotationRow = Mustache.render(tplAnnotationRow, v);
annotationList.append(tplAnnotationRow);
- });
+ });
- });
- }
+
+ }//renderAnnotation
//edit annotation
$('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){
@@ -540,10 +517,10 @@
currentAnnotation = _.find(annotations, function(c){ return c.id == idAnnotation; });
- $.get('template.html', function(templates){
+
//head commun à tous
- var tplHead = $(templates).filter('#tpl-head').html();
+ var tplHead = getTemplate('#tpl-head');
var output = Mustache.render(tplHead, dataView);
$(tabContent).append(output);
$(tabContent).find(".slider-duration").slider(configSlider(dataView));
@@ -553,7 +530,7 @@
id : idAnnotation,
content : dataView.content
};
- var tpl = $(templates).filter('#tpl-'+type).html();
+ var tpl = getTemplate('#tpl-'+type);
tpl = Mustache.render(tpl, viewType);
$(tabContent).append(tpl);
@@ -566,18 +543,8 @@
case 'video':
if(viewType.content.url != ""){
- /*
- var videoWrap = $(tabContent).find('.annotation-video-content'),
- tplVideo = $(templates).filter('#tpl-video-row').html();
- tplVideo = Mustache.render(tplVideo, viewType.content);
- videoWrap.empty().append(tplVideo);
-
- var videoWrap = $(tabContent).find(".video-container"),
- src = viewType.content.url;
- getVideoPlayer(src, videoWrap);
-*/
- var videoWrap = $(tabContent).find('.annotation-video-content');
+ var videoWrap = $(tabContent).find('.annotation-video-content');
renderVideoInfo(videoWrap, viewType.content);
}
@@ -627,12 +594,12 @@
}
dataView.iconTab = getIcon(type);
- var tplOnglet = $(templates).filter('#tpl-onglet').html();
+ var tplOnglet = getTemplate('#tpl-onglet');
var onglet = Mustache.render(tplOnglet, dataView);
$(".nav-tabs li:last-child").after(onglet);
$('a[href=#tab-annotation-'+idAnnotation+']').tab('show');
- });
+
}//openTab()
function getIcon(type){
@@ -642,8 +609,7 @@
break;
case 'video': icon = 'film';
break;
- case 'text':
- icon = 'align-left';
+ case 'text': icon = 'align-left';
break;
case 'html': icon = 'code';
break;
@@ -687,15 +653,15 @@
//video
function renderVideoInfo(videoWrap, dataVideo){
- $.get('template.html', function(templates){
- var tplVideo = $(templates).filter('#tpl-video-row').html();
- tplVideo = Mustache.render(tplVideo, dataVideo);
-
- videoWrap.empty().append(tplVideo);
+
+ var tplVideo = getTemplate('#tpl-video-row');
+ tplVideo = Mustache.render(tplVideo, dataVideo);
+
+ videoWrap.empty().append(tplVideo);
- videoWrap = videoWrap.find(".video-container");
- getVideoPlayer(dataVideo.url, videoWrap);
- });
+ videoWrap = videoWrap.find(".video-container");
+ getVideoPlayer(dataVideo.url, videoWrap);
+
}
$('.popup').on('click', '.bibliotheque-video a', function(e){
e.preventDefault();
@@ -712,18 +678,7 @@
var videoWrap = $('#tab-annotation-'+currentAnnotation.id).find('.annotation-video-content');
renderVideoInfo(videoWrap, currentAnnotation.content);
-/*
- $.get('template.html', function(templates){
- var videoWrap = $('#tab-annotation-'+currentAnnotation.id).find('.annotation-video-content'),
- tplVideo = $(templates).filter('#tpl-video-row').html();
- tplVideo = Mustache.render(tplVideo, currentAnnotation.content);
- videoWrap.empty().append(tplVideo);
- var videoWrap = videoWrap.find(".video-container"),
- src = url;
- getVideoPlayer(src, videoWrap);
- });
-*/
});
@@ -750,12 +705,12 @@
});
function addImageToDiaporama(diaporama, dataView){
- $.get('template.html', function(templates){
- var tplDiapo = $(templates).filter('#tpl-diaporama-row').html();
- tplDiapo = Mustache.render(tplDiapo, dataView);
- diaporama.append(tplDiapo);
- disabledBtnSortable(diaporama);
- });
+
+ var tplDiapo = getTemplate('#tpl-diaporama-row');
+ tplDiapo = Mustache.render(tplDiapo, dataView);
+ diaporama.append(tplDiapo);
+ disabledBtnSortable(diaporama);
+
};
//bouton up / down
@@ -801,17 +756,18 @@
$('.tab-content').on('click', '.delete-link', function(e){
e.preventDefault();
var row = $(this).parents('tr'),
- tbody = $(this).find('tbody');
+ tbody = $(this).parents('tbody');
+
row.remove();
updateLinks(tbody);
});
function addLinkRow(tbody, dataView){
- $.get('template.html', function(templates){
+
//head commun à tous
- var tplLinkRow = $(templates).filter('#tpl-links-row').html();
+ var tplLinkRow = getTemplate('#tpl-links-row');
var output = Mustache.render(tplLinkRow, dataView);
tbody.append(output);
- });
+
}
$('.tab-content').on('keyup', '.links-rows input', function(e){
var tbody = $(this).parents('.links-rows');
@@ -819,6 +775,7 @@
});
function updateLinks(tbody){
links = new Array();
+
$.each(tbody.find('tr'), function(k, v){
var urlLink = $(v).find('.url-link').val(),
titleLink = $(v).find('.title-link').val(),
@@ -827,23 +784,11 @@
title : titleLink
};
links.push(link);
+
});
currentAnnotation.content.links = links;
}
-
-//annotation html
-/*
-$('.tab-content').on('click', '.btn-html-apercu', function(e){
- e.preventDefault();
-
- var apercuWrap = $(this).parents('.edit-annotation-html').find('.html-apercu'),
- htmlTextarea = $(this).parents('.edit-annotation-html').find('textarea');
-
- apercuWrap.empty().html(htmlTextarea.val());
-});
-*/
-
//annotation audio
$('.tab-content').on('keyup', '.annotation-audio-content input, .annotation-audio-content textarea', function(){
var name = $(this).attr('name'),
@@ -860,7 +805,6 @@
currentAnnotation.content.autostart = autostart;
});
-
$('.tab-content').on('change keyup', '.config-diaporama input[name=duration]', function(){
var value = $(this).val();
if(!isNaN(value)){
@@ -916,7 +860,6 @@
//slider
function configSlider(data){
-
return {
range: true,
values: [ data.begin.milliseconds, data.end.milliseconds ],
@@ -942,11 +885,16 @@
width :width
});
+
+
+ },
+ stop : function(){
+ renderAnnotation()
}
};
-
}
+//init annotation content data
function getContentAnnotationByType(type){
var content;
switch(type){
@@ -993,21 +941,6 @@
//test
-//a = $(".wysiwyg").cleditor(wysiwygConfig);
-
-
-$('.number-spin').spin(spinParam);
-
-disabledBtnSortable($('.ui-sortable'))
-$('.ui-sortable').sortable({
- stop : function(event, ui){
- disabledBtnSortable($(this));
- }
-});
-
-$('.slider-duration').slider(configSlider);
-
-$(".tag-it").tagit();
$('.log-annotations').bind('click', function(e){
e.preventDefault();
@@ -1018,8 +951,10 @@
e.preventDefault();
console.log(chapters.length + ' chapitres',chapters);
});
+
});//ready
+//Utilitaires
Array.prototype.move = function (old_index, new_index) {
if (new_index >= this.length) {
var k = new_index - this.length;
@@ -1028,7 +963,7 @@
}
}
this.splice(new_index, 0, this.splice(old_index, 1)[0]);
- return this; // for testing purposes
+ return this;
};
@@ -1144,4 +1079,4 @@
autoplay: "" + autoplay
}));
-}
\ No newline at end of file
+}//getVideoPlayer
\ No newline at end of file
--- a/src/metadatacomposer/urls.py Mon Jun 03 13:33:16 2013 +0200
+++ b/src/metadatacomposer/urls.py Mon Jun 03 13:33:35 2013 +0200
@@ -5,7 +5,8 @@
MetadataComposerImagePagination, MetadataComposerModalImageLibrary,\
MetadataComposerRemoveImage, MetadataComposerRemoveContent,\
MetadataComposerRemoveProject, MetadataComposerImage,\
- MetadataComposerModalContentLibrary, MetadataComposerPlayer
+ MetadataComposerModalContentLibrary, MetadataComposerPlayer,\
+ MetadataComposerPreviewPlayer
urlpatterns = patterns('',
url(r'^jsi18n/(?P<packages>\S+?)/$', 'django.views.i18n.javascript_catalog', name='jsi18n'),
@@ -23,6 +24,7 @@
url(r'^(?P<branding>.*)/removeproject/$', MetadataComposerRemoveProject.as_view(), name="composer_remove_project"),
url(r'^(?P<branding>.*)/image/(?P<image_pk>[\w-]+)/$', MetadataComposerImage.as_view(), name="composer_image"),
url(r'^(?P<branding>.*)/player/(?P<ldt_id>[\w-]+)/$', MetadataComposerPlayer.as_view(), name="composer_player"),
+ url(r'^(?P<branding>.*)/previewplayer/(?P<ldt_id>[\w-]+)/$', MetadataComposerPreviewPlayer.as_view(), name="composer_preview_player"),
url(r'^(?P<branding>.*)/$', MetadataComposerHome.as_view(), name="composer_home"),
url(r'^$', MetadataComposerHome.as_view(), name="composer_home"),
)