main.js 47 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403
  1. (function($, Drupal, drupalSettings) {
  2. EdlpTheme = function(){
  3. var _ajax_settings = drupalSettings.edlp_ajax;
  4. var _$body = $('body');
  5. // var _is_front = drupalSettings.path.isFront;
  6. var _corpus_ready = false;
  7. var _$corpus_canvas;
  8. var _$row = $('main[role="main"]>.layout-content>.row');
  9. var _$ajaxLinks;
  10. var _audioPlayer;
  11. var _randomPlayer;
  12. var _compoPlayer;
  13. // ___ _ _
  14. // |_ _|_ _ (_) |_
  15. // | || ' \| | _|
  16. // |___|_||_|_|\__|
  17. function init(){
  18. console.log("EdlpTheme init()");
  19. _audioPlayer = new AudioPlayer();
  20. _compoPlayer = new CompoPlayer();
  21. initAjaxLinks();
  22. initHistory();
  23. if(!drupalSettings.path.isFront)
  24. return;
  25. initEvents();
  26. };
  27. // ___ _
  28. // | __|_ _____ _ _| |_ ___
  29. // | _|\ V / -_) ' \ _(_-<
  30. // |___|\_/\___|_||_\__/__/
  31. function initEvents(){
  32. _$body
  33. .on('corpus-map-ready', onCorpusMapReady)
  34. .on('on-studio-chutier-updated', initAjaxLinks)
  35. .on('studio-initialized', function(e){
  36. _compoPlayer.newCompo();
  37. })
  38. .on('studio-not-active', function(e){
  39. _compoPlayer.deactivate();
  40. })
  41. .on('on-studio-compo-updated', function(e){
  42. initAjaxLinks();
  43. _compoPlayer.refresh();
  44. })
  45. .on('on-studio-compo-opened', function(e){
  46. initAjaxLinks();
  47. _compoPlayer.newCompo();
  48. })
  49. .on('search-results-loaded', initAjaxLinks)
  50. // do not close index or notice modale on entree click
  51. .on('open_entree', function(e){
  52. console.log('on_open_entree : e', e);
  53. closeAllModals();
  54. // add body class for currently loaded content
  55. // var body_classes = [
  56. // 'path-'+sys_path.replace(/\//g, '-'),
  57. // 'entity-type-'+data.entity_type,
  58. // 'bundle-'+data.bundle,
  59. // 'view-mode-'+data.view_mode
  60. // ];
  61. _$body.removeClass();//.addClass(body_classes.join(' '));
  62. // record new history state
  63. if(typeof e.url != 'undefined'){
  64. // var state = {
  65. // ajax_path:null,
  66. // sys_path:null,
  67. // entree_tid:e.tid
  68. // };
  69. var state = getSysPathState(e.sys_path);
  70. history.pushState(state, null, e.url);
  71. }
  72. })
  73. .on('close_entree', function(e){
  74. backToFrontPage();
  75. });
  76. }
  77. // ___ _ _ ___
  78. // / __| __ _ _ ___| | | _ ) __ _ _ _ ___
  79. // \__ \/ _| '_/ _ \ | | _ \/ _` | '_(_-<
  80. // |___/\__|_| \___/_|_|___/\__,_|_| /__/
  81. function initScrollbars(){
  82. // console.log("initScrollbars");
  83. // TODO: find a better js scroll than overlayScrollbars which does not handle well max-height + overflow-y:auto;
  84. // $('.os-scroll').overlayScrollbars({
  85. // overflowBehavior:{
  86. // x:'h',
  87. // y:'scroll',
  88. // clipAlways:false
  89. // }
  90. // });
  91. };
  92. // _ _
  93. // /_\ (_)__ ___ __
  94. // / _ \ | / _` \ \ /
  95. // /_/ \_\/ \__,_/_\_\
  96. // |__/
  97. function getSysPathState(sys_path, view_mode){
  98. // console.log('Theme : getSysPathState', sys_path);
  99. var state = {
  100. 'sys_path':sys_path,
  101. 'ajax_path': sys_path
  102. };
  103. // convert node link to edlp_ajax_node module links
  104. var node_match = state.ajax_path.match(/^\/?(node\/(\d+))$/i);
  105. console.log('node_match', node_match);
  106. var term_match = state.ajax_path.match(/^\/?(taxonomy\/term\/(\d+))$/i);
  107. console.log('term_match', term_match);
  108. if(node_match){
  109. // TODO: detect audio links which will open audioplayer and wont load any ajax content unless view_mode "article" or "transcript"
  110. state.ajax_path = _ajax_settings.entityjson_path+'/'+node_match[1];
  111. state.node_nid = node_match[2];
  112. // check for viewmode attribute
  113. if(view_mode){
  114. state.ajax_path += '/'+view_mode;
  115. state.view_mode = view_mode;
  116. }
  117. }else if(term_match){
  118. // terms are always entrees, there's no other vocabulary links in front
  119. state.ajax_path = _ajax_settings.entityjson_path+'/'+term_match[1];
  120. state.ajax_path = state.ajax_path.replace(/taxonomy\/term/, 'taxonomy_term');
  121. state.entree_tid = term_match[2];
  122. // check for viewmode attribute
  123. if(view_mode){
  124. state.ajax_path += '/'+view_mode;
  125. state.view_mode = view_mode;
  126. }else{
  127. state.ajax_path = null;
  128. }
  129. }else{
  130. // convert other link to ajax
  131. // TODO: we assume that other links (no node, no term) are all from own modules (e.g. productions) !! may not be true !!
  132. state.ajax_path += '/ajax'
  133. }
  134. return state;
  135. };
  136. function ajaxLoadContent(state){
  137. console.log('ajaxLoadContent : state', state);
  138. _$body.addClass('ajax-loading');
  139. var path = window.location.origin + Drupal.url(state.ajax_path);
  140. $.getJSON(path, {})
  141. .done(function(data){
  142. onAjaxLoaded(data, state);
  143. })
  144. .fail(function(jqxhr, textStatus, error){
  145. onAjaxLoadError(jqxhr, textStatus, error, state.sys_path);
  146. });
  147. };
  148. function onAjaxLoadError(jqxhr, textStatus, error, sys_path){
  149. console.warn('ajaxlink load failed for '+sys_path+' : '+error, jqxhr.responseText);
  150. $('.ajax-loading').removeClass('ajax-loading');
  151. _$body.removeClass('ajax-loading');
  152. };
  153. function onAjaxLoaded(data, state){
  154. console.log('ajax loaded : state', state);
  155. // console.log(data);
  156. // reset all style may been added by other pages (like masonry for productions)
  157. // and replace all content with newly loaded
  158. // TODO: build a system to replace or append contents (like studio + search)
  159. if(data.entity_type == "node" && data.bundle == "evenement"){
  160. if(_$row.find('.col.event').length){
  161. _$row.find('.col.event').replaceWith(data.rendered);
  162. }else if(_$row.find('.col.aside').length){
  163. _$row.find('.col.aside').replaceWith(data.rendered);
  164. }else{
  165. _$row.append(data.rendered);
  166. }
  167. }else{
  168. _$row.removeAttr('style').html(data.rendered);
  169. }
  170. // add body class for currently loaded content
  171. var body_classes = [
  172. 'path-'+state.sys_path.replace(/\//g, '-'),
  173. 'entity-type-'+data.entity_type,
  174. 'bundle-'+data.bundle,
  175. 'view-mode-'+data.view_mode
  176. ];
  177. _$body.removeClass().addClass(body_classes.join(' '));
  178. // id node add a generic path-node class to body
  179. // m = state.sys_path.match(/^\/?(node\/\d+)$/g);
  180. // if(m)
  181. if(state.node_nid)
  182. _$body.addClass('path-edlp-node');
  183. // handle clicked link classes
  184. $('.ajax-loading').removeClass('ajax-loading');
  185. $('.ajax-link.is-active').removeClass('is-active');
  186. $('.is-active-trail').removeClass('is-active-trail');
  187. if(typeof state.selector != 'undefined'){
  188. // in case of entree link (actualy, selector is used only for entries links)
  189. // TODO: unfortunatly on initFirstLoad there is no selector property
  190. console.log('selector', state.selector);
  191. $('a[selector="'+state.selector+'"]').addClass('is-active');
  192. initAudioLinksInContent();
  193. }else{
  194. if(typeof state.view_mode != 'undefined'){
  195. $('a[viewmode="'+state.view_mode+'"][data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
  196. }else{
  197. $('a[data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
  198. }
  199. // as new content is not related to entree, we trigger close entree
  200. _$body.trigger({'type':'new-content-not-entree-ajax-loaded'});
  201. }
  202. // if bundle page (productions) activate production links
  203. if (typeof data.bundle != 'undefined' && data.bundle == "page") {
  204. $('a[data-drupal-link-system-path="productions"]').addClass('is-active-trail');
  205. }
  206. // if node is in production menu tree, set first level of tree active, e.g. pieces sonores
  207. if (typeof data.menu_parents != 'undefined') {
  208. for (var i = 0; i < data.menu_parents.length; i++) {
  209. var menu_sys_path = data.menu_parents[i];
  210. $('a[data-drupal-link-system-path="'+menu_sys_path+'"]').addClass('is-active-trail');
  211. }
  212. }
  213. // if block attached (eg : from edlp_productions module)
  214. // not used anymore as production block is always present (but not visible)
  215. if(typeof data.block != 'undefined'){
  216. // if block not already added
  217. if(!$('#'+data.block.id, '.region-'+data.block.region).length){
  218. $('.region-'+data.block.region).append(data.block.rendered);
  219. }
  220. }
  221. // initScrollbars();
  222. if(state.sys_path == "productions"){
  223. initProductions();
  224. }else{
  225. addCloseModalBtnToCols();
  226. }
  227. // enregistrement transcription
  228. if(data.entity_type == "node" && data.bundle == "enregistrement" && data.view_mode == "transcript"){
  229. // window.requestAnimationFrame(initEnregistrementTranscript);
  230. initEnregistrementTranscript();
  231. }
  232. // update the language switcher block if it comes in the response
  233. if(typeof data.translations_links != 'undefined'){
  234. console.log('state',state);
  235. var lang_code = drupalSettings.path.currentLanguage;
  236. var $links = $(data.translations_links);
  237. // set active link
  238. $links.find('li[hreflang="'+lang_code+'"]').addClass('is-active').find('a').addClass('is-active');
  239. if(state.view_mode){
  240. $links.find('a').each(function(i,e){
  241. var $a = $(this);
  242. $a.attr('href', $a.attr('href')+'#'+state.view_mode);
  243. });
  244. }
  245. // if(state.selector){
  246. // $links.find('a').attr('selector', state.selector);
  247. // }
  248. $('ul','.block.language-switcher-language-url').replaceWith($links);
  249. }
  250. initAjaxLinks();
  251. // trigger other modules behaviours
  252. _$body.trigger({'type':'new-content-ajax-loaded'});
  253. // and call druapl behaviours
  254. Drupal.attachBehaviors(_$row[0]);
  255. _$body.attr('booted', 'booted');
  256. _$body.removeClass('ajax-loading');
  257. // url is null means that we are loading content on popState event
  258. // so we don't record the state again
  259. if(state.url){
  260. // var state = {
  261. // ajax_path:ajax_path,
  262. // sys_path:sys_path,
  263. // };
  264. // console.log('url:'+url+' ; state',state);
  265. // console.log(window.location);
  266. // /!\ we can not pushestate with absolute url /!\
  267. history.pushState(state, null, state.url);
  268. }
  269. };
  270. function initAudioLinksInContent(){
  271. _$row.find('a.audio-link')
  272. .on('mouseover', function(event) {
  273. event.preventDefault();
  274. if(_corpus_ready){
  275. _$corpus_canvas.trigger({
  276. type:'mouseover-audio-link',
  277. nid:$(this).attr('nid')
  278. });
  279. }
  280. })
  281. .on('mouseout', function(event) {
  282. event.preventDefault();
  283. if(_corpus_ready){
  284. _$corpus_canvas.trigger({
  285. type:'mouseout-audio-link',
  286. nid:$(this).attr('nid')
  287. });
  288. }
  289. });
  290. };
  291. function addCloseModalBtnToCols(){
  292. $('.col', _$row).each(function(index, el) {
  293. if($('span.close-col-btn', this).length)
  294. return true;
  295. $(this).children('.wrapper').prepend($('<span>')
  296. .addClass('close-col-btn')
  297. .on('click', onCloseModal)
  298. );
  299. });
  300. };
  301. function onCloseModal(e){
  302. // check for theme attribute and emmit event
  303. var $col = $(this).parents('.col');
  304. var theme = $col.attr('theme');
  305. if(theme != ''){
  306. _$body.trigger({'type':theme+'-col-closed'});
  307. }
  308. // remove the col
  309. $col.remove();
  310. // if row is empty and we are not in productions or entree notice|index call closeAllModals()
  311. if(!$('.col', _$row).length
  312. && !_$body.is('.entity-type-node.bundle-page')
  313. && !_$body.is('.entity-type-taxonomy_term.bundle-entrees')){
  314. backToFrontPage();
  315. }
  316. };
  317. // _ _ ___ _ _
  318. // /_\ (_)__ ___ __ | _ ) |___ __| |__ ___
  319. // / _ \ | / _` \ \ / | _ \ / _ \/ _| / /(_-<
  320. // /_/ \_\/ \__,_/_\_\ |___/_\___/\__|_\_\/__/
  321. // |__/
  322. // NOT USED (YET)
  323. function refreshAllBlocks(){
  324. var path = window.location.origin + Drupal.url(_ajax_settings.blocksjson_path);
  325. $.getJSON(path, {})
  326. .done(function(data){
  327. onAjaxBlockLoaded(data);
  328. })
  329. .fail(function(jqxhr, textStatus, error){
  330. onAjaxBlockLoadError(jqxhr, textStatus, error);
  331. });
  332. };
  333. function onAjaxBlockLoadError(jqxhr, textStatus, error){
  334. console.warn('ajax block load failed: '+error, jqxhr.responseText);
  335. };
  336. function onAjaxBlockLoaded(data){
  337. console.log('onAjaxBlockLoaded', data);
  338. // TODO: update each blocks (exepted language switcher)
  339. for (var blockname in data.blocks) {
  340. var block = data.blocks[blockname];
  341. console.log(blockname, block);
  342. $(block.id).replaceWith(block.rendered);
  343. }
  344. };
  345. // _ _ _ _
  346. // | || (_)__| |_ ___ _ _ _ _
  347. // | __ | (_-< _/ _ \ '_| || |
  348. // |_||_|_/__/\__\___/_| \_, |
  349. // |__/
  350. function initHistory(){
  351. initFirstLoad();
  352. window.addEventListener('popstate', onHistoryPopState);
  353. };
  354. function initFirstLoad(){
  355. console.log('theme : initFirstLoad()');
  356. // var origin_sys_path = window.localStorage.getItem('edlp_origin_path');
  357. var edlp_origin = JSON.parse(window.localStorage.getItem('edlp_origin'));
  358. console.log('edlp_origin', edlp_origin);
  359. if(edlp_origin != null && edlp_origin.sys_path){
  360. // hash is used as viewmode for taxonomy term entrees load (index or notice)
  361. // and for audio contents (article|transcript)
  362. var view_mode = edlp_origin.hash.replace('#', '');
  363. // create history state
  364. var state = getSysPathState(edlp_origin.sys_path, view_mode);
  365. // open entree tray in case of entree index|notice
  366. // (index or notice will be opened with ajaxLoadContent)
  367. // refactorized with new infos from edlp_origin
  368. // if(view_mode){
  369. if(edlp_origin.entity_type == "taxonomy_term"
  370. && edlp_origin.entity_bundle == "entrees"
  371. && view_mode){
  372. // var $link = $('[href="'+edlp_origin.url+'"][viewmode="'+view_mode+'"]');
  373. // var selector = $link.attr('selector') || null;
  374. // record the selector in the state for actions after ajaxContentLoaded
  375. state.selector = 'entree-'+view_mode+'-link-'+edlp_origin.entity_id; // entree-index-link-125
  376. // if(selector){
  377. // in case of entree link (actualy, selector is used only for entries links)
  378. // TODO: use a promise
  379. // TODO: but what if corpus ready before onAjaxLoaded >> use a promise !!
  380. if(_corpus_ready){
  381. _$corpus_canvas.trigger({
  382. type:'open-entree',
  383. // tid:$link.attr('tid')
  384. tid:edlp_origin.entity_id
  385. });
  386. }else{
  387. // else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
  388. // .is-active class is added by onAjaxLoaded() (when content is loaded)
  389. // $('li.entree[tid="'+$link.attr('tid')+'"] a.term-link').addClass('is-active');
  390. $('li.entree[tid="'+edlp_origin.entity_id+'"] a.term-link').addClass('is-active');
  391. }
  392. // }
  393. }
  394. // check if audio link
  395. if(edlp_origin.audio_url){
  396. var node = {
  397. nid:edlp_origin.entity_id,
  398. audio_url:edlp_origin.audio_url
  399. };
  400. _audioPlayer.openDocument(node, 'history_first_load');
  401. if(view_mode == ""){
  402. // if audio only record in state
  403. state.audio = true;
  404. state.node = node;
  405. // we don't laod ajax content so we boot the home
  406. _$body.attr('booted', 'booted');
  407. }else{
  408. // ajax load content for audio only if article or transcript
  409. ajaxLoadContent(state);
  410. }
  411. }
  412. // only if not entree path
  413. // only if not audio (without article or transcript) path
  414. else if(state.ajax_path){
  415. // load content through ajax
  416. // ajaxLoadContent(null, state.sys_path, state.ajax_path, selector);
  417. ajaxLoadContent(state);
  418. }
  419. if(state.entree_tid){
  420. openEntree(state.entree_tid);
  421. }
  422. // record history state
  423. history.replaceState(state, null, edlp_origin.url+edlp_origin.hash);
  424. // reset the storage
  425. window.localStorage.removeItem("edlp_origin");
  426. // window.localStorage.removeItem("edlp_origin_url");
  427. }else{
  428. history.replaceState({home:true}, null, window.location.pathname);
  429. _$body.attr('booted', 'booted');
  430. }
  431. };
  432. function onHistoryPopState(e){
  433. console.log('onPopState',e.state);
  434. if(e.state.home){
  435. backToFrontPage(true);
  436. }
  437. else if (e.state.audio) {
  438. _audioPlayer.openDocument(e.state.node, 'popstate', e.state.historic_index);
  439. }
  440. else{
  441. if(e.state.entree_tid){
  442. openEntree(e.state.entree_tid);
  443. }
  444. if(e.state.ajax_path){
  445. e.state.url = null;
  446. // ajaxLoadContent(null, e.state.sys_path, e.state.ajax_path)
  447. ajaxLoadContent(e.state);
  448. }
  449. }
  450. };
  451. // _ _ _ _ _
  452. // /_\ (_)__ ___ _| | (_)_ _ | |__ ___
  453. // / _ \ | / _` \ \ / |__| | ' \| / /(_-<
  454. // /_/ \_\/ \__,_/_\_\____|_|_||_|_\_\/__/
  455. // |__/
  456. function initAjaxLinks(){
  457. // console.log('initAjaxLinks');
  458. $('a.site-name', '#block-edlptheme-branding')
  459. .add('a', '#block-mainnavigation')
  460. // .add('a', '.block.language-switcher-language-url')
  461. .add('a', '#block-footer.menu--footer')
  462. .add('a', '#block-productions')
  463. .add('a', 'article.node:not(.node--type-enregistrement) h2.node-title')
  464. .add('a', '.productions-subtree')
  465. .add('a', '.productions-parent')
  466. // .add('a.index-link, a.notice-link', '#block-edlpentreesblock')
  467. .addClass('ajax-link');
  468. _$ajaxLinks = $('.ajax-link:not(.ajax-enabled)')
  469. .each(function(i,e){
  470. var $this = $(this);
  471. // avoid already ajaxified links
  472. if($this.is('.ajax-enable')) return;
  473. if($this.attr('data-drupal-link-system-path')){
  474. $this.on('click', onClickAjaxLink).addClass('ajax-enable');
  475. }
  476. });
  477. };
  478. function onClickAjaxLink(e){
  479. e.preventDefault();
  480. var $link = $(this);
  481. if($link.is('.is-active'))
  482. return false;
  483. // Audio links
  484. // launch audio player and stop here
  485. if($link.is('.audio-link')){
  486. _audioPlayer
  487. .emmit('stop-shuffle')
  488. .openDocument({
  489. nid:$link.attr('nid'),
  490. audio_url:$link.attr('audio_url')
  491. });
  492. return false;
  493. }
  494. // NOT USED (YET)
  495. // if($link.is('.language-link')){
  496. // TODO: change global site current language
  497. // load all blocks translated (exepted language switcher) ... :/
  498. // refreshAllBlocks();
  499. // TODO: use a promise to initAjaxLinks again after blocks updated
  500. // then let load the content
  501. // }
  502. // other links
  503. var sys_path = $(this).attr('data-drupal-link-system-path');
  504. // front page
  505. // just remove contents and stop here
  506. if(sys_path == '<front>'){
  507. backToFrontPage();
  508. return false;
  509. }
  510. var view_mode = $link.attr('viewmode');
  511. var state = getSysPathState(sys_path, view_mode);
  512. state.url = $(this).attr('href');
  513. if(view_mode){
  514. state.url += "#"+view_mode;
  515. }
  516. if($link.is('[selector]')){
  517. state.selector = $link.attr('selector');
  518. }
  519. $link.addClass('ajax-loading');
  520. // ajaxLoadContent(url, sys_path, state.ajax_path, selector);
  521. ajaxLoadContent(state);
  522. return false;
  523. };
  524. // ___
  525. // / __|___ _ _ _ __ _ _ ___
  526. // | (__/ _ \ '_| '_ \ || (_-<
  527. // \___\___/_| | .__/\_,_/__/
  528. // |_|
  529. function onCorpusMapReady(e){
  530. //console.log('theme : onCorpusReady', e);
  531. _corpus_ready = true;
  532. _$corpus_canvas = $('canvas#corpus-map');
  533. _$corpus_canvas
  534. .on('corpus-cliked-on-map', function(e) {
  535. //console.log('theme : corpus-cliked-on-map');
  536. backToFrontPage();
  537. })
  538. .on('corpus-cliked-on-node', function(e) {
  539. //console.log('theme : corpus-cliked-on-node', e);
  540. _audioPlayer
  541. .emmit('stop-shuffle')
  542. .setAutoOpenArticle(e.article)
  543. .openDocument(e.target_node);
  544. });
  545. _randomPlayer = new RandomPlayer(e.playlist);
  546. _$body.attr('corpus-map', 'ready');
  547. }
  548. function openEntree(tid){
  549. if(tid){
  550. closeAllModals();
  551. _$body.removeClass();//.addClass(body_classes.join(' '));
  552. // open entree
  553. if(_corpus_ready){
  554. _$corpus_canvas.trigger({
  555. type:'open-entree',
  556. tid:tid
  557. });
  558. }else{
  559. // else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
  560. $('li.entree[tid="'+tid+'"] a.term-link').addClass('is-active');
  561. }
  562. }
  563. };
  564. // _ _ _
  565. // /_\ _ _ __| (_)___
  566. // / _ \ || / _` | / _ \
  567. // /_/ \_\_,_\__,_|_\___/
  568. //
  569. // https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement
  570. // https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/samples/gg589528%28v%3dvs.85%29
  571. // https://www.binarytides.com/using-html5-audio-element-javascript/
  572. function AudioPlayer(){
  573. var that = this;
  574. this.fid;
  575. this.audio = new Audio();
  576. // audio events
  577. this.audio_events = ["loadedmetadata","canplay","playing","pause","timeupdate","ended"];
  578. // UI dom objects
  579. this.$container = $('<div id="audio-player">');
  580. // btns
  581. this.$btns = $('<div>').addClass('btns').appendTo(this.$container);
  582. this.$previous = $('<div>').addClass('previous').appendTo(this.$btns);
  583. this.$playpause = $('<div>').addClass('play-pause').appendTo(this.$btns);
  584. this.$next = $('<div>').addClass('next').appendTo(this.$btns);
  585. // timeline
  586. this.$timelinecont= $('<div>').addClass('time-line-container').appendTo(this.$container);
  587. this.$timeline = $('<div>').addClass('time-line').appendTo(this.$timelinecont);
  588. this.$loader = $('<div>').addClass('loader').appendTo(this.$timeline);
  589. this.$cursor = $('<div>').addClass('cursor').appendTo(this.$timeline);
  590. // time
  591. this.$time = $('<div>').addClass('time').appendTo(this.$container);
  592. this.$currentTime = $('<div>').addClass('current-time').html('00:00').appendTo(this.$time);
  593. this.$duration = $('<div>').addClass('duration').html('00:00').appendTo(this.$time);
  594. // favoris
  595. this.$fav = $('<div>').addClass('favoris').appendTo(this.$container);
  596. // cartel
  597. this.$cartel = $('<div>').addClass('cartel').appendTo(this.$container);
  598. // hiding
  599. this.hideTimer = false;
  600. this.hideTimeMS = 10000;
  601. // history
  602. this.currentHistoricIndex = null;
  603. this.historic = [];
  604. this.shuffle_is_active = false;
  605. // artciles
  606. this.auto_open_article = false;
  607. // object events
  608. this.event_handlers = {
  609. 'audio-open-document':[],
  610. 'audio-play':[],
  611. 'audio-pause':[],
  612. 'audio-play-next':[],
  613. 'audio-ended':[],
  614. 'stop-shuffle':[]
  615. };
  616. this.init();
  617. };
  618. AudioPlayer.prototype = {
  619. init(){
  620. // append ui to document
  621. this.$container.appendTo('header[role="banner"] .region-header');
  622. // record timeline width
  623. this.timeline_w = parseInt(this.$timeline.width());
  624. // init audio events
  625. var fn = '';
  626. for (var i = 0; i < this.audio_events.length; i++) {
  627. fn = this.audio_events[i];
  628. // capitalize first letter of event (only cosmetic :p )
  629. fn = 'on'+fn.charAt(0).toUpperCase()+fn.slice(1);
  630. this.audio.addEventListener(
  631. this.audio_events[i],
  632. this[fn].bind(this),
  633. true);
  634. }
  635. // init btns events
  636. this.$previous.on('click', this.playPrevious.bind(this));
  637. this.$playpause.on('click', this.togglePlayPause.bind(this));
  638. this.$next.on('click', this.playNext.bind(this));
  639. },
  640. openDocument(node, caller, historic_index){
  641. // console.log('AudioPlayer openDocument', node);
  642. if(typeof node == 'undefined'
  643. || typeof node.nid == 'undefined'
  644. || typeof node.audio_url == 'undfined'){
  645. console.warn('AudioPlayer openDocument() node is malformed', node);
  646. return false;
  647. }
  648. // if we don't come from history popstate
  649. if(typeof caller == 'undefined' || caller != 'popstate'){
  650. this.historic.push(node);
  651. this.currentHistoricIndex = this.historic.length-1;
  652. // this.shuffle_mode = shuffle_mode || false;
  653. // add the document opening to history to be able to share and play audio from any where
  654. if(caller != "history_first_load"){
  655. state = {
  656. audio:true,
  657. node:node,
  658. historic_index : this.currentHistoricIndex,
  659. };
  660. history.pushState(state, null, node.document_url);
  661. }
  662. }else{
  663. // if the call commes from popstate, we update the current position of index
  664. this.currentHistoricIndex = historic_index;
  665. }
  666. this.emmit('audio-open-document', {caller:caller});
  667. this.launch();
  668. },
  669. launch(){
  670. this.clearTimeOutToHide();
  671. this.setSRC(this.historic[this.currentHistoricIndex].audio_url);
  672. this.loadNode(this.historic[this.currentHistoricIndex].nid);
  673. // emmit new playing doc (e.g.: corpus map nowing that audio played from RandomPlayer)
  674. try {
  675. _$corpus_canvas.trigger({
  676. 'type':'audio-node-opened',
  677. 'nid':this.historic[this.currentHistoricIndex].nid
  678. });
  679. } catch (e) {
  680. console.info('AudioPlayer : _$corpus_canvas does not exists');
  681. }
  682. this.showHidePreviousBtn();
  683. this.showHideNextBtn();
  684. this.show();
  685. },
  686. // audio functions
  687. setSRC(url){
  688. // console.log('AudioPlayer setSRC : url', url);
  689. this.audio.src = url;
  690. },
  691. onLoadedmetadata(){
  692. var rem = parseInt(this.audio.duration, 10),
  693. mins = Math.floor(rem/60,10),
  694. secs = rem - mins*60;
  695. this.$duration.html('<span>'+(mins<10 ? '0':'')+mins+':'+(secs<10 ? '0':'')+secs+'</span>');
  696. this.updateLoadingBar();
  697. },
  698. updateLoadingBar(){
  699. this.$loader.css({
  700. 'width':parseInt((100 * this.audio.buffered.end(0) / this.audio.duration), 10)+'%'
  701. });
  702. if( this.audio.buffered.end(0) < this.audio.duration ){
  703. // loop through this function until file is fully loaded
  704. var that = this;
  705. window.requestAnimationFrame(that.updateLoadingBar.bind(that));
  706. }else{
  707. //console.log('Audio fully loaded');
  708. }
  709. },
  710. onCanplay(){
  711. this.play();
  712. },
  713. play(){
  714. this.clearTimeOutToHide();
  715. this.audio.play();
  716. },
  717. playPrevious(){
  718. if(this.currentHistoricIndex > 0){
  719. this.currentHistoricIndex -= 1;
  720. this.launch();
  721. }
  722. },
  723. playNext(){
  724. if(this.currentHistoricIndex < this.historic.length-1){
  725. this.currentHistoricIndex += 1;
  726. this.launch();
  727. }else{
  728. this.emmit('audio-play-next');
  729. }
  730. },
  731. togglePlayPause(e){
  732. if(this.audio.paused){
  733. this.audio.play();
  734. }else{
  735. this.audio.pause();
  736. }
  737. },
  738. stop(){
  739. // console.log('AudioPlayer stop()');
  740. // debugger;
  741. this.audio.pause();
  742. // don't close player if article or transcript is open
  743. if(!(_$body.is('.path-node-'+this.historic[this.currentHistoricIndex].nid)
  744. && (_$body.is('.view-mode-article') || _$body.is('.view-mode-transcript')))){
  745. this.timeOutToHide();
  746. }
  747. },
  748. // audio events
  749. onPlaying(){
  750. this.$btns.addClass('is-playing');
  751. this.emmit('audio-play');
  752. },
  753. onPause(){
  754. this.$btns.removeClass('is-playing');
  755. this.emmit('audio-pause');
  756. },
  757. onTimeupdate(){
  758. // move cursor
  759. this.$cursor.css({
  760. 'left':(this.audio.currentTime/this.audio.duration * this.timeline_w)+"px"
  761. });
  762. // update time text display
  763. var rem = parseInt(this.audio.currentTime, 10),
  764. mins = Math.floor(rem/60,10),
  765. secs = rem - mins*60;
  766. this.$currentTime.html('<span>'+(mins<10 ? '0':'')+mins+':'+(secs<10 ? '0':'')+secs+'</span>');
  767. },
  768. onEnded(){
  769. console.log('AudioPlayer onEnded()');
  770. this.emmit('audio-ended');
  771. this.stop();
  772. },
  773. // cartel functions
  774. loadNode(nid){
  775. this.$cartel.addClass('loading');
  776. var vm = 'player_cartel';
  777. var ajax_path = _ajax_settings.entityjson_path+'/node/'+nid+'/'+vm;
  778. var path = window.location.origin + Drupal.url(ajax_path);
  779. $.getJSON(path, {})
  780. .done(this.onNodeLoaded.bind(this))
  781. .fail(this.onNodeLoadFail.bind(this));
  782. },
  783. onNodeLoaded(data){
  784. // console.log('AudioPlayer node loaded');
  785. this.$cartel.html(data.rendered).removeClass('loading');
  786. _$body.trigger({'type':'new-audio-cartel-loaded'});
  787. initAjaxLinks();
  788. if(this.auto_open_article){
  789. this.$cartel.find('a.link-article').trigger('click');
  790. this.auto_open_article = false;
  791. }
  792. },
  793. onNodeLoadFail(jqxhr, textStatus, error){
  794. console.warn('AudioPlayer node load failed', jqxhr.responseText);
  795. this.$cartel.removeClass('loading').html('');
  796. },
  797. setAutoOpenArticle(art){
  798. this.auto_open_article = art;
  799. return this;
  800. },
  801. // global
  802. show(){
  803. this.$container.addClass('visible');
  804. },
  805. showHidePreviousBtn(){
  806. if(this.historic.length > 1 && this.currentHistoricIndex > 0){
  807. this.$previous.addClass('is-active');
  808. }else{
  809. this.$previous.removeClass('is-active');
  810. }
  811. },
  812. showHideNextBtn(){
  813. if(this.currentHistoricIndex < this.historic.length-1 || this.shuffle_is_active){
  814. this.$next.addClass('is-active');
  815. }else{
  816. this.$next.removeClass('is-active');
  817. }
  818. },
  819. timeOutToHide(){
  820. // console.log('AudioPlayer timeOutToHide()');
  821. this.clearTimeOutToHide();
  822. this.hideTimer = setTimeout(this.hide.bind(this), this.hideTimeMS);
  823. },
  824. clearTimeOutToHide(){
  825. // console.log('AudioPlayer clearTimeOutToHide()',this.hideTimer);
  826. if(this.hideTimer){
  827. clearTimeout(this.hideTimer);
  828. this.hideTimer = false;
  829. }
  830. },
  831. hide(){
  832. // console.log('AudioPlayer hide()');
  833. this.$container.removeClass('visible');
  834. // trigger highlighted node remove on corpus map
  835. try {
  836. _$corpus_canvas.trigger('audio-node-closed');
  837. } catch (e) {
  838. console.info('AudioPlayer hide() : _$corpus_canvas does not exists');
  839. }
  840. },
  841. // object events
  842. on(event_name, handler){
  843. if(typeof this.event_handlers[event_name] == 'undefined'){
  844. console.warn('AudioPlayer : event '+event_name+' does not exists');
  845. }
  846. this.event_handlers[event_name].push(handler);
  847. return this;
  848. },
  849. emmit(event_name, args){
  850. // console.log('AudioPlayer emmit() event_name', event_name);
  851. // console.log('AudioPlayer emmit() handlers', this.event_handlers[event_name]);
  852. var handler;
  853. var args = args || {};
  854. for (var i = this.event_handlers[event_name].length-1; i >= 0 ; i--) {
  855. handler = this.event_handlers[event_name][i];
  856. // console.log('AudioPlayer emmit() loop handler', handler);
  857. setTimeout(function(){
  858. // console.log('AudioPlayer emmit() timeout handler', handler);
  859. handler(args);
  860. }, 0);
  861. }
  862. return this;
  863. },
  864. }
  865. // ___ _ ___ _
  866. // | _ \__ _ _ _ __| |___ _ __ | _ \ |__ _ _ _ ___ _ _
  867. // | / _` | ' \/ _` / _ \ ' \| _/ / _` | || / -_) '_|
  868. // |_|_\__,_|_||_\__,_\___/_|_|_|_| |_\__,_|\_, \___|_|
  869. // |__/
  870. function RandomPlayer(playlist){
  871. this.active = false;
  872. this.playlist = playlist;
  873. this.$btn = $('<a>').html('Shuffle').addClass('random-player-btn');
  874. this.init();
  875. };
  876. RandomPlayer.prototype = {
  877. init(){
  878. // this.shuffle();
  879. $('<div>')
  880. .addClass('block random-player')
  881. .append(this.$btn)
  882. // .insertAfter('#block-userlogin, #block-studiolinkblock');
  883. .prependTo('.region-footer-right');
  884. // events
  885. this.$btn.on('click', this.toggleActive.bind(this));
  886. // attach an event on AudioPlayer
  887. _audioPlayer
  888. .on('audio-ended', this.onAudioPlayerEnded.bind(this))
  889. .on('audio-play-next', this.onAudioPlayNext.bind(this))
  890. .on('stop-shuffle', this.stop.bind(this));
  891. _$corpus_canvas
  892. .on('update-random-playlist', this.updatePlaylist.bind(this));
  893. },
  894. updatePlaylist(e){
  895. // debugger;
  896. this.playlist = e.playlist;
  897. this.shuffle();
  898. },
  899. shuffle(){
  900. var tempPLaylist = [];
  901. for (var i = this.playlist.length-1; i >= 0 ; i--) {
  902. tempPLaylist.push(this.playlist[i]);
  903. }
  904. this.shuffledPlaylist = [];
  905. while(tempPLaylist.length > 0){
  906. var r = Math.floor(Math.random() * tempPLaylist.length);
  907. this.shuffledPlaylist.push(tempPLaylist.splice(r,1)[0]);
  908. }
  909. //console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
  910. },
  911. toggleActive(e){
  912. if (this.active) {
  913. this.stop();
  914. }else{
  915. this.start();
  916. }
  917. },
  918. start(){
  919. this.active = _audioPlayer.shuffle_is_active = true;
  920. this.$btn.addClass('is-active');
  921. this.shuffle();
  922. this.next();
  923. },
  924. stop(){
  925. this.active = _audioPlayer.shuffle_is_active = false;
  926. this.$btn.removeClass('is-active');
  927. // stop audio player
  928. // _audioPlayer.stop();
  929. },
  930. next(){
  931. if(this.active && this.shuffledPlaylist.length > 0)
  932. _audioPlayer.openDocument(this.shuffledPlaylist.splice(0,1)[0]);
  933. },
  934. onAudioPlayNext(){
  935. //console.log('RandomPlayer : onAudioPlayNext()');
  936. this.next();
  937. },
  938. onAudioPlayerEnded(){
  939. //console.log('RandomPlayer : onAudioPlayerEnded()');
  940. this.next();
  941. }
  942. };
  943. // ___ ___ _
  944. // / __|___ _ __ _ __ ___| _ \ |__ _ _ _ ___ _ _
  945. // | (__/ _ \ ' \| '_ \/ _ \ _/ / _` | || / -_) '_|
  946. // \___\___/_|_|_| .__/\___/_| |_\__,_|\_, \___|_|
  947. // |_| |__/
  948. function CompoPlayer(){
  949. this.active = false;
  950. this.playing = false;
  951. this.paused = false;
  952. this.playlist = [];
  953. this.current_index = 0;
  954. this.$composer = null;
  955. this.$compo = null;
  956. this.$controls = null;
  957. this.init();
  958. };
  959. CompoPlayer.prototype = {
  960. init(){
  961. // console.log('CompoPlayer init()');
  962. // attach an event on AudioPlayer
  963. _audioPlayer
  964. .on('audio-open-document', this.onAudioOpenDocument.bind(this))
  965. .on('audio-play', this.onAudioPlayerPlay.bind(this))
  966. .on('audio-pause', this.onAudioPlayerPause.bind(this))
  967. .on('audio-ended', this.onAudioPlayerEnded.bind(this));
  968. // .on('audio-play-next', this.onAudioPlayNext.bind(this));
  969. // this.newCompo();
  970. },
  971. newCompo(){
  972. //console.log('CompoPlayer newCompo()');
  973. // this.$compo = $('.composition_ui .composer .composition');
  974. this.initControls();
  975. },
  976. initControls(){
  977. //console.log('CompoPlayer initControls()');
  978. this.$composer = $('.composition_ui .composer');
  979. this.$compo = $('.composition_ui .composer .composition');
  980. this.$controls = $('.composition_ui .composer .compo-player-controls');
  981. if(!this.$controls.is('.ready') && this.$compo){
  982. this.$previous = $('<div>').addClass('previous')
  983. .on('click', this.prev.bind(this))
  984. .appendTo(this.$controls);
  985. this.$playpause = $('<div>').addClass('play-pause')
  986. .on('click', this.togglePlayPause.bind(this))
  987. .appendTo(this.$controls);
  988. this.$next = $('<div>').addClass('next')
  989. .on('click', this.next.bind(this))
  990. .appendTo(this.$controls);
  991. this.$controls.addClass('ready');
  992. this.refresh();
  993. this.active = true;
  994. // this.newCompo();
  995. }
  996. },
  997. refresh(){
  998. // console.log('CompoPlayer refresh(), this', this);
  999. this.stop();
  1000. // load new playlist
  1001. this.playlist = [];
  1002. var that = this;
  1003. $('.field--name-documents .field__item',this.$compo).each(function(i,el){
  1004. var $link = $('a.audio-link',this);
  1005. that.playlist.push({
  1006. item:$(this),
  1007. audio_url:$link.attr("audio_url"),
  1008. nid:$link.attr("nid"),
  1009. });
  1010. });
  1011. this.showHideControls();
  1012. },
  1013. togglePlayPause(){
  1014. // console.log('CompoPlayer togglePlayPause');
  1015. if (this.playing && !this.paused) {
  1016. this.pause();
  1017. }else{
  1018. if(this.playing && this.paused){
  1019. this.play();
  1020. }else{
  1021. this.start();
  1022. }
  1023. }
  1024. },
  1025. start(){
  1026. //console.log('start');
  1027. // console.log('CompoPlayer start()');
  1028. this.playing = true;
  1029. this.play();
  1030. },
  1031. play(){
  1032. // console.log('play');
  1033. if(this.paused){
  1034. this.paused = false;
  1035. _audioPlayer.play();
  1036. }else{
  1037. _audioPlayer.openDocument(this.playlist[this.current_index], this);
  1038. }
  1039. this.setActiveItem().showHideControls();
  1040. },
  1041. pause(){
  1042. //console.log('pause');
  1043. this.paused = true;
  1044. this.showHideControls();
  1045. _audioPlayer.stop();
  1046. },
  1047. next(){
  1048. // console.log('CompoPlayer next()');
  1049. if(this.playing){
  1050. this.current_index += 1;
  1051. if(this.current_index < this.playlist.length){
  1052. this.play();
  1053. }else{
  1054. this.stop();
  1055. }
  1056. }
  1057. },
  1058. prev(){
  1059. // console.log('CompoPlayer prev()');
  1060. if(this.playing){
  1061. this.current_index -= 1;
  1062. if(this.current_index >= 0){
  1063. this.play();
  1064. }else{
  1065. this.stop();
  1066. }
  1067. }
  1068. },
  1069. stop(){
  1070. if(this.playing){
  1071. _audioPlayer.stop();
  1072. }
  1073. this.reset();
  1074. },
  1075. reset(){
  1076. this.playing = false;
  1077. this.paused = false;
  1078. this.resetIndex();
  1079. },
  1080. resetIndex(){
  1081. this.current_index = 0;
  1082. this.showHideControls().resetActiveItems();
  1083. },
  1084. setActiveItem(){
  1085. this.resetActiveItems();
  1086. if(this.playing && this.current_index >= 0){
  1087. this.playlist[this.current_index].item.addClass('is-active');
  1088. }
  1089. // this call shoud not be here
  1090. this.showHideControls();
  1091. return this;
  1092. },
  1093. resetActiveItems(){
  1094. for (var n = 0; n < this.playlist.length; n++) {
  1095. // console.log('node',node);
  1096. this.playlist[n].item.removeClass('is-active');
  1097. }
  1098. return this;
  1099. },
  1100. showHideControls(){
  1101. // console.log('CompoPlayer showHideNextBtn(), playing:'+this.playing+', paused:'+this.paused);
  1102. // global playing
  1103. if(this.$controls){
  1104. if(this.playing && !this.paused){
  1105. this.$controls.addClass('is-playing');
  1106. }else{
  1107. this.$controls.removeClass('is-playing');
  1108. }
  1109. }
  1110. // playpause
  1111. if(this.$playpause){
  1112. if(this.playlist.length > 0){
  1113. this.$playpause.addClass('is-active');
  1114. }else{
  1115. this.$playpause.removeClass('is-active');
  1116. }
  1117. }
  1118. // next
  1119. if(this.$next){
  1120. if(this.playing && this.playlist.length > 1 && this.current_index < this.playlist.length -1){
  1121. this.$next.addClass('is-active');
  1122. }else{
  1123. this.$next.removeClass('is-active');
  1124. }
  1125. }
  1126. // previous
  1127. if(this.$previous){
  1128. if(this.playing && this.playlist.length > 1 && this.current_index > 0){
  1129. this.$previous.addClass('is-active');
  1130. }else{
  1131. this.$previous.removeClass('is-active');
  1132. }
  1133. }
  1134. return this;
  1135. },
  1136. deactivate(){
  1137. this.stop();
  1138. this.active = false;
  1139. },
  1140. // _audioPlayer events
  1141. onAudioOpenDocument(args){
  1142. if(args.caller !== this){
  1143. // console.log('CompoPlayer onAudioOpenDocument() called by other');
  1144. this.reset();
  1145. }
  1146. // else{
  1147. // // console.log('CompoPlayer onAudioOpenDocument() self calling');
  1148. // }
  1149. },
  1150. onAudioPlayerPlay(){
  1151. if(this.playing && this.paused){
  1152. this.paused = false;
  1153. this.showHideControls();
  1154. }
  1155. },
  1156. onAudioPlayerPause(){
  1157. if(this.playing && !this.paused){
  1158. this.paused = true;
  1159. this.showHideControls();
  1160. }
  1161. },
  1162. onAudioPlayerEnded(){
  1163. this.next();
  1164. },
  1165. // onAudioPlayNext(){
  1166. // this.next();
  1167. // }
  1168. };
  1169. // ___ _ ___
  1170. // | __| _ ___ _ _| |_| _ \__ _ __ _ ___
  1171. // | _| '_/ _ \ ' \ _| _/ _` / _` / -_)
  1172. // |_||_| \___/_||_\__|_| \__,_\__, \___|
  1173. // |___/
  1174. function backToFrontPage(pop_state){
  1175. console.log('backToFrontPage', pop_state);
  1176. closeAllModals();
  1177. // assume we are going back to front page
  1178. $('body').removeClass().addClass('path-frontpage');
  1179. $('a[data-drupal-link-system-path="<front>"]').addClass('is-active');
  1180. // close entrees
  1181. _$corpus_canvas.trigger({'type':'close-all-entree'});
  1182. if(typeof pop_state == "undefined" || !pop_state){
  1183. console.log('backToFrontPage push state');
  1184. history.pushState({home:true}, null, drupalSettings.path.baseUrl+drupalSettings.path.currentLanguage);
  1185. }
  1186. }
  1187. function initHome(){
  1188. addCloseModalBtnToCols();
  1189. // console.log('theme : initHome');
  1190. // console.log('theme : initProductions');
  1191. var $grid = $('.grid',_$row).masonry({
  1192. itemSelector:'.col',
  1193. columnWidth:'.col-2',
  1194. horizontalOrder: true,
  1195. containerStyle: null,
  1196. // disable initial layout
  1197. // initLayout: false,
  1198. });
  1199. // bind event
  1200. // $grid.masonry( 'on', 'layoutComplete', function() {
  1201. // console.log('layout is complete');
  1202. // });
  1203. // layout Masonry after each image loads
  1204. $grid.imagesLoaded().progress( function() {
  1205. $grid.masonry('layout');
  1206. });
  1207. $grid.imagesLoaded(function(){
  1208. $grid.masonry('layout');
  1209. });
  1210. }
  1211. // ___ _ _ _
  1212. // | _ \_ _ ___ __| |_ _ __| |_(_)___ _ _ ___
  1213. // | _/ '_/ _ \/ _` | || / _| _| / _ \ ' \(_-<
  1214. // |_| |_| \___/\__,_|\_,_\__|\__|_\___/_||_/__/
  1215. function initProductions(){
  1216. // console.log('theme : initProductions');
  1217. var $grid = $('.grid',_$row).masonry({
  1218. itemSelector:'.col',
  1219. columnWidth:'.col-2',
  1220. horizontalOrder: true,
  1221. containerStyle: null,
  1222. // disable initial layout
  1223. // initLayout: false,
  1224. });
  1225. // bind event
  1226. // $grid.masonry( 'on', 'layoutComplete', function() {
  1227. // console.log('layout is complete');
  1228. // });
  1229. // layout Masonry after each image loads
  1230. $grid.imagesLoaded().progress( function() {
  1231. $grid.masonry('layout');
  1232. });
  1233. $grid.imagesLoaded(function(){
  1234. $grid.masonry('layout');
  1235. });
  1236. };
  1237. // ___ _ _ _
  1238. // | __|_ _ _ _ ___ __ _(_)__| |_ _ _ ___ _ __ ___ _ _| |_
  1239. // | _|| ' \| '_/ -_) _` | (_-< _| '_/ -_) ' \/ -_) ' \ _|
  1240. // |___|_||_|_| \___\__, |_/__/\__|_| \___|_|_|_\___|_||_\__|
  1241. // |___/
  1242. function initEnregistrementTranscript(){
  1243. console.log('initEnregistrementTranscript');
  1244. var $node = _$row.find('article.node--type-enregistrement.node--view-mode-transcript');
  1245. var $nav = $('<nav>').prependTo($node);
  1246. $node.find('.field--name-field-transcript-vo').addClass('visible').find('.field__label')
  1247. .clone().appendTo($nav).addClass('is-active')
  1248. .attr('field_target', '.field--name-field-transcript-vo');
  1249. $node.find('.field--name-field-transcript-trad').find('.field__label')
  1250. .clone().appendTo($nav)
  1251. .attr('field_target', '.field--name-field-transcript-trad');
  1252. $nav.find('.field__label').on('click', function(){
  1253. var $this = $(this).addClass('is-active');
  1254. $this.siblings('.is-active').removeClass('is-active');
  1255. $this.parents('article.node').find('.field.visible').removeClass('visible');
  1256. $this.parents('article.node').find($this.attr('field_target')).addClass('visible');
  1257. });
  1258. };
  1259. // __ __ _ _
  1260. // | \/ |___ __| |__ _| |___
  1261. // | |\/| / _ \/ _` / _` | (_-<
  1262. // |_| |_\___/\__,_\__,_|_/__/
  1263. function closeAllModals(){
  1264. //console.log('theme : closeAllModals');
  1265. // TODO: animate the remove
  1266. _$row.html('');
  1267. _$ajaxLinks.removeClass('is-active');
  1268. _$body.trigger({'type':'all-modal-closed'});
  1269. };
  1270. // _ _ _
  1271. // | || |___| |_ __ ___ _ _ ___
  1272. // | __ / -_) | '_ \/ -_) '_(_-<
  1273. // |_||_\___|_| .__/\___|_| /__/
  1274. // |_|
  1275. // https://plainjs.com/javascript/utilities/set-cookie-get-cookie-and-delete-cookie-5/
  1276. // function getCookie(name) {
  1277. // var v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
  1278. // return v ? v[2] : null;
  1279. // }
  1280. // function setCookie(name, value, days) {
  1281. // var d = new Date;
  1282. // d.setTime(d.getTime() + 24*60*60*1000*days);
  1283. // document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
  1284. // }
  1285. // function deleteCookie(name) { setCookie(name, '', -1); }
  1286. init();
  1287. } // end EdlpTheme()
  1288. $(document).ready(function($) {
  1289. if(drupalSettings.path.isFront){
  1290. var edlptheme = new EdlpTheme();
  1291. }
  1292. });
  1293. })(jQuery, Drupal, drupalSettings);