diff options
Diffstat (limited to 'WebCore/manual-tests/video-player.html')
| -rw-r--r-- | WebCore/manual-tests/video-player.html | 103 |
1 files changed, 0 insertions, 103 deletions
diff --git a/WebCore/manual-tests/video-player.html b/WebCore/manual-tests/video-player.html deleted file mode 100644 index 74f0a38..0000000 --- a/WebCore/manual-tests/video-player.html +++ /dev/null @@ -1,103 +0,0 @@ -<style> -#videoelem { width: 100%; height: 100%; position: absolute; } -#videocontainer { position: relative; width: 400px; height:230px;-webkit-user-select:none; -webkit-transition-duration:0.2s} -.videobutton { - line-height: 40pt; - border: 3px solid white; - -webkit-border-radius: 20px; - opacity: 0.5; - position: absolute; - font-size: 40pt; - color: white; - background-color: gray; - cursor: pointer; - text-align: center; - z-index: 1; -} -.videozoombutton { bottom:10px;right:10px;width:1.1em;height:1.1em;font-size:15pt; line-height: 15pt; border:2px solid white; -webkit-border-radius: 8px;} -.videoloading { top: 0; bottom: 0; margin:auto; left:0; right:0; width: 7em; height: 1.2em; cursor:default;} -.videofadeout { -webkit-transition: 1.5s; opacity:0; } -#videocontainer:hover .videofadeout { opacity: 0.5; } -.videoplay { top: 0; bottom: 0; margin:auto; left:0; right:0; width: 1.2em; height: 1.2em;} -</style> -<script> -var videoElem; -var playButton; -var showProgress = true; -var videoLargeSize = false; -function startedPlaying() { - showProgress = false; - playButton.innerHTML = "||" - playButton.className = "videobutton videoplay videofadeout"; -} -function stoppedPlaying() { - playButton.innerHTML = ">" - playButton.className = "videobutton videoplay"; -} -function updateProgress(ev) { - if (!showProgress) - return; - playButton.innerHTML = "Loading..."; - playButton.className = "videobutton videoloading"; -} -function initVideo() { - videoElem = document.getElementById("videoelem"); - playButton = document.getElementById("videoplaybutton"); - videoZoomButton = document.getElementById("videozoombutton"); - if (!videoElem.play) { - playButton.style.display = "none"; - videoZoomButton.style.display = "none"; - return; - } - videoElem.addEventListener("play", startedPlaying); - videoElem.addEventListener("pause", stoppedPlaying); - videoElem.addEventListener("ended", function () { - if (!videoElem.paused) - videoElem.pause(); - stoppedPlaying(); - }); - videoElem.addEventListener("progress", updateProgress); - videoElem.addEventListener("begin", updateProgress); - videoElem.addEventListener("canplaythrough", function () { - videoElem.play(); - }); - videoElem.addEventListener("error", function() { - playButton.innerHTML = "Load failed"; - }); - videoElem.addEventListener("dataunavailable", function () { - if (!showProgress) { - showProgress = true; - playButton.innerHTML = "Loading..."; - playButton.className = "videobutton videoloading"; - } - }); - videoZoomButton.addEventListener("click", function () { - var container = document.getElementById("videocontainer"); - videoLargeSize = !videoLargeSize; - if (videoLargeSize) { - container.style.width = "640px"; - container.style.height = "360px"; - videoZoomButton.innerHTML = "-"; - } else { - container.style.width = "400px"; - container.style.height = "225px"; - videoZoomButton.innerHTML = "+"; - } - }); - playButton.addEventListener("click", function () { - if (videoElem.paused) { - if (!videoElem.src) - videoElem.src = "http://movies.apple.com/movies/us/apple/ipoditunes/2007/touch/ads/apple_ipodtouch_touch_r640-9cie.mov"; - videoElem.play(); - } else - videoElem.pause(); - } ); -} -</script> -<div id=videocontainer> -<video id=videoelem poster="resources/touch-poster.png"> -<b style="font-size:15pt">This is fallback content. If you had video support you would see some here!</b></video> -<div class="videobutton videoplay" id=videoplaybutton>></div> -<div id=videozoombutton class="videobutton videozoombutton videofadeout">+</div> -</div> -<script>initVideo();</script> |
