add new timeline and find input to video player

This commit is contained in:
rolux 2011-05-16 13:29:26 +02:00
commit ce33d3650a
6 changed files with 326 additions and 162 deletions

View file

@ -3,6 +3,7 @@ Ox.SmallVideoTimeline = function(options, self) {
self = self || {};
var that = Ox.Element({}, self)
.defaults({
_offset: 0, // hack for cases where all these position: absolute elements have to go into a float: left
duration: 0,
editing: false,
getTimelineURL: null,
@ -226,13 +227,15 @@ Ox.SmallVideoTimeline = function(options, self) {
self.$positionMarker.css({
left: self.interfaceLeft + Math.round(
self.options.position * self.imageWidth / self.options.duration
) - (self.options.type == 'editor' ? 4 : 0) + 'px',
) - (self.options.type == 'editor' ? 4 : 0) + self.options._offset + 'px',
});
}
function setWidth() {
self.imageWidth = self.options.width -
(self.options.type == 'player' ? 16 : 8);
self.interfaceWidth = self.options.type == 'player' ?
self.options.width : self.imageWidth;
that.css({
width: self.options.width + 'px'
});
@ -252,10 +255,24 @@ Ox.SmallVideoTimeline = function(options, self) {
}
self.setOption = function(key, value) {
if (key == 'paused') {
if (key == 'duration') {
self.$image.options({
duration: value
});
} else if (key == 'paused') {
self.$positionMarkerRing.css({
borderColor: 'rgba(255, 255, 255, ' + (self.options.paused ? 0.5 : 1) + ')'
})
} else if (key == 'position') {
setPositionMarker();
} else if (key == 'results') {
self.$image.options({
results: value
});
} else if (key == 'subtitles') {
self.$image.options({
subtitles: value
});
} else if (key == 'width') {
setWidth();
}