0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

durationchange no longer calles loadedmetadata; support updating video element to no items

Browse source
This commit is contained in:
j 2013-07-14 09:16:39 +00:00
parent a0b92c16e5
commit 76fc986e97
2 changed files with 66 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
source/Ox.UI/js/Video/VideoElement.js
View file

@ -4,7 +4,7 @@
Ox.VideoElement <f> VideoElement Object
options <o> Options object
autoplay <b|false> autoplay
items <a|[]> array of objects with src,in,out,duration,offset
items <a|[]> array of objects with src,in,out,duration
look <b|false> loop playback
self <o> Shared private variable
([options[, self]]) -> <o:Ox.Element> VideoElement Object
@ -34,6 +34,12 @@ Ox.VideoElement = function(options, self) {
if (self.currentItem >= self.numberOfItems) {
self.currentItem = 0;
}
if (!self.numberOfItems) {
self.video.src = '';
that.triggerEvent('durationchange', {
duration: that.duration()
});
} else {
if (self.currentItemId != self.items[self.currentItem].id) {
// check if current item is in new items
self.items.some(function(item, i) {
@ -50,7 +56,12 @@ Ox.VideoElement = function(options, self) {
setCurrentVideo();
}
}
that.triggerEvent('durationchange');
onLoadedMetadata(self.$video, function() {
that.triggerEvent('durationchange', {
duration: that.duration()
});
});
}
});
}
})
@ -78,13 +89,16 @@ Ox.VideoElement = function(options, self) {
loadItems(function() {
setCurrentItem(0);
self.options.autoplay && play();
onLoadedMetadata(self.$video, function() {
that.triggerEvent('loadedmetadata');
});
});
function getCurrentTime() {
var item = self.items[self.currentItem];
return self.seeking
? self.currentTime
: item.offset + self.video.currentTime - item['in'];
: item ? item.position + self.video.currentTime - item['in'] : 0;
}
function getset(key, value) {
@ -130,7 +144,9 @@ Ox.VideoElement = function(options, self) {
},
timeupdate: function() {
if (self.video == this) {
if (self.items[self.currentItem].out && this.currentTime >= self.items[self.currentItem].out) {
if (self.items[self.currentItem]
&& self.items[self.currentItem].out
&& this.currentTime >= self.items[self.currentItem].out) {
setCurrentItem(self.currentItem + 1);
}
}
@ -159,7 +175,7 @@ Ox.VideoElement = function(options, self) {
if (i < items.length) {
item = items[i];
item['in'] = item['in'] || 0;
item.offset = currentTime;
item.position = currentTime;
if (item.out) {
item.duration = item.out - item['in'];
}
@ -189,9 +205,6 @@ Ox.VideoElement = function(options, self) {
self.items = items;
self.numberOfItems = self.items.length;
callback && callback();
onLoadedMetadata(self.$video, function() {
that.triggerEvent('loadedmetadata');
});
}
}
}
@ -292,13 +305,14 @@ Ox.VideoElement = function(options, self) {
Ox.Log('Video', 'sCT', time);
var currentTime, currentItem;
self.items.forEach(function(item, i) {
if (time >= item.offset
&& time < item.offset + item.duration) {
if (time >= item.position
&& time < item.position + item.duration) {
currentItem = i;
currentTime = time - item.offset + item['in'];
currentTime = time - item.position + item['in'];
return false;
}
});
if(self.items.length) {
// Set to end of items if time > duration
if(Ox.isUndefined(currentItem) && Ox.isUndefined(currentTime)) {
currentItem = self.items.length -1;
@ -312,6 +326,9 @@ Ox.VideoElement = function(options, self) {
self.currentTime = time;
that.triggerEvent('seeking');
setCurrentItemTime(currentTime);
} else {
self.currentTime = 0;
}
}
/*@

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

@ -1255,12 +1255,25 @@ Ox.VideoPlayer = function(options, self) {
}
function durationchange() {
self.videoWidth = self.$video.videoWidth();
self.videoHeight = self.$video.videoHeight();
self.videoCSS = getVideoCSS();
self.posterMarkerCSS = getPosterMarkerCSS();
self.$video.css(self.videoCSS);
self.$poster && self.$poster.css(self.videoCSS);
self.$posterMarker && Ox.forEach(self.$posterMarker, function(marker, position) {
marker.css(self.posterMarkerCSS[position]);
});
self.out = self.options.playInToOut && self.out < self.$video.duration()
? self.out : self.$video.duration();
self.options.duration = self.out - self['in'];
self.$timeline && self.$timeline.replaceWith(
self.$timeline = getTimeline()
);
setPosition(self.$video.currentTime());
that.triggerEvent('durationchange', {
duration:self.options.duration
});
}
function ended() {