fixed sync between audio player, map, audio-links

This commit is contained in:
Bachir Soussi Chiadmi
2018-03-19 23:10:16 +01:00
parent 740405b746
commit 563f81c1b1
4 changed files with 60 additions and 34 deletions
@@ -39,6 +39,7 @@
var _no_articles_nodes = []; var _no_articles_nodes = [];
var _nodes_by_entries = {}; var _nodes_by_entries = {};
var _nodes_by_nid = {}; var _nodes_by_nid = {};
var _nodes_Nid_Id = {};
var _nodes_centered = []; var _nodes_centered = [];
var _nodes_centered_attractions = []; var _nodes_centered_attractions = [];
@@ -216,6 +217,7 @@
_nodes.push(this); _nodes.push(this);
_nodes_by_nid[this.nid] = this; _nodes_by_nid[this.nid] = this;
_nodes_Nid_Id[this.nid] = this.id;
if(this.has_article == 1){ if(this.has_article == 1){
_articles_nodes.push(this); _articles_nodes.push(this);
@@ -590,11 +592,13 @@
} }
}; };
// show opened audio node // show opened audio node
function openNode(id){ function openNodeByNid(nid){
console.log('Corpus openNode()', nid);
closeNode(); closeNode();
if(typeof _nodes[id] !== 'undefined'){ if(typeof _nodes_Nid_Id[nid] != 'undefined'){
_node_opened_id = id; console.log('node exists');
_nodes[id].open(); _node_opened_id = _nodes_Nid_Id[nid];
_nodes[_nodes_Nid_Id[nid]].open();
} }
} }
function closeNode(){ function closeNode(){
@@ -802,7 +806,8 @@
} }
}) })
.on('audio-node-opened', function(e){ .on('audio-node-opened', function(e){
openNode(e.id); console.log('Corpus audio-node-opened', e);
openNodeByNid(e.nid);
}) })
.on('audio-node-closed', function(e){ .on('audio-node-closed', function(e){
closeNode(); closeNode();
@@ -39,6 +39,7 @@
var _no_articles_nodes = []; var _no_articles_nodes = [];
var _nodes_by_entries = {}; var _nodes_by_entries = {};
var _nodes_by_nid = {}; var _nodes_by_nid = {};
var _nodes_Nid_Id = {};
var _nodes_centered = []; var _nodes_centered = [];
var _nodes_centered_attractions = []; var _nodes_centered_attractions = [];
@@ -216,6 +217,7 @@
_nodes.push(this); _nodes.push(this);
_nodes_by_nid[this.nid] = this; _nodes_by_nid[this.nid] = this;
_nodes_Nid_Id[this.nid] = this.id;
if(this.has_article == 1){ if(this.has_article == 1){
_articles_nodes.push(this); _articles_nodes.push(this);
@@ -590,11 +592,13 @@
} }
}; };
// show opened audio node // show opened audio node
function openNode(id){ function openNodeByNid(nid){
console.log('Corpus openNode()', nid);
closeNode(); closeNode();
if(typeof _nodes[id] !== 'undefined'){ if(typeof _nodes_Nid_Id[nid] != 'undefined'){
_node_opened_id = id; console.log('node exists');
_nodes[id].open(); _node_opened_id = _nodes_Nid_Id[nid];
_nodes[_nodes_Nid_Id[nid]].open();
} }
} }
function closeNode(){ function closeNode(){
@@ -802,7 +806,8 @@
} }
}) })
.on('audio-node-opened', function(e){ .on('audio-node-opened', function(e){
openNode(e.id); console.log('Corpus audio-node-opened', e);
openNodeByNid(e.nid);
}) })
.on('audio-node-closed', function(e){ .on('audio-node-closed', function(e){
closeNode(); closeNode();
@@ -106,7 +106,8 @@
// object events // object events
this.event_handlers = { this.event_handlers = {
'audio-play-next':[], 'audio-play-next':[],
'audio-ended':[] 'audio-ended':[],
'stop-shuffle':[]
}; };
this.init(); this.init();
@@ -147,7 +148,7 @@
// emmit new playing doc (e.g.: corpus map nowing that audio played from RandomPlayer) // emmit new playing doc (e.g.: corpus map nowing that audio played from RandomPlayer)
_$corpus_canvas.trigger({ _$corpus_canvas.trigger({
'type':'audio-node-opened', 'type':'audio-node-opened',
'id':this.historic[this.currentHistoricIndex].id 'nid':this.historic[this.currentHistoricIndex].nid
}); });
this.showHidePreviousBtn(); this.showHidePreviousBtn();
this.showHideNextBtn(); this.showHideNextBtn();
@@ -239,7 +240,7 @@
.fail(this.onNodeLoadFail.bind(this)); .fail(this.onNodeLoadFail.bind(this));
}, },
onNodeLoaded(data){ onNodeLoaded(data){
console.log('AudioPlayer node loaded', data); console.log('AudioPlayer node loaded');
this.$cartel.html(data.rendered).removeClass('loading'); this.$cartel.html(data.rendered).removeClass('loading');
_$body.trigger({'type':'new-audio-cartel-loaded'}); _$body.trigger({'type':'new-audio-cartel-loaded'});
initAjaxLinks(); initAjaxLinks();
@@ -294,6 +295,7 @@
handler = this.event_handlers[event_name][i]; handler = this.event_handlers[event_name][i];
setTimeout(handler, 0); setTimeout(handler, 0);
} }
return this;
}, },
} }
@@ -352,10 +354,13 @@
// Audio links // Audio links
if($link.is('.audio-link')){ if($link.is('.audio-link')){
_audio_player.openDocument({ // TODO: stop randomplayer
nid:$link.attr('nid'), _audio_player
audio_url:$link.attr('audio_url') .emmit('stop-shuffle')
}); .openDocument({
nid:$link.attr('nid'),
audio_url:$link.attr('audio_url')
});
return false; return false;
} }
@@ -506,7 +511,9 @@
}) })
.on('corpus-cliked-on-node', function(e) { .on('corpus-cliked-on-node', function(e) {
console.log('theme : corpus-cliked-on-node', e); console.log('theme : corpus-cliked-on-node', e);
_audio_player.openDocument(e.target_node); _audio_player
.emmit('stop-shuffle')
.openDocument(e.target_node);
}); });
_randomPlayer = new RandomPlayer(e.playlist); _randomPlayer = new RandomPlayer(e.playlist);
@@ -539,7 +546,8 @@
// attach an event on AudioPlayer // attach an event on AudioPlayer
_audio_player _audio_player
.on('audio-ended', this.onAudioPlayerEnded.bind(this)) .on('audio-ended', this.onAudioPlayerEnded.bind(this))
.on('audio-play-next', this.onAudioPlayNext.bind(this)); .on('audio-play-next', this.onAudioPlayNext.bind(this))
.on('stop-shuffle', this.stop.bind(this));
}, },
shuffle(){ shuffle(){
var tempPLaylist = []; var tempPLaylist = [];
@@ -555,20 +563,20 @@
}, },
toggleActive(e){ toggleActive(e){
if (this.active) { if (this.active) {
this.$btn.removeClass('is-active');
this.stop(); this.stop();
}else{ }else{
this.$btn.addClass('is-active');
this.shuffle();
this.start(); this.start();
} }
}, },
start(){ start(){
this.active = _audio_player.shuffle_is_active = true; this.active = _audio_player.shuffle_is_active = true;
this.$btn.addClass('is-active');
this.shuffle();
this.next(); this.next();
}, },
stop(){ stop(){
this.active = _audio_player.shuffle_is_active = false; this.active = _audio_player.shuffle_is_active = false;
this.$btn.removeClass('is-active');
// stop audio player // stop audio player
_audio_player.stop(); _audio_player.stop();
}, },
@@ -106,7 +106,8 @@
// object events // object events
this.event_handlers = { this.event_handlers = {
'audio-play-next':[], 'audio-play-next':[],
'audio-ended':[] 'audio-ended':[],
'stop-shuffle':[]
}; };
this.init(); this.init();
@@ -147,7 +148,7 @@
// emmit new playing doc (e.g.: corpus map nowing that audio played from RandomPlayer) // emmit new playing doc (e.g.: corpus map nowing that audio played from RandomPlayer)
_$corpus_canvas.trigger({ _$corpus_canvas.trigger({
'type':'audio-node-opened', 'type':'audio-node-opened',
'id':this.historic[this.currentHistoricIndex].id 'nid':this.historic[this.currentHistoricIndex].nid
}); });
this.showHidePreviousBtn(); this.showHidePreviousBtn();
this.showHideNextBtn(); this.showHideNextBtn();
@@ -239,7 +240,7 @@
.fail(this.onNodeLoadFail.bind(this)); .fail(this.onNodeLoadFail.bind(this));
}, },
onNodeLoaded(data){ onNodeLoaded(data){
console.log('AudioPlayer node loaded', data); console.log('AudioPlayer node loaded');
this.$cartel.html(data.rendered).removeClass('loading'); this.$cartel.html(data.rendered).removeClass('loading');
_$body.trigger({'type':'new-audio-cartel-loaded'}); _$body.trigger({'type':'new-audio-cartel-loaded'});
initAjaxLinks(); initAjaxLinks();
@@ -294,6 +295,7 @@
handler = this.event_handlers[event_name][i]; handler = this.event_handlers[event_name][i];
setTimeout(handler, 0); setTimeout(handler, 0);
} }
return this;
}, },
} }
@@ -352,10 +354,13 @@
// Audio links // Audio links
if($link.is('.audio-link')){ if($link.is('.audio-link')){
_audio_player.openDocument({ // TODO: stop randomplayer
nid:$link.attr('nid'), _audio_player
audio_url:$link.attr('audio_url') .emmit('stop-shuffle')
}); .openDocument({
nid:$link.attr('nid'),
audio_url:$link.attr('audio_url')
});
return false; return false;
} }
@@ -506,7 +511,9 @@
}) })
.on('corpus-cliked-on-node', function(e) { .on('corpus-cliked-on-node', function(e) {
console.log('theme : corpus-cliked-on-node', e); console.log('theme : corpus-cliked-on-node', e);
_audio_player.openDocument(e.target_node); _audio_player
.emmit('stop-shuffle')
.openDocument(e.target_node);
}); });
_randomPlayer = new RandomPlayer(e.playlist); _randomPlayer = new RandomPlayer(e.playlist);
@@ -539,7 +546,8 @@
// attach an event on AudioPlayer // attach an event on AudioPlayer
_audio_player _audio_player
.on('audio-ended', this.onAudioPlayerEnded.bind(this)) .on('audio-ended', this.onAudioPlayerEnded.bind(this))
.on('audio-play-next', this.onAudioPlayNext.bind(this)); .on('audio-play-next', this.onAudioPlayNext.bind(this))
.on('stop-shuffle', this.stop.bind(this));
}, },
shuffle(){ shuffle(){
var tempPLaylist = []; var tempPLaylist = [];
@@ -555,20 +563,20 @@
}, },
toggleActive(e){ toggleActive(e){
if (this.active) { if (this.active) {
this.$btn.removeClass('is-active');
this.stop(); this.stop();
}else{ }else{
this.$btn.addClass('is-active');
this.shuffle();
this.start(); this.start();
} }
}, },
start(){ start(){
this.active = _audio_player.shuffle_is_active = true; this.active = _audio_player.shuffle_is_active = true;
this.$btn.addClass('is-active');
this.shuffle();
this.next(); this.next();
}, },
stop(){ stop(){
this.active = _audio_player.shuffle_is_active = false; this.active = _audio_player.shuffle_is_active = false;
this.$btn.removeClass('is-active');
// stop audio player // stop audio player
_audio_player.stop(); _audio_player.stop();
}, },