refactoring finished AND lines developed
This commit is contained in:
Bachir Soussi Chiadmi
@@ -6,3 +6,4 @@ sites/*/files
|
||||
sites/*/private
|
||||
|
||||
*.sublime*
|
||||
.sass-cache
|
||||
|
||||
BIN
Binary file not shown.
BIN
Binary file not shown.
@@ -3978,8 +3978,8 @@ div.messages {
|
||||
position: absolute;
|
||||
-webkit-transition: 1s ease-out 1s;
|
||||
transition: 1s ease-out 1s;
|
||||
-webkit-transition-property: -webkit-transform opacity;
|
||||
transition-property: transform opacity;
|
||||
-webkit-transition-property: opacity -webkit-transform;
|
||||
transition-property: opacity transform;
|
||||
}
|
||||
/* line 172, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-name-field-partie:nth-child(3) {
|
||||
@@ -3991,8 +3991,8 @@ div.messages {
|
||||
/* line 176, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-name-field-partie:nth-child(3) > .field-type-text {
|
||||
opacity: 0;
|
||||
-webkit-transition: 1s ease-out;
|
||||
transition: 1s ease-out;
|
||||
-webkit-transition: 1s ease-out 1s;
|
||||
transition: 1s ease-out 1s;
|
||||
-webkit-transition-property: opacity;
|
||||
transition-property: opacity;
|
||||
}
|
||||
@@ -4100,7 +4100,7 @@ div.messages {
|
||||
clear: both;
|
||||
padding-top: 1em;
|
||||
}
|
||||
/* line 250, jee.scss */
|
||||
/* line 252, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-name-field-vignette {
|
||||
position: relative;
|
||||
float: left;
|
||||
@@ -4113,39 +4113,39 @@ div.messages {
|
||||
background-repeat: no-repeat;
|
||||
background-origin: center center;
|
||||
}
|
||||
/* line 264, jee.scss */
|
||||
/* line 265, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-type-text {
|
||||
min-width: 14em;
|
||||
}
|
||||
/* line 268, jee.scss */
|
||||
/* line 266, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-name-field-titre {
|
||||
font-family: "epflul";
|
||||
font-size: 1.6em;
|
||||
line-height: 1.1;
|
||||
}
|
||||
/* line 274, jee.scss */
|
||||
/* line 271, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-name-field-sous-titre {
|
||||
font-family: "epflul";
|
||||
font-size: 1.4em;
|
||||
line-height: 1.2;
|
||||
}
|
||||
/* line 280, jee.scss */
|
||||
/* line 276, jee.scss */
|
||||
#main .node-chapitre.node-teaser .field-name-field-description {
|
||||
font-size: 0.88em;
|
||||
line-height: 1.2;
|
||||
}
|
||||
/* line 286, jee.scss */
|
||||
/* line 282, jee.scss */
|
||||
#main .node-chapitre.node-teaser ul.links {
|
||||
margin: 0;
|
||||
text-align: right;
|
||||
z-index: 5;
|
||||
position: relative;
|
||||
}
|
||||
/* line 288, jee.scss */
|
||||
/* line 284, jee.scss */
|
||||
#main .node-chapitre.node-teaser ul.links li.node-readmore {
|
||||
padding: 0;
|
||||
}
|
||||
/* line 290, jee.scss */
|
||||
/* line 286, jee.scss */
|
||||
#main .node-chapitre.node-teaser ul.links li.node-readmore a {
|
||||
display: inline-block;
|
||||
height: 25px;
|
||||
@@ -4156,70 +4156,99 @@ div.messages {
|
||||
text-align: left;
|
||||
background: transparent url(../assets/img/readmore-btn.svg) no-repeat right center;
|
||||
}
|
||||
/* line 308, jee.scss */
|
||||
/* line 298, jee.scss */
|
||||
#main .node-chapitre.node-teaser .line {
|
||||
z-index: -1;
|
||||
position: absolute;
|
||||
top: 3em;
|
||||
left: 6em;
|
||||
-webkit-transform-origin: top left;
|
||||
-ms-transform-origin: top left;
|
||||
transform-origin: top left;
|
||||
width: 2px;
|
||||
background-color: red;
|
||||
opacity: 0.4;
|
||||
}
|
||||
/* line 316, jee.scss */
|
||||
#main #node-2::after {
|
||||
background-image: url(../assets/img/bgd-sol.svg);
|
||||
}
|
||||
/* line 311, jee.scss */
|
||||
/* line 319, jee.scss */
|
||||
#main #node-2, #main #node-2 a {
|
||||
color: #b24c14;
|
||||
}
|
||||
/* line 312, jee.scss */
|
||||
/* line 320, jee.scss */
|
||||
#main #node-2 h2.node-title, #main #node-2 h2.node-title a {
|
||||
color: #d85509;
|
||||
}
|
||||
/* line 313, jee.scss */
|
||||
/* line 321, jee.scss */
|
||||
#main #node-2 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-sol.svg);
|
||||
}
|
||||
/* line 323, jee.scss */
|
||||
/* line 325, jee.scss */
|
||||
#main #node-2 .line {
|
||||
background-color: #ea5b0c;
|
||||
}
|
||||
/* line 329, jee.scss */
|
||||
#main #node-3::after {
|
||||
background-image: url(../assets/img/bgd-dph.svg);
|
||||
}
|
||||
/* line 326, jee.scss */
|
||||
/* line 332, jee.scss */
|
||||
#main #node-3, #main #node-3 a {
|
||||
color: #686b00;
|
||||
}
|
||||
/* line 327, jee.scss */
|
||||
/* line 333, jee.scss */
|
||||
#main #node-3 h2.node-title, #main #node-3 h2.node-title a {
|
||||
color: #afaf00;
|
||||
}
|
||||
/* line 328, jee.scss */
|
||||
/* line 334, jee.scss */
|
||||
#main #node-3 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-dph.svg);
|
||||
}
|
||||
/* line 338, jee.scss */
|
||||
#main #node-3 .line {
|
||||
background-color: #cecd00;
|
||||
}
|
||||
/* line 342, jee.scss */
|
||||
#main #node-4::after {
|
||||
background-image: url(../assets/img/bgd-sub.svg);
|
||||
}
|
||||
/* line 341, jee.scss */
|
||||
/* line 345, jee.scss */
|
||||
#main #node-4, #main #node-4 a {
|
||||
color: #b71330;
|
||||
}
|
||||
/* line 342, jee.scss */
|
||||
/* line 346, jee.scss */
|
||||
#main #node-4 h2.node-title, #main #node-4 h2.node-title a {
|
||||
color: #cd0734;
|
||||
}
|
||||
/* line 343, jee.scss */
|
||||
/* line 347, jee.scss */
|
||||
#main #node-4 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-sub.svg);
|
||||
}
|
||||
/* line 353, jee.scss */
|
||||
/* line 351, jee.scss */
|
||||
#main #node-4 .line {
|
||||
background-color: #de003a;
|
||||
}
|
||||
/* line 355, jee.scss */
|
||||
#main #node-5::after {
|
||||
background-image: url(../assets/img/bgd-bc.svg);
|
||||
}
|
||||
/* line 356, jee.scss */
|
||||
/* line 358, jee.scss */
|
||||
#main #node-5, #main #node-5 a {
|
||||
color: #033d6f;
|
||||
}
|
||||
/* line 357, jee.scss */
|
||||
/* line 359, jee.scss */
|
||||
#main #node-5 h2.node-title, #main #node-5 h2.node-title a {
|
||||
color: #024b87;
|
||||
}
|
||||
/* line 358, jee.scss */
|
||||
/* line 360, jee.scss */
|
||||
#main #node-5 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-bc.svg);
|
||||
}
|
||||
/* line 364, jee.scss */
|
||||
#main #node-5 .line {
|
||||
background-color: #0066b1;
|
||||
}
|
||||
/* line 368, jee.scss */
|
||||
#main #node-6::after {
|
||||
background-image: url(../assets/img/bgd-opp.svg);
|
||||
@@ -4236,39 +4265,51 @@ div.messages {
|
||||
#main #node-6 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-opp.svg);
|
||||
}
|
||||
/* line 383, jee.scss */
|
||||
/* line 377, jee.scss */
|
||||
#main #node-6 .line {
|
||||
background-color: #af1380;
|
||||
}
|
||||
/* line 381, jee.scss */
|
||||
#main #node-7::after {
|
||||
background-image: url(../assets/img/bgd-dub.svg);
|
||||
}
|
||||
/* line 386, jee.scss */
|
||||
/* line 384, jee.scss */
|
||||
#main #node-7, #main #node-7 a {
|
||||
color: #22742c;
|
||||
}
|
||||
/* line 387, jee.scss */
|
||||
/* line 385, jee.scss */
|
||||
#main #node-7 h2.node-title, #main #node-7 h2.node-title a {
|
||||
color: #288d80;
|
||||
}
|
||||
/* line 388, jee.scss */
|
||||
/* line 386, jee.scss */
|
||||
#main #node-7 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-dub.svg);
|
||||
}
|
||||
/* line 398, jee.scss */
|
||||
/* line 390, jee.scss */
|
||||
#main #node-7 .line {
|
||||
background-color: #62a530;
|
||||
}
|
||||
/* line 394, jee.scss */
|
||||
#main #node-8::after {
|
||||
background-image: url(../assets/img/bgd-juso.svg);
|
||||
}
|
||||
/* line 401, jee.scss */
|
||||
/* line 397, jee.scss */
|
||||
#main #node-8, #main #node-8 a {
|
||||
color: #0b7f8a;
|
||||
}
|
||||
/* line 402, jee.scss */
|
||||
/* line 398, jee.scss */
|
||||
#main #node-8 h2.node-title, #main #node-8 h2.node-title a {
|
||||
color: #009aa8;
|
||||
}
|
||||
/* line 403, jee.scss */
|
||||
/* line 399, jee.scss */
|
||||
#main #node-8 .field-name-field-vignette {
|
||||
background-image: url(../assets/img/shadow-juso.svg);
|
||||
}
|
||||
/* line 412, jee.scss */
|
||||
/* line 403, jee.scss */
|
||||
#main #node-8 .line {
|
||||
background-color: #33b4b5;
|
||||
}
|
||||
/* line 406, jee.scss */
|
||||
#main .chapter-wrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@@ -4277,13 +4318,13 @@ div.messages {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
/* line 419, jee.scss */
|
||||
/* line 413, jee.scss */
|
||||
#footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
/* line 422, jee.scss */
|
||||
/* line 416, jee.scss */
|
||||
#footer .block {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
@@ -167,7 +167,7 @@ div.messages{
|
||||
opacity:0;
|
||||
position:absolute;
|
||||
transition:1s ease-out 1s;
|
||||
transition-property: transform opacity;
|
||||
transition-property: opacity transform;
|
||||
// just let see the field vignette of first partie
|
||||
&:nth-child(3){
|
||||
z-index:2;
|
||||
@@ -175,7 +175,7 @@ div.messages{
|
||||
transition-delay:0;
|
||||
>.field-type-text{
|
||||
opacity:0;
|
||||
transition:1s ease-out;
|
||||
transition:1s ease-out 1s;
|
||||
transition-property: opacity;
|
||||
}
|
||||
>.field-name-field-vignette{cursor:pointer;z-index:2;}
|
||||
@@ -204,7 +204,7 @@ div.messages{
|
||||
.field-name-field-partie{
|
||||
opacity:1; z-index:0;
|
||||
// display all fields inside each parties
|
||||
>.field{opacity:1;z-index:-1; cursor:default;}
|
||||
>.field{opacity:1; z-index:-1; cursor:default;}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -247,6 +247,8 @@ div.messages{
|
||||
|
||||
.field-name-field-partie{clear:both; padding-top:1em;}
|
||||
|
||||
|
||||
$shadow-size:3.5em;
|
||||
.field-name-field-vignette{
|
||||
position:relative;
|
||||
float:left;
|
||||
@@ -260,23 +262,17 @@ div.messages{
|
||||
background-repeat: no-repeat;
|
||||
background-origin: center center;
|
||||
}
|
||||
|
||||
.field-type-text{
|
||||
min-width:14em;
|
||||
}
|
||||
|
||||
.field-type-text{ min-width:14em; }
|
||||
.field-name-field-titre{
|
||||
font-family: "epflul";
|
||||
font-size:1.6em;
|
||||
line-height:1.1;
|
||||
}
|
||||
|
||||
.field-name-field-sous-titre{
|
||||
font-family: "epflul";
|
||||
font-size:1.4em;
|
||||
line-height:1.2;
|
||||
}
|
||||
|
||||
.field-name-field-description{
|
||||
// font-family: "epf-lul";
|
||||
font-size:0.88em;
|
||||
@@ -298,6 +294,18 @@ div.messages{
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.line{
|
||||
z-index:-1;
|
||||
position:absolute;
|
||||
top:$shadow-size - 0.5em; left:$shadow-size+2.5em;
|
||||
transform-origin:top left;
|
||||
width:2px; background-color:red;
|
||||
opacity:0.4;
|
||||
// transition: 3s ease-out;
|
||||
// transition-property:height;
|
||||
}
|
||||
|
||||
} // node-chapitre
|
||||
|
||||
// COLORS BY NODE - - - - - - - - - - - - - - - - - - - - -
|
||||
@@ -314,9 +322,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-sol.svg);
|
||||
background-image:url(../assets/img/shadow-sol.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $SOL-color;
|
||||
// }
|
||||
.line{background-color:$SOL-col-active;}
|
||||
}
|
||||
//DPH
|
||||
#node-3{
|
||||
@@ -329,9 +335,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-dph.png);
|
||||
background-image:url(../assets/img/shadow-dph.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $DPH-color;
|
||||
// }
|
||||
.line{background-color:$DPH-col-active;}
|
||||
}
|
||||
// SUB
|
||||
#node-4{
|
||||
@@ -344,9 +348,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-sub.png);
|
||||
background-image:url(../assets/img/shadow-sub.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $SUB-color;
|
||||
// }
|
||||
.line{background-color:$SUB-col-active;}
|
||||
}
|
||||
// BC
|
||||
#node-5{
|
||||
@@ -359,9 +361,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-bc.png);
|
||||
background-image:url(../assets/img/shadow-bc.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $BC-color;
|
||||
// }
|
||||
.line{background-color:$BC-col-active;}
|
||||
}
|
||||
//OPP
|
||||
#node-6{
|
||||
@@ -374,9 +374,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-opp.png);
|
||||
background-image:url(../assets/img/shadow-opp.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $OPP-color;
|
||||
// }
|
||||
.line{background-color:$OPP-col-active;}
|
||||
}
|
||||
//DUB
|
||||
#node-7{
|
||||
@@ -389,9 +387,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-dub.png);
|
||||
background-image:url(../assets/img/shadow-dub.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $DUB-color;
|
||||
// }
|
||||
.line{background-color:$DUB-col-active;}
|
||||
}
|
||||
// JUSO
|
||||
#node-8{
|
||||
@@ -404,9 +400,7 @@ div.messages{
|
||||
// background-image:url(../assets/img/shadow-juso.png);
|
||||
background-image:url(../assets/img/shadow-juso.svg);
|
||||
}
|
||||
// .field-name-field-vignette::before{
|
||||
// box-shadow: 0 0 $bs-blur $bs-size $JUSO-color;
|
||||
// }
|
||||
.line{background-color:$JUSO-col-active;}
|
||||
}
|
||||
|
||||
.chapter-wrapper{
|
||||
|
||||
@@ -8,7 +8,7 @@ $BC-col-active:rgb(0,102,177);
|
||||
$BC-col-txt:rgb(3,61,111);
|
||||
|
||||
$SUB-color:rgb(205,7,52);
|
||||
$SUB-col-active:rgb(22,0,58);
|
||||
$SUB-col-active:rgb(222,0,58);
|
||||
$SUB-col-txt:rgb(183,19,48);
|
||||
|
||||
$SOL-color:rgb(216,85,9);
|
||||
|
||||
+246
-150
@@ -1,27 +1,7 @@
|
||||
|
||||
Drupal.behaviors.init_theme = function (context) {
|
||||
// Growl-style system messages
|
||||
$('#messages-and-help > div.messages:not(.processed)')
|
||||
.addClass('processed')
|
||||
.each(function() {
|
||||
// If a message meets these criteria, we don't autoclose
|
||||
// - contains a link
|
||||
// - is an error or warning
|
||||
// - contains a lenghthy amount of text
|
||||
if ($('a', this).size() || $(this).is('.error') || $(this).is('.warning') || $(this).text().length > 100) {
|
||||
$(this).prepend("<span class='close'>X</span>");
|
||||
$('span.close', this).click(function() {
|
||||
$(this).parent().slideUp('fast');
|
||||
});
|
||||
}
|
||||
else {
|
||||
// This essentially adds a 3 second pause before hiding the message.
|
||||
$(this).animate({opacity:1}, 5000, 'linear', function() {
|
||||
$(this).slideUp('fast');
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
//
|
||||
// by Bachir Soussi Chiadmi
|
||||
// 2015
|
||||
//
|
||||
|
||||
jQuery(document).ready(function($) {
|
||||
console.log('Hello Jee');
|
||||
@@ -37,7 +17,10 @@ jQuery(document).ready(function($) {
|
||||
},
|
||||
_center = {x:_container.w/2,y:_container.h/2},
|
||||
_nav_pos = {x:0, y:0},
|
||||
_nav_timer;
|
||||
_nav_timer,
|
||||
_last_client = {x:0,y:0},
|
||||
_fps = 1000/12,
|
||||
_dragging = false;
|
||||
|
||||
function init(){
|
||||
initChapters();
|
||||
@@ -46,187 +29,141 @@ jQuery(document).ready(function($) {
|
||||
|
||||
function initChapters(){
|
||||
// Place each chapters on the ellipse contained on the screen
|
||||
var angle, a = Math.random() *360;
|
||||
var base_a = Math.random() *360;
|
||||
_$chapitres.each(function(i, e) {
|
||||
// distribute elements arround the center
|
||||
angle = (360/_chapitres_len*i+a)*Math.PI/180;
|
||||
|
||||
// Lets create the chapter object and place him self
|
||||
_chapters.push(new Chapter($(e), angle));
|
||||
_chapters.push(new Chapter(i, $(e), base_a));
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
function launchNav(){
|
||||
var last_clientX,
|
||||
last_clientY,
|
||||
td;
|
||||
|
||||
$(document)
|
||||
_$container
|
||||
// DESKTOP EVENTS
|
||||
.bind('mousedown', function(e){
|
||||
last_clientX = e.clientX;
|
||||
last_clientY = e.clientY;
|
||||
if(_dragging) return false;
|
||||
_dragging = true;
|
||||
|
||||
console.log('mousedown');
|
||||
_last_client.x=e.clientX;
|
||||
_last_client.y=e.clientY;
|
||||
|
||||
_$chapitres.each(function(i, e) {
|
||||
td = randB(0.1, 0.3);//Math.random() * (0.3 - 0.1) + 0.1;
|
||||
$(e).css({"transitionDuration":td+"s"});
|
||||
$(e).css({"transitionDuration":randB(0.1, 0.3)+"s"});
|
||||
});
|
||||
|
||||
_nav_timer = setInterval(moveNav, 1000/24);
|
||||
_nav_timer = setInterval(moveNav, _fps);
|
||||
|
||||
$(this).bind('mousemove', function(e){
|
||||
_nav_pos.x += e.clientX - last_clientX;
|
||||
_nav_pos.y += e.clientY - last_clientY;
|
||||
last_clientX = e.clientX;
|
||||
last_clientY = e.clientY;
|
||||
console.log('mousemove');
|
||||
_nav_pos.x += e.clientX - _last_client.x;
|
||||
_nav_pos.y += e.clientY - _last_client.y;
|
||||
_last_client.x = e.clientX;
|
||||
_last_client.y = e.clientY;
|
||||
// moveNav();
|
||||
});
|
||||
})
|
||||
.bind('mouseup', function(e){
|
||||
clearInterval(_nav_timer);
|
||||
console.log('mouseup');
|
||||
_dragging = false;
|
||||
// clearInterval(_nav_timer);
|
||||
$(this).unbind('mousemove');
|
||||
})
|
||||
//
|
||||
// TOUCH EVENTS - - - - - - - - - - - - - -
|
||||
//
|
||||
.bind('touchstart', function(e){
|
||||
// console.log('touchstart', e);
|
||||
last_clientX = e.originalEvent.touches[0].clientX;
|
||||
last_clientY = e.originalEvent.touches[0].clientY;
|
||||
if(_dragging) return false;
|
||||
_dragging = true;
|
||||
console.log('touchstart');
|
||||
|
||||
_$chapitres.each(function(i, e) {
|
||||
td = randB(0.1, 0.3); //Math.random() * (0.3 - 0.1) + 0.1;
|
||||
$(e).css({"transitionDuration":td+"s"});
|
||||
});
|
||||
_last_client.x = e.originalEvent.touches[0].clientX;
|
||||
_last_client.y = e.originalEvent.touches[0].clientY;
|
||||
|
||||
_nav_timer = setInterval(moveNav, 1000/12);
|
||||
_$chapitres.each(function(i, e) {
|
||||
$(e).css({"transitionDuration":randB(0.1, 0.3)+"s"});
|
||||
});
|
||||
|
||||
_nav_timer = setInterval(moveNav, _fps);
|
||||
})
|
||||
.bind('touchmove', function(e){
|
||||
// console.log('touchmove', e);
|
||||
_nav_pos.x += e.originalEvent.touches[0].clientX - last_clientX;
|
||||
_nav_pos.y += e.originalEvent.touches[0].clientY - last_clientY;
|
||||
last_clientX = e.originalEvent.touches[0].clientX;
|
||||
last_clientY = e.originalEvent.touches[0].clientY;
|
||||
console.log('touchmove');
|
||||
_nav_pos.x += e.originalEvent.touches[0].clientX - _last_client.x;
|
||||
_nav_pos.y += e.originalEvent.touches[0].clientY - _last_client.y;
|
||||
_last_client.x = e.originalEvent.touches[0].clientX;
|
||||
_last_client.y = e.originalEvent.touches[0].clientY;
|
||||
// moveNav();
|
||||
})
|
||||
.bind('touchend', function(e){
|
||||
// console.log("touchend", e);
|
||||
clearInterval(_nav_timer);
|
||||
console.log("touchend");
|
||||
_dragging = false;
|
||||
// clearInterval(_nav_timer);
|
||||
});
|
||||
|
||||
// click to preview chapter
|
||||
$('h2.node-title, .field-name-field-partie:first>.field-name-field-vignette', _$chapitres).bind('click', previewChapter);
|
||||
// $('h2.node-title, .field-name-field-partie:first>.field-name-field-vignette', _$chapitres).bind('click', previewChapter);
|
||||
|
||||
$('.links a', _$chapitres).on('click', openChapter);
|
||||
// $('.links a', _$chapitres).on('click', openChapter);
|
||||
};
|
||||
|
||||
function moveNav(){
|
||||
// console.log("moveNav");
|
||||
_$chapitres.each(function(i, e){
|
||||
$(e).stop(true, false).css({
|
||||
translate:[_nav_pos.x, _nav_pos.y]
|
||||
});
|
||||
// $(e).transition({translate:[_nav_pos.x, _nav_pos.y]}, 200, 'out');
|
||||
});
|
||||
// move chapters
|
||||
for (var i = _chapitres_len - 1; i >= 0; i--) {
|
||||
_chapters[i].move();
|
||||
};
|
||||
|
||||
// move header
|
||||
_$header.stop(true, false).css({
|
||||
translate:[_nav_pos.x*0.2, _nav_pos.y*0.2]
|
||||
// WebkitTransform:'translate('+_nav_pos.x*0.2+', '+_nav_pos.y*0.2+')'
|
||||
});
|
||||
};
|
||||
|
||||
var $chapt, $parties, px, py;
|
||||
function previewChapter(e){
|
||||
e.preventDefault();
|
||||
// console.log('hello', this);
|
||||
|
||||
$chapt = $(this).parents('.node-chapitre');
|
||||
|
||||
closePreview($chapt);
|
||||
|
||||
$parties = $('.field-name-field-partie', $chapt);
|
||||
$parties.each(function(i, e) {
|
||||
switch(i){
|
||||
case 0:
|
||||
px=randB(-40, 40); py=randB(40, 60);
|
||||
break;
|
||||
case 1:
|
||||
px=randB(100, 200); py=randB(120,220);
|
||||
break;
|
||||
case 2:
|
||||
px=randB(-200, -100); py=randB(250,320);
|
||||
break;
|
||||
case 3:
|
||||
px=randB(-100, 100); py=randB(320,350)+100;
|
||||
break;
|
||||
}
|
||||
setTimeout(
|
||||
(function($chapt, $part, px, py){
|
||||
$part
|
||||
.css({
|
||||
translate:[px, py],
|
||||
// opacity:1
|
||||
});
|
||||
|
||||
// console.log('part', $part);
|
||||
// console.log('part left', $part.height());
|
||||
|
||||
})($chapt, $(e), px, py),10);
|
||||
}); // each $parties
|
||||
|
||||
$chapt.addClass('previewed');
|
||||
return false;
|
||||
}; // previewChapter
|
||||
|
||||
function closePreview($active){
|
||||
_$chapitres
|
||||
.filter('.previewed').not($active)
|
||||
.removeClass('previewed')
|
||||
.find('.field-name-field-partie')
|
||||
.css({transform:"none"});
|
||||
}; // closePreview
|
||||
|
||||
var nid;
|
||||
function openChapter(e){
|
||||
e.preventDefault();
|
||||
nid = $(this).attr("href").match(/^\/node\/(\d+)/);
|
||||
console.log(nid);
|
||||
$.getJSON(
|
||||
'/jee/chapter/'+nid[1],
|
||||
{},
|
||||
displayChapter
|
||||
);
|
||||
|
||||
return false;
|
||||
}; // openChapter
|
||||
|
||||
var $chapterwrapper;
|
||||
function displayChapter(json, textStatus) {
|
||||
$chapterwrapper = $('<div>').addClass('chapter-wrapper').append(json.node).appendTo(_$container);
|
||||
// $chapterwrapper.append(json.node);
|
||||
|
||||
console.log('displayChapter :: json', json);
|
||||
|
||||
console.log('displayChapter :: chapterwrapper', $chapterwrapper);
|
||||
}; //displayChapter
|
||||
|
||||
/*
|
||||
* Chapter
|
||||
*
|
||||
*/
|
||||
function Chapter($e, angle){
|
||||
function Chapter(i, $e, base_a){
|
||||
|
||||
$e.obj = this;
|
||||
this.i = i;
|
||||
this.$e = $e;
|
||||
this.nid = $e.attr("id").match(/^node-(\d+)/)[1];
|
||||
this.geom = {
|
||||
a:angle,
|
||||
base_a:base_a,
|
||||
a:0,
|
||||
r:0
|
||||
}
|
||||
this.pos = {x:0,y:0};
|
||||
this.translation = {x:0, y:0};
|
||||
|
||||
//parties
|
||||
this.$parties = $('.field-name-field-partie', $e);
|
||||
this.lines = new Array();
|
||||
this.linesAnimeInterval = null;
|
||||
this.linesAnimeCounter = 0;
|
||||
this.linesAnimeTime = 5; // sec
|
||||
|
||||
|
||||
// prototypes
|
||||
if (typeof Chapter.initialized == "undefined") {
|
||||
|
||||
Chapter.prototype.init = function(){
|
||||
// var _this = this;
|
||||
// this.$parties.each(function(i, e){
|
||||
// _this.partie.push({$partie:$(this)});
|
||||
// });
|
||||
|
||||
this.setInitPos();
|
||||
this.drawLines();
|
||||
this.setEvents();
|
||||
};
|
||||
|
||||
Chapter.prototype.setInitPos = function(){
|
||||
// distribute elements arround the center
|
||||
this.geom.a = (360/_chapitres_len*this.i+this.geom.base_a)*Math.PI/180;
|
||||
|
||||
// console.log("Chapter :: setInitPos", this.$e);
|
||||
this.geom.c = Math.cos(this.geom.a);
|
||||
this.geom.s = Math.sin(this.geom.a);
|
||||
@@ -254,26 +191,154 @@ jQuery(document).ready(function($) {
|
||||
});
|
||||
};// setIniPos()
|
||||
|
||||
Chapter.prototype.move = function(){
|
||||
Chapter.prototype.setEvents = function(){
|
||||
//http://technify.me/user-experience/javascript/jquery/trigger-custom-events-with-jquery/
|
||||
// click to preview chapter
|
||||
$('h2.node-title, .field-name-field-partie:first>.field-name-field-vignette', this.$e)
|
||||
.on('click', this, function(e){
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
e.data.preview(e);
|
||||
return false;
|
||||
});
|
||||
|
||||
$('.links a', this.$e)
|
||||
.on('click', this, function(e){
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
e.data.loadNode();
|
||||
return false;
|
||||
});
|
||||
};
|
||||
|
||||
Chapter.prototype.preview = function(){
|
||||
Chapter.prototype.move = function(){
|
||||
this.$e.css({ //.stop(true, false)
|
||||
translate:[_nav_pos.x, _nav_pos.y]
|
||||
});
|
||||
// $(e).transition({translate:[_nav_pos.x, _nav_pos.y]}, 200, 'out');
|
||||
};
|
||||
|
||||
Chapter.prototype.preview = function(e){
|
||||
console.log('preview', this.i);
|
||||
|
||||
for (var i = _chapitres_len - 1; i >= 0; i--) {
|
||||
if(i !== this.i)
|
||||
_chapters[i].closePreview();
|
||||
};
|
||||
|
||||
var px, py;
|
||||
this.$parties.each(function(i, e) {
|
||||
switch(i){
|
||||
case 0:
|
||||
px=randB(-40, 40); py=randB(40, 60);
|
||||
break;
|
||||
case 1:
|
||||
px=randB(100, 200); py=randB(120,220);
|
||||
break;
|
||||
case 2:
|
||||
px=randB(-200, -100); py=randB(250,320);
|
||||
break;
|
||||
}
|
||||
|
||||
setTimeout(
|
||||
(function(e, px, py){
|
||||
return function(){
|
||||
$(e)
|
||||
.css({
|
||||
translate:[px, py],
|
||||
// opacity:1
|
||||
});
|
||||
}
|
||||
}(e, px, py)),
|
||||
10);
|
||||
|
||||
}); // each $parties
|
||||
|
||||
this.$e.addClass('previewed');
|
||||
this.animeLines();
|
||||
};
|
||||
|
||||
Chapter.prototype.closePreview = function(){
|
||||
this.$e.removeClass('previewed')
|
||||
.find('.field-name-field-partie')
|
||||
.css({transform:"none"});
|
||||
};
|
||||
|
||||
Chapter.prototype.drawLines = function(){
|
||||
for (var i = 0; i < 2; i++) {
|
||||
this.lines.push({
|
||||
$line:$("<div>").addClass('line', 'line-'+i).prependTo(this.$parties[i])
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
Chapter.prototype.animeLines = function(){
|
||||
this.linesAnimeCounter = 0;
|
||||
this.linesAnimeInterval = setInterval(
|
||||
(function(_this){
|
||||
return function(){
|
||||
// console.log("partie pos : ", _this.$parties.eq(2).position());
|
||||
|
||||
// get the lines length
|
||||
var l, a, pos1, pos2;
|
||||
for (var i = 0; i < _this.lines.length; i++) {
|
||||
pos1 = _this.$parties.eq(i).position();
|
||||
pos2 = _this.$parties.eq(i+1).position();
|
||||
|
||||
l = Math.sqrt(
|
||||
Math.pow(
|
||||
pos2.left - pos1.left
|
||||
,2
|
||||
)
|
||||
+
|
||||
Math.pow(
|
||||
pos2.top - pos1.top
|
||||
,2
|
||||
)
|
||||
);
|
||||
|
||||
// get the rotation
|
||||
a = 180 / 3.14 * Math.acos((pos2.top - pos1.top) / l);
|
||||
if(pos2.left > pos1.left)
|
||||
a *= -1;
|
||||
|
||||
// console.log("a = "+a);
|
||||
_this.lines[i].$line.css({
|
||||
'height':l,
|
||||
rotate:a+"deg"
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
// limit the naimation time
|
||||
_this.linesAnimeCounter ++;
|
||||
if(_this.linesAnimeCounter > (1000/_fps)*_this.linesAnimeTime)
|
||||
clearInterval(_this.linesAnimeInterval);
|
||||
};
|
||||
}(this)),
|
||||
_fps);
|
||||
|
||||
};
|
||||
|
||||
Chapter.prototype.open = function(){
|
||||
Chapter.prototype.loadNode = function(e){
|
||||
// console.log("Chapter :: open : nid", this.nid);
|
||||
$.getJSON(
|
||||
'/jee/chapter/'+this.nid,
|
||||
{},
|
||||
this.displayNode
|
||||
);
|
||||
};
|
||||
|
||||
Chapter.prototype.displayNode = function(json, textstatus){
|
||||
console.log('Chapter :: displayNode : json', json);
|
||||
};
|
||||
|
||||
Node.initialized = true;
|
||||
}
|
||||
|
||||
this.setInitPos();
|
||||
this.init();
|
||||
|
||||
};//Chapter
|
||||
|
||||
@@ -286,4 +351,35 @@ jQuery(document).ready(function($) {
|
||||
|
||||
|
||||
init();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// Drupal.behaviors.init_theme = function (context) {
|
||||
// // Growl-style system messages
|
||||
// $('#messages-and-help > div.messages:not(.processed)')
|
||||
// .addClass('processed')
|
||||
// .each(function() {
|
||||
// // If a message meets these criteria, we don't autoclose
|
||||
// // - contains a link
|
||||
// // - is an error or warning
|
||||
// // - contains a lenghthy amount of text
|
||||
// if ($('a', this).size() || $(this).is('.error') || $(this).is('.warning') || $(this).text().length > 100) {
|
||||
// $(this).prepend("<span class='close'>X</span>");
|
||||
// $('span.close', this).click(function() {
|
||||
// $(this).parent().slideUp('fast');
|
||||
// });
|
||||
// }
|
||||
// else {
|
||||
// // This essentially adds a 3 second pause before hiding the message.
|
||||
// $(this).animate({opacity:1}, 5000, 'linear', function() {
|
||||
// $(this).slideUp('fast');
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
// };
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -58,8 +58,10 @@
|
||||
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
|
||||
Remove this if you use the .htaccess -->
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<?php print $head; ?>
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<!-- <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> -->
|
||||
|
||||
<?php print $head; ?>
|
||||
|
||||
<title><?php print $head_title; ?></title>
|
||||
<?php print $styles; ?>
|
||||
|
||||
Reference in New Issue
Block a user