From 3431b7ebdff020c32f4ad9476dc0f5df838532b0 Mon Sep 17 00:00:00 2001
From: rolux <rolux@dev>
Date: Sat, 18 Sep 2010 12:50:08 +0000
Subject: [PATCH] timeline view: make in and out players display an image, not
 a video

---
 build/js/ox.ui.js | 80 +++++++++++++++++++++++++++++------------------
 1 file changed, 49 insertions(+), 31 deletions(-)

diff --git a/build/js/ox.ui.js b/build/js/ox.ui.js
index 35275cc..7c606fe 100644
--- a/build/js/ox.ui.js
+++ b/build/js/ox.ui.js
@@ -9482,6 +9482,7 @@ requires
                     cuts: [],
                     duration: 0,
                     find: '',
+                    frameURL: function() {},
                     largeTimeline: true,
                     matches: [],
                     points: [0, 0],
@@ -9518,7 +9519,7 @@ requires
                     posterFrame: self.options.posterFrame,
                     subtitles: self.options.subtitles,
                     type: type,
-                    url: self.options.videoURL,
+                    url: type == 'play' ? self.options.videoURL : self.options.frameURL,
                     width: self.sizes.player[i].width
                 })
                 .css({
@@ -9917,24 +9918,26 @@ requires
 
         self.controlsHeight = 16;
 
-        self.$video = $('<video>')
-            .attr({
-                preload: 'auto'
-            })
-            .css({
-                height: self.options.height + 'px',
-                width: self.options.width + 'px'
-            })
-            .appendTo(that.$element);
-
-        self.video = self.$video[0];
-
-        // fixme: can be removed once in and out players only display stills
-        var other = $('video[src='+self.options.url+']')[0];
-        if (self.video.mozLoadFrom && other)
-            self.video.mozLoadFrom(other);
-        else
-            self.video.src = self.options.url;
+        if (self.options.type == 'play') {
+            self.$video = $('<video>')
+                .attr({
+                    preload: 'auto',
+                    src: self.options.url
+                })
+                .css({
+                    height: self.options.height + 'px',
+                    width: self.options.width + 'px'
+                })
+                .appendTo(that.$element);
+            self.video = self.$video[0];
+        } else {
+            self.$video = $('<img>')
+                .css({
+                    height: self.options.height + 'px',
+                    width: self.options.width + 'px'
+                })
+                .appendTo(that.$element)
+        }
 
         self.$subtitle = $('<div>')
             .addClass('OxSubtitle')
@@ -10089,17 +10092,20 @@ requires
             }).addClass('foo');
         });
 
-        self.$loadingIcon = new Ox.LoadingIcon()
-            .appendTo(that)
-            .start();
-
-        self.loadInterval = setInterval(function() {
-            if (self.video.readyState) {
-                clearInterval(self.loadInterval);
-                self.$loadingIcon.stop();
-                setPosition();
-            }
-        }, 50);
+        if (self.options.type == 'play') {
+            self.$loadingIcon = new Ox.LoadingIcon()
+                .appendTo(that)
+                .start();
+            self.loadingInterval = setInterval(function() {
+                if (self.video.readyState) {
+                    clearInterval(self.loadingInterval);
+                    self.$loadingIcon.stop();
+                    setPosition();
+                }
+            }, 50);
+        } else {
+            setPosition();
+        }
 
         function getSubtitle() {
             var subtitle = '';
@@ -10166,7 +10172,19 @@ requires
         }
 
         function setPosition() {
-            self.video.currentTime = self.options.position;
+            if (self.options.type == 'play') {
+                self.video.currentTime = self.options.position;
+            } else {
+                self.$loadingIcon = new Ox.LoadingIcon()
+                    .appendTo(that)
+                    .start();
+                self.$video.attr({
+                        src: self.options.url(self.options.position)
+                    })
+                    .one('load', function() {
+                        self.$loadingIcon.stop();
+                    });
+            }
             setMarkers();
             setSubtitle();
             self.$positionInput.options({