resize blocs

logs/popularity/daily.json

@@ -1 +1 @@
-{"02-07-2018":140,"03-07-2018":176,"04-07-2018":10,"11-07-2018":166,"13-07-2018":188,"14-07-2018":111}
+{"02-07-2018":140,"03-07-2018":176,"04-07-2018":10,"11-07-2018":166,"13-07-2018":188,"14-07-2018":111,"17-07-2018":148}

logs/popularity/monthly.json

@@ -1 +1 @@
-{"07-2018":791}
+{"07-2018":939}

logs/popularity/totals.json

@@ -1 +1 @@
-{"\/":791}
+{"\/":939}

logs/popularity/visitors.json

@@ -1 +1 @@
-{"79c47964f1cd8a7f86f7fb4e1c1ac6bdb2551b4b":1531535672,"4b84b15bff6ee5796152495a230e45e3d7e947d9":1530699635}
+{"79c47964f1cd8a7f86f7fb4e1c1ac6bdb2551b4b":1531820217,"4b84b15bff6ee5796152495a230e45e3d7e947d9":1530699635}

user/themes/r2c/js/site.js

@@ -3,42 +3,69 @@ function wrap(){
   $('#start > div:nth-child(n+2)').wrapAll('<div class="bottom"></div> ')
 };
 
-function resize() {
-  $(window).on("load resize", function() {
-    $("#recits").resizable();
-    // $( "#reseaux-sociaux" ).resizable();
-  });
-}
-
 function drag() {
 
   var $hand = $( ".handler" );
 
   $hand.draggable({
     drag: function(){
+
+      // dimension handler
+      var $heighthand = $(this).outerHeight();
+      var $widthhand = $(this).outerWidth();
+      // ajust handler
+      var ajustH = $heighthand /2;
+      var ajustW = $widthhand /2;
+
+      // position handler
       var offset = $(this).offset();
-      var xPos = offset.left;
-      var yPos = offset.top;
-      $('#posX').text('x: ' + xPos);
-      $('#posY').text('y: ' + yPos);
-      console.log(yPos);
+      var xPos = offset.left + ajustW;
+      var yPos = offset.top - ajustH;
+
+      var xPos2 = xPos + (ajustW * 2);
+      var yPos2 = yPos + (ajustH * 2);
 
+      // top
       var $recits = $(this).parent('#page').find('#recits');
       var $itw = $(this).parent('#page').find("#interviews");
       var $links = $(this).parent('#page').find("#links");
+
+      // bottom
       var $rs = $(this).parent('#page').find("#reseaux-sociaux");
+      var $stmp = $(this).parent('#page').find("#streetmap");
+      var $img = $(this).parent('#page').find("#img");
+
+      // style
+      var style_recit =  { width: xPos, height : yPos }
+      var style_height =  { height : yPos }
+
+      // app style
+      $recits.css(style_recit);
+      $itw.css(style_height);
+      $links.css(style_height);
+
+      // width div
+      var $w0 = $('html').outerWidth();
+      var $w1_1 = $recits.outerWidth();
+      var $w1_2 = $itw.outerWidth();
+      var $w1_3 = $links.outerWidth();
+
+      var $w2_1 = ($w1_2 + $w1_3) - $w0;
+      var $w2_2 = ($w1_1 + $w1_3) - $w0;
+      var $l2_2 = ($w1_1);
+      var $l2_3 = ($l2_2 + $w1_2);
+      var $w2_3 = ($w1_1 + $w1_2) - $w0;
 
-      var $grid1 = $(this).parent('.top');
-      var $grid2 = $(this).parent('.bottom');
+      // style_bottom
+      var yPos2 = yPos + (ajustH * 2);
 
-      $grid1.css('griqd-template-columns', xPos + 'auto auto' );
-      $grid2.css('grid-template-columns', xPos + 'auto auto' );
+      var $style_rs = { width: xPos, top : yPos2 }
+      var $style_stmp = { width: $w1_2, top : yPos, left : $l2_2 }
+      var $style_img = { width: $w1_3, top : yPos, left : $l2_3 }
 
-      $recits.css('width', xPos);
-      $rs.css('width', xPos);
-      $recits.css('height', yPos);
-      $itw.css('height', yPos);
-      $links.css('height', yPos);
+      $rs.css($style_rs);
+      $stmp.css($style_stmp);
+      $img.css($style_img);
     }
   });
 };
@@ -46,5 +73,4 @@ function drag() {
 $(document).ready(function() {
   wrap();
   drag();
-  // resize();
 });

user/themes/r2c/scss/template/_section.scss

@@ -10,7 +10,7 @@
       // display: grid;
       //
       .blocs{
-        height: calc(100vh/2 - 25px);
+        // height: calc(100vh/2 - 25px);
         overflow-y: auto;
         &:nth-child(1){
           background: red;
@@ -42,9 +42,33 @@
   width: 50px;
   height: 50px;
   border-radius: 25px;
-  background: red;
+  background: blue;
   position: absolute;
   left : calc((100%/3) - 25px);
   top: 50%;
   z-index: 999;
 }
+
+//
+// #start{
+//   height: 100%;
+//   & > div {
+//     position: fixed;
+//     height: 100%;
+//   }
+// }
+
+.bottom{
+height: 100%;
+position: fixed;
+  & > div{
+    position: fixed;
+    height: auto;
+    bottom: 0;
+  }
+}
+//
+// #reseaux-sociaux{
+//   position: fixed;
+//   height: 100%;
+// }