add new timeline and find input to video player
This commit is contained in:
parent
ac2ea5f53d
commit
ce33d3650a
6 changed files with 326 additions and 162 deletions
|
|
@ -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();
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue