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

some more interface improvements (escape hides secondary controls)

Browse source
This commit is contained in:
rolux 2011-05-17 22:44:04 +02:00
parent f1f66cce81
commit 1e826a8c53
1 changed files with 38 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -158,16 +158,8 @@ Ox.VideoPlayer = function(options, self) {
key_equal: function() { key_equal: function() {
changeVolumeBy(0.1); changeVolumeBy(0.1);
}, },
key_f: function() { key_escape: hideControls,
// need timeout so the "f" doesn't appear in the input field key_f: focusFind,
setTimeout(function() {
if (self.$find.is(':hidden')) {
toggleFind();
} else {
self.$findInput.focusInput();
}
}, 0);
},
key_g: function() { key_g: function() {
goToNextResult(1); goToNextResult(1);
}, },
@ -1075,6 +1067,20 @@ Ox.VideoPlayer = function(options, self) {
return results; return results;
} }
function focusFind() {
if (!self.interfaceIsVisible) {
showInterface();
}
// need timeout so the "f" doesn't appear in the input field
setTimeout(function() {
if (self.$find.is(':hidden')) {
toggleFind();
} else {
self.$findInput.focusInput();
}
}, 0);
}
function formatPosition(position) { function formatPosition(position) {
position = Ox.isUndefined(position) ? self.options.position : position; position = Ox.isUndefined(position) ? self.options.position : position;
return Ox.formatDuration(position, self.options.showMilliseconds); return Ox.formatDuration(position, self.options.showMilliseconds);
@ -1367,6 +1373,19 @@ Ox.VideoPlayer = function(options, self) {
return Ox.UI.getImagePath('symbol' + symbol + '.svg').replace('/classic/', '/modern/'); return Ox.UI.getImagePath('symbol' + symbol + '.svg').replace('/classic/', '/modern/');
} }
function hideControls() {
// fixme: slightly wrong name, this is about secondary controls
['find', 'volume', 'resolution'].forEach(function(element) {
var $element = self['$' + element];
$element && $element.is(':visible') && $element.animate({
opacity: 0
}, 250, function() {
$element.hide().css({opacity: 1});
});
});
self.options.fullscreen && hideInterface();
}
function hideInterface() { function hideInterface() {
Ox.print('hideInterface'); Ox.print('hideInterface');
clearTimeout(self.interfaceTimeout); clearTimeout(self.interfaceTimeout);
@ -1632,6 +1651,7 @@ Ox.VideoPlayer = function(options, self) {
} }
function changeVolumeBy(num) { function changeVolumeBy(num) {
showVolume();
self.options.volume = Ox.limit(self.options.volume + num, 0, 1); self.options.volume = Ox.limit(self.options.volume + num, 0, 1);
setVolume(self.options.volume); setVolume(self.options.volume);
self.$volumeInput && self.$volumeInput.options({ self.$volumeInput && self.$volumeInput.options({
@ -1710,6 +1730,11 @@ Ox.VideoPlayer = function(options, self) {
}).show(); }).show();
} }
function showVolume() {
!self.interfaceIsVisible && showInterface();
self.$volume && self.$volume.is(':hidden') && toggleVolume();
}
function submitFindInput(value, hasPressedEnter) { function submitFindInput(value, hasPressedEnter) {
self.options.find = value; self.options.find = value;
self.results = find(self.options.find, hasPressedEnter); self.results = find(self.options.find, hasPressedEnter);
@ -1792,9 +1817,7 @@ Ox.VideoPlayer = function(options, self) {
that.bind({ that.bind({
mousemove: function() { mousemove: function() {
showInterface(); showInterface();
//if (!self.mouseIsInControls) {
hideInterface(); hideInterface();
//}
} }
}); });
that.find('.OxControls').bind({ that.find('.OxControls').bind({
@ -1807,6 +1830,7 @@ Ox.VideoPlayer = function(options, self) {
}); });
showInterface(); showInterface();
hideInterface(); hideInterface();
that.gainFocus();
}); });
} else { } else {
// flag makes the animation end on absolute position // flag makes the animation end on absolute position
@ -1837,6 +1861,7 @@ Ox.VideoPlayer = function(options, self) {
} }
function toggleMuted(from) { function toggleMuted(from) {
showVolume();
self.options.muted = !self.options.muted; self.options.muted = !self.options.muted;
self.video.muted = self.options.muted; self.video.muted = self.options.muted;
if (!self.options.muted && !self.options.volume) { if (!self.options.muted && !self.options.volume) {