Commit 9633a884 authored by Michael Murtaugh's avatar Michael Murtaugh
Browse files

timeline & media sync

parent c412b7dc
......@@ -12,6 +12,7 @@
function aaMediaSync (element, opts) {
var that = {element: element},
allmedia = [element],
syncedmedia = [element],
uid = 0,
driver = null,
......@@ -22,6 +23,9 @@ function aaMediaSync (element, opts) {
trace: false
}, opts);
// console.log("aaMediaSync", element);
bindevents(element);
function remove (array, elt) {
......@@ -32,6 +36,7 @@ function aaMediaSync (element, opts) {
function add(elt, start, end) {
var id = ++uid;
allmedia.push(elt);
syncedmedia.push(elt);
// console.log("aamediasync.add", elt, start, end);
$(elt).data("aamediasync", {start: start, end: end});
......@@ -107,6 +112,7 @@ function aaMediaSync (element, opts) {
}
function enter (elt) {
//console.log("enter", elt);
// sync elt time to timeline
var rt = getRelativeTime(element, elt);
if (opts.trace) console.log("enter", elt, rt);
......@@ -121,6 +127,7 @@ function aaMediaSync (element, opts) {
that.enter = enter;
function exit (elt) {
// console.log("exit", elt);
if (opts.trace) console.log("exit");
remove(syncedmedia, elt);
elt.pause();
......@@ -129,6 +136,14 @@ function aaMediaSync (element, opts) {
function groupplay (triggering_elt) {
if (opts.trace) console.log("initiate groupplay");
if (get_all_ready()) {
$(syncedmedia).each(function () {
if (this != triggering_elt && is_visible(this)) {
this.play()
}
});
return;
}
initiatingGroupPlay = true;
if (triggering_elt) triggering_elt.pause();
when_all_ready(function () {
......@@ -141,12 +156,12 @@ function aaMediaSync (element, opts) {
});
window.setTimeout(function () {
initiatingGroupPlay = false;
}, 1000);
}, 500);
});
}
function bindevents (elt) {
bind(elt, "seeking", function () {
bind(elt, "seeking.aamediasync", function () {
if (opts.trace) console.log("seeking", this);
if (driver === null) {
driver = this;
......@@ -156,7 +171,7 @@ function aaMediaSync (element, opts) {
$(syncedmedia).each(function () { this.pause(); });
}
});
bind(elt, "seeked", function () {
bind(elt, "seeked.aamediasync", function () {
if (driver === this) {
// driver = null;
this.pause(); // HACK TO OVERRIDE (firefox) scrub resuming play
......@@ -174,7 +189,7 @@ function aaMediaSync (element, opts) {
});
}
})
bind(elt, "timeupdate", function () {
bind(elt, "timeupdate.aamediasync", function () {
var media = $(this).data("media");
if (driver === this) {
// SCRUB (timeupdate while buffering = scrub event ?!)
......@@ -193,30 +208,14 @@ function aaMediaSync (element, opts) {
});
}
});
bind(elt, "play", function () {
bind(elt, "play.aamediasync", function () {
// console.log(elt, "play");
if (initiatingGroupPlay === false) {
groupplay(this);
/*
if (opts.trace) console.log("initiate groupplay");
initiatingGroupPlay = true;
this.pause();
when_all_ready(function () {
if (opts.trace) console.log("ready, calling play");
// timeline.play();
$(syncedmedia).each(function () {
if (is_visible(this)) {
this.play()
}
});
window.setTimeout(function () {
initiatingGroupPlay = false;
}, 1000);
});
*/
}
});
bind(elt, "pause", function () {
// console.log("audio: pause");
bind(elt, "pause.aamediasync", function () {
// console.log(elt, "pause");
var eventreceiver = this;
if (is_visible(this) && initiatingGroupPlay === false && driver === null) {
// TRIGGER GROUP PAUSE
......@@ -229,6 +228,22 @@ function aaMediaSync (element, opts) {
}
});
}
function destroy () {
// NB: destroy should be called if a sync element is dropped or replaced.
// It unbinds all events to avoid future (often duplicate) reception of the events
$(allmedia).each(function () {
if (this.element) {
$(this.element).unbind('.aamediasync');
} else {
$(this).unbind(".aamediasync");
}
});
// maybe not strictly necessary, but...
allmedia = null;
syncedmedia = null;
}
that.destroy = destroy;
return that;
}
$.aaMediaSync = aaMediaSync;
......
......@@ -309,27 +309,17 @@ var methods = {
data.options = opts;
// data.tt = tt();
$(this).data('timeline', data);
}
// init ALWAYS creates a fresh timeline (so it can be used to reset
// the element and drop evt. dead refs)
// console.log("init timeline", opts);
// ONLY HAPPENS ON THE FIRST CALL
$this.bind("timeupdate.aatimeline", function (event, controller) {
var ct = opts.currentTime(elt);
// console.log("timeline: timeupdate", event.target, ct);
data.timeline.setCurrentTime(ct, controller);
return true;
});
}
// init ALWAYS creates a fresh timeline
data.timeline = aTimeline(opts);
/*
data.timeline = tt({
show: opts.show,
hide: opts.hide,
setCurrentTime: opts.setCurrentTime
});
*/
$this.bind("timeupdate", function (event, controller) {
// console.log("timeline: timeupdate", event);
// allow a wrapped getCurrentTime for the element (via playable?)
var ct = opts.currentTime(elt);
// console.log("timeline: timeupdate", event.target, ct);
data.timeline.setCurrentTime(ct, controller);
return true;
});
});
},
destroy : function( ) {
......@@ -337,9 +327,7 @@ var methods = {
return this.each(function(){
var $this = $(this),
data = $this.data('timeline');
// Namespacing FTW
$(window).unbind('.timeline');
$this.unbind('.aatimeline'); // untested
// data.tooltip.remove();
$this.removeData('timeline');
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment