# HG changeset patch # User Anthony Ly # Date 1370958422 -7200 # Node ID a56fad1ada355fa555d01b9756017a3a146529e5 # Parent fedc0d054b556f0937657aa3973bb978a87ccbb2# Parent dbd3a1441943f2ca41d77be32cea748911879e08 Merge diff -r dbd3a1441943 -r a56fad1ada35 integration/css/style.css --- a/integration/css/style.css Tue Jun 11 13:13:42 2013 +0200 +++ b/integration/css/style.css Tue Jun 11 15:47:02 2013 +0200 @@ -55,8 +55,8 @@ .chapter-widget table td{} .chapter-widget textarea:focus{height: 100px;} .chapitre-cut-wrap{position: relative; height: 70px; margin-bottom: 10px;} -.btn-cut-chapter{height:40px;position: absolute;top: 20px;left: 11px; width: 40px;} -.indicateur-chapter, .indicateur-annotation{z-index:999; left:10px; width: 1px; height: 100%;background-color: #000; position: absolute;} +.btn-cut-chapter{height:40px;position: absolute;top: 20px;left: 1px; width: 40px;} +.indicateur-chapter, .indicateur-annotation{z-index:999; left:0; width: 1px; height: 100%;background-color: #000; position: absolute;} .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;} @@ -75,25 +75,23 @@ .table td{vertical-align: middle;} .table td td{padding: 1px; border: none;} .table td td a{width: 12px;display: block;} -.config-diaporama{color: #FFF;} -.config-diaporama form{background-color: #34495e; padding: 4px 0; margin: 0; overflow: hidden; line-height: 28px;} -.config-diaporama form label{display: inline-block; padding-left: 10px;} -.config-diaporama form input{margin-bottom: 0;} +.config-slideshow{color: #FFF;} +.config-slideshow form{background-color: #34495e; padding: 4px 0; margin: 0; overflow: hidden; line-height: 28px;} +.config-slideshow form label{display: inline-block; padding-left: 10px;} +.config-slideshow form input{margin-bottom: 0;} .edit-annotation-text textarea{max-width: 446px;} -.wysiwyg-wrap{overflow: hidden; } +.wysiwyg-wrap{overflow: hidden; padding: 0 0 2px 2px; } .ui-slider-handle.ui-state-default.ui-corner-all{border-radius: 0;} .edit-annotation-html textarea{max-width: 446px;width:446px; } .close-tab{vertical-align: super; margin-left: 8px; color: #c0392b; cursor: pointer; font-size: 12px; line-height: 14px;} .close-tab:hover{color:#2c3e50;} .html-apercu{overflow: auto; margin-top: 10px;} -.input-image-url{display: none;} .slider-duration.ui-slider.ui-slider-horizontal.ui-widget.ui-widget-content.ui-corner-all{ background: #202020;} .timeline-annotations-wrap{position: relative;background-color: #202020;} .timeline-annotations{width: 460px;height: auto; position: relative; margin: 0; padding-top: 4px;} .timeline-annotations li{display: block; width: 460px;height: 12px; position: relative; padding-bottom: 4px;} .timeline-annotations .annotation{cursor: pointer; display:block; text-decoration:none; color:#000; text-align:center; font-size : 10px; overflow: hidden; line-height: 12px; width: 10px; height: 12px; background-color: #c0392b; position: absolute; top:0px;} -.timeline-annotations .annotation span, .timeline-annotations .annotation i{display: none;} -.timeline-annotations .annotation:hover span, +.annotation:hover span, .annotation.editing span, .annotation.editing i{display: inline;} ul.tagit{margin-left: 10px;-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;} @@ -102,7 +100,6 @@ .list-current-annotations{position: absolute;bottom: 40px; left: 20px; margin: 0;} .list-current-annotations li{list-style: none; margin-top: 4px;} .list-current-annotations a{text-decoration: none;line-height:20px; color:#202020;display: inline-block; background-color: #589; height: 20px; padding: 0 4px; } -.list-current-annotations a span{display: none;} .list-current-annotations a:hover span{display: inline-block;} .annotation-audio-content textarea{max-width: 206px;} .annotation-links-content .links-form:nth-child(n+2){border-top:1px solid; padding-top: 20px;} @@ -110,16 +107,31 @@ td.begin, td.duration, td.end{max-width: 40px;} td.image-slideshow-row img{width: 60px; height: 60px;} .project-title-editor input{margin-bottom: 0;} -#templates{display: none;} .title-slideshow-row{word-wrap: break-word;width: 76px;} .title-slideshow-row input{width: 70px;} .description-slideshow-row{word-wrap: break-word; width: 180px; } .description-slideshow-row span{max-height: 100px; display: inline-block; overflow: auto;} .description-slideshow-row textarea{width: 164px; max-width: 164px; height: 100px;} -.label-modify-video, .label-add-video{display: none;} + +a.open-tab{text-shadow:none;} +a.open-tab:hover{background-color: #E6E6E6;} +.open-tab.video{background-color: #BE4477;} +.open-tab.text{background-color:#5E90CB;} +.open-tab.slideshow{background-color:#F69058;} +.open-tab.audio{background-color:#63BE6C;} +.open-tab.links{background-color:#8985BB;} + +.input-image-url, +.annotation span, .annotation i, +.label-modify-video, .label-add-video, +#templates, +.list-current-annotations a span, +.alert-message, +.alert, +.links-rows .help-inline{display: none;} + .shadow {background-color: #54D0ED !important;} -.alert-message{display: none;} -.alert{display: none;} + /* Tangle */ .time-tangle {color: #2c3e50; cursor: w-resize; position: relative;border-bottom: 1px dashed #2c3e50;} .time-tangle:hover, @@ -129,13 +141,6 @@ .time-tangle.deactivate:hover {border: none; color: #2c3e50;} .time-tangle.deactivate:hover:after {display: none;} -a.open-tab{text-shadow:none;} -a.open-tab:hover{background-color: #E6E6E6;} -.open-tab.video{background-color: #BE4477;} -.open-tab.text{background-color:#5E90CB;} -.open-tab.slideshow{background-color:#F69058;} -.open-tab.audio{background-color:#63BE6C;} -.open-tab.links{background-color:#8985BB;} .loader { background: url(../img/loader.gif) center no-repeat; background-size: 25px 25px; diff -r dbd3a1441943 -r a56fad1ada35 integration/edition.html --- a/integration/edition.html Tue Jun 11 13:13:42 2013 +0200 +++ b/integration/edition.html Tue Jun 11 15:47:02 2013 +0200 @@ -83,10 +83,7 @@
- - +
@@ -102,42 +99,6 @@
-

Liste des chapitres

@@ -153,27 +114,6 @@ -
@@ -184,7 +124,6 @@
@@ -214,294 +153,11 @@ - +
- - -
- -
-
-
- - -
-
- - - - - - - - - - - - - - - - -
DébutDuréeFin
4:204:204:20
-
-
-
-
-
-
-
- -
-
-
- -
-

Liens

-
-
-
-
- - - - - - - - - - - - - - - - - - - - -
URLTitre du lienActions
- - -
- - -
-
-
- -
- -
-

Son

-
-
-
-
-
- -
- -
-
-
- -
- -
-
-
-
-
- - -
-

Vidéo

- - Ajouter une vidéo - - -
-
-
- - - - - - - - - - - - - - - - - - - - -
TitreTitre de la vidéo Azerty
Date14 / 05 / 2016
Durée25 m 35 s
DescriptionLorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem iste blanditiis ducimus sint nemo aspernatur rem hic facere culpa dolore quis itaque magni voluptates aliquid veritatis non harum quo libero.
-
-
- - -
-

Html

-
-
-
- - -
-
- Aperçu -
-
-
- - - -
-

Texte

-
-
-
- -
-
- - -
-

Diaporama

- - Ajouter une image - - -
-
-
-
- -
- - -
-
-
- - sec -
-
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
AperçuTitreDescriptionActions
Titre annotation 1Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis aliquid non placeat consequuntur fugit minima. - - - - - - - - - -
-
Titre annotation 2Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis aliquid non placeat consequuntur fugit minima. - - - - - - - - - -
-
Titre annotation 3Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis aliquid non placeat consequuntur fugit minima. - - - - - - - - - -
-
-
-
- -
- + @@ -552,9 +208,9 @@
+ - - @@ -683,21 +321,21 @@

Diaporama

Ajouter une image - +
-
-
+
+
- +
- - sec + + sec
@@ -712,8 +350,7 @@ Actions - - +
@@ -735,9 +372,7 @@ Actions - - - + Ajouter un lien @@ -751,17 +386,21 @@ - @@ -853,10 +474,10 @@

Modifier le chapitre

- - - - + + + +
@@ -879,8 +500,8 @@
- - + +
@@ -937,15 +558,13 @@ var urlSaveProject = ''; - /* Initialisation du metadataplayer avec un projet vide */ var myDir = new IriSP.Model.Directory(), myProject = myDir.remoteSource({ - url: "data/rigoletto.json", - serializer: IriSP.serializers.ldt - }); + url: "data/rigoletto.json", + serializer: IriSP.serializers.ldt + }); - \ No newline at end of file diff -r dbd3a1441943 -r a56fad1ada35 integration/js/edition.js --- a/integration/js/edition.js Tue Jun 11 13:13:42 2013 +0200 +++ b/integration/js/edition.js Tue Jun 11 15:47:02 2013 +0200 @@ -1,30 +1,29 @@ -var myMedia = undefined, - currentChapter = undefined, - currentAnnotation = undefined, - currentSlider = undefined, - secMiniChapter = 10; - - - - $(function(){ + var myMedia = undefined, + currentChapter = undefined, + currentAnnotation = undefined, + currentSlider = undefined, + secMiniChapter = 10; + +/* Colors */ var annotationsColors = { 'video' : '#BE4477', 'text' : '#5E90CB', 'slideshow' : '#F69058', 'audio' : '#63BE6C', 'links' : '#8985BB' - } - - var global = { - colorsIndex : 0, - colors : - ['#FF6138', '#FFFF9D', '#BEEB9F', '#79BD8F', '#00A388', + }, + colorsRangeIndex = 0, + colorsRange = [ + '#FF6138', '#FFFF9D', '#BEEB9F', '#79BD8F', '#00A388', '#1695A3', '#ACF0F2', '#F3FFE2', '#EB7F00', '#FF8000', '#FFD933', '#CCCC52', '#8FB359', '#FFD393', '#F54F29' - ] - }; + ]; + + function getRandomColor(){ + return colorsRange[(colorsRangeIndex').html(newValue), - indexRow = $(this).parents('.row-image-diaporama').index(); + indexRow = $(this).parents('.row-image-slideshow').index(); $(this).replaceWith(span); currentAnnotation.content.images[indexRow][name] = newValue; disabledPreview(); @@ -861,12 +888,12 @@ disabledPreview(); }); - //bouton up / down + //button up / down $(document).on('click', '.ui-sortable .btn-sort', function(e){ e.preventDefault(); - var row = $(this).parents('tr.row-image-diaporama'), + var row = $(this).parents('tr.row-image-slideshow'), oldIndex = row.index(), - listDiaporama = $(this).parents('.list-image-diaporama'); + listSlideshow = $(this).parents('.list-image-slideshow'); if($(this).hasClass('down')) row.insertAfter(row.next()); @@ -876,13 +903,20 @@ var newIndex = row.index(); currentAnnotation.content.images.move(oldIndex, newIndex); - disabledBtnSortable(listDiaporama); + disabledBtnSortable(listSlideshow); disabledPreview(); }); + function disabledBtnSortable(listSlideshow){ + listSlideshow.find('.btn-sort.disabled').removeClass('disabled'); + listSlideshow.find('tr.row-image-slideshow:first-child').find('.btn-sort.up').addClass('disabled'); + listSlideshow.find('tr.row-image-slideshow:last-child').find('.btn-sort.down').addClass('disabled'); + } + + //delete image on slideshow $('.tab-content').on('click','.btn-delete-image', function(e){ e.preventDefault(); - var rowImage = $(this).parents('tr.row-image-diaporama'), + var rowImage = $(this).parents('tr.row-image-slideshow'), index = rowImage.index(); rowImage.remove(); @@ -890,18 +924,23 @@ disabledPreview(); }); - function disabledBtnSortable(listDiaporama){ - listDiaporama.find('.btn-sort.disabled').removeClass('disabled'); - listDiaporama.find('tr.row-image-diaporama:first-child').find('.btn-sort.up').addClass('disabled'); - listDiaporama.find('tr.row-image-diaporama:last-child').find('.btn-sort.down').addClass('disabled'); +/* Links */ + + //add + function addLinkRow(tbody, dataView){ + var tplLinkRow = getTemplate('#tpl-links-row'); + var output = Mustache.render(tplLinkRow, dataView); + tbody.append(output); + } - //links $('.tab-content').on('click', '.add-link', function(e){ e.preventDefault(); var tbody = $(this).parents('tfoot').siblings('tbody'); addLinkRow(tbody); }); + + //delete $('.tab-content').on('click', '.delete-link', function(e){ e.preventDefault(); var row = $(this).parents('tr'), @@ -910,18 +949,13 @@ row.remove(); updateLinks(tbody); }); - function addLinkRow(tbody, dataView){ - - //head commun à tous - var tplLinkRow = getTemplate('#tpl-links-row'); - var output = Mustache.render(tplLinkRow, dataView); - tbody.append(output); - - } + + //edit $('.tab-content').on('keyup', '.links-rows input', function(e){ var tbody = $(this).parents('.links-rows'); updateLinks(tbody); }); + function updateLinks(tbody){ links = new Array(); @@ -938,9 +972,13 @@ currentAnnotation.content.links = links; disabledPreview(); } + $('.tab-content').on('focus', '.url-link', function(){ var td = $(this).parents('td'); - if(td.hasClass('error')) td.removeClass('error') + if(td.hasClass('error')) { + td.removeClass('error'); + td.find('.help-inline').hide(); + } }); $('.tab-content').on('blur', '.url-link', function(){ @@ -948,6 +986,7 @@ td = $(this).parents('td'); if(!isValidLink(url)){ td.addClass('error'); + td.find('.help-inline').show(); } }); @@ -955,7 +994,26 @@ return /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/.test(url); } - //annotation audio + //autostart + $('.tab-content').on('click', '.btn-autostart', function(){ + var autostart = $(this).attr('data-autostart'); + if(autostart == "true"){ autostart = true;} + else {autostart = false;} + disabledPreview(); + currentAnnotation.content.autostart = autostart; + }); + + //duration + $('.tab-content').on('change keyup', '.config-slideshow input[name=duration]', function(){ + var value = $(this).val(); + if(!isNaN(value)){ + disabledPreview(); + currentAnnotation.content.slideduration = value * 1000; + } + }); + +/* Audio */ + $('.tab-content').on('keyup', '.annotation-audio-content input, .annotation-audio-content textarea', function(){ var name = $(this).attr('name'), value = $(this).val(); @@ -964,25 +1022,8 @@ disabledPreview(); }); - //annotation slideshow - $('.tab-content').on('click', '.btn-autostart', function(){ - var autostart = $(this).attr('data-autostart'); - if(autostart == "true"){ autostart = true;} - else {autostart = false;} - disabledPreview(); - currentAnnotation.content.autostart = autostart; - }); +/* Save project */ - $('.tab-content').on('change keyup', '.config-diaporama input[name=duration]', function(){ - var value = $(this).val(); - if(!isNaN(value)){ - disabledPreview(); - currentAnnotation.content.slideduration = value * 1000; - } - }); - - - //save project $('.btn-save-project').bind('click', function(e){ e.preventDefault(); if($(this).hasClass('disabled')) return; @@ -1027,7 +1068,7 @@ e.preventDefault(); }); - //alert + //alert save info $('.alert').bind('close', function (e) { e.preventDefault(); $(this).hide(); @@ -1037,7 +1078,9 @@ $('.alert').hide(); $('.'+className).show(); } -//################ config + +/* Config */ + //tagit function onTagItChange(e, ui) { var tagitType = $(this).attr('data-type'), @@ -1060,7 +1103,7 @@ afterTagAdded : onTagItChange } - //CLEditor annotation > text (wysiwyg) http://premiumsoftware.net/cleditor/docs/GettingStarted.html#optionalParameters + //CLEditor (wysiwyg) http://premiumsoftware.net/cleditor/docs/GettingStarted.html#optionalParameters var wysiwygConfig = { width: 450, height: 250, @@ -1128,49 +1171,6 @@ }; } - //init annotation content data - function getContentAnnotationByType(type){ - var content; - switch(type){ - case 'audio': - content = { - mimetype : "application/x-ldt-audio", - url : "", - embedcode : "" - }; - break; - case 'video': - content = { - mimetype : "application/x-ldt-video", - url : "", - embedcode : "" - }; - break; - case 'text': - content = { - mimetype : "application/x-ldt-text", - markup : "html", - text : "" - }; - break; - case 'links': - content = { - mimetype : "application/x-ldt-links", - links : [] - }; - break; - case 'slideshow': - content = { - mimetype : "application/x-ldt-slideshow", - slideduration : 1000, - autostart : false, - images : [] - }; - break; - } - return content; - }//getContentAnnotationByType - //unload $(window).on("beforeunload", onLeave); function onLeave(){ @@ -1184,26 +1184,6 @@ tangleStartVal, tangleHasMoved; - $('.chapter-widget-info').on('mousedown', '.time-tangle', function(evt){ - activeTangle = $(this); - activeTangle.addClass("active"); - tangleStartVal = +activeTangle.attr("data-milliseconds"); - tangleStartX = evt.pageX; - tangleHasMoved = false; - $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate"); - return false; - }); - - $('.tab-content').on('mousedown', '.time-tangle', function(evt){ - activeTangle = $(this); - activeTangle.addClass("active"); - tangleStartVal = +activeTangle.attr("data-milliseconds"); - tangleStartX = evt.pageX; - tangleHasMoved = false; - $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate"); - return false; - }); - $(document) .mousemove(function(evt) { if (activeTangle) { @@ -1216,7 +1196,7 @@ .mouseup(function() { if (activeTangle) { - if(activeTangle.hasClass('slider-tangle')){ + if(activeTangle.hasClass('slider-tangle')){//annotation renderAnnotation(); refreshAnnotationDisplay(myMedia.getCurrentTime()); } @@ -1226,6 +1206,16 @@ }); //chapters + $('.chapter-widget-info').on('mousedown', '.time-tangle', function(evt){ + activeTangle = $(this); + activeTangle.addClass("active"); + tangleStartVal = +activeTangle.attr("data-milliseconds"); + tangleStartX = evt.pageX; + tangleHasMoved = false; + $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate"); + return false; + }); + function updateRenderChapter(chapterData){ var segment = $('.chapter-segments li#'+chapterData.id), wChapterSegmentWrap = $('.chapter-segments').width(), @@ -1285,7 +1275,16 @@ updateChapterDuration(val, chapterBefore, chapterAfter); }); -//annotations + //annotations + $('.tab-content').on('mousedown', '.time-tangle', function(evt){ + activeTangle = $(this); + activeTangle.addClass("active"); + tangleStartVal = +activeTangle.attr("data-milliseconds"); + tangleStartX = evt.pageX; + tangleHasMoved = false; + $(this).parents('td').siblings('td').find(".time-tangle").addClass("deactivate"); + return false; + }); $('.tab-content').on('valuechange', '.tangle-start', function(evt, val){ var max = currentSlider.slider('values')[1], @@ -1334,21 +1333,10 @@ } } - //test - $('.log-annotations').bind('click', function(e){ - e.preventDefault(); - console.log(annotations.length + ' annotations', annotations); - currentSlider.slider( "values", 0, 55 ); - }); - - $('.log-chapters').bind('click', function(e){ - e.preventDefault(); - console.log(chapters.length + ' chapitres',chapters); - }); - });//ready -//Utilitaires +/* Utilitys */ + Array.prototype.move = function (old_index, new_index) { if (new_index >= this.length) { var k = new_index - this.length;