script.js 56 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747
  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. // Formations
  303. $('.panel-pane.formations .group-content-wrapper', '#home-v2')
  304. .attr('data-50-bottom-top', 'transform:translateX(20em);opacity:0;')
  305. .attr('data-center-top', 'transform[quadratic]:translateX(0em);opacity:1;');
  306. // Formations
  307. $('.panel-pane.services .group-content-wrapper', '#home-v2')
  308. .attr('data-50-bottom-top', 'transform:translateX(20em);opacity:0;')
  309. .attr('data-center-top', 'transform[quadratic]:translateX(0em);opacity:1;');
  310. //Publication node news
  311. $('.panel-pane.publication .views-row', '#home-v2').each(function(i, e){
  312. $(this)
  313. // .attr('data-anchor-target', "#news-pane")
  314. .attr('data--'+i*100+'-bottom-top', 'opacity:0;')
  315. .attr('data-'+i*50+'-center-center', 'opacity:1;');
  316. });
  317. _skrollr = skrollr.init({
  318. skrollrBody:"root"
  319. });
  320. /*
  321. //The options (second parameter) are all optional. The values shown are the default values.
  322. skrollr.menu.init(_skrollr, {
  323. //skrollr will smoothly animate to the new position using `animateTo`.
  324. animate: true,
  325. //The easing function to use.
  326. easing: 'outCubic',
  327. //Multiply your data-[offset] values so they match those set in skrollr.init
  328. scale: 2,
  329. //How long the animation should take in ms.
  330. duration: function(currentTop, targetTop) {
  331. //By default, the duration is hardcoded at 500ms.
  332. // return 500;
  333. //But you could calculate a value based on the current scroll position (`currentTop`) and the target scroll position (`targetTop`).
  334. return Math.abs(currentTop - targetTop)*0.8;
  335. },
  336. //If you pass a handleLink function you'll disable `data-menu-top` and `data-menu-offset`.
  337. //You are in control where skrollr will scroll to. You get the clicked link as a parameter and are expected to return a number.
  338. // handleLink: function(link) {
  339. // return 400;//Hardcoding 400 doesn't make much sense.
  340. // },
  341. //By default skrollr-menu will only react to links whose href attribute contains a hash and nothing more, e.g. `href="#foo"`.
  342. //If you enable `complexLinks`, skrollr-menu also reacts to absolute and relative URLs which have a hash part.
  343. //The following will all work (if the user is on the correct page):
  344. //http://example.com/currentPage/#foo
  345. //http://example.com/currentDir/currentPage.html?foo=bar#foo
  346. ///?foo=bar#foo
  347. complexLinks: false,
  348. //This event is triggered right before we jump/animate to a new hash.
  349. // change: function(newHash, newTopPosition) {
  350. // //Do stuff
  351. // },
  352. //Add hash link (e.g. `#foo`) to URL or not.
  353. updateUrl: false //defaults to `true`.
  354. });
  355. */
  356. // }
  357. };
  358. /**
  359. * layout
  360. */
  361. function initLayout(){
  362. trace("initLayout");
  363. // if(!_max_768()){
  364. var height = $('#header').h() + $('#tasks').h();
  365. // if(!_max_480() && !_touch ){
  366. height += $('#utilities').h();//+15;
  367. // }
  368. //$('#main').css('margin-top', height+15);
  369. // $('#container').css('padding-top', height+15);
  370. if(!$('html').is(".ie8")){
  371. $('#container').animate({'padding-top':height}, 300);
  372. }
  373. // }
  374. };
  375. /**
  376. * infinit scroll
  377. */
  378. function initInfinitScroller(){
  379. // trace("initInfinitScroller");
  380. $.event.trigger({
  381. type : 'init-scroller-pager',
  382. pager : $('ul.pager', '#content')
  383. });
  384. $(document).bind('scroll', function(event){
  385. // trace('scroll event binded');
  386. checkInfinitScroller();
  387. });
  388. };
  389. function checkInfinitScroller(){
  390. // trace('checkInfinitScroller');
  391. // if(!_touch){
  392. // }else{
  393. if($(window).scrollTop() + $(window).height() > getDocHeight() - 200) {
  394. infinitScrollPager();
  395. }
  396. // }
  397. };
  398. function infinitScrollPager(){
  399. // trace('MaterioBaseTheme :: infinitScrollPager');
  400. if($('ul.pager', '#content').length){
  401. var $nextpage = $('ul.pager .pager-current', '#content').next(),
  402. href = $('a', $nextpage).attr('href');
  403. if(href){
  404. $.event.trigger({ type : 'record-stat', path : href }); // google analytics
  405. $.event.trigger({ type : 'load-scroller-pager', href : href });
  406. }
  407. }
  408. };
  409. /**
  410. * events
  411. */
  412. function initEvents(){
  413. //trace('MaterioBaseTheme :: initEvents');
  414. $(document)
  415. .bind('init-layout', initLayout)
  416. .bind('loading-content', onLoadingContent)
  417. .bind('loaded-content', onLoadedContent)
  418. .bind('resultschanged', onResultsChanged)
  419. .bind('resultscompleted', onResultsCompleted)
  420. .bind('mybookmarks-block-updated', onMybookmarksBlockUpdate)
  421. .bind('mylists-block-builded', onMyListsBlockBuilded)
  422. .bind('mylists-block-updated', onMyListsBlockUpdate)
  423. .bind('flagGlobalAfterLinkUpdate', onAfterFlaging)
  424. .bind('record-stat', onRecordStat)
  425. .bind('view-mode-changed', onViewModeChanged)
  426. .bind('ajax-register-block-loaded', onAjaxRegisterBlockLoaded);
  427. $(window)
  428. .bind('resize', onResizeWindow);
  429. initFlagsEvent();
  430. $('#block-user-login h2, #block-menu-menu-top-menu h2').bind('click', function(event) {
  431. event.preventDefault();
  432. $(this).parent('.block').toggleClass('hovered');
  433. $('.hovered').not($(this).parent('.block')).removeClass('hovered');
  434. return false;
  435. });
  436. $('#block-materio-search-api-materio-search-api-viewmode .viewmode-link').bind('vm-clicked-active', function(event) {
  437. $(this).parents('.block').toggleClass('hovered');
  438. $('.hovered').not($(this).parents('.block')).removeClass('hovered');
  439. });
  440. $('#block-materio-search-api-materio-search-api-viewmode .viewmode-link').bind('vm-clicked', function(event) {
  441. $(this).parents('.block').removeClass('hovered');
  442. $('.hovered').not($(this).parents('.block')).removeClass('hovered');
  443. });
  444. };
  445. function onLoadingContent(event){
  446. _$content.addClass('faded');
  447. $('#materio-search-api-search-form, #materio-search-api-advanced-search-form').addClass('loading');
  448. };
  449. function onLoadedContent(event){
  450. // trace('MaterioBaseTheme :: onLoadedContent',event);
  451. _$content.removeClass('faded');
  452. $('#materio-search-api-search-form, #materio-search-api-advanced-search-form').removeClass('loading');
  453. };
  454. function onResultsChanged(event){
  455. trace('MaterioBaseTheme :: onResultsChanged',event);
  456. $(document).scrollTop(0);
  457. focusCard($('#content .search-results, #content .actuality-items').children('.node:first-child'));
  458. onResultsCompleted(event);
  459. };
  460. function onResultsCompleted(event){
  461. // trace('theme :: onResultsCompleted', event);
  462. checkInfinitScroller();
  463. if(event.container != undefined){
  464. // trace('theme :: container is ok : '+event.container)
  465. setTimeout(function(){ // why this time out ?
  466. initCards(event.container);
  467. setUpGrid(event.container);
  468. }, 100);
  469. }
  470. };
  471. function initCards(container){
  472. trace('theme :: initCards', container);
  473. var $container = $(container);
  474. $container.children('.node:not(.listened)')
  475. .bind('mouseenter focused mousemove click mouseleave', onCardEventDispatcher)
  476. .each(function(i){
  477. protectFigures(this);
  478. if(_isLoggedIn){
  479. if(!$container.is('.modal-content') && !$(this).is('.vm-cardfull')){
  480. // do not add preview btn if we are already on a preview
  481. initPreview(this);
  482. }else{
  483. // if we are on preview mode add a close btn (only for associated materials)
  484. if(!$(this).is(":first-child")){
  485. var $closebtn = $('<section><i class="icon-remove"></i></section>');
  486. $closebtn.bind('click', function(){
  487. $(this).parents('.node-materiau').remove();
  488. });
  489. $('nav.nav', this).append($closebtn);
  490. }
  491. }
  492. }
  493. })
  494. .addClass('listened');
  495. };
  496. function setUpGrid(container){
  497. var $card, top, old_top, col = 0, line = 0;
  498. $(container).children('.node')
  499. .each(function(i){
  500. $card = $(this);
  501. top = $card.offset().top;
  502. if(old_top != top){
  503. line ++;
  504. old_top = top;
  505. col = 0;
  506. }
  507. col ++;
  508. $card.attr('column', col).attr('line', line);
  509. });
  510. };
  511. function onViewModeChanged(event){
  512. if(_isBreveMateriauNodePage){
  513. // if(!_isloadingresults){
  514. $.event.trigger('loading-content');
  515. var url = _settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+_themeSettings.node_nid;
  516. $.getJSON(url,
  517. function(json){
  518. //trace('json', json);
  519. $.event.trigger('loaded-content');
  520. $('#content>.inner-content').html(json.node);
  521. $.event.trigger({ type : 'resultschanged', container : '#content>.inner-content'});
  522. });
  523. // }
  524. }
  525. };
  526. /**
  527. * CARDS
  528. */
  529. function onCardEventDispatcher(event){
  530. // trace('onCardEvent', event);
  531. var vmode = event.currentTarget.className.match(/vm-([a-z|A-Z]+)/);
  532. var cf = 'on_'+event.type+'_card';
  533. var f = 'on_'+event.type+'_'+vmode[1];
  534. if(typeof _this[cf] == 'function')
  535. _this[cf].call(this, event);
  536. if(typeof _this[f] == 'function')
  537. _this[f].call(this, event);
  538. };
  539. // function initLayoutCardDispatcher($card){
  540. // // trace('$card', $card);
  541. // var vmode = $card.attr('class').match(/vm-([a-z|A-Z]+)/);
  542. // var f = 'init_layout_'+vmode[1];
  543. // if(typeof _this[f] == 'function')
  544. // _this[f].call(this, $card);
  545. // };
  546. /**
  547. * commons Cards
  548. */
  549. // MaterioBaseTheme.prototype.init_layout_card = function($card){
  550. // trace('initLayoutCardBig');
  551. // };
  552. // MaterioBaseTheme.prototype.on_mouseenter_card = function(event){
  553. // //trace('MaterioBaseTheme :: on_mouseenter_card', event);
  554. // };
  555. MaterioBaseTheme.prototype.on_mousemove_card = function(event){
  556. //trace('on_mousemove_Card', event);
  557. focusCard($(this));
  558. };
  559. // MaterioBaseTheme.prototype.on_click_card = function(event){
  560. // trace('on_click_card', event);
  561. // };
  562. // MaterioBaseTheme.prototype.on_mouseleave_card = function(event){
  563. // // trace('on_mouseleave_Card', event);
  564. // };
  565. /**
  566. * cards small
  567. */
  568. // MaterioBaseTheme.prototype.init_layout_cardsmall = function($card){
  569. // trace('initLayoutCardBig');
  570. // };
  571. MaterioBaseTheme.prototype.on_mouseenter_cardsmall = function(event){
  572. //trace('MaterioBaseTheme :: on_mouseenter_cardsmall', event);
  573. showLazyLoadedImages(event.currentTarget);
  574. };
  575. MaterioBaseTheme.prototype.on_focused_cardsmall = function(event){
  576. // trace('theme :: on_focused_cardsmall',event);
  577. v1 = $(this);
  578. v2 = v1.offset();
  579. _$tooltip
  580. .html($('.group-header', this).clone().addClass('smallcard'))
  581. .css({
  582. top:v2.top,//- event.layerY,
  583. left:v2.left + 5 + ($(this).w())// - event.layerX
  584. })
  585. .removeClass('op-hidden').addClass('op-visible');
  586. };
  587. MaterioBaseTheme.prototype.on_mousemove_cardsmall = function(event){
  588. // trace('on_mousemove_Card', event);
  589. horiHoverImagesSwitcher(event);
  590. _$tooltip
  591. .css({
  592. top:event.pageY - _$tooltip.h() -5,// - event.layerY,
  593. left:event.pageX + 5 + ($(this).w() - event.layerX)
  594. });
  595. };
  596. // MaterioBaseTheme.prototype.on_click_cardsmall = function(event){
  597. // trace('on_click_cardsmall', event);
  598. // };
  599. MaterioBaseTheme.prototype.on_mouseleave_cardsmall = function(event){
  600. // trace('on_mouseleave_Card', event);
  601. $('.images img.op-visible', this)
  602. .removeClass('op-visible').addClass('op-hidden')
  603. .eq(0)
  604. .removeClass('op-hidden').addClass('op-visible');
  605. if($(this).is('.focused'))
  606. _$tooltip.removeClass('op-visible').addClass('op-hidden');
  607. };
  608. /**
  609. * cards medium
  610. */
  611. // MaterioBaseTheme.prototype.init_layout_cardmedium = function($card){
  612. // trace('initLayoutCardMedium');
  613. // var ch = $card.h() - $('.group-header', $card).h() -30;
  614. // columnsPage($('.field-name-field-description, .field-name-body', $card), 210, ch);
  615. // };
  616. MaterioBaseTheme.prototype.on_mouseenter_cardmedium = function(event){
  617. // trace('on_mouseenter_cardmedium');
  618. // show lazy images
  619. showLazyLoadedImages(event.currentTarget);
  620. // columnize texts
  621. $card = $(event.currentTarget);
  622. if(!$('.columnized', $card).size() && !$('body').is('.role-7', 'role-2') ){
  623. var ch = $card.h() - $('.group-header', $card).h() -30;
  624. columnsPage($('.field-name-field-description, .field-name-body', $card), 210, ch);
  625. $('.group-side-4', $card).wrapInner('<div class="column-wrapper">').find('.field-item').addClass('dontsplit');
  626. columnsPage($('.group-side-4 .column-wrapper', $card), 210, ch);
  627. }
  628. // add associated materials links
  629. prepareAssociatedMaterials(event.currentTarget);
  630. };
  631. MaterioBaseTheme.prototype.on_mousemove_cardmedium = function(event){
  632. //trace('on_mousemove_cardmedium');
  633. horiHoverImagesSwitcher(event);
  634. };
  635. MaterioBaseTheme.prototype.on_click_cardmedium = function(event){
  636. trace('on_click_cardmedium', event);
  637. // if(!$(event.target).is('.flag') && !$(event.target).parent().is('.flag'))
  638. if($(event.target).is('.side') || $(event.target).parents('.side').length)
  639. sideSwitcher(event);
  640. };
  641. MaterioBaseTheme.prototype.on_mouseleave_cardmedium = function(event){
  642. v1 = $('.side.op-visible');
  643. if(v1.is('.oops','.upgrade') || $('.upgrade', v1).size()){
  644. sideSwitcher(event, 0);
  645. }
  646. };
  647. /**
  648. * cards Big
  649. */
  650. // MaterioBaseTheme.prototype.init_layout_cardbig = function($card){
  651. //trace('initLayoutCardBig');
  652. // columnsPage($('.field-name-field-description, .field-name-body', $card), 425, 270);
  653. // };
  654. MaterioBaseTheme.prototype.on_mouseenter_cardbig = function(event){
  655. // trace('on_mouseenter_cardbig');
  656. showLazyLoadedImages(event.currentTarget);
  657. if(!$('.columnized', event.currentTarget).size()){
  658. columnsPage($('.field-name-field-description, .field-name-body', event.currentTarget), 425, 270);
  659. $('.group-4', event.currentTarget).wrapInner('<div class="column-wrapper">').find('.field-item').addClass('dontsplit');
  660. columnsPage($('.group-4 .column-wrapper', event.currentTarget), 425, 270);
  661. }
  662. // add associated materials links
  663. prepareAssociatedMaterials(event.currentTarget);
  664. };
  665. MaterioBaseTheme.prototype.on_mousemove_cardbig = function(event){
  666. // trace('on_mousemove_cardbig');
  667. horiHoverImagesSwitcher(event);
  668. };
  669. MaterioBaseTheme.prototype.on_click_cardbig = function(event){
  670. //trace('on_click_cardbig');
  671. sideSwitcher(event);
  672. };
  673. MaterioBaseTheme.prototype.on_mouseleave_cardbig = function(event){
  674. if($('.side.op-visible').is('.oops') || $('.side.op-visible').is('.upgrade')){
  675. sideSwitcher(event, 0);
  676. }
  677. };
  678. /**
  679. * cards Full
  680. */
  681. // MaterioBaseTheme.prototype.init_layout_cardfull = function($card){
  682. // trace('initLayoutCardFull');
  683. // };
  684. MaterioBaseTheme.prototype.on_mouseenter_cardfull = function(event){
  685. // trace('on_mouseenter_cardfull');
  686. showLazyLoadedImages(event.currentTarget);
  687. // add associated materials links
  688. prepareAssociatedMaterials(event.currentTarget);
  689. };
  690. MaterioBaseTheme.prototype.on_mousemove_cardfull = function(event){
  691. // trace('on_mousemove_cardfull');
  692. horiHoverImagesSwitcher(event);
  693. };
  694. // MaterioBaseTheme.prototype.on_click_cardfull = function(event){
  695. // trace('on_click_cardfull');
  696. // };
  697. // MaterioBaseTheme.prototype.on_mouseleave_cardfull = function(event){
  698. // trace('on_mouseleave_cardfull');
  699. // };
  700. /**
  701. * horiHoverImagesSwitcher
  702. */
  703. function horiHoverImagesSwitcher(event){
  704. // trace('horiHoverImagesSwitcher', event);
  705. var $curtar = $(event.currentTarget);
  706. var layerX = (event.offsetX || event.pageX - $(event.target).offset().left);
  707. // trace("layerX", layerX);
  708. if(layerX && $curtar.is('.image-ready') ){ // && !$curtar.is('.image-buged')
  709. var $imgs = $('.group-images figure', event.currentTarget);
  710. if($(event.target).parents('.group-images').length){
  711. var imgw = $imgs.eq(0).w(),
  712. rapport = imgw/$imgs.length,
  713. mx = layerX > imgw ? imgw-1 : layerX,
  714. rapport_pos = Math.floor(mx / rapport);
  715. // trace('imgw = '+imgw+' | rapport_pos = '+rapport_pos+' | layerX = '+layerX);
  716. rapport_pos = rapport_pos < 0 ? 0 : ( rapport_pos > ($imgs.length - 1) ? $imgs.length - 1 : rapport_pos);
  717. // trace('rapport_pos', rapport_pos);
  718. if(!$imgs.eq(rapport_pos).is('.op-visible')){
  719. // google analytics
  720. $.event.trigger({
  721. type : 'record-stat',
  722. categorie : 'Card event',
  723. action : 'image slide switch',
  724. label : rapport_pos
  725. });
  726. $imgs
  727. .removeClass('op-visible').addClass('op-hidden')
  728. .eq(rapport_pos)
  729. .removeClass('op-hidden').addClass('op-visible');
  730. }
  731. }else{
  732. // $curtar.addClass('image-buged');
  733. $imgs.removeClass('op-visible').addClass('op-hidden');
  734. $imgs.eq(0).removeClass('op-hidden').addClass('op-visible');
  735. }
  736. }
  737. };
  738. /**
  739. * protectImages
  740. */
  741. function protectFigures(context){
  742. // trace('protectFigures');
  743. context = context == null ? 'body' : context;
  744. $('figure:not(.protected)', context)
  745. .append('<img class="blank" src="'+_settings.basePath+_themeSettings.themePath+'/img/blank.gif" />')
  746. .addClass('protected')
  747. .bind("contextmenu", function(e){
  748. alert("Cette image est soumise au droit d'auteur.");
  749. return false;
  750. });
  751. };
  752. /**
  753. * initPreview
  754. */
  755. function initPreview(node){
  756. $('nav.nav', node).append($('<section class="preview"><i class="fi-eye"></i></section>').bind('click', onClickPreviewCardBtn));
  757. };
  758. function onClickPreviewCardBtn(event){
  759. // trace('theme :: onClickPreviewCardBtn', event);
  760. event.preventDefault();
  761. //trace('Theme :: previewCard', event);
  762. previewCard($(this).parents('.node'));
  763. return false;
  764. };
  765. function previewCard($card){
  766. // trace('theme :: previewCard',$card);
  767. // get the nid from card class
  768. var matches = $card.attr('class').match(/\bnode-(\d+)\b/);
  769. // select viewmode regarding the window size
  770. var viewmode = false;
  771. var cur_vm = getCurrentViewmode();
  772. for(var vm in _viewmodes)
  773. if(vm != cur_vm && _viewmodes[vm] > _viewmodes[cur_vm] && _viewmodes[vm] < $(window).width())
  774. viewmode = vm;
  775. // ajax load card's node
  776. if(typeof matches[1] !== undefined && viewmode){
  777. $.event.trigger('loading-content');
  778. $.getJSON(_settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+matches[1],
  779. {viewmode:viewmode},
  780. function(json){
  781. //trace('json', json);
  782. $.event.trigger('loaded-content');
  783. previewLoaded(json);
  784. });
  785. }
  786. };
  787. function previewLoaded(json){
  788. var $modal = $('<div>').addClass('modal-content').append(json.node);
  789. var $modal_wrapper = $('.modal-wrapper');
  790. if(!$modal_wrapper.size())
  791. $modal_wrapper = $('<div>').addClass('modal-wrapper').append($('<div>').addClass('modal-bg')).appendTo('body');
  792. $modal_wrapper
  793. .append($modal)
  794. .bind('click', function(event) {
  795. _previewIsOpen = false;
  796. $(this).remove();
  797. });
  798. $modal.bind('click', function(event) {
  799. event.stopPropagation();
  800. });
  801. _previewIsOpen = true;
  802. initCards('.modal-content');
  803. $.event.trigger({ type : 'previewloaded', container : '.modal-content'});
  804. };
  805. /**
  806. * GRID
  807. */
  808. function moveGridFocus(event, side){
  809. var $old_focused = $('#content .search-results, #content .actuality-items')
  810. .children('.node.focused').first();
  811. var $new_focused;
  812. switch(side){
  813. case 'r':
  814. $new_focused = $old_focused.next();
  815. break;
  816. case 'l':
  817. $new_focused = $old_focused.prev();
  818. break;
  819. case 'u':
  820. case 'd':
  821. var dir = side == "d" ? 1 : -1;
  822. var column = $old_focused.attr('column');
  823. while( ($new_focused == undefined || !$new_focused.size()) && column > 0){
  824. $new_focused = $('.node[column='+column+'][line='+(parseInt($old_focused.attr('line'))+dir)+']');
  825. column --;
  826. }
  827. break;
  828. }
  829. focusCard($new_focused);
  830. docScrollTo($new_focused);
  831. };
  832. function focusCard($card){
  833. // trace('theme :: focusCard', $card);
  834. if(!$card.size() || $card.is('.focused') || $card.parents('.modal-content').size())
  835. return;
  836. $('#content .search-results, #content .actuality-items')
  837. .children('.node.focused')
  838. .removeClass('focused');
  839. $card.addClass('focused');
  840. if(_previewIsOpen){
  841. previewCard($card);
  842. }
  843. $card.trigger('focused');
  844. };
  845. /**
  846. * lazyloadimages
  847. */
  848. // function initLazyLoad(context){
  849. // $('figure:first-child img.lazy', context).lazyload();//{
  850. // container:'#content'
  851. // });
  852. // TODO: propage this event to the card near it to anticipate the mouseenter
  853. // $(context).bind('mousemove', showLazyLoadedImages);
  854. // };
  855. function showLazyLoadedImages(context){
  856. //trace('MaterioBaseTheme :: initLazyLoad : mouseenter', this);
  857. var $this = $(context);
  858. if( !$this.is('.lazy-processed') ){
  859. $this
  860. .addClass('lazy-processed')
  861. // .find('figure img.lazy')
  862. .find('img.lazy')
  863. .each(function(index){
  864. var $img = $(this);
  865. $img.attr('src', $img.attr('data-original')).removeAttr('data-original');
  866. });
  867. setTimeout(function(){
  868. $this.addClass('image-ready');
  869. }, 300);
  870. }
  871. };
  872. /**
  873. * prepareAssociatedMaterials
  874. */
  875. function prepareAssociatedMaterials(card){
  876. // trace('prepareAssociatedMaterials', card);
  877. $('.field-name-field-materiau-ref a:not(.prepared)', card).addClass("prepared").bind('click', onClickAssociatedMaterial);
  878. };
  879. /**
  880. * onClickAssociatedMaterial
  881. */
  882. function onClickAssociatedMaterial(event){
  883. // trace("onClickAssociatedMaterial");
  884. event.preventDefault();
  885. var $this = $(this);
  886. // trace('href', $(this).attr('href'));
  887. var nid = $this.attr('href').match(/^\/(fr|en)\/node\/(\d+)$/)[2];
  888. // trace("nid", nid);
  889. var $prt = $this.parents('.node-materiau');
  890. if($prt.parent().is('.modal-content')){
  891. // if we are on preview mode
  892. // remove already loaded associated
  893. $prt.parent().find('.node-'+nid+'.associated').remove();
  894. loadAssociatedNode($prt, nid);
  895. }else{
  896. // if we are on normal grid mode
  897. var $n = $prt.nextUntil('.node-materiau:not(.associated)').filter('.node-'+nid);
  898. // trace('n', $n);
  899. if($n.size()){
  900. // trace('focus', nid);
  901. // focus on already loaded node
  902. focusCard($n);
  903. // docScrollTo($isnodeexisting);
  904. }else{
  905. // trace('load associated', nid);
  906. loadAssociatedNode($prt, nid);
  907. }
  908. }
  909. return false;
  910. };
  911. function loadAssociatedNode($prt, nid){
  912. // console.log('loadAssociatedNode | nid = '+nid);
  913. var viewmode = $prt.attr('class').match(/vm-([^\s]+)/);
  914. // trace('viewmode match', viewmode);
  915. // if(!_isloadingresults){
  916. $.event.trigger('loading-content');
  917. var url = _settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+nid;
  918. $.getJSON(url,
  919. {viewmode:viewmode[1]},
  920. function(json){
  921. //trace('json', json);
  922. $.event.trigger('loaded-content');
  923. displayAssociated($prt, $(json.node));
  924. $.event.trigger({
  925. type : 'resultscompleted',
  926. container : '#content .actuality-items, #content .search-results'
  927. });
  928. });
  929. // }
  930. };
  931. function displayAssociated($prt, $n){
  932. $n.addClass('associated').addClass('just-added');
  933. $prt.after($n);
  934. initCards($prt.parent());
  935. (function($n){
  936. setTimeout(function(){
  937. $n.removeClass('just-added');
  938. focusCard($n);
  939. }, 100);
  940. }($n));
  941. };
  942. /**
  943. * sideSwitcher
  944. */
  945. function sideSwitcher(event, delta){
  946. var $sides = $('.side', event.currentTarget);
  947. if($sides.length > 1){
  948. if( typeof delta == 'undefined'){
  949. var delta = 0;
  950. $sides.each(function(i) {
  951. if($(this).is('.op-visible')){
  952. delta = i+1;
  953. return false;
  954. }
  955. });
  956. delta = delta == 0 ? 1 : (delta == $sides.length ? 0 : delta);
  957. }
  958. // google analytics
  959. $.event.trigger({
  960. type : 'record-stat',
  961. categorie : 'Card event',
  962. action : 'side switch',
  963. label : delta
  964. });
  965. $sides.addClass('op-hidden').removeClass('op-visible')
  966. .eq(delta).removeClass('op-hidden').addClass('op-visible');
  967. }
  968. };
  969. /**
  970. * columnsPage
  971. */
  972. function columnsPage($elmt, cw, ch){
  973. // trace('columnsPage');
  974. var cls = Math.ceil($elmt.h()/ch);
  975. $elmt
  976. .addClass('columnized')
  977. .width(cw*cls)
  978. .columnize({
  979. width:cw,
  980. height:ch,
  981. lastNeverTallest:true
  982. });
  983. if(cls > 1){
  984. $elmt.find('.column').each(function(index) {
  985. var $this = $(this);
  986. if(!$this.find('*').length){
  987. $this.prev().addClass('last');
  988. $this.remove();
  989. return true;
  990. }
  991. });
  992. $elmt.find('.column').each(function(index) {
  993. var $this = $(this);
  994. if(!$this.is('.first'))
  995. $this.children('*:first-child').prepend('<span cw="'+cw+'" col="'+(index-1)+'" class="column-switcher prev-column">‹</span> ...');
  996. if(!$this.is('.last'))
  997. $this.children('*:last-child').append('... <span cw="'+cw+'" col="'+(index+1)+'" class="column-switcher next-column">›</span>');
  998. });
  999. $('.column-switcher', $elmt).bind('click', onColumnSwitcherClick);
  1000. }
  1001. };
  1002. function onColumnSwitcherClick(event){
  1003. event.preventDefault();
  1004. //trace('onColumnSwitcherClick', event);
  1005. var $this = $(event.currentTarget),
  1006. $columnized = $this.parents('.columnized');
  1007. // google analytics
  1008. $.event.trigger({
  1009. type : 'record-stat',
  1010. categorie : 'Card event',
  1011. action : 'column switch',
  1012. label : $this.attr('col')
  1013. });
  1014. $columnized.css({
  1015. marginLeft : -1 * $this.attr('cw') * $this.attr('col') +'px'
  1016. });
  1017. return false;
  1018. }
  1019. /**
  1020. * initViewmodes
  1021. */
  1022. function initViewmodes(){
  1023. checkViewmodesResponsive();
  1024. };
  1025. function checkViewmodesResponsive(){
  1026. if(_480_768()){
  1027. if($('.viewmode-link.active').is('.viewmode-cardfull')){
  1028. $('.viewmode-cardbig').trigger('click');
  1029. }
  1030. }else if(_max_480()){
  1031. if($('.viewmode-link.active').is('.viewmode-cardbig, .viewmode-cardfull')){
  1032. $('.viewmode-cardmedium').trigger('click');
  1033. }
  1034. }
  1035. };
  1036. function getCurrentViewmode(){
  1037. for(var vm in _viewmodes)
  1038. if($('.viewmode-link.active.viewmode-'+vm).size())
  1039. return vm;
  1040. };
  1041. /**
  1042. * FLAGS
  1043. */
  1044. function initFlagsEvent(){
  1045. $('.bookmarks, .mylists .flaged').children('.node:not(.listened)')
  1046. .bind('mouseenter mousemove click mouseleave', onCardEventDispatcher)
  1047. // .each(function(event){ initLayoutCardDispatcher($(this)); })
  1048. .addClass('listened');
  1049. };
  1050. function onAfterFlaging(event){
  1051. //trace('MaterioBaseTheme :: onAfterFlaging', event);
  1052. // WARNING to use event variables i had to hack flag.js from flag module (change the event declaration)
  1053. var $target = $(event.link).parents('article.node');
  1054. if(event.flagStatus == 'flag'){
  1055. $target.addClass('flaged');
  1056. }else if(event.flagStatus == 'unflag'){
  1057. if($('.flag-lists-entity-links a.unflag-action', $target).length == 0)
  1058. $target.removeClass('flaged');
  1059. }
  1060. };
  1061. function onMybookmarksBlockUpdate(event){
  1062. initFlagsEvent();
  1063. initLayout();
  1064. };
  1065. function onClickList(event){
  1066. //trace('onClickList', event);
  1067. var $link = $(event.currentTarget).addClass('active'),
  1068. name = $link.attr('name'),
  1069. $block = $link.parents('.block'),
  1070. $flaged = $('.flaged.'+name, $block).addClass('active');
  1071. $link.siblings().removeClass('active');
  1072. $flaged.siblings().removeClass('active');
  1073. createCookie('materiomyflaglistsopened', name, 1);
  1074. $flaged.parents('.mylists').height($flaged.h());
  1075. initLayout();
  1076. };
  1077. function onMyListsBlockUpdate(event){
  1078. //trace('MaterioBaseTheme :: onMyListsBlockUpdate', event);
  1079. initFlagsEvent();
  1080. // initLazyLoad(this);
  1081. // TODO: refresh contents (search results) to see new flaglist links.
  1082. initLayout();
  1083. };
  1084. function onMyListsBlockBuilded(event){
  1085. //trace('MaterioBaseTheme :: onMyListsBlockBuilded', event);
  1086. // initLazyLoad(event.block);
  1087. showLazyLoadedImages(event.block);
  1088. };
  1089. /**
  1090. * cards bookmark
  1091. */
  1092. // MaterioBaseTheme.prototype.init_layout_bookmark = function($card){
  1093. // trace('initLayoutCardBig');
  1094. // };
  1095. MaterioBaseTheme.prototype.on_mouseenter_bookmark = function(event){
  1096. //trace('on_mouseenter_bookmark', event);
  1097. _$tooltip
  1098. .html($('.group-header', this).clone())
  1099. .css({
  1100. top:event.pageY - _$tooltip.h() -5,//- event.layerY,
  1101. left:event.pageX + 5 + ($(this).w() - event.layerX)
  1102. })
  1103. .removeClass('op-hidden').addClass('op-visible');
  1104. };
  1105. MaterioBaseTheme.prototype.on_mousemove_bookmark = function(event){
  1106. // trace('on_mousemove_Card', event);
  1107. // if(event.layerX)
  1108. // horiHoverImagesSwitcher(event);
  1109. _$tooltip
  1110. .css({
  1111. top:event.pageY - _$tooltip.h() -5,// - event.layerY,
  1112. left:event.pageX + 5 + ($(this).w() - event.layerX)
  1113. });
  1114. };
  1115. // MaterioBaseTheme.prototype.on_click_bookmark = function(event){
  1116. // trace('on_click_bookmark', event);
  1117. // };
  1118. MaterioBaseTheme.prototype.on_mouseleave_bookmark = function(event){
  1119. // trace('on_mouseleave_Card', event);
  1120. $('.images img.op-visible', this)
  1121. .removeClass('op-visible').addClass('op-hidden')
  1122. .eq(0)
  1123. .removeClass('op-hidden').addClass('op-visible');
  1124. _$tooltip.removeClass('op-visible').addClass('op-hidden');
  1125. };
  1126. /**
  1127. * keyboradshortcuts
  1128. */
  1129. function initKeyboardShortcuts(){
  1130. $(document)
  1131. .bind('keydown', 'Shift+:',shortcut_focusSearchField)
  1132. .bind('keydown', '/',shortcut_focusSearchField)
  1133. .bind('keydown', 'Alt+1',shortcut_viewmodeSmall)
  1134. .bind('keydown', 'Alt+2',shortcut_viewmodeMedium)
  1135. .bind('keydown', 'Alt+3',shortcut_viewmodeBig)
  1136. .bind('keydown', 'Alt+4',shortcut_viewmodeFull)
  1137. .bind('keydown', 'space',shortcut_togglePreview)
  1138. .bind('keydown', 'esc',shortcut_closeModaleContent)
  1139. .bind('keydown', 'up',shortcut_onUpArrow)
  1140. .bind('keydown', 'right',shortcut_onRightArrow)
  1141. .bind('keydown', 'down',shortcut_onDownArrow)
  1142. .bind('keydown', 'left',shortcut_onLeftArrow);
  1143. };
  1144. function shortcut_focusSearchField(e){
  1145. // trace("focusSearchField");
  1146. if($('#edit-searchfield').size()){
  1147. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1148. stat_event.action = 'slash';
  1149. stat_event.label = 'Focus on search text field';
  1150. $.event.trigger(stat_event);
  1151. $('#edit-searchfield').focus();
  1152. e.stopPropagation();
  1153. e.preventDefault();
  1154. return false;
  1155. }
  1156. };
  1157. function shortcut_viewmodeSmall(e){
  1158. if($('a.viewmode-link.viewmode-cardsmall').size()){
  1159. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1160. stat_event.action = 'Alt+1';
  1161. stat_event.label = 'Change view mode : card small';
  1162. $.event.trigger(stat_event);
  1163. $('a.viewmode-link.viewmode-cardsmall').click();
  1164. return false;
  1165. }
  1166. };
  1167. function shortcut_viewmodeMedium(e){
  1168. if($('a.viewmode-link.viewmode-cardmedium').size()){
  1169. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1170. stat_event.action = 'Alt+2';
  1171. stat_event.label = 'Change view mode : card medium';
  1172. $.event.trigger(stat_event);
  1173. $('a.viewmode-link.viewmode-cardmedium').click();
  1174. return false;
  1175. }
  1176. };
  1177. function shortcut_viewmodeBig(e){
  1178. if($('a.viewmode-link.viewmode-cardbig').size()){
  1179. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1180. stat_event.action = 'Alt+3';
  1181. stat_event.label = 'Change view mode : card big';
  1182. $.event.trigger(stat_event);
  1183. $('a.viewmode-link.viewmode-cardbig').click();
  1184. return false;
  1185. }
  1186. };
  1187. function shortcut_viewmodeFull(e){
  1188. if($('a.viewmode-link.viewmode-cardfull').size()){
  1189. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  1190. stat_event.action = 'Alt+4';
  1191. stat_event.label = 'Change view mode : card full';
  1192. $.event.trigger(stat_event);
  1193. $('a.viewmode-link.viewmode-cardfull').click();
  1194. return false;
  1195. }
  1196. };
  1197. function shortcut_togglePreview(e){
  1198. // trace('theme :: shortcut_togglePreview', e);
  1199. $.event.trigger({
  1200. type : 'record-stat',
  1201. categorie : 'Shortcuts',
  1202. action : 'Space',
  1203. label : 'Space toggle preview'
  1204. });
  1205. if(_previewIsOpen){
  1206. if($('body>.modal-wrapper').size()){
  1207. $('body>.modal-wrapper').click();
  1208. _previewIsOpen = false;
  1209. return false;
  1210. }
  1211. }else{
  1212. previewCard($('#content .search-results, #content .actuality-items').children('.node.focused:first'));
  1213. }
  1214. };
  1215. function shortcut_closeModaleContent(e){
  1216. if($('body>.modal-wrapper').size()){
  1217. $.event.trigger({
  1218. type : 'record-stat',
  1219. categorie : 'Shortcuts',
  1220. action : 'Esc',
  1221. label : 'Esc from modal content'
  1222. });
  1223. $('body>.modal-wrapper').click();
  1224. _previewIsOpen = false;
  1225. return false;
  1226. }
  1227. };
  1228. function shortcut_onUpArrow(e){
  1229. // trace('theme :: shortcut_onTopArrow', e);
  1230. moveGridFocus(e, 'u');
  1231. };
  1232. function shortcut_onRightArrow(e){
  1233. // trace('theme :: shortcut_onRightArrow', e);
  1234. moveGridFocus(e, 'r');
  1235. };
  1236. function shortcut_onDownArrow(e){
  1237. // trace('theme :: shortcut_onDownArrow', e);
  1238. moveGridFocus(e, 'd');
  1239. };
  1240. function shortcut_onLeftArrow(e){
  1241. // trace('theme :: shortcut_onLeftArrow', e);
  1242. moveGridFocus(e, "l");
  1243. };
  1244. /**
  1245. * Misc
  1246. */
  1247. function onResizeWindow(e){
  1248. clearInterval(_resizeTimer);
  1249. _resizeTimer = setTimeout(function(){
  1250. initLayout();
  1251. checkViewmodesResponsive();
  1252. setUpGrid("#content .actuality-items, #content .search-results");
  1253. }, 200);
  1254. };
  1255. /**
  1256. * Statics
  1257. */
  1258. function initMembershipForm() {
  1259. switch(window.location.hash){
  1260. case '#a':
  1261. $('#edit-submitted-column-left-membership-options-1').attr('checked', 'checked');
  1262. // $options.trigger('change');
  1263. break;
  1264. case '#b':
  1265. $('#edit-submitted-column-left-membership-options-2').attr('checked', 'checked');
  1266. break;
  1267. case '#c':
  1268. $('#edit-submitted-column-left-membership-options-3').attr('checked', 'checked');
  1269. break;
  1270. // default:
  1271. // switchMembershipShipFormFields($options);
  1272. // break
  1273. }
  1274. $('#webform-component-column-left--membership-options')
  1275. .change(function(event){
  1276. //trace('changed');
  1277. if( $('input[type="radio"]:checked', this).is('#edit-submitted-column-left-membership-options-3') ){
  1278. $('#webform-component-column-right--collaborators').show();
  1279. }else{
  1280. $('#webform-component-column-right--collaborators').hide();
  1281. }
  1282. $('div.form-item.selected', this).removeClass('selected');
  1283. $('input[type="radio"]:checked', this).parents('div.form-item').addClass('selected');
  1284. })
  1285. .trigger('change');
  1286. // $('#webform-component-column-left--membership-options input[checked="checked"]').parents('div.form-item').addClass('selected');
  1287. };
  1288. /** helpers */
  1289. $.fn.h = function(){
  1290. if(this.css('height') == undefined)
  1291. return 0;
  1292. return parseInt(this.css('height')) + parseInt(this.css('padding-top')) + parseInt(this.css('padding-bottom'));
  1293. };
  1294. $.fn.w = function(){
  1295. if(this.css('width') == undefined)
  1296. return 0;
  1297. return parseInt(this.css('width')) + parseInt(this.css('padding-left')) + parseInt(this.css('padding-right'));
  1298. };
  1299. function getDocHeight() {
  1300. var D = document;
  1301. return Math.max(
  1302. Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
  1303. Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
  1304. Math.max(D.body.clientHeight, D.documentElement.clientHeight)
  1305. );
  1306. };
  1307. // http://andylangton.co.uk/articles/javascript/get-viewport-size-javascript/
  1308. function viewport() {
  1309. var e = window, a = 'inner';
  1310. if (!('innerWidth' in window )) {
  1311. a = 'client';
  1312. e = document.documentElement || document.body;
  1313. }
  1314. return { width : e[ a+'Width' ] , height : e[ a+'Height' ] };
  1315. };
  1316. /**
  1317. * Search Form
  1318. */
  1319. function initDoubleSearchFormTabs() {
  1320. var $searchblock = $('#block-materio-search-api-materio-search-api-search');
  1321. var $tabs = $('<div>')
  1322. .addClass('searchform-tabs')
  1323. .prependTo($searchblock.children('.inner'));
  1324. $('h4.form-title', $searchblock).each(function(index, el) {
  1325. $(el)
  1326. .attr('index', index)
  1327. .bind('click', function(e){
  1328. var $this = $(this);
  1329. var index = $this.attr('index');
  1330. // show the right tab
  1331. $('h4.form-title', $tabs).removeClass('active');
  1332. $this.addClass('active');
  1333. // show the right form
  1334. $('.msa-form-wrapper', $searchblock)
  1335. .removeClass('active')
  1336. .eq(index).addClass('active');
  1337. // record cookie
  1338. createCookie('default-search-form', index);
  1339. })
  1340. .appendTo($tabs);
  1341. });
  1342. // read from cookie what was the last search form visible
  1343. var defaultIndex = readCookie('default-search-form') || 0;
  1344. // show default tab
  1345. $('h4.form-title', $tabs).eq(defaultIndex).addClass('active');
  1346. $('.msa-form-wrapper', $searchblock).eq(defaultIndex).addClass('active');
  1347. $searchblock.addClass('tabed');
  1348. };
  1349. /**
  1350. * Forms
  1351. */
  1352. function initForms(){
  1353. $('#edit-searchfield:not(.processed)')
  1354. .bind('focus', function(event) {
  1355. var $this = $(this);
  1356. //$this.attr('value', 'test');
  1357. // trace('value', $this.val());
  1358. // trace('default', $this.attr('default'));
  1359. if($this.val() == $this.attr('default'))
  1360. $this.val('');
  1361. })
  1362. .bind('focusout', function(event) {
  1363. var $this = $(this);
  1364. if($this.val() == "")
  1365. $this.val($this.attr('default'));
  1366. })
  1367. .addClass('processed');
  1368. hideLabelsFromRegisterForm();
  1369. };
  1370. function hideLabelsFromRegisterForm () {
  1371. var $this, id,label, description;
  1372. $('input.form-text', '#block-user-login, #block-materio-user-user-register, .pane-materio-user-user-register, #block-materio-user-user-createaccount').each(function(i) {
  1373. $this = $(this);
  1374. id = $this.attr('id');
  1375. label = $('label[for='+id+']').hide().text();
  1376. description = $this.parent().find('.description').hide().text();
  1377. if($this.attr('placeholder') == '')
  1378. $this.attr('placeholder',label);
  1379. $this.attr('title',description);
  1380. });
  1381. };
  1382. function onAjaxRegisterBlockLoaded (event) {
  1383. // console.log('onAjaxRegisterBlockLoaded');
  1384. hideLabelsFromRegisterForm();
  1385. };
  1386. /**
  1387. * cookies
  1388. */
  1389. function createCookie(name,value,days) {
  1390. if (days) {
  1391. var date = new Date();
  1392. date.setTime(date.getTime()+(days*24*60*60*1000));
  1393. var expires = "; expires="+date.toGMTString();
  1394. }
  1395. else var expires = "";
  1396. document.cookie = name+"="+value+expires+"; path=/";
  1397. };
  1398. function readCookie(name) {
  1399. var nameEQ = name + "=";
  1400. var ca = document.cookie.split(';');
  1401. for(var i=0;i < ca.length;i++) {
  1402. var c = ca[i];
  1403. while (c.charAt(0)==' ') c = c.substring(1,c.length);
  1404. if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  1405. }
  1406. return null;
  1407. };
  1408. function eraseCookie(name) {
  1409. createCookie(name,"",-1);
  1410. };
  1411. /**
  1412. * google analytics
  1413. */
  1414. function onRecordStat(event){
  1415. //trace('onRecordStat', event);
  1416. // path, category, action, opt_label, opt_value
  1417. if(typeof _gaq !== 'undefined'){
  1418. if(event.path){
  1419. _gaq.push(['_trackPageview', event.path]);
  1420. }else{
  1421. _gaq.push(['_trackEvent', event.categorie, event.action, event.label, event.value]);
  1422. }
  1423. }
  1424. };
  1425. /**
  1426. * docScrollTo
  1427. */
  1428. function docScrollTo($e){
  1429. // $(document).scrollTop($e.offset().top);
  1430. if($e.size())
  1431. $('html,body').animate({
  1432. scrollTop: $e.offset().top - $(window).height()*0.5 + $e.height()*0.5
  1433. }, 500);
  1434. };
  1435. init();
  1436. };
  1437. $(document).ready(function() {
  1438. var materiobasetheme = new MaterioBaseTheme();
  1439. });
  1440. /**
  1441. * Attach collapse behavior to the feedback form block.
  1442. */
  1443. // Drupal.behaviors.feedbackForm = {
  1444. // attach: function (context) {
  1445. // $('#block-feedback-form', context).once('feedback', function () {
  1446. // var $block = $(this);
  1447. // $block.find('span.feedback-link')
  1448. // .prepend('<span id="feedback-form-toggle">feedback</span> ')
  1449. // .css('cursor', 'pointer')
  1450. // .toggle(function () {
  1451. // Drupal.feedbackFormToggle($block, false);
  1452. // },
  1453. // function() {
  1454. // Drupal.feedbackFormToggle($block, true);
  1455. // }
  1456. // );
  1457. // $block.find('form').hide();
  1458. // $block.show();
  1459. // });
  1460. // }
  1461. // };
  1462. //
  1463. /**
  1464. * Collapse or uncollapse the feedback form block.
  1465. */
  1466. // Drupal.feedbackFormToggle = function ($block, enable) {
  1467. // $block.find('form').slideToggle('medium');
  1468. // if (enable) {
  1469. // $('#feedback-form-toggle', $block).html('feedback');
  1470. // }
  1471. // else {
  1472. // $('#feedback-form-toggle', $block).html('feedback (close)');
  1473. // }
  1474. // };
  1475. })(jQuery);