diff --git a/source/Ox.UI/js/Video/VideoPlayer.js b/source/Ox.UI/js/Video/VideoPlayer.js index b2c5d4b6..c639892a 100644 --- a/source/Ox.UI/js/Video/VideoPlayer.js +++ b/source/Ox.UI/js/Video/VideoPlayer.js @@ -13,11 +13,11 @@ Ox.VideoPlayer Generic Video Player censoredTooltip Tooltip for 'censored' icon controlsBottom <[s]|[]> Bottom controls, from left to right Can be 'close', fullscreen', 'scale', 'title', 'find', 'open', - 'play', 'playInToOut', 'previous', 'next', 'mute', 'volume', 'size', - 'timeline', 'position', 'settings', and 'space[int]'. A 'space16' - control, for example, is empty space that is 16px wide, and a - 'space' control is empty space that separates left-aligned from - right-aligned controls. + 'play', 'playInToOut', 'previous', 'next', 'loop', 'mute', 'volume', + 'size', 'timeline', 'position', 'settings', and 'space[int]'. A + 'space16' control, for example, is empty space that is 16px wide, + and a 'space' control is empty space that separates left-aligned + from right-aligned controls. controlsTooltips Tooltip text per control id controlsTop <[s]|[]> Top controls, from left to right duration Duration (sec) @@ -44,6 +44,7 @@ Ox.VideoPlayer Generic Video Player logo Logo image URL logoLink Logo link URL logoTitle Text for Logo tooltip // fixme: shouldn't this be logoTooltip then?s + loop If true, video loops muted If true, video is muted paused If true, video is paused playInToOut If true, video plays only from in to out @@ -142,6 +143,7 @@ Ox.VideoPlayer = function(options, self) { logo: '', logoLink: '', logoTitle: '', + loop: false, muted: false, paused: false, playInToOut: false, @@ -677,6 +679,22 @@ Ox.VideoPlayer = function(options, self) { }) .appendTo(self['$controls' + titleCase]); + } else if (control == 'loop') { + + self.$loopButton = Ox.Button({ + style: 'video', + tooltip: [Ox._('Don\'t Loop'), Ox._('Loop')], + type: 'image', + value: self.options.loop ? 'RepeatNone' : 'RepeatAll', + values: ['RepeatNone', 'RepeatAll'] + }) + .bindEvent({ + click: function() { + toggleLoop('button'); + } + }) + .appendTo(self['$controls' + titleCase]); + } else if (control == 'mute') { self.$muteButton = Ox.Button({ @@ -1236,21 +1254,26 @@ Ox.VideoPlayer = function(options, self) { } function ended() { - !self.options.paused && togglePaused(); - if (self.options.poster) { - self.$poster.animate({ - opacity: 1 - }, 250); - self.posterIsVisible = true; + if (self.options.loop) { + rewind(); + self.$video.play(); + } else { + !self.options.paused && togglePaused(); + if (self.options.poster) { + self.$poster.animate({ + opacity: 1 + }, 250); + self.posterIsVisible = true; + } + if (self.options.showIconOnLoad) { + self.$playIcon.animate({ + opacity: 1 + }, 250); + self.iconIsVisible = true; + } + self.options.rewind && setTimeout(rewind, 250); + that.triggerEvent('ended'); } - if (self.options.showIconOnLoad) { - self.$playIcon.animate({ - opacity: 1 - }, 250); - self.iconIsVisible = true; - } - self.options.rewind && rewind(); - that.triggerEvent('ended'); } function enterFullscreen() { @@ -1832,10 +1855,13 @@ Ox.VideoPlayer = function(options, self) { ) { if (self.isPlaylist) { self.$video.playNext(); + } else if (self.options.loop) { + rewind(); + self.$video.play(); } else { togglePaused(); if (self.options.rewind) { - rewind(); + setTimeout(rewind, 250); } else { setPosition(self.playInToOut ? self.options.out : self.out/*, 'video'*/); } @@ -2002,9 +2028,7 @@ Ox.VideoPlayer = function(options, self) { } function rewind() { - setTimeout(function() { - setPosition(self.options.playInToOut ? self.options['in'] : 0); - }, 250); + setPosition(self.options.playInToOut ? self.options['in'] : 0); } function seeked() { @@ -2394,6 +2418,16 @@ Ox.VideoPlayer = function(options, self) { }); } + function toggleLoop(from) { + self.options.loop = !self.options.loop; + if (self.$loopButton && from != 'button') { + self.$loopButton.toggle(); + } + that.triggerEvent('loop', { + loop: self.options.loop + }); + } + function toggleMuted(from) { self.hasVolumeControl && showVolume(); self.options.muted = !self.options.muted;