main.js 69 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032
  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. var _ajax_timing = {
  14. start:0,
  15. end:0
  16. };
  17. var _corpus_promise;
  18. var _is_mobile = edlp_mobile.device_is_mobile;
  19. // ___ _ _
  20. // |_ _|_ _ (_) |_
  21. // | || ' \| | _|
  22. // |___|_||_|_|\__|
  23. function init(){
  24. console.log("EdlpTheme init()");
  25. // if(!drupalSettings.path.isFront)
  26. // return;
  27. if(_is_mobile){
  28. initMobile();
  29. }
  30. initEvents();
  31. _audioPlayer = new AudioPlayer();
  32. _compoPlayer = new CompoPlayer();
  33. initAjaxLinks();
  34. initHistory();
  35. if(!_is_mobile){
  36. checkLayout();
  37. initAudioLinksHover();
  38. }
  39. if(_is_mobile){
  40. if(drupalSettings.path.isFront){
  41. initHomeMobile();
  42. }
  43. _$body.attr('booted', 'booted');
  44. }
  45. // if(!drupalSettings.path.isFront)
  46. // return;
  47. //
  48. // initEvents();
  49. };
  50. // __ __ _ _ _
  51. // | \/ |___| |__(_) |___
  52. // | |\/| / _ \ '_ \ | / -_)
  53. // |_| |_\___/_.__/_|_\___|
  54. function initMobile(){
  55. // $('[data-drupal-link-system-path="<front>"]','#block-mainnavigation')
  56. // .removeClass('is-active')
  57. // .attr('href', '#collection');
  58. // edlp_mobile.mobile_home_path.replace(/^\//, '')
  59. // TODO: remove collection from mobile home
  60. // TODO: replace ajax link to only collection for mobile
  61. $('h2, a', '#block-mainnavigation')
  62. .add('h2, a', '#block-mainnavigation-2')
  63. .on('click', onclickHomeMobileMenu);
  64. }
  65. function onclickHomeMobileMenu(e){
  66. // $('#block-mainnavigation').toggleClass('opened');
  67. $('#block-mainnavigation-2').toggleClass('opened');
  68. };
  69. function initHomeMobile(){
  70. // taxonomy-term.vocabulary-entrees.home_mobile
  71. // $('.field--name-field-notice, .index', '.entrees .taxonomy-term.vocabulary-entrees')
  72. // .addClass('closed');
  73. // $('.field--name-field-notice>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
  74. // .on('click', onClickHomeMobileNotice);
  75. // $('.index>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
  76. // .on('click', onClickHomeMobileIndex);
  77. };
  78. // function onClickHomeMobileNotice(e){
  79. // // console.log('onClickHomeMobileNotice');
  80. // // var $part = $(this).parent();//parents('.taxonomy-term');
  81. // toggleEntreeOpening($(this).parent(), 'notice');
  82. // };
  83. // function onClickHomeMobileIndex(e){
  84. // // console.log('onClickHomeMobileIndex');
  85. // // var $part = $(this).parent();//parents('.taxonomy-term');
  86. // toggleEntreeOpening($(this).parent(), 'index');
  87. // };
  88. // function toggleEntreeOpening($e, part){
  89. // $e.toggleClass('closed')
  90. // .parents('.taxonomy-term.vocabulary-entrees.home_mobile').toggleClass(part+'-opened');
  91. // }
  92. // ___ _
  93. // | __|_ _____ _ _| |_ ___
  94. // | _|\ V / -_) ' \ _(_-<
  95. // |___|\_/\___|_||_\__/__/
  96. function initEvents(){
  97. // https://www.html5rocks.com/en/tutorials/async/deferred/
  98. var $corpus_df = $.Deferred();
  99. _corpus_promise = $corpus_df.promise();
  100. _$body
  101. .on('corpus-map-ready', function(e){
  102. onCorpusMapReady(e);
  103. $corpus_df.resolve();
  104. })
  105. .on('on-studio-chutier-updated', initAjaxLinks)
  106. .on('studio-initialized', function(e){
  107. _compoPlayer.newCompo();
  108. })
  109. .on('studio-not-active', function(e){
  110. _compoPlayer.deactivate();
  111. })
  112. .on('on-studio-compo-updated', function(e){
  113. initAjaxLinks();
  114. _compoPlayer.refresh();
  115. })
  116. .on('on-studio-compo-opened', function(e){
  117. initAjaxLinks();
  118. _compoPlayer.newCompo();
  119. })
  120. .on('search-results-loaded', function(e){
  121. initAjaxLinks();
  122. initAudioLinksHover();
  123. checkVisibleCorpusMapSpace();
  124. })
  125. // do not close index or notice modale on entree click
  126. .on('open_entree', function(e){
  127. console.log('on_open_entree : e', e);
  128. closeAllModals();
  129. checkLayout();
  130. // add body class for currently loaded content
  131. // var body_classes = [
  132. // 'path-'+sys_path.replace(/\//g, '-'),
  133. // 'entity-type-'+data.entity_type,
  134. // 'bundle-'+data.bundle,
  135. // 'view-mode-'+data.view_mode
  136. // ];
  137. _$body.removeClass();//.addClass(body_classes.join(' '));
  138. // record new history state
  139. if(typeof e.url != 'undefined'){
  140. var state = getSysPathState(e.sys_path);
  141. history.pushState(state, null, e.url);
  142. // piwik
  143. if(typeof _paq !== 'undefined'){
  144. // page tracking
  145. // https://matomo.org/blog/2017/02/how-to-track-single-page-websites-using-piwik-analytics/
  146. _paq.push(['setCustomUrl', e.url]);
  147. _paq.push(['setDocumentTitle', e.title]);
  148. _paq.push(['trackPageView']);
  149. }
  150. }
  151. })
  152. .on('close_entree', function(e){
  153. backToFrontPage();
  154. checkLayout();
  155. });
  156. window.addEventListener('resize', checkLayout, false);
  157. }
  158. // __ ___ _ ___ _
  159. // \ \ / (_)_ _ __| |_____ __ __ | _ \___ __(_)______
  160. // \ \/\/ /| | ' \/ _` / _ \ V V / | / -_|_-< |_ / -_)
  161. // \_/\_/ |_|_||_\__,_\___/\_/\_/ |_|_\___/__/_/__\___|
  162. function checkLayout(){
  163. var $audioplayer = $("#audio-player");
  164. if($audioplayer.length){
  165. var navpos = $('#block-mainnavigation').position();
  166. // console.log('navpos', navpos);
  167. if(typeof navpos != 'undefined'){
  168. $audioplayer.css({
  169. 'width':navpos.left+'px'
  170. });
  171. }
  172. }
  173. checkGridBlockHeight();
  174. checkGridBlockVisible();
  175. // entrees
  176. // TODO: center the entrees menu
  177. };
  178. // ___ _ _ ___
  179. // / __| __ _ _ ___| | | _ ) __ _ _ _ ___
  180. // \__ \/ _| '_/ _ \ | | _ \/ _` | '_(_-<
  181. // |___/\__|_| \___/_|_|___/\__,_|_| /__/
  182. function initScrollbars(){
  183. // console.log("initScrollbars");
  184. // TODO: find a better js scroll than overlayScrollbars which does not handle well max-height + overflow-y:auto;
  185. // $('.os-scroll').overlayScrollbars({
  186. // overflowBehavior:{
  187. // x:'h',
  188. // y:'scroll',
  189. // clipAlways:false
  190. // }
  191. // });
  192. };
  193. // _ _
  194. // /_\ (_)__ ___ __
  195. // / _ \ | / _` \ \ /
  196. // /_/ \_\/ \__,_/_\_\
  197. // |__/
  198. function getSysPathState(sys_path, view_mode){
  199. // console.log('Theme : getSysPathState', sys_path);
  200. var state = {
  201. 'sys_path':sys_path,
  202. 'ajax_path': sys_path
  203. };
  204. // convert node link to edlp_ajax_node module links
  205. var node_match = state.ajax_path.match(/^\/?(node\/(\d+))$/i);
  206. console.log('node_match', node_match);
  207. var term_match = state.ajax_path.match(/^\/?(taxonomy\/term\/(\d+))$/i);
  208. console.log('term_match', term_match);
  209. if(node_match){
  210. // TODO: detect audio links which will open audioplayer and wont load any ajax content unless view_mode "article" or "transcript"
  211. state.ajax_path = _ajax_settings.entityjson_path+'/'+node_match[1];
  212. state.node_nid = node_match[2];
  213. // check for viewmode attribute
  214. if(view_mode){
  215. state.ajax_path += '/'+view_mode;
  216. state.view_mode = view_mode;
  217. }
  218. }else if(term_match){
  219. // terms are always entrees, there's no other vocabulary links in front
  220. state.ajax_path = _ajax_settings.entityjson_path+'/'+term_match[1];
  221. state.ajax_path = state.ajax_path.replace(/taxonomy\/term/, 'taxonomy_term');
  222. state.entree_tid = term_match[2];
  223. // check for viewmode attribute
  224. if(view_mode){
  225. state.ajax_path += '/'+view_mode;
  226. state.view_mode = view_mode;
  227. }else{
  228. state.ajax_path = null;
  229. }
  230. }else{
  231. // convert other link to ajax
  232. // TODO: we assume that other links (no node, no term) are all from own modules (e.g. productions) !! may not be true !!
  233. state.ajax_path += '/ajax'
  234. }
  235. return state;
  236. };
  237. function ajaxLoadContent(state){
  238. console.log('ajaxLoadContent : state', state);
  239. _$body.addClass('ajax-loading');
  240. _ajax_timing.start = performance.now();
  241. var path = window.location.origin + Drupal.url(state.ajax_path);
  242. $.getJSON(path, {})
  243. .done(function(data){
  244. onAjaxLoaded(data, state);
  245. })
  246. .fail(function(jqxhr, textStatus, error){
  247. onAjaxLoadError(jqxhr, textStatus, error, state.sys_path);
  248. });
  249. };
  250. function onAjaxLoadError(jqxhr, textStatus, error, sys_path){
  251. console.warn('ajaxlink load failed for '+sys_path+' : '+error, jqxhr.responseText);
  252. $('.ajax-loading').removeClass('ajax-loading');
  253. _$body.removeClass('ajax-loading');
  254. };
  255. function onAjaxLoaded(data, state){
  256. console.log('ajax loaded', state, data);
  257. var $rendered = $(data.rendered);
  258. $rendered.attr({
  259. 'sys_path':state.sys_path,
  260. 'view_mode': state.view_mode
  261. });
  262. // console.log(data);
  263. // reset all style may been added by other pages (like masonry for productions)
  264. // and replace all content with newly loaded
  265. // TODO: build a system to replace or append contents (like studio + search)
  266. if(data.entity_type == "node" && data.bundle == "evenement"){
  267. if(_$row.find('.col.event').length){
  268. _$row.find('.col.event').replaceWith($rendered);
  269. }else if(_$row.find('.col.aside').length){
  270. _$row.find('.col.aside').replaceWith($rendered);
  271. }else{
  272. _$row.append($rendered);
  273. }
  274. }else{
  275. _$row.removeAttr('style').html($rendered);
  276. }
  277. // add body class for currently loaded content
  278. var body_classes = [
  279. 'path-'+state.sys_path.replace(/\//g, '-'),
  280. 'entity-type-'+data.entity_type,
  281. 'bundle-'+data.bundle,
  282. 'view-mode-'+data.view_mode
  283. ];
  284. _$body.removeClass().addClass(body_classes.join(' '));
  285. // id node add a generic path-node class to body
  286. // m = state.sys_path.match(/^\/?(node\/\d+)$/g);
  287. // if(m)
  288. if(state.node_nid)
  289. _$body.addClass('path-edlp-node');
  290. // handle clicked link classes
  291. $('.ajax-loading').removeClass('ajax-loading');
  292. $('.ajax-link.is-active:not(.articles-link)').removeClass('is-active');
  293. $('.is-active-trail').removeClass('is-active-trail');
  294. if(typeof state.selector != 'undefined'){
  295. // in case of entree link (actualy, selector is used only for entries links)
  296. // TODO: unfortunatly on initFirstLoad there is no selector property
  297. console.log('selector', state.selector);
  298. $('a[selector="'+state.selector+'"]').addClass('is-active');
  299. initAudioLinksHover();
  300. }else{
  301. if(typeof state.view_mode != 'undefined'){
  302. $('a[viewmode="'+state.view_mode+'"][data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
  303. }else{
  304. // wait for corpus map beeing ready (e.g. for articles link)
  305. _corpus_promise.done(function(){
  306. $('a[data-drupal-link-system-path="'+state.sys_path+'"]').addClass('is-active');
  307. });
  308. }
  309. // as new content is not related to entree, we trigger close entree
  310. _$body.trigger({'type':'new-content-not-entree-ajax-loaded'});
  311. }
  312. // if bundle page (productions) activate production links
  313. if (typeof data.bundle != 'undefined' && data.bundle == "page") {
  314. $('a[data-drupal-link-system-path="productions"]').addClass('is-active-trail');
  315. }
  316. // if node is in production menu tree, set first level of tree active, e.g. pieces sonores
  317. if (typeof data.menu_parents != 'undefined') {
  318. for (var i = 0; i < data.menu_parents.length; i++) {
  319. var menu_sys_path = data.menu_parents[i];
  320. $('a[data-drupal-link-system-path="'+menu_sys_path+'"]').addClass('is-active-trail');
  321. }
  322. }
  323. // if entity has corpus-map's linked document call a filter to corpus map
  324. if(typeof data.documents_lies != 'undefined'){
  325. if(_corpus_ready){
  326. _$body.trigger({
  327. type:'ajax-node-loaded-linked-documents',
  328. nids:data.documents_lies
  329. });
  330. }else{
  331. _corpus_promise.done(function(){
  332. _$body.trigger({
  333. type:'ajax-node-loaded-linked-documents',
  334. nids:data.documents_lies
  335. });
  336. });
  337. }
  338. }
  339. // if block attached (eg : from edlp_productions module)
  340. // not used anymore as production block is always present (but not visible)
  341. if(typeof data.block != 'undefined'){
  342. // if block not already added
  343. if(!$('#'+data.block.id, '.region-'+data.block.region).length){
  344. $('.region-'+data.block.region).append(data.block.rendered);
  345. }
  346. }
  347. // initScrollbars();
  348. if(state.sys_path == "productions"){
  349. // initProductions();
  350. initGrid();
  351. }else{
  352. addCloseModalBtnToCols();
  353. }
  354. if(state.sys_path == "collection"){
  355. // only for mobile version of collection
  356. initCollectionNav();
  357. }
  358. // enregistrement transcription
  359. if(data.entity_type == "node" && data.bundle == "enregistrement" && data.view_mode == "transcript"){
  360. // window.requestAnimationFrame(initEnregistrementTranscript);
  361. initEnregistrementTranscript();
  362. }
  363. if(state.sys_path == "search"){
  364. initSearch();
  365. }
  366. // update the language switcher block if it comes in the response
  367. if(typeof data.translations_links != 'undefined'){
  368. console.log('state',state);
  369. var lang_code = drupalSettings.path.currentLanguage;
  370. var $links = $(data.translations_links);
  371. // set active link
  372. $links.find('li[hreflang="'+lang_code+'"]').addClass('is-active').find('a').addClass('is-active');
  373. if(state.view_mode){
  374. $links.find('a').each(function(i,e){
  375. var $a = $(this);
  376. $a.attr('href', $a.attr('href')+'#'+state.view_mode);
  377. });
  378. }
  379. // if(state.selector){
  380. // $links.find('a').attr('selector', state.selector);
  381. // }
  382. $('ul','.block.language-switcher-language-url').replaceWith($links);
  383. }
  384. initAjaxLinks();
  385. initAudioLinksHover();
  386. checkVisibleCorpusMapSpace();
  387. // trigger other modules behaviours
  388. _$body.trigger({'type':'new-content-ajax-loaded'});
  389. // and call drupal behaviours
  390. Drupal.attachBehaviors(_$row[0]);
  391. _$body.attr('booted', 'booted');
  392. _$body.removeClass('ajax-loading');
  393. // url is null means that we are loading content on popState event
  394. // so we don't record the state again
  395. if(state.url){
  396. // var state = {
  397. // ajax_path:ajax_path,
  398. // sys_path:sys_path,
  399. // };
  400. // console.log('url:'+url+' ; state',state);
  401. // console.log(window.location);
  402. // /!\ we can not pushestate with absolute url /!\
  403. history.pushState(state, null, state.url);
  404. // piwik
  405. if(typeof _paq !== 'undefined'){
  406. // page tracking
  407. // https://matomo.org/blog/2017/02/how-to-track-single-page-websites-using-piwik-analytics/
  408. _paq.push(['setCustomUrl', state.url]);
  409. _paq.push(['setDocumentTitle', data.title]);
  410. // TODO: piwik track load time
  411. _ajax_timing.end = performance.now();
  412. _paq.push(['setGenerationTimeMs', _ajax_timing.end-_ajax_timing.start]);
  413. _paq.push(['trackPageView']);
  414. // js event
  415. // trackEvent(category, action, [name], [value])
  416. // _paq.push(['trackEvent', 'AjaxNav', 'loaded', state.url]);
  417. }
  418. }
  419. };
  420. function initAudioLinksHover(){
  421. console.log("initAudioLinksHover()");
  422. _$row.find('a.audio-link')
  423. .on('mouseover', function(event) {
  424. event.preventDefault();
  425. if(_corpus_ready){
  426. _$corpus_canvas.trigger({
  427. type:'mouseover-audio-link',
  428. nid:$(this).attr('nid')
  429. });
  430. }
  431. })
  432. .on('mouseout', function(event) {
  433. event.preventDefault();
  434. if(_corpus_ready){
  435. _$corpus_canvas.trigger({
  436. type:'mouseout-audio-link',
  437. nid:$(this).attr('nid')
  438. });
  439. }
  440. });
  441. };
  442. function addCloseModalBtnToCols(){
  443. if(_is_mobile) return;
  444. $('.col', _$row).each(function(index, el) {
  445. if($('span.close-col-btn', this).length)
  446. return true;
  447. $(this).children('.wrapper').prepend($('<span>')
  448. .addClass('close-col-btn')
  449. .on('click', onCloseModal)
  450. );
  451. });
  452. };
  453. function onCloseModal(e){
  454. // check for theme attribute and emmit event
  455. var $col = $(this).parents('.col');
  456. var theme = $col.attr('theme');
  457. if(theme != ''){
  458. _$body.trigger({'type':theme+'-col-closed'});
  459. }
  460. if(_$body.is('.entity-type-node.bundle-page') && $(this).next().is('.node--type-page')){
  461. // remove all the col (prod page and agenda in case) only if closing the main page col
  462. // if closing the aside col (agenda) leave the main col in place
  463. $col.add($col.siblings('.col')).remove();
  464. }else{
  465. // remove the col
  466. $col.remove();
  467. }
  468. checkRowEmpty();
  469. checkVisibleCorpusMapSpace();
  470. // set links to this modal to not active (tested on articles from audio cartel)
  471. if( $col.attr('view_mode') && $col.attr('sys_path')){
  472. $('a[data-drupal-link-system-path="'+$col.attr('sys_path')+'"][viewmode="'+$col.attr('view_mode')+'"]').removeClass('is-active');
  473. }
  474. };
  475. // _ _ ___ _ _
  476. // /_\ (_)__ ___ __ | _ ) |___ __| |__ ___
  477. // / _ \ | / _` \ \ / | _ \ / _ \/ _| / /(_-<
  478. // /_/ \_\/ \__,_/_\_\ |___/_\___/\__|_\_\/__/
  479. // |__/
  480. // NOT USED (YET)
  481. // function refreshAllBlocks(){
  482. // var path = window.location.origin + Drupal.url(_ajax_settings.blocksjson_path);
  483. // $.getJSON(path, {})
  484. // .done(function(data){
  485. // onAjaxBlockLoaded(data);
  486. // })
  487. // .fail(function(jqxhr, textStatus, error){
  488. // onAjaxBlockLoadError(jqxhr, textStatus, error);
  489. // });
  490. // };
  491. // function onAjaxBlockLoadError(jqxhr, textStatus, error){
  492. // console.warn('ajax block load failed: '+error, jqxhr.responseText);
  493. // };
  494. // function onAjaxBlockLoaded(data){
  495. // console.log('onAjaxBlockLoaded', data);
  496. // // TODO: update each blocks (exepted language switcher)
  497. // for (var blockname in data.blocks) {
  498. // var block = data.blocks[blockname];
  499. // console.log(blockname, block);
  500. // $(block.id).replaceWith(block.rendered);
  501. // }
  502. // };
  503. // _ _ _ _
  504. // | || (_)__| |_ ___ _ _ _ _
  505. // | __ | (_-< _/ _ \ '_| || |
  506. // |_||_|_/__/\__\___/_| \_, |
  507. // |__/
  508. function initHistory(){
  509. initFirstLoad();
  510. window.addEventListener('popstate', onHistoryPopState);
  511. };
  512. function initFirstLoad(){
  513. console.log('theme : initFirstLoad()');
  514. console.log('window.location', window.location);
  515. // var origin_sys_path = window.localStorage.getItem('edlp_origin_path');
  516. var edlp_origin = JSON.parse(window.localStorage.getItem('edlp_origin'));
  517. console.log('edlp_origin', edlp_origin);
  518. if(edlp_origin != null && edlp_origin.sys_path){
  519. // hash is used as viewmode for taxonomy term entrees load (index or notice)
  520. // and for audio contents (article|transcript)
  521. var hash = edlp_origin.hash.replace('#', '');
  522. // create history state
  523. var state = getSysPathState(edlp_origin.sys_path, hash);
  524. // open entree tray in case of entree index|notice
  525. // (index or notice will be opened with ajaxLoadContent)
  526. // refactorized with new infos from edlp_origin
  527. // if(hash){
  528. if(edlp_origin.entity_type == "taxonomy_term"
  529. && edlp_origin.entity_bundle == "entrees"
  530. && hash){
  531. // var $link = $('[href="'+edlp_origin.url+'"][viewmode="'+hash+'"]');
  532. // var selector = $link.attr('selector') || null;
  533. // record the selector in the state for actions after ajaxContentLoaded
  534. state.selector = 'entree-'+hash+'-link-'+edlp_origin.entity_id; // entree-index-link-125
  535. // if(selector){
  536. // in case of entree link (actualy, selector is used only for entries links)
  537. // TODO: use a promise
  538. // TODO: but what if corpus ready before onAjaxLoaded >> use a promise !!
  539. if(_corpus_ready){
  540. _$corpus_canvas.trigger({
  541. type:'open-entree',
  542. // tid:$link.attr('tid')
  543. tid:edlp_origin.entity_id
  544. });
  545. }else{
  546. // else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
  547. // .is-active class is added by onAjaxLoaded() (when content is loaded)
  548. // $('li.entree[tid="'+$link.attr('tid')+'"] a.term-link').addClass('is-active');
  549. $('li.entree[tid="'+edlp_origin.entity_id+'"] a.term-link').addClass('is-active');
  550. }
  551. // }
  552. }
  553. // check if audio link
  554. // only if not random link
  555. if(edlp_origin.audio_url){
  556. var node = {
  557. nid:edlp_origin.entity_id,
  558. audio_url:edlp_origin.audio_url
  559. };
  560. _audioPlayer.openDocument(node, 'history_first_load');
  561. // close home
  562. closeAllModals();
  563. if(hash == "" || hash == 'random'){
  564. // if hash is random, RandomPlayer will be started when playlist sent by corpus.js
  565. // if audio only record in state
  566. state.audio = true;
  567. state.node = node;
  568. // we don't laod ajax content so we boot the home
  569. _$body.attr('booted', 'booted');
  570. }else{
  571. // ajax load content for audio only if article or transcript
  572. ajaxLoadContent(state);
  573. }
  574. }
  575. // only if not entree path
  576. // only if not audio (without article or transcript) path
  577. else if(state.ajax_path){
  578. // load content through ajax
  579. // ajaxLoadContent(null, state.sys_path, state.ajax_path, selector);
  580. ajaxLoadContent(state);
  581. }
  582. if(state.entree_tid){
  583. openEntree(state.entree_tid);
  584. }
  585. // record history state
  586. history.replaceState(state, null, edlp_origin.url+edlp_origin.hash);
  587. // reset the storage
  588. window.localStorage.removeItem("edlp_origin");
  589. // window.localStorage.removeItem("edlp_origin_url");
  590. }else{
  591. // if(window.location.hash == "#random"){
  592. //
  593. // }
  594. history.replaceState({home:true}, null, window.location.pathname+window.location.hash);
  595. // initHome();
  596. initGrid();
  597. _$body.attr('booted', 'booted');
  598. }
  599. };
  600. function onHistoryPopState(e){
  601. console.log('onPopState',e.state);
  602. if(e.state.home){
  603. backToFrontPage(true);
  604. }
  605. else if (e.state.audio) {
  606. _audioPlayer.openDocument(e.state.node, 'popstate', e.state.historic_index);
  607. }
  608. else{
  609. if(e.state.entree_tid){
  610. openEntree(e.state.entree_tid);
  611. }
  612. if(e.state.ajax_path){
  613. e.state.url = null;
  614. // ajaxLoadContent(null, e.state.sys_path, e.state.ajax_path)
  615. ajaxLoadContent(e.state);
  616. }
  617. }
  618. };
  619. // _ _ _ _ _
  620. // /_\ (_)__ ___ _| | (_)_ _ | |__ ___
  621. // / _ \ | / _` \ \ / |__| | ' \| / /(_-<
  622. // /_/ \_\/ \__,_/_\_\____|_|_||_|_\_\/__/
  623. // |__/
  624. function initAjaxLinks(){
  625. // console.log('initAjaxLinks');
  626. $('a', '#block-mainnavigation')
  627. .add('a', '#block-mainnavigation-2')
  628. // .add('a', '.block.language-switcher-language-url')
  629. .add('a', '#block-footer.menu--footer')
  630. .add('a', '#block-productions')
  631. .add('a', 'article.node:not(.node--type-enregistrement) h2.node-title')
  632. // .add('a', 'article.node--type-evenement.node--view-mode-teaser .field--name-field-page-liee')
  633. .add('a', '.productions-subtree')
  634. .add('a', '.productions-parent')
  635. // .add('a.index-link, a.notice-link', '#block-edlpentreesblock')
  636. .add('a', '.field--name-field-son')
  637. .addClass('ajax-link');
  638. if(!_is_mobile){
  639. $('a.site-name', '#block-edlptheme-branding').addClass('ajax-link');
  640. }
  641. _$ajaxLinks = $('.ajax-link');
  642. activateAjaxLinks();
  643. };
  644. function activateAjaxLinks(){
  645. // $('.ajax-link:not(.ajax-enabled)')
  646. _$ajaxLinks.each(function(i,e){
  647. var $this = $(this);
  648. // avoid already ajaxified links
  649. if($this.is('.ajax-enable')) return;
  650. if($this.attr('data-drupal-link-system-path') || $this.is('[type^="audio"]')){
  651. $this.on('click', onClickAjaxLink).addClass('ajax-enable');
  652. }
  653. });
  654. };
  655. function onClickAjaxLink(e){
  656. e.preventDefault();
  657. var $link = $(this);
  658. // let the site-name link going through as it will shuffle the map if already active
  659. if($link.is('.is-active') && !$link.is('.site-name'))
  660. return false;
  661. // Audio links
  662. // launch audio player and stop here
  663. if($link.is('.audio-link')){
  664. // check if caller is lastdocs block
  665. caller = $link.parents('.lastdocs').length ? 'lastdocs' : null;
  666. // open audio player
  667. _audioPlayer
  668. .emmit('stop-shuffle')
  669. .openDocument({
  670. nid:$link.attr('nid'),
  671. audio_url:$link.attr('audio_url'),
  672. title:$link.find('.field--name-title').html()
  673. },
  674. caller);
  675. return false;
  676. }
  677. // other sounds playing
  678. if($link.is('[type^="audio"]')){
  679. _audioPlayer
  680. .emmit('stop-shuffle')
  681. .openSound($link.attr('href'), $link.html());
  682. return false;
  683. }
  684. // NOT USED ( YET ? )
  685. // if($link.is('.language-link')){
  686. // TODO: change global site current language
  687. // load all blocks translated (exepted language switcher) ... :/
  688. // refreshAllBlocks();
  689. // TODO: use a promise to initAjaxLinks again after blocks updated
  690. // then let load the content
  691. // }
  692. // other links
  693. var sys_path = $(this).attr('data-drupal-link-system-path');
  694. // front page
  695. // just remove contents and stop here
  696. if(sys_path == '<front>'){
  697. if(!_is_mobile){
  698. if($link.is('.is-active') && _corpus_ready){
  699. _$corpus_canvas.trigger({'type':'shuffle-collection'});
  700. }else{
  701. backToFrontPage();
  702. }
  703. return false;
  704. }
  705. // else{
  706. // sys_path = edlp_mobile.mobile_home_path.replace(/^\//, '');
  707. // }
  708. }
  709. var view_mode = $link.attr('viewmode');
  710. var state = getSysPathState(sys_path, view_mode);
  711. state.url = $(this).attr('href');
  712. if(view_mode){
  713. state.url += "#"+view_mode;
  714. }
  715. if($link.is('[selector]')){
  716. state.selector = $link.attr('selector');
  717. }
  718. $link.addClass('ajax-loading');
  719. // ajaxLoadContent(url, sys_path, state.ajax_path, selector);
  720. ajaxLoadContent(state);
  721. return false;
  722. };
  723. // ___
  724. // / __|___ _ _ _ __ _ _ ___
  725. // | (__/ _ \ '_| '_ \ || (_-<
  726. // \___\___/_| | .__/\_,_/__/
  727. // |_|
  728. function onCorpusMapReady(e){
  729. //console.log('theme : onCorpusReady', e);
  730. _corpus_ready = true;
  731. _$corpus_canvas = $('canvas#corpus-map');
  732. _$corpus_canvas
  733. .on('corpus-cliked-on-map', function(e) {
  734. //console.log('theme : corpus-cliked-on-map');
  735. backToFrontPage();
  736. })
  737. .on('corpus-cliked-on-node', function(e) {
  738. //console.log('theme : corpus-cliked-on-node', e);
  739. _audioPlayer
  740. .emmit('stop-shuffle')
  741. // .setAutoOpenArticle(e.article)
  742. .openDocument(e.target_node);
  743. });
  744. _randomPlayer = new RandomPlayer(e.playlist);
  745. // mainly for articles link
  746. initAjaxLinks();
  747. _$body.attr('corpus-map', 'ready');
  748. }
  749. function openEntree(tid){
  750. if(tid){
  751. closeAllModals();
  752. _$body.removeClass();//.addClass(body_classes.join(' '));
  753. // open entree
  754. if(_corpus_ready){
  755. _$corpus_canvas.trigger({
  756. type:'open-entree',
  757. tid:tid
  758. });
  759. }else{
  760. // else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
  761. $('li.entree[tid="'+tid+'"] a.term-link').addClass('is-active');
  762. }
  763. }
  764. };
  765. function checkVisibleCorpusMapSpace(){
  766. var left_limit = 0, right_limit = 0;
  767. _$row.find('.col').each(function(i,e){
  768. var $col = $(this);
  769. var offset = $col.offset();
  770. console.log('$col', $col);
  771. switch(true){
  772. case $col.is('.float-right'):
  773. right_limit = Math.max(right_limit, Math.abs(offset.left-15-window.innerWidth));
  774. break;
  775. default:
  776. left_limit = Math.max(left_limit, offset.left+$col.width()+15);
  777. break;
  778. }
  779. });
  780. console.log('checkVisibleCorpusMapSpace left_limit:'+left_limit+" right_limit:"+right_limit);
  781. if(_corpus_ready){
  782. _$body.trigger({
  783. type:'visible-space-changed',
  784. left_limit:left_limit,
  785. right_limit:right_limit
  786. });
  787. }else{
  788. _corpus_promise.done(function(){
  789. _$body.trigger({
  790. type:'visible-space-changed',
  791. left_limit:left_limit,
  792. right_limit:right_limit
  793. });
  794. });
  795. }
  796. };
  797. // _ _ _
  798. // /_\ _ _ __| (_)___
  799. // / _ \ || / _` | / _ \
  800. // /_/ \_\_,_\__,_|_\___/
  801. //
  802. // https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement
  803. // https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/samples/gg589528%28v%3dvs.85%29
  804. // https://www.binarytides.com/using-html5-audio-element-javascript/
  805. function AudioPlayer(){
  806. var that = this;
  807. this.fid;
  808. this.audio = new Audio();
  809. // audio events
  810. this.audio_events = ["loadedmetadata","playing","pause","timeupdate","ended","error"]; // ,"canplay"
  811. // UI dom objects
  812. this.$container = $('<div id="audio-player">');
  813. // btns
  814. this.$btns = $('<div>').addClass('btns').appendTo(this.$container);
  815. this.$previous = $('<div>').addClass('previous').appendTo(this.$btns);
  816. this.$playpause = $('<div>').addClass('play-pause').appendTo(this.$btns);
  817. this.$next = $('<div>').addClass('next').appendTo(this.$btns);
  818. // timeline
  819. this.$timelinecont= $('<div>').addClass('time-line-container').appendTo(this.$container);
  820. this.$timeline = $('<div>').addClass('time-line').appendTo(this.$timelinecont);
  821. this.$loader = $('<div>').addClass('loader').appendTo(this.$timeline);
  822. this.$cursor = $('<div>').addClass('cursor').appendTo(this.$timeline);
  823. // time
  824. this.$time = $('<div>').addClass('time').appendTo(this.$container);
  825. this.$currentTime = $('<div>').addClass('current-time').html('00:00').appendTo(this.$time);
  826. this.$duration = $('<div>').addClass('duration').html('00:00').appendTo(this.$time);
  827. // favoris
  828. this.$fav = $('<div>').addClass('favoris').appendTo(this.$container);
  829. // cartel
  830. this.$cartel = $('<div>').addClass('cartel').appendTo(this.$container);
  831. this.scndCartel_visible = 0;
  832. this.cartelSwitchIntervalMS = 7000;
  833. this.cartelSwitchInterval = false;
  834. // hiding
  835. this.hideTimer = false;
  836. this.hideTimeMS = 15000;
  837. // history
  838. this.currentHistoricIndex = null;
  839. this.historic = [];
  840. this.shuffle_is_active = false;
  841. // artciles
  842. this.auto_open_article = false;
  843. // object events
  844. this.event_handlers = {
  845. 'audio-open-document':[],
  846. 'audio-play':[],
  847. 'audio-pause':[],
  848. 'audio-play-next':[],
  849. 'audio-ended':[],
  850. 'stop-shuffle':[]
  851. };
  852. this.init();
  853. };
  854. AudioPlayer.prototype = {
  855. init(){
  856. this.$container_parent = $('header[role="banner"] .region-header');
  857. // append ui to document
  858. this.$container.appendTo(this.$container_parent);
  859. // record timeline width
  860. this.timeline_w = parseInt(this.$timeline.width());
  861. // init seeking
  862. this.$loader.on('click', this.seek.bind(this));
  863. // init audio events
  864. var fn = '';
  865. for (var i = 0; i < this.audio_events.length; i++) {
  866. fn = this.audio_events[i];
  867. // capitalize first letter of event (only cosmetic :p )
  868. fn = 'on'+fn.charAt(0).toUpperCase()+fn.slice(1);
  869. this.audio.addEventListener(
  870. this.audio_events[i],
  871. this[fn].bind(this),
  872. true);
  873. }
  874. // init btns events
  875. this.$previous.on('click', this.playPrevious.bind(this));
  876. this.$playpause.on('click', this.togglePlayPause.bind(this));
  877. this.$next.on('click', this.playNext.bind(this));
  878. },
  879. openDocument(node, caller, historic_index){
  880. console.log('AudioPlayer openDocument', node, caller);
  881. if(typeof node == 'undefined'
  882. || typeof node.nid == 'undefined'
  883. || typeof node.audio_url == 'undefined'){
  884. console.warn('AudioPlayer openDocument() node is malformed', node);
  885. return false;
  886. }
  887. // if we don't come from history popstate
  888. if(typeof caller == 'undefined' || caller != 'popstate'){
  889. this.historic.push(node);
  890. this.currentHistoricIndex = this.historic.length-1;
  891. // this.shuffle_mode = shuffle_mode || false;
  892. // add the document opening to history to be able to share and play audio from any where
  893. if(caller != "history_first_load"){
  894. if(typeof node.document_url == 'undefined'){
  895. console.warn("AudioPlayer openDocument missing document_url, can't push state to history", caller, node);
  896. }else{
  897. var state = {
  898. audio:true,
  899. node:{
  900. nid:node.nid,
  901. audio_url:node.audio_url,
  902. document_url:node.document_url,
  903. title:node.title || null,
  904. },
  905. historic_index : this.currentHistoricIndex,
  906. };
  907. // console.log('AudioPlayer pushstate', state);
  908. var url = node.document_url + (caller == 'random' ? '#random' : '');
  909. history.pushState(state, null, url);
  910. }
  911. }
  912. }else{
  913. // if the call commes from popstate, we update the current position of index
  914. this.currentHistoricIndex = historic_index;
  915. }
  916. if(_$body.is('.path-frontpage') && caller !== 'lastdocs' && !_is_mobile){
  917. closeAllModals();
  918. }
  919. // TODO: update language switcher for document url
  920. // TODO: stop random player if playing from studio
  921. this.emmit('audio-open-document', {caller:caller});
  922. // piwik
  923. // debugger;
  924. if(typeof _paq !== 'undefined'){
  925. // page tracking
  926. // https://matomo.org/blog/2017/02/how-to-track-single-page-websites-using-piwik-analytics/
  927. // _paq.push(['setCustomUrl', state.url]);
  928. // _paq.push(['setDocumentTitle', data.title]);
  929. // _paq.push(['trackPageView']);
  930. // js event
  931. // trackEvent(category, action, [name], [value])
  932. if(typeof node.title != 'undefined'){
  933. _paq.push(['trackEvent', 'Audio', 'play', node.title]);
  934. }
  935. }
  936. this.launch();
  937. },
  938. launch(){
  939. this.clearTimeOutToHide();
  940. this.clearIntervalAutoCartelSwitch();
  941. this.setSRC(this.historic[this.currentHistoricIndex].audio_url);
  942. if(!_is_mobile){
  943. this.loadNode(this.historic[this.currentHistoricIndex].nid);
  944. }
  945. // emmit new playing doc (e.g.: corpus map nowing that audio played from RandomPlayer)
  946. try {
  947. _$corpus_canvas.trigger({
  948. 'type':'audio-node-opened',
  949. 'nid':this.historic[this.currentHistoricIndex].nid
  950. });
  951. } catch (e) {
  952. console.info('AudioPlayer : _$corpus_canvas does not exists, testing promise');
  953. var that = this;
  954. _corpus_promise.done(function(){
  955. _$corpus_canvas.trigger({
  956. 'type':'audio-node-opened',
  957. 'nid':that.historic[that.currentHistoricIndex].nid
  958. });
  959. });
  960. }
  961. this.showHidePreviousBtn();
  962. this.showHideNextBtn();
  963. this.show();
  964. },
  965. openSound(url, title){
  966. this.hide();
  967. this.clearTimeOutToHide();
  968. this.$cartel.html("");
  969. this.setSRC(url);
  970. this.show();
  971. if(typeof _paq !== 'undefined'){
  972. _paq.push(['trackEvent', 'Audio', 'play', url]);
  973. }
  974. },
  975. // audio functions
  976. setSRC(url){
  977. console.log('AudioPlayer setSRC : url', url);
  978. this.audio.src = url;
  979. // need to trigger play right now to prevent safari blocking auto-play
  980. this.play();
  981. },
  982. // audio is ready to play
  983. onLoadedmetadata(){
  984. var rem = parseInt(this.audio.duration, 10),
  985. mins = Math.floor(rem/60,10),
  986. secs = rem - mins*60;
  987. this.$duration.html('<span>'+(mins<10 ? '0':'')+mins+':'+(secs<10 ? '0':'')+secs+'</span>');
  988. this.updateLoadingBar();
  989. },
  990. updateLoadingBar(){
  991. console.log("updateLoadingBar");
  992. // var that = this;
  993. // if (this.audio.readyState === 4){
  994. if(this.audio.buffered.length>0){
  995. // debugger;
  996. this.$loader.css({
  997. 'width':parseInt((100 * this.audio.buffered.end(0) / this.audio.duration), 10)+'%'
  998. });
  999. if( this.audio.buffered.end(0) < this.audio.duration ){
  1000. // loop through this function until file is fully loaded
  1001. window.requestAnimationFrame(this.updateLoadingBar.bind(this));
  1002. }else{
  1003. console.log('Audio fully loaded');
  1004. }
  1005. }else{
  1006. // as audio buffer is not ready, recall updateLoadingBar in next frame
  1007. window.requestAnimationFrame(this.updateLoadingBar.bind(this));
  1008. }
  1009. },
  1010. // onCanplay(){
  1011. // // this.play();
  1012. // },
  1013. onError(){
  1014. console.warn("Audio Error " + this.audio.error.code + "; details: " + this.audio.error.message);
  1015. },
  1016. play(){
  1017. this.clearTimeOutToHide();
  1018. // this.audio.play();
  1019. // Not really needed has we trigger play right after setting the source https://stackoverflow.com/questions/47431439/mp4-video-safari-showing-unhandled-promise-rejection-object-domerror-in-c
  1020. var promise = this.audio.play();
  1021. // console.log('promise', promise);
  1022. if (promise !== undefined) {
  1023. promise.catch(function(error){
  1024. // Auto-play was prevented
  1025. // Show a UI element to let the user manually start playback
  1026. console.warn('autoplay failed, ask for playing', error);
  1027. }).then(function(){
  1028. // Auto-play started
  1029. console.log('autoplay succeed');
  1030. });
  1031. }
  1032. },
  1033. playPrevious(){
  1034. if(this.currentHistoricIndex > 0){
  1035. this.currentHistoricIndex -= 1;
  1036. this.launch();
  1037. // TODO: update history state
  1038. }
  1039. },
  1040. playNext(){
  1041. if(this.currentHistoricIndex < this.historic.length-1){
  1042. this.currentHistoricIndex += 1;
  1043. this.launch();
  1044. // TODO: update history state
  1045. }else{
  1046. this.emmit('audio-play-next');
  1047. }
  1048. },
  1049. togglePlayPause(e){
  1050. if(this.audio.paused){
  1051. // this.audio.play();
  1052. this.play();
  1053. }else{
  1054. // this.audio.pause();
  1055. this.stop();
  1056. }
  1057. },
  1058. stop(){
  1059. // console.log('AudioPlayer stop()');
  1060. // debugger;
  1061. this.audio.pause();
  1062. // don't close player if article or transcript is open
  1063. if(!(_$body.is('.path-node-'+this.historic[this.currentHistoricIndex].nid)
  1064. && (_$body.is('.view-mode-article') || _$body.is('.view-mode-transcript')))){
  1065. this.timeOutToHide();
  1066. }
  1067. },
  1068. seek(e){
  1069. var seek = e.originalEvent.layerX / this.timeline_w * this.audio.duration
  1070. console.log("Audio seeking : seek", seek);
  1071. this.audio.currentTime = seek;
  1072. },
  1073. // audio events
  1074. onPlaying(){
  1075. this.$btns.addClass('is-playing');
  1076. this.emmit('audio-play');
  1077. },
  1078. onPause(){
  1079. this.$btns.removeClass('is-playing');
  1080. this.emmit('audio-pause');
  1081. },
  1082. onTimeupdate(){
  1083. // move cursor
  1084. this.$cursor.css({
  1085. 'left':(this.audio.currentTime/this.audio.duration * this.timeline_w)+"px"
  1086. });
  1087. // update time text display
  1088. var rem = parseInt(this.audio.currentTime, 10),
  1089. mins = Math.floor(rem/60,10),
  1090. secs = rem - mins*60;
  1091. this.$currentTime.html('<span>'+(mins<10 ? '0':'')+mins+':'+(secs<10 ? '0':'')+secs+'</span>');
  1092. },
  1093. onEnded(){
  1094. console.log('AudioPlayer onEnded()');
  1095. this.stop();
  1096. this.emmit('audio-ended');
  1097. },
  1098. // cartel functions
  1099. loadNode(nid){
  1100. this.$cartel.addClass('loading');
  1101. var vm = 'player_cartel';
  1102. var ajax_path = _ajax_settings.entityjson_path+'/node/'+nid+'/'+vm;
  1103. var path = window.location.origin + Drupal.url(ajax_path);
  1104. $.getJSON(path, {})
  1105. .done(this.onNodeLoaded.bind(this))
  1106. .fail(this.onNodeLoadFail.bind(this));
  1107. },
  1108. onNodeLoaded(data){
  1109. console.log('AudioPlayer node loaded', data);
  1110. this.$cartel.html(data.rendered).removeClass('loading');
  1111. _$body.trigger({'type':'new-audio-cartel-loaded'});
  1112. initAjaxLinks();
  1113. // cartel autoswitch
  1114. this.scndCartel_visible = 0;
  1115. this.$cartel.removeClass('second-visible');
  1116. // if second cartel has special info ?
  1117. if (this.$cartel.find('.second-cartel .col-left').children().length > 1
  1118. || this.$cartel.find('.second-cartel').children('.col-right').length){
  1119. // init cartel auto switch
  1120. this.cartelSwitchInterval = setInterval(this.switchCartel.bind(this), this.cartelSwitchIntervalMS);
  1121. }
  1122. // call drupal behaviours (for addtoany)
  1123. Drupal.attachBehaviors(this.$cartel);
  1124. // open automaticly tha article if needed
  1125. this.setAutoOpenArticle();
  1126. if(this.auto_open_article){
  1127. this.$cartel.find('a.link-article').trigger('click');
  1128. this.auto_open_article = false;
  1129. }
  1130. },
  1131. onNodeLoadFail(jqxhr, textStatus, error){
  1132. console.warn('AudioPlayer node load failed', jqxhr.responseText);
  1133. this.$cartel.removeClass('loading').html('');
  1134. },
  1135. setAutoOpenArticle(art){
  1136. this.auto_open_article = $('a.articles-link').is('.is-active');
  1137. return this;
  1138. },
  1139. // global
  1140. show(){
  1141. this.$container_parent.addClass('audio-player-visible');
  1142. this.$container.addClass('visible');
  1143. },
  1144. showHidePreviousBtn(){
  1145. if(this.historic.length > 1 && this.currentHistoricIndex > 0){
  1146. this.$previous.addClass('is-active');
  1147. }else{
  1148. this.$previous.removeClass('is-active');
  1149. }
  1150. },
  1151. showHideNextBtn(){
  1152. if(this.currentHistoricIndex < this.historic.length-1 || this.shuffle_is_active){
  1153. this.$next.addClass('is-active');
  1154. }else{
  1155. this.$next.removeClass('is-active');
  1156. }
  1157. },
  1158. timeOutToHide(){
  1159. // console.log('AudioPlayer timeOutToHide()');
  1160. this.clearTimeOutToHide();
  1161. this.hideTimer = setTimeout(this.hide.bind(this), this.hideTimeMS);
  1162. },
  1163. clearTimeOutToHide(){
  1164. // console.log('AudioPlayer clearTimeOutToHide()',this.hideTimer);
  1165. if(this.hideTimer){
  1166. clearTimeout(this.hideTimer);
  1167. this.hideTimer = false;
  1168. }
  1169. },
  1170. // cartel
  1171. switchCartel(){
  1172. // console.log("switchCartel", this.scndCartel_visible);
  1173. if (this.scndCartel_visible) {
  1174. // return to first cartel
  1175. this.$cartel.removeClass('second-visible');
  1176. this.scndCartel_visible = 0;
  1177. // kill the auto switch after one rotation
  1178. this.clearIntervalAutoCartelSwitch();
  1179. }else{
  1180. // switch to 2nd cartel
  1181. this.$cartel.addClass('second-visible');
  1182. this.scndCartel_visible = 1;
  1183. }
  1184. },
  1185. clearIntervalAutoCartelSwitch(){
  1186. if(this.cartelSwitchInterval){
  1187. clearInterval(this.cartelSwitchInterval);
  1188. this.cartelSwitchInterval = false;
  1189. }
  1190. },
  1191. hide(){
  1192. // console.log('AudioPlayer hide()');
  1193. this.$container_parent.removeClass('audio-player-visible');
  1194. this.$container.removeClass('visible');
  1195. // trigger highlighted node remove on corpus map
  1196. try {
  1197. _$corpus_canvas.trigger('audio-node-closed');
  1198. } catch (e) {
  1199. console.info('AudioPlayer hide() : _$corpus_canvas does not exists');
  1200. }
  1201. },
  1202. deActivateRandom(){
  1203. this.shuffle_is_active = false;
  1204. this.showHideNextBtn();
  1205. },
  1206. // object events
  1207. on(event_name, handler){
  1208. if(typeof this.event_handlers[event_name] == 'undefined'){
  1209. console.warn('AudioPlayer : event '+event_name+' does not exists');
  1210. }
  1211. this.event_handlers[event_name].push(handler);
  1212. return this;
  1213. },
  1214. emmit(event_name, args){
  1215. console.log('AudioPlayer emmit()', event_name, args, this.event_handlers[event_name]);
  1216. // console.log('AudioPlayer emmit() handlers', this.event_handlers[event_name]);
  1217. var handler;
  1218. var args = args || {};
  1219. for (var i = this.event_handlers[event_name].length-1; i >= 0 ; i--) {
  1220. handler = this.event_handlers[event_name][i];
  1221. // console.log('AudioPlayer emmit() loop handler', handler);
  1222. (function(handler, args){
  1223. setTimeout(function(){
  1224. // console.log('AudioPlayer emmit() timeout handler', handler);
  1225. handler(args);
  1226. }, 0);
  1227. }(handler, args));
  1228. }
  1229. return this;
  1230. },
  1231. }
  1232. // ___ _ ___ _
  1233. // | _ \__ _ _ _ __| |___ _ __ | _ \ |__ _ _ _ ___ _ _
  1234. // | / _` | ' \/ _` / _ \ ' \| _/ / _` | || / -_) '_|
  1235. // |_|_\__,_|_||_\__,_\___/_|_|_|_| |_\__,_|\_, \___|_|
  1236. // |__/
  1237. function RandomPlayer(playlist){
  1238. this.active = false;
  1239. this.playlist = playlist;
  1240. this.path = drupalSettings.path.baseUrl+drupalSettings.path.pathPrefix+'#random'
  1241. this.$btn = $('<a>')
  1242. .html('Shuffle')
  1243. .attr('href',this.path)
  1244. .attr('alt', drupalSettings.edlp_corpus.random_link_title)
  1245. .addClass('random-player-btn');
  1246. this.init();
  1247. };
  1248. RandomPlayer.prototype = {
  1249. init(){
  1250. // this.shuffle();
  1251. $('<div>')
  1252. .addClass('block random-player')
  1253. .append(this.$btn)
  1254. // .insertAfter('#block-userlogin, #block-studiolinkblock');
  1255. .prependTo('.region-footer-right');
  1256. // events
  1257. this.$btn.on('click', this.toggleActive.bind(this));
  1258. // attach an event on AudioPlayer
  1259. _audioPlayer
  1260. .on('audio-play-next', this.onAudioPlayNext.bind(this))
  1261. .on('audio-ended', this.onAudioPlayerEnded.bind(this))
  1262. // .on('audio-ended', function(e){
  1263. // console.log('RandomPlayer, audio-ended', e);
  1264. // })
  1265. .on('stop-shuffle', this.stop.bind(this));
  1266. _$corpus_canvas
  1267. .on('update-random-playlist', this.updatePlaylist.bind(this));
  1268. // provide a link to auto start random player
  1269. if(window.location.hash == '#random'){
  1270. this.start();
  1271. // window.location.hash = '';
  1272. }
  1273. },
  1274. updatePlaylist(e){
  1275. // debugger;
  1276. this.playlist = e.playlist;
  1277. this.shuffle();
  1278. },
  1279. shuffle(){
  1280. var tempPLaylist = [];
  1281. for (var i = this.playlist.length-1; i >= 0 ; i--) {
  1282. tempPLaylist.push(this.playlist[i]);
  1283. }
  1284. this.shuffledPlaylist = [];
  1285. while(tempPLaylist.length > 0){
  1286. var r = Math.floor(Math.random() * tempPLaylist.length);
  1287. this.shuffledPlaylist.push(tempPLaylist.splice(r,1)[0]);
  1288. }
  1289. //console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
  1290. },
  1291. toggleActive(e){
  1292. e.preventDefault();
  1293. if (this.active) {
  1294. this.stop();
  1295. }else{
  1296. this.start();
  1297. }
  1298. return false;
  1299. },
  1300. start(){
  1301. this.active = _audioPlayer.shuffle_is_active = true;
  1302. this.$btn.addClass('is-active');
  1303. this.shuffle();
  1304. this.next();
  1305. // piwik
  1306. if(typeof _paq !== 'undefined'){
  1307. // trackEvent(category, action, [name], [value])
  1308. _paq.push(['trackEvent', 'RandomPlayer', 'start']);
  1309. }
  1310. },
  1311. stop(){
  1312. this.active = false;
  1313. this.$btn.removeClass('is-active');
  1314. // stop audio player
  1315. // _audioPlayer.stop();
  1316. // remove hash
  1317. history.replaceState(history.state, null, window.location.pathname);
  1318. // tell to AudioPlayer to deactivate netx btn
  1319. _audioPlayer.deActivateRandom();
  1320. if(typeof _paq !== 'undefined'){
  1321. // trackEvent(category, action, [name], [value])
  1322. _paq.push(['trackEvent', 'RandomPlayer', 'stop']);
  1323. }
  1324. },
  1325. next(){
  1326. console.log('RandomPlayer next', this.active, this.shuffledPlaylist.length);
  1327. if(this.active && this.shuffledPlaylist.length > 0)
  1328. _audioPlayer.openDocument(this.shuffledPlaylist.splice(0,1)[0], 'random');
  1329. },
  1330. onAudioPlayNext(){
  1331. console.log('RandomPlayer : onAudioPlayNext()');
  1332. if(this.active){
  1333. this.next();
  1334. }
  1335. },
  1336. onAudioPlayerEnded(){
  1337. console.log('RandomPlayer : onAudioPlayerEnded()');
  1338. if(this.active){
  1339. this.next();
  1340. }
  1341. }
  1342. };
  1343. // ___ ___ _
  1344. // / __|___ _ __ _ __ ___| _ \ |__ _ _ _ ___ _ _
  1345. // | (__/ _ \ ' \| '_ \/ _ \ _/ / _` | || / -_) '_|
  1346. // \___\___/_|_|_| .__/\___/_| |_\__,_|\_, \___|_|
  1347. // |_| |__/
  1348. function CompoPlayer(){
  1349. this.active = false;
  1350. this.playing = false;
  1351. this.paused = false;
  1352. this.playlist = [];
  1353. this.current_index = 0;
  1354. this.$composer = null;
  1355. this.$compo = null;
  1356. this.$controls = null;
  1357. this.init();
  1358. };
  1359. CompoPlayer.prototype = {
  1360. init(){
  1361. // console.log('CompoPlayer init()');
  1362. // attach an event on AudioPlayer
  1363. _audioPlayer
  1364. .on('audio-open-document', this.onAudioOpenDocument.bind(this))
  1365. .on('audio-play', this.onAudioPlayerPlay.bind(this))
  1366. .on('audio-pause', this.onAudioPlayerPause.bind(this))
  1367. .on('audio-ended', this.onAudioPlayerEnded.bind(this));
  1368. // .on('audio-play-next', this.onAudioPlayNext.bind(this));
  1369. // this.newCompo();
  1370. },
  1371. newCompo(){
  1372. //console.log('CompoPlayer newCompo()');
  1373. // this.$compo = $('.composition_ui .composer .composition');
  1374. this.initControls();
  1375. },
  1376. initControls(){
  1377. //console.log('CompoPlayer initControls()');
  1378. this.$composer = $('.composition_ui .composer');
  1379. this.$compo = $('.composition_ui .composer .composition');
  1380. this.$controls = $('.composition_ui .composer .compo-player-controls');
  1381. if(!this.$controls.is('.ready') && this.$compo){
  1382. this.$previous = $('<div>').addClass('previous')
  1383. .on('click', this.prev.bind(this))
  1384. .appendTo(this.$controls);
  1385. this.$playpause = $('<div>').addClass('play-pause')
  1386. .on('click', this.togglePlayPause.bind(this))
  1387. .appendTo(this.$controls);
  1388. this.$next = $('<div>').addClass('next')
  1389. .on('click', this.next.bind(this))
  1390. .appendTo(this.$controls);
  1391. this.$controls.addClass('ready');
  1392. this.refresh();
  1393. this.active = true;
  1394. // this.newCompo();
  1395. }
  1396. },
  1397. refresh(){
  1398. // console.log('CompoPlayer refresh(), this', this);
  1399. this.stop();
  1400. // load new playlist
  1401. this.playlist = [];
  1402. var that = this;
  1403. $('.field--name-documents .field__item',this.$compo).each(function(i,el){
  1404. var $link = $('a.audio-link',this);
  1405. that.playlist.push({
  1406. item:$(this),
  1407. audio_url:$link.attr("audio_url"),
  1408. nid:$link.attr("nid"),
  1409. });
  1410. });
  1411. this.showHideControls();
  1412. },
  1413. togglePlayPause(){
  1414. // console.log('CompoPlayer togglePlayPause');
  1415. if (this.playing && !this.paused) {
  1416. this.pause();
  1417. }else{
  1418. if(this.playing && this.paused){
  1419. this.play();
  1420. }else{
  1421. this.start();
  1422. }
  1423. }
  1424. },
  1425. start(){
  1426. //console.log('start');
  1427. // console.log('CompoPlayer start()');
  1428. this.playing = true;
  1429. this.play();
  1430. },
  1431. play(){
  1432. // console.log('play');
  1433. if(this.paused){
  1434. this.paused = false;
  1435. _audioPlayer.play();
  1436. }else{
  1437. // _audioPlayer;
  1438. _audioPlayer.emmit('stop-shuffle').openDocument(this.playlist[this.current_index], this);
  1439. // TODO: stop random player
  1440. }
  1441. this.setActiveItem().showHideControls();
  1442. },
  1443. pause(){
  1444. //console.log('pause');
  1445. this.paused = true;
  1446. this.showHideControls();
  1447. _audioPlayer.stop();
  1448. },
  1449. next(){
  1450. // console.log('CompoPlayer next()');
  1451. if(this.playing){
  1452. this.current_index += 1;
  1453. if(this.current_index < this.playlist.length){
  1454. this.play();
  1455. }else{
  1456. this.stop();
  1457. }
  1458. }
  1459. },
  1460. prev(){
  1461. // console.log('CompoPlayer prev()');
  1462. if(this.playing){
  1463. this.current_index -= 1;
  1464. if(this.current_index >= 0){
  1465. this.play();
  1466. }else{
  1467. this.stop();
  1468. }
  1469. }
  1470. },
  1471. stop(){
  1472. if(this.playing){
  1473. _audioPlayer.stop();
  1474. }
  1475. this.reset();
  1476. },
  1477. reset(){
  1478. this.playing = false;
  1479. this.paused = false;
  1480. this.resetIndex();
  1481. },
  1482. resetIndex(){
  1483. this.current_index = 0;
  1484. this.showHideControls().resetActiveItems();
  1485. },
  1486. setActiveItem(){
  1487. this.resetActiveItems();
  1488. if(this.playing && this.current_index >= 0){
  1489. this.playlist[this.current_index].item.addClass('is-active');
  1490. }
  1491. // this call shoud not be here
  1492. this.showHideControls();
  1493. return this;
  1494. },
  1495. resetActiveItems(){
  1496. for (var n = 0; n < this.playlist.length; n++) {
  1497. // console.log('node',node);
  1498. this.playlist[n].item.removeClass('is-active');
  1499. }
  1500. return this;
  1501. },
  1502. showHideControls(){
  1503. // console.log('CompoPlayer showHideNextBtn(), playing:'+this.playing+', paused:'+this.paused);
  1504. // global playing
  1505. if(this.$controls){
  1506. if(this.playing && !this.paused){
  1507. this.$controls.addClass('is-playing');
  1508. }else{
  1509. this.$controls.removeClass('is-playing');
  1510. }
  1511. }
  1512. // playpause
  1513. if(this.$playpause){
  1514. if(this.playlist.length > 0){
  1515. this.$playpause.addClass('is-active');
  1516. }else{
  1517. this.$playpause.removeClass('is-active');
  1518. }
  1519. }
  1520. // next
  1521. if(this.$next){
  1522. if(this.playing && this.playlist.length > 1 && this.current_index < this.playlist.length -1){
  1523. this.$next.addClass('is-active');
  1524. }else{
  1525. this.$next.removeClass('is-active');
  1526. }
  1527. }
  1528. // previous
  1529. if(this.$previous){
  1530. if(this.playing && this.playlist.length > 1 && this.current_index > 0){
  1531. this.$previous.addClass('is-active');
  1532. }else{
  1533. this.$previous.removeClass('is-active');
  1534. }
  1535. }
  1536. return this;
  1537. },
  1538. deactivate(){
  1539. this.stop();
  1540. this.active = false;
  1541. },
  1542. // _audioPlayer events
  1543. onAudioOpenDocument(args){
  1544. if(args.caller !== this){
  1545. // console.log('CompoPlayer onAudioOpenDocument() called by other');
  1546. this.reset();
  1547. }
  1548. // else{
  1549. // // console.log('CompoPlayer onAudioOpenDocument() self calling');
  1550. // }
  1551. },
  1552. onAudioPlayerPlay(){
  1553. if(this.playing && this.paused){
  1554. this.paused = false;
  1555. this.showHideControls();
  1556. }
  1557. },
  1558. onAudioPlayerPause(){
  1559. if(this.playing && !this.paused){
  1560. this.paused = true;
  1561. this.showHideControls();
  1562. }
  1563. },
  1564. onAudioPlayerEnded(){
  1565. if(this.playing){
  1566. this.next();
  1567. }
  1568. },
  1569. // onAudioPlayNext(){
  1570. // this.next();
  1571. // }
  1572. };
  1573. // ___ _ _
  1574. // / __|_ _(_)__| |
  1575. // | (_ | '_| / _` |
  1576. // \___|_| |_\__,_|
  1577. function initGrid(){
  1578. console.log('theme : initGrid');
  1579. if(!_is_mobile){
  1580. checkGridBlockHeight();
  1581. _$row.find('.col').addClass('offfield');
  1582. }
  1583. if(false){
  1584. var $grid = $('.grid',_$row).masonry({
  1585. itemSelector:'.col',
  1586. columnWidth:'.col-2',
  1587. containerStyle: null,
  1588. resizeContainer:false,
  1589. // horizontalOrder: true,
  1590. transitionDuration:0,//'0.2s',
  1591. // stagger:30,
  1592. // disable initial layout
  1593. // initLayout: false,
  1594. });
  1595. // layout Masonry after each image loads
  1596. $grid.imagesLoaded().progress( function() {
  1597. $grid.masonry('layout');
  1598. });
  1599. $grid.imagesLoaded(function(){
  1600. $grid.masonry('layout');
  1601. // checkProductionBlockVisible();
  1602. });
  1603. // bind event
  1604. // $grid.masonry( 'on', 'layoutComplete', function() {
  1605. // console.log('layout is complete');
  1606. // });
  1607. $grid.on('layoutComplete', checkGridBlockVisible);
  1608. }else{
  1609. // setTimeout(checkGridBlockVisible, 100);
  1610. if(!_is_mobile){
  1611. checkGridBlockVisible();
  1612. }
  1613. }
  1614. };
  1615. function checkGridBlockHeight(){
  1616. // console.log('checkGridBlockHeight');
  1617. // if(_is_mobile) return;
  1618. var $r_h = _$row.height();
  1619. var $this;
  1620. // console.log($r_h);
  1621. $('.grid .col', _$row).each(function(i,e){
  1622. $this = $(this);
  1623. if(!$this.is('[init-height]')){
  1624. $this.attr('init-height', $this.outerHeight())
  1625. }
  1626. // console.log($(this).height(), $(this).innerHeight(), $(this).outerHeight());
  1627. // if($this.height() > $r_h){
  1628. // $this.height($r_h);
  1629. // }else{
  1630. // $this.height('auto');
  1631. // }
  1632. $this.height(Math.min($this.attr('init-height'), _$row.height()));
  1633. });
  1634. };
  1635. function checkGridBlockVisible(){
  1636. // console.log('checkGridBlockVisible');
  1637. // if(_is_mobile) return;
  1638. var $r_h = _$row.height();
  1639. var $this,pos;
  1640. $('.grid .col', _$row).each(function(i,e){
  1641. // $(this).on('load',function(event){
  1642. $this = $(this);
  1643. pos = $this.position();
  1644. // console.log(pos.top, $this.height(), pos.top+$this.height(), $r_h, $this);
  1645. if(pos.top+$this.height() <= $r_h){
  1646. $this.removeClass('offfield');
  1647. }else{
  1648. $this.addClass('offfield');
  1649. }
  1650. // });
  1651. });
  1652. // for (var i in items) {
  1653. // if(!items[i].isTransitioning){
  1654. // console.log('y+outerHeight', items[i].position.y+items[i].size.outerHeight);
  1655. // console.log('_$row.height()', _$row.height());
  1656. // if(items[i].position.y+items[i].size.outerHeight < _$row.height()){
  1657. // $(items[i].element).removeClass('offfield');
  1658. // }else{
  1659. // // $(items[i].element).addClass('offfield');
  1660. // }
  1661. // }
  1662. // }
  1663. }
  1664. // ___ _ _ _
  1665. // | _ \_ _ ___ __| |_ _ __| |_(_)___ _ _ ___
  1666. // | _/ '_/ _ \/ _` | || / _| _| / _ \ ' \(_-<
  1667. // |_| |_| \___/\__,_|\_,_\__|\__|_\___/_||_/__/
  1668. // function initProductions(){
  1669. // console.log('theme : initProductions');
  1670. //
  1671. // // _$row.find('.col').addClass('offfield');
  1672. // var $grid = $('.grid',_$row).masonry({
  1673. // itemSelector:'.col',
  1674. // columnWidth:'.col-2',
  1675. // containerStyle: null,
  1676. // resizeContainer:false,
  1677. // // horizontalOrder: true,
  1678. // transitionDuration:0,//'0.2s',
  1679. // // stagger:30,
  1680. // // disable initial layout
  1681. // // initLayout: false,
  1682. // });
  1683. //
  1684. // // layout Masonry after each image loads
  1685. // $grid.imagesLoaded().progress( function() {
  1686. // $grid.masonry('layout');
  1687. // });
  1688. //
  1689. // $grid.imagesLoaded(function(){
  1690. // $grid.masonry('layout');
  1691. // // checkProductionBlockVisible();
  1692. // });
  1693. //
  1694. // // bind event
  1695. // // $grid.masonry( 'on', 'layoutComplete', function() {
  1696. // // console.log('layout is complete');
  1697. // // });
  1698. // // $grid.on('layoutComplete', checkProductionBlockVisible);
  1699. // };
  1700. // ___ _ _ _ _
  1701. // / __|___| | |___ __| |_(_)___ _ _
  1702. // | (__/ _ \ | / -_) _| _| / _ \ ' \
  1703. // \___\___/_|_\___\__|\__|_\___/_||_|
  1704. // mobile version of collection
  1705. function initCollectionNav(){
  1706. console.log('initCollectionNav');
  1707. // taxonomy-term.vocabulary-entrees.home_mobile
  1708. $('.field--name-field-notice, .index', '.taxonomy-term.vocabulary-entrees.home_mobile')
  1709. .addClass('closed');
  1710. $('.field--name-field-notice>.field__label', '.taxonomy-term.vocabulary-entrees.home_mobile')
  1711. .on('click', onClickCollectionNotice);
  1712. $('.index>.field__label', '.taxonomy-term.vocabulary-entrees.home_mobile')
  1713. .on('click', onClickCollectionIndex);
  1714. };
  1715. function onClickCollectionNotice(e){
  1716. // console.log('onClickCollectionNotice');
  1717. // var $part = $(this).parent();//parents('.taxonomy-term');
  1718. toggleEntreeOpening($(this).parent(), 'notice');
  1719. };
  1720. function onClickCollectionIndex(e){
  1721. // console.log('onClickCollectionIndex');
  1722. // var $part = $(this).parent();//parents('.taxonomy-term');
  1723. toggleEntreeOpening($(this).parent(), 'index');
  1724. };
  1725. function toggleEntreeOpening($e, part){
  1726. $e.toggleClass('closed')
  1727. .parents('.taxonomy-term.vocabulary-entrees.home_mobile').toggleClass(part+'-opened');
  1728. }
  1729. // ___ _
  1730. // / __| ___ __ _ _ _ __| |_
  1731. // \__ \/ -_) _` | '_/ _| ' \
  1732. // |___/\___\__,_|_| \__|_||_|
  1733. function initSearch(){
  1734. // if($('#edit-entries input:checked', '#edlp-search-form').length){
  1735. // $('#edit-entries--wrapper', '#edlp-search-form').toggleClass('opened');
  1736. // }
  1737. $('#edit-entries--wrapper legend', '#edlp-search-form').on('click', function(){
  1738. $(this).parent().toggleClass('opened');
  1739. });
  1740. };
  1741. // ___ _ _ _
  1742. // | __|_ _ _ _ ___ __ _(_)__| |_ _ _ ___ _ __ ___ _ _| |_
  1743. // | _|| ' \| '_/ -_) _` | (_-< _| '_/ -_) ' \/ -_) ' \ _|
  1744. // |___|_||_|_| \___\__, |_/__/\__|_| \___|_|_|_\___|_||_\__|
  1745. // |___/
  1746. function initEnregistrementTranscript(){
  1747. console.log('initEnregistrementTranscript');
  1748. var $node = _$row.find('article.node--type-enregistrement.node--view-mode-transcript');
  1749. var $nav = $('<nav>').prependTo($node);
  1750. $node.find('.field--name-field-transcript-vo').addClass('visible').find('.field__label')
  1751. .clone().appendTo($nav).addClass('is-active')
  1752. .attr('field_target', '.field--name-field-transcript-vo');
  1753. $node.find('.field--name-field-transcript-trad').find('.field__label')
  1754. .clone().appendTo($nav)
  1755. .attr('field_target', '.field--name-field-transcript-trad');
  1756. $nav.find('.field__label').on('click', function(){
  1757. var $this = $(this).addClass('is-active');
  1758. $this.siblings('.is-active').removeClass('is-active');
  1759. $this.parents('article.node').find('.field.visible').removeClass('visible');
  1760. $this.parents('article.node').find($this.attr('field_target')).addClass('visible');
  1761. });
  1762. };
  1763. // ___ _ ___
  1764. // | __| _ ___ _ _| |_| _ \__ _ __ _ ___
  1765. // | _| '_/ _ \ ' \ _| _/ _` / _` / -_)
  1766. // |_||_| \___/_||_\__|_| \__,_\__, \___|
  1767. // |___/
  1768. function backToFrontPage(pop_state){
  1769. console.log('backToFrontPage', pop_state);
  1770. closeAllModals();
  1771. // assume we are going back to front page
  1772. $('body').removeClass().addClass('path-frontpage');
  1773. $('a[data-drupal-link-system-path="<front>"]').addClass('is-active');
  1774. // close entrees
  1775. if(_corpus_ready){
  1776. _$corpus_canvas.trigger({'type':'close-all-entree'});
  1777. _$corpus_canvas.trigger({'type':'scramble-collection'});
  1778. }
  1779. if(typeof pop_state == "undefined" || !pop_state){
  1780. console.log('backToFrontPage push state');
  1781. history.pushState({home:true}, null, drupalSettings.path.baseUrl+drupalSettings.path.currentLanguage);
  1782. }
  1783. }
  1784. function initHome(){
  1785. addCloseModalBtnToCols();
  1786. return;
  1787. console.log('theme : initHome');
  1788. var $grid = $('.grid',_$row).masonry({
  1789. itemSelector:'.col',
  1790. columnWidth:'.col-2',
  1791. horizontalOrder: true,
  1792. containerStyle: null,
  1793. // disable initial layout
  1794. // initLayout: false,
  1795. });
  1796. // bind event
  1797. // $grid.masonry( 'on', 'layoutComplete', function() {
  1798. // console.log('layout is complete');
  1799. // });
  1800. // layout Masonry after each image loads
  1801. $grid.imagesLoaded().progress( function() {
  1802. $grid.masonry('layout');
  1803. });
  1804. $grid.imagesLoaded(function(){
  1805. $grid.masonry('layout');
  1806. });
  1807. }
  1808. // __ __ _ _
  1809. // | \/ |___ __| |__ _| |___
  1810. // | |\/| / _ \/ _` / _` | (_-<
  1811. // |_| |_\___/\__,_\__,_|_/__/
  1812. function closeAllModals(){
  1813. //console.log('theme : closeAllModals');
  1814. // TODO: animate the remove
  1815. _$row.html('');
  1816. _$ajaxLinks.removeClass('is-active');
  1817. _$body.trigger({'type':'all-modal-closed'});
  1818. // checkRowEmpty();
  1819. };
  1820. function checkRowEmpty(){
  1821. console.log('checkRowEmpty');
  1822. // if row is empty and we are not in productions or entree notice|index call closeAllModals()
  1823. if(!$('.col', _$row).length){
  1824. if(!_$body.is('.entity-type-taxonomy_term.bundle-entrees')){
  1825. if(!_$body.is('.entity-type-node.bundle-page')){
  1826. // we weren't on production or entree, so go back to front page
  1827. // debugger;
  1828. if(_$body.is('.bundle-enregistrement.view-mode-article')
  1829. && $('a.articles-link').is('.is-active')){
  1830. console.log('Closing article while article index is active');
  1831. // if node article and articles is active, reload index
  1832. $('a.articles-link').removeClass('is-active').trigger('click');
  1833. }else{
  1834. backToFrontPage();
  1835. }
  1836. // if(!$('a.articles-link').is('.is-active')){
  1837. // // don't go back to front page if articles filter is on
  1838. // backToFrontPage();
  1839. // }else{
  1840. // }
  1841. }else{
  1842. // if we were on production page just scramble collection in case of map was filtered
  1843. if(_corpus_ready){
  1844. _$corpus_canvas.trigger({'type':'scramble-collection'});
  1845. }
  1846. // reload production home
  1847. $('a[data-drupal-link-system-path="productions"]', '#block-mainnavigation')
  1848. .removeClass('is-active').trigger('click');
  1849. }
  1850. }else{
  1851. // remove is-active class from index or notice entree links
  1852. $('.entree-content a.is-active').removeClass('is-active');
  1853. // TODO: remove the hash index or notice
  1854. }
  1855. }
  1856. };
  1857. init();
  1858. } // end EdlpTheme()
  1859. $(document).ready(function($) {
  1860. if(drupalSettings.path.isFront){
  1861. var edlptheme = new EdlpTheme();
  1862. }else{
  1863. $('body').attr('booted', 'booted');
  1864. }
  1865. });
  1866. })(jQuery, Drupal, drupalSettings);