diff -r 63c27bc35ff6 -r af98a6dc9381 player/js/player.js --- a/player/js/player.js Wed Jun 26 11:35:56 2013 +0200 +++ b/player/js/player.js Thu Jun 27 11:51:46 2013 +0200 @@ -86,6 +86,7 @@ }).click(function() { if (clickedTag) { $(".found").removeClass("found"); + $(".timelines").removeClass("searching"); clickedTag = null; } return false; @@ -98,10 +99,13 @@ $(".found").removeClass("found"); var tag = myProject.getElement(tagId); if (tag) { + $(".timelines").addClass("searching"); tag.getRelated("annotation").forEach(function(a) { a.trigger("found-tags"); }); $(".tag[data-tag-id="+tagId+"]").addClass("found"); + } else { + $(".timelines").removeClass("searching"); } lastTag = tagId; } @@ -293,10 +297,28 @@ annotationDiv.find(".close-annotation").click(closeAnnotation); annotationDiv.find(".annotation-title").text(annotationinfo.annotation.title); - - var positionDiv = function() { + annotationinfo.positionDiv = function() { + var mainH = $(".main-video").height() + switch (annotationinfo.type) { + case "video": + var mediaW = annotationDiv.find(".media-frame").width(), + mediaH = Math.floor(Math.min(mainH - 70, mediaW * 9 / 16)); + annotationDiv.find("iframe, video").attr({ + width: mediaW, + height: mediaH + }); + annotationDiv.find(".media-description").css({ + height: mediaH + }); + break; + case "text": + annotationDiv.find(".text-contents").css({ + "max-height": mainH - 140 + }); + break; + } annotationDiv.css({ - top: Math.floor(($(".main-video").height() - annotationDiv.height())/2)+"px" + top: Math.floor((mainH - annotationDiv.height())/2)+"px" }); } @@ -409,11 +431,11 @@ ); var htmlTemplate = _.template( - '<<%- type %> width="<%- width %>" controls="true" autoplay="<%- autoplay %>" src="<%- src %>"/>' + '<<%- type %> width="<%- width %>" height="<%- height %>" controls="true" autoplay="<%- autoplay %>" src="<%- src %>"/>' ); - var mediaW = (annotationinfo.type === "audio" ? "100%" : "650"), - mediaH = (annotationinfo.type === "audio" ? "60" : "420"); + var mediaW = (annotationinfo.type === "audio" ? "100%" : annotationDiv.find(".media-frame").width()), + mediaH = (annotationinfo.type === "audio" ? "60" : Math.floor(Math.min($(".main-video").height() - 70, mediaW * 9 / 16))); annotationDiv.find(".media-description").html( annotationinfo.annotation.description.split(/\n/gm).map(function(l) { @@ -458,7 +480,7 @@ }, success: function(data) { annotationDiv.find(".media-frame").html(data.html); - positionDiv(); + annotationinfo.positionDiv(); } }); break; @@ -471,12 +493,12 @@ data: { format: "json", maxwidth: mediaW, - maxheight: 487, + maxheight: mediaH, url: src }, success: function(data) { annotationDiv.find(".media-frame").html(data.html); - positionDiv(); + annotationinfo.positionDiv(); } }); break; @@ -496,7 +518,7 @@ }, success: function(data) { annotationDiv.find(".media-frame").html(data.html); - positionDiv(); + annotationinfo.positionDiv(); } }); break; @@ -520,7 +542,7 @@ })); media.on("loadedmetadata", function() { - positionDiv(); + annotationinfo.positionDiv(); }); preventRightClick(media); @@ -546,9 +568,6 @@ break; } annotationDiv.find(".text-contents a").attr("target","_blank"); - annotationDiv.find(".text-contents").css({ - "max-height": $(".main-video").height() - 140 - }); break; @@ -558,14 +577,12 @@ annotationDiv.find(".link-contents").html( annotationinfo.annotation.content.links.map(linkTemplate).join("") - ).css({ - "max-height": $(".main-video").height() - 140 - }); + ); break; } - positionDiv(); + annotationinfo.positionDiv(); } @@ -600,7 +617,23 @@ } $(".full-screen").click(fullScreen); + $(".top-bar").dblclick(fullScreen); + var fsel = document.querySelector("body"), + fsRequestMethods = ["requestFullScreen","mozRequestFullScreen","webkitRequestFullScreen"], + fsCapable = false; + + for (var i = 0; i < fsRequestMethods.length; i++) { + if (typeof fsel[fsRequestMethods[i]] === "function") { + fsCapable = true; + break; + } + } + + if (!fsCapable) { + $(".full-screen").remove(); + } + $(".about").click(function() { closeAnnotation(); var aboutBox = $(".annotation-templates .about-box").clone().appendTo($(".main-video")); @@ -650,6 +683,9 @@ left: dw, bottom: dh }); + if (currentAnnotation) { + currentAnnotation.positionDiv(); + } } $(".video-container video").on("loadedmetadata",repositionElements);