materio_search_api_ajax.js 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
  1. // @codekit-prepend "gui.js"
  2. // @koala-prepend "gui.js"
  3. (function($) {
  4. MaterioSearchApiAjax = function(){
  5. var _isloadingresults = false;
  6. var _$content = $('#content');
  7. // TODO: define $content by module settings
  8. /**
  9. * init()
  10. */
  11. function init(){
  12. //trace('init MaterioSearchApiAjax');
  13. initSearchAjax();
  14. initViewMode();
  15. };
  16. /**
  17. * searchAjax
  18. */
  19. function initSearchAjax(){
  20. // trace('initSearchAjax');
  21. $('#materio-search-api-search-form').bind('submit', function(event) {
  22. // trace('search submited', event);
  23. // var $this = $(this);
  24. setTimeout(function(){
  25. loadResults(getSearchKeys());
  26. },10);
  27. return false;
  28. });
  29. // /!\ AUTOCOMPLETE SELECT EVENT need a patch http://drupal.org/node/365241#comment-5374686
  30. $("#edit-searchfield")
  31. .bind('autocompleteSelect', function(event) {
  32. $(this).parents('.form').trigger('submit');
  33. })
  34. .bind('focus', function(event){
  35. $(this).select();
  36. });
  37. $(document)
  38. .bind('theme-ready', onThemeReady)
  39. .bind('init-scroller-pager', onInitScrollerPager)
  40. .bind('load-scroller-pager', onLoadScrollerPager)
  41. .bind('view-mode-changed', onViewModeChanged)
  42. .bind('history-state-change', onHistoryStateChange);
  43. };
  44. function onThemeReady(event){
  45. // trace('MaterioSearchApiAjax :: onThemeReady');
  46. if( isActuality() || isExplore() ){
  47. $.event.trigger({
  48. type : 'resultschanged',
  49. container : isActuality() ? '#content .actuality-items' : '#content .search-results'
  50. });
  51. }
  52. };
  53. function getSearchKeys(){
  54. return $('#materio-search-api-search-form').find('input[name*="searchfield"]').val();
  55. };
  56. function loadResults(keys){
  57. trace('keys', keys);
  58. if(keys !== undefined && keys !== '' && keys.length >= 2){
  59. keys = keys.replace('/', ' ');
  60. var types = {}, stringTypes = [];
  61. $('#edit-bundles-filter', '#materio-search-api-search-form').find('input[type*="checkbox"]').each(function(i){
  62. $this = $(this);
  63. if ( $this.attr('checked') )
  64. stringTypes.push($this.val());
  65. types[$this.val()] = $this.attr('checked');
  66. });
  67. //trace('types', types);
  68. if(!_isloadingresults){
  69. $.event.trigger('loading-content');
  70. _isloadingresults = true;
  71. $('#materio-search-api-search-form').addClass('loading');
  72. // trace('window.location.href',window.location.href);
  73. // TODO: record ajax path in a variable from materio_search_api_ajax_init
  74. $.getJSON(Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/search/',
  75. {'types':types,'current_path':document.location.href, keys:keys},
  76. function(json){
  77. //trace('json', json);
  78. // google analytics
  79. $.event.trigger({
  80. type : "record-stat",
  81. categorie : 'Search',
  82. action : keys,
  83. label : 'filters : '+ stringTypes.join(' ,'),
  84. value : json.count
  85. });
  86. if(json.redirect){
  87. window.location = json.redirect;
  88. }else{
  89. $.event.trigger('loaded-content');
  90. _isloadingresults = false;
  91. $('#materio-search-api-search-form').removeClass('loading');
  92. changeContent(json);
  93. }
  94. });
  95. }
  96. }
  97. };
  98. function loadActuality(){
  99. if(!_isloadingresults){
  100. $.event.trigger('loading-content');
  101. _isloadingresults = true;
  102. $('#materio-search-api-search-form').addClass('loading');
  103. var url = Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/actuality';
  104. $.getJSON(url,
  105. function(json){
  106. //trace('json', json);
  107. $.event.trigger('loaded-content');
  108. _isloadingresults = false;
  109. $('#materio-search-api-search-form').removeClass('loading');
  110. changeContent(json);
  111. });
  112. }
  113. };
  114. function changeContent(json){
  115. //trace('MaterioSearchApiAjax changeContent | json', json);
  116. if(json.returned){
  117. $.event.trigger('loaded-content');
  118. $('.inner-content',_$content).html(json.returned).find('ul.pager').hide();
  119. triggerContentChanged();
  120. }else{
  121. //trace('no results');
  122. }
  123. $.event.trigger({
  124. type : 'new-history-page',
  125. path : Drupal.settings.basePath + Drupal.settings.pathPrefix + json.path,
  126. title : json.title,
  127. content : json.returned
  128. });
  129. for (language in Drupal.settings.materio_search_api_ajax.languages) {
  130. var l = Drupal.settings.materio_search_api_ajax.languages[language];
  131. $('#block-locale-language li.'+language+' a').attr('href', Drupal.settings.basePath + l.prefix+'/' + json.search_path + '/' + json.keys)
  132. };
  133. };
  134. function triggerContentChanged(){
  135. //trace('MaterioSearchApiAjax :: triggerContentChanged');
  136. $.event.trigger({
  137. type : 'resultschanged',
  138. container : '#content .search-results, #content .actuality-items'
  139. });
  140. };
  141. function onInitScrollerPager(event){
  142. // trace("onInitScrollerPager");
  143. if(isActuality() || isExplore())
  144. event.pager.hide();
  145. };
  146. function onLoadScrollerPager(event){
  147. // trace("onLoadScrollerPager");
  148. if(!_isloadingresults){
  149. if (isExplore())
  150. loadNextResultsPage(event.href);
  151. if(isActuality())
  152. loadNextActualityPage(event.href);
  153. }
  154. };
  155. function loadNextResultsPage(href){
  156. // trace('loadNextResultsPage');
  157. var keys = href.match(/explore\/([^\/|\?]+)/);
  158. var page = href.match(/\?page=([0-9]+)/);
  159. var url = Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/search/'+page[1];
  160. loadNextPage(url, keys[1], $('.materiobase-results', _$content), '.search-results');
  161. };
  162. function loadNextActualityPage(href){
  163. // trace('loadNextActualityPage');
  164. var page = href.match(/\?page=([0-9]+)/);
  165. var url = Drupal.settings.basePath+Drupal.settings.pathPrefix+'materio_search_api_ajax/actuality/'+page[1];
  166. loadNextPage(url, '', $('.materiobase-actuality', _$content), '.actuality-items');
  167. };
  168. function loadNextPage(url, keys, $container, target){
  169. // trace('MaterioSearchApiAjax :: loadNextPage()');
  170. _isloadingresults = true;
  171. $container.addClass('loading');
  172. $.getJSON(url, {'keys':keys}, function(json){
  173. //trace('json', json);
  174. $container.removeClass('loading');
  175. addNextpage(json, target);
  176. // addNextpageItemByItem($(json.return), target);
  177. });
  178. };
  179. function addNextpage(json, container_class){
  180. // trace('json',json);
  181. if(json){
  182. var $newcontent = $(json.returned),
  183. $newitems = $(container_class, $newcontent).children('article'), //.addClass('just-added'),
  184. $newpager = $('ul.pager', $newcontent);
  185. $(container_class, _$content).append($newitems);
  186. $('ul.pager', _$content).replaceWith($newpager.hide());
  187. // TODO: animation, this should be on theme side
  188. $(container_class, _$content).children('.just-added').each(function(i){
  189. var $this = $(this);
  190. setTimeout(function(){
  191. $this.removeClass('just-added');
  192. }, 150*i);
  193. });
  194. $.event.trigger({
  195. type : 'resultscompleted',
  196. container : $(container_class, _$content)
  197. });
  198. }
  199. _isloadingresults = false;
  200. };
  201. // TEST not used
  202. function addNextpageItemByItem($newcontent, container_class){
  203. //trace('MaterioSearchApiAjax :: addNextpageItemByItem()');
  204. $('ul.pager', _$content).remove();
  205. $(container_class, _$content).append($(container_class, $newcontent).children('article').eq(0));
  206. if($(container_class, $newcontent).children('article').length){
  207. setTimeout(function(){
  208. addNextpageItemByItem($newcontent, container_class);
  209. }, 200);
  210. }else{
  211. _isloadingresults = false;
  212. $('ul.pager', _$content).replaceWith($('ul.pager', $newcontent).hide());
  213. $.event.trigger({
  214. type : 'resultscompleted',
  215. container : $(container_class, _$content)
  216. });
  217. }
  218. };
  219. /**
  220. * viewmode
  221. */
  222. function initViewMode(){
  223. $('.viewmode-link').click(function(event){
  224. event.preventDefault();
  225. if(!$(this).is('.active')){
  226. $(this).trigger({type:'vm-clicked'});
  227. changeViewMode($(this).attr('rel'), $(this));
  228. }else{
  229. $(this).trigger({type:'vm-clicked-active'});
  230. }
  231. return false;
  232. });
  233. };
  234. function changeViewMode(vm, $btn){
  235. if(!_isloadingresults){
  236. _isloadingresults = true;
  237. $.getJSON(Drupal.settings.basePath+'materio_search_api_ajax/viewmode/change/'+vm, function(json){
  238. //trace('viewmode json', json);
  239. _isloadingresults = false;
  240. if (json.statut == "saved"){
  241. // google analytics
  242. $.event.trigger({
  243. type : "record-stat",
  244. categorie : 'Viewmode',
  245. action : vm,
  246. label : isActuality() ? 'Actualities' : 'Search results'
  247. });
  248. $.event.trigger('view-mode-changed');
  249. $('.viewmode-link, .viewmode-link i').removeClass('active');
  250. $btn.addClass('active').find('i').addClass('active');
  251. }
  252. });
  253. }
  254. };
  255. function onViewModeChanged(event){
  256. if (isExplore())
  257. loadResults(getSearchKeys());
  258. if(isActuality())
  259. loadActuality();
  260. };
  261. /**
  262. * history
  263. */
  264. function onHistoryStateChange(event){
  265. if(isExplore() || isActuality())
  266. triggerContentChanged();
  267. // TODO: pushstate trogger state change, so we have a retriggerring here on loading new results … how to avoid this
  268. };
  269. /**
  270. * helpers
  271. */
  272. function isExplore(){
  273. return $('.search-results', '#content').length;
  274. };
  275. function isActuality(){
  276. return $('.actuality-items', '#content').length;
  277. };
  278. init();
  279. };
  280. $(document).ready(function() {
  281. var materiosearchapiajax = new MaterioSearchApiAjax();
  282. });
  283. })(jQuery);