jquery.pagepiling.min.js

/* ===========================================================
 * pagepiling.js 0.0.7 (Beta)
 *
 * https://github.com/alvarotrigo/pagePiling.js
 * MIT licensed
 *
 * Copyright (C) 2014 alvarotrigo.com - A project by Alvaro Trigo
 *
 * ========================================================== */

!function(n){n.fn.pagepiling=function(e){function t(n){n.addClass("pp-table").wrapInner('<div class="pp-tableCell" style="height:100%" />')}function o(e){var t=n(".pp-section.active").index(".pp-section"),o=e.index(".pp-section");return t>o?"up":"down"}function i(t,i){var c={destination:t,animated:i,activeSection:n(".pp-section.active"),anchorLink:t.data("anchor"),sectionIndex:t.index(".pp-section"),toMove:t,yMovement:o(t),leavingSection:n(".pp-section.active").index(".pp-section")+1};if(!c.activeSection.is(t)){void 0===c.animated&&(c.animated=!0),void 0!==c.anchorLink&&p(c.anchorLink),c.destination.addClass("active").siblings().removeClass("active"),c.sectionsToMove=s(c),"down"===c.yMovement?(c.translate3d=D(),c.scrolling="-100%",e.css3||c.sectionsToMove.each(function(e){e!=c.activeSection.index(".pp-section")&&n(this).css(l(c.scrolling))}),c.animateSection=c.activeSection):(c.translate3d="translate3d(0px, 0px, 0px)",c.scrolling="0",c.animateSection=t),n.isFunction(e.onLeave)&&e.onLeave.call(this,c.leavingSection,c.sectionIndex+1,c.yMovement),a(c),X(c.anchorLink),P(c.anchorLink,c.sectionIndex),I=c.anchorLink;var r=(new Date).getTime();O=r}}function a(t){e.css3?(f(t.animateSection,t.translate3d,t.animated),t.sectionsToMove.each(function(){f(n(this),t.translate3d,t.animated)}),setTimeout(function(){c(t)},e.scrollingSpeed)):(t.scrollOptions=l(t.scrolling),t.animated?t.animateSection.animate(t.scrollOptions,e.scrollingSpeed,e.easing,function(){r(t),c(t)}):(t.animateSection.css(l(t.scrolling)),setTimeout(function(){r(t),c(t)},400)))}function c(t){n.isFunction(e.afterLoad)&&e.afterLoad.call(this,t.anchorLink,t.sectionIndex+1)}function s(e){var t;return t=n(".pp-section").map("down"===e.yMovement?function(t){return t<e.destination.index(".pp-section")?n(this):void 0}:function(t){return t>e.destination.index(".pp-section")?n(this):void 0})}function r(e){var t;return"up"===e.yMovement&&(t=function(){e.sectionsToMove.each(function(){n(this).css(l(e.scrolling))})}),t}function l(n){return"vertical"===e.direction?{top:n}:{left:n}}function p(n){e.anchors.length&&(location.hash=n)}function d(){var t=window.location.hash.replace("#",""),o=t,a=n('.pp-section[data-anchor="'+o+'"]');a.length>0&&i(a,e.animateAnchor)}function u(){var n=(new Date).getTime();return n-O<z+e.scrollingSpeed?!0:!1}function v(){var e=window.location.hash.replace("#","").split("/"),t=e[0];if(t.length){if(t&&t!==I){if(isNaN(t))var o=n('[data-anchor="'+t+'"]');else var o=n(".pp-section").eq(t-1);i(o)}}}function h(n){return{"-webkit-transform":n,"-moz-transform":n,"-ms-transform":n,transform:n}}function f(n,e,t){n.toggleClass("pp-easing",t),n.css(h(e))}function g(e){if(!u()){e=window.event||e;var t=Math.max(-1,Math.min(1,e.wheelDelta||-e.deltaY||-e.detail)),o=n(".pp-section.active"),i=S(o);return 0>t?m("down",i):m("up",i),!1}}function m(e,t){if("down"==e)var o="bottom",i=n.fn.pagepiling.moveSectionDown;else var o="top",i=n.fn.pagepiling.moveSectionUp;if(t.length>0){if(!isScrolled(o,t))return!0;i()}else i()}function S(n){return scrollable=n.find(".pp-scrollable")}function w(){q.get(0).addEventListener?(q.get(0).removeEventListener("mousewheel",g,!1),q.get(0).removeEventListener("wheel",g,!1)):q.get(0).detachEvent("onmousewheel",g)}function x(){q.get(0).addEventListener?(q.get(0).addEventListener("mousewheel",g,!1),q.get(0).addEventListener("wheel",g,!1)):q.get(0).attachEvent("onmousewheel",g)}function M(){U&&(MSPointer=b(),q.off("touchstart "+MSPointer.down).on("touchstart "+MSPointer.down,C),q.off("touchmove "+MSPointer.move).on("touchmove "+MSPointer.move,T))}function E(){U&&(MSPointer=b(),q.off("touchstart "+MSPointer.down),q.off("touchmove "+MSPointer.move))}function b(){var n;return n=window.PointerEvent?{down:"pointerdown",move:"pointermove",up:"pointerup"}:{down:"MSPointerDown",move:"MSPointerMove",up:"MSPointerUp"}}function y(n){var e=[];return window.navigator.msPointerEnabled?(e.y=n.pageY,e.x=n.pageX):(e.y=n.touches[0].pageY,e.x=n.touches[0].pageX),e}function C(n){var e=n.originalEvent,t=y(e);W=t.y,touchStartX=t.x}function T(t){var o=t.originalEvent;if(!k(t.target)){t.preventDefault();var i=n(".pp-section.active"),a=S(i);if(!u()){var c=y(o);touchEndY=c.y,touchEndX=c.x,"horizontal"===e.direction&&Math.abs(touchStartX-touchEndX)>Math.abs(W-touchEndY)?Math.abs(touchStartX-touchEndX)>q.width()/100*e.touchSensitivity&&(touchStartX>touchEndX?m("down",a):touchEndX>touchStartX&&m("up",a)):Math.abs(W-touchEndY)>q.height()/100*e.touchSensitivity&&(W>touchEndY?m("down",a):touchEndY>W&&m("up",a))}}}function k(t,o){o=o||0;var i=n(t).parent();return o<e.normalScrollElementTouchThreshold&&i.is(e.normalScrollElements)?!0:o==e.normalScrollElementTouchThreshold?!1:k(i,++o)}function L(){n("body").append('<div id="pp-nav"><ul></ul></div>');var t=n("#pp-nav");t.css("color",e.navigation.textColor),t.addClass(e.navigation.position);for(var o=0;o<n(".pp-section").length;o++){var i="";if(e.anchors.length&&(i=e.anchors[o]),void 0!==e.navigation.tooltips){var a=e.navigation.tooltips[o];void 0===a&&(a="")}t.find("ul").append('<li data-tooltip="'+a+'"><a href="#'+i+'"><span></span></a></li>')}t.find("span").css("border-color",e.navigation.bulletsColor)}function P(t,o){e.navigation&&(n("#pp-nav").find(".active").removeClass("active"),t?n("#pp-nav").find('a[href="#'+t+'"]').addClass("active"):n("#pp-nav").find("li").eq(o).find("a").addClass("active"))}function X(t){e.menu&&(n(e.menu).find(".active").removeClass("active"),n(e.menu).find('[data-menuanchor="'+t+'"]').addClass("active"))}function Y(){var n,e=document.createElement("p"),t={webkitTransform:"-webkit-transform",OTransform:"-o-transform",msTransform:"-ms-transform",MozTransform:"-moz-transform",transform:"transform"};document.body.insertBefore(e,null);for(var o in t)void 0!==e.style[o]&&(e.style[o]="translate3d(1px,1px,1px)",n=window.getComputedStyle(e).getPropertyValue(t[o]));return document.body.removeChild(e),void 0!==n&&n.length>0&&"none"!==n}function D(){return"vertical"!==e.direction?"translate3d(-100%, 0px, 0px)":"translate3d(0px, -100%, 0px)"}var I,q=n(this),O=0,U="ontouchstart"in window||navigator.msMaxTouchPoints>0,W=touchStartX=touchEndY=touchEndX=0,z=600;e=n.extend({direction:"vertical",menu:null,verticalCentered:!0,sectionsColor:[],anchors:[],scrollingSpeed:700,easing:"swing",loopBottom:!1,loopTop:!1,css3:!0,navigation:{textColor:"#000",bulletsColor:"#000",position:"right",tooltips:["section1","section2","section3","section4"]},normalScrollElements:null,normalScrollElementTouchThreshold:5,touchSensitivity:5,keyboardScrolling:!0,sectionSelector:".section",animateAnchor:!1,afterLoad:null,onLeave:null,afterRender:null},e),n.fn.pagepiling.setScrollingSpeed=function(n){e.scrollingSpeed=n},n.fn.pagepiling.setMouseWheelScrolling=function(n){n?x():w()},n.fn.pagepiling.setAllowScrolling=function(e){e?(n.fn.pagepiling.setMouseWheelScrolling(!0),M()):(n.fn.pagepiling.setMouseWheelScrolling(!1),E())},n.fn.pagepiling.setKeyboardScrolling=function(n){e.keyboardScrolling=n},n.fn.pagepiling.moveSectionUp=function(){var t=n(".pp-section.active").prev(".pp-section");!t.length&&e.loopTop&&(t=n(".pp-section").last()),t.length&&i(t)},n.fn.pagepiling.moveSectionDown=function(){var t=n(".pp-section.active").next(".pp-section");!t.length&&e.loopBottom&&(t=n(".pp-section").first()),t.length&&i(t)},n.fn.pagepiling.moveTo=function(e){var t="";t=isNaN(e)?n('[data-anchor="'+e+'"]'):n(".pp-section").eq(e-1),t.length>0&&i(t)},n(e.sectionSelector).each(function(){n(this).addClass("pp-section")}),e.css3&&(e.css3=Y()),n(q).css({overflow:"hidden","-ms-touch-action":"none","touch-action":"none"}),n.fn.pagepiling.setAllowScrolling(!0),n.isEmptyObject(e.navigation)||L();var A=n(".pp-section").length;n(".pp-section").each(function(o){n(this).data("data-index",o),n(this).css("z-index",A),o||0!==n(".pp-section.active").length||n(this).addClass("active"),void 0!==e.anchors[o]&&n(this).attr("data-anchor",e.anchors[o]),void 0!==e.sectionsColor[o]&&n(this).css("background-color",e.sectionsColor[o]),e.verticalCentered&&t(n(this)),A-=1}).promise().done(function(){e.navigation&&(n("#pp-nav").css("margin-top","-"+n("#pp-nav").height()/2+"px"),n("#pp-nav").find("li").eq(n(".pp-section.active").index(".pp-section")).find("a").addClass("active")),n(window).on("load",function(){d()}),n.isFunction(e.afterRender)&&e.afterRender.call(this)}),n(window).on("hashchange",v),n(document).keydown(function(t){if(e.keyboardScrolling&&!u())switch(t.which){case 38:case 33:n.fn.pagepiling.moveSectionUp();break;case 40:case 34:n.fn.pagepiling.moveSectionDown();break;case 36:n.fn.pagepiling.moveTo(1);break;case 35:n.fn.pagepiling.moveTo(n(".pp-section").length);break;case 37:n.fn.pagepiling.moveSectionUp();break;case 39:n.fn.pagepiling.moveSectionDown();break;default:return}}),e.normalScrollElements&&(n(document).on("mouseenter",e.normalScrollElements,function(){n.fn.pagepiling.setMouseWheelScrolling(!1)}),n(document).on("mouseleave",e.normalScrollElements,function(){n.fn.pagepiling.setMouseWheelScrolling(!0)})),n(document).on("click touchstart","#pp-nav a",function(e){e.preventDefault();var t=n(this).parent().index();i(n(".pp-section").eq(t))}),n(document).on({mouseenter:function(){var t=n(this).data("tooltip");n('<div class="pp-tooltip '+e.navigation.position+'">'+t+"</div>").hide().appendTo(n(this)).fadeIn(200)},mouseleave:function(){n(this).find(".pp-tooltip").fadeOut(200,function(){n(this).remove()})}},"#pp-nav li")}}(jQuery);