script.js 36 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156
  1. // @codekit-prepend "gui.js"
  2. (function($) {
  3. Drupal.behaviors.init_theme = {};
  4. Drupal.behaviors.init_theme.attach = function (context) {
  5. // Growl-style system messages
  6. $('#messages-and-help > div.messages:not(.processed)')
  7. .addClass('processed')
  8. .each(function() {
  9. // If a message meets these criteria, we don't autoclose
  10. // - contains a link
  11. // - is an error or warning
  12. // - contains a lenghthy amount of text
  13. if ($('a', this).size() || $(this).is('.error') || $(this).is('.warning') || $(this).text().length > 100) {
  14. $(this).prepend("<span class='close'>X</span>");
  15. $('span.close', this).click(function() {
  16. $(this).parent().slideUp('fast');
  17. });
  18. }
  19. else {
  20. // This essentially adds a 3 second pause before hiding the message.
  21. $(this).animate({opacity:1}, 5000, 'linear', function() {
  22. $(this).slideUp('fast');
  23. });
  24. }
  25. });
  26. };
  27. Drupal.behaviors.materio = {};
  28. Drupal.behaviors.materio.attach = function(context) {};
  29. MaterioBaseTheme = function(){
  30. var _settings = Drupal.settings,
  31. _themeSettings = _settings.materiobasetheme,
  32. _strings = _themeSettings.strings,
  33. _History = window.History,
  34. _this = this,
  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. _isFrontNotLogged = $('body').is('.front.not-logged-in'),
  45. _isAdhesion = $('body').is('.page-node-11187') || $('body').is('.page-node-11186'),
  46. // _isBreveMateriauNodePage = $('body').is('.node-type-breve') || $('body').is('.node-type-materiau');
  47. _isBreveMateriauNodePage = _themeSettings.page_callback == 'node_page_view' && (_themeSettings.node_type == 'materiau' || _themeSettings.node_type == 'breve'),
  48. _resizeTimer,
  49. _max_480 = function(){ return (viewport().width < 479); },
  50. _480_768 = function(){ return ( !_max_480() && _max_768() ); },
  51. _max_768 = function(){ return (viewport().width < 767); },
  52. _768_980 = function(){ return ( !_max_768() && _max_980() ); },
  53. _max_980 = function(){ return (viewport().width < 979); },
  54. _980_1200 = function(){ return ( !_max_980() && _max_1200() ); },
  55. _max_1200 = function(){ return (viewport().width < 1199); };
  56. function init(){
  57. // trace('init MaterioBaseTheme');
  58. checkIE();
  59. initHistoryNav();
  60. if(_isFrontNotLogged)
  61. initHome();
  62. if(_isAdhesion)
  63. initAdhesion();
  64. initLayout();
  65. initInfinitScroller();
  66. initEvents();
  67. initForms();
  68. initKeyboardShortcuts();
  69. initViewmodes();
  70. if(_isBreveMateriauNodePage)
  71. $.event.trigger({ type : 'resultschanged', container : '#content>.inner-content'});
  72. setTimeout(function(){
  73. $.event.trigger({ type : 'theme-ready' });
  74. },100);
  75. };
  76. /**
  77. * checkIE
  78. *
  79. */
  80. function checkIE(){
  81. // alert('check ie');
  82. if($('.oldie body').size()){
  83. 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.');
  84. }
  85. };
  86. /**
  87. * history navigation
  88. */
  89. function initHistoryNav(){
  90. var state = _History.getState();
  91. // _History.log('initial:', state.data, state.title, state.url);
  92. _History.Adapter.bind(window,'statechange',onHistoryStateChange);
  93. $(document).bind('new-history-page', onNewHistoryPage);
  94. };
  95. function onNewHistoryPage(event){
  96. //trace('theme :: onNewHistoryPage', event);
  97. var title = event.title.replace(/<(?:.|\n)*?>/gm, '') + ' | ' + _strings.site_name;
  98. // trace('MaterioBaseTheme :: onNewHistoryPage : title', title);
  99. _statePushed = true;
  100. _History.pushState({content:event.content, pagetitle:event.title}, title, event.path);
  101. };
  102. function onHistoryStateChange(event){
  103. // trace('theme :: onHistoryStateChange', event);
  104. var state = _History.getState();
  105. // _History.log('statechange:', state.data, state.title, state.url);
  106. // google analytics
  107. $.event.trigger({
  108. type : 'record-stat',
  109. path : state.url
  110. });
  111. // TODO: History : empty content if we go back to the homepage
  112. // change the current url for feedbacks
  113. $('input[name=location]','#feedback-form').attr('value', state.url);
  114. $.event.trigger({
  115. type:'materio-page-title-refresh-block',
  116. title : state.data.pagetitle
  117. });
  118. // this condition is to avoid retriggering probleme when a module pushState and then is retriggered by state-changed
  119. if(!_statePushed){
  120. _statePushed = false;
  121. $('.inner-content',_$content).html(state.data.content);
  122. $.event.trigger('history-state-change');
  123. }
  124. };
  125. /**
  126. * home
  127. */
  128. function initHome(){
  129. $('img.lazy', '#block-materio-didactique-materio-didactique-home').each(function(){
  130. var $img = $(this);
  131. $img.attr('src', $img.attr('data-original'));
  132. });
  133. if(_max_768()){
  134. initHomeDidactiqueMobile();
  135. }else{
  136. initHomeDidactiqueDesktop();
  137. }
  138. };
  139. function initHomeDidactiqueMobile(){
  140. // trace('initHomeDidactiqueMobile');
  141. _$homeBlockDidactique = $('#block-materio-didactique-materio-didactique-home');
  142. $('.node-didactique', _$homeBlockDidactique)
  143. .find('.field-name-title-field')
  144. .bind('click', clickOnHomeDidactiqueTitle);
  145. };
  146. function clickOnHomeDidactiqueTitle(e){
  147. // trace('clickOnHomeDidactiqueTitle');
  148. var $node = $(this).parent('.node-didactique');
  149. if($node.is('.opened')){
  150. $node.removeClass('opened');//.slideUp();
  151. }else{
  152. $('.node-didactique', _$homeBlockDidactique).removeClass('opened');//.slideUp();
  153. $node.addClass('opened');//.slideDown();
  154. $('html,body').animate({scrollTop: $node.offset().top - $('#header').h()});
  155. }
  156. };
  157. function initHomeDidactiqueDesktop(){
  158. // trace("initHomeDidactiqueDesktop");
  159. _$homeUtilities = $('#utilities');
  160. _$homeBlockDidactique = $('#block-materio-didactique-materio-didactique-home')
  161. .append('<div class="slides"/>')
  162. .append('<div class="tabs"/>')
  163. // .append('<i class="icon-circle-arrow-up"/><i class="icon-circle-arrow-down"/>')
  164. .bind('mouseenter', function(event) { _hoverHomeDidactique = true; })
  165. .bind('mouseleave', function(event) { _hoverHomeDidactique = false; });
  166. $('.node-didactique',_$homeBlockDidactique).each(function(index) {
  167. if(index){
  168. $(this).addClass('op-hidden');
  169. }else{
  170. $(this).addClass('op-visible');
  171. }
  172. $('.field-name-title-field', this)
  173. .clone()
  174. .addClass(index ? '' : 'active')
  175. .click(function(event){
  176. $(this).addClass('active').siblings().removeClass('active');
  177. _$homeBlockDidactique.find('.node-didactique').removeClass('op-visible').addClass('op-hidden').eq(index).removeClass('op-hidden').addClass('op-visible');
  178. })
  179. .appendTo($('.tabs', _$homeBlockDidactique));
  180. }).appendTo($('.slides', _$homeBlockDidactique));
  181. if(!_touch){
  182. $(document).bind('scroll', function(event){
  183. if($(window).scrollTop() == 0) {
  184. if(_$homeUtilities.is('.closed')){
  185. _$homeUtilities.removeClass('closed');//.removeClass('scroll-closed');
  186. launchHomeDidactiqueInterval();
  187. initLayout();
  188. }
  189. }else{
  190. if(!_$homeUtilities.is('.closed')){
  191. _$homeUtilities.addClass('closed');//.addClass('scroll-closed');
  192. clearInterval(_homeTimeInterval);
  193. initLayout();
  194. }
  195. }
  196. });
  197. }
  198. // launchHomeDidactiqueInterval();
  199. $(document)
  200. .bind('cbox_complete', function(){ clearInterval(_homeTimeInterval); })
  201. .bind('cbox_closed', function(){ launchHomeDidactiqueInterval(); });
  202. $('.side.oops a').click(function(event) {
  203. event.preventDefault();
  204. // $(document).scrollTop(0);
  205. // $('#edit-mail', "#block-materio-user-user-register").focus();
  206. window.location.href = $(this).attr('href');
  207. return false;
  208. });
  209. };
  210. function launchHomeDidactiqueInterval(){
  211. _homeTimeInterval = setInterval(function(){
  212. if(!_hoverHomeDidactique){
  213. var $next = $('.tabs .active', _$homeBlockDidactique).next();
  214. if(!$next.length)
  215. $next = $('.tabs .active', _$homeBlockDidactique).siblings().eq(0);
  216. $next.trigger('click');
  217. }
  218. }, 15000);
  219. };
  220. /**
  221. * layout
  222. */
  223. function initLayout(){
  224. if(!_max_768()){
  225. var height = $('#header').h() + $('#tasks').h();
  226. if(!_max_480() && !_touch ){
  227. height += $('#utilities').h()+15;
  228. }
  229. //$('#main').css('margin-top', height+15);
  230. // $('#container').css('padding-top', height+15);
  231. $('#container').animate({'padding-top':height}, 300);
  232. }
  233. };
  234. /**
  235. * infinit scroll
  236. */
  237. function initInfinitScroller(){
  238. // trace("initInfinitScroller");
  239. $.event.trigger({
  240. type : 'init-scroller-pager',
  241. pager : $('ul.pager', '#content')
  242. });
  243. $(document).bind('scroll', function(event){
  244. // trace('scroll event binded');
  245. checkInfinitScroller();
  246. });
  247. };
  248. function checkInfinitScroller(){
  249. // trace('checkInfinitScroller');
  250. // if(!_touch){
  251. // }else{
  252. if($(window).scrollTop() + $(window).height() > getDocHeight() - 200) {
  253. infinitScrollPager();
  254. }
  255. // }
  256. };
  257. function infinitScrollPager(){
  258. // trace('MaterioBaseTheme :: infinitScrollPager');
  259. if($('ul.pager', '#content').length){
  260. var $nextpage = $('ul.pager .pager-current', '#content').next(),
  261. href = $('a', $nextpage).attr('href');
  262. if(href){
  263. $.event.trigger({ type : 'record-stat', path : href }); // google analytics
  264. $.event.trigger({ type : 'load-scroller-pager', href : href });
  265. }
  266. }
  267. };
  268. /**
  269. * events
  270. */
  271. function initEvents(){
  272. //trace('MaterioBaseTheme :: initEvents');
  273. $(document)
  274. .bind('init-layout', initLayout)
  275. .bind('loading-content', onLoadingContent)
  276. .bind('loaded-content', onLoadedContent)
  277. .bind('resultschanged', onResultsChanged)
  278. .bind('resultscompleted', onResultsCompleted)
  279. .bind('mybookmarks-block-updated', onMybookmarksBlockUpdate)
  280. .bind('mylists-block-builded', onMyListsBlockBuilded)
  281. .bind('mylists-block-updated', onMyListsBlockUpdate)
  282. .bind('flagGlobalAfterLinkUpdate', onAfterFlaging)
  283. .bind('record-stat', onRecordStat)
  284. .bind('view-mode-changed', onViewModeChanged);
  285. $(window)
  286. .bind('resize', onResizeWindow);
  287. initFlagsEvent();
  288. $('#block-user-login h2, #block-menu-menu-top-menu h2').bind('click', function(event) {
  289. event.preventDefault();
  290. $(this).parent('.block').toggleClass('hovered');
  291. $('.hovered').not($(this).parent('.block')).removeClass('hovered');
  292. return false;
  293. });
  294. $('#block-materio-search-api-materio-search-api-viewmode .viewmode-link').bind('vm-clicked-active', function(event) {
  295. $(this).parents('.block').toggleClass('hovered');
  296. $('.hovered').not($(this).parents('.block')).removeClass('hovered');
  297. });
  298. $('#block-materio-search-api-materio-search-api-viewmode .viewmode-link').bind('vm-clicked', function(event) {
  299. $(this).parents('.block').removeClass('hovered');
  300. $('.hovered').not($(this).parents('.block')).removeClass('hovered');
  301. });
  302. };
  303. function onLoadingContent(event){
  304. _$content.addClass('faded');
  305. $('#materio-search-api-search-form').addClass('loading');
  306. };
  307. function onLoadedContent(event){
  308. _$content.removeClass('faded');
  309. $('#materio-search-api-search-form').removeClass('loading');
  310. };
  311. function onResultsChanged(event){
  312. //trace('MaterioBaseTheme :: onResultsChanged',event);
  313. $(document).scrollTop(0);
  314. onResultsCompleted(event);
  315. };
  316. function onResultsCompleted(event){
  317. trace('theme :: onResultsCompleted', event);
  318. checkInfinitScroller();
  319. if(event.container != undefined){
  320. //setTimeout(function(){ // why this time out ?
  321. $(event.container).children('.node:not(.listened)')
  322. .bind('mouseenter mousemove click mouseleave', onCardEventDispatcher)
  323. .each(function(i){
  324. // initLayoutCardDispatcher($(this));
  325. // initLazyLoad(this);
  326. protectFigures(this);
  327. })
  328. .addClass('listened');
  329. //}, 100);
  330. }
  331. };
  332. function onViewModeChanged(event){
  333. if(_isBreveMateriauNodePage){
  334. // if(!_isloadingresults){
  335. $.event.trigger('loading-content');
  336. // _isloadingresults = true;
  337. // $('#materio-search-api-search-form').addClass('loading');
  338. // var nid =
  339. var url = _settings.basePath+_settings.pathPrefix+'materio_search_api_ajax/node/'+_themeSettings.node_nid;
  340. $.getJSON(url,
  341. function(json){
  342. trace('json', json);
  343. // $.event.trigger('resultsloaded');
  344. $.event.trigger('loaded-content');
  345. // _isloadingresults = false;
  346. // $('#materio-search-api-search-form').removeClass('loading');
  347. $('#content>.inner-content').html(json.node);
  348. $.event.trigger({ type : 'resultschanged', container : '#content>.inner-content'});
  349. });
  350. // }
  351. }
  352. };
  353. /**
  354. * CARDS
  355. */
  356. function onCardEventDispatcher(event){
  357. // trace('onCardEvent', event);
  358. var vmode = event.currentTarget.className.match(/vm-([a-z|A-Z]+)/);
  359. var f = 'on_'+event.type+'_'+vmode[1];
  360. if(typeof _this[f] == 'function')
  361. _this[f].call(this, event);
  362. };
  363. // function initLayoutCardDispatcher($card){
  364. // // trace('$card', $card);
  365. // var vmode = $card.attr('class').match(/vm-([a-z|A-Z]+)/);
  366. // var f = 'init_layout_'+vmode[1];
  367. // if(typeof _this[f] == 'function')
  368. // _this[f].call(this, $card);
  369. // };
  370. /**
  371. * cards small
  372. */
  373. // MaterioBaseTheme.prototype.init_layout_cardsmall = function($card){
  374. // trace('initLayoutCardBig');
  375. // };
  376. MaterioBaseTheme.prototype.on_mouseenter_cardsmall = function(event){
  377. //trace('MaterioBaseTheme :: on_mouseenter_cardsmall', event);
  378. showLazyLoadedImages(event.currentTarget);
  379. _$tooltip
  380. .html($('.group_header', this).clone().addClass('smallcard'))
  381. .css({
  382. top:event.pageY - _$tooltip.h() -5,//- event.layerY,
  383. left:event.pageX + 5 + ($(this).w() - event.layerX)
  384. })
  385. .removeClass('op-hidden').addClass('op-visible');
  386. };
  387. MaterioBaseTheme.prototype.on_mousemove_cardsmall = function(event){
  388. // trace('on_mousemove_Card', event);
  389. horiHoverImagesSwitcher(event);
  390. _$tooltip
  391. .css({
  392. top:event.pageY - _$tooltip.h() -5,// - event.layerY,
  393. left:event.pageX + 5 + ($(this).w() - event.layerX)
  394. });
  395. };
  396. // MaterioBaseTheme.prototype.on_click_cardsmall = function(event){
  397. // trace('on_click_cardsmall', event);
  398. // };
  399. MaterioBaseTheme.prototype.on_mouseleave_cardsmall = function(event){
  400. // trace('on_mouseleave_Card', event);
  401. $('.images img.op-visible', this)
  402. .removeClass('op-visible').addClass('op-hidden')
  403. .eq(0)
  404. .removeClass('op-hidden').addClass('op-visible');
  405. _$tooltip.removeClass('op-visible').addClass('op-hidden');
  406. };
  407. /**
  408. * cards medium
  409. */
  410. // MaterioBaseTheme.prototype.init_layout_cardmedium = function($card){
  411. // trace('initLayoutCardMedium');
  412. // var ch = $card.h() - $('.group_header', $card).h() -30;
  413. // columnsPage($('.field-name-field-description, .field-name-body', $card), 210, ch);
  414. // };
  415. MaterioBaseTheme.prototype.on_mouseenter_cardmedium = function(event){
  416. // trace('on_mouseenter_cardmedium');
  417. showLazyLoadedImages(event.currentTarget);
  418. $card = $(event.currentTarget);
  419. if(!$('.columnized', $card).size()){
  420. var ch = $card.h() - $('.group_header', $card).h() -30;
  421. columnsPage($('.field-name-field-description, .field-name-body', $card), 210, ch);
  422. $('.group-side-4', $card).wrapInner('<div class="column-wrapper">').find('.field-item').addClass('dontsplit');
  423. columnsPage($('.group_side_4 .column-wrapper', $card), 210, ch);
  424. }
  425. };
  426. MaterioBaseTheme.prototype.on_mousemove_cardmedium = function(event){
  427. // trace('on_mousemove_cardmedium');
  428. horiHoverImagesSwitcher(event);
  429. };
  430. MaterioBaseTheme.prototype.on_click_cardmedium = function(event){
  431. // trace('on_click_cardmedium');
  432. sideSwitcher(event);
  433. };
  434. MaterioBaseTheme.prototype.on_mouseleave_cardmedium = function(event){
  435. if($('.side.op-visible').is('.oops') || $('.side.op-visible').is('.upgrade')){
  436. sideSwitcher(event, 0);
  437. }
  438. };
  439. /**
  440. * cards Big
  441. */
  442. // MaterioBaseTheme.prototype.init_layout_cardbig = function($card){
  443. //trace('initLayoutCardBig');
  444. // columnsPage($('.field-name-field-description, .field-name-body', $card), 425, 270);
  445. // };
  446. MaterioBaseTheme.prototype.on_mouseenter_cardbig = function(event){
  447. // trace('on_mouseenter_cardbig');
  448. showLazyLoadedImages(event.currentTarget);
  449. if(!$('.columnized', event.currentTarget).size()){
  450. columnsPage($('.field-name-field-description, .field-name-body', event.currentTarget), 425, 270);
  451. $('.group_4', event.currentTarget).wrapInner('<div class="column-wrapper">').find('.field-item').addClass('dontsplit');
  452. columnsPage($('.group_4 .column-wrapper', event.currentTarget), 425, 270);
  453. }
  454. };
  455. MaterioBaseTheme.prototype.on_mousemove_cardbig = function(event){
  456. // trace('on_mousemove_cardbig');
  457. horiHoverImagesSwitcher(event);
  458. };
  459. MaterioBaseTheme.prototype.on_click_cardbig = function(event){
  460. //trace('on_click_cardbig');
  461. sideSwitcher(event);
  462. };
  463. MaterioBaseTheme.prototype.on_mouseleave_cardbig = function(event){
  464. if($('.side.op-visible').is('.oops') || $('.side.op-visible').is('.upgrade')){
  465. sideSwitcher(event, 0);
  466. }
  467. };
  468. /**
  469. * cards Full
  470. */
  471. // MaterioBaseTheme.prototype.init_layout_cardfull = function($card){
  472. // trace('initLayoutCardFull');
  473. // };
  474. MaterioBaseTheme.prototype.on_mouseenter_cardfull = function(event){
  475. // trace('on_mouseenter_cardfull');
  476. showLazyLoadedImages(event.currentTarget);
  477. };
  478. MaterioBaseTheme.prototype.on_mousemove_cardfull = function(event){
  479. // trace('on_mousemove_cardfull');
  480. horiHoverImagesSwitcher(event);
  481. };
  482. // MaterioBaseTheme.prototype.on_click_cardfull = function(event){
  483. // trace('on_click_cardfull');
  484. // };
  485. // MaterioBaseTheme.prototype.on_mouseleave_cardfull = function(event){
  486. // trace('on_mouseleave_cardfull');
  487. // };
  488. /**
  489. * horiHoverImagesSwitcher
  490. */
  491. function horiHoverImagesSwitcher(event){
  492. // trace('horiHoverImagesSwitcher', event);
  493. var $curtar = $(event.currentTarget);
  494. if(event.layerX && $curtar.is('.image-ready') ){ // && !$curtar.is('.image-buged')
  495. var $imgs = $('.group_images figure', event.currentTarget);
  496. if($(event.target).parents('.group_images').length){
  497. var imgw = $imgs.eq(0).w(),
  498. rapport = imgw/$imgs.length,
  499. mx = event.layerX > imgw ? imgw-1 : event.layerX,
  500. rapport_pos = Math.floor(mx / rapport);
  501. // trace('rapport_pos = '+rapport_pos+' | event.layerX = '+event.layerX);
  502. rapport_pos = rapport_pos < 0 ? 0 : ( rapport_pos > ($imgs.length - 1) ? $imgs.length - 1 : rapport_pos);
  503. if(!$imgs.eq(rapport_pos).is('.op-visible')){
  504. // google analytics
  505. $.event.trigger({
  506. type : 'record-stat',
  507. categorie : 'Card event',
  508. action : 'image slide switch',
  509. label : rapport_pos
  510. });
  511. $imgs
  512. .removeClass('op-visible').addClass('op-hidden')
  513. .eq(rapport_pos)
  514. .removeClass('op-hidden').addClass('op-visible');
  515. }
  516. }else{
  517. // $curtar.addClass('image-buged');
  518. $imgs.removeClass('op-visible').addClass('op-hidden');
  519. $imgs.eq(0).removeClass('op-hidden').addClass('op-visible');
  520. }
  521. }
  522. };
  523. /**
  524. * protectImages
  525. */
  526. function protectFigures(context){
  527. // trace('protectFigures');
  528. context = context == null ? 'body' : context;
  529. $('figure:not(.protected)', context)
  530. .append('<img class="blank" src="'+_settings.basePath+_themeSettings.themePath+'/img/blank.gif" />')
  531. .addClass('protected')
  532. .bind("contextmenu", function(e){
  533. alert("Cette image est soumise au droit d'auteur.");
  534. return false;
  535. });
  536. }
  537. /**
  538. * lazyloadimages
  539. */
  540. // unused
  541. function initLazyLoad(context){
  542. // $('figure:first-child img.lazy', context).lazyload();//{
  543. // container:'#content'
  544. // });
  545. // TODO: propage this event to the card near it to anticipate the mouseenter
  546. // $(context).bind('mousemove', showLazyLoadedImages);
  547. };
  548. function showLazyLoadedImages(context){
  549. //trace('MaterioBaseTheme :: initLazyLoad : mouseenter', this);
  550. var $this = $(context);
  551. if( !$this.is('.lazy-processed') ){
  552. $this
  553. .addClass('lazy-processed')
  554. // .find('figure img.lazy')
  555. .find('img.lazy')
  556. .each(function(index){
  557. var $img = $(this);
  558. $img.attr('src', $img.attr('data-original')).removeAttr('data-original');
  559. });
  560. setTimeout(function(){
  561. $this.addClass('image-ready');
  562. }, 300);
  563. }
  564. }
  565. /**
  566. * sideSwitcher
  567. */
  568. function sideSwitcher(event, delta){
  569. var $sides = $('.side', event.currentTarget);
  570. if($sides.length > 1){
  571. if( typeof delta == 'undefined'){
  572. var delta = 0;
  573. $sides.each(function(i) {
  574. if($(this).is('.op-visible')){
  575. delta = i+1;
  576. return false;
  577. }
  578. });
  579. delta = delta == 0 ? 1 : (delta == $sides.length ? 0 : delta);
  580. }
  581. // google analytics
  582. $.event.trigger({
  583. type : 'record-stat',
  584. categorie : 'Card event',
  585. action : 'side switch',
  586. label : delta
  587. });
  588. $sides.addClass('op-hidden').removeClass('op-visible')
  589. .eq(delta).removeClass('op-hidden').addClass('op-visible');
  590. }
  591. };
  592. /**
  593. * columnsPage
  594. */
  595. function columnsPage($elmt, cw, ch){
  596. // trace('columnsPage');
  597. var cls = Math.ceil($elmt.h()/ch);
  598. $elmt
  599. .addClass('columnized')
  600. .width(cw*cls)
  601. .columnize({
  602. width:cw,
  603. height:ch,
  604. lastNeverTallest:true,
  605. });
  606. if(cls > 1){
  607. $elmt.find('.column').each(function(index) {
  608. var $this = $(this);
  609. if(!$this.find('*').length){
  610. $this.prev().addClass('last');
  611. $this.remove();
  612. return true;
  613. }
  614. });
  615. $elmt.find('.column').each(function(index) {
  616. var $this = $(this);
  617. if(!$this.is('.first'))
  618. $this.children('*:first-child').prepend('<span cw="'+cw+'" col="'+(index-1)+'" class="column-switcher prev-column">‹</span> ...');
  619. if(!$this.is('.last'))
  620. $this.children('*:last-child').append('... <span cw="'+cw+'" col="'+(index+1)+'" class="column-switcher next-column">›</span>');
  621. });
  622. $('.column-switcher', $elmt).bind('click', onColumnSwitcherClick);
  623. }
  624. };
  625. function onColumnSwitcherClick(event){
  626. event.preventDefault();
  627. //trace('onColumnSwitcherClick', event);
  628. var $this = $(event.currentTarget),
  629. $columnized = $this.parents('.columnized');
  630. // google analytics
  631. $.event.trigger({
  632. type : 'record-stat',
  633. categorie : 'Card event',
  634. action : 'column switch',
  635. label : $this.attr('col')
  636. });
  637. $columnized.css({
  638. marginLeft : -1 * $this.attr('cw') * $this.attr('col') +'px'
  639. });
  640. return false;
  641. }
  642. /**
  643. * initViewmodes
  644. */
  645. function initViewmodes(){
  646. checkViewmodesResponsive();
  647. };
  648. function checkViewmodesResponsive(){
  649. if(_480_768()){
  650. if($('.viewmode-link.active').is('.viewmode-cardfull')){
  651. $('.viewmode-cardbig').trigger('click');
  652. }
  653. }else if(_max_480()){
  654. if($('.viewmode-link.active').is('.viewmode-cardbig, .viewmode-cardfull')){
  655. $('.viewmode-cardmedium').trigger('click');
  656. }
  657. }
  658. };
  659. /**
  660. * FLAGS
  661. */
  662. function initFlagsEvent(){
  663. $('.bookmarks, .mylists .flaged').children('.node:not(.listened)')
  664. .bind('mouseenter mousemove click mouseleave', onCardEventDispatcher)
  665. // .each(function(event){ initLayoutCardDispatcher($(this)); })
  666. .addClass('listened');
  667. };
  668. function onAfterFlaging(event){
  669. //trace('MaterioBaseTheme :: onAfterFlaging', event);
  670. // WARNING to use event variables i had to hack flag.js from flag module (change the event declaration)
  671. var $target = $(event.link).parents('article.node');
  672. if(event.flagStatus == 'flag'){
  673. $target.addClass('flaged');
  674. }else if(event.flagStatus == 'unflag'){
  675. if($('.flag-lists-entity-links a.unflag-action', $target).length == 0)
  676. $target.removeClass('flaged');
  677. }
  678. };
  679. function onMybookmarksBlockUpdate(event){
  680. initFlagsEvent();
  681. initLayout();
  682. };
  683. function onClickList(event){
  684. //trace('onClickList', event);
  685. var $link = $(event.currentTarget).addClass('active'),
  686. name = $link.attr('name'),
  687. $block = $link.parents('.block'),
  688. $flaged = $('.flaged.'+name, $block).addClass('active');
  689. $link.siblings().removeClass('active');
  690. $flaged.siblings().removeClass('active');
  691. createCookie('materiomyflaglistsopened', name, 1);
  692. $flaged.parents('.mylists').height($flaged.h());
  693. initLayout();
  694. };
  695. function onMyListsBlockUpdate(event){
  696. //trace('MaterioBaseTheme :: onMyListsBlockUpdate', event);
  697. initFlagsEvent();
  698. initLazyLoad(this);
  699. // TODO: refresh contents (search results) to see new flaglist links.
  700. initLayout();
  701. };
  702. function onMyListsBlockBuilded(event){
  703. //trace('MaterioBaseTheme :: onMyListsBlockBuilded', event);
  704. // initLazyLoad(event.block);
  705. showLazyLoadedImages(event.block);
  706. };
  707. /**
  708. * cards bookmark
  709. */
  710. // MaterioBaseTheme.prototype.init_layout_bookmark = function($card){
  711. // trace('initLayoutCardBig');
  712. // };
  713. MaterioBaseTheme.prototype.on_mouseenter_bookmark = function(event){
  714. //trace('on_mouseenter_bookmark', event);
  715. _$tooltip
  716. .html($('.group_header', this).clone())
  717. .css({
  718. top:event.pageY - _$tooltip.h() -5,//- event.layerY,
  719. left:event.pageX + 5 + ($(this).w() - event.layerX)
  720. })
  721. .removeClass('op-hidden').addClass('op-visible');
  722. };
  723. MaterioBaseTheme.prototype.on_mousemove_bookmark = function(event){
  724. // trace('on_mousemove_Card', event);
  725. // if(event.layerX)
  726. // horiHoverImagesSwitcher(event);
  727. _$tooltip
  728. .css({
  729. top:event.pageY - _$tooltip.h() -5,// - event.layerY,
  730. left:event.pageX + 5 + ($(this).w() - event.layerX)
  731. });
  732. };
  733. // MaterioBaseTheme.prototype.on_click_bookmark = function(event){
  734. // trace('on_click_bookmark', event);
  735. // };
  736. MaterioBaseTheme.prototype.on_mouseleave_bookmark = function(event){
  737. // trace('on_mouseleave_Card', event);
  738. $('.images img.op-visible', this)
  739. .removeClass('op-visible').addClass('op-hidden')
  740. .eq(0)
  741. .removeClass('op-hidden').addClass('op-visible');
  742. _$tooltip.removeClass('op-visible').addClass('op-hidden');
  743. };
  744. /**
  745. * keyboradshortcuts
  746. */
  747. function initKeyboardShortcuts(){
  748. var stat_event = { type : 'record-stat', categorie : 'Shortcuts'};
  749. $(document).bind('keydown', 'Alt+f',function (evt){
  750. if($('#edit-searchfield').size()){
  751. stat_event.action = 'Alt+f';
  752. stat_event.label = 'Focus on search text field';
  753. $.event.trigger(stat_event);
  754. $('#edit-searchfield').focus();
  755. return false;
  756. }
  757. });
  758. $(document).bind('keydown', 'Alt+1',function (evt){
  759. if($('a.viewmode-link.viewmode-cardsmall').size()){
  760. stat_event.action = 'Alt+1';
  761. stat_event.label = 'Change view mode : card small';
  762. $.event.trigger(stat_event);
  763. $('a.viewmode-link.viewmode-cardsmall').click();
  764. return false;
  765. }
  766. });
  767. $(document).bind('keydown', 'Alt+2',function (evt){
  768. if($('a.viewmode-link.viewmode-cardmedium').size()){
  769. stat_event.action = 'Alt+2';
  770. stat_event.label = 'Change view mode : card medium';
  771. $.event.trigger(stat_event);
  772. $('a.viewmode-link.viewmode-cardmedium').click();
  773. return false;
  774. }
  775. });
  776. $(document).bind('keydown', 'Alt+3',function (evt){
  777. if($('a.viewmode-link.viewmode-cardbig').size()){
  778. stat_event.action = 'Alt+3';
  779. stat_event.label = 'Change view mode : card big';
  780. $.event.trigger(stat_event);
  781. $('a.viewmode-link.viewmode-cardbig').click();
  782. return false;
  783. }
  784. });
  785. $(document).bind('keydown', 'Alt+4',function (evt){
  786. if($('a.viewmode-link.viewmode-cardfull').size()){
  787. stat_event.action = 'Alt+4';
  788. stat_event.label = 'Change view mode : card full';
  789. $.event.trigger(stat_event);
  790. $('a.viewmode-link.viewmode-cardfull').click();
  791. return false;
  792. }
  793. });
  794. };
  795. /**
  796. * Misc
  797. */
  798. function onResizeWindow(e){
  799. clearInterval(_resizeTimer);
  800. _resizeTimer = setTimeout(function(){
  801. initLayout();
  802. checkViewmodesResponsive();
  803. }, 200);
  804. };
  805. /**
  806. * Statics
  807. */
  808. function initAdhesion(){
  809. $('#webform-component-membership-options').change(function(event){
  810. console.log(event);
  811. // if($(event.target).is('#edit-submitted-membership-options-3')){
  812. if( $('input[type="radio"]:checked', this).is('#edit-submitted-membership-options-3') ){
  813. $('#webform-component-collaborators').show();
  814. }else{
  815. $('#webform-component-collaborators').hide();
  816. }
  817. });
  818. $('.get-link a').bind('click', function(event) {
  819. var $this = $(this),
  820. $parent = $this.parents('.column'),
  821. radio;
  822. if($parent.is('.flocon')){
  823. radio = "#edit-submitted-membership-options-1";
  824. }else if($parent.is('.etoile')){
  825. radio = "#edit-submitted-membership-options-2";
  826. }else if($parent.is('.cinqetoiles')){
  827. radio = "#edit-submitted-membership-options-3";
  828. }
  829. // $('input', '#edit-submitted-type-dadhesion').attr('checked', false);
  830. $(radio).attr('checked', true);
  831. $('#webform-component-membership-options').change();
  832. $('#content-bottom').css('padding-top', $('#container').css('padding-top'));
  833. });
  834. $("#edit-submitted-membership-options-1").attr('checked', true);
  835. $('#webform-component-membership-options').change();
  836. };
  837. /** helpers */
  838. $.fn.h = function(){
  839. if(this.css('height') == undefined)
  840. return 0;
  841. return parseInt(this.css('height')) + parseInt(this.css('padding-top')) + parseInt(this.css('padding-bottom'));
  842. };
  843. $.fn.w = function(){
  844. if(this.css('width') == undefined)
  845. return 0;
  846. return parseInt(this.css('width')) + parseInt(this.css('padding-left')) + parseInt(this.css('padding-right'));
  847. };
  848. function getDocHeight() {
  849. var D = document;
  850. return Math.max(
  851. Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
  852. Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
  853. Math.max(D.body.clientHeight, D.documentElement.clientHeight)
  854. );
  855. }
  856. // http://andylangton.co.uk/articles/javascript/get-viewport-size-javascript/
  857. function viewport() {
  858. var e = window, a = 'inner';
  859. if (!('innerWidth' in window )) {
  860. a = 'client';
  861. e = document.documentElement || document.body;
  862. }
  863. return { width : e[ a+'Width' ] , height : e[ a+'Height' ] };
  864. }
  865. /**
  866. * Forms
  867. */
  868. function initForms(){
  869. $('#edit-searchfield')
  870. .bind('focus', function(event) {
  871. var $this = $(this);
  872. //$this.attr('value', 'test');
  873. // trace('value', $this.val());
  874. // trace('default', $this.attr('default'));
  875. if($this.val() == $this.attr('default'))
  876. $this.val('');
  877. })
  878. .bind('focusout', function(event) {
  879. var $this = $(this);
  880. if($this.val() == "")
  881. $this.val($this.attr('default'));
  882. });
  883. var id,label, description;
  884. $('input.form-text', '#block-user-login, #block-materio-user-user-register').each(function(i) {
  885. id = $(this).attr('id');
  886. label = $('label[for='+id+']').hide().text();
  887. description = $(this).parent().find('.description').hide().text();
  888. $(this).attr('placeholder', label).attr('title', description);
  889. });
  890. }
  891. /**
  892. * cookies
  893. */
  894. function createCookie(name,value,days) {
  895. if (days) {
  896. var date = new Date();
  897. date.setTime(date.getTime()+(days*24*60*60*1000));
  898. var expires = "; expires="+date.toGMTString();
  899. }
  900. else var expires = "";
  901. document.cookie = name+"="+value+expires+"; path=/";
  902. }
  903. function readCookie(name) {
  904. var nameEQ = name + "=";
  905. var ca = document.cookie.split(';');
  906. for(var i=0;i < ca.length;i++) {
  907. var c = ca[i];
  908. while (c.charAt(0)==' ') c = c.substring(1,c.length);
  909. if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  910. }
  911. return null;
  912. }
  913. function eraseCookie(name) {
  914. createCookie(name,"",-1);
  915. }
  916. /**
  917. * google analytics
  918. */
  919. function onRecordStat(event){
  920. //trace('onRecordStat', event);
  921. // path, category, action, opt_label, opt_value
  922. if(typeof _gaq !== 'undefined'){
  923. if(event.path){
  924. _gaq.push(['_trackPageview', event.path]);
  925. }else{
  926. _gaq.push(['_trackEvent', event.categorie, event.action, event.label, event.value]);
  927. }
  928. }
  929. }
  930. init();
  931. };
  932. $(document).ready(function() {
  933. var materiobasetheme = new MaterioBaseTheme();
  934. });
  935. /**
  936. * Attach collapse behavior to the feedback form block.
  937. */
  938. Drupal.behaviors.feedbackForm = {
  939. attach: function (context) {
  940. $('#block-feedback-form', context).once('feedback', function () {
  941. var $block = $(this);
  942. $block.find('span.feedback-link')
  943. .prepend('<span id="feedback-form-toggle">feedback</span> ')
  944. .css('cursor', 'pointer')
  945. .toggle(function () {
  946. Drupal.feedbackFormToggle($block, false);
  947. },
  948. function() {
  949. Drupal.feedbackFormToggle($block, true);
  950. }
  951. );
  952. $block.find('form').hide();
  953. $block.show();
  954. });
  955. }
  956. };
  957. /**
  958. * Collapse or uncollapse the feedback form block.
  959. */
  960. Drupal.feedbackFormToggle = function ($block, enable) {
  961. $block.find('form').slideToggle('medium');
  962. if (enable) {
  963. $('#feedback-form-toggle', $block).html('feedback');
  964. }
  965. else {
  966. $('#feedback-form-toggle', $block).html('feedback (close)');
  967. }
  968. };
  969. })(jQuery);