materio_search_api_ajax.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  1. // @codekit-prepend "gui.js"
  2. (function($) {
  3. MaterioSearchApiAjax = function(){
  4. var _isloadingresults = false;
  5. var _$content = $('#content');
  6. // TODO: define $content by module settings
  7. /**
  8. * init()
  9. */
  10. function init(){
  11. trace('init MaterioSearchApiAjax');
  12. initSearchAjax();
  13. initViewMode();
  14. };
  15. /**
  16. * searchAjax
  17. */
  18. function initSearchAjax(){
  19. // trace('initSearchAjax');
  20. $('#materio-search-api-search-form').bind('submit', function(event) {
  21. // trace('search submited', event);
  22. var $this = $(this);
  23. setTimeout(function(){
  24. loadResults(getSearchKeys());
  25. },10);
  26. return false;
  27. });
  28. // /!\ AUTOCOMPLETE SELECT EVENT need a patch http://drupal.org/node/365241#comment-5374686
  29. $("#edit-searchfield").bind('autocompleteSelect', function(event) {
  30. $(this).parents('.form').trigger('submit');
  31. });
  32. $(document)
  33. .bind('init-scroller-pager', onInitScrollerPager)
  34. .bind('load-scroller-pager', onLoadScrollerPager)
  35. .bind('view-mode-changed', onViewModeChanged)
  36. .bind('history-state-change', onHistoryStateChange);
  37. // trigger updated event for direct html loading
  38. setTimeout(function(){
  39. var event = jQuery.Event('resultschanged');
  40. if(isExplore())
  41. event.container = '#content .search-results';
  42. if(isActuality())
  43. event.container = '#content .actuality-items';
  44. $.event.trigger(event);
  45. }, 10);
  46. };
  47. function getSearchKeys(){
  48. return $('#materio-search-api-search-form').find('input[name*="searchfield"]').val();
  49. };
  50. function loadResults(keys){
  51. // trace('keys', keys);
  52. if(keys !== undefined){
  53. keys = keys.replace('/', ' ');
  54. var types = {};
  55. $('#edit-bundles-filter', '#materio-search-api-search-form').find('input[type*="checkbox"]').each(function(i){
  56. $this = $(this);
  57. // if ( $this.attr('checked') ) {
  58. types[$this.val()] = $this.attr('checked');
  59. // }
  60. });
  61. trace('types', types);
  62. if(!_isloadingresults){
  63. $.event.trigger('loading-content');
  64. _isloadingresults = true;
  65. $('#materio-search-api-search-form').addClass('loading');
  66. // TODO: record ajax path in a variable from materio_search_api_ajax_init
  67. $.getJSON(Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/search/'+keys,
  68. {'types':types},
  69. function(json){
  70. trace('json', json);
  71. $.event.trigger('loaded-content');
  72. _isloadingresults = false;
  73. $('#materio-search-api-search-form').removeClass('loading');
  74. var path = Drupal.settings.basePath + Drupal.settings.pathPrefix + json.search_path + '/' + json.keys;
  75. var event = jQuery.Event('new-history-page');
  76. event.path = path;
  77. event.title = json.title;
  78. event.content = json.return;
  79. $.event.trigger(event);
  80. for (language in Drupal.settings.materio_search_api_ajax.languages) {
  81. var l = Drupal.settings.materio_search_api_ajax.languages[language];
  82. $('#block-locale-language li.'+language+' a').attr('href', Drupal.settings.basePath + l.prefix+'/' + json.search_path + '/' + json.keys)
  83. };
  84. changeContent(json);
  85. });
  86. }
  87. }
  88. };
  89. function loadActuality(){
  90. if(!_isloadingresults){
  91. $.event.trigger('loading-content');
  92. _isloadingresults = true;
  93. $('#materio-search-api-search-form').addClass('loading');
  94. var url = Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/actuality';
  95. $.getJSON(url,
  96. function(json){
  97. trace('json', json);
  98. $.event.trigger('resultsloaded');
  99. _isloadingresults = false;
  100. $('#materio-search-api-search-form').removeClass('loading');
  101. changeContent(json);
  102. });
  103. }
  104. };
  105. function changeContent(json){
  106. trace('MaterioSearchApiAjax changeContent | json', json);
  107. if(json.return){
  108. $.event.trigger('loaded-content');
  109. $('.inner-content',_$content).html(json.return);
  110. triggerContentChanged();
  111. }else{
  112. trace('no results');
  113. }
  114. };
  115. function triggerContentChanged(){
  116. var event = jQuery.Event('resultschanged');
  117. event.container = '#content .search-results, #content .actuality-items';
  118. // event.title = json.title;
  119. $.event.trigger(event);
  120. };
  121. function onInitScrollerPager(event){
  122. if(isActuality() || isExplore())
  123. event.pager.hide();
  124. };
  125. function onLoadScrollerPager(event){
  126. if (isExplore())
  127. loadNextResultsPage(event.href);
  128. if(isActuality())
  129. loadNextActualityPage(event.href);
  130. };
  131. function loadNextResultsPage(href){
  132. // trace('loadNextResultsPage');
  133. if(!_isloadingresults){
  134. var keys = href.match(/explore\/([^\/|\?]+)/);
  135. var page = href.match(/\?page=([0-9]+)/);
  136. var url = Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/search/'+keys[1]+'/'+page[1];
  137. loadNextPage(url, $('.materiobase-results', _$content), '.search-results');
  138. }
  139. };
  140. function loadNextActualityPage(href){
  141. // trace('loadNextActualityPage');
  142. if(!_isloadingresults){
  143. var page = href.match(/\?page=([0-9]+)/);
  144. var url = Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/actuality/'+page[1];
  145. loadNextPage(url, $('.materiobase-actuality', _$content), '.actuality-items');
  146. }
  147. };
  148. function loadNextPage(url, $container, target){
  149. trace('loadNextPage');
  150. _isloadingresults = true;
  151. $container.addClass('loading');
  152. $.getJSON(url, function(json){
  153. trace('json', json);
  154. _isloadingresults = false;
  155. $container.removeClass('loading');
  156. addNextpage(json, target);
  157. });
  158. };
  159. function addNextpage(json, container_class){
  160. var $newcontent = $(json.return),
  161. $newitems = $(container_class, $newcontent).children('article').addClass('just-added'),
  162. $newpager = $('ul.pager', $newcontent);
  163. $(container_class, _$content).append($newitems);
  164. $('ul.pager', _$content).replaceWith($newpager.hide());
  165. // TODO: animation, this should be on theme side
  166. $(container_class, _$content).children('.just-added').each(function(i){
  167. // $(this).delay(5000*i).removeClass('just-added');
  168. var $this = $(this);
  169. setTimeout(function(){
  170. $this.removeClass('just-added');
  171. }, 150*i);
  172. });
  173. var event = jQuery.Event('resultscompleted');
  174. event.container = $(container_class, _$content);
  175. $.event.trigger(event);
  176. };
  177. /**
  178. * viewmode
  179. */
  180. function initViewMode(){
  181. $('.viewmode-link').click(function(event){
  182. event.preventDefault();
  183. changeViewMode($(this).attr('rel'), $(this));
  184. return false;
  185. });
  186. };
  187. function changeViewMode(vm, $btn){
  188. $.getJSON(Drupal.settings.basePath+'materio_search_api_ajax/viewmode/change/'+vm, function(json){
  189. trace('viewmode json', json);
  190. if (json.statut == "saved"){
  191. // loadResults(getSearchKeys());
  192. $.event.trigger('view-mode-changed');
  193. $('.viewmode-link, .viewmode-link i').removeClass('active');
  194. $btn.addClass('active').find('i').addClass('active');
  195. }
  196. });
  197. };
  198. function onViewModeChanged(event){
  199. if (isExplore())
  200. loadResults(getSearchKeys());
  201. if(isActuality())
  202. loadActuality();
  203. };
  204. /**
  205. * history
  206. */
  207. function onHistoryStateChange(event){
  208. if(isExplore() || isActuality())
  209. triggerContentChanged();
  210. };
  211. /**
  212. * helpers
  213. */
  214. function isExplore(){
  215. return $('.search-results', '#content').length;
  216. };
  217. function isActuality(){
  218. return $('.actuality-items', '#content').length;
  219. };
  220. init();
  221. };
  222. var materiosearchapiajax = new MaterioSearchApiAjax();
  223. })(jQuery);