main.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. (function($) {
  2. EdlpTheme = function(){
  3. var _$body = $('body');
  4. var _is_front = _$body.is('.path-frontpage');
  5. var _$corpus_map;
  6. var _$content_container = $('.layout-container>main>.layout-content');
  7. var _$ajaxLinks;
  8. function init(){
  9. console.log("EdlpTheme init()");
  10. _$body.on('corpus-map-ready', onCorpusMapReady);
  11. initScrollbars();
  12. initAjaxLinks();
  13. if (_$body.is('.path-productions')) {
  14. initProductions();
  15. }
  16. };
  17. // ___ _ _ ___
  18. // / __| __ _ _ ___| | | _ ) __ _ _ _ ___
  19. // \__ \/ _| '_/ _ \ | | _ \/ _` | '_(_-<
  20. // |___/\__|_| \___/_|_|___/\__,_|_| /__/
  21. function initScrollbars(){
  22. console.log("initScrollbars");
  23. $('.os-scroll').overlayScrollbars({
  24. overflowBehavior:{x:'h',y:'scroll'}
  25. });
  26. };
  27. // _ _
  28. // /_\ (_)__ ___ __
  29. // / _ \ | / _` \ \ /
  30. // /_/ \_\/ \__,_/_\_\
  31. // |__/
  32. // TODO: add url hash nav
  33. // TODO: implement history.js
  34. function initAjaxLinks(){
  35. console.log('initAjaxLinks');
  36. $('a', '#block-mainnavigation, #block-footer.menu--footer').addClass('ajax-link');
  37. _$ajaxLinks = $('.ajax-link')
  38. .each(function(i,e){
  39. var $this = $(this);
  40. var sys_path = $this.attr('data-drupal-link-system-path');
  41. if(sys_path){
  42. // convert node link to edlp_ajax_node module links
  43. m = sys_path.match(/^\/?(node\/\d+)$/g);
  44. if(m) $this.attr('data-drupal-link-system-path', 'edlp/'+m[0]);
  45. }
  46. })
  47. .on('click', onClickAjaxLink);
  48. ;
  49. };
  50. function onClickAjaxLink(e){
  51. e.preventDefault();
  52. var $link = $(this);
  53. if($link.is('.is-active'))
  54. return false;
  55. var sys_path = $(this).attr('data-drupal-link-system-path');
  56. if(sys_path == '<front>'){
  57. closeAllModals();
  58. return false;
  59. }
  60. var path = window.location.origin + drupalSettings.path.baseUrl + sys_path +'/ajax';
  61. closeAllModals();
  62. _$body.addClass('ajax-loading');
  63. $link.addClass('ajax-loading');
  64. $.getJSON(path, {}, function(data){
  65. onAjaxLinkLoaded(data, $link, sys_path);
  66. });
  67. return false;
  68. };
  69. function onAjaxLinkLoaded(data, $link, sys_path){
  70. console.log('ajax link loaded : data', data);
  71. _$content_container.html(data.rendered);
  72. _$body.removeClass('ajax-loading');
  73. // add body class for currently loaded content
  74. _$body.removeClass().addClass('path-'+sys_path.replace(/\//g, '-'));
  75. // id node add a generic path-node class to body
  76. m = sys_path.match(/^\/?(edlp\/node\/\d+)$/g);
  77. if(m){
  78. _$body.addClass('path-edlp-node');
  79. }
  80. _$ajaxLinks.removeClass('is-active');
  81. $link.removeClass('ajax-loading').addClass('is-active');
  82. initScrollbars();
  83. console.log(sys_path);
  84. if(sys_path == "productions"){
  85. window.requestAnimationFrame(initProductions);
  86. }
  87. };
  88. // ___
  89. // / __|___ _ _ _ __ _ _ ___
  90. // | (__/ _ \ '_| '_ \ || (_-<
  91. // \___\___/_| | .__/\_,_/__/
  92. // |_|
  93. function onCorpusMapReady(e){
  94. console.log('theme : onCorpusReady');
  95. _$corpus_map = $('canvas#corpus-map');
  96. _$corpus_map.on('corpus-cliked-on-map', function(e) {
  97. console.log('theme : corpus-cliked-on-map');
  98. closeAllModals();
  99. });
  100. }
  101. // ___ _ _ _
  102. // | _ \_ _ ___ __| |_ _ __| |_(_)___ _ _ ___
  103. // | _/ '_/ _ \/ _` | || / _| _| / _ \ ' \(_-<
  104. // |_| |_| \___/\__,_|\_,_\__|\__|_\___/_||_/__/
  105. function initProductions(){
  106. console.log('theme : initProductions');
  107. var $grid = $('.row', _$content_container).masonry({
  108. itemSelector:'.col',
  109. columnWidth:'.col-2'
  110. });
  111. // layout Masonry after each image loads
  112. $grid.imagesLoaded().progress( function() {
  113. $grid.masonry('layout');
  114. });
  115. // var $grid = $('.row', _$content_container).imagesLoaded( function() {
  116. // // init Masonry after all images have loaded
  117. // $grid.masonry({
  118. // itemSelector:'.col',
  119. // columnWidth:'.col-2'
  120. // });
  121. // });
  122. };
  123. // __ __ _ _
  124. // | \/ |___ __| |__ _| |___
  125. // | |\/| / _ \/ _` / _` | (_-<
  126. // |_| |_\___/\__,_\__,_|_/__/
  127. function closeAllModals(){
  128. console.log('theme : closeAllModals');
  129. // TODO: animate the remove
  130. _$content_container.html('');
  131. _$ajaxLinks.removeClass('is-active');
  132. $('a[data-drupal-link-system-path="<front>"]').addClass('is-active');
  133. };
  134. init();
  135. } // end EdlpTheme()
  136. $(document).ready(function($) {
  137. var edlptheme = new EdlpTheme();
  138. });
  139. })(jQuery);