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

first set of Maud corrections

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2015-03-17 18:39:43 +01:00
parent f155c4705a
commit e323a84aec
39 changed files with 12866 additions and 1950 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/themes/gui/jee/js/jee.js
+196 -72
View File
@@ -46,6 +46,7 @@ jQuery(document).ready(function($) {
if(_debug)
initDebug();
initChapterWrapper();
initChapters();
launchNav();
@@ -99,6 +100,18 @@ jQuery(document).ready(function($) {
});
};
function initChapterWrapper(){
$('<div id="home-btn">')
.on("click", closeChapterWrapper)
.appendTo(_$chapter_wrapper);
};
function closeChapterWrapper(e){
_loaded_chapter = false;
_$chapter_wrapper.removeClass('visible');
_$body.removeClass('chapter-displayed');
};
function initChapters(){
// Place each chapters on the ellipse contained on the screen
var base_a = Math.random() *360;
@@ -165,6 +178,10 @@ jQuery(document).ready(function($) {
.bind('document touchstart', function(e){
console.log('touchstart');
clearTimeout(_timeout_dragging);
if(_loaded_chapter)
return false;
// set initial pos
updateNavPos(e.originalEvent.touches[0].clientX, e.originalEvent.touches[0].clientY, true);
@@ -176,12 +193,22 @@ jQuery(document).ready(function($) {
})
.bind('touchmove', function(e){
console.log('document touchmove');
if(_loaded_chapter)
return false;
updateNavPos(e.originalEvent.touches[0].clientX, e.originalEvent.touches[0].clientY, false);
})
.bind('touchend', function(e){
console.log("document touchend");
if(_loaded_chapter)
return false;
stopMoveNav();
});
// TODO : nav on scroll events
};
function updateNavPos(x,y,init){
@@ -299,6 +326,15 @@ jQuery(document).ready(function($) {
this.trans = {x:0, y:0,z:0};
this.ease = randB(0.05, 0.3);
//drifting
this.$title = $('h2.node-title', this.$e);
this.$content = $('.content:first', this.$e);
this.title_x = 0;
this.content_x = 0;
this.drifting_direction = Math.random()-0.5 > 0 ? 1 : -1;
this.drifting_time = null;
//preview
this.is_previewed = false;
@@ -315,9 +351,12 @@ jQuery(document).ready(function($) {
// chapter
this.$n = false;
this.$blocks = false;
this.$vids_container = false;
this.$vids = false;
this.texts_pos = shuffleArray([1,2,3]);
this.dimvideo = {w:0, h:0};
this.$slider = null;
this.cur_vid_playing = 0;
// prototypes
if (typeof Chapter.initialized == "undefined") {
@@ -326,6 +365,7 @@ jQuery(document).ready(function($) {
this.setInitPos();
this.drawLines();
this.setEvents();
this.initDrifiting();
};
Chapter.prototype.setInitPos = function(){
@@ -348,9 +388,9 @@ jQuery(document).ready(function($) {
// change randomly radius
if(this.i%2){
this.geom.r = randB(this.geom.r*2, this.geom.r*3);
this.geom.r = randB(this.geom.r*1.5, this.geom.r*2);
}else{
this.geom.r = randB(this.geom.r, this.geom.r*2);
this.geom.r = randB(this.geom.r*0.8, this.geom.r*1.5);
}
this.pos.x = Math.round(_center.x+this.geom.r * this.geom.c) - this.geom.w/2;
@@ -384,6 +424,40 @@ jQuery(document).ready(function($) {
});
};
Chapter.prototype.initDrifiting = function(){
// an other option could be to drift the whole page with the same engine than draging
requestAnimationFrame(this.drift.bind(this));
};
Chapter.prototype.drift = function(timestamp){
requestAnimationFrame(this.drift.bind(this));
var now = new Date().getTime(),
dt = now - (this.drifting_time || now);
this.drifting_time = now;
if(!this.is_previewed){
this.title_x += (10/1000)*dt*this.drifting_direction;
this.content_x += (6/1000)*dt*this.drifting_direction;
this.drifting_direction =
this.content_x > randB(100,130)
? -1
: this.content_x < -randB(100,130)
? 1
: this.drifting_direction;
this.$title.css({
transform:"translate3d("+this.title_x+"px,0,0)",
});
this.$content.css({
transform:"translate3d("+this.content_x+"px,0,0)",
});
}
};
Chapter.prototype.move = function(){
this.trans.x += (_nav_pos.x - this.trans.x)*this.ease;
this.trans.y += (_nav_pos.y - this.trans.y)*this.ease;
@@ -545,6 +619,12 @@ jQuery(document).ready(function($) {
};
};
// _____ _____ _____ _____ _____ _____ _____ _____ _____ _____ _____
// | | _ | __| | | | | | | _ | _ |_ _| __| __ |
// | | | __| __| | | | | --| | | __| | | | __| -|
// |_____|__| |_____|_|___| |_____|__|__|__|__|__| |_| |_____|__|__|
Chapter.prototype.loadNode = function(e){
// console.log("Chapter :: open : nid", this.nid);
$.getJSON(
@@ -558,14 +638,17 @@ jQuery(document).ready(function($) {
Chapter.prototype.nodeLoaded = function(json, textstatus){
console.log('Chapter :: nodeLoaded '+this.nid+' : json', json);
// remove previous loaded nodes
_$chapter_wrapper.find('.node').remove();
// insert ajax loaded into dom
_$chapter_wrapper.html(json.node);
_$chapter_wrapper.append(json.node);
// record some usefull data
this.$n = $('.node-chapitre', _$chapter_wrapper);
this.$blocks = $('.field-type-text-long', this.$n);
this.$vids = $('.field-name-field-partie', this.$n);
this.$vids_container = $('.field-name-field-partie', this.$n);
this.$vids = $('iframe', this.$vids_container);
// record the current loaded chapter
// this will stop first interface to run
_loaded_chapter = this;
@@ -590,10 +673,10 @@ jQuery(document).ready(function($) {
// build video player
this.buildVideos();
$('.node-title', this.$n).pep();
// show the whole thing
_$chapter_wrapper.addClass('visible');
// this.$vids.eq(this.cur_vid_playing).vimeo('play');
};
Chapter.prototype.placeText = function(i, e){
@@ -629,22 +712,24 @@ jQuery(document).ready(function($) {
Chapter.prototype.buildVideos = function(){
console.log('Chapter :: buildVideos');
this.dimvideo.h = this.$vids.height();
this.dimvideo.h = this.$vids_container.height();
// redim each iframe to fit
// add a mask on top of each iframe to avoid bad interaction with vimeo
$('iframe', this.$vids)
.each(this.redimVideo.bind(this))
.after('<div class="mask"></div>');
this.$vids
.after('<div class="mask"></div>')
.each(this.redimVideo.bind(this));
this.$vids.css({
width:this.dimvideo.w*1.3,
this.$vids_container.css({
width:this.dimvideo.w*1.2,
height:this.dimvideo.h,
marginLeft:(_container.w-this.dimvideo.w*1.3)/2
marginLeft:(_container.w-this.dimvideo.w*1.2)/2
});
// create the slider with peppermint
$('.field-items', this.$vids).Peppermint();
this.$slider = $('.field-items', this.$vids_container).Peppermint({
onSlideChange:this.onSlideChange.bind(this)
});
};
Chapter.prototype.redimVideo = function(i,e){
@@ -655,10 +740,45 @@ jQuery(document).ready(function($) {
.css({ width:this.dimvideo.w, height:this.dimvideo.h })
.attr({ width:this.dimvideo.w, height:this.dimvideo.h })
// add some paading to parent for slider display
.parent().css({
.parent()
.css({
paddingLeft:this.dimvideo.w*0.15,
paddingright:this.dimvideo.w*0.15
});
})
.on("click", this.onClickVid.bind(this));
};
Chapter.prototype.onClickVid = function(e){
e.stopPropagation();
e.preventDefault();
console.log('Chapter :: onClickVid '+this.nid, e);
var $vid = $('iframe', e.currentTarget);
$vid.vimeo('paused', function(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());
//stop current video playing
this.$vids.eq(this.cur_vid_playing).vimeo('pause');
// start new current video
this.cur_vid_playing = this.$slider.data('Peppermint').getCurrentPos();
this.$vids.eq(this.cur_vid_playing).vimeo('play');
};
Node.initialized = true;
@@ -708,6 +828,65 @@ jQuery(document).ready(function($) {
init();
});
/*
____ __________ __ ___________________ ___ _ ________ ______ ______________ _ __ __________ ___ __ _________
/ __ \/ ____/ __ \/ / / / ____/ ___/_ __/ / | / | / / _/ |/ / |/_ __/ _/ __ \/ | / / / ____/ __ \/ | / |/ / ____/
/ /_/ / __/ / / / / / / / __/ \__ \ / / / /| | / |/ // // /|_/ / /| | / / / // / / / |/ / / /_ / /_/ / /| | / /|_/ / __/
/ _, _/ /___/ /_/ / /_/ / /___ ___/ // / / ___ |/ /| // // / / / ___ |/ / _/ // /_/ / /| / / __/ / _, _/ ___ |/ / / / /___
/_/ |_/_____/\___\_\____/_____//____//_/ /_/ |_/_/ |_/___/_/ /_/_/ |_/_/ /___/\____/_/ |_/ /_/ /_/ |_/_/ |_/_/ /_/_____/
*/
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame']
|| window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
timeToCall);
lastTime = currTime + timeToCall;
return id;
};
if (!window.cancelAnimationFrame)
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}());
/*
____ ____
/ __/_ __/ / / __________________ ___ ____
/ /_/ / / / / / / ___/ ___/ ___/ _ \/ _ \/ __ \
/ __/ /_/ / / / (__ ) /__/ / / __/ __/ / / /
/_/ \__,_/_/_/ /____/\___/_/ \___/\___/_/ /_/
*/
// http://davidwalsh.name/fullscreen
// http://www.sitepoint.com/html5-full-screen-api/
// Find the right method, call on correct element
function launchIntoFullscreen(element) {
if(element.requestFullscreen) {
element.requestFullscreen();
} else if(element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if(element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if(element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}
/*
____ __ __ _____________ _______
/ __ \/ / / / / / ____/ _/ | / / ___/
@@ -758,64 +937,9 @@ jQuery(document).ready(function($) {
// }
// })(jQuery);
/*
____ __________ __ ___________________ ___ _ ________ ______ ______________ _ __ __________ ___ __ _________
/ __ \/ ____/ __ \/ / / / ____/ ___/_ __/ / | / | / / _/ |/ / |/_ __/ _/ __ \/ | / / / ____/ __ \/ | / |/ / ____/
/ /_/ / __/ / / / / / / / __/ \__ \ / / / /| | / |/ // // /|_/ / /| | / / / // / / / |/ / / /_ / /_/ / /| | / /|_/ / __/
/ _, _/ /___/ /_/ / /_/ / /___ ___/ // / / ___ |/ /| // // / / / ___ |/ / _/ // /_/ / /| / / __/ / _, _/ ___ |/ / / / /___
/_/ |_/_____/\___\_\____/_____//____//_/ /_/ |_/_/ |_/___/_/ /_/_/ |_/_/ /___/\____/_/ |_/ /_/ /_/ |_/_/ |_/_/ /_/_____/
*/
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame']
|| window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
timeToCall);
lastTime = currTime + timeToCall;
return id;
};
if (!window.cancelAnimationFrame)
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}());
/* ____ ____
/ __/_ __/ / / __________________ ___ ____
/ /_/ / / / / / / ___/ ___/ ___/ _ \/ _ \/ __ \
/ __/ /_/ / / / (__ ) /__/ / / __/ __/ / / /
/_/ \__,_/_/_/ /____/\___/_/ \___/\___/_/ /_/
*/
// http://davidwalsh.name/fullscreen
// http://www.sitepoint.com/html5-full-screen-api/
// Find the right method, call on correct element
function launchIntoFullscreen(element) {
if(element.requestFullscreen) {
element.requestFullscreen();
} else if(element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if(element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if(element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}
// remove navbar