sanj/oxjs
1
0
Fork 0
forked from 0x2620/oxjs
Code Pull requests Activity

add new symbols

Browse source
This commit is contained in:
rolux 2011-05-18 09:38:11 +02:00
commit 6b33c631a9
8 changed files with 111 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -96,6 +96,7 @@ Ox.VideoPlayer = function(options, self) {
playInToOut: false,
position: 0,
poster: '',
posterFrame: -1,
preload: 'auto',
out: 0,
resolution: 0,
@ -355,6 +356,70 @@ Ox.VideoPlayer = function(options, self) {
}
}
self.$posterMarker = $('<div>')
.css({
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
})
.hide()
.appendTo(self.$videoContainer);
self.$posterMarkerLeft = $('<div>')
.css({
float: 'left',
background: 'rgba(0, 0, 0, 0.5)'
})
.css({
width: Math.floor((self.options.width - self.options.height) / 2) + 'px',
height: self.options.height + 'px'
})
.appendTo(self.$posterMarker);
self.$posterMarkerCenter = $('<div>')
.css({
border: '1px solid rgba(255, 255, 255, 0.1)'
})
.css({
float: 'left',
width: (self.options.height - 2) + 'px',
height: (self.options.height - 2) + 'px'
})
.appendTo(self.$posterMarker);
self.$posterMarkerRight = $('<div>')
.css({
background: 'rgba(0, 0, 0, 0.5)'
})
.css({
float: 'left',
width: Math.ceil((self.options.width - self.options.height) / 2) + 'px',
height: self.options.height + 'px'
})
.appendTo(self.$posterMarker);
self.$pointMarker = {};
['in', 'out'].forEach(function(point) {
self.$pointMarker[point] = {};
['top', 'bottom'].forEach(function(edge) {
var titleCase = Ox.toTitleCase(point) + Ox.toTitleCase(edge);
self.$pointMarker[point][edge] = $('<img>')
.addClass('OxMarkerPoint OxMarker' + titleCase)
.attr({
src: Ox.UI.PATH + 'png/videoMarker' + titleCase + '.png'
})
.hide()
.appendTo(self.$videoContainer);
/*
if (self.options.points[i] == self.options.position) {
self.$pointMarker[point][edge].show();
}
*/
});
});
if (self.options.subtitles.length || true) { // fixme
self.$subtitle = $('<div>')
//.addClass('OxSubtitle')
@ -1547,6 +1612,26 @@ Ox.VideoPlayer = function(options, self) {
}
}
function setMarkers() {
self.options.position == self.options.posterFrame ?
self.$posterMarker.show() : self.$posterMarker.hide();
Ox.forEach(self.$pointMarker, function(markers, point) {
Ox.forEach(markers, function(marker) {
self.options.position == self.options[point] ?
marker.show() : marker.hide();
});
});
}
function hideMarkers() {
self.$posterMarker.hide();
Ox.forEach(self.$pointMarker, function(markers) {
Ox.forEach(markers, function(marker) {
marker.hide();
});
});
}
function setPosition(position, from) {
position = Ox.limit(position, self['in'], self['out']);
self.options.position = Math.round(
@ -1567,6 +1652,7 @@ Ox.VideoPlayer = function(options, self) {
}, 250);
self.posterIsVisible = false;
}
self.options.paused && setMarkers();
self.$subtitle && setSubtitle();
self.$timeline /*&& from != 'timeline'*/ && self.$timeline.options({
position: self.options.position
@ -1913,6 +1999,7 @@ Ox.VideoPlayer = function(options, self) {
opacity: 0
}, 250, togglePlayIcon);
}
hideMarkers();
}
if (self.$playButton && from != 'button') {
self.$playButton.toggleTitle();