player/js/player.js
changeset 9 2e1053dff5f2
parent 8 e8faf97d2a40
child 14 f8a0d5d14372
--- a/player/js/player.js	Wed May 29 17:05:34 2013 +0200
+++ b/player/js/player.js	Thu May 30 18:47:48 2013 +0200
@@ -225,13 +225,13 @@
             annotationinfo.picto.show().animate({
                 height: "38px",
                 opacity: 1
-            });
+            }, 800);
         });
         annotation.on("leave", function() {
             annotationinfo.picto.animate({
                 height: 0,
                 opacity: 0
-            }, function() {
+            }, 800, function() {
                 annotationinfo.picto.hide();
             });
         });
@@ -266,10 +266,21 @@
         var annotationDiv = $(".annotation-templates ." + annotationinfo.type + "-annotation").clone();
         
         annotationDiv.appendTo($(".main-video"));
-        annotationDiv.animate({top: "20px"});
         annotationDiv.find(".close-annotation").click(closeAnnotation);
         annotationDiv.find(".annotation-title").text(annotationinfo.annotation.title);
         
+                
+        var positionDiv = function(anim) {
+            var css = {
+                top: Math.floor(($(".main-video").height() - annotationDiv.height())/2)+"px"
+            };
+            if (anim) {
+                annotationDiv.animate(css, 800);
+            } else {
+                annotationDiv.css(css);
+            }
+        }
+        
         switch (annotationinfo.type) {
             
             case "slideshow":
@@ -406,7 +417,7 @@
                         height: mediaH,
                         autoplay: +annotationinfo.annotation.content.autostart
                     }));
-                    return;
+                    break;
                 }
                 
                 if (/^(https?:\/\/)?(www\.)?vimeo/.test(src)) {
@@ -425,6 +436,7 @@
                         },
                         success: function(data) {
                             annotationDiv.find(".media-frame").html(data.html);
+                            positionDiv(true);
                         }
                     });
                     return;
@@ -442,6 +454,7 @@
                         },
                         success: function(data) {
                             annotationDiv.find(".media-frame").html(data.html);
+                            positionDiv(true);
                         }
                     });
                     return;
@@ -461,6 +474,7 @@
                         },
                         success: function(data) {
                             annotationDiv.find(".media-frame").html(data.html);
+                            positionDiv(true);
                         }
                     });
                     return;
@@ -475,9 +489,7 @@
                     src = src.replace(/\.[\d\w]+$/,"." + fallbacks[mimetype]);
                 }
                 
-                console.log(mimetype, canPlay, src);
-                
-                annotationDiv.find(".media-frame").html(htmlTemplate({
+                var media = $(htmlTemplate({
                     type: annotationinfo.type,
                     src: src,
                     width: mediaW,
@@ -485,6 +497,13 @@
                     autoplay: "" + annotationinfo.annotation.content.autostart
                 }));
                 
+                media.on("loadedmetadata", function() {
+                    positionDiv(true);
+                });
+                
+                annotationDiv.find(".media-frame").html(media);
+                return;
+                
             break;
             
             case "text":
@@ -517,6 +536,9 @@
                 
             break;
         }
+        
+        positionDiv(true);
+        
     }
     
     $(".video-container").click(function() {
@@ -530,6 +552,11 @@
         currentAnnotation = null;
         $(".chip, .pictolist li").removeClass("current");
         $(".chapters-bar").removeClass("annotation-onscreen");
+        $(".annotation audio, .annotation video").each(function() {
+            try {
+                this.pause();
+            } catch(e) { }
+        });
         $(".main-video .annotation").hide().remove();
         if (!!e) {
             myMedia.play();