script.js 55 KB

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