script.js 57 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770
  1. (function($) {
  2. Drupal.behaviors.init_theme = {};
  3. Drupal.behaviors.init_theme.attach = function (context) {
  4. // Growl-style system messages
  5. $('#messages-and-help > div.messages:not(.processed)')
  6. .addClass('processed')
  7. .each(function() {
  8. // If a message meets these criteria, we don't autoclose
  9. // - contains a link
  10. // - is an error or warning
  11. // - contains a lenghthy amount of text
  12. if ($('a', this).size() || $(this).is('.error') || $(this).is('.warning') || $(this).text().length > 100) {
  13. $(this).prepend("<span class='close'>X</span>");
  14. $('span.close', this).click(function() {
  15. $(this).parent().slideUp('fast');
  16. });
  17. }
  18. else {
  19. // This essentially adds a 3 second pause before hiding the message.
  20. $(this).animate({opacity:1}, 5000, 'linear', function() {
  21. $(this).slideUp('fast');
  22. });
  23. }
  24. });
  25. };
  26. Drupal.behaviors.materio = {};
  27. Drupal.behaviors.materio.attach = function(context) {};
  28. MaterioBaseTheme = function(){
  29. var _settings = Drupal.settings,
  30. _themeSettings = _settings.materiobasetheme,
  31. _strings = _themeSettings.strings,
  32. _History = window.History,
  33. _this = this,
  34. _$body = $('body'),
  35. _$content = $('#content'),
  36. _jsp,
  37. _$tooltip = $('<div id="tooltip" class="op-hidden">').appendTo('body'),
  38. _$homeUtilities, _$homeBlockDidactique, _hoverHomeDidactique = false, _homeTimeInterval,
  39. _touch = $('html').is('.touch'),
  40. _statePushed = false,
  41. // touch scroll
  42. position = {x:null,y:null},
  43. translate3d_content = 0,
  44. _isLoggedIn = !_$body.is('.not-logged-in'),
  45. _isFrontNotLogged = _$body.is('.front.not-logged-in'),
  46. _isFrontHomeV2 = _$body.is('.home-v2'),
  47. _skrollr,
  48. _isMembershipForm = _$body.is('.page-node-11186'), //$('body').is('.page-node-11187') || ,
  49. _isBreveMateriauNodePage = _$body.is('.node-type-breve') || _$body.is('.node-type-materiau'),
  50. // _isBreveMateriauNodePage = _themeSettings.page_callback == 'node_page_view' && (_themeSettings.node_type == 'materiau' || _themeSettings.node_type == 'breve'),
  51. _hasDoubleSearchForm = $('#block-materio-search-api-materio-search-api-search .msa-search').length && $('#block-materio-search-api-materio-search-api-search .msa-advanced-search').length,
  52. _resizeTimer,
  53. _max_480 = function(){ return (viewport().width < 479); },
  54. _480_768 = function(){ return ( !_max_480() && _max_768() ); },
  55. _max_768 = function(){ return (viewport().width < 767); },
  56. _768_980 = function(){ return ( !_max_768() && _max_980() ); },
  57. _max_980 = function(){ return (viewport().width < 979); },
  58. _980_1200 = function(){ return ( !_max_980() && _max_1200() ); },
  59. _max_1200 = function(){ return (viewport().width < 1199); },
  60. _previewIsOpen = false,
  61. _viewmodes = {
  62. bookmark : 50,
  63. cardsmall : 100,
  64. cardmedium : 210,
  65. cardbig : 425,
  66. cardfull : 850
  67. };
  68. // DEV
  69. var v1, v2, v3, v4, v5; // generic variable used in many cases to avoid to create new memory block with new vars
  70. function init(){
  71. trace('init MaterioBaseTheme');
  72. checkIE();
  73. initHistoryNav();
  74. // if(_isFrontNotLogged && !_isFrontHomeV2)
  75. // initHome();
  76. if(_isFrontHomeV2)
  77. initHomeV2();
  78. if(_isMembershipForm)
  79. initMembershipForm();
  80. initForms();
  81. if(!_isFrontHomeV2)
  82. initLayout();
  83. initInfinitScroller();
  84. initEvents();
  85. initKeyboardShortcuts();
  86. initViewmodes();
  87. if(_hasDoubleSearchForm)
  88. initDoubleSearchFormTabs();
  89. if(_isBreveMateriauNodePage)
  90. $.event.trigger({ type : 'resultschanged', container : '#content>.inner-content'});
  91. setTimeout(function(){
  92. $.event.trigger({ type : 'theme-ready' });
  93. },100);
  94. };
  95. /**
  96. * checkIE
  97. *
  98. */
  99. function checkIE(){
  100. // alert('check ie');
  101. if($('.oldie body').size() && !readCookie('oldie_checked')){
  102. setTimeout(function(){
  103. createCookie('oldie_checked', 1);
  104. alert('Afin de profiter pleinement des fonctionalités de materio.com, nous vous invitons a mettre a jour votre navigateur dans ça denière version. Celui ci n\'étant pas compatible avec les technologie employer par materio.com, vous risquer de rencontrer des difficulter de navigation.');
  105. }, 4000);
  106. }
  107. };
  108. /**
  109. * history navigation
  110. */
  111. function initHistoryNav(){
  112. trace("initHistoryNav _History", _History);
  113. var state = _History.getState();
  114. // _History.log('initial:', state.data, state.title, state.url);
  115. _History.Adapter.bind(window,'statechange',onHistoryStateChange);
  116. $(document).bind('new-history-page', onNewHistoryPage);
  117. };
  118. function onNewHistoryPage(event){
  119. trace('theme :: onNewHistoryPage', event);
  120. var title = event.title.replace(/<(?:.|\n)*?>/gm, '') + ' | ' + _strings.site_name;
  121. // trace('MaterioBaseTheme :: onNewHistoryPage : title', title);
  122. _statePushed = true;
  123. _History.pushState({content:event.content, pagetitle:event.title}, title, event.path);
  124. };
  125. function onHistoryStateChange(event){
  126. trace('theme :: onHistoryStateChange', event);
  127. var state = _History.getState();
  128. _History.log('statechange:', state.data, state.title, state.url);
  129. // google analytics
  130. $.event.trigger({
  131. type : 'record-stat',
  132. path : state.url
  133. });
  134. // TODO: History : empty content if we go back to the homepage
  135. // change the current url for feedbacks
  136. $('input[name=location]','#feedback-form').attr('value', state.url);
  137. $.event.trigger({
  138. type:'materio-page-title-refresh-block',
  139. title : state.data.pagetitle
  140. });
  141. // this condition is to avoid retriggering probleme when a module pushState and then is retriggered by state-changed
  142. if(!_statePushed){
  143. _statePushed = false;
  144. $('.inner-content',_$content).html(state.data.content);
  145. $.event.trigger('history-state-change');
  146. }
  147. };
  148. /*
  149. __ ___
  150. / /_ ____ ____ ___ ___ _ _< /
  151. / __ \/ __ \/ __ `__ \/ _ \ | | / / /
  152. / / / / /_/ / / / / / / __/ | |/ / /
  153. /_/ /_/\____/_/ /_/ /_/\___/ |___/_/
  154. */
  155. function initHome(){
  156. $('img.lazy', '#block-materio-didactique-materio-didactique-home').each(function(){
  157. var $img = $(this);
  158. $img.attr('src', $img.attr('data-original'));
  159. });
  160. if(_max_768()){
  161. initHomeDidactiqueMobile();
  162. }else{
  163. initHomeDidactiqueDesktop();
  164. }
  165. };
  166. function initHomeDidactiqueMobile(){
  167. // trace('initHomeDidactiqueMobile');
  168. _$homeBlockDidactique = $('#block-materio-didactique-materio-didactique-home');
  169. $('.node-didactique', _$homeBlockDidactique)
  170. .find('.field-name-title-field')
  171. .bind('click', clickOnHomeDidactiqueTitle);
  172. };
  173. function clickOnHomeDidactiqueTitle(e){
  174. // trace('clickOnHomeDidactiqueTitle');
  175. var $node = $(this).parent('.node-didactique');
  176. if($node.is('.opened')){
  177. $node.removeClass('opened');//.slideUp();
  178. }else{
  179. $('.node-didactique', _$homeBlockDidactique).removeClass('opened');//.slideUp();
  180. $node.addClass('opened');//.slideDown();
  181. $('html,body').animate({scrollTop: $node.offset().top - $('#header').h()});
  182. }
  183. };
  184. function initHomeDidactiqueDesktop(){
  185. // trace("initHomeDidactiqueDesktop");
  186. _$homeUtilities = $('#utilities');
  187. _$homeBlockDidactique = $('#block-materio-didactique-materio-didactique-home')
  188. .append('<div class="slides"/>')
  189. .append('<div class="tabs"/>')
  190. // .append('<i class="icon-circle-arrow-up"/><i class="icon-circle-arrow-down"/>')
  191. .bind('mouseenter', function(event) { _hoverHomeDidactique = true; })
  192. .bind('mouseleave', function(event) { _hoverHomeDidactique = false; });
  193. $('.node-didactique',_$homeBlockDidactique).each(function(index) {
  194. if(index){
  195. $(this).addClass('op-hidden');
  196. }else{
  197. $(this).addClass('op-visible');
  198. }
  199. $('.field-name-title-field', this)
  200. .clone()
  201. .addClass(index ? '' : 'active')
  202. .click(function(event){
  203. $(this).addClass('active').siblings().removeClass('active');
  204. _$homeBlockDidactique.find('.node-didactique').removeClass('op-visible').addClass('op-hidden').eq(index).removeClass('op-hidden').addClass('op-visible');
  205. })
  206. .appendTo($('.tabs', _$homeBlockDidactique));
  207. }).appendTo($('.slides', _$homeBlockDidactique));
  208. if(!_touch){
  209. $(document).bind('scroll', function(event){
  210. if($(window).scrollTop() == 0) {
  211. if(_$homeUtilities.is('.closed')){
  212. _$homeUtilities.removeClass('closed');//.removeClass('scroll-closed');
  213. launchHomeDidactiqueInterval();
  214. initLayout();
  215. }
  216. }else{
  217. if(!_$homeUtilities.is('.closed')){
  218. _$homeUtilities.addClass('closed');//.addClass('scroll-closed');
  219. clearInterval(_homeTimeInterval);
  220. initLayout();
  221. }
  222. }
  223. });
  224. }
  225. // launchHomeDidactiqueInterval();
  226. $(document)
  227. .bind('cbox_complete', function(){ clearInterval(_homeTimeInterval); })
  228. .bind('cbox_closed', function(){ launchHomeDidactiqueInterval(); });
  229. $('.side.oops a').click(function(event) {
  230. event.preventDefault();
  231. // $(document).scrollTop(0);
  232. // $('#edit-mail', "#block-materio-user-user-register").focus();
  233. window.location.href = $(this).attr('href');
  234. return false;
  235. });
  236. };
  237. function launchHomeDidactiqueInterval(){
  238. _homeTimeInterval = setInterval(function(){
  239. if(!_hoverHomeDidactique){
  240. var $next = $('.tabs .active', _$homeBlockDidactique).next();
  241. if(!$next.length)
  242. $next = $('.tabs .active', _$homeBlockDidactique).siblings().eq(0);
  243. $next.trigger('click');
  244. }
  245. }, 15000);
  246. };
  247. /*
  248. __ ___
  249. / /_ ____ ____ ___ ___ _ _|__ \
  250. / __ \/ __ \/ __ `__ \/ _ \ | | / /_/ /
  251. / / / / /_/ / / / / / / __/ | |/ / __/
  252. /_/ /_/\____/_/ /_/ /_/\___/ |___/____/
  253. */
  254. function initHomeV2(){
  255. //console.log('initHomeV2');
  256. initCards('#home-v2 .panel-pane.news-panel .panel-col-first .views-row');
  257. // if(!_max_480()){
  258. /*
  259. // Click Menu and scroll to part of the page
  260. $('.pane-menu-menu-home-v2 .menu li a').each(function(){
  261. // var href = $(this).attr("href");
  262. // var part = link.replace("/fr/", "");
  263. // $(this).attr('href', '#' +part);
  264. // $(this).click(function(e){
  265. // e.preventDefault();
  266. // var scrollTo = $('.' + part).offset().top -200;
  267. // $("body").animate({scrollTop: scrollTo}, 2000 );
  268. // return false;
  269. // })
  270. var reg = /\b([^-]+)-link/g;
  271. var match = reg.exec($(this).attr('class'));
  272. console.log('match', match);
  273. $(this).attr('href', '#' +match[1]+ '-pane');
  274. $('#'+match[1]+'-pane').attr('data-menu-offset','-80');
  275. });
  276. */
  277. // SKROLLR effects
  278. // showroom TXT
  279. $('.panel-pane.showroom .group-content-wrapper', '#home-v2')
  280. .attr('data-400-center-top', 'transform:translateX(-43em);opacity:0;')
  281. .attr('data-100-center-center', 'transform[quadratic]:translateX(0em);opacity[quadratic]:1;')
  282. .attr('data-top-bottom', 'transform[quadratic]:translateX(10em);');
  283. // showroom Image BGD
  284. $('.panel-pane.showroom .field-name-field-bandeau img', '#home-v2')
  285. .attr('data-400-bottom-top', 'transform:translateY(-20em);')
  286. .attr('data-200-top-bottom', 'transform:translateY(5em);');
  287. // database TXT
  288. $('.panel-pane.bdd .group-content-wrapper', '#home-v2')
  289. .attr('data-400-center-top', 'transform:translateX(40em);opacity:0;')
  290. .attr('data-200-center-center', 'transform[quadratic]:translateX(0em);opacity[quadratic]:1;');
  291. // database IMG
  292. $('.panel-pane.bdd .field-name-field-bandeau img', '#home-v2')
  293. .attr('data-400-bottom-top', 'transform:translateX(0em);')
  294. .attr('data-100-top-bottom', 'transform[quadratic]:translateX(-40em);');
  295. // news
  296. $('.panel-pane.news-panel .center-wrapper .panel-panel', '#home-v2').each(function(i, e){
  297. $(this)
  298. .attr('data-anchor-target', "#news-pane")
  299. .attr('data--'+(i+1)*75+'-bottom-top', 'transform:translateY(20em);opacity:0;')
  300. .attr('data-center-top', 'transform[quadratic]:translateY(0em);opacity:1;');
  301. });
  302. //
  303. // Formations
  304. $('.panel-pane.formations .group-content-wrapper', '#home-v2')
  305. .attr('data-50-bottom-top', 'transform:translateX(20em);opacity:0;')
  306. .attr('data-center-top', 'transform[quadratic]:translateX(0em);opacity:1;');
  307. // Blabla
  308. $('.panel-pane.blabla .group-content-wrapper', '#home-v2')
  309. .attr('data-50-bottom-top', 'transform:translateX(20em);opacity:0;')
  310. .attr('data-center-top', 'transform[quadratic]:translateX(0em);opacity:1;');
  311. // Services
  312. $('.panel-pane.services .group-content-wrapper', '#home-v2')
  313. .attr('data-50-bottom-top', 'transform:translateX(20em);opacity:0;')
  314. .attr('data-center-top', 'transform[quadratic]:translateX(0em);opacity:1;');
  315. //Publication node news
  316. $('.panel-pane.publication .views-row', '#home-v2').each(function(i, e){
  317. $(this)
  318. // .attr('data-anchor-target', "#news-pane")
  319. .attr('data--'+i*100+'-bottom-top', 'opacity:0;')
  320. .attr('data-'+i*50+'-center-center', 'opacity:1;');
  321. });
  322. _skrollr = skrollr.init({
  323. skrollrBody:"root"
  324. });
  325. /*
  326. //The options (second parameter) are all optional. The values shown are the default values.
  327. skrollr.menu.init(_skrollr, {
  328. //skrollr will smoothly animate to the new position using `animateTo`.
  329. animate: true,
  330. //The easing function to use.
  331. easing: 'outCubic',
  332. //Multiply your data-[offset] values so they match those set in skrollr.init
  333. scale: 2,
  334. //How long the animation should take in ms.
  335. duration: function(currentTop, targetTop) {
  336. //By default, the duration is hardcoded at 500ms.
  337. // return 500;
  338. //But you could calculate a value based on the current scroll position (`currentTop`) and the target scroll position (`targetTop`).
  339. return Math.abs(currentTop - targetTop)*0.8;
  340. },
  341. //If you pass a handleLink function you'll disable `data-menu-top` and `data-menu-offset`.
  342. //You are in control where skrollr will scroll to. You get the clicked link as a parameter and are expected to return a number.
  343. // handleLink: function(link) {
  344. // return 400;//Hardcoding 400 doesn't make much sense.
  345. // },
  346. //By default skrollr-menu will only react to links whose href attribute contains a hash and nothing more, e.g. `href="#foo"`.
  347. //If you enable `complexLinks`, skrollr-menu also reacts to absolute and relative URLs which have a hash part.
  348. //The following will all work (if the user is on the correct page):
  349. //http://example.com/currentPage/#foo
  350. //http://example.com/currentDir/currentPage.html?foo=bar#foo
  351. ///?foo=bar#foo
  352. complexLinks: false,
  353. //This event is triggered right before we jump/animate to a new hash.
  354. // change: function(newHash, newTopPosition) {
  355. // //Do stuff
  356. // },
  357. //Add hash link (e.g. `#foo`) to URL or not.
  358. updateUrl: false //defaults to `true`.
  359. });
  360. */
  361. // }
  362. };
  363. /**
  364. * layout
  365. */
  366. function initLayout(){
  367. trace("initLayout");
  368. // if(!_max_768()){
  369. var height = $('#header').h() + $('#tasks').h();
  370. // if(!_max_480() && !_touch ){
  371. height += $('#utilities').h();//+15;
  372. // }
  373. //$('#main').css('margin-top', height+15);
  374. // $('#container').css('padding-top', height+15);
  375. if(!$('html').is(".ie8")){
  376. $('#container').animate({'padding-top':height}, 150);
  377. }
  378. // }
  379. };
  380. /**
  381. * infinit scroll
  382. */
  383. function initInfinitScroller(){
  384. // trace("initInfinitScroller");
  385. $.event.trigger({
  386. type : 'init-scroller-pager',
  387. pager : $('ul.pager', '#content')
  388. });
  389. $(document).bind('scroll', function(event){
  390. // trace('scroll event binded');
  391. checkInfinitScroller();
  392. });
  393. };
  394. function checkInfinitScroller(){
  395. // trace('checkInfinitScroller');
  396. // if(!_touch){
  397. // }else{
  398. if($(window).scrollTop() + $(window).height() > getDocHeight() - 200) {
  399. infinitScrollPager();
  400. }
  401. // }
  402. };
  403. function infinitScrollPager(){
  404. // trace('MaterioBaseTheme :: infinitScrollPager');
  405. if($('ul.pager', '#content').length){
  406. var $nextpage = $('ul.pager .pager-current', '#content').next(),
  407. href = $('a', $nextpage).attr('href');
  408. if(href){
  409. $.event.trigger({ type : 'record-stat', path : href }); // google analytics
  410. $.event.trigger({ type : 'load-scroller-pager', href : href });
  411. }
  412. }
  413. };
  414. /**
  415. * events
  416. */
  417. function initEvents(){
  418. //trace('MaterioBaseTheme :: initEvents');
  419. $(document)
  420. .bind('init-layout', initLayout)
  421. .bind('loading-content', onLoadingContent)
  422. .bind('loaded-content', onLoadedContent)
  423. .bind('resultschanged', onResultsChanged)
  424. .bind('resultscompleted', onResultsCompleted)
  425. .bind('mybookmarks-block-updated', onMybookmarksBlockUpdate)
  426. .bind('mylists-block-builded', onMyListsBlockBuilded)
  427. .bind('mylists-block-updated', onMyListsBlockUpdate)
  428. .bind('flagGlobalAfterLinkUpdate', onAfterFlaging)
  429. .bind('record-stat', onRecordStat)
  430. .bind('view-mode-changed', onViewModeChanged)
  431. .bind('ajax-register-block-loaded', onAjaxRegisterBlockLoaded);
  432. $(window)
  433. .bind('resize', onResizeWindow);
  434. initFlagsEvent();
  435. $('#block-user-login h2, #block-menu-menu-top-menu h2').bind('click', function(event) {
  436. event.preventDefault();
  437. $(this).parent('.block').toggleClass('hovered');
  438. $('.hovered').not($(this).parent('.block')).removeClass('hovered');
  439. return false;
  440. });
  441. $('#block-materio-search-api-materio-search-api-viewmode .viewmode-link').bind('vm-clicked-active', function(event) {
  442. $(this).parents('.block').toggleClass('hovered');
  443. $('.hovered').not($(this).parents('.block')).removeClass('hovered');
  444. });
  445. $('#block-materio-search-api-materio-search-api-viewmode .viewmode-link').bind('vm-clicked', function(event) {
  446. $(this).parents('.block').removeClass('hovered');
  447. $('.hovered').not($(this).parents('.block')).removeClass('hovered');
  448. });
  449. // @see http://www.jaypan.com/tutorial/calling-function-after-ajax-event-drupal-7
  450. if(typeof Drupal.ajax !== "undefined"){
  451. Drupal.ajax.prototype.commands.ajaxAfterAddedFilterLine = function(ajax, response, status){
  452. // console.log('ajax after added filter line');
  453. initLayout();
  454. };
  455. Drupal.ajax.prototype.commands.ajaxAfterRemovedFilterLine = function(ajax, response, status){
  456. // console.log('ajax after removed filter line');
  457. initLayout();
  458. };
  459. }
  460. };
  461. function onLoadingContent(event){
  462. _$content.addClass('faded');
  463. $('#materio-search-api-search-form, #materio-search-api-advanced-search-form').addClass('loading');
  464. };
  465. function onLoadedContent(event){
  466. // trace('MaterioBaseTheme :: onLoadedContent',event);
  467. _$content.removeClass('faded');
  468. $('#materio-search-api-search-form, #materio-search-api-advanced-search-form').removeClass('loading');
  469. };
  470. function onResultsChanged(event){
  471. trace('MaterioBaseTheme :: onResultsChanged',event);
  472. $(document).scrollTop(0);
  473. focusCard($('#content .search-results, #content .actuality-items').children('.node:first-child'));
  474. onResultsCompleted(event);
  475. };
  476. function onResultsCompleted(event){
  477. // trace('theme :: onResultsCompleted', event);
  478. checkInfinitScroller();
  479. if(event.container != undefined){
  480. // trace('theme :: container is ok : '+event.container)
  481. setTimeout(function(){ // why this time out ?
  482. initCards(event.container);
  483. setUpGrid(event.container);
  484. }, 100);
  485. }
  486. };
  487. function initCards(container){
  488. trace('theme :: initCards', container);
  489. var $container = $(container);
  490. $container.children('.node:not(.listened)')
  491. .bind('mouseenter focused mousemove click mouseleave', onCardEventDispatcher)
  492. .each(function(i){
  493. protectFigures(this);
  494. if(_isLoggedIn){
  495. if(!$container.is('.modal-content') && !$(this).is('.vm-cardfull')){
  496. // do not add preview btn if we are already on a preview
  497. initPreview(this);
  498. }else{
  499. // if we are on preview mode add a close btn (only for associated materials)
  500. if(!$(this).is(":first-child")){
  501. var $closebtn = $('<section><i class="icon-remove"></i></section>');
  502. $closebtn.bind('click', function(){
  503. $(this).parents('.node-materiau').remove();
  504. });
  505. $('nav.nav', this).append($closebtn);
  506. }
  507. }
  508. }
  509. })
  510. .addClass('listened');
  511. };
  512. function setUpGrid(container){
  513. var $card, top, old_top, col = 0, line = 0;
  514. $(container).children('.node')
  515. .each(function(i){
  516. $card = $(this);
  517. top = $card.offset().top;
  518. if(old_top != top){
  519. line ++;
  520. old_top = top;
  521. col = 0;
  522. }
  523. col ++;
  524. $card.attr('column', col).attr('line', line);
  525. });
  526. };
  527. function onViewModeChanged(event){
  528. if(_isBreveMateriauNodePage){
  529. // if(!_isloadingresults){
  530. $.event.trigger('loading-content');
  531. var url = _settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+_themeSettings.node_nid;
  532. $.getJSON(url,
  533. function(json){
  534. //trace('json', json);
  535. $.event.trigger('loaded-content');
  536. $('#content>.inner-content').html(json.node);
  537. $.event.trigger({ type : 'resultschanged', container : '#content>.inner-content'});
  538. });
  539. // }
  540. }
  541. };
  542. /**
  543. * CARDS
  544. */
  545. function onCardEventDispatcher(event){
  546. // trace('onCardEvent', event);
  547. var vmode = event.currentTarget.className.match(/vm-([a-z|A-Z]+)/);
  548. var cf = 'on_'+event.type+'_card';
  549. var f = 'on_'+event.type+'_'+vmode[1];
  550. if(typeof _this[cf] == 'function')
  551. _this[cf].call(this, event);
  552. if(typeof _this[f] == 'function')
  553. _this[f].call(this, event);
  554. };
  555. // function initLayoutCardDispatcher($card){
  556. // // trace('$card', $card);
  557. // var vmode = $card.attr('class').match(/vm-([a-z|A-Z]+)/);
  558. // var f = 'init_layout_'+vmode[1];
  559. // if(typeof _this[f] == 'function')
  560. // _this[f].call(this, $card);
  561. // };
  562. /**
  563. * commons Cards
  564. */
  565. // MaterioBaseTheme.prototype.init_layout_card = function($card){
  566. // trace('initLayoutCardBig');
  567. // };
  568. // MaterioBaseTheme.prototype.on_mouseenter_card = function(event){
  569. // //trace('MaterioBaseTheme :: on_mouseenter_card', event);
  570. // };
  571. MaterioBaseTheme.prototype.on_mousemove_card = function(event){
  572. // trace('on_mousemove_Card', event);
  573. focusCard($(this));
  574. };
  575. // MaterioBaseTheme.prototype.on_click_card = function(event){
  576. // trace('on_click_card', event);
  577. // };
  578. // MaterioBaseTheme.prototype.on_mouseleave_card = function(event){
  579. // // trace('on_mouseleave_Card', event);
  580. // };
  581. /**
  582. * cards small
  583. */
  584. // MaterioBaseTheme.prototype.init_layout_cardsmall = function($card){
  585. // trace('initLayoutCardBig');
  586. // };
  587. MaterioBaseTheme.prototype.on_mouseenter_cardsmall = function(event){
  588. //trace('MaterioBaseTheme :: on_mouseenter_cardsmall', event);
  589. showLazyLoadedImages(event.currentTarget);
  590. };
  591. MaterioBaseTheme.prototype.on_focused_cardsmall = function(event){
  592. // trace('theme :: on_focused_cardsmall',event);
  593. v1 = $(this);
  594. v2 = v1.offset();
  595. _$tooltip
  596. .html($('.group-header', this).clone().addClass('smallcard'))
  597. .css({
  598. top:v2.top,//- event.layerY,
  599. left:v2.left + 5 + ($(this).w())// - event.layerX
  600. })
  601. .removeClass('op-hidden').addClass('op-visible');
  602. };
  603. MaterioBaseTheme.prototype.on_mousemove_cardsmall = function(event){
  604. // trace('on_mousemove_Card', event);
  605. horiHoverImagesSwitcher(event);
  606. _$tooltip
  607. .css({
  608. top:event.pageY - _$tooltip.h() -5,// - event.layerY,
  609. left:event.pageX + 5 + ($(this).w() - event.layerX)
  610. });
  611. };
  612. // MaterioBaseTheme.prototype.on_click_cardsmall = function(event){
  613. // trace('on_click_cardsmall', event);
  614. // };
  615. MaterioBaseTheme.prototype.on_mouseleave_cardsmall = function(event){
  616. // trace('on_mouseleave_Card', event);
  617. $('.images img.op-visible', this)
  618. .removeClass('op-visible').addClass('op-hidden')
  619. .eq(0)
  620. .removeClass('op-hidden').addClass('op-visible');
  621. if($(this).is('.focused'))
  622. _$tooltip.removeClass('op-visible').addClass('op-hidden');
  623. };
  624. /**
  625. * cards medium
  626. */
  627. // MaterioBaseTheme.prototype.init_layout_cardmedium = function($card){
  628. // trace('initLayoutCardMedium');
  629. // var ch = $card.h() - $('.group-header', $card).h() -30;
  630. // columnsPage($('.field-name-field-description, .field-name-body', $card), 210, ch);
  631. // };
  632. MaterioBaseTheme.prototype.on_mouseenter_cardmedium = function(event){
  633. // trace('on_mouseenter_cardmedium');
  634. // show lazy images
  635. showLazyLoadedImages(event.currentTarget);
  636. // columnize texts
  637. $card = $(event.currentTarget);
  638. if(!$('.columnized', $card).size() && !$('body').is('.role-7', 'role-2') ){
  639. var ch = $card.h() - $('.group-header', $card).h() -30;
  640. columnsPage($('.field-name-field-description, .field-name-body', $card), 210, ch);
  641. $('.group-side-4', $card).wrapInner('<div class="column-wrapper">').find('.field-item').addClass('dontsplit');
  642. columnsPage($('.group-side-4 .column-wrapper', $card), 210, ch);
  643. }
  644. // add associated materials links
  645. prepareAssociatedMaterials(event.currentTarget);
  646. };
  647. MaterioBaseTheme.prototype.on_mousemove_cardmedium = function(event){
  648. //trace('on_mousemove_cardmedium');
  649. horiHoverImagesSwitcher(event);
  650. };
  651. MaterioBaseTheme.prototype.on_click_cardmedium = function(event){
  652. trace('on_click_cardmedium', event);
  653. // if(!$(event.target).is('.flag') && !$(event.target).parent().is('.flag'))
  654. if($(event.target).is('.side') || $(event.target).parents('.side').length)
  655. sideSwitcher(event);
  656. };
  657. MaterioBaseTheme.prototype.on_mouseleave_cardmedium = function(event){
  658. v1 = $('.side.op-visible');
  659. if(v1.is('.oops','.upgrade') || $('.upgrade', v1).size()){
  660. sideSwitcher(event, 0);
  661. }
  662. };
  663. /**
  664. * cards Big
  665. */
  666. // MaterioBaseTheme.prototype.init_layout_cardbig = function($card){
  667. //trace('initLayoutCardBig');
  668. // columnsPage($('.field-name-field-description, .field-name-body', $card), 425, 270);
  669. // };
  670. MaterioBaseTheme.prototype.on_mouseenter_cardbig = function(event){
  671. // trace('on_mouseenter_cardbig');
  672. showLazyLoadedImages(event.currentTarget);
  673. if(!$('.columnized', event.currentTarget).size()){
  674. columnsPage($('.field-name-field-description, .field-name-body', event.currentTarget), 425, 270);
  675. $('.group-4', event.currentTarget).wrapInner('<div class="column-wrapper">').find('.field-item').addClass('dontsplit');
  676. columnsPage($('.group-4 .column-wrapper', event.currentTarget), 425, 270);
  677. }
  678. // add associated materials links
  679. prepareAssociatedMaterials(event.currentTarget);
  680. };
  681. MaterioBaseTheme.prototype.on_mousemove_cardbig = function(event){
  682. // trace('on_mousemove_cardbig');
  683. horiHoverImagesSwitcher(event);
  684. };
  685. MaterioBaseTheme.prototype.on_click_cardbig = function(event){
  686. //trace('on_click_cardbig');
  687. sideSwitcher(event);
  688. };
  689. MaterioBaseTheme.prototype.on_mouseleave_cardbig = function(event){
  690. if($('.side.op-visible').is('.oops') || $('.side.op-visible').is('.upgrade')){
  691. sideSwitcher(event, 0);
  692. }
  693. };
  694. /**
  695. * cards Full
  696. */
  697. // MaterioBaseTheme.prototype.init_layout_cardfull = function($card){
  698. // trace('initLayoutCardFull');
  699. // };
  700. MaterioBaseTheme.prototype.on_mouseenter_cardfull = function(event){
  701. // trace('on_mouseenter_cardfull');
  702. showLazyLoadedImages(event.currentTarget);
  703. // add associated materials links
  704. prepareAssociatedMaterials(event.currentTarget);
  705. };
  706. MaterioBaseTheme.prototype.on_mousemove_cardfull = function(event){
  707. // trace('on_mousemove_cardfull');
  708. horiHoverImagesSwitcher(event);
  709. };
  710. // MaterioBaseTheme.prototype.on_click_cardfull = function(event){
  711. // trace('on_click_cardfull');
  712. // };
  713. // MaterioBaseTheme.prototype.on_mouseleave_cardfull = function(event){
  714. // trace('on_mouseleave_cardfull');
  715. // };
  716. /**
  717. * horiHoverImagesSwitcher
  718. */
  719. function horiHoverImagesSwitcher(event){
  720. // trace('horiHoverImagesSwitcher', event);
  721. var $curtar = $(event.currentTarget);
  722. var layerX = (event.offsetX || event.pageX - $(event.target).offset().left);
  723. // trace("layerX", layerX);
  724. if(layerX && $curtar.is('.image-ready') ){ // && !$curtar.is('.image-buged')
  725. var $imgs = $('.group-images figure', event.currentTarget);
  726. if($(event.target).parents('.group-images').length){
  727. var imgw = $imgs.eq(0).w(),
  728. rapport = imgw/$imgs.length,
  729. mx = layerX > imgw ? imgw-1 : layerX,
  730. rapport_pos = Math.floor(mx / rapport);
  731. // trace('imgw = '+imgw+' | rapport_pos = '+rapport_pos+' | layerX = '+layerX);
  732. rapport_pos = rapport_pos < 0 ? 0 : ( rapport_pos > ($imgs.length - 1) ? $imgs.length - 1 : rapport_pos);
  733. // trace('rapport_pos', rapport_pos);
  734. if(!$imgs.eq(rapport_pos).is('.op-visible')){
  735. // google analytics
  736. $.event.trigger({
  737. type : 'record-stat',
  738. categorie : 'Card event',
  739. action : 'image slide switch',
  740. label : rapport_pos
  741. });
  742. $imgs
  743. .removeClass('op-visible').addClass('op-hidden')
  744. .eq(rapport_pos)
  745. .removeClass('op-hidden').addClass('op-visible');
  746. }
  747. }else{
  748. // $curtar.addClass('image-buged');
  749. $imgs.removeClass('op-visible').addClass('op-hidden');
  750. $imgs.eq(0).removeClass('op-hidden').addClass('op-visible');
  751. }
  752. }
  753. };
  754. /**
  755. * protectImages
  756. */
  757. function protectFigures(context){
  758. // trace('protectFigures');
  759. context = context == null ? 'body' : context;
  760. $('figure:not(.protected)', context)
  761. .append('<img class="blank" src="'+_settings.basePath+_themeSettings.themePath+'/img/blank.gif" />')
  762. .addClass('protected')
  763. .bind("contextmenu", function(e){
  764. alert("Cette image est soumise au droit d'auteur.");
  765. return false;
  766. });
  767. };
  768. /**
  769. * initPreview
  770. */
  771. function initPreview(node){
  772. $('nav.nav', node).append($('<section class="preview"><i class="fi-eye"></i></section>').bind('click', onClickPreviewCardBtn));
  773. };
  774. function onClickPreviewCardBtn(event){
  775. // trace('theme :: onClickPreviewCardBtn', event);
  776. event.preventDefault();
  777. //trace('Theme :: previewCard', event);
  778. previewCard($(this).parents('.node'));
  779. return false;
  780. };
  781. function previewCard($card){
  782. // trace('theme :: previewCard',$card);
  783. // get the nid from card class
  784. var matches = $card.attr('class').match(/\bnode-(\d+)\b/);
  785. // select viewmode regarding the window size
  786. var viewmode = false;
  787. var cur_vm = getCurrentViewmode();
  788. for(var vm in _viewmodes)
  789. if(vm != cur_vm && _viewmodes[vm] > _viewmodes[cur_vm] && _viewmodes[vm] < $(window).width())
  790. viewmode = vm;
  791. // ajax load card's node
  792. if(typeof matches[1] !== undefined && viewmode){
  793. $.event.trigger('loading-content');
  794. $.getJSON(_settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+matches[1],
  795. {viewmode:viewmode},
  796. function(json){
  797. //trace('json', json);
  798. $.event.trigger('loaded-content');
  799. previewLoaded(json);
  800. });
  801. }
  802. };
  803. function previewLoaded(json){
  804. var $modal = $('<div>').addClass('modal-content').append(json.node);
  805. var $modal_wrapper = $('.modal-wrapper');
  806. if(!$modal_wrapper.size())
  807. $modal_wrapper = $('<div>').addClass('modal-wrapper').append($('<div>').addClass('modal-bg')).appendTo('body');
  808. $modal_wrapper
  809. .append($modal)
  810. .bind('click', function(event) {
  811. _previewIsOpen = false;
  812. $(this).remove();
  813. });
  814. $modal.bind('click', function(event) {
  815. event.stopPropagation();
  816. });
  817. _previewIsOpen = true;
  818. initCards('.modal-content');
  819. $.event.trigger({ type : 'previewloaded', container : '.modal-content'});
  820. };
  821. /**
  822. * GRID
  823. */
  824. function moveGridFocus(event, side){
  825. var $old_focused = $('#content .search-results, #content .actuality-items')
  826. .children('.node.focused').first();
  827. var $new_focused;
  828. switch(side){
  829. case 'r':
  830. $new_focused = $old_focused.next();
  831. break;
  832. case 'l':
  833. $new_focused = $old_focused.prev();
  834. break;
  835. case 'u':
  836. case 'd':
  837. var dir = side == "d" ? 1 : -1;
  838. var column = $old_focused.attr('column');
  839. while( ($new_focused == undefined || !$new_focused.size()) && column > 0){
  840. $new_focused = $('.node[column='+column+'][line='+(parseInt($old_focused.attr('line'))+dir)+']');
  841. column --;
  842. }
  843. break;
  844. }
  845. focusCard($new_focused);
  846. docScrollTo($new_focused);
  847. };
  848. function focusCard($card){
  849. // trace('theme :: focusCard', $card);
  850. if(!$card.size() || $card.is('.focused') || $card.parents('.modal-content').size())
  851. return;
  852. $('#content .search-results, #content .actuality-items')
  853. .children('.node.focused')
  854. .removeClass('focused');
  855. $card.addClass('focused');
  856. if(_previewIsOpen){
  857. previewCard($card);
  858. }
  859. $card.trigger('focused');
  860. };
  861. /**
  862. * lazyloadimages
  863. */
  864. // function initLazyLoad(context){
  865. // $('figure:first-child img.lazy', context).lazyload();//{
  866. // container:'#content'
  867. // });
  868. // TODO: propage this event to the card near it to anticipate the mouseenter
  869. // $(context).bind('mousemove', showLazyLoadedImages);
  870. // };
  871. function showLazyLoadedImages(context){
  872. //trace('MaterioBaseTheme :: initLazyLoad : mouseenter', this);
  873. var $this = $(context);
  874. if( !$this.is('.lazy-processed') ){
  875. $this
  876. .addClass('lazy-processed')
  877. // .find('figure img.lazy')
  878. .find('img.lazy')
  879. .each(function(index){
  880. var $img = $(this);
  881. $img.attr('src', $img.attr('data-original')).removeAttr('data-original');
  882. });
  883. setTimeout(function(){
  884. $this.addClass('image-ready');
  885. }, 300);
  886. }
  887. };
  888. /**
  889. * prepareAssociatedMaterials
  890. */
  891. function prepareAssociatedMaterials(card){
  892. // trace('prepareAssociatedMaterials', card);
  893. $('.field-name-field-materiau-ref a:not(.prepared)', card).addClass("prepared").bind('click', onClickAssociatedMaterial);
  894. };
  895. /**
  896. * onClickAssociatedMaterial
  897. */
  898. function onClickAssociatedMaterial(event){
  899. // trace("onClickAssociatedMaterial");
  900. event.preventDefault();
  901. var $this = $(this);
  902. // trace('href', $(this).attr('href'));
  903. var nid = $this.attr('href').match(/^\/(fr|en)\/node\/(\d+)$/)[2];
  904. // trace("nid", nid);
  905. var $prt = $this.parents('.node-materiau');
  906. if($prt.parent().is('.modal-content')){
  907. // if we are on preview mode
  908. // remove already loaded associated
  909. $prt.parent().find('.node-'+nid+'.associated').remove();
  910. loadAssociatedNode($prt, nid);
  911. }else{
  912. // if we are on normal grid mode
  913. var $n = $prt.nextUntil('.node-materiau:not(.associated)').filter('.node-'+nid);
  914. // trace('n', $n);
  915. if($n.size()){
  916. // trace('focus', nid);
  917. // focus on already loaded node
  918. focusCard($n);
  919. // docScrollTo($isnodeexisting);
  920. }else{
  921. // trace('load associated', nid);
  922. loadAssociatedNode($prt, nid);
  923. }
  924. }
  925. return false;
  926. };
  927. function loadAssociatedNode($prt, nid){
  928. // console.log('loadAssociatedNode | nid = '+nid);
  929. var viewmode = $prt.attr('class').match(/vm-([^\s]+)/);
  930. // trace('viewmode match', viewmode);
  931. // if(!_isloadingresults){
  932. $.event.trigger('loading-content');
  933. var url = _settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+nid;
  934. $.getJSON(url,
  935. {viewmode:viewmode[1]},
  936. function(json){
  937. //trace('json', json);
  938. $.event.trigger('loaded-content');
  939. displayAssociated($prt, $(json.node));
  940. $.event.trigger({
  941. type : 'resultscompleted',
  942. container : '#content .actuality-items, #content .search-results'
  943. });
  944. });
  945. // }
  946. };
  947. function displayAssociated($prt, $n){
  948. $n.addClass('associated').addClass('just-added');
  949. $prt.after($n);
  950. initCards($prt.parent());
  951. (function($n){
  952. setTimeout(function(){
  953. $n.removeClass('just-added');
  954. focusCard($n);
  955. }, 100);
  956. }($n));
  957. };
  958. /**
  959. * sideSwitcher
  960. */
  961. function sideSwitcher(event, delta){
  962. var $sides = $('.side', event.currentTarget);
  963. if($sides.length > 1){
  964. if( typeof delta == 'undefined'){
  965. var delta = 0;
  966. $sides.each(function(i) {
  967. if($(this).is('.op-visible')){
  968. delta = i+1;
  969. return false;
  970. }
  971. });
  972. delta = delta == 0 ? 1 : (delta == $sides.length ? 0 : delta);
  973. }
  974. // google analytics
  975. $.event.trigger({
  976. type : 'record-stat',
  977. categorie : 'Card event',
  978. action : 'side switch',
  979. label : delta
  980. });
  981. $sides.addClass('op-hidden').removeClass('op-visible')
  982. .eq(delta).removeClass('op-hidden').addClass('op-visible');
  983. }
  984. };
  985. /**
  986. * columnsPage
  987. */
  988. function columnsPage($elmt, cw, ch){
  989. // trace('columnsPage');
  990. var cls = Math.ceil($elmt.h()/ch);
  991. $elmt
  992. .addClass('columnized')
  993. .width(cw*cls)
  994. .columnize({
  995. width:cw,
  996. height:ch,
  997. lastNeverTallest:true
  998. });
  999. if(cls > 1){
  1000. $elmt.find('.column').each(function(index) {
  1001. var $this = $(this);
  1002. if(!$this.find('*').length){
  1003. $this.prev().addClass('last');
  1004. $this.remove();
  1005. return true;
  1006. }
  1007. });
  1008. $elmt.find('.column').each(function(index) {
  1009. var $this = $(this);
  1010. if(!$this.is('.first'))
  1011. $this.children('*:first-child').prepend('<span cw="'+cw+'" col="'+(index-1)+'" class="column-switcher prev-column">‹</span> ...');
  1012. if(!$this.is('.last'))
  1013. $this.children('*:last-child').append('... <span cw="'+cw+'" col="'+(index+1)+'" class="column-switcher next-column">›</span>');
  1014. });
  1015. $('.column-switcher', $elmt).bind('click', onColumnSwitcherClick);
  1016. }
  1017. };
  1018. function onColumnSwitcherClick(event){
  1019. event.preventDefault();
  1020. //trace('onColumnSwitcherClick', event);
  1021. var $this = $(event.currentTarget),
  1022. $columnized = $this.parents('.columnized');
  1023. // google analytics
  1024. $.event.trigger({
  1025. type : 'record-stat',
  1026. categorie : 'Card event',
  1027. action : 'column switch',
  1028. label : $this.attr('col')
  1029. });
  1030. $columnized.css({
  1031. marginLeft : -1 * $this.attr('cw') * $this.attr('col') +'px'
  1032. });
  1033. return false;
  1034. }
  1035. /**
  1036. * initViewmodes
  1037. */
  1038. function initViewmodes(){
  1039. checkViewmodesResponsive();
  1040. };
  1041. function checkViewmodesResponsive(){
  1042. if(_480_768()){
  1043. if($('.viewmode-link.active').is('.viewmode-cardfull')){
  1044. $('.viewmode-cardbig').trigger('click');
  1045. }
  1046. }else if(_max_480()){
  1047. if($('.viewmode-link.active').is('.viewmode-cardbig, .viewmode-cardfull')){
  1048. $('.viewmode-cardmedium').trigger('click');
  1049. }
  1050. }
  1051. };
  1052. function getCurrentViewmode(){
  1053. for(var vm in _viewmodes)
  1054. if($('.viewmode-link.active.viewmode-'+vm).size())
  1055. return vm;
  1056. };
  1057. /**
  1058. * FLAGS
  1059. */
  1060. function initFlagsEvent(){
  1061. $('.bookmarks, .mylists .flaged').children('.node:not(.listened)')
  1062. .bind('mouseenter mousemove click mouseleave', onCardEventDispatcher)
  1063. // .each(function(event){ initLayoutCardDispatcher($(this)); })
  1064. .addClass('listened');
  1065. };
  1066. function onAfterFlaging(event){
  1067. //trace('MaterioBaseTheme :: onAfterFlaging', event);
  1068. // WARNING to use event variables i had to hack flag.js from flag module (change the event declaration)
  1069. var $target = $(event.link).parents('article.node');
  1070. if(event.flagStatus == 'flag'){
  1071. $target.addClass('flaged');
  1072. }else if(event.flagStatus == 'unflag'){
  1073. if($('.flag-lists-entity-links a.unflag-action', $target).length == 0)
  1074. $target.removeClass('flaged');
  1075. }
  1076. };
  1077. function onMybookmarksBlockUpdate(event){
  1078. initFlagsEvent();
  1079. initLayout();
  1080. };
  1081. function onClickList(event){
  1082. //trace('onClickList', event);
  1083. var $link = $(event.currentTarget).addClass('active'),
  1084. name = $link.attr('name'),
  1085. $block = $link.parents('.block'),
  1086. $flaged = $('.flaged.'+name, $block).addClass('active');
  1087. $link.siblings().removeClass('active');
  1088. $flaged.siblings().removeClass('active');
  1089. createCookie('materiomyflaglistsopened', name, 1);
  1090. $flaged.parents('.mylists').height($flaged.h());
  1091. initLayout();
  1092. };
  1093. function onMyListsBlockUpdate(event){
  1094. //trace('MaterioBaseTheme :: onMyListsBlockUpdate', event);
  1095. initFlagsEvent();
  1096. // initLazyLoad(this);
  1097. // TODO: refresh contents (search results) to see new flaglist links.
  1098. initLayout();
  1099. };
  1100. function onMyListsBlockBuilded(event){
  1101. //trace('MaterioBaseTheme :: onMyListsBlockBuilded', event);
  1102. // initLazyLoad(event.block);
  1103. showLazyLoadedImages(event.block);
  1104. };
  1105. /**
  1106. * cards bookmark
  1107. */
  1108. // MaterioBaseTheme.prototype.init_layout_bookmark = function($card){
  1109. // trace('initLayoutCardBig');
  1110. // };
  1111. MaterioBaseTheme.prototype.on_mouseenter_bookmark = function(event){
  1112. //trace('on_mouseenter_bookmark', event);
  1113. _$tooltip
  1114. .html($('.group-header', this).clone())
  1115. .css({
  1116. top:event.pageY - _$tooltip.h() -5,//- event.layerY,
  1117. left:event.pageX + 5 + ($(this).w() - event.layerX)
  1118. })
  1119. .removeClass('op-hidden').addClass('op-visible');
  1120. };
  1121. MaterioBaseTheme.prototype.on_mousemove_bookmark = function(event){
  1122. // trace('on_mousemove_Card', event);
  1123. // if(event.layerX)
  1124. // horiHoverImagesSwitcher(event);
  1125. _$tooltip
  1126. .css({
  1127. top:event.pageY - _$tooltip.h() -5,// - event.layerY,
  1128. left:event.pageX + 5 + ($(this).w() - event.layerX)
  1129. });
  1130. };
  1131. // MaterioBaseTheme.prototype.on_click_bookmark = function(event){
  1132. // trace('on_click_bookmark', event);
  1133. // };
  1134. MaterioBaseTheme.prototype.on_mouseleave_bookmark = function(event){
  1135. // trace('on_mouseleave_Card', event);
  1136. $('.images img.op-visible', this)
  1137. .removeClass('op-visible').addClass('op-hidden')
  1138. .eq(0)
  1139. .removeClass('op-hidden').addClass('op-visible');
  1140. _$tooltip.removeClass('op-visible').addClass('op-hidden');
  1141. };
  1142. /**
  1143. * keyboradshortcuts
  1144. */
  1145. function initKeyboardShortcuts(){
  1146. $(document)
  1147. .bind('keydown', 'Shift+:',shortcut_focusSearchField)
  1148. .bind('keydown', '/',shortcut_focusSearchField)
  1149. .bind('keydown', 'Alt+1',shortcut_viewmodeSmall)
  1150. .bind('keydown', 'Alt+2',shortcut_viewmodeMedium)
  1151. .bind('keydown', 'Alt+3',shortcut_viewmodeBig)
  1152. .bind('keydown', 'Alt+4',shortcut_viewmodeFull)
  1153. .bind('keydown', 'space',shortcut_togglePreview)
  1154. .bind('keydown', 'esc',shortcut_closeModaleContent)
  1155. .bind('keydown', 'up',shortcut_onUpArrow)
  1156. .bind('keydown', 'right',shortcut_onRightArrow)
  1157. .bind('keydown', 'down',shortcut_onDownArrow)
  1158. .bind('keydown', 'left',shortcut_onLeftArrow);
  1159. };
  1160. function shortcut_focusSearchField(e){
  1161. // trace("focusSearchField");
  1162. if($('#edit-searchfield').size()){
  1163. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1164. stat_event.action = 'slash';
  1165. stat_event.label = 'Focus on search text field';
  1166. $.event.trigger(stat_event);
  1167. $('#edit-searchfield').focus();
  1168. e.stopPropagation();
  1169. e.preventDefault();
  1170. return false;
  1171. }
  1172. };
  1173. function shortcut_viewmodeSmall(e){
  1174. if($('a.viewmode-link.viewmode-cardsmall').size()){
  1175. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1176. stat_event.action = 'Alt+1';
  1177. stat_event.label = 'Change view mode : card small';
  1178. $.event.trigger(stat_event);
  1179. $('a.viewmode-link.viewmode-cardsmall').click();
  1180. return false;
  1181. }
  1182. };
  1183. function shortcut_viewmodeMedium(e){
  1184. if($('a.viewmode-link.viewmode-cardmedium').size()){
  1185. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1186. stat_event.action = 'Alt+2';
  1187. stat_event.label = 'Change view mode : card medium';
  1188. $.event.trigger(stat_event);
  1189. $('a.viewmode-link.viewmode-cardmedium').click();
  1190. return false;
  1191. }
  1192. };
  1193. function shortcut_viewmodeBig(e){
  1194. if($('a.viewmode-link.viewmode-cardbig').size()){
  1195. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1196. stat_event.action = 'Alt+3';
  1197. stat_event.label = 'Change view mode : card big';
  1198. $.event.trigger(stat_event);
  1199. $('a.viewmode-link.viewmode-cardbig').click();
  1200. return false;
  1201. }
  1202. };
  1203. function shortcut_viewmodeFull(e){
  1204. if($('a.viewmode-link.viewmode-cardfull').size()){
  1205. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1206. stat_event.action = 'Alt+4';
  1207. stat_event.label = 'Change view mode : card full';
  1208. $.event.trigger(stat_event);
  1209. $('a.viewmode-link.viewmode-cardfull').click();
  1210. return false;
  1211. }
  1212. };
  1213. function shortcut_togglePreview(e){
  1214. // trace('theme :: shortcut_togglePreview', e);
  1215. $.event.trigger({
  1216. type : 'record-stat',
  1217. categorie : 'Shortcuts',
  1218. action : 'Space',
  1219. label : 'Space toggle preview'
  1220. });
  1221. if(_previewIsOpen){
  1222. if($('body>.modal-wrapper').size()){
  1223. $('body>.modal-wrapper').click();
  1224. _previewIsOpen = false;
  1225. return false;
  1226. }
  1227. }else{
  1228. previewCard($('#content .search-results, #content .actuality-items').children('.node.focused:first'));
  1229. }
  1230. };
  1231. function shortcut_closeModaleContent(e){
  1232. if($('body>.modal-wrapper').size()){
  1233. $.event.trigger({
  1234. type : 'record-stat',
  1235. categorie : 'Shortcuts',
  1236. action : 'Esc',
  1237. label : 'Esc from modal content'
  1238. });
  1239. $('body>.modal-wrapper').click();
  1240. _previewIsOpen = false;
  1241. return false;
  1242. }
  1243. };
  1244. function shortcut_onUpArrow(e){
  1245. // trace('theme :: shortcut_onTopArrow', e);
  1246. moveGridFocus(e, 'u');
  1247. };
  1248. function shortcut_onRightArrow(e){
  1249. // trace('theme :: shortcut_onRightArrow', e);
  1250. moveGridFocus(e, 'r');
  1251. };
  1252. function shortcut_onDownArrow(e){
  1253. // trace('theme :: shortcut_onDownArrow', e);
  1254. moveGridFocus(e, 'd');
  1255. };
  1256. function shortcut_onLeftArrow(e){
  1257. // trace('theme :: shortcut_onLeftArrow', e);
  1258. moveGridFocus(e, "l");
  1259. };
  1260. /**
  1261. * Misc
  1262. */
  1263. function onResizeWindow(e){
  1264. clearInterval(_resizeTimer);
  1265. _resizeTimer = setTimeout(function(){
  1266. initLayout();
  1267. checkViewmodesResponsive();
  1268. setUpGrid("#content .actuality-items, #content .search-results");
  1269. }, 200);
  1270. };
  1271. /**
  1272. * Statics
  1273. */
  1274. function initMembershipForm() {
  1275. // console.log("initMembershipForm");
  1276. switch(window.location.hash){
  1277. case '#a':
  1278. $('#edit-submitted-column-left-membership-options-1').attr('checked', 'checked');
  1279. // $options.trigger('change');
  1280. break;
  1281. case '#b':
  1282. $('#edit-submitted-column-left-membership-options-2').attr('checked', 'checked');
  1283. break;
  1284. case '#c':
  1285. $('#edit-submitted-column-left-membership-options-3').attr('checked', 'checked');
  1286. break;
  1287. // default:
  1288. // switchMembershipShipFormFields($options);
  1289. // break
  1290. }
  1291. $('.webform-component--column-left--membership-options') // input.form-radio
  1292. .change(function(event){
  1293. // trace('changed');
  1294. // console.log("Changed");
  1295. // replaced by conditional built in webform
  1296. // if( $('input[type="radio"]:checked', this).is('#edit-submitted-column-left-membership-options-3') ){
  1297. // $('.webform-component-column-right--collaborators').show();
  1298. // }else{
  1299. // $('.webform-component-column-right--collaborators').hide();
  1300. // }
  1301. $('div.form-item.selected', this).removeClass('selected');
  1302. $('input[type="radio"]:checked', this).parents('div.form-item').addClass('selected');
  1303. })
  1304. .trigger('change');
  1305. // $('#webform-component-column-left--membership-options input[checked="checked"]').parents('div.form-item').addClass('selected');
  1306. };
  1307. /** helpers */
  1308. $.fn.h = function(){
  1309. if(this.css('height') == undefined)
  1310. return 0;
  1311. return parseInt(this.css('height')) + parseInt(this.css('padding-top')) + parseInt(this.css('padding-bottom'));
  1312. };
  1313. $.fn.w = function(){
  1314. if(this.css('width') == undefined)
  1315. return 0;
  1316. return parseInt(this.css('width')) + parseInt(this.css('padding-left')) + parseInt(this.css('padding-right'));
  1317. };
  1318. function getDocHeight() {
  1319. var D = document;
  1320. return Math.max(
  1321. Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
  1322. Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
  1323. Math.max(D.body.clientHeight, D.documentElement.clientHeight)
  1324. );
  1325. };
  1326. // http://andylangton.co.uk/articles/javascript/get-viewport-size-javascript/
  1327. function viewport() {
  1328. var e = window, a = 'inner';
  1329. if (!('innerWidth' in window )) {
  1330. a = 'client';
  1331. e = document.documentElement || document.body;
  1332. }
  1333. return { width : e[ a+'Width' ] , height : e[ a+'Height' ] };
  1334. };
  1335. /**
  1336. * Search Form
  1337. */
  1338. function initDoubleSearchFormTabs() {
  1339. var $searchblock = $('#block-materio-search-api-materio-search-api-search');
  1340. var $tabs = $('<div>')
  1341. .addClass('searchform-tabs')
  1342. .prependTo($searchblock.children('.inner'));
  1343. $('h4.form-title', $searchblock).each(function(index, el) {
  1344. $(el)
  1345. .attr('index', index)
  1346. .bind('click', function(e){
  1347. var $this = $(this);
  1348. var index = $this.attr('index');
  1349. // show the right tab
  1350. $('h4.form-title', $tabs).removeClass('active');
  1351. $this.addClass('active');
  1352. // show the right form
  1353. $('.msa-form-wrapper', $searchblock)
  1354. .removeClass('active')
  1355. .eq(index).addClass('active');
  1356. // record cookie
  1357. createCookie('default-search-form', index);
  1358. initLayout();
  1359. })
  1360. .appendTo($tabs);
  1361. });
  1362. // read from cookie what was the last search form visible
  1363. var defaultIndex = readCookie('default-search-form') || 0;
  1364. // show default tab
  1365. $('h4.form-title', $tabs).eq(defaultIndex).addClass('active');
  1366. $('.msa-form-wrapper', $searchblock).eq(defaultIndex).addClass('active');
  1367. $searchblock.addClass('tabed');
  1368. initLayout();
  1369. };
  1370. /**
  1371. * Forms
  1372. */
  1373. function initForms(){
  1374. $('#edit-searchfield:not(.processed)')
  1375. .bind('focus', function(event) {
  1376. var $this = $(this);
  1377. //$this.attr('value', 'test');
  1378. // trace('value', $this.val());
  1379. // trace('default', $this.attr('default'));
  1380. if($this.val() == $this.attr('default'))
  1381. $this.val('');
  1382. })
  1383. .bind('focusout', function(event) {
  1384. var $this = $(this);
  1385. if($this.val() == "")
  1386. $this.val($this.attr('default'));
  1387. })
  1388. .addClass('processed');
  1389. hideLabelsFromRegisterForm();
  1390. };
  1391. function hideLabelsFromRegisterForm () {
  1392. var $this, id,label, description;
  1393. $('input.form-text', '#block-user-login, #block-materio-user-user-register, .pane-materio-user-user-register, #block-materio-user-user-createaccount').each(function(i) {
  1394. $this = $(this);
  1395. id = $this.attr('id');
  1396. label = $('label[for='+id+']').hide().text();
  1397. description = $this.parent().find('.description').hide().text();
  1398. if($this.attr('placeholder') == '')
  1399. $this.attr('placeholder',label);
  1400. $this.attr('title',description);
  1401. });
  1402. };
  1403. function onAjaxRegisterBlockLoaded (event) {
  1404. // console.log('onAjaxRegisterBlockLoaded');
  1405. hideLabelsFromRegisterForm();
  1406. };
  1407. /**
  1408. * cookies
  1409. */
  1410. function createCookie(name,value,days) {
  1411. if (days) {
  1412. var date = new Date();
  1413. date.setTime(date.getTime()+(days*24*60*60*1000));
  1414. var expires = "; expires="+date.toGMTString();
  1415. }
  1416. else var expires = "";
  1417. document.cookie = name+"="+value+expires+"; path=/";
  1418. };
  1419. function readCookie(name) {
  1420. var nameEQ = name + "=";
  1421. var ca = document.cookie.split(';');
  1422. for(var i=0;i < ca.length;i++) {
  1423. var c = ca[i];
  1424. while (c.charAt(0)==' ') c = c.substring(1,c.length);
  1425. if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  1426. }
  1427. return null;
  1428. };
  1429. function eraseCookie(name) {
  1430. createCookie(name,"",-1);
  1431. };
  1432. /**
  1433. * google analytics
  1434. */
  1435. function onRecordStat(event){
  1436. //trace('onRecordStat', event);
  1437. // path, category, action, opt_label, opt_value
  1438. if(typeof _gaq !== 'undefined'){
  1439. if(event.path){
  1440. _gaq.push(['_trackPageview', event.path]);
  1441. }else{
  1442. _gaq.push(['_trackEvent', event.categorie, event.action, event.label, event.value]);
  1443. }
  1444. }
  1445. };
  1446. /**
  1447. * docScrollTo
  1448. */
  1449. function docScrollTo($e){
  1450. // $(document).scrollTop($e.offset().top);
  1451. if($e.size())
  1452. $('html,body').animate({
  1453. scrollTop: $e.offset().top - $(window).height()*0.5 + $e.height()*0.5
  1454. }, 500);
  1455. };
  1456. init();
  1457. };
  1458. $(document).ready(function() {
  1459. var materiobasetheme = new MaterioBaseTheme();
  1460. });
  1461. /**
  1462. * Attach collapse behavior to the feedback form block.
  1463. */
  1464. // Drupal.behaviors.feedbackForm = {
  1465. // attach: function (context) {
  1466. // $('#block-feedback-form', context).once('feedback', function () {
  1467. // var $block = $(this);
  1468. // $block.find('span.feedback-link')
  1469. // .prepend('<span id="feedback-form-toggle">feedback</span> ')
  1470. // .css('cursor', 'pointer')
  1471. // .toggle(function () {
  1472. // Drupal.feedbackFormToggle($block, false);
  1473. // },
  1474. // function() {
  1475. // Drupal.feedbackFormToggle($block, true);
  1476. // }
  1477. // );
  1478. // $block.find('form').hide();
  1479. // $block.show();
  1480. // });
  1481. // }
  1482. // };
  1483. //
  1484. /**
  1485. * Collapse or uncollapse the feedback form block.
  1486. */
  1487. // Drupal.feedbackFormToggle = function ($block, enable) {
  1488. // $block.find('form').slideToggle('medium');
  1489. // if (enable) {
  1490. // $('#feedback-form-toggle', $block).html('feedback');
  1491. // }
  1492. // else {
  1493. // $('#feedback-form-toggle', $block).html('feedback (close)');
  1494. // }
  1495. // };
  1496. })(jQuery);