messengercustom-servicesmacoslinuxwindowsinboxwhatsappicloudtweetdeckhipchattelegramhangoutsslackgmailskypefacebook-workplaceoutlookemailmicrosoft-teamsdiscord
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
604 lines
69 KiB
604 lines
69 KiB
9 years ago
|
// page init
|
||
|
jQuery(function() {
|
||
|
initCycleCarousel();
|
||
|
initBackgroundResize();
|
||
|
// menu
|
||
|
menu.init();
|
||
|
// scroller
|
||
|
scroller.init();
|
||
|
});
|
||
|
|
||
|
// cycle scroll gallery init
|
||
|
function initCycleCarousel() {
|
||
|
jQuery('.cycle-gallery').scrollAbsoluteGallery({
|
||
|
mask: '.mask',
|
||
|
slider: '.slideset',
|
||
|
slides: '.slide',
|
||
|
btnPrev: 'a.btn-prev',
|
||
|
btnNext: 'a.btn-next',
|
||
|
pagerLinks: '.pagination li',
|
||
|
stretchSlideToMask: true,
|
||
|
pauseOnHover: true,
|
||
|
maskAutoSize: true,
|
||
|
autoRotation: false,
|
||
|
switchTime: 3000,
|
||
|
animSpeed: 500
|
||
|
});
|
||
|
}
|
||
|
|
||
|
// stretch background to fill blocks
|
||
|
function initBackgroundResize() {
|
||
|
jQuery('.visual-area').each(function() {
|
||
|
ImageStretcher.add({
|
||
|
container: this,
|
||
|
image: 'img.bg-stretch'
|
||
|
});
|
||
|
});
|
||
|
}
|
||
|
|
||
|
var body = $('body'),
|
||
|
// menu for mobile view
|
||
|
menu = {
|
||
|
config : {
|
||
|
trigger : jQuery('.nav-opener'),
|
||
|
open : false
|
||
|
},
|
||
|
init : function() {
|
||
|
this.config.trigger.click(this.toggle.bind(this));
|
||
|
},
|
||
|
toggle : function() {
|
||
|
if(this.config.open) {
|
||
|
body.removeClass('nav-active');
|
||
|
}
|
||
|
else {
|
||
|
body.addClass('nav-active');
|
||
|
}
|
||
|
this.config.open = !this.config.open;
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// move some elements on scroll
|
||
|
var scroller = {
|
||
|
config : {
|
||
|
docElem : window.document.documentElement,
|
||
|
// The viewportFactor defines how much of the appearing item has to be visible in order to trigger the animation
|
||
|
// if we'd use a value of 0, this would mean that it would add the animation class as soon as the item is in the viewport.
|
||
|
// If we were to use the value of 1, the animation would only be triggered when we see all of the item in the viewport (100% of it)
|
||
|
viewportFactor : 0,
|
||
|
elems : '.slide-holder'
|
||
|
},
|
||
|
getViewportH : function() {
|
||
|
var client = this.config.docElem['clientHeight'],
|
||
|
inner = window['innerHeight'];
|
||
|
|
||
|
if( client < inner )
|
||
|
return inner;
|
||
|
else
|
||
|
return client;
|
||
|
},
|
||
|
scrollY : function() {
|
||
|
return window.pageYOffset || this.config.docElem.scrollTop;
|
||
|
},
|
||
|
getOffset : function(el) {
|
||
|
var offsetTop = 0, offsetLeft = 0;
|
||
|
do {
|
||
|
if ( !isNaN( el.offsetTop ) ) {
|
||
|
offsetTop += el.offsetTop;
|
||
|
}
|
||
|
if ( !isNaN( el.offsetLeft ) ) {
|
||
|
offsetLeft += el.offsetLeft;
|
||
|
}
|
||
|
} while( el = el.offsetParent )
|
||
|
|
||
|
return {
|
||
|
top : offsetTop,
|
||
|
left : offsetLeft
|
||
|
}
|
||
|
},
|
||
|
inViewport : function(el, h) {
|
||
|
var elH = el.offsetHeight,
|
||
|
scrolled = this.scrollY(),
|
||
|
viewed = scrolled + this.getViewportH(),
|
||
|
elTop = this.getOffset(el).top,
|
||
|
elBottom = elTop + elH,
|
||
|
// if 0, the element is considered in the viewport as soon as it enters.
|
||
|
// if 1, the element is considered in the viewport only when it's fully inside
|
||
|
// value in percentage (1 >= h >= 0)
|
||
|
h = h || 0;
|
||
|
|
||
|
return (elTop + elH * h) <= viewed && (elBottom) >= scrolled;
|
||
|
},
|
||
|
init : function() {
|
||
|
this.sections = jQuery(this.config.elems);
|
||
|
this.didScroll = false;
|
||
|
|
||
|
var self = this,
|
||
|
scrollHandler = function() {
|
||
|
if( !self.didScroll ) {
|
||
|
self.didScroll = true;
|
||
|
setTimeout( function() { self.scrollPage(); }, 60 );
|
||
|
}
|
||
|
},
|
||
|
resizeHandler = function() {
|
||
|
function delayed() {
|
||
|
self.scrollPage();
|
||
|
self.resizeTimeout = null;
|
||
|
}
|
||
|
if ( self.resizeTimeout ) {
|
||
|
clearTimeout( self.resizeTimeout );
|
||
|
}
|
||
|
self.resizeTimeout = setTimeout( delayed, 200 );
|
||
|
};
|
||
|
|
||
|
window.addEventListener( 'scroll', scrollHandler, false );
|
||
|
window.addEventListener( 'resize', resizeHandler, false );
|
||
|
},
|
||
|
scrollPage : function() {
|
||
|
var self = this;
|
||
|
|
||
|
this.sections.each(function() {
|
||
|
if( self.inViewport( this, self.config.viewportFactor ) ) {
|
||
|
jQuery(this).addClass('scroll-effect-animate');
|
||
|
}
|
||
|
else {
|
||
|
// this add class init if it doesn't have it. This will ensure that the items initially in the viewport will also animate on scroll
|
||
|
jQuery(this).addClass('scroll-effect-init');
|
||
|
jQuery(this).removeClass('scroll-effect-animate');
|
||
|
}
|
||
|
});
|
||
|
this.didScroll = false;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
/*
|
||
|
* jQuery Cycle Carousel plugin
|
||
|
*/
|
||
|
;(function($){
|
||
|
function ScrollAbsoluteGallery(options) {
|
||
|
this.options = $.extend({
|
||
|
activeClass: 'active',
|
||
|
mask: 'div.slides-mask',
|
||
|
slider: '>ul',
|
||
|
slides: '>li',
|
||
|
btnPrev: '.btn-prev',
|
||
|
btnNext: '.btn-next',
|
||
|
pagerLinks: 'ul.pager > li',
|
||
|
generatePagination: false,
|
||
|
pagerList: '<ul>',
|
||
|
pagerListItem: '<li><a href="#"></a></li>',
|
||
|
pagerListItemText: 'a',
|
||
|
galleryReadyClass: 'gallery-js-ready',
|
||
|
currentNumber: 'span.current-num',
|
||
|
totalNumber: 'span.total-num',
|
||
|
maskAutoSize: false,
|
||
|
autoRotation: false,
|
||
|
pauseOnHover: false,
|
||
|
stretchSlideToMask: false,
|
||
|
switchTime: 3000,
|
||
|
animSpeed: 500,
|
||
|
handleTouch: true,
|
||
|
swipeThreshold: 15,
|
||
|
vertical: false
|
||
|
}, options);
|
||
|
this.init();
|
||
|
}
|
||
|
ScrollAbsoluteGallery.prototype = {
|
||
|
init: function() {
|
||
|
if(this.options.holder) {
|
||
|
this.findElements();
|
||
|
this.attachEvents();
|
||
|
this.makeCallback('onInit', this);
|
||
|
}
|
||
|
},
|
||
|
findElements: function() {
|
||
|
// find structure elements
|
||
|
this.holder = $(this.options.holder).addClass(this.options.galleryReadyClass);
|
||
|
this.mask = this.holder.find(this.options.mask);
|
||
|
this.slider = this.mask.find(this.options.slider);
|
||
|
this.slides = this.slider.find(this.options.slides);
|
||
|
this.btnPrev = this.holder.find(this.options.btnPrev);
|
||
|
this.btnNext = this.holder.find(this.options.btnNext);
|
||
|
|
||
|
// slide count display
|
||
|
this.currentNumber = this.holder.find(this.options.currentNumber);
|
||
|
this.totalNumber = this.holder.find(this.options.totalNumber);
|
||
|
|
||
|
// create gallery pagination
|
||
|
if(typeof this.options.generatePagination === 'string') {
|
||
|
this.pagerLinks = this.buildPagination();
|
||
|
} else {
|
||
|
this.pagerLinks = this.holder.find(this.options.pagerLinks);
|
||
|
}
|
||
|
|
||
|
// define index variables
|
||
|
this.sizeProperty = this.options.vertical ? 'height' : 'width';
|
||
|
this.positionProperty = this.options.vertical ? 'top' : 'left';
|
||
|
this.animProperty = this.options.vertical ? 'marginTop' : 'marginLeft';
|
||
|
|
||
|
this.slideSize = this.slides[this.sizeProperty]();
|
||
|
this.currentIndex = 0;
|
||
|
this.prevIndex = 0;
|
||
|
|
||
|
// reposition elements
|
||
|
this.options.maskAutoSize = this.options.vertical ? false : this.options.maskAutoSize;
|
||
|
if(this.options.vertical) {
|
||
|
this.mask.css({
|
||
|
height: this.slides.innerHeight()
|
||
|
});
|
||
|
}
|
||
|
if(this.options.maskAutoSize){
|
||
|
this.mask.css({
|
||
|
height: this.slider.height()
|
||
|
});
|
||
|
}
|
||
|
this.slider.css({
|
||
|
position: 'relative',
|
||
|
height: this.options.vertical ? this.slideSize * this.slides.length : '100%'
|
||
|
});
|
||
|
this.slides.css({
|
||
|
position: 'absolute'
|
||
|
}).css(this.positionProperty, -9999).eq(this.currentIndex).css(this.positionProperty, 0);
|
||
|
this.refreshState();
|
||
|
},
|
||
|
buildPagination: function() {
|
||
|
var pagerLinks = $();
|
||
|
if(!this.pagerHolder) {
|
||
|
this.pagerHolder = this.holder.find(this.options.generatePagination);
|
||
|
}
|
||
|
if(this.pagerHolder.length) {
|
||
|
this.pagerHolder.empty();
|
||
|
this.pagerList = $(this.options.pagerList).appendTo(this.pagerHolder);
|
||
|
for(var i = 0; i < this.slides.length; i++) {
|
||
|
$(this.options.pagerListItem).appendTo(this.pagerList).find(this.options.pagerListItemText).text(i+1);
|
||
|
}
|
||
|
pagerLinks = this.pagerList.children();
|
||
|
}
|
||
|
return pagerLinks;
|
||
|
},
|
||
|
attachEvents: function() {
|
||
|
// attach handlers
|
||
|
var self = this;
|
||
|
if(this.btnPrev.length) {
|
||
|
this.btnPrevHandler = function(e) {
|
||
|
e.preventDefault();
|
||
|
self.prevSlide();
|
||
|
};
|
||
|
this.btnPrev.click(this.btnPrevHandler);
|
||
|
}
|
||
|
if(this.btnNext.length) {
|
||
|
this.btnNextHandler = function(e) {
|
||
|
e.preventDefault();
|
||
|
self.nextSlide();
|
||
|
};
|
||
|
this.btnNext.click(this.btnNextHandler);
|
||
|
}
|
||
|
if(this.pagerLinks.length) {
|
||
|
this.pagerLinksHandler = function(e) {
|
||
|
e.preventDefault();
|
||
|
self.numSlide(self.pagerLinks.index(e.currentTarget));
|
||
|
};
|
||
|
this.pagerLinks.click(this.pagerLinksHandler);
|
||
|
}
|
||
|
|
||
|
// handle autorotation pause on hover
|
||
|
if(this.options.pauseOnHover) {
|
||
|
this.hoverHandler = function() {
|
||
|
clearTimeout(self.timer);
|
||
|
};
|
||
|
this.leaveHandler = function() {
|
||
|
self.autoRotate();
|
||
|
};
|
||
|
this.holder.bind({mouseenter: this.hoverHandler, mouseleave: this.leaveHandler});
|
||
|
}
|
||
|
|
||
|
// handle holder and slides dimensions
|
||
|
this.resizeHandler = function() {
|
||
|
if(!self.animating) {
|
||
|
if(self.options.stretchSlideToMask) {
|
||
|
self.resizeSlides();
|
||
|
}
|
||
|
self.resizeHolder();
|
||
|
self.setSlidesPosition(self.currentIndex);
|
||
|
}
|
||
|
};
|
||
|
$(window).bind('load resize orientationchange', this.resizeHandler);
|
||
|
if(self.options.stretchSlideToMask) {
|
||
|
self.resizeSlides();
|
||
|
}
|
||
|
|
||
|
// handle swipe on mobile devices
|
||
|
if(this.options.handleTouch && window.Hammer && this.mask.length && this.slides.length > 1 && isTouchDevice) {
|
||
|
this.swipeHandler = new Hammer.Manager(this.mask[0]);
|
||
|
this.swipeHandler.add(new Hammer.Pan({
|
||
|
direction: self.options.vertical ? Hammer.DIRECTION_VERTICAL : Hammer.DIRECTION_HORIZONTAL,
|
||
|
threshold: self.options.swipeThreshold
|
||
|
}));
|
||
|
|
||
|
this.swipeHandler.on('panstart', function() {
|
||
|
if(self.animating) {
|
||
|
self.swipeHandler.stop();
|
||
|
} else {
|
||
|
clearTimeout(self.timer);
|
||
|
}
|
||
|
}).on('panmove', function(e) {
|
||
|
self.swipeOffset = -self.slideSize + e[self.options.vertical ? 'deltaY' : 'deltaX'];
|
||
|
self.slider.css(self.animProperty, self.swipeOffset);
|
||
|
clearTimeout(self.timer);
|
||
|
}).on('panend', function(e) {
|
||
|
if(e.distance > self.options.swipeThreshold) {
|
||
|
if(e.offsetDirection === Hammer.DIRECTION_RIGHT || e.offsetDirection === Hammer.DIRECTION_DOWN) {
|
||
|
self.nextSlide();
|
||
|
} else {
|
||
|
self.prevSlide();
|
||
|
}
|
||
|
} else {
|
||
|
var tmpObj = {};
|
||
|
tmpObj[self.animProperty] = -self.slideSize;
|
||
|
self.slider.animate(tmpObj, {duration: self.options.animSpeed});
|
||
|
self.autoRotate();
|
||
|
}
|
||
|
self.swipeOffset = 0;
|
||
|
});
|
||
|
}
|
||
|
|
||
|
// start autorotation
|
||
|
this.autoRotate();
|
||
|
this.resizeHolder();
|
||
|
this.setSlidesPosition(this.currentIndex);
|
||
|
},
|
||
|
resizeSlides: function() {
|
||
|
this.slideSize = this.mask[this.options.vertical ? 'height' : 'width']();
|
||
|
this.slides.css(this.sizeProperty, this.slideSize);
|
||
|
},
|
||
|
resizeHolder: function() {
|
||
|
if(this.options.maskAutoSize) {
|
||
|
this.mask.css({
|
||
|
height: this.slides.eq(this.currentIndex).outerHeight(true)
|
||
|
});
|
||
|
}
|
||
|
},
|
||
|
prevSlide: function() {
|
||
|
if(!this.animating && this.slides.length > 1) {
|
||
|
this.direction = -1;
|
||
|
this.prevIndex = this.currentIndex;
|
||
|
if(this.currentIndex > 0) this.currentIndex--;
|
||
|
else this.currentIndex = this.slides.length - 1;
|
||
|
this.switchSlide();
|
||
|
}
|
||
|
},
|
||
|
nextSlide: function(fromAutoRotation) {
|
||
|
if(!this.animating && this.slides.length > 1) {
|
||
|
this.direction = 1;
|
||
|
this.prevIndex = this.currentIndex;
|
||
|
if(this.currentIndex < this.slides.length - 1) this.currentIndex++;
|
||
|
else this.currentIndex = 0;
|
||
|
this.switchSlide();
|
||
|
}
|
||
|
},
|
||
|
numSlide: function(c) {
|
||
|
if(!this.animating && this.currentIndex !== c && this.slides.length > 1) {
|
||
|
this.direction = c > this.currentIndex ? 1 : -1;
|
||
|
this.prevIndex = this.currentIndex;
|
||
|
this.currentIndex = c;
|
||
|
this.switchSlide();
|
||
|
}
|
||
|
},
|
||
|
preparePosition: function() {
|
||
|
// prepare slides position before animation
|
||
|
this.setSlidesPosition(this.prevIndex, this.direction < 0 ? this.currentIndex : null, this.direction > 0 ? this.currentIndex : null, this.direction);
|
||
|
},
|
||
|
setSlidesPosition: function(index, slideLeft, slideRight, direction) {
|
||
|
// reposition holder and nearest slides
|
||
|
if(this.slides.length > 1) {
|
||
|
var prevIndex = (typeof slideLeft === 'number' ? slideLeft : index > 0 ? index - 1 : this.slides.length - 1);
|
||
|
var nextIndex = (typeof slideRight === 'number' ? slideRight : index < this.slides.length - 1 ? index + 1 : 0);
|
||
|
|
||
|
this.slider.css(this.animProperty, this.swipeOffset ? this.swipeOffset : -this.slideSize);
|
||
|
this.slides.css(this.positionProperty, -9999).eq(index).css(this.positionProperty, this.slideSize);
|
||
|
if(prevIndex === nextIndex && typeof direction === 'number') {
|
||
|
var calcOffset = direction > 0 ? this.slideSize*2 : 0;
|
||
|
this.slides.eq(nextIndex).css(this.positionProperty, calcOffset);
|
||
|
} else {
|
||
|
this.slides.eq(prevIndex).css(this.positionProperty, 0);
|
||
|
this.slides.eq(nextIndex).css(this.positionProperty, this.slideSize*2);
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
switchSlide: function() {
|
||
|
// prepare positions and calculate offset
|
||
|
var self = this;
|
||
|
var oldSlide = this.slides.eq(this.prevIndex);
|
||
|
var newSlide = this.slides.eq(this.currentIndex);
|
||
|
this.animating = true;
|
||
|
|
||
|
// resize mask to fit slide
|
||
|
if(this.options.maskAutoSize) {
|
||
|
this.mask.animate({
|
||
|
height: newSlide.outerHeight(true)
|
||
|
}, {
|
||
|
duration: this.options.animSpeed
|
||
|
});
|
||
|
}
|
||
|
|
||
|
// start animation
|
||
|
var animProps = {};
|
||
|
animProps[this.animProperty] = this.direction > 0 ? -this.slideSize*2 : 0;
|
||
|
this.preparePosition();
|
||
|
this.slider.animate(animProps,{duration:this.options.animSpeed, complete:function() {
|
||
|
self.setSlidesPosition(self.currentIndex);
|
||
|
|
||
|
// start autorotation
|
||
|
self.animating = false;
|
||
|
self.autoRotate();
|
||
|
|
||
|
// onchange callback
|
||
|
self.makeCallback('onChange', self);
|
||
|
}});
|
||
|
|
||
|
// refresh classes
|
||
|
this.refreshState();
|
||
|
|
||
|
// onchange callback
|
||
|
this.makeCallback('onBeforeChange', this);
|
||
|
},
|
||
|
refreshState: function(initial) {
|
||
|
// slide change function
|
||
|
this.slides.removeClass(this.options.activeClass).eq(this.currentIndex).addClass(this.options.activeClass);
|
||
|
this.pagerLinks.removeClass(this.options.activeClass).eq(this.currentIndex).addClass(this.options.activeClass);
|
||
|
|
||
|
// display current slide number
|
||
|
this.currentNumber.html(this.currentIndex + 1);
|
||
|
this.totalNumber.html(this.slides.length);
|
||
|
|
||
|
// add class if not enough slides
|
||
|
this.holder.toggleClass('not-enough-slides', this.slides.length === 1);
|
||
|
},
|
||
|
autoRotate: function() {
|
||
|
var self = this;
|
||
|
clearTimeout(this.timer);
|
||
|
if(this.options.autoRotation) {
|
||
|
this.timer = setTimeout(function() {
|
||
|
self.nextSlide();
|
||
|
}, this.options.switchTime);
|
||
|
}
|
||
|
},
|
||
|
makeCallback: function(name) {
|
||
|
if(typeof this.options[name] === 'function') {
|
||
|
var args = Array.prototype.slice.call(arguments);
|
||
|
args.shift();
|
||
|
this.options[name].apply(this, args);
|
||
|
}
|
||
|
},
|
||
|
destroy: function() {
|
||
|
// destroy handler
|
||
|
this.btnPrev.unbind('click', this.btnPrevHandler);
|
||
|
this.btnNext.unbind('click', this.btnNextHandler);
|
||
|
this.pagerLinks.unbind('click', this.pagerLinksHandler);
|
||
|
this.holder.unbind('mouseenter', this.hoverHandler);
|
||
|
this.holder.unbind('mouseleave', this.leaveHandler);
|
||
|
$(window).unbind('load resize orientationchange', this.resizeHandler);
|
||
|
clearTimeout(this.timer);
|
||
|
|
||
|
// destroy swipe handler
|
||
|
if(this.swipeHandler) {
|
||
|
this.swipeHandler.destroy();
|
||
|
}
|
||
|
|
||
|
// remove inline styles, classes and pagination
|
||
|
this.holder.removeClass(this.options.galleryReadyClass);
|
||
|
this.slider.add(this.slides).removeAttr('style');
|
||
|
if(typeof this.options.generatePagination === 'string') {
|
||
|
this.pagerHolder.empty();
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// detect device type
|
||
|
var isTouchDevice = /Windows Phone/.test(navigator.userAgent) || ('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch;
|
||
|
|
||
|
// jquery plugin
|
||
|
$.fn.scrollAbsoluteGallery = function(opt){
|
||
|
return this.each(function(){
|
||
|
$(this).data('ScrollAbsoluteGallery', new ScrollAbsoluteGallery($.extend(opt,{holder:this})));
|
||
|
});
|
||
|
};
|
||
|
}(jQuery));
|
||
|
|
||
|
/*
|
||
|
* Image Stretch module
|
||
|
*/
|
||
|
var ImageStretcher = {
|
||
|
getDimensions: function(data) {
|
||
|
// calculate element coords to fit in mask
|
||
|
var ratio = data.imageRatio || (data.imageWidth / data.imageHeight),
|
||
|
slideWidth = data.maskWidth,
|
||
|
slideHeight = slideWidth / ratio;
|
||
|
|
||
|
if(slideHeight < data.maskHeight) {
|
||
|
slideHeight = data.maskHeight;
|
||
|
slideWidth = slideHeight * ratio;
|
||
|
}
|
||
|
return {
|
||
|
width: slideWidth,
|
||
|
height: slideHeight,
|
||
|
top: (data.maskHeight - slideHeight) / 2,
|
||
|
left: (data.maskWidth - slideWidth) / 2
|
||
|
};
|
||
|
},
|
||
|
getRatio: function(image) {
|
||
|
if(image.prop('naturalWidth')) {
|
||
|
return image.prop('naturalWidth') / image.prop('naturalHeight');
|
||
|
} else {
|
||
|
var img = new Image();
|
||
|
img.src = image.prop('src');
|
||
|
return img.width / img.height;
|
||
|
}
|
||
|
},
|
||
|
imageLoaded: function(image, callback) {
|
||
|
var self = this;
|
||
|
var loadHandler = function() {
|
||
|
callback.call(self);
|
||
|
};
|
||
|
if(image.prop('complete')) {
|
||
|
loadHandler();
|
||
|
} else {
|
||
|
image.one('load', loadHandler);
|
||
|
}
|
||
|
},
|
||
|
resizeHandler: function() {
|
||
|
var self = this;
|
||
|
jQuery.each(this.imgList, function(index, item) {
|
||
|
if(item.image.prop('complete')) {
|
||
|
self.resizeImage(item.image, item.container);
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
resizeImage: function(image, container) {
|
||
|
this.imageLoaded(image, function() {
|
||
|
var styles = this.getDimensions({
|
||
|
imageRatio: this.getRatio(image),
|
||
|
maskWidth: container.width(),
|
||
|
maskHeight: container.height()
|
||
|
});
|
||
|
image.css({
|
||
|
width: styles.width,
|
||
|
height: styles.height,
|
||
|
marginTop: styles.top,
|
||
|
marginLeft: styles.left
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
add: function(options) {
|
||
|
var container = jQuery(options.container ? options.container : window),
|
||
|
image = typeof options.image === 'string' ? container.find(options.image) : jQuery(options.image);
|
||
|
|
||
|
// resize image
|
||
|
this.resizeImage(image, container);
|
||
|
|
||
|
// add resize handler once if needed
|
||
|
if(!this.win) {
|
||
|
this.resizeHandler = jQuery.proxy(this.resizeHandler, this);
|
||
|
this.imgList = [];
|
||
|
this.win = jQuery(window);
|
||
|
this.win.on('resize orientationchange', this.resizeHandler);
|
||
|
}
|
||
|
|
||
|
// store item in collection
|
||
|
this.imgList.push({
|
||
|
container: container,
|
||
|
image: image
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
/*! Hammer.JS - v2.0.4 - 2014-09-28
|
||
|
* http://hammerjs.github.io/
|
||
|
*
|
||
|
* Copyright (c) 2014 Jorik Tangelder;
|
||
|
* Licensed under the MIT license */
|
||
|
if(Object.create){!function(a,b,c,d){"use strict";function e(a,b,c){return setTimeout(k(a,c),b)}function f(a,b,c){return Array.isArray(a)?(g(a,c[b],c),!0):!1}function g(a,b,c){var e;if(a)if(a.forEach)a.forEach(b,c);else if(a.length!==d)for(e=0;e<a.length;)b.call(c,a[e],e,a),e++;else for(e in a)a.hasOwnProperty(e)&&b.call(c,a[e],e,a)}function h(a,b,c){for(var e=Object.keys(b),f=0;f<e.length;)(!c||c&&a[e[f]]===d)&&(a[e[f]]=b[e[f]]),f++;return a}function i(a,b){return h(a,b,!0)}function j(a,b,c){var d,e=b.prototype;d=a.prototype=Object.create(e),d.constructor=a,d._super=e,c&&h(d,c)}function k(a,b){return function(){return a.apply(b,arguments)}}function l(a,b){return typeof a==kb?a.apply(b?b[0]||d:d,b):a}function m(a,b){return a===d?b:a}function n(a,b,c){g(r(b),function(b){a.addEventListener(b,c,!1)})}function o(a,b,c){g(r(b),function(b){a.removeEventListener(b,c,!1)})}function p(a,b){for(;a;){if(a==b)return!0;a=a.parentNode}return!1}function q(a,b){return a.indexOf(b)>-1}function r(a){return a.trim().split(/\s+/g)}function s(a,b,c){if(a.indexOf&&!c)return a.indexOf(b);for(var d=0;d<a.length;){if(c&&a[d][c]==b||!c&&a[d]===b)return d;d++}return-1}function t(a){return Array.prototype.slice.call(a,0)}function u(a,b,c){for(var d=[],e=[],f=0;f<a.length;){var g=b?a[f][b]:a[f];s(e,g)<0&&d.push(a[f]),e[f]=g,f++}return c&&(d=b?d.sort(function(a,c){return a[b]>c[b]}):d.sort()),d}function v(a,b){for(var c,e,f=b[0].toUpperCase()+b.slice(1),g=0;g<ib.length;){if(c=ib[g],e=c?c+f:b,e in a)return e;g++}return d}function w(){return ob++}function x(a){var b=a.ownerDocument;return b.defaultView||b.parentWindow}function y(a,b){var c=this;this.manager=a,this.callback=b,this.element=a.element,this.target=a.options.inputTarget,this.domHandler=function(b){l(a.options.enable,[a])&&c.handler(b)},this.init()}function z(a){var b,c=a.options.inputClass;return new(b=c?c:rb?N:sb?Q:qb?S:M)(a,A)}function A(a,b,c){var d=c.pointers.length,e=c.changedPointers.length,f=b&yb&&d-e===0,g=b&(Ab|Bb)&&d-e===0;c.isFirst=!!f,c.isFinal=!!g,f&&(a.session={}),c.eventType=b,B(a,c),a.emit("hammer.input",c),a.recognize(c),a.session.prevInput=c}function B(a,b){var c=a.session,d=b.pointers,e=d.length;c.firstInput||(c.firstInput=E(b)),e>1&&!c.firstMultiple?c.firstMultiple=E(b):1===e&&(c.firstMultiple=!1);var f=c.firstInput,g=c.firstMultiple,h=g?g.center:f.center,i=b.center=F(d);b.timeStamp=nb(),b.deltaTime=b.timeStamp-f.timeStamp,b.angle=J(h,i),b.distance=I(h,i),C(c,b),b.offsetDirection=H(b.deltaX,b.deltaY),b.scale=g?L(g.pointers,d):1,b.rotation=g?K(g.pointers,d):0,D(c,b);var j=a.element;p(b.srcEvent.target,j)&&(j=b.srcEvent.target),b.target=j}function C(a,b){var c=b.center,d=a.offsetDelta||{},e=a.prevDelta||{},f=a.prevInput||{};(b.eventType===yb||f.eventType===Ab)&&(e=a.prevDelta={x:f.deltaX||0,y:f.deltaY||0},d=a.offsetDelta={x:c.x,y:c.y}),b.deltaX=e.x+(c.x-d.x),b.deltaY=e.y+(c.y-d.y)}function D(a,b){var c,e,f,g,h=a.lastInterval||b,i=b.timeStamp-h.timeStamp;if(b.eventType!=Bb&&(i>xb||h.velocity===d)){var j=h.deltaX-b.deltaX,k=h.deltaY-b.deltaY,l=G(i,j,k);e=l.x,f=l.y,c=mb(l.x)>mb(l.y)?l.x:l.y,g=H(j,k),a.lastInterval=b}else c=h.velocity,e=h.velocityX,f=h.velocityY,g=h.direction;b.velocity=c,b.velocityX=e,b.velocityY=f,b.direction=g}function E(a){for(var b=[],c=0;c<a.pointers.length;)b[c]={clientX:lb(a.pointers[c].clientX),clientY:lb(a.pointers[c].clientY)},c++;return{timeStamp:nb(),pointers:b,center:F(b),deltaX:a.deltaX,deltaY:a.deltaY}}function F(a){var b=a.length;if(1===b)return{x:lb(a[0].clientX),y:lb(a[0].clientY)};for(var c=0,d=0,e=0;b>e;)c+=a[e].clientX,d+=a[e].clientY,e++;return{x:lb(c/b),y:lb(d/b)}}function G(a,b,c){return{x:b/a||0,y:c/a||0}}function H(a,b){return a===b?Cb:mb(a)>=mb(b)?a>0?Db:Eb:b>0?Fb:Gb}function I(a,b,c){c||(c=Kb);var d=b[c[0]]-a[c[0]],e=b[c[1]]-a[c[1]];return Math.sqrt(d*d+e*e)}function J(a,b,c){c||(c=Kb);var d=b[c[0]]-a[c[0]],e=b[c[1]]-a[c[1]];return 180*Math.atan2(e,d)/Math.PI}function K(a,b){return J(b[1],b[0],Lb)-J(a[1],a[0],Lb)}function L(a,b){return I(b[0],b[1],Lb)/I(a[0],a[1],Lb)}function M(){this.evEl=Nb,this.evWin=Ob,this.allow=!0,this.presse
|
||
|
|
||
|
/*! VelocityJS.org (1.2.1). (C) 2014 Julian Shapiro. MIT @license: en.wikipedia.org/wiki/MIT_License */
|
||
|
/*! VelocityJS.org jQuery Shim (1.0.1). (C) 2014 The jQuery Foundation. MIT @license: en.wikipedia.org/wiki/MIT_License. */
|
||
|
!function(e){function t(e){var t=e.length,r=$.type(e);return"function"===r||$.isWindow(e)?!1:1===e.nodeType&&t?!0:"array"===r||0===t||"number"==typeof t&&t>0&&t-1 in e}if(!e.jQuery){var $=function(e,t){return new $.fn.init(e,t)};$.isWindow=function(e){return null!=e&&e==e.window},$.type=function(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?a[o.call(e)]||"object":typeof e},$.isArray=Array.isArray||function(e){return"array"===$.type(e)},$.isPlainObject=function(e){var t;if(!e||"object"!==$.type(e)||e.nodeType||$.isWindow(e))return!1;try{if(e.constructor&&!n.call(e,"constructor")&&!n.call(e.constructor.prototype,"isPrototypeOf"))return!1}catch(r){return!1}for(t in e);return void 0===t||n.call(e,t)},$.each=function(e,r,a){var n,o=0,i=e.length,s=t(e);if(a){if(s)for(;i>o&&(n=r.apply(e[o],a),n!==!1);o++);else for(o in e)if(n=r.apply(e[o],a),n===!1)break}else if(s)for(;i>o&&(n=r.call(e[o],o,e[o]),n!==!1);o++);else for(o in e)if(n=r.call(e[o],o,e[o]),n===!1)break;return e},$.data=function(e,t,a){if(void 0===a){var n=e[$.expando],o=n&&r[n];if(void 0===t)return o;if(o&&t in o)return o[t]}else if(void 0!==t){var n=e[$.expando]||(e[$.expando]=++$.uuid);return r[n]=r[n]||{},r[n][t]=a,a}},$.removeData=function(e,t){var a=e[$.expando],n=a&&r[a];n&&$.each(t,function(e,t){delete n[t]})},$.extend=function(){var e,t,r,a,n,o,i=arguments[0]||{},s=1,l=arguments.length,u=!1;for("boolean"==typeof i&&(u=i,i=arguments[s]||{},s++),"object"!=typeof i&&"function"!==$.type(i)&&(i={}),s===l&&(i=this,s--);l>s;s++)if(null!=(n=arguments[s]))for(a in n)e=i[a],r=n[a],i!==r&&(u&&r&&($.isPlainObject(r)||(t=$.isArray(r)))?(t?(t=!1,o=e&&$.isArray(e)?e:[]):o=e&&$.isPlainObject(e)?e:{},i[a]=$.extend(u,o,r)):void 0!==r&&(i[a]=r));return i},$.queue=function(e,r,a){function n(e,r){var a=r||[];return null!=e&&(t(Object(e))?!function(e,t){for(var r=+t.length,a=0,n=e.length;r>a;)e[n++]=t[a++];if(r!==r)for(;void 0!==t[a];)e[n++]=t[a++];return e.length=n,e}(a,"string"==typeof e?[e]:e):[].push.call(a,e)),a}if(e){r=(r||"fx")+"queue";var o=$.data(e,r);return a?(!o||$.isArray(a)?o=$.data(e,r,n(a)):o.push(a),o):o||[]}},$.dequeue=function(e,t){$.each(e.nodeType?[e]:e,function(e,r){t=t||"fx";var a=$.queue(r,t),n=a.shift();"inprogress"===n&&(n=a.shift()),n&&("fx"===t&&a.unshift("inprogress"),n.call(r,function(){$.dequeue(r,t)}))})},$.fn=$.prototype={init:function(e){if(e.nodeType)return this[0]=e,this;throw new Error("Not a DOM node.")},offset:function(){var t=this[0].getBoundingClientRect?this[0].getBoundingClientRect():{top:0,left:0};return{top:t.top+(e.pageYOffset||document.scrollTop||0)-(document.clientTop||0),left:t.left+(e.pageXOffset||document.scrollLeft||0)-(document.clientLeft||0)}},position:function(){function e(){for(var e=this.offsetParent||document;e&&"html"===!e.nodeType.toLowerCase&&"static"===e.style.position;)e=e.offsetParent;return e||document}var t=this[0],e=e.apply(t),r=this.offset(),a=/^(?:body|html)$/i.test(e.nodeName)?{top:0,left:0}:$(e).offset();return r.top-=parseFloat(t.style.marginTop)||0,r.left-=parseFloat(t.style.marginLeft)||0,e.style&&(a.top+=parseFloat(e.style.borderTopWidth)||0,a.left+=parseFloat(e.style.borderLeftWidth)||0),{top:r.top-a.top,left:r.left-a.left}}};var r={};$.expando="velocity"+(new Date).getTime(),$.uuid=0;for(var a={},n=a.hasOwnProperty,o=a.toString,i="Boolean Number String Function Array Date RegExp Object Error".split(" "),s=0;s<i.length;s++)a["[object "+i[s]+"]"]=i[s].toLowerCase();$.fn.init.prototype=$.fn,e.Velocity={Utilities:$}}}(window),function(e){"object"==typeof module&&"object"==typeof module.exports?module.exports=e():"function"==typeof define&&define.amd?define(e):e()}(function(){return function(e,t,r,a){function n(e){for(var t=-1,r=e?e.length:0,a=[];++t<r;){var n=e[t];n&&a.push(n)}return a}function o(e){return g.isWrapped(e)?e=[].slice.call(e):g.isNode(e)&&(e=[e]),e}function i(e){var t=$.data(e,"velocity");return null===t?a:t}function s(e){return function(t){return Math.round(t*e)*(1/e)}}function l(e,r,a,n){function o(e,t){return 1-3*t+3*e}function i(e,t){return 3*t-6*e}function s(e){return 3*e}f
|