bug fix

sites/all/themes/gui/jee/css/jee.css

@@ -4472,47 +4472,52 @@ div.messages {
 #main .node-chapitre.node-teaser .field-name-field-vignette {
   position: relative;
   float: left;
-  padding: 3.5em;
-  margin-top: -4.025em;
-  margin-right: -2em;
+  padding: 3em;
+  margin-top: -3.45em;
+  margin-right: -1.5em;
   margin-bottom: 0;
   margin-left: 0;
   background-size: contain;
 }
-/* line 503, jee.scss */
+/* line 502, jee.scss */
+#main .node-chapitre.node-teaser .field-name-field-vignette img {
+  width: 65px;
+  height: 65px;
+}
+/* line 506, jee.scss */
 #main .node-chapitre.node-teaser .field-type-text {
   min-width: 16em;
 }
-/* line 504, jee.scss */
+/* line 507, jee.scss */
 #main .node-chapitre.node-teaser .field-name-field-titre {
   font-family: "epflul";
-  font-size: 1.6em;
+  font-size: 1.4em;
   line-height: 1.1;
 }
-/* line 509, jee.scss */
+/* line 512, jee.scss */
 #main .node-chapitre.node-teaser .field-name-field-sous-titre {
   font-family: "epflul";
-  font-size: 1.4em;
+  font-size: 1.2em;
   line-height: 1.2;
 }
-/* line 514, jee.scss */
+/* line 517, jee.scss */
 #main .node-chapitre.node-teaser .field-name-field-description {
   font-size: 0.88em;
-  line-height: 1.2;
+  line-height: 1;
 }
-/* line 520, jee.scss */
+/* line 523, jee.scss */
 #main .node-chapitre.node-teaser .line {
   z-index: -1;
   position: absolute;
-  top: 3em;
-  left: 6em;
+  top: 2.5em;
+  left: 5.5em;
   -webkit-transform-origin: top left;
       -ms-transform-origin: top left;
           transform-origin: top left;
   width: 2px;
   opacity: 0.4;
 }
-/* line 538, jee.scss */
+/* line 541, jee.scss */
 #main #chapter-wrapper {
   position: absolute;
   top: 0;
@@ -4539,12 +4544,12 @@ div.messages {
                                          |__|
   */
 }
-/* line 547, jee.scss */
+/* line 550, jee.scss */
 #main #chapter-wrapper.visible {
   opacity: 1;
   z-index: 500;
 }
-/* line 552, jee.scss */
+/* line 555, jee.scss */
 #main #chapter-wrapper #home-btn {
   background: transparent url("../assets/img/home-btn.png") no-repeat center center;
   background: none, url("../assets/img/home-btn.svg") no-repeat center center;
@@ -4556,129 +4561,129 @@ div.messages {
   height: 20px;
   cursor: pointer;
 }
-/* line 567, jee.scss */
+/* line 570, jee.scss */
 #main #chapter-wrapper #node-2 {
   background: transparent url("../assets/img/bgd-sol.png") no-repeat center center;
   background: none, url("../assets/img/bgd-sol.svg") no-repeat center center;
 }
-/* line 569, jee.scss */
+/* line 572, jee.scss */
 #main #chapter-wrapper #node-2 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-2 h2.node-title,
 #main #chapter-wrapper #node-2 .field-name-field-dbatre li:before {
   color: #ea5b0c;
 }
-/* line 574, jee.scss */
+/* line 577, jee.scss */
 #main #chapter-wrapper #node-2 h2.node-title {
   background: transparent url("../assets/img/title-SOL-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-SOL-blur.svg") no-repeat center center;
 }
-/* line 577, jee.scss */
+/* line 580, jee.scss */
 #main #chapter-wrapper #node-3 {
   background: transparent url("../assets/img/bgd-dph.png") no-repeat center center;
   background: none, url("../assets/img/bgd-dph.svg") no-repeat center center;
 }
-/* line 579, jee.scss */
+/* line 582, jee.scss */
 #main #chapter-wrapper #node-3 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-3 h2.node-title,
 #main #chapter-wrapper #node-3 .field-name-field-dbatre li:before {
   color: #cecd00;
 }
-/* line 584, jee.scss */
+/* line 587, jee.scss */
 #main #chapter-wrapper #node-3 h2.node-title {
   background: transparent url("../assets/img/title-DPH-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-DPH-blur.svg") no-repeat center center;
 }
-/* line 587, jee.scss */
+/* line 590, jee.scss */
 #main #chapter-wrapper #node-4 {
   background: transparent url("../assets/img/bgd-sub.png") no-repeat center center;
   background: none, url("../assets/img/bgd-sub.svg") no-repeat center center;
 }
-/* line 589, jee.scss */
+/* line 592, jee.scss */
 #main #chapter-wrapper #node-4 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-4 h2.node-title,
 #main #chapter-wrapper #node-4 .field-name-field-dbatre li:before {
   color: #de003a;
 }
-/* line 594, jee.scss */
+/* line 597, jee.scss */
 #main #chapter-wrapper #node-4 h2.node-title {
   background: transparent url("../assets/img/title-SUB-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-SUB-blur.svg") no-repeat center center;
 }
-/* line 597, jee.scss */
+/* line 600, jee.scss */
 #main #chapter-wrapper #node-5 {
   background: transparent url("../assets/img/bgd-bc.png") no-repeat center center;
   background: none, url("../assets/img/bgd-bc.svg") no-repeat center center;
 }
-/* line 599, jee.scss */
+/* line 602, jee.scss */
 #main #chapter-wrapper #node-5 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-5 h2.node-title,
 #main #chapter-wrapper #node-5 .field-name-field-dbatre li:before {
   color: #0066b1;
 }
-/* line 604, jee.scss */
+/* line 607, jee.scss */
 #main #chapter-wrapper #node-5 h2.node-title {
   background: transparent url("../assets/img/title-BC-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-BC-blur.svg") no-repeat center center;
 }
-/* line 607, jee.scss */
+/* line 610, jee.scss */
 #main #chapter-wrapper #node-6 {
   background: transparent url("../assets/img/bgd-opp.png") no-repeat center center;
   background: none, url("../assets/img/bgd-opp.svg") no-repeat center center;
 }
-/* line 609, jee.scss */
+/* line 612, jee.scss */
 #main #chapter-wrapper #node-6 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-6 h2.node-title,
 #main #chapter-wrapper #node-6 .field-name-field-dbatre li:before {
   color: #af1380;
 }
-/* line 614, jee.scss */
+/* line 617, jee.scss */
 #main #chapter-wrapper #node-6 h2.node-title {
   background: transparent url("../assets/img/title-OPP-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-OPP-blur.svg") no-repeat center center;
 }
-/* line 617, jee.scss */
+/* line 620, jee.scss */
 #main #chapter-wrapper #node-7 {
   background: transparent url("../assets/img/bgd-bub.png") no-repeat center center;
   background: none, url("../assets/img/bgd-bub.svg") no-repeat center center;
 }
-/* line 619, jee.scss */
+/* line 622, jee.scss */
 #main #chapter-wrapper #node-7 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-7 h2.node-title,
 #main #chapter-wrapper #node-7 .field-name-field-dbatre li:before {
   color: #62a530;
 }
-/* line 624, jee.scss */
+/* line 627, jee.scss */
 #main #chapter-wrapper #node-7 h2.node-title {
   background: transparent url("../assets/img/title-DUB-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-DUB-blur.svg") no-repeat center center;
 }
-/* line 627, jee.scss */
+/* line 630, jee.scss */
 #main #chapter-wrapper #node-8 {
   background: transparent url("../assets/img/bgd-juso.png") no-repeat center center;
   background: none, url("../assets/img/bgd-juso.svg") no-repeat center center;
 }
-/* line 629, jee.scss */
+/* line 632, jee.scss */
 #main #chapter-wrapper #node-8 .field-type-text-long .field-label,
 #main #chapter-wrapper #node-8 h2.node-title,
 #main #chapter-wrapper #node-8 .field-name-field-dbatre li:before {
   color: #33b4b5;
 }
-/* line 634, jee.scss */
+/* line 637, jee.scss */
 #main #chapter-wrapper #node-8 h2.node-title {
   background: transparent url("../assets/img/title-JUSO-blur.png") no-repeat center center;
   background: none, url("../assets/img/title-JUSO-blur.svg") no-repeat center center;
 }
-/* line 645, jee.scss */
+/* line 648, jee.scss */
 #main #chapter-wrapper .node {
   position: relative;
   height: 100%;
   width: 100%;
 }
-/* line 648, jee.scss */
+/* line 651, jee.scss */
 #main #chapter-wrapper .node a {
   color: inherit;
 }
-/* line 651, jee.scss */
+/* line 654, jee.scss */
 #main #chapter-wrapper .node-title {
   font-family: "epflulb";
   font-weight: normal;
@@ -4697,49 +4702,51 @@ div.messages {
   z-index: -1;
   opacity: 0.4;
 }
-/* line 667, jee.scss */
-#main #chapter-wrapper .node > .field {
+/* line 670, jee.scss */
+#main #chapter-wrapper .node > .field, #main #chapter-wrapper .node > .block {
   position: absolute;
 }
-/* line 671, jee.scss */
-#main #chapter-wrapper .field-type-text-long {
+/* line 674, jee.scss */
+#main #chapter-wrapper .field-type-text-long, #main #chapter-wrapper .field-type-text {
   background-color: rgba(255, 255, 255, 0.9);
-  width: 23em;
+  min-height: 5em;
+  width: 19em;
   padding: 1em;
   z-index: 10;
   cursor: move;
 }
-/* line 676, jee.scss */
-#main #chapter-wrapper .field-type-text-long .field-label {
+/* line 680, jee.scss */
+#main #chapter-wrapper .field-type-text-long .field-label, #main #chapter-wrapper .field-type-text .field-label {
   text-transform: uppercase;
   font-family: "epflulb";
-  font-size: 1.5em;
+  font-size: 1.2em;
 }
-/* line 682, jee.scss */
-#main #chapter-wrapper .field-type-text-long h2 {
-  font-size: 0.88em;
+/* line 686, jee.scss */
+#main #chapter-wrapper .field-type-text-long h2, #main #chapter-wrapper .field-type-text h2 {
+  font-size: 0.80em;
 }
-/* line 685, jee.scss */
-#main #chapter-wrapper .field-type-text-long p {
-  font-size: 0.88em;
+/* line 689, jee.scss */
+#main #chapter-wrapper .field-type-text-long p, #main #chapter-wrapper .field-type-text p {
+  font-size: 0.80em;
   margin-bottom: 0.5em;
 }
-/* line 690, jee.scss */
+/* line 694, jee.scss */
 #main #chapter-wrapper .field-name-field-dbatre {
   left: 60em;
 }
-/* line 692, jee.scss */
+/* line 696, jee.scss */
 #main #chapter-wrapper .field-name-field-dbatre ul {
   margin-left: 1em;
 }
-/* line 694, jee.scss */
+/* line 698, jee.scss */
 #main #chapter-wrapper .field-name-field-dbatre ul li {
   list-style: none;
   line-height: 1;
   margin-bottom: 1em;
   position: relative;
+  font-size: 0.80em;
 }
-/* line 699, jee.scss */
+/* line 704, jee.scss */
 #main #chapter-wrapper .field-name-field-dbatre ul li:before {
   content: "?";
   position: absolute;
@@ -4747,14 +4754,14 @@ div.messages {
   left: -1em;
   font-family: "epflul";
 }
-/* line 710, jee.scss */
+/* line 715, jee.scss */
 #main #chapter-wrapper .field-name-field-partie {
   height: 60%;
   width: 100%;
   top: 20%;
   left: 0;
 }
-/* line 713, jee.scss */
+/* line 718, jee.scss */
 #main #chapter-wrapper .field-name-field-partie .field-items {
   position: relative;
   top: 0;
@@ -4762,16 +4769,16 @@ div.messages {
   height: 100%;
   width: auto;
 }
-/* line 718, jee.scss */
+/* line 723, jee.scss */
 #main #chapter-wrapper .field-name-field-partie .field-items .field {
   position: relative;
   display: inline-block;
 }
-/* line 721, jee.scss */
+/* line 726, jee.scss */
 #main #chapter-wrapper .field-name-field-partie .field-items .field .mask {
   position: absolute;
   width: 100%;
-  height: 100%;
+  height: 85%;
   top: 0;
   left: 0;
   z-index: 10;
@@ -4784,7 +4791,7 @@ div.messages {
  ___/ // / / ___ |/ / _/ // /___     | |/ |/ / _, _/ ___ |/ ____/ ____/ /___/ _, _/
 /____//_/ /_/  |_/_/ /___/\____/     |__/|__/_/ |_/_/  |_/_/   /_/   /_____/_/ |_|
 */
-/* line 741, jee.scss */
+/* line 747, jee.scss */
 #static-wrapper {
   position: absolute;
   top: 15%;
@@ -4799,14 +4806,14 @@ div.messages {
   -webkit-transition-property: opacity;
           transition-property: opacity;
 }
-/* line 751, jee.scss */
+/* line 757, jee.scss */
 #static-wrapper.visible {
   opacity: 0.9;
   -webkit-transition: 1.5s ease-out;
           transition: 1.5s ease-out;
   z-index: 500;
 }
-/* line 757, jee.scss */
+/* line 763, jee.scss */
 #static-wrapper > .close {
   position: absolute;
   top: 20px;
@@ -4818,40 +4825,40 @@ div.messages {
   background: transparent url("../assets/img/close.png") no-repeat center center;
   background: none, url("../assets/img/close.svg") no-repeat center center;
 }
-/* line 766, jee.scss */
+/* line 772, jee.scss */
 #static-wrapper > .inner {
   padding: 5em 7em;
   width: 100%;
   height: 100%;
   overflow: hidden;
 }
-/* line 770, jee.scss */
+/* line 776, jee.scss */
 #static-wrapper > .inner > .node {
   width: 100%;
   height: 100%;
   overflow-y: auto;
   overflow-x: hidden;
 }
-/* line 776, jee.scss */
+/* line 782, jee.scss */
 #static-wrapper h2.node-title {
   font-family: "epflulb";
   text-transform: uppercase !important;
   font-size: 3em;
   color: #000;
 }
-/* line 784, jee.scss */
+/* line 790, jee.scss */
 #static-wrapper .content h3 {
   font-family: "epflulb";
   font-size: 2em;
   text-transform: uppercase !important;
   color: #8d198f;
 }
-/* line 791, jee.scss */
+/* line 797, jee.scss */
 #static-wrapper .content h4 {
   font-size: 1.5em;
   font-weight: 700;
 }
-/* line 798, jee.scss */
+/* line 804, jee.scss */
 #static-wrapper .content p {
   font-family: "open_sans", sans-serif;
   font-weight: 600;
@@ -4865,51 +4872,56 @@ div.messages {
  / __/ / /_/ / /_/ / / / / /___/ _, _/
 /_/    \____/\____/ /_/ /_____/_/ |_|
 */
-/* line 815, jee.scss */
+/* line 821, jee.scss */
 #footer {
   position: fixed;
   bottom: 0;
   right: 20px;
   z-index: 900;
 }
-/* line 819, jee.scss */
+/* line 826, jee.scss */
+body.chapter-displayed #footer {
+  display: none;
+}
+/* line 830, jee.scss */
 #footer .block {
   display: inline-block;
   vertical-align: top;
-  font-size: 0.693em;
+  font-size: 0.5em;
 }
-/* line 823, jee.scss */
+/* line 834, jee.scss */
 #footer .block p {
   font-size: inherit;
 }
-/* line 824, jee.scss */
+/* line 835, jee.scss */
 #footer .block a {
   color: #000;
 }
-/* line 827, jee.scss */
+/* line 838, jee.scss */
 #footer .block-menu {
   display: block;
   font-size: inherit;
 }
-/* line 830, jee.scss */
+/* line 841, jee.scss */
 #footer .block-menu ul {
   margin: 0;
   padding: 0;
 }
-/* line 832, jee.scss */
+/* line 843, jee.scss */
 #footer .block-menu ul li {
   margin: 0 1em 0 0;
   padding: 0;
   display: inline-block;
   list-style: none;
 }
-/* line 836, jee.scss */
+/* line 847, jee.scss */
 #footer .block-menu ul li a {
   font-family: "epflulb";
   color: #000;
   text-transform: uppercase;
+  font-size: 0.6em;
 }
-/* line 845, jee.scss */
+/* line 857, jee.scss */
 #footer p {
   margin: 0;
 }
@@ -4921,13 +4933,13 @@ div.messages {
  / /  / // / ___/ / /___
 /_/  /_/___//____/\____/
 */
-/* line 856, jee.scss */
+/* line 868, jee.scss */
 #loader {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 120px;
-  height: 10px;
+  height: 4px;
   margin-left: -60px;
   margin-top: -5px;
   background: transparent url(../assets/img/loader.gif) no-repeat center center;
@@ -4938,13 +4950,13 @@ div.messages {
   -webkit-transition-property: opacity;
           transition-property: opacity;
 }
-/* line 867, jee.scss */
+/* line 879, jee.scss */
 body.loading #loader {
   z-index: 1000;
   opacity: 1;
 }
 
-/* line 873, jee.scss */
+/* line 885, jee.scss */
 #fullscreen-btn {
   position: fixed;
   right: 20px;
@@ -4958,13 +4970,13 @@ body.loading #loader {
   background: transparent url("../assets/img/fullscreen-on.png") no-repeat center center;
   background: none, url("../assets/img/fullscreen-on.svg") no-repeat center center;
 }
-/* line 882, jee.scss */
+/* line 894, jee.scss */
 .fullscreen #fullscreen-btn {
   background: transparent url("../assets/img/fullscreen-off.png") no-repeat center center;
   background: none, url("../assets/img/fullscreen-off.svg") no-repeat center center;
 }
 
-/* line 895, jee.scss */
+/* line 907, jee.scss */
 .bubble-1 {
   position: absolute;
   z-index: 0;
@@ -4977,7 +4989,7 @@ body.loading #loader {
   left: -200px;
 }
 
-/* line 899, jee.scss */
+/* line 911, jee.scss */
 .bubble-2 {
   position: absolute;
   z-index: 0;
@@ -4990,7 +5002,7 @@ body.loading #loader {
   right: -400px;
 }
 
-/* line 904, jee.scss */
+/* line 916, jee.scss */
 .star {
   position: absolute;
   z-index: 0;
@@ -5008,7 +5020,7 @@ body.loading #loader {
  / /_/ / /___/ /_/ / /_/ / /_/ /
 /_____/_____/_____/\____/\____/
 */
-/* line 918, jee.scss */
+/* line 930, jee.scss */
 #fps {
   position: fixed;
   bottom: 40px;
@@ -5016,7 +5028,7 @@ body.loading #loader {
   z-index: 1000;
 }
 
-/* line 924, jee.scss */
+/* line 936, jee.scss */
 #nav-cursor {
   position: absolute;
   width: 6px;

sites/all/themes/gui/jee/css/jee.scss

@@ -487,7 +487,7 @@ div.messages{
     .field-name-field-partie{clear:both; padding-top:1em;}
 
 
-    $shadow-size:3.5em;
+    $shadow-size:3em;
     .field-name-field-vignette{
       position:relative;
       float:left;
@@ -499,22 +499,25 @@ div.messages{
       background-size: contain;
       // background-repeat: no-repeat;
       // background-origin: center center;
+      img{
+        width:65px; height:65px;
+      }
     }
     .field-type-text{ min-width:16em; }
     .field-name-field-titre{
       font-family: "epflul";
-      font-size:1.6em;
+      font-size:1.4em;
       line-height:1.1;
     }
     .field-name-field-sous-titre{
       font-family: "epflul";
-      font-size:1.4em;
+      font-size:1.2em;
       line-height:1.2;
     }
     .field-name-field-description{
       // font-family: "epf-lul";
       font-size:0.88em;
-      line-height:1.2;
+      line-height:1;
     }
 
     .line{
@@ -664,26 +667,27 @@ div.messages{
       opacity:0.4;
     }
 
-    .node>.field{
+    .node>.field, .node>.block{
       position:absolute;
     }
 
-    .field-type-text-long{
+    .field-type-text-long, .field-type-text{
       background-color: rgba(255,255,255,0.9);
-      width:23em; padding:1em;
+      min-height:5em; width:19em; padding:1em;
       z-index:10;
       cursor:move;
+
       .field-label{
         text-transform: uppercase;
         font-family: "epflulb";
-        font-size:1.5em;
+        font-size:1.2em;
       }
 
       h2{
-        font-size:0.88em;
+        font-size:0.80em;
       }
       p{
-        font-size: 0.88em;
+        font-size: 0.80em;
         margin-bottom:0.5em;
       }
     }
@@ -696,6 +700,7 @@ div.messages{
           line-height:1;
           margin-bottom: 1em;
           position:relative;
+          font-size: 0.80em;
           &:before{
             content:"?";
             position:absolute;
@@ -720,10 +725,11 @@ div.messages{
           display:inline-block;
           .mask{
             position:absolute;
-            width:100%; height:100%;
+            width:100%; height:85%;
             top:0; left:0;
             z-index:10;
             cursor:move;
+            // background-color: rgba(150,250,250,0.2);
           }
         }
       }
@@ -816,10 +822,15 @@ div.messages{
   position:fixed;
   bottom:0; right:20px;
   z-index:900;
+
+  body.chapter-displayed &{
+    display:none;
+  }
+
   .block{
     display:inline-block;
     vertical-align: top;
-    font-size:0.693em;
+    font-size:0.5em;
     p{font-size: inherit;}
     a{color:#000;}
   }
@@ -837,6 +848,7 @@ div.messages{
           font-family: "epflulb";
           color:#000;
           text-transform: uppercase;
+          font-size:0.6em;
         }
       }
     }
@@ -856,7 +868,7 @@ div.messages{
 #loader{
   position:absolute;
   top:50%; left:50%;
-  width:120px; height:10px;
+  width:120px; height:4px;
   margin-left:-60px; margin-top:-5px;
 
   background: transparent url(../assets/img/loader.gif) no-repeat center center;

sites/all/themes/gui/jee/js/jee.js

@@ -115,14 +115,18 @@ jQuery(document).ready(function($) {
 
   function initChapterWrapper(){
     $('<div id="home-btn">')
-      .on("click", closeChapterWrapper)
+      .on("click", onCloseChapterWrapper)
       .appendTo(_$chapter_wrapper);
   };
 
-  function closeChapterWrapper(e){
+  function onCloseChapterWrapper(e){
+    _loaded_chapter.stopAndClose();
     _loaded_chapter = false;
     _$chapter_wrapper.removeClass('visible');
     _$body.removeClass('chapter-displayed');
+    setTimeout(function(){
+      _$chapter_wrapper.find('.node').remove();
+    }, 2000);
   };
 
   function initChapters(){
@@ -312,6 +316,13 @@ jQuery(document).ready(function($) {
       setTimeout(_loaded_chapter.buildVideos(), 100);
   };
 
+  /*
+   _____ _____ _____ _____ _____ _____ _____
+  |   __|_   _|  _  |_   _|     |     |   __|
+  |__   | | | |     | | | |-   -|   --|__   |
+  |_____| |_| |__|__| |_| |_____|_____|_____|
+
+  */
   function initStaticLinks(){
     $('ul.menu a', _$footer).on('click', onClickStaticLink);
     _$close_static.on('click', onCloseStatic);
@@ -735,7 +746,7 @@ jQuery(document).ready(function($) {
 
         // record some usefull data
         this.$n = $('.node-chapitre', _$chapter_wrapper);
-        this.$blocks = $('.field-type-text-long', this.$n);
+        this.$blocks = $('.field-type-text-long, .field-type-text', this.$n);
         this.$vids_container = $('.field-name-field-partie', this.$n);
         this.$vids = $('iframe', this.$vids_container);
         // record the current loaded chapter
@@ -750,7 +761,7 @@ jQuery(document).ready(function($) {
         console.log('Chapter :: displayNode '+this.nid);
 
         // place text blocks
-        this.texts_pos = shuffleArray([1,2,3]);
+        this.texts_pos = shuffleArray([1,2,3,4]);
         this.$blocks
           .each(this.placeText.bind(this))
           .pep({
@@ -773,7 +784,17 @@ jQuery(document).ready(function($) {
       Chapter.prototype.placeText = function(i, e){
         // console.log("Chapter :: placeText", e);
         switch(this.texts_pos[i]){
-          case 1: // top right
+          case 1: // top left
+            $(e)
+              .css({
+                top:randB(_container.h*0.05-$(e).height(),_container.h*0.15-$(e).height()),
+                left:randB(_container.w*0.1,_container.w*0.2)
+              })
+              // .pep({debug:true, startPos:{bottom:randB(80,90),right:randB(80,90)}})
+              .find('.field-label')
+                .appendTo(e);
+          break;
+          case 2: // top right
             $(e)
               .css({
                 top:randB(_container.h*0.05-$(e).height(),_container.h*0.15-$(e).height()),
@@ -783,14 +804,14 @@ jQuery(document).ready(function($) {
               .find('.field-label')
                 .appendTo(e);
           break;
-          case 2: // bottom left
+          case 3: // bottom left
             $(e).css({
               top:randB(_container.h*0.8,_container.h*0.9),
               left:randB(_container.w*0.1,_container.w*0.2)
             });
             // $(e).pep({debug:true, startPos:{top:randB(80,90),left:randB(10,30)}});
           break;
-          case 3: // bottom right
+          case 4: // bottom right
             $(e).css({
               top:randB(_container.h*0.8,_container.h*0.9),
               left:randB(_container.w*0.7,_container.w*0.9-$(e).width())
@@ -836,9 +857,10 @@ jQuery(document).ready(function($) {
                 paddingLeft:this.dimvideo.w*0.15,
                 paddingright:this.dimvideo.w*0.15
               })
-              .on("click", this.onClickVid.bind(this));
+              // .on("click", this.onClickVid.bind(this));
       };
 
+      // not used
       Chapter.prototype.onClickVid = function(e){
         e.stopPropagation();
         e.preventDefault();
@@ -847,22 +869,18 @@ jQuery(document).ready(function($) {
         var $vid = $('iframe', e.currentTarget);
 
         $vid.vimeo('paused', function(data){
-
-          console.log('paused : ', data);
-
+          console.log('paused : ', data)
           if(data){
             $vid.vimeo('play');
           }else{
             $vid.vimeo('pause');
           }
         });
-
-
         return false;
       };
 
       Chapter.prototype.onSlideChange = function(){
-        console.log('onSlideChange '+this.nid, this.$slider.data('Peppermint').getCurrentPos());
+        console.log('onSlideChange nid :'+this.nid+'| current : ', this.$slider.data('Peppermint').getCurrentPos());
 
         //stop current video playing
         this.$vids.eq(this.cur_vid_playing).vimeo('pause');
@@ -872,6 +890,11 @@ jQuery(document).ready(function($) {
         this.$vids.eq(this.cur_vid_playing).vimeo('play');
       };
 
+      Chapter.prototype.stopAndClose = function(){
+        console.log('stopAndClose nid :'+this.nid+'| current : '+this.cur_vid_playing);
+        this.$vids.eq(this.cur_vid_playing).vimeo('unload');
+      };
+
       Node.initialized = true;
     };