/**
* multiscroll.js 0.0.9 Beta
* https://github.com/alvarotrigo/multiscroll.js
* MIT licensed
*
* Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
*/
(function($) {
$.fn.multiscroll = function(options) {
// Create some defaults, extending them with any options that were provided
options = $.extend({
'verticalCentered' : true,
'scrollingSpeed': 700,
'easing': 'easeInQuart',
'menu': false,
'sectionsColor': [],
'anchors':[],
'navigation': false,
'navigationPosition': 'right',
'navigationColor': '#000',
'navigationTooltips': [],
'loopBottom': false,
'loopTop': false,
'css3': false,
'paddingTop': 0,
'paddingBottom': 0,
'fixedElements': null,
'normalScrollElements': null,
'keyboardScrolling': true,
'touchSensitivity': 5,
//events
'afterLoad': null,
'onLeave': null,
'afterRender': null,
'afterResize': null
}, options);
//Defines the delay to take place before being able to scroll to the next section
//BE CAREFUL! Not recommened to change it under 400 for a good behavior in laptops and
//Apple devices (laptops, mouses...)
var scrollDelay = 600;
var numberSections = $('.ms-left').find('.ms-section').length;
var isMoving = false;
var nav;
var windowHeight = $(window).height();
addMouseWheelHandler();
addTouchHandler();
//if css3 is not supported, it will use jQuery animations
if(options.css3){
options.css3 = support3d();
}
$('html, body').css({
'overflow' : 'hidden',
'height' : '100%'
});
//creating the navigation dots
if (options.navigation) {
$('body').append('<div id="multiscroll-nav"><ul></ul></div>');
nav = $('#multiscroll-nav');
nav.css('color', options.navigationColor);
nav.addClass(options.navigationPosition);
}
$('.ms-right, .ms-left').css({
'width': '50%',
'position': 'absolute',
'height': '100%'
});
$('.ms-right').css({
'right': '0.1px', //http://stackoverflow.com/questions/23675457/chrome-and-opera-creating-small-padding-when-using-displaytable
'top': '0'
});
$('.ms-left').css({
'left': '0',
'top': '0'
});
$('.ms-left .ms-section, .ms-right .ms-section').each(function(){
var sectionIndex = $(this).index();
if(options.paddingTop || options.paddingBottom){
$(this).css('padding', options.paddingTop + ' 0 ' + options.paddingBottom + ' 0');
}
if (typeof options.sectionsColor[sectionIndex] !== 'undefined') {
$(this).css('background-color', options.sectionsColor[sectionIndex]);
}
if (typeof options.anchors[sectionIndex] !== 'undefined') {
$(this).attr('data-anchor', options.anchors[sectionIndex]);
}
if(options.verticalCentered){
addTableClass($(this));
}
//only for the left panel
if($(this).closest('.ms-left').length && options.navigation) {
var link = '';
if(options.anchors.length){
link = options.anchors[sectionIndex];
}
var tooltip = options.navigationTooltips[sectionIndex];
if(typeof tooltip === 'undefined'){
tooltip = '';
}
if (options.navigation) {
nav.find('ul').append('<li data-tooltip="' + tooltip + '"><a href="#' + link + '"><span></span></a></li>');
}
}
});
//inverting the right panel
$('.ms-right').html( $('.ms-right').find('.ms-section').get().reverse());
$('.ms-left .ms-section, .ms-right .ms-section').each(function(){
var sectionIndex = $(this).index();
$(this).css({
'height': '100%'
});
if(!sectionIndex && options.navigation ){
//activating the navigation bullet
nav.find('li').eq(sectionIndex).find('a').addClass('active');
}
}).promise().done(function(){
//if no active section is defined, the 1st one will be the default one
if(!$('.ms-left .ms-section.active').length){
$('.ms-right').find('.ms-section').last().addClass('active');
$('.ms-left').find('.ms-section').first().addClass('active');
}
$.isFunction( options.afterRender ) && options.afterRender.call( this);
//scrolling to the defined active section and adjusting right and left panels
silentScroll();
$(window).on('load', function() {
scrollToAnchor();
});
});
//detecting any change on the URL to scroll to the given anchor link
//(a way to detect back history button as we play with the hashes on the URL)
$(window).on('hashchange',function(){
var value = window.location.hash.replace('#', '');
var sectionAnchor = value;
var section = $('.ms-left').find('[data-anchor="'+sectionAnchor+'"]');
var isFirstScrollMove = (typeof lastScrolledDestiny === 'undefined' );
if (isFirstScrollMove || sectionAnchor !== lastScrolledDestiny){
scrollPage(section);
}
});
/**
* Sliding with arrow keys, both, vertical and horizontal
*/
$(document).keydown(function(e) {
//Moving the main page with the keyboard arrows if keyboard scrolling is enabled
if (options.keyboardScrolling && !isMoving) {
switch (e.which) {
//up
case 38:
case 33:
$.fn.multiscroll.moveSectionUp();
break;
//down
case 40:
case 34:
$.fn.multiscroll.moveSectionDown();
break;
default:
return; // exit this handler for other keys
}
}
});
/**
* Disabling any action when pressing of the mouse wheel (Chrome, IE, Opera, Safari)
*/
$(document).mousedown(function(e) {
if(e.button == 1){
e.preventDefault();
return false;
}
});
//navigation action
$(document).on('click', '#multiscroll-nav a', function(e){
e.preventDefault();
var index = $(this).parent().index();
scrollPage($('.ms-left .ms-section').eq(index));
});