smaller fixes (tooltip corner cases, block timeline)

This commit is contained in:
rolux 2011-05-17 19:04:33 +02:00
parent 1086be2686
commit 9650a29a90
4 changed files with 21 additions and 15 deletions

View file

@ -1738,7 +1738,7 @@ Miscellaneous
padding: 1px 2px 1px 2px; padding: 1px 2px 1px 2px;
font-size: 9px; font-size: 9px;
//opacity: 0; //opacity: 0;
z-index: 12; z-index: 1001;
-moz-border-radius: 4px; -moz-border-radius: 4px;
-webkit-border-radius: 4px; -webkit-border-radius: 4px;
} }

View file

@ -31,6 +31,7 @@ Ox.SmallVideoTimelineImage = function(options, self) {
self.height = self.options.type == 'player' ? 16 : 24; self.height = self.options.type == 'player' ? 16 : 24;
self.imageHeight = self.options.type == 'player' ? 16 : 18; self.imageHeight = self.options.type == 'player' ? 16 : 18;
self.imageTop = self.options.type == 'player' ? 0 : 3; self.imageTop = self.options.type == 'player' ? 0 : 3;
self.timelineTop = self.options.type == 'player' ? 0 : 4;
that.css({ that.css({
height: self.height + 'px' height: self.height + 'px'
@ -43,9 +44,9 @@ Ox.SmallVideoTimelineImage = function(options, self) {
}) })
.css({ .css({
position: 'absolute', position: 'absolute',
top: self.imageTop + 'px', top: self.timelineTop + 'px',
width: self.options.width + 'px', width: self.options.width + 'px',
height: self.imageHeight + 'px', height: '16px'
}) })
.appendTo(that.$element); .appendTo(that.$element);
} else { } else {
@ -57,9 +58,9 @@ Ox.SmallVideoTimelineImage = function(options, self) {
.css({ .css({
position: 'absolute', position: 'absolute',
left: (i * 3600) + 'px', left: (i * 3600) + 'px',
top: self.imageTop + 'px', top: self.timelineTop + 'px',
width: (i == self.images - 1 ? self.imageWidth % 3600 : 3600) + 'px', width: (i == self.images - 1 ? self.imageWidth % 3600 : 3600) + 'px',
height: self.imageHeight + 'px', height: '16px'
}) })
.appendTo(that.$element); .appendTo(that.$element);
}); });

View file

@ -635,8 +635,13 @@ Ox.VideoPlayer = function(options, self) {
.bind({ .bind({
click: function() { click: function() {
if (!self.options.paused) { if (!self.options.paused) {
self.wasPlaying = true; self.playOnSubmit = true;
togglePaused(true); togglePaused(true);
} else if (self.playOnLoad) {
// if clicked during resolution switch,
// don't play on load
self.playOnLoad = false;
self.playOnSubmit = true;
} }
self.$position.hide(); self.$position.hide();
self.$positionInput self.$positionInput
@ -758,7 +763,7 @@ Ox.VideoPlayer = function(options, self) {
}, },
mouseleave: function() { mouseleave: function() {
$(this).css({ $(this).css({
background: 'rgba(64, 64, 64, 0.25)' background: 'rgba(32, 32, 32, 0.5)'
}); });
} }
}) })
@ -1713,10 +1718,10 @@ Ox.VideoPlayer = function(options, self) {
self.$positionInput.hide(); self.$positionInput.hide();
self.$position.html('').show(); self.$position.html('').show();
setPosition(parsePositionInput(self.$positionInput.options('value')), true); setPosition(parsePositionInput(self.$positionInput.options('value')), true);
if (self.wasPlaying) { if (self.playOnSubmit) {
togglePaused(true); togglePaused(true);
self.video.play(); self.video.play();
self.wasPlaying = false; self.playOnSubmit = false;
} }
if (self.focus == 'mouseenter' && !self.mouseHasLeft) { if (self.focus == 'mouseenter' && !self.mouseHasLeft) {
that.gainFocus(); that.gainFocus();
@ -1732,12 +1737,12 @@ Ox.VideoPlayer = function(options, self) {
} }
function toggleFullscreen(toggleButton) { function toggleFullscreen(toggleButton) {
var parentOffset, wasPlaying; var parentOffset, playOnFullscreen;
self.options.fullscreen = !self.options.fullscreen; self.options.fullscreen = !self.options.fullscreen;
if (!self.options.paused) { if (!self.options.paused) {
// video won't keep playing accross detach/append // video won't keep playing accross detach/append
self.video.pause(); self.video.pause();
wasPlaying = true; playOnFullscreen = true;
} }
if (self.options.fullscreen) { if (self.options.fullscreen) {
self.$parent = that.parent(); self.$parent = that.parent();
@ -1755,7 +1760,7 @@ Ox.VideoPlayer = function(options, self) {
}) })
.appendTo(Ox.UI.$body); .appendTo(Ox.UI.$body);
setSizes(function() { setSizes(function() {
wasPlaying && self.video.play(); playOnFullscreen && self.video.play();
that.bind({ that.bind({
mousemove: function() { mousemove: function() {
if (!self.mouseIsInControls) { if (!self.mouseIsInControls) {
@ -1793,7 +1798,7 @@ Ox.VideoPlayer = function(options, self) {
zIndex: 1 zIndex: 1
}) })
.appendTo(self.$parent); .appendTo(self.$parent);
wasPlaying && self.video.play(); playOnFullscreen && self.video.play();
self.options.enableKeyboard && that.gainFocus(); self.options.enableKeyboard && that.gainFocus();
//showInterface(); //showInterface();
}); });

View file

@ -55,8 +55,8 @@ Ox.Tooltip = function(options, self) {
that.appendTo(Ox.UI.$body); that.appendTo(Ox.UI.$body);
width = that.width(); width = that.width();
height = that.height(); height = that.height();
left = Ox.limit(x - width / 2, 0, Ox.UI.$document.width() - width); left = Ox.limit(x - width / 2, 0, window.innerWidth - width);
top = y > Ox.UI.$document.height() - height - 16 ? y - 32 : y + 16; top = y > window.innerHeight - height - 16 ? y - 16 - height : y + 16;
that.css({ that.css({
left: left + 'px', left: left + 'px',
top: top + 'px' top: top + 'px'