//if (location.host != "cdn.colombiahosting.com.co") location.href = "http://www.colombiahosting.com.co"; //if (location.host != "servidor2.constructorsitiosweb.com") location.href = "http://www.colombiahosting.com.co"; var vein=function(){},extend=function(e){e=e||{};for(var t=1;t index) { var scriptActual = elements[index]; var myEle = document.getElementById(scriptActual.id); if (myEle != null) { loaded=1; } extensionLib = scriptActual.lib.split(/[. ]+/).pop(); switch (extensionLib) { case "js": attrib = 'src'; element = 'script'; type = 'text/javascript'; break; case "css": attrib = 'href'; element = 'link'; type = 'text/css'; break; default: return false; break; } if (loaded) { myPreloadJSCSS(elements, index + 1, callback, myid); } else { var newLib = document.createElement(element); newLib.setAttribute('id', scriptActual.id); var newScript = scriptActual.lib; if (typeof scriptActual.version != 'undefined' && scriptActual.version) { newScript += "?" + scriptActual.version; } newLib.setAttribute('type', type); newLib.async = false; if (newLib.complete) { myPreloadJSCSS(elements, index + 1, callback, myid); } else { newLib.onload = function() { myPreloadJSCSS(elements, index + 1, callback, myid); } } if (element == "link") { newLib.setAttribute('rel', 'stylesheet'); newLib.href = newScript; } else { newLib.src = newScript; } document.getElementsByTagName("head")[0].appendChild(newLib); } } } } if (typeof myPreloadIMG !== 'function') { var myPreloadIMG = function(imageArray, index, callback) { index = index || 0; if (index == imageArray.length) { jQuery(document).ready(function($) { callback(); }); } if (imageArray && imageArray.length > index) { var img = new Image(); img.onload = function() { myPreloadIMG(imageArray, index + 1, callback); } img.src = imageArray[index]; } } } if (typeof myPreloadIMG2 !== 'function') { var myPreloadIMG2 = function(imageArray, index, callback) { $.preload(imageArray, { ext:'', onFinish:function( data ){ console.log(2);} }); } } //touchSwipe !function(oe){"use strict";var ue="left",se="right",ce="up",pe="down",he="in",ge="out",de="none",fe="auto",we="swipe",ve="pinch",Te="tap",be="doubletap",Ee="longtap",ye="horizontal",me="vertical",xe="all",Se=10,Oe="start",Me="move",De="end",Pe="cancel",Le="ontouchstart"in window,Re=window.navigator.msPointerEnabled&&!window.navigator.pointerEnabled&&!Le,ke=(window.navigator.pointerEnabled||window.navigator.msPointerEnabled)&&!Le,Ae="TouchSwipe";function i(e,w){var w=oe.extend({},w),t=Le||ke||!w.fallbackToMouseEvents,n=t?ke?Re?"MSPointerDown":"pointerdown":"touchstart":"mousedown",i=t?ke?Re?"MSPointerMove":"pointermove":"touchmove":"mousemove",r=t?ke?Re?"MSPointerUp":"pointerup":"touchend":"mouseup",l=t?ke?"mouseleave":null:"mouseleave",a=ke?Re?"MSPointerCancel":"pointercancel":"touchcancel",v=0,T=null,b=null,E=0,y=0,m=0,x=1,S=0,O=0,M=null,o=oe(e),D="start",P=0,L={},u=0,R=0,s=0,c=0,p=0,h=null,k=null;try{o.bind(n,g),o.bind(a,A)}catch(e){oe.error("events not supported "+n+","+a+" on jQuery.swipe")}function g(e){if(!0!==o.data(Ae+"_intouch")&&!(0a.left&&l.xa.top&&l.yw.longTapThreshold&&v=w.threshold),e}function C(){var e=!1;return null!==w.cancelThreshold&&null!==T&&(e=te(T)-v>=w.cancelThreshold),e}function F(){return!(w.maxTimeThreshold&&E>=w.maxTimeThreshold)}function Q(){var e=W(),t=q(),n=null===w.pinchThreshold||S>=w.pinchThreshold;return e&&t&&n}function X(){return!!(w.pinchStatus||w.pinchIn||w.pinchOut)}function Y(){var e=F(),t=_(),n=W(),i=q(),r=C(),l=!r&&i&&n&&t&&e;return l}function V(){return!!(w.swipe||w.swipeStatus||w.swipeLeft||w.swipeRight||w.swipeUp||w.swipeDown)}function W(){return P===w.fingers||w.fingers===xe||!Le}function q(){return 0!==L[0].end.x}function z(){return!!w.tap}function G(){return!!w.doubleTap}function Z(){if(null==p)return!1;var e=ae();return G()&&e-p<=w.doubleTapThreshold}function B(){c=s=0}function J(){var e=!1;if(s){var t=ae()-s;t<=w.fingerReleaseThreshold&&(e=!0)}return e}function K(e){o&&(!0===e?(o.bind(i,d),o.bind(r,f),l&&o.bind(l,I)):(o.unbind(i,d,!1),o.unbind(r,f,!1),l&&o.unbind(l,I,!1)),o.data(Ae+"_intouch",!0===e))}function $(e,t){var n={start:{x:0,y:0},last:{x:0,y:0},end:{x:0,y:0}};return n.start.x=n.last.x=n.end.x=t.pageX||t.clientX,n.start.y=n.last.y=n.end.y=t.pageY||t.clientY,L[e]=n}function ee(e){var t=void 0!==e.identifier?e.identifier:0,n=L[t]||null;return null===n&&(n=$(t,e)),n.last.x=n.end.x,n.last.y=n.end.y,n.end.x=e.pageX||e.clientX,n.end.y=e.pageY||e.clientY,n}function te(e){if(M[e])return M[e].distance}function ne(e){return{direction:e,distance:0}}function ie(){return R-u}function re(e,t){var n=Math.abs(e.x-t.x),i=Math.abs(e.y-t.y);return Math.round(Math.sqrt(n*n+i*i))}function le(e,t){if(i=t,(n=e).x==i.x&&n.y==i.y)return de;var n,i,r,l,a,o,u,s,c=(l=t,a=(r=e).x-l.x,o=l.y-r.y,u=Math.atan2(o,a),(s=Math.round(180*u/Math.PI))<0&&(s=360-Math.abs(s)),s);return c<=45&&0<=c?ue:c<=360&&315<=c?ue:135<=c&&c<=225?se:45"); if(!options.no_overlay) { container.append("
"); } var beforeImg = container.find("img:first"); var afterImg = container.find("img:last"); container.append("
"); var slider = container.find(".twentytwenty-handle"); slider.append(""); slider.append(""); container.addClass("twentytwenty-container"); beforeImg.addClass("twentytwenty-before"); afterImg.addClass("twentytwenty-after"); var overlay = container.find(".twentytwenty-overlay"); overlay.append("
"); overlay.append("
"); var calcOffset = function(dimensionPct) { var w = beforeImg.width(); var h = beforeImg.height(); return { w: w+"px", h: h+"px", cw: (dimensionPct*w)+"px", ch: (dimensionPct*h)+"px" }; }; var adjustContainer = function(offset) { if (sliderOrientation === 'vertical') { beforeImg.css("clip", "rect(0,"+offset.w+","+offset.ch+",0)"); afterImg.css("clip", "rect("+offset.ch+","+offset.w+","+offset.h+",0)"); } else { beforeImg.css("clip", "rect(0,"+offset.cw+","+offset.h+",0)"); afterImg.css("clip", "rect(0,"+offset.w+","+offset.h+","+offset.cw+")"); } container.css("height", offset.h); }; var adjustSlider = function(pct) { var offset = calcOffset(pct); slider.css((sliderOrientation==="vertical") ? "top" : "left", (sliderOrientation==="vertical") ? offset.ch : offset.cw); adjustContainer(offset); }; // Return the number specified or the min/max number if it outside the range given. var minMaxNumber = function(num, min, max) { return Math.max(min, Math.min(max, num)); }; // Calculate the slider percentage based on the position. var getSliderPercentage = function(positionX, positionY) { var sliderPercentage = (sliderOrientation === 'vertical') ? (positionY-offsetY)/imgHeight : (positionX-offsetX)/imgWidth; return minMaxNumber(sliderPercentage, 0, 1); }; $(window).on("resize.twentytwenty", function(e) { adjustSlider(sliderPct); }); var offsetX = 0; var offsetY = 0; var imgWidth = 0; var imgHeight = 0; var onMoveStart = function(e) { if (((e.distX > e.distY && e.distX < -e.distY) || (e.distX < e.distY && e.distX > -e.distY)) && sliderOrientation !== 'vertical') { e.preventDefault(); } else if (((e.distX < e.distY && e.distX < -e.distY) || (e.distX > e.distY && e.distX > -e.distY)) && sliderOrientation === 'vertical') { e.preventDefault(); } container.addClass("active"); offsetX = container.offset().left; offsetY = container.offset().top; imgWidth = beforeImg.width(); imgHeight = beforeImg.height(); }; var onMove = function(e) { if (container.hasClass("active")) { sliderPct = getSliderPercentage(e.pageX, e.pageY); adjustSlider(sliderPct); } }; var onMoveEnd = function() { container.removeClass("active"); }; var moveTarget = options.move_with_handle_only ? slider : container; moveTarget.on("movestart",onMoveStart); moveTarget.on("move",onMove); moveTarget.on("moveend",onMoveEnd); if (options.move_slider_on_hover) { container.on("mouseenter", onMoveStart); container.on("mousemove", onMove); container.on("mouseleave", onMoveEnd); } slider.on("touchmove", function(e) { e.preventDefault(); }); container.find("img").on("mousedown", function(event) { event.preventDefault(); }); if (options.click_to_move) { container.on('click', function(e) { offsetX = container.offset().left; offsetY = container.offset().top; imgWidth = beforeImg.width(); imgHeight = beforeImg.height(); sliderPct = getSliderPercentage(e.pageX, e.pageY); adjustSlider(sliderPct); }); } $(window).trigger("resize.twentytwenty"); }); }; })(jQuery); //jquery.preload !function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?module.exports=a(require("jquery")):a(jQuery)}(function(a){var b="waitForImages",c=function(a){return a.srcset&&a.sizes}(new Image);a.waitForImages={hasImageProperties:["backgroundImage","listStyleImage","borderImage","borderCornerImage","cursor"],hasImageAttributes:["srcset"]},a.expr[":"]["has-src"]=function(b){return a(b).is('img[src][src!=""]')},a.expr[":"].uncached=function(b){return!!a(b).is(":has-src")&&!b.complete},a.fn.waitForImages=function(){var d,e,f,g=0,h=0,i=a.Deferred(),j=this,k=[],l=a.waitForImages.hasImageProperties||[],m=a.waitForImages.hasImageAttributes||[],n=/url\(\s*(['"]?)(.*?)\1\s*\)/g;if(a.isPlainObject(arguments[0])?(f=arguments[0].waitForAll,e=arguments[0].each,d=arguments[0].finished):1===arguments.length&&"boolean"===a.type(arguments[0])?f=arguments[0]:(d=arguments[0],e=arguments[1],f=arguments[2]),d=d||a.noop,e=e||a.noop,f=!!f,!a.isFunction(d)||!a.isFunction(e))throw new TypeError("An invalid callback was supplied.");return this.each(function(){var b=a(this);f?b.find("*").addBack().each(function(){var b=a(this);b.is("img:has-src")&&!b.is("[srcset]")&&k.push({src:b.attr("src"),element:b[0]}),a.each(l,function(a,c){var d,e=b.css(c);if(!e)return!0;for(;d=n.exec(e);)k.push({src:d[2],element:b[0]})}),a.each(m,function(a,c){var d=b.attr(c);return!d||void k.push({src:b.attr("src"),srcset:b.attr("srcset"),element:b[0]})})}):b.find("img:has-src").each(function(){k.push({src:this.src,element:this})})}),g=k.length,h=0,0===g&&(d.call(j),i.resolveWith(j)),a.each(k,function(f,k){var l=new Image,m="load."+b+" error."+b;a(l).one(m,function b(c){var f=[h,g,"load"==c.type];if(h++,e.apply(k.element,f),i.notifyWith(k.element,f),a(this).off(m,b),h==g)return d.call(j[0]),i.resolveWith(j[0]),!1}),c&&k.srcset&&(l.srcset=k.srcset,l.sizes=k.sizes),l.src=k.src}),i.promise()}}); //jQuery elevateZoom 3.0.8 if ( typeof Object.create !== 'function' ) { Object.create = function( obj ) { function F() {}; F.prototype = obj; return new F(); }; } (function( $, window, document, undefined ) { var ElevateZoom = { init: function( options, elem ) { var self = this; self.elem = elem; self.$elem = $( elem ); self.imageSrc = self.$elem.data("zoom-image") ? self.$elem.data("zoom-image") : self.$elem.attr("src"); self.options = $.extend( {}, $.fn.elevateZoom.options, options ); //TINT OVERRIDE SETTINGS if(self.options.tint) { self.options.lensColour = "none", //colour of the lens background self.options.lensOpacity = "1" //opacity of the lens } //INNER OVERRIDE SETTINGS if(self.options.zoomType == "inner") {self.options.showLens = false;} //Remove alt on hover self.$elem.parent().removeAttr('title').removeAttr('alt'); self.zoomImage = self.imageSrc; self.refresh( 1 ); //Create the image swap from the gallery $('#'+self.options.gallery + ' a').click( function(e) { //Set a class on the currently active gallery image if(self.options.galleryActiveClass){ $('#'+self.options.gallery + ' a').removeClass(self.options.galleryActiveClass); $(this).addClass(self.options.galleryActiveClass); } //stop any link on the a tag from working e.preventDefault(); //call the swap image function if($(this).data("zoom-image")){self.zoomImagePre = $(this).data("zoom-image")} else{self.zoomImagePre = $(this).data("image");} self.swaptheimage($(this).data("image"), self.zoomImagePre); return false; }); }, refresh: function( length ) { var self = this; setTimeout(function() { self.fetch(self.imageSrc); }, length || self.options.refresh ); }, fetch: function(imgsrc) { //get the image var self = this; var newImg = new Image(); newImg.onload = function() { //set the large image dimensions - used to calculte ratio's self.largeWidth = newImg.width; self.largeHeight = newImg.height; //once image is loaded start the calls self.startZoom(); self.currentImage = self.imageSrc; //let caller know image has been loaded self.options.onZoomedImageLoaded(self.$elem); } newImg.src = imgsrc; // this must be done AFTER setting onload return; }, startZoom: function( ) { var self = this; //get dimensions of the non zoomed image self.nzWidth = self.$elem.width(); self.nzHeight = self.$elem.height(); //activated elements self.isWindowActive = false; self.isLensActive = false; self.isTintActive = false; self.overWindow = false; //CrossFade Wrappe if(self.options.imageCrossfade){ self.zoomWrap = self.$elem.wrap('
'); self.$elem.css('position', 'absolute'); } self.zoomLock = 1; self.scrollingLock = false; self.changeBgSize = false; self.currentZoomLevel = self.options.zoomLevel; //get offset of the non zoomed image self.nzOffset = self.$elem.offset(); //calculate the width ratio of the large/small image self.widthRatio = (self.largeWidth/self.currentZoomLevel) / self.nzWidth; self.heightRatio = (self.largeHeight/self.currentZoomLevel) / self.nzHeight; //if window zoom if(self.options.zoomType == "window") { self.zoomWindowStyle = "overflow: hidden;" + "background-position: 0px 0px;text-align:center;" + "background-color: " + String(self.options.zoomWindowBgColour) + ";width: " + String(self.options.zoomWindowWidth) + "px;" + "height: " + String(self.options.zoomWindowHeight) + "px;float: left;" + "background-size: "+ self.largeWidth/self.currentZoomLevel+ "px " +self.largeHeight/self.currentZoomLevel + "px;" + "display: none;z-index:100;" + "border: " + String(self.options.borderSize) + "px solid " + self.options.borderColour + ";background-repeat: no-repeat;" + "position: absolute;"; } //if inner zoom if(self.options.zoomType == "inner") { //has a border been put on the image? Lets cater for this var borderWidth = self.$elem.css("border-left-width"); self.zoomWindowStyle = "overflow: hidden;" + "margin-left: " + String(borderWidth) + ";" + "margin-top: " + String(borderWidth) + ";" + "background-position: 0px 0px;" + "width: " + String(self.nzWidth) + "px;" + "height: " + String(self.nzHeight) + "px;" + "px;float: left;" + "display: none;" + "cursor:"+(self.options.cursor)+";" + "px solid " + self.options.borderColour + ";background-repeat: no-repeat;" + "position: absolute;"; } //lens style for window zoom if(self.options.zoomType == "window") { // adjust images less than the window height if(self.nzHeight < self.options.zoomWindowWidth/self.widthRatio){ lensHeight = self.nzHeight; } else{ lensHeight = String((self.options.zoomWindowHeight/self.heightRatio)) } if(self.largeWidth < self.options.zoomWindowWidth){ lensWidth = self.nzWidth; } else{ lensWidth = (self.options.zoomWindowWidth/self.widthRatio); } self.lensStyle = "background-position: 0px 0px;width: " + String((self.options.zoomWindowWidth)/self.widthRatio) + "px;height: " + String((self.options.zoomWindowHeight)/self.heightRatio) + "px;float: right;display: none;" + "overflow: hidden;" + "z-index: 999;" + "-webkit-transform: translateZ(0);" + "opacity:"+(self.options.lensOpacity)+";filter: alpha(opacity = "+(self.options.lensOpacity*100)+"); zoom:1;" + "width:"+lensWidth+"px;" + "height:"+lensHeight+"px;" + "background-color:"+(self.options.lensColour)+";" + "cursor:"+(self.options.cursor)+";" + "border: "+(self.options.lensBorderSize)+"px" + " solid "+(self.options.lensBorderColour)+";background-repeat: no-repeat;position: absolute;"; } //tint style self.tintStyle = "display: block;" + "position: absolute;" + "background-color: "+self.options.tintColour+";" + "filter:alpha(opacity=0);" + "opacity: 0;" + "width: " + self.nzWidth + "px;" + "height: " + self.nzHeight + "px;" ; //lens style for lens zoom with optional round for modern browsers self.lensRound = ''; if(self.options.zoomType == "lens") { self.lensStyle = "background-position: 0px 0px;" + "float: left;display: none;" + "border: " + String(self.options.borderSize) + "px solid " + self.options.borderColour+";" + "width:"+ String(self.options.lensSize) +"px;" + "height:"+ String(self.options.lensSize)+"px;" + "background-repeat: no-repeat;position: absolute;"; } //does not round in all browsers if(self.options.lensShape == "round") { self.lensRound = "border-top-left-radius: " + String(self.options.lensSize / 2 + self.options.borderSize) + "px;" + "border-top-right-radius: " + String(self.options.lensSize / 2 + self.options.borderSize) + "px;" + "border-bottom-left-radius: " + String(self.options.lensSize / 2 + self.options.borderSize) + "px;" + "border-bottom-right-radius: " + String(self.options.lensSize / 2 + self.options.borderSize) + "px;"; } //create the div's + "" //self.zoomContainer = $('
').addClass('zoomContainer').css({"position":"relative", "height":self.nzHeight, "width":self.nzWidth}); self.zoomContainer = $('
'); $('body').append(self.zoomContainer); //this will add overflow hidden and contrain the lens on lens mode if(self.options.containLensZoom && self.options.zoomType == "lens"){ self.zoomContainer.css("overflow", "hidden"); } if(self.options.zoomType != "inner") { self.zoomLens = $("
 
") .appendTo(self.zoomContainer) .click(function () { self.$elem.trigger('click'); }); if(self.options.tint) { self.tintContainer = $('
').addClass('tintContainer'); self.zoomTint = $("
"); self.zoomLens.wrap(self.tintContainer); self.zoomTintcss = self.zoomLens.after(self.zoomTint); //if tint enabled - set an image to show over the tint self.zoomTintImage = $('') .appendTo(self.zoomLens) .click(function () { self.$elem.trigger('click'); }); } } //create zoom window if(isNaN(self.options.zoomWindowPosition)){ self.zoomWindow = $("
 
") .appendTo('body') .click(function () { self.$elem.trigger('click'); }); }else{ self.zoomWindow = $("
 
") .appendTo(self.zoomContainer) .click(function () { self.$elem.trigger('click'); }); } self.zoomWindowContainer = $('
').addClass('zoomWindowContainer').css("width",self.options.zoomWindowWidth); self.zoomWindow.wrap(self.zoomWindowContainer); // self.captionStyle = "text-align: left;background-color: black;color: white;font-weight: bold;padding: 10px;font-family: sans-serif;font-size: 11px"; // self.zoomCaption = $('
INSERT ALT TAG
').appendTo(self.zoomWindow.parent()); if(self.options.zoomType == "lens") { self.zoomLens.css({ backgroundImage: "url('" + self.imageSrc + "')" }); } if(self.options.zoomType == "window") { self.zoomWindow.css({ backgroundImage: "url('" + self.imageSrc + "')" }); } if(self.options.zoomType == "inner") { self.zoomWindow.css({ backgroundImage: "url('" + self.imageSrc + "')" }); } /*-------------------END THE ZOOM WINDOW AND LENS----------------------------------*/ //touch events self.$elem.bind('touchmove', function(e){ e.preventDefault(); var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; self.setPosition(touch); }); self.zoomContainer.bind('touchmove', function(e){ if(self.options.zoomType == "inner") { self.showHideWindow("show"); } e.preventDefault(); var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; self.setPosition(touch); }); self.zoomContainer.bind('touchend', function(e){ self.showHideWindow("hide"); if(self.options.showLens) {self.showHideLens("hide");} if(self.options.tint && self.options.zoomType != "inner") {self.showHideTint("hide");} }); self.$elem.bind('touchend', function(e){ self.showHideWindow("hide"); if(self.options.showLens) {self.showHideLens("hide");} if(self.options.tint && self.options.zoomType != "inner") {self.showHideTint("hide");} }); if(self.options.showLens) { self.zoomLens.bind('touchmove', function(e){ e.preventDefault(); var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; self.setPosition(touch); }); self.zoomLens.bind('touchend', function(e){ self.showHideWindow("hide"); if(self.options.showLens) {self.showHideLens("hide");} if(self.options.tint && self.options.zoomType != "inner") {self.showHideTint("hide");} }); } //Needed to work in IE self.$elem.bind('mousemove', function(e){ if(self.overWindow == false){self.setElements("show");} //make sure on orientation change the setposition is not fired if(self.lastX !== e.clientX || self.lastY !== e.clientY){ self.setPosition(e); self.currentLoc = e; } self.lastX = e.clientX; self.lastY = e.clientY; }); self.zoomContainer.bind('mousemove', function(e){ if(self.overWindow == false){self.setElements("show");} //make sure on orientation change the setposition is not fired if(self.lastX !== e.clientX || self.lastY !== e.clientY){ self.setPosition(e); self.currentLoc = e; } self.lastX = e.clientX; self.lastY = e.clientY; }); if(self.options.zoomType != "inner") { self.zoomLens.bind('mousemove', function(e){ //make sure on orientation change the setposition is not fired if(self.lastX !== e.clientX || self.lastY !== e.clientY){ self.setPosition(e); self.currentLoc = e; } self.lastX = e.clientX; self.lastY = e.clientY; }); } if(self.options.tint && self.options.zoomType != "inner") { self.zoomTint.bind('mousemove', function(e){ //make sure on orientation change the setposition is not fired if(self.lastX !== e.clientX || self.lastY !== e.clientY){ self.setPosition(e); self.currentLoc = e; } self.lastX = e.clientX; self.lastY = e.clientY; }); } if(self.options.zoomType == "inner") { self.zoomWindow.bind('mousemove', function(e) { //self.overWindow = true; //make sure on orientation change the setposition is not fired if(self.lastX !== e.clientX || self.lastY !== e.clientY){ self.setPosition(e); self.currentLoc = e; } self.lastX = e.clientX; self.lastY = e.clientY; }); } // lensFadeOut: 500, zoomTintFadeIn self.zoomContainer.add(self.$elem).mouseenter(function(){ if(self.overWindow == false){self.setElements("show");} }).mouseleave(function(){ if(!self.scrollLock){ self.setElements("hide"); self.options.onDestroy(self.$elem); } }); //end ove image if(self.options.zoomType != "inner") { self.zoomWindow.mouseenter(function(){ self.overWindow = true; self.setElements("hide"); }).mouseleave(function(){ self.overWindow = false; }); } //end ove image // var delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail); // $(this).empty(); // return false; //fix for initial zoom setting if (self.options.zoomLevel != 1){ // self.changeZoomLevel(self.currentZoomLevel); } //set the min zoomlevel if(self.options.minZoomLevel){ self.minZoomLevel = self.options.minZoomLevel; } else{ self.minZoomLevel = self.options.scrollZoomIncrement * 2; } if(self.options.scrollZoom){ self.zoomContainer.add(self.$elem).bind('mousewheel DOMMouseScroll MozMousePixelScroll', function(e){ // in IE there is issue with firing of mouseleave - So check whether still scrolling // and on mouseleave check if scrolllock self.scrollLock = true; clearTimeout($.data(this, 'timer')); $.data(this, 'timer', setTimeout(function() { self.scrollLock = false; //do something }, 250)); var theEvent = e.originalEvent.wheelDelta || e.originalEvent.detail*-1 //this.scrollTop += ( delta < 0 ? 1 : -1 ) * 30; // e.preventDefault(); e.stopImmediatePropagation(); e.stopPropagation(); e.preventDefault(); if(theEvent /120 > 0) { //scrolling up if(self.currentZoomLevel >= self.minZoomLevel){ self.changeZoomLevel(self.currentZoomLevel-self.options.scrollZoomIncrement); } } else{ //scrolling down if(self.options.maxZoomLevel){ if(self.currentZoomLevel <= self.options.maxZoomLevel){ self.changeZoomLevel(parseFloat(self.currentZoomLevel)+self.options.scrollZoomIncrement); } } else{ //andy self.changeZoomLevel(parseFloat(self.currentZoomLevel)+self.options.scrollZoomIncrement); } } return false; }); } }, setElements: function(type) { var self = this; if(!self.options.zoomEnabled){return false;} if(type=="show"){ if(self.isWindowSet){ if(self.options.zoomType == "inner") {self.showHideWindow("show");} if(self.options.zoomType == "window") {self.showHideWindow("show");} if(self.options.showLens) {self.showHideLens("show");} if(self.options.tint && self.options.zoomType != "inner") {self.showHideTint("show"); } } } if(type=="hide"){ if(self.options.zoomType == "window") {self.showHideWindow("hide");} if(!self.options.tint) {self.showHideWindow("hide");} if(self.options.showLens) {self.showHideLens("hide");} if(self.options.tint) { self.showHideTint("hide");} } }, setPosition: function(e) { var self = this; if(!self.options.zoomEnabled){return false;} //recaclc offset each time in case the image moves //this can be caused by other on page elements self.nzHeight = self.$elem.height(); self.nzWidth = self.$elem.width(); self.nzOffset = self.$elem.offset(); if(self.options.tint && self.options.zoomType != "inner") { self.zoomTint.css({ top: 0}); self.zoomTint.css({ left: 0}); } //set responsive //will checking if the image needs changing before running this code work faster? if(self.options.responsive && !self.options.scrollZoom){ if(self.options.showLens){ if(self.nzHeight < self.options.zoomWindowWidth/self.widthRatio){ lensHeight = self.nzHeight; } else{ lensHeight = String((self.options.zoomWindowHeight/self.heightRatio)) } if(self.largeWidth < self.options.zoomWindowWidth){ lensWidth = self.nzWidth; } else{ lensWidth = (self.options.zoomWindowWidth/self.widthRatio); } self.widthRatio = self.largeWidth / self.nzWidth; self.heightRatio = self.largeHeight / self.nzHeight; if(self.options.zoomType != "lens") { //possibly dont need to keep recalcalculating //if the lens is heigher than the image, then set lens size to image size if(self.nzHeight < self.options.zoomWindowWidth/self.widthRatio){ lensHeight = self.nzHeight; } else{ lensHeight = String((self.options.zoomWindowHeight/self.heightRatio)) } if(self.nzWidth < self.options.zoomWindowHeight/self.heightRatio){ lensWidth = self.nzWidth; } else{ lensWidth = String((self.options.zoomWindowWidth/self.widthRatio)); } self.zoomLens.css('width', lensWidth); self.zoomLens.css('height', lensHeight); if(self.options.tint){ self.zoomTintImage.css('width', self.nzWidth); self.zoomTintImage.css('height', self.nzHeight); } } if(self.options.zoomType == "lens") { self.zoomLens.css({ width: String(self.options.lensSize) + 'px', height: String(self.options.lensSize) + 'px' }) } //end responsive image change } } //container fix self.zoomContainer.css({ top: self.nzOffset.top}); self.zoomContainer.css({ left: self.nzOffset.left+30}); var anchoNuevo=parseInt(self.$elem.width())-60; self.zoomContainer.css({ width: anchoNuevo + 'px'}); self.mouseLeft = parseInt(e.pageX - self.nzOffset.left); self.mouseTop = parseInt(e.pageY - self.nzOffset.top); //calculate the Location of the Lens //calculate the bound regions - but only if zoom window if(self.options.zoomType == "window") { self.Etoppos = (self.mouseTop < (self.zoomLens.height()/2)); self.Eboppos = (self.mouseTop > self.nzHeight - (self.zoomLens.height()/2)-(self.options.lensBorderSize*2)); self.Eloppos = (self.mouseLeft < 0+((self.zoomLens.width()/2))); self.Eroppos = (self.mouseLeft > (self.nzWidth - (self.zoomLens.width()/2)-(self.options.lensBorderSize*2))); } //calculate the bound regions - but only for inner zoom if(self.options.zoomType == "inner"){ self.Etoppos = (self.mouseTop < ((self.nzHeight/2)/self.heightRatio) ); self.Eboppos = (self.mouseTop > (self.nzHeight - ((self.nzHeight/2)/self.heightRatio))); self.Eloppos = (self.mouseLeft < 0+(((self.nzWidth/2)/self.widthRatio))); self.Eroppos = (self.mouseLeft > (self.nzWidth - (self.nzWidth/2)/self.widthRatio-(self.options.lensBorderSize*2))); } // if the mouse position of the slider is one of the outerbounds, then hide window and lens if (self.mouseLeft < 0 || self.mouseTop < 0 || self.mouseLeft > self.nzWidth || self.mouseTop > self.nzHeight ) { self.setElements("hide"); return; } //else continue with operations else { //lens options if(self.options.showLens) { // self.showHideLens("show"); //set background position of lens self.lensLeftPos = String(Math.floor(self.mouseLeft - self.zoomLens.width() / 2)); self.lensTopPos = String(Math.floor(self.mouseTop - self.zoomLens.height() / 2)); } //adjust the background position if the mouse is in one of the outer regions //Top region if(self.Etoppos){ self.lensTopPos = 0; } //Left Region if(self.Eloppos){ self.windowLeftPos = 0; self.lensLeftPos = 0; self.tintpos=0; } //Set bottom and right region for window mode if(self.options.zoomType == "window") { if(self.Eboppos){ self.lensTopPos = Math.max( (self.nzHeight)-self.zoomLens.height()-(self.options.lensBorderSize*2), 0 ); } if(self.Eroppos){ self.lensLeftPos = (self.nzWidth-(self.zoomLens.width())-(self.options.lensBorderSize*2)); } } //Set bottom and right region for inner mode if(self.options.zoomType == "inner") { if(self.Eboppos){ self.lensTopPos = Math.max( ((self.nzHeight)-(self.options.lensBorderSize*2)), 0 ); } if(self.Eroppos){ self.lensLeftPos = (self.nzWidth-(self.nzWidth)-(self.options.lensBorderSize*2)); } } //if lens zoom if(self.options.zoomType == "lens") { self.windowLeftPos = String(((e.pageX - self.nzOffset.left) * self.widthRatio - self.zoomLens.width() / 2) * (-1)); self.windowTopPos = String(((e.pageY - self.nzOffset.top) * self.heightRatio - self.zoomLens.height() / 2) * (-1)); self.zoomLens.css({ backgroundPosition: self.windowLeftPos + 'px ' + self.windowTopPos + 'px' }); if(self.changeBgSize){ if(self.nzHeight>self.nzWidth){ if(self.options.zoomType == "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } else{ if(self.options.zoomType == "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } self.changeBgSize = false; } self.setWindowPostition(e); } //if tint zoom if(self.options.tint && self.options.zoomType != "inner") { self.setTintPosition(e); } //set the css background position if(self.options.zoomType == "window") { self.setWindowPostition(e); } if(self.options.zoomType == "inner") { self.setWindowPostition(e); } if(self.options.showLens) { if(self.fullwidth && self.options.zoomType != "lens"){ self.lensLeftPos = 0; } self.zoomLens.css({ left: self.lensLeftPos + 'px', top: self.lensTopPos + 'px' }) } } //end else }, showHideWindow: function(change) { var self = this; if(change == "show"){ if(!self.isWindowActive){ if(self.options.zoomWindowFadeIn){ self.zoomWindow.stop(true, true, false).fadeIn(self.options.zoomWindowFadeIn); } else{self.zoomWindow.show();} self.isWindowActive = true; } } if(change == "hide"){ if(self.isWindowActive){ if(self.options.zoomWindowFadeOut){ self.zoomWindow.stop(true, true).fadeOut(self.options.zoomWindowFadeOut, function () { if (self.loop) { //stop moving the zoom window when zoom window is faded out clearInterval(self.loop); self.loop = false; } }); } else{self.zoomWindow.hide();} self.isWindowActive = false; } } }, showHideLens: function(change) { var self = this; if(change == "show"){ if(!self.isLensActive){ if(self.options.lensFadeIn){ self.zoomLens.stop(true, true, false).fadeIn(self.options.lensFadeIn); } else{self.zoomLens.show();} self.isLensActive = true; } } if(change == "hide"){ if(self.isLensActive){ if(self.options.lensFadeOut){ self.zoomLens.stop(true, true).fadeOut(self.options.lensFadeOut); } else{self.zoomLens.hide();} self.isLensActive = false; } } }, showHideTint: function(change) { var self = this; if(change == "show"){ if(!self.isTintActive){ if(self.options.zoomTintFadeIn){ self.zoomTint.css({opacity:self.options.tintOpacity}).animate().stop(true, true).fadeIn("slow"); } else{ self.zoomTint.css({opacity:self.options.tintOpacity}).animate(); self.zoomTint.show(); } self.isTintActive = true; } } if(change == "hide"){ if(self.isTintActive){ if(self.options.zoomTintFadeOut){ self.zoomTint.stop(true, true).fadeOut(self.options.zoomTintFadeOut); } else{self.zoomTint.hide();} self.isTintActive = false; } } }, setLensPostition: function( e ) { }, setWindowPostition: function( e ) { //return obj.slice( 0, count ); var self = this; if(!isNaN(self.options.zoomWindowPosition)){ switch (self.options.zoomWindowPosition) { case 1: //done self.windowOffsetTop = (self.options.zoomWindowOffety);//DONE - 1 self.windowOffsetLeft =(+self.nzWidth); //DONE 1, 2, 3, 4, 16 break; case 2: if(self.options.zoomWindowHeight > self.nzHeight){ //positive margin self.windowOffsetTop = ((self.options.zoomWindowHeight/2)-(self.nzHeight/2))*(-1); self.windowOffsetLeft =(self.nzWidth); //DONE 1, 2, 3, 4, 16 } else{ //negative margin } break; case 3: //done self.windowOffsetTop = (self.nzHeight - self.zoomWindow.height() - (self.options.borderSize*2)); //DONE 3,9 self.windowOffsetLeft =(self.nzWidth); //DONE 1, 2, 3, 4, 16 break; case 4: //done self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 self.windowOffsetLeft =(self.nzWidth); //DONE 1, 2, 3, 4, 16 break; case 5: //done self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 self.windowOffsetLeft =(self.nzWidth-self.zoomWindow.width()-(self.options.borderSize*2)); //DONE - 5,15 break; case 6: if(self.options.zoomWindowHeight > self.nzHeight){ //positive margin self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 self.windowOffsetLeft =((self.options.zoomWindowWidth/2)-(self.nzWidth/2)+(self.options.borderSize*2))*(-1); } else{ //negative margin } break; case 7: //done self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 self.windowOffsetLeft = 0; //DONE 7, 13 break; case 8: //done self.windowOffsetTop = (self.nzHeight); //DONE - 4,5,6,7,8 self.windowOffsetLeft =(self.zoomWindow.width()+(self.options.borderSize*2) )* (-1); //DONE 8,9,10,11,12 break; case 9: //done self.windowOffsetTop = (self.nzHeight - self.zoomWindow.height() - (self.options.borderSize*2)); //DONE 3,9 self.windowOffsetLeft =(self.zoomWindow.width()+(self.options.borderSize*2) )* (-1); //DONE 8,9,10,11,12 break; case 10: if(self.options.zoomWindowHeight > self.nzHeight){ //positive margin self.windowOffsetTop = ((self.options.zoomWindowHeight/2)-(self.nzHeight/2))*(-1); self.windowOffsetLeft =(self.zoomWindow.width()+(self.options.borderSize*2) )* (-1); //DONE 8,9,10,11,12 } else{ //negative margin } break; case 11: self.windowOffsetTop = (self.options.zoomWindowOffety); self.windowOffsetLeft =(self.zoomWindow.width()+(self.options.borderSize*2) )* (-1); //DONE 8,9,10,11,12 break; case 12: //done self.windowOffsetTop = (self.zoomWindow.height()+(self.options.borderSize*2))*(-1); //DONE 12,13,14,15,16 self.windowOffsetLeft =(self.zoomWindow.width()+(self.options.borderSize*2) )* (-1); //DONE 8,9,10,11,12 break; case 13: //done self.windowOffsetTop = (self.zoomWindow.height()+(self.options.borderSize*2))*(-1); //DONE 12,13,14,15,16 self.windowOffsetLeft =(0); //DONE 7, 13 break; case 14: if(self.options.zoomWindowHeight > self.nzHeight){ //positive margin self.windowOffsetTop = (self.zoomWindow.height()+(self.options.borderSize*2))*(-1); //DONE 12,13,14,15,16 self.windowOffsetLeft =((self.options.zoomWindowWidth/2)-(self.nzWidth/2)+(self.options.borderSize*2))*(-1); } else{ //negative margin } break; case 15://done self.windowOffsetTop = (self.zoomWindow.height()+(self.options.borderSize*2))*(-1); //DONE 12,13,14,15,16 self.windowOffsetLeft =(self.nzWidth-self.zoomWindow.width()-(self.options.borderSize*2)); //DONE - 5,15 break; case 16: //done self.windowOffsetTop = (self.zoomWindow.height()+(self.options.borderSize*2))*(-1); //DONE 12,13,14,15,16 self.windowOffsetLeft =(self.nzWidth); //DONE 1, 2, 3, 4, 16 break; default: //done self.windowOffsetTop = (self.options.zoomWindowOffety);//DONE - 1 self.windowOffsetLeft =(self.nzWidth); //DONE 1, 2, 3, 4, 16 } } //end isNAN else{ //WE CAN POSITION IN A CLASS - ASSUME THAT ANY STRING PASSED IS self.externalContainer = $('#'+self.options.zoomWindowPosition); self.externalContainerWidth = self.externalContainer.width(); self.externalContainerHeight = self.externalContainer.height(); self.externalContainerOffset = self.externalContainer.offset(); self.windowOffsetTop = self.externalContainerOffset.top;//DONE - 1 self.windowOffsetLeft =self.externalContainerOffset.left; //DONE 1, 2, 3, 4, 16 } self.isWindowSet = true; self.windowOffsetTop = self.windowOffsetTop + self.options.zoomWindowOffety; self.windowOffsetLeft = self.windowOffsetLeft + self.options.zoomWindowOffetx; self.zoomWindow.css({ top: self.windowOffsetTop}); self.zoomWindow.css({ left: self.windowOffsetLeft}); if(self.options.zoomType == "inner") { self.zoomWindow.css({ top: 0}); self.zoomWindow.css({ left: 0}); } self.windowLeftPos = String(((e.pageX - self.nzOffset.left) * self.widthRatio - self.zoomWindow.width() / 2) * (-1)); self.windowTopPos = String(((e.pageY - self.nzOffset.top) * self.heightRatio - self.zoomWindow.height() / 2) * (-1)); if(self.Etoppos){self.windowTopPos = 0;} if(self.Eloppos){self.windowLeftPos = 0;} if(self.Eboppos){self.windowTopPos = (self.largeHeight/self.currentZoomLevel-self.zoomWindow.height())*(-1); } if(self.Eroppos){self.windowLeftPos = ((self.largeWidth/self.currentZoomLevel-self.zoomWindow.width())*(-1));} //stops micro movements if(self.fullheight){ self.windowTopPos = 0; } if(self.fullwidth){ self.windowLeftPos = 0; } //set the css background position if(self.options.zoomType == "window" || self.options.zoomType == "inner") { if(self.zoomLock == 1){ //overrides for images not zoomable if(self.widthRatio <= 1){ self.windowLeftPos = 0; } if(self.heightRatio <= 1){ self.windowTopPos = 0; } } // adjust images less than the window height if (self.options.zoomType == "window") { if (self.largeHeight < self.options.zoomWindowHeight) { self.windowTopPos = 0; } if (self.largeWidth < self.options.zoomWindowWidth) { self.windowLeftPos = 0; } } //set the zoomwindow background position if (self.options.easing){ // if(self.changeZoom){ // clearInterval(self.loop); // self.changeZoom = false; // self.loop = false; // } //set the pos to 0 if not set if(!self.xp){self.xp = 0;} if(!self.yp){self.yp = 0;} //if loop not already started, then run it if (!self.loop){ self.loop = setInterval(function(){ //using zeno's paradox self.xp += (self.windowLeftPos - self.xp) / self.options.easingAmount; self.yp += (self.windowTopPos - self.yp) / self.options.easingAmount; if(self.scrollingLock){ clearInterval(self.loop); self.xp = self.windowLeftPos; self.yp = self.windowTopPos self.xp = ((e.pageX - self.nzOffset.left) * self.widthRatio - self.zoomWindow.width() / 2) * (-1); self.yp = (((e.pageY - self.nzOffset.top) * self.heightRatio - self.zoomWindow.height() / 2) * (-1)); if(self.changeBgSize){ if(self.nzHeight>self.nzWidth){ if(self.options.zoomType == "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } else{ if(self.options.zoomType != "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } /* if(!self.bgxp){self.bgxp = self.largeWidth/self.newvalue;} if(!self.bgyp){self.bgyp = self.largeHeight/self.newvalue ;} if (!self.bgloop){ self.bgloop = setInterval(function(){ self.bgxp += (self.largeWidth/self.newvalue - self.bgxp) / self.options.easingAmount; self.bgyp += (self.largeHeight/self.newvalue - self.bgyp) / self.options.easingAmount; self.zoomWindow.css({ "background-size": self.bgxp + 'px ' + self.bgyp + 'px' }); }, 16); } */ self.changeBgSize = false; } self.zoomWindow.css({ backgroundPosition: self.windowLeftPos + 'px ' + self.windowTopPos + 'px' }); self.scrollingLock = false; self.loop = false; } else if (Math.round(Math.abs(self.xp - self.windowLeftPos) + Math.abs(self.yp - self.windowTopPos)) < 1) { //stops micro movements clearInterval(self.loop); self.zoomWindow.css({ backgroundPosition: self.windowLeftPos + 'px ' + self.windowTopPos + 'px' }); self.loop = false; } else{ if(self.changeBgSize){ if(self.nzHeight>self.nzWidth){ if(self.options.zoomType == "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } else{ if(self.options.zoomType != "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } self.changeBgSize = false; } self.zoomWindow.css({ backgroundPosition: self.xp + 'px ' + self.yp + 'px' }); } }, 16); } } else{ if(self.changeBgSize){ if(self.nzHeight>self.nzWidth){ if(self.options.zoomType == "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } self.zoomWindow.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } else{ if(self.options.zoomType == "lens"){ self.zoomLens.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } if((self.largeHeight/self.newvaluewidth) < self.options.zoomWindowHeight){ self.zoomWindow.css({ "background-size": self.largeWidth/self.newvaluewidth + 'px ' + self.largeHeight/self.newvaluewidth + 'px' }); } else{ self.zoomWindow.css({ "background-size": self.largeWidth/self.newvalueheight + 'px ' + self.largeHeight/self.newvalueheight + 'px' }); } } self.changeBgSize = false; } self.zoomWindow.css({ backgroundPosition: self.windowLeftPos + 'px ' + self.windowTopPos + 'px' }); } } }, setTintPosition: function(e){ var self = this; self.nzOffset = self.$elem.offset(); self.tintpos = String(((e.pageX - self.nzOffset.left)-(self.zoomLens.width() / 2)) * (-1)); self.tintposy = String(((e.pageY - self.nzOffset.top) - self.zoomLens.height() / 2) * (-1)); if(self.Etoppos){ self.tintposy = 0; } if(self.Eloppos){ self.tintpos=0; } if(self.Eboppos){ self.tintposy = (self.nzHeight-self.zoomLens.height()-(self.options.lensBorderSize*2))*(-1); } if(self.Eroppos){ self.tintpos = ((self.nzWidth-self.zoomLens.width()-(self.options.lensBorderSize*2))*(-1)); } if(self.options.tint) { //stops micro movements if(self.fullheight){ self.tintposy = 0; } if(self.fullwidth){ self.tintpos = 0; } self.zoomTintImage.css({'left': self.tintpos+'px'}); self.zoomTintImage.css({'top': self.tintposy+'px'}); } }, swaptheimage: function(smallimage, largeimage){ var self = this; var newImg = new Image(); if(self.options.loadingIcon){ self.spinner = $('
'); self.$elem.after(self.spinner); } self.options.onImageSwap(self.$elem); newImg.onload = function() { self.largeWidth = newImg.width; self.largeHeight = newImg.height; self.zoomImage = largeimage; self.zoomWindow.css({ "background-size": self.largeWidth + 'px ' + self.largeHeight + 'px' }); self.swapAction(smallimage, largeimage); return; } newImg.src = largeimage; // this must be done AFTER setting onload }, swapAction: function(smallimage, largeimage){ var self = this; var newImg2 = new Image(); newImg2.onload = function() { //re-calculate values self.nzHeight = newImg2.height; self.nzWidth = newImg2.width; self.options.onImageSwapComplete(self.$elem); self.doneCallback(); return; } newImg2.src = smallimage; //reset the zoomlevel to that initially set in options self.currentZoomLevel = self.options.zoomLevel; self.options.maxZoomLevel = false; //swaps the main image //self.$elem.attr("src",smallimage); //swaps the zoom image if(self.options.zoomType == "lens") { self.zoomLens.css({ backgroundImage: "url('" + largeimage + "')" }); } if(self.options.zoomType == "window") { self.zoomWindow.css({ backgroundImage: "url('" + largeimage + "')" }); } if(self.options.zoomType == "inner") { self.zoomWindow.css({ backgroundImage: "url('" + largeimage + "')" }); } self.currentImage = largeimage; if(self.options.imageCrossfade){ var oldImg = self.$elem; var newImg = oldImg.clone(); self.$elem.attr("src",smallimage) self.$elem.after(newImg); newImg.stop(true).fadeOut(self.options.imageCrossfade, function() { $(this).remove(); }); // if(self.options.zoomType == "inner"){ //remove any attributes on the cloned image so we can resize later self.$elem.width("auto").removeAttr("width"); self.$elem.height("auto").removeAttr("height"); // } oldImg.fadeIn(self.options.imageCrossfade); if(self.options.tint && self.options.zoomType != "inner") { var oldImgTint = self.zoomTintImage; var newImgTint = oldImgTint.clone(); self.zoomTintImage.attr("src",largeimage) self.zoomTintImage.after(newImgTint); newImgTint.stop(true).fadeOut(self.options.imageCrossfade, function() { $(this).remove(); }); oldImgTint.fadeIn(self.options.imageCrossfade); //self.zoomTintImage.attr("width",elem.data("image")); //resize the tint window self.zoomTint.css({ height: self.$elem.height()}); self.zoomTint.css({ width: self.$elem.width()}); } self.zoomContainer.css("height", self.$elem.height()); self.zoomContainer.css("width", self.$elem.width()); if(self.options.zoomType == "inner"){ if(!self.options.constrainType){ self.zoomWrap.parent().css("height", self.$elem.height()); self.zoomWrap.parent().css("width", self.$elem.width()); self.zoomWindow.css("height", self.$elem.height()); self.zoomWindow.css("width", self.$elem.width()); } } if(self.options.imageCrossfade){ self.zoomWrap.css("height", self.$elem.height()); self.zoomWrap.css("width", self.$elem.width()); } } else{ self.$elem.attr("src",smallimage); if(self.options.tint) { self.zoomTintImage.attr("src",largeimage); //self.zoomTintImage.attr("width",elem.data("image")); self.zoomTintImage.attr("height",self.$elem.height()); //self.zoomTintImage.attr('src') = elem.data("image"); self.zoomTintImage.css({ height: self.$elem.height()}); self.zoomTint.css({ height: self.$elem.height()}); } self.zoomContainer.css("height", self.$elem.height()); self.zoomContainer.css("width", self.$elem.width()); if(self.options.imageCrossfade){ self.zoomWrap.css("height", self.$elem.height()); self.zoomWrap.css("width", self.$elem.width()); } } if(self.options.constrainType){ //This will contrain the image proportions if(self.options.constrainType == "height"){ self.zoomContainer.css("height", self.options.constrainSize); self.zoomContainer.css("width", "auto"); if(self.options.imageCrossfade){ self.zoomWrap.css("height", self.options.constrainSize); self.zoomWrap.css("width", "auto"); self.constwidth = self.zoomWrap.width(); } else{ self.$elem.css("height", self.options.constrainSize); self.$elem.css("width", "auto"); self.constwidth = self.$elem.width(); } if(self.options.zoomType == "inner"){ self.zoomWrap.parent().css("height", self.options.constrainSize); self.zoomWrap.parent().css("width", self.constwidth); self.zoomWindow.css("height", self.options.constrainSize); self.zoomWindow.css("width", self.constwidth); } if(self.options.tint){ self.tintContainer.css("height", self.options.constrainSize); self.tintContainer.css("width", self.constwidth); self.zoomTint.css("height", self.options.constrainSize); self.zoomTint.css("width", self.constwidth); self.zoomTintImage.css("height", self.options.constrainSize); self.zoomTintImage.css("width", self.constwidth); } } if(self.options.constrainType == "width"){ self.zoomContainer.css("height", "auto"); self.zoomContainer.css("width", self.options.constrainSize); if(self.options.imageCrossfade){ self.zoomWrap.css("height", "auto"); self.zoomWrap.css("width", self.options.constrainSize); self.constheight = self.zoomWrap.height(); } else{ self.$elem.css("height", "auto"); self.$elem.css("width", self.options.constrainSize); self.constheight = self.$elem.height(); } if(self.options.zoomType == "inner"){ self.zoomWrap.parent().css("height", self.constheight); self.zoomWrap.parent().css("width", self.options.constrainSize); self.zoomWindow.css("height", self.constheight); self.zoomWindow.css("width", self.options.constrainSize); } if(self.options.tint){ self.tintContainer.css("height", self.constheight); self.tintContainer.css("width", self.options.constrainSize); self.zoomTint.css("height", self.constheight); self.zoomTint.css("width", self.options.constrainSize); self.zoomTintImage.css("height", self.constheight); self.zoomTintImage.css("width", self.options.constrainSize); } } } }, doneCallback: function(){ var self = this; if(self.options.loadingIcon){ self.spinner.hide(); } self.nzOffset = self.$elem.offset(); self.nzWidth = self.$elem.width(); self.nzHeight = self.$elem.height(); // reset the zoomlevel back to default self.currentZoomLevel = self.options.zoomLevel; //ratio of the large to small image self.widthRatio = self.largeWidth / self.nzWidth; self.heightRatio = self.largeHeight / self.nzHeight; //NEED TO ADD THE LENS SIZE FOR ROUND // adjust images less than the window height if(self.options.zoomType == "window") { if(self.nzHeight < self.options.zoomWindowWidth/self.widthRatio){ lensHeight = self.nzHeight; } else{ lensHeight = String((self.options.zoomWindowHeight/self.heightRatio)) } if(self.options.zoomWindowWidth < self.options.zoomWindowWidth){ lensWidth = self.nzWidth; } else{ lensWidth = (self.options.zoomWindowWidth/self.widthRatio); } if(self.zoomLens){ self.zoomLens.css('width', lensWidth); self.zoomLens.css('height', lensHeight); } } }, getCurrentImage: function(){ var self = this; return self.zoomImage; }, getGalleryList: function(){ var self = this; //loop through the gallery options and set them in list for fancybox self.gallerylist = []; if (self.options.gallery){ $('#'+self.options.gallery + ' a').each(function() { var img_src = ''; if($(this).data("zoom-image")){ img_src = $(this).data("zoom-image"); } else if($(this).data("image")){ img_src = $(this).data("image"); } //put the current image at the start if(img_src == self.zoomImage){ self.gallerylist.unshift({ href: ''+img_src+'', title: $(this).find('img').attr("title") }); } else{ self.gallerylist.push({ href: ''+img_src+'', title: $(this).find('img').attr("title") }); } }); } //if no gallery - return current image else{ self.gallerylist.push({ href: ''+self.zoomImage+'', title: $(this).find('img').attr("title") }); } return self.gallerylist; }, changeZoomLevel: function(value){ var self = this; //flag a zoom, so can adjust the easing during setPosition self.scrollingLock = true; //round to two decimal places self.newvalue = parseFloat(value).toFixed(2); newvalue = parseFloat(value).toFixed(2); //maxwidth & Maxheight of the image maxheightnewvalue = self.largeHeight/((self.options.zoomWindowHeight / self.nzHeight) * self.nzHeight); maxwidthtnewvalue = self.largeWidth/((self.options.zoomWindowWidth / self.nzWidth) * self.nzWidth); //calculate new heightratio if(self.options.zoomType != "inner") { if(maxheightnewvalue <= newvalue){ self.heightRatio = (self.largeHeight/maxheightnewvalue) / self.nzHeight; self.newvalueheight = maxheightnewvalue; self.fullheight = true; } else{ self.heightRatio = (self.largeHeight/newvalue) / self.nzHeight; self.newvalueheight = newvalue; self.fullheight = false; } // calculate new width ratio if(maxwidthtnewvalue <= newvalue){ self.widthRatio = (self.largeWidth/maxwidthtnewvalue) / self.nzWidth; self.newvaluewidth = maxwidthtnewvalue; self.fullwidth = true; } else{ self.widthRatio = (self.largeWidth/newvalue) / self.nzWidth; self.newvaluewidth = newvalue; self.fullwidth = false; } if(self.options.zoomType == "lens"){ if(maxheightnewvalue <= newvalue){ self.fullwidth = true; self.newvaluewidth = maxheightnewvalue; } else{ self.widthRatio = (self.largeWidth/newvalue) / self.nzWidth; self.newvaluewidth = newvalue; self.fullwidth = false; }} } if(self.options.zoomType == "inner") { maxheightnewvalue = parseFloat(self.largeHeight/self.nzHeight).toFixed(2); maxwidthtnewvalue = parseFloat(self.largeWidth/self.nzWidth).toFixed(2); if(newvalue > maxheightnewvalue){ newvalue = maxheightnewvalue; } if(newvalue > maxwidthtnewvalue){ newvalue = maxwidthtnewvalue; } if(maxheightnewvalue <= newvalue){ self.heightRatio = (self.largeHeight/newvalue) / self.nzHeight; if(newvalue > maxheightnewvalue){ self.newvalueheight = maxheightnewvalue; }else{ self.newvalueheight = newvalue; } self.fullheight = true; } else{ self.heightRatio = (self.largeHeight/newvalue) / self.nzHeight; if(newvalue > maxheightnewvalue){ self.newvalueheight = maxheightnewvalue; }else{ self.newvalueheight = newvalue; } self.fullheight = false; } if(maxwidthtnewvalue <= newvalue){ self.widthRatio = (self.largeWidth/newvalue) / self.nzWidth; if(newvalue > maxwidthtnewvalue){ self.newvaluewidth = maxwidthtnewvalue; }else{ self.newvaluewidth = newvalue; } self.fullwidth = true; } else{ self.widthRatio = (self.largeWidth/newvalue) / self.nzWidth; self.newvaluewidth = newvalue; self.fullwidth = false; } } //end inner scrcontinue = false; if(self.options.zoomType == "inner"){ if(self.nzWidth >= self.nzHeight){ if( self.newvaluewidth <= maxwidthtnewvalue){ scrcontinue = true; } else{ scrcontinue = false; self.fullheight = true; self.fullwidth = true; } } if(self.nzHeight > self.nzWidth){ if( self.newvaluewidth <= maxwidthtnewvalue){ scrcontinue = true; } else{ scrcontinue = false; self.fullheight = true; self.fullwidth = true; } } } if(self.options.zoomType != "inner"){ scrcontinue = true; } if(scrcontinue){ self.zoomLock = 0; self.changeZoom = true; //if lens height is less than image height if(((self.options.zoomWindowHeight)/self.heightRatio) <= self.nzHeight){ self.currentZoomLevel = self.newvalueheight; if(self.options.zoomType != "lens" && self.options.zoomType != "inner") { self.changeBgSize = true; self.zoomLens.css({height: String((self.options.zoomWindowHeight)/self.heightRatio) + 'px' }) } if(self.options.zoomType == "lens" || self.options.zoomType == "inner") { self.changeBgSize = true; } } if((self.options.zoomWindowWidth/self.widthRatio) <= self.nzWidth){ if(self.options.zoomType != "inner"){ if(self.newvaluewidth > self.newvalueheight) { self.currentZoomLevel = self.newvaluewidth; } } if(self.options.zoomType != "lens" && self.options.zoomType != "inner") { self.changeBgSize = true; self.zoomLens.css({width: String((self.options.zoomWindowWidth)/self.widthRatio) + 'px' }) } if(self.options.zoomType == "lens" || self.options.zoomType == "inner") { self.changeBgSize = true; } } if(self.options.zoomType == "inner"){ self.changeBgSize = true; if(self.nzWidth > self.nzHeight){ self.currentZoomLevel = self.newvaluewidth; } if(self.nzHeight > self.nzWidth){ self.currentZoomLevel = self.newvaluewidth; } } } //under //sets the boundry change, called in setWindowPos self.setPosition(self.currentLoc); // }, closeAll: function(){ if(self.zoomWindow){self.zoomWindow.hide();} if(self.zoomLens){self.zoomLens.hide();} if(self.zoomTint){self.zoomTint.hide();} }, changeState: function(value){ var self = this; if(value == 'enable'){self.options.zoomEnabled = true;} if(value == 'disable'){self.options.zoomEnabled = false;} } }; $.fn.elevateZoom = function( options ) { return this.each(function() { var elevate = Object.create( ElevateZoom ); elevate.init( options, this ); $.data( this, 'elevateZoom', elevate ); }); }; $.fn.elevateZoom.options = { zoomActivation: "hover", // Can also be click (PLACEHOLDER FOR NEXT VERSION) zoomEnabled: true, //false disables zoomwindow from showing preloading: 1, //by default, load all the images, if 0, then only load images after activated (PLACEHOLDER FOR NEXT VERSION) zoomLevel: 1, //default zoom level of image scrollZoom: false, //allow zoom on mousewheel, true to activate scrollZoomIncrement: 0.1, //steps of the scrollzoom minZoomLevel: false, maxZoomLevel: false, easing: false, easingAmount: 12, lensSize: 200, zoomWindowWidth: 400, zoomWindowHeight: 400, zoomWindowOffetx: 0, zoomWindowOffety: 0, zoomWindowPosition: 1, zoomWindowBgColour: "#fff", lensFadeIn: false, lensFadeOut: false, debug: false, zoomWindowFadeIn: false, zoomWindowFadeOut: false, zoomWindowAlwaysShow: false, zoomTintFadeIn: false, zoomTintFadeOut: false, borderSize: 4, showLens: true, borderColour: "#888", lensBorderSize: 1, lensBorderColour: "#000", lensShape: "square", //can be "round" zoomType: "window", //window is default, also "lens" available - containLensZoom: false, lensColour: "white", //colour of the lens background lensOpacity: 0.4, //opacity of the lens lenszoom: false, tint: false, //enable the tinting tintColour: "#333", //default tint color, can be anything, red, #ccc, rgb(0,0,0) tintOpacity: 0.4, //opacity of the tint gallery: false, galleryActiveClass: "zoomGalleryActive", imageCrossfade: false, constrainType: false, //width or height constrainSize: false, //in pixels the dimensions you want to constrain on loadingIcon: false, //http://www.example.com/spinner.gif cursor:"default", // user should set to what they want the cursor as, if they have set a click function responsive:true, onComplete: $.noop, onDestroy: function() {}, onZoomedImageLoaded: function() {}, onImageSwap: $.noop, onImageSwapComplete: $.noop }; })( jQuery, window, document ); /* * jQuery Booklet Plugin * Copyright (c) 2010 - 2014 William Grauvogel (http://builtbywill.com/) * * Licensed under the MIT license (http://www.opensource.org/licenses/mit-license.php) * * Version : 1.4.4 * * Originally based on the work of: * 1) Charles Mangin (http://clickheredammit.com/pageflip/) */ ;(function ($) { $.fn.booklet = function (options, param1, param2) { var obj, method, params, output, result, config, index; // option type string - api call if (typeof options === 'string') { result = []; $(this).each(function () { obj = $(this).data('booklet'); if (obj) { method = options; // add optional parameters params = []; if (typeof param1 !== 'undefined') { params.push(param1); } if (typeof param2 !== 'undefined') { params.push(param2); } if (obj[method]) { output = obj[method].apply(obj, params); if (typeof output !== 'undefined' || output) { result.push(obj[method].apply(obj, params)); } } else { $.error('Method "' + method + '" does not exist on jQuery.booklet.'); } } else { $.error('jQuery.booklet has not been initialized. Method "' + options + '" cannot be called.'); } }); if (result.length == 1) { return result[0]; } else if (result.length > 0) { return result; } else { return $(this); } } // option type number - api call else if (typeof options === 'number') { return $(this).each(function () { obj = $(this).data('booklet'); if (obj) { index = options; obj.gotopage(index); } else { $.error('jQuery.booklet has not been initialized.'); } }); } // else build new booklet else if (typeof method === 'object' || !method) { return $(this).each(function () { config = $.extend({}, $.fn.booklet.defaults, options); obj = $(this).data('booklet'); // destroy old booklet before creating new one if (obj) { obj.destroy(); } // instantiate the booklet obj = new Booklet($(this), config); obj.init(); return this; // preserve chaining on main function }); } }; function Booklet(inTarget, inOptions) { var target = inTarget, options = inOptions, isInit = false, isBusy = false, isPlaying = false, isHoveringRight = false, isHoveringLeft = false, isDisabled = false, templates = { empty: '
', //book page with no content blank: '
', //transparent item used with closed books sF: '
', sB: '
' }, directions = { leftToRight: 'LTR', rightToLeft: 'RTL' }, css = {}, anim = {}, hoverShadowWidth, hoverFullWidth, hoverCurlWidth, pages = [], currentHash = '', hashRoot = '/page/', hash, i, j, h, a, diff, originalPageTotal, startingPageNumber, //page content vars pN, p0, p1, p2, p3, p4, pNwrap, p0wrap, p1wrap, p2wrap, p3wrap, p4wrap, wraps, sF, sB, //control vars p3drag, p0drag, ctrls, overlaysB, overlayN, overlayP, tabs, tabN, tabP, arrows, arrowN, arrowP, customN, customP, ctrlsN, ctrlsP, menu, pause, play, pageSelector, pageSelectorList, listItemNumbers, listItemTitle, pageListItem, pageSelectorHeight, chapter, chapterSelector, chapterSelectorList, chapterListItem, chapterSelectorHeight, wPercent, wOrig, hPercent, hOrig, pWidth, pWidthN, pWidthH, pHeight, speedH, events = { create: 'bookletcreate', // called when booklet has been created start: 'bookletstart', // called when booklet starts to change pages change: 'bookletchange', // called when booklet has finished changing pages add: 'bookletadd', // called when booklet has added a page remove: 'bookletremove' // called when booklet has removed a page }, callback, ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // CLASSES ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// Page = function (contentNode, index, options) { var chapter = '', title = '', pageNode; // save chapter title if (contentNode.attr('rel')) { chapter = contentNode.attr('rel'); } // save page title if (contentNode.attr('title')) { title = contentNode.attr('title'); } //give content the correct wrapper and page wrapper if (contentNode.hasClass('b-page-empty')) { contentNode.wrap('
'); } else if (options.closed && options.covers && (index == 1 || index == options.pageTotal - 2)) { contentNode.wrap('
'); } else if (index % 2 != 0) { contentNode.wrap('
'); } else { contentNode.wrap('
'); } pageNode = contentNode.parents('.b-page').addClass('b-page-' + index); // add page numbers if ( options.pageNumbers && !contentNode.hasClass('b-page-empty') && //(options.layoutSingle && !contentNode.hasClass('b-page-blank')) && (!options.closed || (options.closed && !options.covers) || (options.closed && options.covers && index != 1 && index != options.pageTotal - 2)) ) { if (options.direction == directions.leftToRight) { startingPageNumber++; } contentNode.parent().append('
' + startingPageNumber + '
'); if (options.direction == directions.rightToLeft) { startingPageNumber--; } } return { index: index, contentNode: contentNode[0], pageNode: pageNode[0], chapter: chapter, title: title } }, ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // INITIAL FUNCTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// init = function () { // remove load wrapper for compatibility with version 1.2.0 target.find('.b-load').children().unwrap(); // setup target DOM object target.addClass('booklet'); // store data for api calls target.data('booklet', this); // save original number of pages originalPageTotal = target.children().length; options.currentIndex = 0; // generate page markup initPages(); // initialize options updateOptions(); // update after initialized updatePages(); updateControlVisibility(); updateMenu(); isInit = true; isDisabled = false; callback = { options: $.extend({}, options), index: options.currentIndex, pages: [pages[options.currentIndex].contentNode, pages[options.currentIndex + 1].contentNode] }; if (options.create) { target.off(events.create + '.booklet').on(events.create + '.booklet', options.create); } target.trigger(events.create, callback); }, enable = function () { isDisabled = false; }, disable = function () { isDisabled = true; }, destroy = function () { // destroy all booklet items destroyControls(); destroyPages(); // clear class from target DOM object target.removeClass('booklet'); // clear out booklet from data object target.removeData('booklet'); isInit = false; }, ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // PAGE FUNCTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// initPages = function () { pages = []; // fix for odd number of pages if ((target.children().length % 2) != 0) { // if book is closed and using covers, add page before back cover, else after last page if (options.closed && options.covers) { target.children().last().before(templates.blank); } else { target.children().last().after(templates.blank); } } // if closed book, add empty pages to start and end if (options.closed) { $(templates.empty).attr({ title: options.closedFrontTitle || '', rel: options.closedFrontChapter || '' }).prependTo(target); target.children().last().attr({ title: options.closedBackTitle || '', rel: options.closedBackChapter || '' }); target.append(templates.empty); } // set total page count options.pageTotal = target.children().length; startingPageNumber = 0; if (options.direction == directions.rightToLeft) { startingPageNumber = options.pageTotal; if (options.closed) { startingPageNumber -= 2; } if (options.covers) { startingPageNumber -= 2; } $(target.children().get().reverse()).each(function () { $(this).appendTo(target); }); } if (!isInit) { // set currentIndex if (options.direction == directions.leftToRight) { options.currentIndex = 0; } else if (options.direction == directions.rightToLeft) { options.currentIndex = options.pageTotal - 2; } if (!isNaN(options.startingPage) && options.startingPage <= options.pageTotal && options.startingPage > 0) { if ((options.startingPage % 2) != 0) { options.startingPage--; } options.currentIndex = options.startingPage; } } /* if(options.layoutSingle) { target.children().each(function () { if(options.direction == directions.leftToRight){ $(this).before(templates.blank); }else{ $(this).after(templates.blank); } }); } */ // load pages target.children().each(function (i) { var newPage = new Page($(this), i, options); pages.push(newPage); }); }, updatePages = function () { updatePageStructure(); updatePageCSS(); updateManualControls(); }, updatePageStructure = function () { // reset all content target.find('.b-page').removeClass('b-pN b-p0 b-p1 b-p2 b-p3 b-p4').hide(); // add page classes if (options.currentIndex - 2 >= 0) { target.find('.b-page-' + (options.currentIndex - 2)).addClass('b-pN').show(); target.find('.b-page-' + (options.currentIndex - 1)).addClass('b-p0').show(); } target.find('.b-page-' + (options.currentIndex)).addClass('b-p1').show(); target.find('.b-page-' + (options.currentIndex + 1)).addClass('b-p2').show(); if (options.currentIndex + 3 <= options.pageTotal) { target.find('.b-page-' + (options.currentIndex + 2)).addClass('b-p3').show(); target.find('.b-page-' + (options.currentIndex + 3)).addClass('b-p4').show(); } // save structure elems to vars pN = target.find('.b-pN'); p0 = target.find('.b-p0'); p1 = target.find('.b-p1'); p2 = target.find('.b-p2'); p3 = target.find('.b-p3'); p4 = target.find('.b-p4'); pNwrap = target.find('.b-pN .b-wrap'); p0wrap = target.find('.b-p0 .b-wrap'); p1wrap = target.find('.b-p1 .b-wrap'); p2wrap = target.find('.b-p2 .b-wrap'); p3wrap = target.find('.b-p3 .b-wrap'); p4wrap = target.find('.b-p4 .b-wrap'); wraps = target.find('.b-wrap'); if (options.shadows) { target.find('.b-shadow-f, .b-shadow-b').remove(); sF = $(templates.sF).css(css.sF).appendTo(p3); sB = $(templates.sB).appendTo(p0).css(css.sB); } }, updatePageCSS = function () { // update css target.find('.b-shadow-f, .b-shadow-b, .b-p0, .b-p3').css({ 'filter': '', 'zoom': '' }); target.find('.b-page').removeAttr('style'); wraps.removeAttr('style'); wraps.css(css.wrap); p0wrap.css(css.p0wrap); p1.css(css.p1); p2.css(css.p2); if (options.closed && options.autoCenter && options.currentIndex >= options.pageTotal - 2) { p2.hide(); } pN.css(css.pN); p0.css(css.p0); p3.stop().css(css.p3); p4.css(css.p4); if (options.closed && options.autoCenter && options.currentIndex == 0) { pN.css({ 'left': 0 }); p1.css({ 'left': pWidthN }); p2.css({ 'left': 0 }); p3.css({ 'left': pWidth }); p4.css({ 'left': 0 }); } if (options.closed && options.autoCenter && (options.currentIndex == 0 || options.currentIndex >= options.pageTotal - 2)) { if (options.overlays) { overlaysB.width('100%'); } target.width(pWidth); } else { if (options.overlays) { overlaysB.width('50%'); } target.width(options.width); } // ie fix target.find('.b-page').css({ 'filter': '', 'zoom': '' }); }, destroyPages = function () { // remove booklet markup target.find(".b-wrap").unwrap(); target.find(".b-wrap").children().unwrap(); target.find(".b-counter, .b-page-blank, .b-page-empty, .b-shadow-f, .b-shadow-b").remove(); // revert page order to original if (options.direction == directions.rightToLeft) { $(target.children().get().reverse()).each(function () { $(this).appendTo(target); }); } }, ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // OPTION / CONTROL FUNCTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// updateOptions = function (newOptions) { var didUpdate = false; // update options if newOptions have been passed in if (newOptions != null && typeof newOptions != "undefined") { // remove page structure, revert to original order destroyPages(); destroyControls(); options = $.extend({}, options, newOptions); didUpdate = true; initPages(); } // set width + height if (!options.width) { options.width = target.width(); } else if (typeof options.width == 'string' && options.width.indexOf("px") != -1) { options.width = options.width.replace('px', ''); } else if (typeof options.width == 'string' && options.width.indexOf("%") != -1) { wPercent = true; wOrig = options.width; options.width = (options.width.replace('%', '') / 100) * parseFloat(target.parent().css('width')); } if (!options.height) { options.height = target.height(); } else if (typeof options.height == 'string' && options.height.indexOf("px") != -1) { options.height = options.height.replace('px', ''); } else if (typeof options.height == 'string' && options.height.indexOf("%") != -1) { hPercent = true; hOrig = options.height; options.height = (options.height.replace('%', '') / 100) * parseFloat(target.parent().css('height')); } target.width(options.width); target.height(options.height); // save page sizes and other vars pWidth = options.width / 2; pWidthN = '-' + (pWidth) + 'px'; pWidthH = pWidth / 2; pHeight = options.height; speedH = options.speed / 2; // set position if (options.closed && options.autoCenter) { if (options.currentIndex == 0) { target.width(pWidth); } else if (options.currentIndex >= options.pageTotal - 2) { target.width(pWidth); } } // save shadow widths for anim if (options.shadows) { options.shadowTopFwdWidth = '-' + options.shadowTopFwdWidth + 'px'; options.shadowTopBackWidth = '-' + options.shadowTopBackWidth + 'px'; } // set total page count options.pageTotal = target.children('.b-page').length; // set booklet opts.name if (options.name) { document.title = options.name; } else { options.name = document.title; } ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // update all CSS, as sizes may have changed updateCSSandAnimations(); if (isInit) { updatePages(); } ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // MENU ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // setup menu if (options.menu && $(options.menu).length > 0) { menu = $(options.menu); if (!menu.hasClass('b-menu')) { menu.addClass('b-menu'); } // setup page selector if (options.pageSelector && menu.find('.b-selector-page').length == 0) { //add selector pageSelector = $('
' + (options.currentIndex + 1) + ' - ' + (options.currentIndex + 2) + '
').appendTo(menu); pageSelectorList = $('
    ').appendTo(pageSelector).empty().css('height', 'auto'); // loop through all pages for (i = 0; i < options.pageTotal; i += 2) { j = i; // numbers for normal view listItemNumbers = (j + 1) + '-' + (j + 2); if (options.closed) { // numbers for closed book j--; if (i == 0) { listItemNumbers = '1' } else if (i == options.pageTotal - 2) { listItemNumbers = options.pageTotal - 2 } else { listItemNumbers = (j + 1) + '-' + (j + 2); } // numbers for closed book with covers if (options.covers) { j--; if (i == 0) { listItemNumbers = '' } else if (i == options.pageTotal - 2) { listItemNumbers = '' } else { listItemNumbers = (j + 1) + '-' + (j + 2); } } } if (i == 0) { pageSelector.find('.b-current').text(listItemNumbers); } // get the title listItemTitle = pages[i].title; if (listItemTitle == '') { listItemTitle = pages[i + 1].title; } // get title for reversed direction if (options.direction == directions.rightToLeft) { listItemTitle = pages[Math.abs(i - options.pageTotal) - 1].title; if (listItemTitle == '') { listItemTitle = pages[Math.abs(i - options.pageTotal) - 2].title; } } // add the list item pageListItem = $('
  • ' + listItemTitle + '' + listItemNumbers + '
  • ').appendTo(pageSelectorList); if (!options.hash) { pageListItem.find('a').on('click.booklet', function (e) { e.preventDefault(); if (isBusy || isDisabled) return; if (options.direction == directions.rightToLeft) { pageSelector.find('.b-current').text($(this).find('.b-num').text()); goToPage(Math.abs(parseInt($(this).attr('id').replace('selector-page-', '')) - options.pageTotal) - 2); } else { goToPage(parseInt($(this).attr('id').replace('selector-page-', ''))); } }); } } // set height pageSelectorHeight = pageSelectorList.height(); pageSelectorList.css({ 'height': 0, 'padding-bottom': 0 }); // add hover effects pageSelector.on('mouseenter.booklet',function () { pageSelectorList.stop().animate({ height: pageSelectorHeight, paddingBottom: 10 }, 500); }).on('mouseleave.booklet', function () { pageSelectorList.stop().animate({ height: 0, paddingBottom: 0 }, 500); }); } else if (!options.pageSelector) { menu.find('.b-selector-page').remove(); pageSelector = pageSelectorList = listItemNumbers = listItemTitle = pageListItem = pageSelectorHeight = null; } // setup chapter selector if (options.chapterSelector && menu.find('.b-selector-chapter').length == 0) { chapter = pages[options.currentIndex].chapter; if (chapter == "") { chapter = pages[options.currentIndex + 1].chapter; } chapterSelector = $('
    ' + chapter + '
    ').appendTo(menu); chapterSelectorList = $('
      ').appendTo(chapterSelector).empty().css('height', 'auto'); for (i = 0; i < options.pageTotal; i += 1) { if (pages[i].chapter != "" && typeof pages[i].chapter != "undefined") { if (options.direction == directions.rightToLeft) { j = i; if (j % 2 != 0) { j--; } chapterSelector.find('.b-current').text(pages[i].chapter); chapterListItem = $('
    • ' + pages[i].chapter + '
    • ').prependTo(chapterSelectorList); } else { chapterListItem = $('
    • ' + pages[i].chapter + '
    • ').appendTo(chapterSelectorList); } if (!options.hash) { chapterListItem.find('a').on('click.booklet', function (e) { e.preventDefault(); var index; if (isBusy || isDisabled) return; if (options.direction == directions.rightToLeft) { chapterSelector.find('.b-current').text($(this).find('.b-text').text()); index = Math.abs(parseInt($(this).attr('id').replace('selector-page-', '')) - options.pageTotal) - 2; } else { index = parseInt($(this).attr('id').replace('selector-page-', '')); } // adjust for odd page if (index % 2 != 0) { index -= 1; } goToPage(index); }); } } } chapterSelectorHeight = chapterSelectorList.height(); chapterSelectorList.css({ 'height': 0, 'padding-bottom': 0 }); chapterSelector.on('mouseenter.booklet',function () { chapterSelectorList.stop().animate({ height: chapterSelectorHeight, paddingBottom: 10 }, 500); }).on('mouseleave.booklet', function () { chapterSelectorList.stop().animate({ height: 0, paddingBottom: 0 }, 500); }); } else if (!options.chapterSelector) { menu.find('.b-selector-chapter').remove(); chapter = chapterSelector = chapterSelectorList = chapterListItem = chapterSelectorHeight = null; } } else { menu = null; if (options.menu) { $(options.menu).removeClass('b-menu'); } target.find('.b-selector').remove(); } ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // GENERATE CONTROLS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// ctrls = target.find('.b-controls'); if (ctrls.length == 0) { ctrls = $('
      ').appendTo(target); } // force no overlays if using manual controls if (options.manual && $.ui) { options.overlays = false; } // remove old item actions and references if (customN) { customN.off('click.booklet'); customN = null; } if (customP) { customP.off('click.booklet'); customP = null; } // add overlays overlaysB = target.find('.b-overlay'); if (options.overlays && overlaysB.length == 0) { overlayP = $('
      ').appendTo(ctrls); overlayN = $('
      ').appendTo(ctrls); overlaysB = target.find('.b-overlay'); } else if (!options.overlays) { overlaysB.remove(); overlaysB = null; } // add tabs tabs = target.find('.b-tab'); if (options.tabs && tabs.length == 0) { tabP = $('
      ' + options.previousControlText + '
      ').appendTo(ctrls); tabN = $('
      ' + options.nextControlText + '
      ').appendTo(ctrls); tabs = target.find('.b-tab'); } else if (!options.tabs) { target.css({ 'marginTop': 0 }); tabs.remove(); tabs = null; } // update tab css, options might have changed if (options.tabs && tabs.length > 0) { if (options.tabWidth) { tabs.width(options.tabWidth); } if (options.tabHeight) { tabs.height(options.tabHeight); } tabs.css({ 'top': '-' + tabN.outerHeight() + 'px' }); target.css({ 'marginTop': tabN.outerHeight() }); // update control titles for RTL direction if (options.direction == directions.rightToLeft) { tabN.html(options.previousControlText).attr('title', options.previousControlTitle); tabP.html(options.nextControlText).attr('title', options.nextControlTitle); } } // add arrows arrows = target.find('.b-arrow'); if (options.arrows && arrows.length == 0) { arrowP = $('
      ' + options.previousControlText + '
      ').appendTo(ctrls); arrowN = $('
      ' + options.nextControlText + '
      ').appendTo(ctrls); arrows = target.find('.b-arrow'); // update control titles for RTL direction if (options.direction == directions.rightToLeft) { arrowN.html('
      ' + options.previousControlText + '
      ').attr('title', options.previousControlTitle); arrowP.html('
      ' + options.nextControlText + '
      ').attr('title', options.nextControlTitle); } } else if (!options.arrows) { arrows.remove(); arrows = null; } ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // ADD CONTROL ACTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // save all "b-prev" and "b-next" controls ctrlsN = ctrls.find('.b-next'); ctrlsP = ctrls.find('.b-prev'); // reset all bound events ctrlsN.off(".booklet"); ctrlsP.off(".booklet"); // add click actions ctrlsN.on('click.booklet', function (e) { e.preventDefault(); next(); }); ctrlsP.on('click.booklet', function (e) { e.preventDefault(); prev(); }); // add click action to custom controls if (options.next && $(options.next).length > 0) { customN = $(options.next); customN.on('click.booklet', function (e) { e.preventDefault(); next(); }); } if (options.prev && $(options.prev).length > 0) { customP = $(options.prev); customP.on('click.booklet', function (e) { e.preventDefault(); prev(); }); } // add page hover animations if (options.overlays && options.hovers) { // hovers to start draggable forward ctrlsN.on("mouseover.booklet",function () { startHoverAnimation(true); }).on("mouseout.booklet", function () { endHoverAnimation(true); }); // hovers to start draggable backwards ctrlsP.on("mouseover.booklet",function () { startHoverAnimation(false); }).on("mouseout.booklet", function () { endHoverAnimation(false); }); } // add arrow animations if (options.arrows) { if (options.arrowsHide) { if ($.support.opacity) { ctrlsN.on('mouseover.booklet',function () { arrowN.find('div').stop().fadeTo('fast', 1); }).on('mouseout.booklet', function () { arrowN.find('div').stop().fadeTo('fast', 0); }); ctrlsP.on('mouseover.booklet',function () { arrowP.find('div').stop().fadeTo('fast', 1); }).on('mouseout.booklet', function () { arrowP.find('div').stop().fadeTo('fast', 0); }); } else { ctrlsN.on('mouseover.booklet',function () { arrowN.find('div').show(); }).on('mouseout.booklet', function () { arrowN.find('div').hide(); }); ctrlsP.on('mouseover.booklet',function () { arrowP.find('div').show(); }).on('mouseout.booklet', function () { arrowP.find('div').hide(); }); } } else { arrowN.find('div').show(); arrowP.find('div').show(); } } //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // keyboard controls $(document).on('keyup.booklet', function (event) { if (event.keyCode == 37 && options.keyboard) { prev(); } else if (event.keyCode == 39 && options.keyboard) { next(); } }); // hash controls clearInterval(h); h = null; if (options.hash) { initHash(); clearInterval(h); h = setInterval(function () { pollHash() }, 250); } // percentage resizing $(window).on('resize.booklet', function () { if ((wPercent || hPercent)) { updatePercentageSize(); } }); // auto flip book controls if (options.auto && options.delay) { clearInterval(a); a = setInterval(function () { if (options.direction == directions.leftToRight) { next(); } else { prev(); } }, options.delay); isPlaying = true; if (options.pause && $(options.pause).length > 0) { pause = $(options.pause); pause.off('click.booklet') .on('click.booklet', function (e) { e.preventDefault(); if (isPlaying) { clearInterval(a); isPlaying = false; } }); } if (options.play && $(options.play).length > 0) { play = $(options.play); play.off('click.booklet') .on('click.booklet', function (e) { e.preventDefault(); if (!isPlaying) { clearInterval(a); a = setInterval(function () { if (options.direction == directions.leftToRight) { next(); } else { prev(); } }, options.delay); isPlaying = true; } }); } } else { clearInterval(a); a = null; if (options.pause && $(options.pause).length > 0) { $(options.pause).off('click.booklet'); } pause = null; if (options.play && $(options.play).length > 0) { $(options.play).off('click.booklet'); } play = null; isPlaying = false; } // if options were updated force pages, controls and menu to update if (didUpdate) { updatePages(); updateControlVisibility(); updateMenu(); } }, updateCSSandAnimations = function () { // init base css css = { wrap: { left: 0, width: pWidth - (options.pagePadding * 2) - (options.pageBorder * 2), height: pHeight - (options.pagePadding * 2) - (options.pageBorder * 2), padding: options.pagePadding }, p0wrap: { right: 0, left: 'auto' }, p1: { left: 0, width: pWidth, height: pHeight }, p2: { left: pWidth, width: pWidth, opacity: 1, height: pHeight }, pN: { left: 0, width: pWidth, height: pHeight }, p0: { left: 0, width: 0, height: pHeight }, p3: { left: pWidth * 2, width: 0, height: pHeight, paddingLeft: 0 }, p4: { left: pWidth, width: pWidth, height: pHeight }, sF: { right: 0, width: pWidth, height: pHeight }, sB: { left: 0, width: pWidth, height: pHeight } }; hoverShadowWidth = 10; hoverFullWidth = options.hoverWidth + hoverShadowWidth; hoverCurlWidth = (options.hoverWidth / 2) + hoverShadowWidth; // init animation params anim = { hover: { speed: options.hoverSpeed, size: options.hoverWidth, p2: { width: pWidth - hoverCurlWidth }, p3: { left: options.width - hoverFullWidth, width: hoverCurlWidth }, p3closed: { left: pWidth - options.hoverWidth, width: hoverCurlWidth }, p3wrap: { left: hoverShadowWidth }, p2end: { width: pWidth }, p2closedEnd: { width: pWidth, left: 0 }, p3end: { left: options.width, width: 0 }, p3closedEnd: { left: pWidth, width: 0 }, p3wrapEnd: { left: 10 }, p1: { left: hoverCurlWidth, width: pWidth - hoverCurlWidth }, p1wrap: { left: '-' + hoverCurlWidth + 'px' }, p0: { left: hoverCurlWidth, width: hoverCurlWidth }, p0wrap: { right: hoverShadowWidth }, p1end: { left: 0, width: pWidth }, p1wrapEnd: { left: 0 }, p0end: { left: 0, width: 0 }, p0wrapEnd: { right: 0 } }, // forward p2: { width: 0 }, p2closed: { width: 0, left: pWidth }, p4closed: { left: pWidth }, p3in: { left: pWidthH, width: pWidthH, paddingLeft: options.shadowBtmWidth }, p3inDrag: { left: pWidth / 4, width: pWidth * .75, paddingLeft: options.shadowBtmWidth }, p3out: { left: 0, width: pWidth, paddingLeft: 0 }, p3wrapIn: { left: options.shadowBtmWidth }, p3wrapOut: { left: 0 }, // backwards p1: { left: pWidth, width: 0 }, p1wrap: { left: pWidthN }, p0: { left: pWidth, width: pWidth }, p0in: { left: pWidthH, width: pWidthH }, p0out: { left: pWidth, width: pWidth }, p0outClosed: { left: 0, width: pWidth }, p2back: { left: 0 }, p0wrapDrag: { right: 0 }, p0wrapIn: { right: options.shadowBtmWidth }, p0wrapOut: { right: 0 } }; }, updatePercentageSize = function () { if (!isDisabled) { // recalculate size for percentage values, called with window is resized if (wPercent) { options.width = (wOrig.replace('%', '') / 100) * parseFloat(target.parent().css('width')); target.width(options.width); pWidth = options.width / 2; pWidthN = '-' + (pWidth) + 'px'; pWidthH = pWidth / 2; } if (hPercent) { options.height = (hOrig.replace('%', '') / 100) * parseFloat(target.parent().css('height')); target.height(options.height); pHeight = options.height; } updateCSSandAnimations(); updatePageCSS(); } }, updateControlVisibility = function () { // update controls, cursors and visibility if (options.overlays || options.tabs || options.arrows) { if ($.support.opacity) { if (options.currentIndex >= 2 && options.currentIndex != 0) { ctrlsP.fadeIn('fast').css('cursor', options.cursor); } else { ctrlsP.fadeOut('fast').css('cursor', 'default'); } if (options.currentIndex < options.pageTotal - 2) { ctrlsN.fadeIn('fast').css('cursor', options.cursor); } else { ctrlsN.fadeOut('fast').css('cursor', 'default'); } } else { if (options.currentIndex >= 2 && options.currentIndex != 0) { ctrlsP.show().css('cursor', options.cursor); } else { ctrlsP.hide().css('cursor', 'default'); } if (options.currentIndex < options.pageTotal - 2) { ctrlsN.show().css('cursor', options.cursor); } else { ctrlsN.hide().css('cursor', 'default'); } } } }, updateMenu = function () { if (options.pageSelector) { var currentPageNumbers = ''; if (options.direction == directions.rightToLeft) { currentPageNumbers = (Math.abs(options.currentIndex - options.pageTotal) - 1) + ' - ' + ((Math.abs(options.currentIndex - options.pageTotal))); if (options.closed) { if (options.currentIndex == options.pageTotal - 2) { currentPageNumbers = '1' } else if (options.currentIndex == 0) { currentPageNumbers = options.pageTotal - 2 } else { currentPageNumbers = (Math.abs(options.currentIndex - options.pageTotal) - 2) + ' - ' + ((Math.abs(options.currentIndex - options.pageTotal) - 1)); } if (options.covers) { if (options.currentIndex == options.pageTotal - 2) { currentPageNumbers = '' } else if (options.currentIndex == 0) { currentPageNumbers = '' } else { currentPageNumbers = (Math.abs(options.currentIndex - options.pageTotal) - 3) + ' - ' + ((Math.abs(options.currentIndex - options.pageTotal) - 2)); } } } } else { currentPageNumbers = (options.currentIndex + 1) + ' - ' + (options.currentIndex + 2); if (options.closed) { if (options.currentIndex == 0) { currentPageNumbers = '1' } else if (options.currentIndex == options.pageTotal - 2) { currentPageNumbers = options.pageTotal - 2 } else { currentPageNumbers = (options.currentIndex) + '-' + (options.currentIndex + 1); } if (options.covers) { if (options.currentIndex == 0) { currentPageNumbers = '' } else if (options.currentIndex == options.pageTotal - 2) { currentPageNumbers = '' } else { currentPageNumbers = (options.currentIndex - 1) + '-' + (options.currentIndex); } } } } $(options.menu + ' .b-selector-page .b-current').text(currentPageNumbers); } if (options.chapterSelector) { if (pages[options.currentIndex].chapter != "") { $(options.menu + ' .b-selector-chapter .b-current').text(pages[options.currentIndex].chapter); } else if (pages[options.currentIndex + 1].chapter != "") { $(options.menu + ' .b-selector-chapter .b-current').text(pages[options.currentIndex + 1].chapter); } if (options.direction == directions.rightToLeft && pages[options.currentIndex + 1].chapter != "") { $(options.menu + ' .b-selector-chapter .b-current').text(pages[options.currentIndex + 1].chapter); } else if (pages[options.currentIndex] != "") { $(options.menu + ' .b-selector-chapter .b-current').text(pages[options.currentIndex].chapter); } } }, updateManualControls = function () { var origX, newX, diff, fullPercent, shadowPercent, shadowW, curlW, underW, targetPercent, curlLeft, p1wrapLeft; // reset vars isHoveringRight = isHoveringLeft = p3drag = p0drag = false; if ($.ui) { // manual page turning, check if jQuery UI is loaded if (target.find('.b-page').draggable()) { target.find('.b-page').draggable('destroy').removeClass('b-grab b-grabbing'); } if (options.manual) { // implement draggable forward p3.draggable({ axis: "x", containment: [ target.offset().left, 0, p2.offset().left + pWidth - hoverFullWidth, pHeight ], drag: function (event, ui) { p3drag = true; p3.removeClass('b-grab').addClass('b-grabbing'); // calculate positions origX = ui.originalPosition.left; newX = ui.position.left; diff = origX - newX; fullPercent = diff / origX; shadowPercent = fullPercent < 0.5 ? fullPercent : (1 - fullPercent); shadowW = (shadowPercent * options.shadowBtmWidth * 2) + hoverShadowWidth; shadowW = diff / origX >= 0.5 ? shadowW -= hoverShadowWidth : shadowW; // move shadows if (options.shadows) { sF.css({'right': '-' + (options.shadowTopFwdWidth * shadowPercent * 2) + 'px'}); if ($.support.opacity) { sF.css({'opacity': shadowPercent * 2}); } else { sF.css({'right': 'auto', 'left': 0.1 * p3.width()}); } } // set top page curl width curlW = hoverCurlWidth + diff / 2; curlW = curlW > pWidth ? pWidth : curlW; // constrain max width // set bottom page width, hide underW = pWidth - curlW; // calculate positions for closed and auto-centered book if (options.closed && options.autoCenter) { if (options.currentIndex == 0) { targetPercent = 0.5 + 0.5 * fullPercent; curlW = hoverCurlWidth + (hoverCurlWidth * fullPercent) + diff; curlW = curlW > pWidth ? pWidth : curlW; underW = pWidth - curlW; p2.css({left: pWidth * fullPercent}); p4.css({left: pWidth * fullPercent}); target.width(options.width * targetPercent); } else if (options.currentIndex == options.pageTotal - 4) { targetPercent = (1 - fullPercent) + 0.5 * fullPercent; underW = pWidth - curlW; p4.hide(); target.width(options.width * targetPercent); } else { target.width(options.width); } } // set values p3.width(curlW); p3wrap.css({left: shadowW}); p2.width(underW); }, stop: function () { endHoverAnimation(false); if (fullPercent > options.hoverThreshold) { if (options.shadows && !$.support.opacity) { sF.css({'left': 'auto', opacity: 0}); } next(); p3.removeClass('b-grab b-grabbing'); } else { p3drag = false; p3.removeClass('b-grabbing').addClass('b-grab'); sF.animate({left: 'auto', opacity: 0}, anim.hover.speed, options.easing).css(css.sF); if (options.closed && options.autoCenter) { if (options.currentIndex == 0) { p2.animate({left: 0}, anim.hover.speed, options.easing); p4.animate({left: 0}, anim.hover.speed, options.easing); target.animate({width: options.width * 0.5}, anim.hover.speed, options.easing); } else { target.animate({width: options.width}, anim.hover.speed, options.easing); } } } } }); // implement draggable backwards p0.draggable({ axis: "x", //containment: 'parent', containment: [ target.offset().left + hoverCurlWidth, 0, target.offset().left + options.width, pHeight ], drag: function (event, ui) { p0drag = true; p0.removeClass('b-grab').addClass('b-grabbing'); // calculate positions origX = ui.originalPosition.left; newX = ui.position.left; diff = newX - origX; fullPercent = diff / (options.width - origX); if (options.closed && options.autoCenter && options.currentIndex == 2) { fullPercent = diff / (pWidth - origX); } if (fullPercent > 1) { fullPercent = 1; } shadowPercent = fullPercent < 0.5 ? fullPercent : (1 - fullPercent); shadowW = (shadowPercent * options.shadowBtmWidth * 2) + hoverShadowWidth; shadowW = diff / origX >= 0.5 ? shadowW -= hoverShadowWidth : shadowW; if (options.shadows) { if ($.support.opacity) { sB.css({'opacity': shadowPercent * 2}); } else { sB.css({'left': options.shadowTopBackWidth * shadowPercent * 2}); } } curlW = fullPercent * (pWidth - hoverCurlWidth) + hoverCurlWidth + shadowW; curlLeft = curlW - shadowW; p1wrapLeft = -curlLeft; // calculate positions for closed and auto-centered book if (options.closed && options.autoCenter) { if (options.currentIndex == 2) { targetPercent = (1 - fullPercent) + 0.5 * fullPercent; curlLeft = (1 - fullPercent) * curlLeft; p1wrapLeft = -curlLeft - (options.width - (options.width * targetPercent)); pN.hide(); p2.css({left: pWidth * (1 - fullPercent)}); p4.css({left: pWidth * (1 - fullPercent)}); target.width(options.width * targetPercent); } else if (options.currentIndex == options.pageTotal - 2) { targetPercent = 0.5 + 0.5 * fullPercent; target.width(options.width * targetPercent); } else { target.width(options.width); } } // set values ui.position.left = curlLeft; p0.css({width: curlW}); p0wrap.css({right: shadowW}); p1.css({left: curlLeft, width: pWidth - curlLeft}); p1wrap.css({left: p1wrapLeft}); }, stop: function () { endHoverAnimation(true); if (fullPercent > options.hoverThreshold) { prev(); p0.removeClass('b-grab b-grabbing'); } else { sB.animate({opacity: 0}, anim.hover.speed, options.easing).css(css.sB); p0drag = false; p0.removeClass('b-grabbing').addClass('b-grab'); if (options.closed && options.autoCenter) { if (options.currentIndex == 2) { p2.animate({left: pWidth}, anim.hover.speed * 2, options.easing); p4.animate({left: pWidth}, anim.hover.speed * 2, options.easing); target.animate({width: options.width}, anim.hover.speed * 2, options.easing); } else if (options.currentIndex == options.pageTotal - 2) { target.animate({width: options.width * 0.5}, anim.hover.speed, options.easing); } } } } }); target.find('.b-page').off('click.booklet'); if (options.hoverClick) { target.find('.b-pN, .b-p0').on('click.booklet', prev).css({cursor: 'pointer'}); target.find('.b-p3, .b-p4').on('click.booklet', next).css({cursor: 'pointer'}); } // mouse tracking for page movement target.off('mousemove.booklet').on('mousemove.booklet',function (e) { diff = e.pageX - target.offset().left; if (diff < anim.hover.length) { startHoverAnimation(false); } else if (diff > pWidth - anim.hover.length && options.currentIndex == 0 && options.autoCenter && options.closed) { startHoverAnimation(true); } else if (diff > anim.hover.length && diff <= options.width - anim.hover.length) { endHoverAnimation(false); endHoverAnimation(true); } else if (diff > options.width - anim.hover.length) { startHoverAnimation(true); } }).off('mouseleave.booklet').on('mouseleave.booklet', function () { endHoverAnimation(false); endHoverAnimation(true); }); } } }, initHash = function () { hash = getHashNum(); if (!isNaN(hash) && hash <= options.pageTotal - 1 && hash >= 0 && hash != '') { if ((hash % 2) != 0) { hash--; } options.currentIndex = hash; } else { updateHash(options.currentIndex + 1, options); } currentHash = hash; }, pollHash = function () { hash = getHashNum(); // check page num if (!isNaN(hash) && hash <= options.pageTotal - 1 && hash >= 0) { if (hash != options.currentIndex && hash.toString() != currentHash) { if ((hash % 2) != 0) { hash-- } document.title = options.name + options.hashTitleText + (hash + 1); if (!isBusy) { goToPage(hash); currentHash = hash; } } } }, getHashNum = function () { var hash, hashNum; // get page number from hash tag, last element hash = window.location.hash.split('/'); if (hash.length > 1) { hashNum = parseInt(hash[2]) - 1; if (options.direction == directions.rightToLeft) { hashNum = Math.abs(hashNum + 1 - options.pageTotal); } return hashNum; } else { return ''; } }, updateHash = function (hash, options) { // set the hash if (options.hash) { if (options.direction == directions.rightToLeft) { hash = Math.abs(hash - options.pageTotal); } window.location.hash = hashRoot + hash; } }, destroyControls = function () { if (options.menu) { $(options.menu).removeClass('b-menu'); if (options.pageSelector) { menu.find('.b-selector-page').remove(); pageSelector = pageSelectorList = listItemNumbers = listItemTitle = pageListItem = pageSelectorHeight = null; } if (options.chapterSelector) { menu.find('.b-selector-chapter').remove(); chapter = chapterSelector = chapterSelectorList = chapterListItem = chapterSelectorHeight = null; } } menu = null; if (customN) { customN.off('click.booklet'); customN = null; } if (customP) { customP.off('click.booklet'); customP = null; } if (ctrlsN) { ctrlsN.off(".booklet"); ctrlsN = null; } if (ctrlsP) { ctrlsP.off(".booklet"); ctrlsP = null; } target.find('.b-selector, .b-controls').remove(); // keyboard //$(document).off('keyup.booklet'); // hash clearInterval(h); h = null; // window resize //$(window).off('resize.booklet'); // auto play clearInterval(a); a = null; if (options.pause && $(options.pause).length > 0) { $(options.pause).off('click.booklet'); } pause = null; if (options.play && $(options.play).length > 0) { $(options.play).off('click.booklet'); } play = null; destroyManualControls(); }, destroyManualControls = function () { if ($.ui) { // remove old draggables if (target.find('.b-page').draggable()) { target.find('.b-page').draggable('destroy').removeClass('b-grab b-grabbing'); } } // remove mouse tracking for page movement target.off('.booklet'); }, ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // DYNAMIC FUNCTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// addPage = function (index, html) { // validate inputs if (index == "start") { index = 0; } else if (index == "end") { index = originalPageTotal; } else if (typeof index == "number") { if (index < 0 || index > originalPageTotal) { return; } } else if (typeof index == "undefined") { return; } if (typeof html == "undefined" || html == '') { return; } // remove page structure, revert to original order destroyPages(); destroyControls(); // add new page if (options.closed && options.covers && index == originalPageTotal) { //end of closed-covers book target.children(':eq(' + (index - 1) + ')').before(html); } else if (options.closed && options.covers && index == 0) { //start of closed-covers book target.children(':eq(' + index + ')').after(html); } else if (index == originalPageTotal) { //end of book target.children(':eq(' + (index - 1) + ')').after(html); } else { target.children(':eq(' + index + ')').before(html); } originalPageTotal = target.children().length; // callback for adding page, returns options, index and the page node callback = { options: $.extend({}, options), index: index, page: target.children(':eq(' + index + ')')[0] }; if (options.add) { target.off(events.add + '.booklet').on(events.add + '.booklet', options.add); } target.trigger(events.add, callback); // recall initialize functions initPages(); updateOptions(); updatePages(); updateControlVisibility(); updateMenu(); }, removePage = function (index) { // validate inputs if (index == "start") { index = 0; } else if (index == "end") { index = originalPageTotal; } else if (typeof index == "number") { if (index < 0 || index > originalPageTotal) { return; } } else if (typeof index == "undefined") { return; } // stop if removing last remaining page if (target.children('.b-page').length == 2 && target.find('.b-page-blank').length > 0) { return; } // remove page structure, revert to original order destroyPages(); destroyControls(); if (index >= options.currentIndex) { if (index > 0 && (index % 2) != 0) { options.currentIndex -= 2; } if (options.currentIndex < 0) { options.currentIndex = 0; } } var removedPage; // remove page if (options.closed && options.covers && index == originalPageTotal) { // end of closed-covers book removedPage = target.children(':eq(' + (index - 1) + ')').remove(); } else if (options.closed && options.covers && index == 0) { // start of closed-covers book removedPage = target.children(':eq(' + index + ')').remove(); } else if (index == originalPageTotal) { // end of book removedPage = target.children(':eq(' + (index - 1) + ')').remove(); } else { removedPage = target.children(':eq(' + index + ')').remove(); } originalPageTotal = target.children().length; // callback for removing page, returns options, index and the page node callback = { options: $.extend({}, options), index: index, page: removedPage[0] }; if (options.remove) { target.off(events.remove + '.booklet').on(events.remove + '.booklet', options.remove); } target.trigger(events.remove, callback); removedPage = null; // recall initialize functions initPages(); updatePages(); updateOptions(); updateControlVisibility(); updateMenu(); }, ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // ANIMATION FUNCTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// next = function () { if (!isBusy && !isDisabled) { if (isPlaying && options.currentIndex + 2 >= options.pageTotal) { goToPage(0); } else { goToPage(options.currentIndex + 2); } } }, prev = function () { if (!isBusy && !isDisabled) { if (isPlaying && options.currentIndex - 2 < 0) { goToPage(options.pageTotal - 2); } else { goToPage(options.currentIndex - 2); } } }, goToPage = function (newIndex) { var speed; if (newIndex < options.pageTotal && newIndex >= 0 && !isBusy && !isDisabled) { // moving forward (increasing number) if (newIndex > options.currentIndex) { isBusy = true; diff = newIndex - options.currentIndex; options.currentIndex = newIndex; options.movingForward = true; // callback when starting booklet animation callback = { options: $.extend({}, options), index: newIndex, pages: [pages[newIndex].contentNode, pages[newIndex + 1].contentNode] }; if (options.start) { target.off(events.start + '.booklet').on(events.start + '.booklet', options.start); } target.trigger(events.start, callback); updateMenu(); if (newIndex == options.pageTotal - 2) updateControlVisibility(); updateHash(options.currentIndex + 1, options); // set animation speed, depending if user dragged any distance or not speed = p3drag === true ? options.speed * (p3.width() / pWidth) : speedH; startPageAnimation(diff, true, sF, speed); // hide p2 as p3 moves across it if (options.closed && options.autoCenter && newIndex - diff == 0) { p2.stop().animate(anim.p2closed, p3drag === true ? speed : speed * 2, options.easing); p4.stop().animate(anim.p4closed, p3drag === true ? speed : speed * 2, options.easing); } else { p2.stop().animate(anim.p2, speed, p3drag === true ? options.easeOut : options.easeIn); } // if animating after a manual drag, calculate new speed and animate out if (p3drag) { p3.animate(anim.p3out, speed, options.easeOut); p3wrap.animate(anim.p3wrapOut, speed, options.easeOut, function () { updateAfter() }); } else { p3.stop().animate(anim.p3in, speed, options.easeIn) .animate(anim.p3out, speed, options.easeOut); p3wrap.animate(anim.p3wrapIn, speed, options.easeIn) .animate(anim.p3wrapOut, speed, options.easeOut, function () { updateAfter() }); } // moving backward (decreasing number) } else if (newIndex < options.currentIndex) { isBusy = true; diff = options.currentIndex - newIndex; options.currentIndex = newIndex; options.movingForward = false; // callback when starting booklet animation callback = { options: $.extend({}, options), index: newIndex, pages: [pages[newIndex].contentNode, pages[newIndex + 1].contentNode] }; if (options.start) { target.off(events.start + '.booklet').on(events.start + '.booklet', options.start); } target.trigger(events.start, callback); updateMenu(); if (newIndex == 0) updateControlVisibility(); updateHash(options.currentIndex + 1, options); // set animation speed, depending if user dragged any distance or not speed = p0drag === true ? options.speed * (p0.width() / pWidth) : speedH; startPageAnimation(diff, false, sB, speed); if (p0drag) { // hide p1 as p0 moves across it p1.animate(anim.p1, speed, options.easeOut); p1wrap.animate(anim.p1wrap, speed, options.easeOut); if (options.closed && options.autoCenter && options.currentIndex == 0) { p0.animate(anim.p0outClosed, speed, options.easeOut); p2.stop().animate(anim.p2back, speed, options.easeOut); } else { p0.animate(anim.p0, speed, options.easeOut); } p0wrap.animate(anim.p0wrapDrag, speed, options.easeOut, function () { updateAfter() }); } else { // hide p1 as p0 moves across it p1.animate(anim.p1, speed * 2, options.easing); p1wrap.animate(anim.p1wrap, speed * 2, options.easing); if (options.closed && options.autoCenter && options.currentIndex == 0) { p0.animate(anim.p0in, speed, options.easeIn) .animate(anim.p0outClosed, speed, options.easeOut); p2.stop().animate(anim.p2back, speed * 2, options.easing); } else { p0.animate(anim.p0in, speed, options.easeIn) .animate(anim.p0out, speed, options.easeOut); } p0wrap.animate(anim.p0wrapIn, speed, options.easeIn) .animate(anim.p0wrapOut, speed, options.easeOut, function () { updateAfter() }); } } } }, startHoverAnimation = function (inc) { if (!isDisabled && ((options.hovers && options.overlays) || options.manual)) { if (inc) { if (!isBusy && !isHoveringRight && !isHoveringLeft && !p3drag && options.currentIndex + 2 <= options.pageTotal - 2) { // animate p2.stop().animate(anim.hover.p2, anim.hover.speed, options.easing); p3.addClass('b-grab'); if (options.closed && options.autoCenter && options.currentIndex == 0) { p3.stop().animate(anim.hover.p3closed, anim.hover.speed, options.easing); } else { p3.stop().animate(anim.hover.p3, anim.hover.speed, options.easing); } p3wrap.stop().animate(anim.hover.p3wrap, anim.hover.speed, options.easing); if (options.shadows && !$.support.opacity) { sF.css({ 'right': 'auto', 'left': '-40%' }); } isHoveringRight = true; } } else { if (!isBusy && !isHoveringLeft && !isHoveringRight && !p0drag && options.currentIndex - 2 >= 0) { // animate p1.stop().animate(anim.hover.p1, anim.hover.speed, options.easing); p0.addClass('b-grab'); p1wrap.stop().animate(anim.hover.p1wrap, anim.hover.speed, options.easing); p0.stop().animate(anim.hover.p0, anim.hover.speed, options.easing); p0wrap.stop().animate(anim.hover.p0wrap, anim.hover.speed, options.easing); if (options.shadows && !$.support.opacity) { sB.css({ 'left': -0.38 * pWidth }); } isHoveringLeft = true; } } } }, endHoverAnimation = function (inc) { if (!isDisabled && ((options.hovers && options.overlays) || options.manual)) { if (inc) { if (!isBusy && isHoveringRight && !p3drag && options.currentIndex + 2 <= options.pageTotal - 2) { if (options.closed && options.autoCenter && options.currentIndex == 0) { p2.stop().animate(anim.hover.p2closedEnd, anim.hover.speed, options.easing); p3.stop().animate(anim.hover.p3closedEnd, anim.hover.speed, options.easing); } else { p2.stop().animate(anim.hover.p2end, anim.hover.speed, options.easing); p3.stop().animate(anim.hover.p3end, anim.hover.speed, options.easing); } p3wrap.stop().animate(anim.hover.p3wrapEnd, anim.hover.speed, options.easing); if (options.shadows && !$.support.opacity) { sF.css({ 'left': 'auto' }); } isHoveringRight = false; } } else { if (!isBusy && isHoveringLeft && !p0drag && options.currentIndex - 2 >= 0) { p1.stop().animate(anim.hover.p1end, anim.hover.speed, options.easing); p1wrap.stop().animate(anim.hover.p1wrapEnd, anim.hover.speed, options.easing); p0.stop().animate(anim.hover.p0end, anim.hover.speed, options.easing); p0wrap.stop().animate(anim.hover.p0wrapEnd, anim.hover.speed, options.easing); isHoveringLeft = false; } } } }, startPageAnimation = function (diff, inc, shadow, speed) { // setup content if (inc && diff > 2) { // initialize next 2 pages, if jumping forward in the book target.find('.b-p3, .b-p4').removeClass('b-p3 b-p4').hide(); target.find('.b-page-' + options.currentIndex).addClass('b-p3').show().stop().css(css.p3); target.find('.b-page-' + (options.currentIndex + 1)).addClass('b-p4').show().css(css.p4); target.find('.b-page-' + options.currentIndex + ' .b-wrap').show().css(css.wrap); target.find('.b-page-' + (options.currentIndex + 1) + ' .b-wrap').show().css(css.wrap); p3 = target.find('.b-p3'); p4 = target.find('.b-p4'); p3wrap = target.find('.b-p3 .b-wrap'); p4wrap = target.find('.b-p4 .b-wrap'); if (options.closed && options.autoCenter && options.currentIndex - diff == 0) { p3.css({ 'left': pWidth }); p4.css({ 'left': 0 }); } if (isHoveringRight) { p3.css({ 'left': options.width - 40, 'width': 20, 'padding-left': 10 }); } if (options.shadows) { target.find('.b-shadow-f').remove(); sF = $(templates.sF).css(css.sF).appendTo(p3); shadow = sF; } } else if (!inc && diff > 2) { // initialize previous 2 pages, if jumping backwards in the book target.find('.b-pN, .b-p0').removeClass('b-pN b-p0').hide(); target.find('.b-page-' + options.currentIndex).addClass('b-pN').show().css(css.pN); target.find('.b-page-' + (options.currentIndex + 1)).addClass('b-p0').show().css(css.p0); target.find('.b-page-' + options.currentIndex + ' .b-wrap').show().css(css.wrap); target.find('.b-page-' + (options.currentIndex + 1) + ' .b-wrap').show().css(css.wrap); pN = target.find('.b-pN'); p0 = target.find('.b-p0'); pNwrap = target.find('.b-pN .b-wrap'); p0wrap = target.find('.b-p0 .b-wrap'); if (options.closed && options.autoCenter) { pN.css({ 'left': 0 }); } p0wrap.css(css.p0wrap); if (isHoveringLeft) { p0.css({ left: 10, width: 40 }); p0wrap.css({ right: 10 }); } if (options.shadows) { target.find('.b-shadow-b, .b-shadow-f').remove(); sB = $(templates.sB).appendTo(p0).css(css.sB); shadow = sB; } } // update page visibility // if moving to start and end of book if (options.closed) { if (!inc && options.currentIndex == 0) { pN.hide(); } else if (!inc) { pN.show(); } if (inc && options.currentIndex >= options.pageTotal - 2) { p4.hide(); } else if (inc) { p4.show(); } } // init shadows if (options.shadows) { // check for opacity support -> animate shadow overlay on moving slide if ($.support.opacity) { if (!p3drag && !p0drag) { shadow.animate({ opacity: 1 }, speed, options.easeIn); } shadow.animate({ opacity: 0 }, speed, options.easeOut); } else { if (inc) { shadow.animate({ right: options.shadowTopFwdWidth }, speed * 2, options.easeIn); } else { shadow.animate({ left: options.shadowTopBackWidth }, speed * 2, options.easeIn); } } } // init position animation if (options.closed && options.autoCenter) { if (options.currentIndex == 0) { p3.hide(); p4.hide(); target.animate({ width: pWidth }, !p3drag && !p0drag ? speed * 2 : speed, options.easing); } else if (options.currentIndex >= options.pageTotal - 2) { p0.hide(); pN.hide(); target.animate({ width: pWidth }, speed * 2, options.easing); } else { target.animate({ width: options.width }, speed * 2, options.easing); } } }, updateAfter = function () { updatePages(); updateMenu(); updateControlVisibility(); isBusy = false; // callback when ending booklet animation callback = { options: $.extend({}, options), index: options.currentIndex, pages: [pages[options.currentIndex].contentNode, pages[options.currentIndex + 1].contentNode] }; if (options.change) { target.off(events.change + '.booklet').on(events.change + '.booklet', options.change); } target.trigger(events.change, callback); }; ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // PUBLIC FUNCTIONS ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// return { init: init, enable: enable, disable: disable, destroy: destroy, next: next, prev: prev, gotopage: function (index) { // validate inputs if (typeof index === 'string') { if (index == "start") { index = 0; } else if (index == "end") { index = options.pageTotal - 2; } else { this.gotopage(parseInt(index)); } } else if (typeof index === "number") { if (index < 0 || index >= options.pageTotal) { return; } } else if (typeof index === "undefined") { return; } // adjust for odd page if (index % 2 != 0) { index -= 1; } // adjust for booklet direction if (options.direction == directions.rightToLeft) { index = Math.abs(index - options.pageTotal) - 2; } goToPage(index); }, add: addPage, remove: removePage, option: function (name, value) { if (typeof name === 'string') { // if option exists if (typeof options[name] !== 'undefined') { if (typeof value !== 'undefined') { // if value is sent in, set the option value and update options options[name] = value; updateOptions(); } else { // if no value sent in, get the current option value return options[name]; } } else { $.error('Option "' + name + '" does not exist on jQuery.booklet.'); } } else if (typeof name === 'object') { // if sending in an object, update options updateOptions(name); } else if (typeof name === 'undefined' || !name) { // return a copy of the options object, to avoid changes return $.extend({}, options); } } } } // define default options $.fn.booklet.defaults = { name: null, // name of the booklet to display in the document title bar width: 600, // container width height: 400, // container height speed: 1000, // speed of the transition between pages direction: 'LTR', // direction of the overall content organization, default LTR, left to right, can be RTL for languages which read right to left startingPage: 0, // index of the first page to be displayed easing: 'easeInOutQuad', // easing method for complete transition easeIn: 'easeInQuad', // easing method for first half of transition easeOut: 'easeOutQuad', // easing method for second half of transition closed: false, // start with the book "closed", will add empty pages to beginning and end of book closedFrontTitle: 'Beginning', // used with "closed", "menu" and "pageSelector", determines title of blank starting page closedFrontChapter: 'Beginning of Book', // used with "closed", "menu" and "chapterSelector", determines chapter name of blank starting page closedBackTitle: 'End', // used with "closed", "menu" and "pageSelector", determines chapter name of blank ending page closedBackChapter: 'End of Book', // used with "closed", "menu" and "chapterSelector", determines chapter name of blank ending page covers: false, // used with "closed", makes first and last pages into covers, without page numbers (if enabled) autoCenter: false, // used with "closed", makes book position in center of container when closed pagePadding: 10, // padding for each page wrapper pageNumbers: true, // display page numbers on each page pageBorder: 0, // size of the border around each page manual: true, // enables manual page turning, requires jQuery UI to function hovers: true, // enables preview page-turn hover animation, shows a small preview of previous or next page on hover hoverWidth: 50, // default width for page-turn hover preview hoverSpeed: 500, // default speed for page-turn hover preview hoverThreshold: 0.25, // default percentage used for manual page dragging, sets the percentage amount a drag must be before moving next or prev hoverClick: true, // enables hovered arreas to be clicked when using manual page turning overlays: false, // enables navigation using a page sized overlay, when enabled links inside the content will not be clickable tabs: false, // adds tabs along the top of the pages tabWidth: 60, // set the width of the tabs tabHeight: 20, // set the height of the tabs nextControlText: 'Next', // inline text for all 'next' controls previousControlText: 'Previous', // inline text for all 'previous' controls nextControlTitle: 'Next Page', // text for title attributes of all 'next' controls previousControlTitle: 'Previous Page', // text for title attributes of all 'previous' controls arrows: false, // adds arrow overlays over the book edges arrowsHide: false, // auto hides arrows when controls are not hovered cursor: 'pointer', // cursor css setting for side bar areas hash: false, // enables navigation using a hash string, ex: #/page/1 for page 1, will affect all booklets with 'hash' enabled hashTitleText: " - Page ", // text which forms the hash page title, ex: (Name)" - Page "(1) keyboard: true, // enables navigation with arrow keys (left: previous, right: next) next: null, // selector for element to use as click trigger for next page prev: null, // selector for element to use as click trigger for previous page auto: false, // enables automatic navigation, requires "delay" delay: 5000, // amount of time between automatic page flipping pause: null, // selector for element to use as click trigger for pausing auto page flipping play: null, // selector for element to use as click trigger for restarting auto page flipping menu: null, // selector for element to use as the menu area, required for 'pageSelector' pageSelector: false, // enables navigation with a drop-down menu of pages, requires 'menu' chapterSelector: false, // enables navigation with a drop-down menu of chapters, determined by the "rel" attribute, requires 'menu' shadows: true, // display shadows on page animations shadowTopFwdWidth: 166, // shadow width for top forward animation shadowTopBackWidth: 166, // shadow width for top back animation shadowBtmWidth: 50, // shadow width for bottom shadow create: null, // called when booklet has been created start: null, // called when booklet starts to change pages change: null, // called when booklet has finished changing pages add: null, // called when booklet has added a page remove: null // called when booklet has removed a page } })(jQuery); //galeriaa !function($){function uncamel(e){return e.replace(/([A-Z])/g,function(e){return"-"+e.toLowerCase()})}function setUnit(e,t){return"string"!=typeof e||e.match(/^[\-0-9\.]+$/)?""+e+t:e}function setFilter(e,t,i){var n=uncamel(t),r=jQuery.browser.mozilla?"":$.CSS.sfx;e[r+"filter"]=e[r+"filter"]||"",i=setUnit(i>$.CSS.filters[t].max?$.CSS.filters[t].max:i,$.CSS.filters[t].unit),e[r+"filter"]+=n+"("+i+") ",delete e[t]}eval(function(e,t,i,n,r,a){if(r=function(e){return e},!"".replace(/^/,String)){for(;i--;)a[i]=n[i]||i;n=[function(e){return a[e]}],r=function(){return"\\w+"},i=1}for(;i--;)n[i]&&(e=e.replace(new RegExp("\\b"+r(i)+"\\b","g"),n[i]));return e}('29 11=17.53;24(!2.9){2.9={};2.9.34=!1;2.9.22=!1;2.9.45=!1;2.9.42=!1;2.9.40=!1;2.9.28=!1;2.9.56=11;2.9.16=17.51;2.9.13=""+47(17.23);2.9.18=26(17.23,10);29 32,12,20;24(-1!=(12=11.15("33")))2.9.45=!0,2.9.16="33",2.9.13=11.14(12+6),-1!=(12=11.15("25"))&&(2.9.13=11.14(12+8));27 24(-1!=(12=11.15("58")))2.9.28=!0,2.9.16="36 38 39",2.9.13=11.14(12+5);27 24(-1!=11.15("57")){2.9.28=!0;2.9.16="36 38 39";29 30=11.15("59:")+3,43=30+4;2.9.13=11.14(30,43)}27-1!=(12=11.15("41"))?(2.9.22=!0,2.9.40=!0,2.9.16="41",2.9.13=11.14(12+7)):-1!=(12=11.15("31"))?(2.9.22=!0,2.9.42=!0,2.9.16="31",2.9.13=11.14(12+7),-1!=(12=11.15("25"))&&(2.9.13=11.14(12+8))):-1!=(12=11.15("68"))?(2.9.22=!0,2.9.16="31",2.9.13=11.14(12+7),-1!=(12=11.15("25"))&&(2.9.13=11.14(12+8))):-1!=(12=11.15("35"))?(2.9.34=!0,2.9.16="35",2.9.13=11.14(12+8)):(32=11.37(" ")+1)<(12=11.37("/"))&&(2.9.16=11.14(32,12),2.9.13=11.14(12+1),2.9.16.63()==2.9.16.64()&&(2.9.16=17.51));-1!=(20=2.9.13.15(";"))&&(2.9.13=2.9.13.14(0,20));-1!=(20=2.9.13.15(" "))&&(2.9.13=2.9.13.14(0,20));2.9.18=26(""+2.9.13,10);67(2.9.18)&&(2.9.13=""+47(17.23),2.9.18=26(17.23,10));2.9.69=2.9.18}2.9.46=/65/19.21(11);2.9.49=/66/19.21(11);2.9.48=/60|61|55/19.21(11);2.9.50=/33 52/19.21(11);2.9.44=/54/19.21(11);2.9.62=2.9.46||2.9.49||2.9.48||2.9.44||2.9.50;',0,70,"||jQuery|||||||browser||nAgt|verOffset|fullVersion|substring|indexOf|name|navigator|majorVersion|i|ix|test|webkit|appVersion|if|Version|parseInt|else|msie|var|start|Safari|nameOffset|Opera|mozilla|Firefox|Microsoft|lastIndexOf|Internet|Explorer|chrome|Chrome|safari|end|windowsMobile|opera|android|parseFloat|ios|blackberry|operaMobile|appName|Mini|userAgent|IEMobile|iPod|ua|Trident|MSIE|rv|iPhone|iPad|mobile|toLowerCase|toUpperCase|Android|BlackBerry|isNaN|AppleWebkit|version".split("|"),0,{})),jQuery.support.CSStransition=function(){var e=(document.body||document.documentElement).style;return void 0!==e.transition||void 0!==e.WebkitTransition||void 0!==e.MozTransition||void 0!==e.MsTransition||void 0!==e.OTransition}(),$.CSS={name:"mb.CSSAnimate",author:"Matteo Bicocchi",version:"2.0.0",transitionEnd:"transitionEnd",sfx:"",filters:{blur:{min:0,max:100,unit:"px"},brightness:{min:0,max:400,unit:"%"},contrast:{min:0,max:400,unit:"%"},grayscale:{min:0,max:100,unit:"%"},hueRotate:{min:0,max:360,unit:"deg"},invert:{min:0,max:100,unit:"%"},saturate:{min:0,max:400,unit:"%"},sepia:{min:0,max:100,unit:"%"}},normalizeCss:function(e){var t=jQuery.extend(!0,{},e);jQuery.browser.webkit||jQuery.browser.opera?$.CSS.sfx="-webkit-":jQuery.browser.mozilla?$.CSS.sfx="-moz-":jQuery.browser.msie&&($.CSS.sfx="-ms-");for(var i in t){"transform"===i&&(t[$.CSS.sfx+"transform"]=t[i],delete t[i]),"transform-origin"===i&&(t[$.CSS.sfx+"transform-origin"]=e[i],delete t[i]),"filter"!==i||jQuery.browser.mozilla||(t[$.CSS.sfx+"filter"]=e[i],delete t[i]),"blur"===i&&setFilter(t,"blur",e[i]),"brightness"===i&&setFilter(t,"brightness",e[i]),"contrast"===i&&setFilter(t,"contrast",e[i]),"grayscale"===i&&setFilter(t,"grayscale",e[i]),"hueRotate"===i&&setFilter(t,"hueRotate",e[i]),"invert"===i&&setFilter(t,"invert",e[i]),"saturate"===i&&setFilter(t,"saturate",e[i]),"sepia"===i&&setFilter(t,"sepia",e[i]);var n="";"x"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" translateX("+setUnit(e[i],"px")+")",delete t[i]),"y"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" translateY("+setUnit(e[i],"px")+")",delete t[i]),"z"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" translateZ("+setUnit(e[i],"px")+")",delete t[i]),"rotate"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" rotate("+setUnit(e[i],"deg")+")",delete t[i]),"rotateX"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" rotateX("+setUnit(e[i],"deg")+")",delete t[i]),"rotateY"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" rotateY("+setUnit(e[i],"deg")+")",delete t[i]),"rotateZ"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" rotateZ("+setUnit(e[i],"deg")+")",delete t[i]),"scale"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" scale("+setUnit(e[i],"")+")",delete t[i]),"scaleX"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" scaleX("+setUnit(e[i],"")+")",delete t[i]),"scaleY"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" scaleY("+setUnit(e[i],"")+")",delete t[i]),"scaleZ"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" scaleZ("+setUnit(e[i],"")+")",delete t[i]),"skew"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" skew("+setUnit(e[i],"deg")+")",delete t[i]),"skewX"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" skewX("+setUnit(e[i],"deg")+")",delete t[i]),"skewY"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" skewY("+setUnit(e[i],"deg")+")",delete t[i]),"perspective"===i&&(t[n=$.CSS.sfx+"transform"]=t[n]||"",t[n]+=" perspective("+setUnit(e[i],"px")+")",delete t[i])}return t},getProp:function(e){var t=[];for(var i in e)t.indexOf(i)<0&&t.push(uncamel(i));return t.join(",")},animate:function(e,t,i,n,r){return this.each(function(){function a(){o.called=!0,o.CSSAIsRunning=!1,s.off($.CSS.transitionEnd+"."+o.id),clearTimeout(o.timeout),s.css($.CSS.sfx+"transition",""),"function"==typeof r&&r.apply(o),"function"==typeof o.CSSqueue&&(o.CSSqueue(),o.CSSqueue=null)}var o=this,s=jQuery(this);o.id=o.id||"CSSA_"+(new Date).getTime();var l=l||{type:"noEvent"};if(o.CSSAIsRunning&&o.eventType==l.type&&!jQuery.browser.msie&&jQuery.browser.version<=9)o.CSSqueue=function(){s.CSSAnimate(e,t,i,n,r)};else if(o.CSSqueue=null,o.eventType=l.type,0!==s.length&&e){if(e=$.normalizeCss(e),o.CSSAIsRunning=!0,"function"==typeof t&&(r=t,t=jQuery.fx.speeds._default),"function"==typeof i&&(n=i,i=0),"string"==typeof i&&(r=i,i=0),"function"==typeof n&&(r=n,n="cubic-bezier(0.65,0.03,0.36,0.72)"),"string"==typeof t)for(var u in jQuery.fx.speeds){if(t==u){t=jQuery.fx.speeds[u];break}t=jQuery.fx.speeds._default}if(t||(t=jQuery.fx.speeds._default),"string"==typeof r&&(n=r,r=null),jQuery.support.CSStransition){var c={default:"ease",in:"ease-in",out:"ease-out","in-out":"ease-in-out",snap:"cubic-bezier(0,1,.5,1)",easeOutCubic:"cubic-bezier(.215,.61,.355,1)",easeInOutCubic:"cubic-bezier(.645,.045,.355,1)",easeInCirc:"cubic-bezier(.6,.04,.98,.335)",easeOutCirc:"cubic-bezier(.075,.82,.165,1)",easeInOutCirc:"cubic-bezier(.785,.135,.15,.86)",easeInExpo:"cubic-bezier(.95,.05,.795,.035)",easeOutExpo:"cubic-bezier(.19,1,.22,1)",easeInOutExpo:"cubic-bezier(1,0,0,1)",easeInQuad:"cubic-bezier(.55,.085,.68,.53)",easeOutQuad:"cubic-bezier(.25,.46,.45,.94)",easeInOutQuad:"cubic-bezier(.455,.03,.515,.955)",easeInQuart:"cubic-bezier(.895,.03,.685,.22)",easeOutQuart:"cubic-bezier(.165,.84,.44,1)",easeInOutQuart:"cubic-bezier(.77,0,.175,1)",easeInQuint:"cubic-bezier(.755,.05,.855,.06)",easeOutQuint:"cubic-bezier(.23,1,.32,1)",easeInOutQuint:"cubic-bezier(.86,0,.07,1)",easeInSine:"cubic-bezier(.47,0,.745,.715)",easeOutSine:"cubic-bezier(.39,.575,.565,1)",easeInOutSine:"cubic-bezier(.445,.05,.55,.95)",easeInBack:"cubic-bezier(.6,-.28,.735,.045)",easeOutBack:"cubic-bezier(.175, .885,.32,1.275)",easeInOutBack:"cubic-bezier(.68,-.55,.265,1.55)"};c[n]&&(n=c[n]),s.off($.CSS.transitionEnd+"."+o.id);var d=$.CSS.getProp(e),f={};$.extend(f,e),f[$.CSS.sfx+"transition-property"]=d,f[$.CSS.sfx+"transition-duration"]=t+"ms",f[$.CSS.sfx+"transition-delay"]=i+"ms",f[$.CSS.sfx+"transition-timing-function"]=n,setTimeout(function(){s.one($.CSS.transitionEnd+"."+o.id,a),s.css(f)},1),o.timeout=setTimeout(function(){if(o.called||!r)return o.called=!1,void(o.CSSAIsRunning=!1);s.css($.CSS.sfx+"transition",""),r.apply(o),o.CSSAIsRunning=!1,"function"==typeof o.CSSqueue&&(o.CSSqueue(),o.CSSqueue=null)},t+i+10)}else{for(var p in e){if("transform"===p&&delete e[p],"filter"===p&&delete e[p],"transform-origin"===p&&delete e[p],"auto"===e[p]&&delete e[p],"x"===p){y=e[p];e[m="left"]=y,delete e[p]}if("y"===p){var y=e[p],m="top";e[m]=y,delete e[p]}"-ms-transform"!==p&&"-ms-filter"!==p||delete e[p]}s.delay(i).animate(e,t,r)}}})}},$.fn.CSSAnimate=$.CSS.animate,$.normalizeCss=$.CSS.normalizeCss,$.fn.css3=function(e){return this.each(function(){var t=$(this),i=$.normalizeCss(e);t.css(i)})}}(jQuery),function(e){jQuery.thumbGrid={name:"jquery.mb.thumbGrid",version:"1.0",author:"Matteo Bicocchi",defaults:{nav_effect:"slideLeft",nav_delay:60,nav_timing:800,nav_pagination:6,gallery_effectnext:"slideRight",gallery_effectprev:"slideLeft",gallery_timing:500,gallery_cover:!0,gallery_fullscreenw:"100%",gallery_fullscreenh:"100%"},transitions:{fade:{in:{opacity:0},out:{opacity:0}},slideUp:{in:{opacity:0},out:{y:-200,opacity:0}},slideDown:{in:{opacity:0},out:{y:200,opacity:0}},slideLeft:{in:{opacity:0},out:{x:-200,opacity:0}},slideRight:{in:{opacity:0},out:{x:200,opacity:0}},slideInverse:{in:{y:200,opacity:0},out:{y:200,opacity:0}},zoomIn:{in:{scale:.5,opacity:0},out:{scale:2,opacity:0}},zoomOut:{in:{scale:2,opacity:0},out:{scale:.1,opacity:0}},rotate:{in:{opacity:0},out:{rotate:179,opacity:0}}},init:function(e){var t={};return jQuery.extend(t,jQuery.thumbGrid.defaults,e),this.each(function(){var e=this,i=jQuery(e);i.addClass("tg-container"),i.hide(),e.isAnimating=!1,e.pageIndex=0,e.nav_effect=i.data("nav_effect")||t.nav_effect,e.nav_delay=i.data("nav_delay")||t.nav_delay,e.nav_timing=i.data("nav_timing")||t.nav_timing,e.nav_pagination=i.data("nav_pagination")||t.nav_pagination,e.gallery_fullscreenw=i.data("gallery_fullscreenw")||t.gallery_fullscreenw,e.gallery_fullscreenh=i.data("gallery_fullscreenh")||t.gallery_fullscreenh,e.gallery_cover=i.data("gallery_cover")||t.gallery_cover,e.gallery_effectnext=i.data("gallery_effectnext")||e.nav_effect,e.gallery_effectprev=i.data("gallery_effectprev")||e.nav_effect,e.gallery_timing=i.data("gallery_timing")||e.nav_effect,jQuery.extend(t,i.data()),e.opt=t,e.elements=i.children().clone(),i.children().hide(),e.elements.each(function(e){jQuery(this).attr("data-globalindex",e)}),e.pages=[],e.totPages=Math.ceil(e.elements.length/e.nav_pagination);for(var n=0,r=0;r").addClass("thumb-grid"),l=0;l").addClass("thumbWrapper").append(u);if(c.data("idx",l),c.on("click",function(){var t=e("img",this).data("globalindex");jQuery.thumbGrid.drawSlideShow(r,t)}),n){c.css({opacity:0});var d=jQuery.normalizeCss(jQuery.thumbGrid.transitions[r.nav_effect].in);c.css(d)}else{var f=jQuery.normalizeCss({top:0,left:0,opacity:1,x:0,y:0,scale:1,rotate:0,skew:0,filter:" blur(0)"});c.css(f).show()}s.append(c),s.addClass("active")}n&&s.addClass("in"),a.find(".thumb-grid").addClass("out").removeClass("in"),a.prepend(s),setTimeout(function(){for(var t={top:0,left:0,opacity:1,x:0,y:0,scale:1,rotate:0,skew:0,filter:" blur(0)"},i=r.nav_delay,o=0;o").addClass("thumbGridNav");if(!(t.totPages<=1)){for(var r=1;r<=t.totPages;r++){var a=jQuery("").html(r).attr({idx:r-1});a.addClass("indexEl"),a.on("click",function(){t.isAnimating||t.pageIndex==jQuery(this).attr("idx")||(t.pageIndex=jQuery(this).attr("idx"),jQuery.thumbGrid.drawPage(t,t.pageIndex),jQuery(".indexEl",n).removeClass("sel"),jQuery(".indexEl",n).eq(t.pageIndex).addClass("sel"))}),n.append(a),jQuery(".indexEl",n).eq(t.pageIndex).addClass("sel")}n.hide(),t.nav=n,i.after(n)}},drawSlideShow:function(t,i){jQuery("body").trigger("drawSlideShow"),jQuery("body").css({overflow:"hidden"});var n=t,r=jQuery(n),a=jQuery("
      ").addClass("tg-overlay").css({opacity:0}),o=jQuery("
      ").addClass("tg-placeHolder"),s=jQuery("
      ").addClass("tg-close tg-icon").on("click",function(){jQuery.thumbGrid.closeSlideShow(t,i)}),l=jQuery("
      ").addClass("tg-next tg-icon").on("click",function(){b.next()}),u=jQuery("
      ").addClass("tg-prev tg-icon").on("click",function(){b.prev()}),c=jQuery("
      ").addClass("tg-spinner"),d=r.find("[data-globalindex="+i+"]").parent("li"),f=d.offset().left-jQuery(window).scrollLeft(),p=d.offset().top-jQuery(window).scrollTop(),y=d.outerWidth(),m=d.outerHeight();n.nav_effect=r.data("nav_effect")||"fade",n.nav_delay=r.data("nav_delay")||500,n.nav_timing=r.data("nav_timing")||1e3,n.slideShowIdx=i,o.css({position:"fixed",left:f,top:p,width:y,height:m}),a.append(o).append(s).append(c).append(l).append(u),jQuery(".tg-icon",a).css({opacity:0});var g,h={lines:11,length:6,width:6,radius:16,corners:1,rotate:16,direction:1,color:"#fff",speed:1.3,trail:52,shadow:!1,hwaccel:!1,className:"spinner",zIndex:2e9,top:"50%",left:"50%"},v=c.get(0);g=new Spinner(h).spin(v),c.hide();var b={effect:n.nav_effect,effectNext:n.gallery_effectnext||n.nav_effect,effectPrev:n.gallery_effectprev||n.nav_effect,init:function(){b.goTo(!1),b.keyboard(!0),n.isAnimating=!1},keyboard:function(e){e?(jQuery(document).on("keydown.thumbGallery",function(e){switch(e.keyCode){case 27:jQuery.thumbGrid.closeSlideShow(t,i),e.preventDefault();break;case 32:e.preventDefault();break;case 39:b.next(),e.preventDefault();break;case 37:b.prev(),e.preventDefault()}}),jQuery("body").on("closeSlideShow",function(){b.keyboard(!1)})):jQuery(document).off("keydown.thumbGallery")},goTo:function(t){var i=jQuery(".tg-img-wrapper",o).eq(0),r=n.slideShowIdx,a=n.elements,s=e(a[r]),l=jQuery("
      ").addClass("tg-img-wrapper"),u=s.data("highres"),d=s.data("caption"),f=jQuery("
      ").addClass("tg-img-container");f.css({position:"absolute",top:0,left:0,bottom:0,right:0,width:n.gallery_fullscreenw,height:n.gallery_fullscreenh,margin:"auto"}),l.append(f),o.prepend(l),l.addClass("in");var p=jQuery(""),y={top:0,left:0,opacity:1,x:0,y:0,scale:1,rotate:0,skew:0,filter:"blur(0)"};t?(l.css(jQuery.normalizeCss(jQuery.thumbGrid.transitions[b.effect].in)),b.spinner=setTimeout(function(){g=new Spinner(h).spin(v),c.fadeIn(300)},1e3)):(y=jQuery.normalizeCss(y),l.css(y),l.css({opacity:0})),p.one("load",function(){if(!this.loaded){this.loaded=!0,t?l.css(jQuery.normalizeCss(jQuery.thumbGrid.transitions[b.effect].in)):(y=jQuery.normalizeCss(y),l.css(y),l.css({opacity:0})),clearTimeout(b.spinner),c.fadeOut(300,function(){c.empty()}),f.css({backgroundImage:"url("+u+")",backgroundSize:n.gallery_cover?"cover":"contain",backgroundPosition:"center center",backgroundRepeat:"no-repeat"});var e=jQuery("").addClass("tg-img-index").html(r+1+"/"+a.length+" "),s=jQuery("
      ' ); template.find('#ns-gallery-previewer-close').on('click', function(e){ template.find('img').unbind('click'); $(window).unbind('resize.ns-gallery-previewer'); $(this).unbind('click'); template.remove(); }); var photosList = template.find('.ns-gallery-photos-list ul'), fullPhotoImg = template.find('.ns-gallery-full-photo img'), mainCnt = template.find('.ns-gallery-photo-cnt'), imageInfo = template.find('.ns-gallery-photo-info'); $.each(_options.images, function(i, image){ var photoTemplate = $( '' ); photoTemplate.find('img').on('click', function(e){ var self = $(this); $('#ns-gallery-previewer .ns-gallery-photo-thumbnail').removeClass('active'); self.parent().addClass('active'); fullPhotoImg.attr('src', image.url); imageInfo.find('.ns-gallery-photo-name').text(image.name); imageInfo.find('.ns-gallery-photo-description').text(image.description); }); photosList.append(photoTemplate); }); template.find('img[src="'+ image.url +'"]').parent().addClass('active'); $('body').append(template); fullPhotoImg.css('max-height', mainCnt.height()); $(window).on('resize.ns-gallery-previewer', function(){ fullPhotoImg.css('max-height', mainCnt.height()); }); }, makePhoto = function(image){ var template = $( '