added card behaviour to news on homeV2

sites/all/themes/gui/materiobasetheme/css/styles.css

@@ -11503,20 +11503,27 @@ body.home-v2 #center {
   padding-right: 0.9375rem;
   width: 33.33333%;
   float: left;
-  width: 30.5%;
-  padding-left: 1em;
+  padding: 0em;
+  margin-left: 1em;
 }
 /* line 3236, ../scss/styles.scss */
+#home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper .panel-panel.panel-col-first {
+  width: auto;
+}
+/* line 3237, ../scss/styles.scss */
+#home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper .panel-panel:not(.panel-col-first) {
+  width: 31%;
+}
+/* line 3238, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper .panel-panel .inside {
   margin: 0;
 }
-/* line 3237, ../scss/styles.scss */
+/* line 3239, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper .panel-panel article.node, #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper .panel-panel article.node-breve.vm-cardbig {
-  max-width: 95%;
   margin: 0;
   height: 610px;
 }
-/* line 3240, ../scss/styles.scss */
+/* line 3242, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom {
   width: 100%;
   margin-left: auto;
@@ -11536,22 +11543,22 @@ body.home-v2 #center {
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom:after {
   clear: both;
 }
-/* line 3242, ../scss/styles.scss */
+/* line 3244, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom > .inside {
   padding-left: 0.9375rem;
   padding-right: 0.9375rem;
   width: 100%;
   float: left;
 }
-/* line 3246, ../scss/styles.scss */
+/* line 3248, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom p {
   display: none;
 }
-/* line 3247, ../scss/styles.scss */
+/* line 3249, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-checkboxes {
   margin: 0 0 0.5em 0;
 }
-/* line 3249, ../scss/styles.scss */
+/* line 3251, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-checkboxes .form-item {
   display: moz-inline-stack;
   display: inline-block;
@@ -11560,11 +11567,11 @@ body.home-v2 #center {
   *display: inline;
   margin-right: 1em;
 }
-/* line 3251, ../scss/styles.scss */
+/* line 3253, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-checkboxes .form-item label, #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-checkboxes .form-item input {
   vertical-align: middle;
 }
-/* line 3255, ../scss/styles.scss */
+/* line 3257, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-item-mail {
   display: moz-inline-stack;
   display: inline-block;
@@ -11573,7 +11580,7 @@ body.home-v2 #center {
   *display: inline;
   margin: 0;
 }
-/* line 3257, ../scss/styles.scss */
+/* line 3259, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-item-mail label, #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom .form-item-mail input {
   display: moz-inline-stack;
   display: inline-block;
@@ -11582,7 +11589,7 @@ body.home-v2 #center {
   *display: inline;
   margin-right: 1em;
 }
-/* line 3260, ../scss/styles.scss */
+/* line 3262, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom #edit-subscribe, #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom #edit-unsubscribe {
   display: moz-inline-stack;
   display: inline-block;
@@ -11590,7 +11597,7 @@ body.home-v2 #center {
   zoom: 1;
   *display: inline;
 }
-/* line 3268, ../scss/styles.scss */
+/* line 3270, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 .node-simplenews {
   border-radius: 5px;
   background-clip: padding-box;
@@ -11602,7 +11609,7 @@ body.home-v2 #center {
   position: relative;
   margin: 7px;
 }
-/* line 3275, ../scss/styles.scss */
+/* line 3277, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 .node-simplenews > a {
   position: absolute;
   bottom: 0;
@@ -11610,13 +11617,13 @@ body.home-v2 #center {
   background-color: #FFF;
   text-align: center;
 }
-/* line 3280, ../scss/styles.scss */
+/* line 3282, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2 .node-simplenews > a h1 {
   padding: 10px;
   margin: 0;
   font-size: 1em;
 }
-/* line 3289, ../scss/styles.scss */
+/* line 3291, ../scss/styles.scss */
 #home-v2 > .panel-panel > div > .pane-news-home-v2:after {
   content: url("../img/point.png");
   position: absolute;

sites/all/themes/gui/materiobasetheme/js/script.js

@@ -81,8 +81,8 @@
       checkIE();
       initHistoryNav();
 
-      if(_isFrontNotLogged && !_isFrontHomeV2)
-        initHome();
+      // if(_isFrontNotLogged && !_isFrontHomeV2)
+      //   initHome();
 
       if(_isFrontHomeV2)
         initHomeV2();
@@ -174,8 +174,13 @@
       }
     };
 
-    /**
-    * home
+    /*
+        __                                 ___
+       / /_  ____  ____ ___  ___     _   _<  /
+      / __ \/ __ \/ __ `__ \/ _ \   | | / / /
+     / / / / /_/ / / / / / /  __/   | |/ / /
+    /_/ /_/\____/_/ /_/ /_/\___/    |___/_/
+
     */
     function initHome(){
       $('img.lazy', '#block-materio-didactique-materio-didactique-home').each(function(){
@@ -291,7 +296,9 @@
 
     */
     function initHomeV2(){
-      console.log('initHomeV2');
+      //console.log('initHomeV2');
+
+      initCards('#home-v2 .panel-pane.news-panel .panel-col-first .views-row');
 
       if(!_max_480()){
 
@@ -542,9 +549,7 @@
     };
 
     function initCards(container){
-      //TODO : refactore this function, to much features in there
-
-      //trace('theme :: initCards', container);
+      trace('theme :: initCards', container);
       var $container = $(container);
       $container.children('.node:not(.listened)')
         .bind('mouseenter focused mousemove click mouseleave', onCardEventDispatcher)
@@ -826,9 +831,7 @@
     function horiHoverImagesSwitcher(event){
       // trace('horiHoverImagesSwitcher', event);
       var $curtar = $(event.currentTarget);
-      // TODO : event.layerX doesn't exists in IE8 so we have to calculate the mouse position from offsetX, pageY, etc
-      // var layerX = event.layerX ? event.layerX : event.clientX - event.currentTarget.offsetLeft;
-      var layerX = event.clientX - event.currentTarget.offsetLeft;
+      var layerX  = (event.offsetX || event.pageX - $(event.target).offset().left);
       // trace("layerX", layerX);
       if(layerX && $curtar.is('.image-ready')  ){ // && !$curtar.is('.image-buged')
         var $imgs = $('.group-images figure', event.currentTarget);
@@ -837,8 +840,9 @@
               rapport = imgw/$imgs.length,
               mx = layerX > imgw ? imgw-1 : layerX,
               rapport_pos = Math.floor(mx / rapport);
-          // trace('rapport_pos = '+rapport_pos+' | event.layerX = '+event.layerX);
+          // trace('imgw = '+imgw+' | rapport_pos = '+rapport_pos+' | layerX = '+layerX);
           rapport_pos = rapport_pos < 0 ? 0 : ( rapport_pos > ($imgs.length - 1) ? $imgs.length - 1 : rapport_pos);
+          // trace('rapport_pos', rapport_pos);
 
           if(!$imgs.eq(rapport_pos).is('.op-visible')){
             // google analytics

sites/all/themes/gui/materiobasetheme/scss/styles.scss

@@ -3231,10 +3231,12 @@ body.home-v2{
       .panel-panel{
         overflow:hidden;
         @include grid-column(4);
-        width:30.5%;
-        padding-left:1em;
+        // width:32.8%;
+        padding:0em; margin-left:1em;
+        &.panel-col-first{width:auto;}
+        &:not(.panel-col-first){width:31%;}
         .inside{margin:0;}
-        article.node,  article.node-breve.vm-cardbig{max-width: 95%; margin:0; height:610px;}
+        article.node,  article.node-breve.vm-cardbig{margin:0; height:610px;}
       }
     }
     #mini-panel-news_home_v2 .panel-col-bottom{