integration/js/tagplayer.js
changeset 64 458cc4576415
parent 50 9cc1b66d0880
child 68 70b1e3523168
--- a/integration/js/tagplayer.js	Fri Dec 21 15:45:10 2012 +0100
+++ b/integration/js/tagplayer.js	Fri Jan 04 18:10:03 2013 +0100
@@ -34,33 +34,15 @@
     var timeSlider = $("#progressBar"),
         slidersRange = 1000,
         wasPaused = true,
-        lastVal = 0,
-        isClicking = false;
+        lastVal = 0;
     timeSlider.slider({
         range: "min",
         value: 0,
         min: 0,
         max: slidersRange,
         slide: function(event, ui) {
-            if (isClicking && Math.abs(lastVal - ui.value) > 10) {
-                isClicking = false;
-            }
-            if (!isClicking && currentSegment && currentMedia) {
-                var t = currentSegment.begin + ( currentSegment.getDuration() * ui.value / slidersRange );
-                currentMedia.setCurrentTime(t);
-            }
-        },
-        start: function(event, ui) {
-            isClicking = true;
-            lastVal = ui.value;
-        },
-        stop: function(event, ui) {
-            if (isClicking && currentMedia && currentSegment) {
-                var t = currentMedia.getCurrentTime() - currentSegment.begin;
-                timeSlider.slider("value", slidersRange * t / currentSegment.getDuration());
-                playOrPause();
-            }
-            isClicking = false;
+            var t = currentSegment.begin + ( currentSegment.getDuration() * ui.value / slidersRange );
+            currentMedia.setCurrentTime(t);
         }
     });
     
@@ -143,28 +125,41 @@
     $(window).on("resize", resizeTagsDrag);
     resizeTagsDrag();
     
-    var taginput = $("#form_tag input[type=text]");
+    var taginput = $("#form_tag input[type=text]"),
+        replacerx;
     taginput.autocomplete({
         source: function(params, response) {
-            var rx = new RegExp(params.term,"gi");
+            var charsub = [ '[aáàâä]', '[cç]', '[eéèêë]', '[iíìîï]', '[oóòôö]' ],
+                term = params.term.replace(/([\\\*\+\?\|\{\[\}\]\(\)\^\$\.\#\/])/gm, '\\$1');
+            _(charsub).each(function(chars) {
+                var tmprx = new RegExp(chars,"gim");
+                term = term.replace(tmprx, chars);
+            });
+            var searchrx = new RegExp("(^|\\s)" + term, "i");
+            replacerx = new RegExp("(^|\\s)(" + term + ")", "gi");
             response(
                 _(globalTags)
                     .chain()
                     .keys()
                     .filter(function(tag) {
-                        return rx.test(tag)
+                        return searchrx.test(tag)
                     })
-                    .shuffle()
-                    .first(5)
+                    .sortBy(_.identity)
                     .value()
                 );
         }
-    });
+    }).data("autocomplete")._renderItem = function(ul, item) {
+        return $( "<li>" )
+            .data( "item.autocomplete", item )
+            .append( "<a>" + item.label.replace(replacerx, '$1<b>$2</b>') + "</a>" )
+            .appendTo( ul );
+    };
     taginput.on("keyup input paste", function() {
         taginput.val(taginput.val().toUpperCase());
     });
     $("#form_tag").on("submit", function() {
         var _tagvalue = taginput.val().toUpperCase();
+        taginput.val("");
         if (_tagvalue && currentSegment) {
             /* Création d'une liste d'annotations contenant une annotation afin de l'envoyer au serveur */
             var _exportedAnnotations = new IriSP.Model.List(directory),
@@ -191,15 +186,14 @@
             
             _annotation.setAnnotationType(_annotationType.id); 
             
-            _annotation.title = _tagvalue;
+            _annotation.title = currentSegment.title;
             _annotation.created = new Date(); /* Date de création de l'annotation */
             _annotation.description = _tagvalue;
             
             _annotation.setTags([_tag.id]); /*Liste des ids de tags */
             
-            /* Les données créateur/date de création sont envoyées non pas dans l'annotation, mais dans le projet */
-            _export.creator = "theend";
-            _export.created = new Date();
+            _annotation.creator = "theend";
+            _annotation.created = new Date();
             /* Ajout de l'annotation à la liste à exporter */
             _exportedAnnotations.push(_annotation);
             /* Ajout de la liste à exporter à l'objet Source */
@@ -292,7 +286,7 @@
         currentMedia.setCurrentTime(currentSegment.begin);
         if (!currentMedia.loaded) {
             $(".video-wait").show();
-            $("#btnPlayPause, .video-wait, #progressBar .ui-slider-handle").removeClass("pause");
+            $("#btnPlayPause, .video-wait").removeClass("pause");
         }
         currentMedia.play();
     }
@@ -301,11 +295,11 @@
         var vals = _(currentSegment.__tags).values(),
             max = Math.max.apply(Math, vals),
             min = Math.min(max - 1, Math.min.apply(Math, vals)),
-            b = 128 / (max - min);
+            b = 160 / (max - min);
         var html = _(currentSegment.__tags)
             .chain()
             .map(function(v, k) {
-                var c = Math.floor( 127 + (v - min) * b );
+                var c = Math.floor( 95 + (v - min) * b );
                 return '<li><a href="'
                     + IriSP.endpoints.tag_page.replace("__TAG__",encodeURIComponent(k))
                     + '" style="color: rgb('
@@ -334,21 +328,12 @@
         }
         var videoid = "video_" + media.id,
             videoEl = $('<video>'),
-            seekCache = undefined,
             mp4_file = videourl.replace(/\.webm$/i,'.mp4'),
             webm_file = videourl.replace(/\.mp4$/i,'.webm'),
-            mp4_src = $('<source>'),
-            webm_src = $('<source>');
-            
-        mp4_src.attr({
-            src: mp4_file,
-            type: "video/mp4"
-        })
-        webm_src.attr({
-            src: webm_file,
-            type: "video/webm"
-        });
-
+            mediaEl = videoEl[0],
+            can_play_mp4 = !!mediaEl.canPlayType('video/mp4'),
+            can_play_webm = !!mediaEl.canPlayType('video/webm');
+        
         videoEl.attr({
             id : videoid
         }).css({
@@ -358,9 +343,25 @@
             width : "100%",
             height : "100%"
         });
-        videoEl.append(mp4_src).append(webm_src);
+        
+        if (can_play_mp4 && can_play_webm) {
+            var mp4_src = $('<source>'),
+                webm_src = $('<source>');
+            mp4_src.attr({
+                src: mp4_file,
+                type: "video/mp4"
+            });
+            webm_src.attr({
+                src: webm_file,
+                type: "video/webm"
+            });
+            
+            videoEl.append(mp4_src).append(webm_src);
+        } else {
+            videoEl.attr("src", can_play_mp4 ? mp4_file : webm_file);
+        }
+
         $("#video_sequence").append(videoEl);
-        var mediaEl = videoEl[0];
         
         media.show = function() {
             videoEl.show();
@@ -451,13 +452,13 @@
         
         media.on("play", function() {
             if (media === currentMedia) {
-                $("#btnPlayPause, .video-wait, #progressBar .ui-slider-handle").addClass("pause");
+                $("#btnPlayPause, .video-wait").addClass("pause");
             }
         });
         
         media.on("pause", function() {
             if (media === currentMedia) {
-                $("#btnPlayPause, .video-wait, #progressBar .ui-slider-handle").removeClass("pause");
+                $("#btnPlayPause, .video-wait").removeClass("pause");
             }
         });
         
@@ -471,9 +472,7 @@
                         media.setCurrentTime(currentSegment.begin);
                     }
                     $("#current").text(new IriSP.Model.Time(t).toString());
-                    if (!isClicking) {
-                        timeSlider.slider("value", slidersRange * t / currentSegment.getDuration());
-                    }
+                    timeSlider.slider("value", slidersRange * t / currentSegment.getDuration());
                 } else {
                     media.pause();
                     goToPart((currentIndex + 1) % seqCount)