bachir/jeunes-et-engages-d7
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactoring finished AND lines developed

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2015-03-06 19:52:51 +01:00
parent a295c10155
commit 570d31ea3b
8 changed files with 356 additions and 222 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.gitignore
+1
View File
@@ -6,3 +6,4 @@ sites/*/files
sites/*/private sites/*/private
*.sublime* *.sublime*
.sass-cache
sites/all/themes/gui/jee/.sass-cache/06dcbe1fa5b03937e94c01bbbc1f20c6e165e878/jee.scssc
BIN
View File
Binary file not shown.
sites/all/themes/gui/jee/.sass-cache/06dcbe1fa5b03937e94c01bbbc1f20c6e165e878/misc.scssc
BIN
View File
Binary file not shown.
sites/all/themes/gui/jee/css/jee.css
+79 -38
View File
@@ -3978,8 +3978,8 @@ div.messages {
position: absolute; position: absolute;
-webkit-transition: 1s ease-out 1s; -webkit-transition: 1s ease-out 1s;
transition: 1s ease-out 1s; transition: 1s ease-out 1s;
-webkit-transition-property: -webkit-transform opacity; -webkit-transition-property: opacity -webkit-transform;
transition-property: transform opacity; transition-property: opacity transform;
} }
/* line 172, jee.scss */ /* line 172, jee.scss */
#main .node-chapitre.node-teaser .field-name-field-partie:nth-child(3) { #main .node-chapitre.node-teaser .field-name-field-partie:nth-child(3) {
@@ -3991,8 +3991,8 @@ div.messages {
/* line 176, jee.scss */ /* line 176, jee.scss */
#main .node-chapitre.node-teaser .field-name-field-partie:nth-child(3) > .field-type-text { #main .node-chapitre.node-teaser .field-name-field-partie:nth-child(3) > .field-type-text {
opacity: 0; opacity: 0;
-webkit-transition: 1s ease-out; -webkit-transition: 1s ease-out 1s;
transition: 1s ease-out; transition: 1s ease-out 1s;
-webkit-transition-property: opacity; -webkit-transition-property: opacity;
transition-property: opacity; transition-property: opacity;
} }
@@ -4100,7 +4100,7 @@ div.messages {
clear: both; clear: both;
padding-top: 1em; padding-top: 1em;
} }
/* line 250, jee.scss */ /* line 252, jee.scss */
#main .node-chapitre.node-teaser .field-name-field-vignette { #main .node-chapitre.node-teaser .field-name-field-vignette {
position: relative; position: relative;
float: left; float: left;
@@ -4113,39 +4113,39 @@ div.messages {
background-repeat: no-repeat; background-repeat: no-repeat;
background-origin: center center; background-origin: center center;
} }
/* line 264, jee.scss */ /* line 265, jee.scss */
#main .node-chapitre.node-teaser .field-type-text { #main .node-chapitre.node-teaser .field-type-text {
min-width: 14em; min-width: 14em;
} }
/* line 268, jee.scss */ /* line 266, jee.scss */
#main .node-chapitre.node-teaser .field-name-field-titre { #main .node-chapitre.node-teaser .field-name-field-titre {
font-family: "epflul"; font-family: "epflul";
font-size: 1.6em; font-size: 1.6em;
line-height: 1.1; line-height: 1.1;
} }
/* line 274, jee.scss */ /* line 271, jee.scss */
#main .node-chapitre.node-teaser .field-name-field-sous-titre { #main .node-chapitre.node-teaser .field-name-field-sous-titre {
font-family: "epflul"; font-family: "epflul";
font-size: 1.4em; font-size: 1.4em;
line-height: 1.2; line-height: 1.2;
} }
/* line 280, jee.scss */ /* line 276, jee.scss */
#main .node-chapitre.node-teaser .field-name-field-description { #main .node-chapitre.node-teaser .field-name-field-description {
font-size: 0.88em; font-size: 0.88em;
line-height: 1.2; line-height: 1.2;
} }
/* line 286, jee.scss */ /* line 282, jee.scss */
#main .node-chapitre.node-teaser ul.links { #main .node-chapitre.node-teaser ul.links {
margin: 0; margin: 0;
text-align: right; text-align: right;
z-index: 5; z-index: 5;
position: relative; position: relative;
} }
/* line 288, jee.scss */ /* line 284, jee.scss */
#main .node-chapitre.node-teaser ul.links li.node-readmore { #main .node-chapitre.node-teaser ul.links li.node-readmore {
padding: 0; padding: 0;
} }
/* line 290, jee.scss */ /* line 286, jee.scss */
#main .node-chapitre.node-teaser ul.links li.node-readmore a { #main .node-chapitre.node-teaser ul.links li.node-readmore a {
display: inline-block; display: inline-block;
height: 25px; height: 25px;
@@ -4156,70 +4156,99 @@ div.messages {
text-align: left; text-align: left;
background: transparent url(../assets/img/readmore-btn.svg) no-repeat right center; 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 { #main #node-2::after {
background-image: url(../assets/img/bgd-sol.svg); background-image: url(../assets/img/bgd-sol.svg);
} }
/* line 311, jee.scss */ /* line 319, jee.scss */
#main #node-2, #main #node-2 a { #main #node-2, #main #node-2 a {
color: #b24c14; color: #b24c14;
} }
/* line 312, jee.scss */ /* line 320, jee.scss */
#main #node-2 h2.node-title, #main #node-2 h2.node-title a { #main #node-2 h2.node-title, #main #node-2 h2.node-title a {
color: #d85509; color: #d85509;
} }
/* line 313, jee.scss */ /* line 321, jee.scss */
#main #node-2 .field-name-field-vignette { #main #node-2 .field-name-field-vignette {
background-image: url(../assets/img/shadow-sol.svg); 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 { #main #node-3::after {
background-image: url(../assets/img/bgd-dph.svg); background-image: url(../assets/img/bgd-dph.svg);
} }
/* line 326, jee.scss */ /* line 332, jee.scss */
#main #node-3, #main #node-3 a { #main #node-3, #main #node-3 a {
color: #686b00; color: #686b00;
} }
/* line 327, jee.scss */ /* line 333, jee.scss */
#main #node-3 h2.node-title, #main #node-3 h2.node-title a { #main #node-3 h2.node-title, #main #node-3 h2.node-title a {
color: #afaf00; color: #afaf00;
} }
/* line 328, jee.scss */ /* line 334, jee.scss */
#main #node-3 .field-name-field-vignette { #main #node-3 .field-name-field-vignette {
background-image: url(../assets/img/shadow-dph.svg); background-image: url(../assets/img/shadow-dph.svg);
} }
/* line 338, jee.scss */ /* line 338, jee.scss */
#main #node-3 .line {
background-color: #cecd00;
}
/* line 342, jee.scss */
#main #node-4::after { #main #node-4::after {
background-image: url(../assets/img/bgd-sub.svg); background-image: url(../assets/img/bgd-sub.svg);
} }
/* line 341, jee.scss */ /* line 345, jee.scss */
#main #node-4, #main #node-4 a { #main #node-4, #main #node-4 a {
color: #b71330; color: #b71330;
} }
/* line 342, jee.scss */ /* line 346, jee.scss */
#main #node-4 h2.node-title, #main #node-4 h2.node-title a { #main #node-4 h2.node-title, #main #node-4 h2.node-title a {
color: #cd0734; color: #cd0734;
} }
/* line 343, jee.scss */ /* line 347, jee.scss */
#main #node-4 .field-name-field-vignette { #main #node-4 .field-name-field-vignette {
background-image: url(../assets/img/shadow-sub.svg); 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 { #main #node-5::after {
background-image: url(../assets/img/bgd-bc.svg); background-image: url(../assets/img/bgd-bc.svg);
} }
/* line 356, jee.scss */ /* line 358, jee.scss */
#main #node-5, #main #node-5 a { #main #node-5, #main #node-5 a {
color: #033d6f; color: #033d6f;
} }
/* line 357, jee.scss */ /* line 359, jee.scss */
#main #node-5 h2.node-title, #main #node-5 h2.node-title a { #main #node-5 h2.node-title, #main #node-5 h2.node-title a {
color: #024b87; color: #024b87;
} }
/* line 358, jee.scss */ /* line 360, jee.scss */
#main #node-5 .field-name-field-vignette { #main #node-5 .field-name-field-vignette {
background-image: url(../assets/img/shadow-bc.svg); background-image: url(../assets/img/shadow-bc.svg);
} }
/* line 364, jee.scss */
#main #node-5 .line {
background-color: #0066b1;
}
/* line 368, jee.scss */ /* line 368, jee.scss */
#main #node-6::after { #main #node-6::after {
background-image: url(../assets/img/bgd-opp.svg); background-image: url(../assets/img/bgd-opp.svg);
@@ -4236,39 +4265,51 @@ div.messages {
#main #node-6 .field-name-field-vignette { #main #node-6 .field-name-field-vignette {
background-image: url(../assets/img/shadow-opp.svg); 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 { #main #node-7::after {
background-image: url(../assets/img/bgd-dub.svg); background-image: url(../assets/img/bgd-dub.svg);
} }
/* line 386, jee.scss */ /* line 384, jee.scss */
#main #node-7, #main #node-7 a { #main #node-7, #main #node-7 a {
color: #22742c; color: #22742c;
} }
/* line 387, jee.scss */ /* line 385, jee.scss */
#main #node-7 h2.node-title, #main #node-7 h2.node-title a { #main #node-7 h2.node-title, #main #node-7 h2.node-title a {
color: #288d80; color: #288d80;
} }
/* line 388, jee.scss */ /* line 386, jee.scss */
#main #node-7 .field-name-field-vignette { #main #node-7 .field-name-field-vignette {
background-image: url(../assets/img/shadow-dub.svg); 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 { #main #node-8::after {
background-image: url(../assets/img/bgd-juso.svg); background-image: url(../assets/img/bgd-juso.svg);
} }
/* line 401, jee.scss */ /* line 397, jee.scss */
#main #node-8, #main #node-8 a { #main #node-8, #main #node-8 a {
color: #0b7f8a; color: #0b7f8a;
} }
/* line 402, jee.scss */ /* line 398, jee.scss */
#main #node-8 h2.node-title, #main #node-8 h2.node-title a { #main #node-8 h2.node-title, #main #node-8 h2.node-title a {
color: #009aa8; color: #009aa8;
} }
/* line 403, jee.scss */ /* line 399, jee.scss */
#main #node-8 .field-name-field-vignette { #main #node-8 .field-name-field-vignette {
background-image: url(../assets/img/shadow-juso.svg); 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 { #main .chapter-wrapper {
position: absolute; position: absolute;
top: 0; top: 0;
@@ -4277,13 +4318,13 @@ div.messages {
right: 0; right: 0;
} }
/* line 419, jee.scss */ /* line 413, jee.scss */
#footer { #footer {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
right: 0; right: 0;
} }
/* line 422, jee.scss */ /* line 416, jee.scss */
#footer .block { #footer .block {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
sites/all/themes/gui/jee/css/jee.scss
+25 -31
View File
@@ -167,7 +167,7 @@ div.messages{
opacity:0; opacity:0;
position:absolute; position:absolute;
transition:1s ease-out 1s; transition:1s ease-out 1s;
transition-property: transform opacity; transition-property: opacity transform;
// just let see the field vignette of first partie // just let see the field vignette of first partie
&:nth-child(3){ &:nth-child(3){
z-index:2; z-index:2;
@@ -175,7 +175,7 @@ div.messages{
transition-delay:0; transition-delay:0;
>.field-type-text{ >.field-type-text{
opacity:0; opacity:0;
transition:1s ease-out; transition:1s ease-out 1s;
transition-property: opacity; transition-property: opacity;
} }
>.field-name-field-vignette{cursor:pointer;z-index:2;} >.field-name-field-vignette{cursor:pointer;z-index:2;}
@@ -204,7 +204,7 @@ div.messages{
.field-name-field-partie{ .field-name-field-partie{
opacity:1; z-index:0; opacity:1; z-index:0;
// display all fields inside each parties // 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;} .field-name-field-partie{clear:both; padding-top:1em;}
$shadow-size:3.5em;
.field-name-field-vignette{ .field-name-field-vignette{
position:relative; position:relative;
float:left; float:left;
@@ -260,23 +262,17 @@ div.messages{
background-repeat: no-repeat; background-repeat: no-repeat;
background-origin: center center; background-origin: center center;
} }
.field-type-text{ min-width:14em; }
.field-type-text{
min-width:14em;
}
.field-name-field-titre{ .field-name-field-titre{
font-family: "epflul"; font-family: "epflul";
font-size:1.6em; font-size:1.6em;
line-height:1.1; line-height:1.1;
} }
.field-name-field-sous-titre{ .field-name-field-sous-titre{
font-family: "epflul"; font-family: "epflul";
font-size:1.4em; font-size:1.4em;
line-height:1.2; line-height:1.2;
} }
.field-name-field-description{ .field-name-field-description{
// font-family: "epf-lul"; // font-family: "epf-lul";
font-size:0.88em; 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 } // node-chapitre
// COLORS BY NODE - - - - - - - - - - - - - - - - - - - - - // 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);
background-image:url(../assets/img/shadow-sol.svg); background-image:url(../assets/img/shadow-sol.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$SOL-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $SOL-color;
// }
} }
//DPH //DPH
#node-3{ #node-3{
@@ -329,9 +335,7 @@ div.messages{
// background-image:url(../assets/img/shadow-dph.png); // background-image:url(../assets/img/shadow-dph.png);
background-image:url(../assets/img/shadow-dph.svg); background-image:url(../assets/img/shadow-dph.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$DPH-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $DPH-color;
// }
} }
// SUB // SUB
#node-4{ #node-4{
@@ -344,9 +348,7 @@ div.messages{
// background-image:url(../assets/img/shadow-sub.png); // background-image:url(../assets/img/shadow-sub.png);
background-image:url(../assets/img/shadow-sub.svg); background-image:url(../assets/img/shadow-sub.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$SUB-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $SUB-color;
// }
} }
// BC // BC
#node-5{ #node-5{
@@ -359,9 +361,7 @@ div.messages{
// background-image:url(../assets/img/shadow-bc.png); // background-image:url(../assets/img/shadow-bc.png);
background-image:url(../assets/img/shadow-bc.svg); background-image:url(../assets/img/shadow-bc.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$BC-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $BC-color;
// }
} }
//OPP //OPP
#node-6{ #node-6{
@@ -374,9 +374,7 @@ div.messages{
// background-image:url(../assets/img/shadow-opp.png); // background-image:url(../assets/img/shadow-opp.png);
background-image:url(../assets/img/shadow-opp.svg); background-image:url(../assets/img/shadow-opp.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$OPP-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $OPP-color;
// }
} }
//DUB //DUB
#node-7{ #node-7{
@@ -389,9 +387,7 @@ div.messages{
// background-image:url(../assets/img/shadow-dub.png); // background-image:url(../assets/img/shadow-dub.png);
background-image:url(../assets/img/shadow-dub.svg); background-image:url(../assets/img/shadow-dub.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$DUB-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $DUB-color;
// }
} }
// JUSO // JUSO
#node-8{ #node-8{
@@ -404,9 +400,7 @@ div.messages{
// background-image:url(../assets/img/shadow-juso.png); // background-image:url(../assets/img/shadow-juso.png);
background-image:url(../assets/img/shadow-juso.svg); background-image:url(../assets/img/shadow-juso.svg);
} }
// .field-name-field-vignette::before{ .line{background-color:$JUSO-col-active;}
// box-shadow: 0 0 $bs-blur $bs-size $JUSO-color;
// }
} }
.chapter-wrapper{ .chapter-wrapper{
sites/all/themes/gui/jee/css/misc.scss
+1 -1
View File
@@ -8,7 +8,7 @@ $BC-col-active:rgb(0,102,177);
$BC-col-txt:rgb(3,61,111); $BC-col-txt:rgb(3,61,111);
$SUB-color:rgb(205,7,52); $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); $SUB-col-txt:rgb(183,19,48);
$SOL-color:rgb(216,85,9); $SOL-color:rgb(216,85,9);
sites/all/themes/gui/jee/js/jee.js
+245 -149
View File
@@ -1,27 +1,7 @@
//
Drupal.behaviors.init_theme = function (context) { // by Bachir Soussi Chiadmi
// Growl-style system messages // 2015
$('#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');
});
}
});
};
jQuery(document).ready(function($) { jQuery(document).ready(function($) {
console.log('Hello Jee'); console.log('Hello Jee');
@@ -37,7 +17,10 @@ jQuery(document).ready(function($) {
}, },
_center = {x:_container.w/2,y:_container.h/2}, _center = {x:_container.w/2,y:_container.h/2},
_nav_pos = {x:0, y:0}, _nav_pos = {x:0, y:0},
_nav_timer; _nav_timer,
_last_client = {x:0,y:0},
_fps = 1000/12,
_dragging = false;
function init(){ function init(){
initChapters(); initChapters();
@@ -46,187 +29,141 @@ jQuery(document).ready(function($) {
function initChapters(){ function initChapters(){
// Place each chapters on the ellipse contained on the screen // 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) { _$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 // 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(){ function launchNav(){
var last_clientX,
last_clientY,
td;
$(document) _$container
// DESKTOP EVENTS // DESKTOP EVENTS
.bind('mousedown', function(e){ .bind('mousedown', function(e){
last_clientX = e.clientX; if(_dragging) return false;
last_clientY = e.clientY; _dragging = true;
console.log('mousedown');
_last_client.x=e.clientX;
_last_client.y=e.clientY;
_$chapitres.each(function(i, e) { _$chapitres.each(function(i, e) {
td = randB(0.1, 0.3);//Math.random() * (0.3 - 0.1) + 0.1; $(e).css({"transitionDuration":randB(0.1, 0.3)+"s"});
$(e).css({"transitionDuration":td+"s"});
}); });
_nav_timer = setInterval(moveNav, 1000/24); _nav_timer = setInterval(moveNav, _fps);
$(this).bind('mousemove', function(e){ $(this).bind('mousemove', function(e){
_nav_pos.x += e.clientX - last_clientX; console.log('mousemove');
_nav_pos.y += e.clientY - last_clientY; _nav_pos.x += e.clientX - _last_client.x;
last_clientX = e.clientX; _nav_pos.y += e.clientY - _last_client.y;
last_clientY = e.clientY; _last_client.x = e.clientX;
_last_client.y = e.clientY;
// moveNav();
}); });
}) })
.bind('mouseup', function(e){ .bind('mouseup', function(e){
clearInterval(_nav_timer); console.log('mouseup');
_dragging = false;
// clearInterval(_nav_timer);
$(this).unbind('mousemove'); $(this).unbind('mousemove');
}) })
// //
// TOUCH EVENTS - - - - - - - - - - - - - - // TOUCH EVENTS - - - - - - - - - - - - - -
// //
.bind('touchstart', function(e){ .bind('touchstart', function(e){
// console.log('touchstart', e); if(_dragging) return false;
last_clientX = e.originalEvent.touches[0].clientX; _dragging = true;
last_clientY = e.originalEvent.touches[0].clientY; console.log('touchstart');
_$chapitres.each(function(i, e) { _last_client.x = e.originalEvent.touches[0].clientX;
td = randB(0.1, 0.3); //Math.random() * (0.3 - 0.1) + 0.1; _last_client.y = e.originalEvent.touches[0].clientY;
$(e).css({"transitionDuration":td+"s"});
});
_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){ .bind('touchmove', function(e){
// console.log('touchmove', e); console.log('touchmove');
_nav_pos.x += e.originalEvent.touches[0].clientX - last_clientX; _nav_pos.x += e.originalEvent.touches[0].clientX - _last_client.x;
_nav_pos.y += e.originalEvent.touches[0].clientY - last_clientY; _nav_pos.y += e.originalEvent.touches[0].clientY - _last_client.y;
last_clientX = e.originalEvent.touches[0].clientX; _last_client.x = e.originalEvent.touches[0].clientX;
last_clientY = e.originalEvent.touches[0].clientY; _last_client.y = e.originalEvent.touches[0].clientY;
// moveNav();
}) })
.bind('touchend', function(e){ .bind('touchend', function(e){
// console.log("touchend", e); console.log("touchend");
clearInterval(_nav_timer); _dragging = false;
// clearInterval(_nav_timer);
}); });
// click to preview chapter // 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(){ function moveNav(){
// console.log("moveNav"); // console.log("moveNav");
_$chapitres.each(function(i, e){ // move chapters
$(e).stop(true, false).css({ for (var i = _chapitres_len - 1; i >= 0; i--) {
translate:[_nav_pos.x, _nav_pos.y] _chapters[i].move();
}); };
// $(e).transition({translate:[_nav_pos.x, _nav_pos.y]}, 200, 'out');
}); // move header
_$header.stop(true, false).css({ _$header.stop(true, false).css({
translate:[_nav_pos.x*0.2, _nav_pos.y*0.2] 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 * Chapter
* *
*/ */
function Chapter($e, angle){ function Chapter(i, $e, base_a){
$e.obj = this;
this.i = i;
this.$e = $e; this.$e = $e;
this.nid = $e.attr("id").match(/^node-(\d+)/)[1];
this.geom = { this.geom = {
a:angle, base_a:base_a,
a:0,
r:0 r:0
} }
this.pos = {x:0,y:0}; this.pos = {x:0,y:0};
this.translation = {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 // prototypes
if (typeof Chapter.initialized == "undefined") { 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(){ 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); // console.log("Chapter :: setInitPos", this.$e);
this.geom.c = Math.cos(this.geom.a); this.geom.c = Math.cos(this.geom.a);
this.geom.s = Math.sin(this.geom.a); this.geom.s = Math.sin(this.geom.a);
@@ -254,26 +191,154 @@ jQuery(document).ready(function($) {
}); });
};// setIniPos() };// 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(){ 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; Node.initialized = true;
} }
this.setInitPos(); this.init();
};//Chapter };//Chapter
@@ -287,3 +352,34 @@ jQuery(document).ready(function($) {
init(); 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');
// });
// }
// });
// };
sites/all/themes/gui/jee/templates/html.tpl.php
+4 -2
View File
@@ -58,8 +58,10 @@
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
Remove this if you use the .htaccess --> Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="mobile-web-app-capable" content="yes"> <meta name="mobile-web-app-capable" content="yes">
<?php print $head; ?> <!-- <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> <title><?php print $head_title; ?></title>
<?php print $styles; ?> <?php print $styles; ?>