0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

fix bugs in video player: allow for setting volume from outside, only show volume control if enabled

Browse source
This commit is contained in:
rlx 2012-04-17 11:58:17 +00:00
parent 8c963339fd
commit 7e8f5bef32
1 changed files with 16 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
source/Ox.UI/js/Video/Ox.VideoPlayer.js
View file

@ -173,6 +173,8 @@ Ox.VideoPlayer = function(options, self) {
}
self.options.position = Ox.limit(self.options.position, self['in'], self.out);
self.hasVolumeControl = self.options.controlsTop.indexOf('volume') > -1
|| self.options.controlsBottom.indexOf('volume') > -1;
self.millisecondsPerFrame = 1000 / self.options.fps;
self.secondsPerFrame = 1 / self.options.fps;
self.barHeight = 16;
@ -651,8 +653,8 @@ Ox.VideoPlayer = function(options, self) {
} else if (control == 'position') {
self.positionWidth = 48 +
!!self.options.showMilliseconds * 2
self.positionWidth = 48
+ !!self.options.showMilliseconds * 2
+ self.options.showMilliseconds * 6;
self.$position = Ox.Element({
@ -662,7 +664,7 @@ Ox.VideoPlayer = function(options, self) {
})
.addClass('OxPosition')
.css({
width: (self.positionWidth - 4) + 'px',
width: self.positionWidth - 4 + 'px',
})
.html(formatPosition())
.bind({
@ -1001,7 +1003,7 @@ Ox.VideoPlayer = function(options, self) {
----------------------------------------------------------------------------
*/
if (self.options.enableVolume || true) { // fixme
if (self.hasVolumeControl) {
self.$volume = $('<div>')
.addClass('OxControls OxVolume')
@ -1094,7 +1096,7 @@ Ox.VideoPlayer = function(options, self) {
}
function changeVolume(num) {
showVolume();
self.hasVolumeControl && showVolume();
self.options.volume = Ox.limit(self.options.volume + num, 0, 1);
setVolume(self.options.volume);
self.$volumeInput && self.$volumeInput.value(self.options.volume);
@ -1406,15 +1408,10 @@ Ox.VideoPlayer = function(options, self) {
type: 'player',
width: getTimelineWidth()
})
.css({
float: 'left'
})
.css({
background: '-moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'
})
.css({
background: '-webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'
})
.css({float: 'left'})
.css({background: '-moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'})
.css({background: '-o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'})
.css({background: '-webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'})
.bindEvent({
position: function(data) {
setPosition(data.position, 'timeline');
@ -2044,10 +2041,10 @@ Ox.VideoPlayer = function(options, self) {
if (!!self.options.volume == self.options.muted) {
toggleMuted();
} else {
self.$volumeButton.options({
self.$volumeButton && self.$volumeButton.options({
title: getVolumeImage()
});
self.$volumeValue.html(
self.$volumeValue && self.$volumeValue.html(
self.options.muted ? 0 : Math.round(self.options.volume * 100)
);
}
@ -2235,7 +2232,7 @@ Ox.VideoPlayer = function(options, self) {
}
function toggleMuted(from) {
showVolume();
self.hasVolumeControl && showVolume();
self.options.muted = !self.options.muted;
self.$video.muted(self.options.muted);
if (!self.options.muted && !self.options.volume) {
@ -2380,6 +2377,8 @@ Ox.VideoPlayer = function(options, self) {
toggleScale();
} else if (key == 'sizeIsLarge') {
self.$sizeButton.toggle();
} else if (key == 'volume') {
setVolume(value);
}
};