bachir/edlp_d8
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactored edlp_history redirection system, incorporated audio links in it

Browse Source
This commit is contained in:
bachir
2018-04-15 12:54:27 +02:00
parent 95cd2c15cf
commit efca592b17
15 changed files with 7034 additions and 172 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/themes/custom/edlptheme/assets/dist/scripts/history.min.js
Vendored
+20 -1
View File
@@ -1,2 +1,21 @@
console.log('EDLP THEME HISTORY.js');
// var edlp is provided by edlp_ajax.module file
if(edlp.redirect){
console.log('history redirect', edlp);
console.log('window.location', window.location);
// window.localStorage.setItem('edlp_origin_path', edlp.sys_path.replace(/^\//, ''));
edlp.sys_path = edlp.sys_path.replace(/^\//, '');
void 0;if(edlp.redirect){void 0;void 0;window.localStorage.setItem('edlp_origin_path',edlp.sys_path.replace(/^\//,''));window.localStorage.setItem('edlp_origin_url',window.location.pathname);window.localStorage.setItem('edlp_origin_hash',window.location.hash);window.location.replace(window.location.origin+'/'+edlp.lang_code);}else{void 0;}
// window.localStorage.setItem('edlp_origin_url', window.location.pathname);
edlp.url = window.location.pathname;
// window.localStorage.setItem('edlp_origin_hash', window.location.hash);
edlp.hash = window.location.hash;
window.localStorage.setItem('edlp_origin', JSON.stringify(edlp));
// redirect to home
// debugger;
window.location.replace(window.location.origin+'/'+edlp.lang_code);
}else{
console.log('history do not redirect');
}
sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js
Vendored
+1325 -44
View File
File diff suppressed because it is too large Load Diff
sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css
Vendored
+2798 -1
View File
File diff suppressed because one or more lines are too long
sites/all/themes/custom/edlptheme/assets/scripts/history.js
+11 -3
View File
@@ -3,10 +3,18 @@ console.log('EDLP THEME HISTORY.js');
if(edlp.redirect){
console.log('history redirect', edlp);
console.log('window.location', window.location);
window.localStorage.setItem('edlp_origin_path', edlp.sys_path.replace(/^\//, ''));
window.localStorage.setItem('edlp_origin_url', window.location.pathname);
window.localStorage.setItem('edlp_origin_hash', window.location.hash);
// window.localStorage.setItem('edlp_origin_path', edlp.sys_path.replace(/^\//, ''));
edlp.sys_path = edlp.sys_path.replace(/^\//, '');
// window.localStorage.setItem('edlp_origin_url', window.location.pathname);
edlp.url = window.location.pathname;
// window.localStorage.setItem('edlp_origin_hash', window.location.hash);
edlp.hash = window.location.hash;
window.localStorage.setItem('edlp_origin', JSON.stringify(edlp));
// redirect to home
// debugger;
window.location.replace(window.location.origin+'/'+edlp.lang_code);
}else{
console.log('history do not redirect');
sites/all/themes/custom/edlptheme/assets/scripts/main.js
+80 -29
View File
@@ -3,7 +3,7 @@
EdlpTheme = function(){
var _ajax_settings = drupalSettings.edlp_ajax;
var _$body = $('body');
var _is_front = _$body.is('.path-frontpage');
// var _is_front = drupalSettings.path.isFront;
var _corpus_ready = false;
var _$corpus_canvas;
var _$row = $('main[role="main"]>.layout-content>.row');
@@ -19,6 +19,9 @@
function init(){
console.log("EdlpTheme init()");
_audioPlayer = new AudioPlayer();
_compoPlayer = new CompoPlayer();
initAjaxLinks();
initHistory();
@@ -28,9 +31,6 @@
initEvents();
_audioPlayer = new AudioPlayer();
_compoPlayer = new CompoPlayer();
};
// ___ _
@@ -118,6 +118,8 @@
var term_match = state.ajax_path.match(/^\/?(taxonomy\/term\/(\d+))$/i);
console.log('term_match', term_match);
if(node_match){
// TODO: detect audio links which will open audioplayer and wont load any ajax content unless view_mode "article" or "transcript"
state.ajax_path = _ajax_settings.entityjson_path+'/'+node_match[1];
state.node_nid = node_match[2];
// check for viewmode attribute
@@ -340,6 +342,7 @@
$(block.id).replaceWith(block.rendered);
}
};
// _ _ _ _
// | || (_)__| |_ ___ _ _ _ _
// | __ | (_-< _/ _ \ '_| || |
@@ -352,18 +355,22 @@
function initFirstLoad(){
console.log('theme : initFirstLoad()');
var origin_sys_path = window.localStorage.getItem('edlp_origin_path');
if(origin_sys_path){
var origin_url = window.localStorage.getItem('edlp_origin_url');
// var origin_sys_path = window.localStorage.getItem('edlp_origin_path');
var edlp_origin = JSON.parse(window.localStorage.getItem('edlp_origin'));
if(edlp_origin.sys_path){
// var origin_url = window.localStorage.getItem('edlp_origin_url');
// origin_hash is used as viewmode for taxonomy term entrees load (index or notice)
var origin_hash = window.localStorage.getItem('edlp_origin_hash');
var view_mode = origin_hash.replace('#', '');
// var origin_hash = window.localStorage.getItem('edlp_origin_hash');
var view_mode = edlp_origin.hash.replace('#', '');
// // TODO: refactorize with new infos from edlp_origin
if(view_mode){
// TODO first load with index or notice do not activate the right link (activate all)
var $link = $('[href="'+origin_url+'"][viewmode="'+view_mode+'"]');
var $link = $('[href="'+edlp_origin.url+'"][viewmode="'+view_mode+'"]');
var selector = $link.attr('selector') || null;
if(selector){
// in case of entree link (actualy, selector is used only for entries links)
// TODO: use a promise
if(_corpus_ready){
_$corpus_canvas.trigger({
type:'open-entree',
@@ -372,33 +379,49 @@
}else{
// else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
// .is-active class is added by onAjaxLoaded() (when content is loaded)
// but what if corpus ready before onAjaxLoaded
// but what if corpus ready before onAjaxLoaded >> use a promise !!
$('li.entree[tid="'+$link.attr('tid')+'"] a.term-link').addClass('is-active');
}
}
}
// create history state
var state = getSysPathState(origin_sys_path, view_mode);
var state = getSysPathState(edlp_origin.sys_path, view_mode);
// check if audio link
if(edlp_origin.audio_url){
var node = {
nid:edlp_origin.entity_id,
audio_url:edlp_origin.audio_url
};
_audioPlayer.openDocument(node, 'history_first_load');
if(view_mode == ""){
// if audio only record in state
state.audio = true;
state.node = node;
}else{
// ajax load content for audio only if article or transcript
ajaxLoadContent(state);
}
}
// only if not entree path
if(state.ajax_path){
// only if not audio (without article or transcript) path
else if(state.ajax_path){
// load content through ajax
// ajaxLoadContent(null, state.sys_path, state.ajax_path, selector);
ajaxLoadContent(state);
}
// TODO what about entree alone (without notice or index)
if(state.entree_tid){
openEntree(state.entree_tid);
}
// record history state
history.replaceState(state, null, origin_url+origin_hash);
history.replaceState(state, null, edlp_origin.url+edlp_origin.hash);
// reset the storage
window.localStorage.removeItem("edlp_origin_path");
window.localStorage.removeItem("edlp_origin_url");
window.localStorage.removeItem("edlp_origin");
// window.localStorage.removeItem("edlp_origin_url");
}else{
history.replaceState({home:true}, null, window.location.pathname);
@@ -409,7 +432,11 @@
console.log('onPopState',e.state);
if(e.state.home){
backToFrontPage(true);
}else{
}
else if (e.state.audio) {
_audioPlayer.openDocument(e.state.node, 'popstate', e.state.historic_index);
}
else{
if(e.state.entree_tid){
openEntree(e.state.entree_tid);
}
@@ -631,7 +658,7 @@
this.$playpause.on('click', this.togglePlayPause.bind(this));
this.$next.on('click', this.playNext.bind(this));
},
openDocument(node, caller){
openDocument(node, caller, historic_index){
// console.log('AudioPlayer openDocument', node);
if(typeof node == 'undefined'
|| typeof node.nid == 'undefined'
@@ -639,11 +666,27 @@
console.warn('AudioPlayer openDocument() node is malformed', node);
return false;
}
this.historic.push(node);
this.currentHistoricIndex = this.historic.length-1;
// this.shuffle_mode = shuffle_mode || false;
// TODO: add an hash tag to be able to share and play audio from any where
// if we don't come from history popstate
if(typeof caller == 'undefined' || caller != 'popstate'){
this.historic.push(node);
this.currentHistoricIndex = this.historic.length-1;
// this.shuffle_mode = shuffle_mode || false;
// add the document opening to history to be able to share and play audio from any where
if(caller != "history_first_load"){
state = {
audio:true,
node:node,
historic_index : this.currentHistoricIndex,
};
history.pushState(state, null, node.document_url);
}
}else{
// if the call commes from popstate, we update the current position of index
this.currentHistoricIndex = historic_index;
}
this.emmit('audio-open-document', {caller:caller});
@@ -721,9 +764,12 @@
},
stop(){
// console.log('AudioPlayer stop()');
// debugger;
this.audio.pause();
// TODO: don't close player if article or transcript is open
this.timeOutToHide();
// don't close player if article or transcript is open
if(!_$body.is('.path-node-'+this.historic[this.currentHistoricIndex].nid)){
this.timeOutToHide();
}
},
// audio events
onPlaying(){
@@ -746,6 +792,7 @@
this.$currentTime.html('<span>'+(mins<10 ? '0':'')+mins+':'+(secs<10 ? '0':'')+secs+'</span>');
},
onEnded(){
console.log('AudioPlayer onEnded()');
this.emmit('audio-ended');
this.stop();
},
@@ -1040,7 +1087,9 @@
}
},
stop(){
_audioPlayer.stop();
if(this.playing){
_audioPlayer.stop();
}
this.reset();
},
reset(){
@@ -1151,7 +1200,7 @@
// close entrees
_$corpus_canvas.trigger({'type':'close-all-entree'});
if(!pop_state){
history.pushState({home:true}, null, window.location.origin);
history.pushState({home:true}, null, drupalSettings.path.baseUrl+drupalSettings.path.currentLanguage);
}
}
@@ -1269,7 +1318,9 @@
} // end EdlpTheme()
$(document).ready(function($) {
var edlptheme = new EdlpTheme();
if(drupalSettings.path.isFront){
var edlptheme = new EdlpTheme();
}
});
})(jQuery, Drupal, drupalSettings);
sites/all/themes/custom/edlptheme/assets/styles/app.scss
+4
View File
@@ -273,6 +273,8 @@ main[role="main"]{
@include content_subtitles;
margin:0.9em 0 0 0;
}
}
article.node.node--type-enregistrement.node--view-mode-transcript{
html.js &{
h3.sur-title{display:none;}
}
@@ -393,6 +395,7 @@ main[role="main"]{
opacity: 1;
pointer-events:all;
}
white-space: nowrap;
&>*{
display: inline-block;
vertical-align: middle;
@@ -400,6 +403,7 @@ main[role="main"]{
padding:0;
max-height: 100%;
// outline: 1px solid green;
white-space: normal;
}
.btns{
@include audio_controls;