VideoPlayer: use new video icon, avoid showing first frame of video if position is set, fix showIcon/showIconOnLoad, remove non existing options from documentation

This commit is contained in:
j 2014-02-04 09:32:53 +00:00
parent 403e38a57f
commit 2e86007187

View file

@ -39,9 +39,6 @@ Ox.VideoPlayer <f> Generic Video Player
height <n|144> Height in px (excluding external controls)
in <n> In point (sec)
invertHighlight <b|false> If true, invert selection highlight on timeline
keepIconVisible <b|false> If true, play icon stays visible after mouseleave
keepLargeTimelineVisible <b|false> If true, large timeline stays visible after mouseleave
keepLogoVisible <b|false> If true, logo stays visible after mouseleave
logo <s|''> Logo image URL
logoLink <s|''> Logo link URL
logoTitle <s|''> Text for Logo tooltip // fixme: shouldn't this be logoTooltip then?s
@ -139,9 +136,6 @@ Ox.VideoPlayer = function(options, self) {
fullscreen: false,
height: 144,
'in': 0,
keepIconVisible: false,
keepLargeTimelineVisible: false,
keepLogoVisible: false,
logo: '',
logoLink: '',
logoTitle: '',
@ -363,8 +357,7 @@ Ox.VideoPlayer = function(options, self) {
if (
(!self.options.externalControls &&
(self.options.controlsTop.length || self.options.controlsBottom.length)) ||
self.options.showIcon
(self.options.controlsTop.length || self.options.controlsBottom.length))
) {
that.on({
mouseenter: function() {
@ -433,6 +426,8 @@ Ox.VideoPlayer = function(options, self) {
.appendTo(self.$videoContainer);
self.$video.$element.css({position: 'absolute'});
// avoid showing first frame
self.$video.hide();
} else {
@ -541,7 +536,7 @@ Ox.VideoPlayer = function(options, self) {
.attr({
src: Ox.UI.getImageURL('symbol' + (
self.options.paused ? 'Play' : 'Pause'
), 'video')
), 'videoIcon')
})
.appendTo(self.$videoContainer);
if (self.options.showIcon) {
@ -560,7 +555,7 @@ Ox.VideoPlayer = function(options, self) {
.addClass('OxCensoredIcon OxVideo')
.attr({
src: Ox.UI.getImageURL(
'symbol' + self.options.censoredIcon, 'video'
'symbol' + self.options.censoredIcon, 'videoIcon'
)
})
.hide()
@ -1772,6 +1767,15 @@ Ox.VideoPlayer = function(options, self) {
});
}
function hidePoster() {
if (self.posterIsVisible) {
self.$poster.animate({
opacity: 0
}, 250);
self.posterIsVisible = false;
}
}
function isEqual(a, b) {
return Math.abs(a - b) < 0.001;
}
@ -1846,12 +1850,12 @@ Ox.VideoPlayer = function(options, self) {
hideLoadingIcon();
if (self.options.showIcon || self.options.showIconOnLoad) {
//!self.options.keepIconVisible && self.$playIcon.addClass('OxInterface');
if (self.options.showIconOnLoad) {
self.$playIcon.animate({
opacity: 1
}, 250);
}
if (self.options.showControlsOnLoad) {
showControls();
}
!hadDuration && self.$timeline && self.$timeline.replaceWith(
self.$timeline = getTimeline()
@ -2079,7 +2083,9 @@ Ox.VideoPlayer = function(options, self) {
self.seekTimeout = 0;
Ox.Log('Video', 'hide loading icon')
hideLoadingIcon();
self.$video.show();
self.$playIcon && self.$playIcon.show();
hidePoster();
}
function seeking() {
@ -2144,12 +2150,6 @@ Ox.VideoPlayer = function(options, self) {
}, 250);
self.iconIsVisible = false;
}
if (self.posterIsVisible) {
self.$poster.animate({
opacity: 0
}, 250);
self.posterIsVisible = false;
}
self.$timeline /*&& from != 'timeline'*/ && self.$timeline.options({
position: self.options.position
});
@ -2530,21 +2530,26 @@ Ox.VideoPlayer = function(options, self) {
clearInterval(self.playInterval);
if (self.options.showIcon) {
togglePlayIcon();
self.options.showIcon && self.$playIcon.animate({
self.$playIcon.animate({
opacity: 1
}, 250);
}
self.playInToOut = false;
} else {
hidePoster();
if (self.options.playInToOut && self.options.position > self.options.out - self.secondsPerFrame) {
setPosition(self.options['in']);
}
self.$video.play();
self.playInterval = setInterval(playing, self.millisecondsPerFrame);
if (self.options.showIcon) {
self.options.showIcon && self.$playIcon.animate({
self.$playIcon.animate({
opacity: 0
}, 250, togglePlayIcon);
} else if (self.options.showIconOnLoad) {
self.$playIcon.animate({
opacity: 0
}, 250);
}
self.options.showMarkers && hideMarkers();
}
@ -2563,7 +2568,7 @@ Ox.VideoPlayer = function(options, self) {
self.$playIcon.attr({
src: Ox.UI.getImageURL(
'symbol' + (self.options.paused ? 'Play' : 'Pause'
), 'video')
), 'videoIcon')
});
}