2 lines
16 KiB
JavaScript
2 lines
16 KiB
JavaScript
/*! Swipebox v1.4.4 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
|
|
"use strict";!function(window,document,$,undefined){$.swipebox=function(elem,options){var ui,defaults={useCSS:!0,useCssLoadingAnimation:!0,useSVG:!0,initialIndexOnArray:0,removeTopBarOnMobile:!1,removeBottomBarOnMobile:!0,hideCloseButtonOnMobile:!1,hideBarsDelay:5e3,videoMaxWidth:1140,vimeoColor:"cccccc",beforeOpen:null,afterOpen:null,afterClose:null,afterMedia:null,nextSlide:null,prevSlide:null,loopAtEnd:!1,autoplayVideos:!1,queryStringData:{},toggleClassOnLoad:"",closeFadeOutTime:500,selector:null},plugin=this,elements=[],$elem,selector=elem.selector,isMobile=navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(Android)|(PlayBook)|(BB10)|(BlackBerry)|(Opera Mini)|(IEMobile)|(webOS)|(MeeGo)/i),isTouch=null!==isMobile||void 0!==document.createTouch||"ontouchstart"in window||"onmsgesturechange"in window||navigator.msMaxTouchPoints,supportSVG=!!document.createElementNS&&!!document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGRect,winWidth=window.innerWidth?window.innerWidth:$(window).width(),winHeight=window.innerHeight?window.innerHeight:$(window).height(),currentX=0,html='<div id="swipebox-overlay">\t\t\t\t\t<div id="swipebox-container">\t\t\t\t\t\t<div id="swipebox-slider"></div>\t\t\t\t\t\t<div id="swipebox-top-bar">\t\t\t\t\t\t\t<div id="swipebox-title"></div>\t\t\t\t\t\t</div>\t\t\t\t\t\t<div id="swipebox-bottom-bar">\t\t\t\t\t\t\t<div id="swipebox-arrows">\t\t\t\t\t\t\t\t<a id="swipebox-prev"></a>\t\t\t\t\t\t\t\t<a id="swipebox-next"></a>\t\t\t\t\t\t\t\t<div id="swipebox-description"></div>\t\t\t\t\t\t\t</div>\t\t\t\t\t\t</div>\t\t\t\t\t\t<a id="swipebox-close"></a>\t\t\t\t\t</div>\t\t\t</div>';plugin.settings={},$.swipebox.close=function(){ui.closeSlide()},$.swipebox.extend=function(){return ui},plugin.init=function(){plugin.settings=$.extend({},defaults,options),$.isArray(elem)?(elements=elem,ui.target=$(window),ui.init(plugin.settings.initialIndexOnArray)):$(elem).on("click",plugin.settings.selector,(function(event){if("slide current"===event.target.parentNode.className)return!1;var index,relType,relVal;ui.destroy(),$elem=null===plugin.settings.selector?$(elem):$(elem).find(plugin.settings.selector),elements=[],relVal||(relType="data-rel",relVal=$(this).attr(relType)),relVal||(relType="rel",relVal=$(this).attr(relType)),relVal&&""!==relVal&&"nofollow"!==relVal&&($elem=$elem.filter("["+relType+'="'+relVal+'"]')),$elem.each((function(){var title=null,description=null,href=null;$(this).attr("title")&&(title=$(this).attr("title")),$(this).data("description")&&(description=$(this).data("description")),$(this).attr("href")&&(href=$(this).attr("href")),elements.push({href:href,title:title,description:description})})),index=$elem.index($(this)),event.preventDefault(),event.stopPropagation(),ui.target=$(event.target),ui.init(index)}))},plugin.refresh=function(){$.isArray(elem)||(ui.destroy(),$elem=$(selector),ui.actions())},ui={init:function(index){plugin.settings.beforeOpen&&plugin.settings.beforeOpen(),this.target.trigger("swipebox-start"),$.swipebox.isOpen=!0,this.build(),this.openSlide(index),this.openMedia(index),this.preloadMedia(index+1),this.preloadMedia(index-1),plugin.settings.afterOpen&&plugin.settings.afterOpen(index)},build:function(){var $this=this,bg;$("body").append(html),supportSVG&&!0===plugin.settings.useSVG&&$("#swipebox-overlay").addClass("useSvg"),this.doCssLoadingAnimation()&&$("#swipebox-overlay").addClass("useCssLoadingAnimation"),isMobile&&(plugin.settings.removeBottomBarOnMobile&&$("#swipebox-bottom-bar").remove(),plugin.settings.removeTopBarOnMobile&&$("#swipebox-top-bar").remove()),$.each(elements,(function(){$("#swipebox-slider").append('<div class="slide"></div>')})),this.setDim(),this.actions(),isTouch&&this.gesture(),this.keyboard(),this.animBars(),this.resize()},setDim:function(){var width,height,sliderCss={};"onorientationchange"in window?window.addEventListener("orientationchange",(function(){0===window.orientation?(width=winWidth,height=winHeight):90!==window.orientation&&-90!==window.orientation||(width=winHeight,height=winWidth)}),!1):(width=window.innerWidth?window.innerWidth:$(window).width(),height=window.innerHeight?window.innerHeight:$(window).height()),sliderCss={width:width,height:height},$("#swipebox-overlay").css(sliderCss)},resize:function(){var $this=this;$(window).resize((function(){$this.setDim()})).resize()},supportTransition:function(){var prefixes="transition WebkitTransition MozTransition OTransition msTransition KhtmlTransition".split(" "),i;for(i=0;i<prefixes.length;i++)if(void 0!==document.createElement("div").style[prefixes[i]])return prefixes[i];return!1},doCssTrans:function(){if(plugin.settings.useCSS&&this.supportTransition())return!0},doCssLoadingAnimation:function(){if(plugin.settings.useCssLoadingAnimation&&this.supportTransition())return!0},gesture:function(){var $this=this,index,hDistance,vDistance,hDistanceLast,vDistanceLast,hDistancePercent,vSwipe=!1,hSwipe=!1,hSwipMinDistance=10,vSwipMinDistance=50,startCoords={},endCoords={},bars=$("#swipebox-top-bar, #swipebox-bottom-bar"),slider=$("#swipebox-slider");bars.addClass("visible-bars"),$this.setTimeout(),$("body").bind("touchstart",(function(event){return $(this).addClass("touching"),index=$("#swipebox-slider .slide").index($("#swipebox-slider .slide.current")),endCoords=event.originalEvent.targetTouches[0],startCoords.pageX=event.originalEvent.targetTouches[0].pageX,startCoords.pageY=event.originalEvent.targetTouches[0].pageY,$("#swipebox-slider").css({"-webkit-transform":"translate3d("+currentX+"%, 0, 0)",transform:"translate3d("+currentX+"%, 0, 0)"}),$(".touching").bind("touchmove",(function(event){if(event.preventDefault(),event.stopPropagation(),endCoords=event.originalEvent.targetTouches[0],!hSwipe&&(vDistanceLast=vDistance,vDistance=endCoords.pageY-startCoords.pageY,Math.abs(vDistance)>=50||vSwipe)){var opacity=.75-Math.abs(vDistance)/slider.height();slider.css({top:vDistance+"px"}),slider.css({opacity:opacity}),vSwipe=!0}hDistanceLast=hDistance,hDistance=endCoords.pageX-startCoords.pageX,hDistancePercent=100*hDistance/winWidth,!hSwipe&&!vSwipe&&Math.abs(hDistance)>=10&&($("#swipebox-slider").css({"-webkit-transition":"",transition:""}),hSwipe=!0),hSwipe&&(0<hDistance?0===index?$("#swipebox-overlay").addClass("leftSpringTouch"):($("#swipebox-overlay").removeClass("leftSpringTouch").removeClass("rightSpringTouch"),$("#swipebox-slider").css({"-webkit-transform":"translate3d("+(currentX+hDistancePercent)+"%, 0, 0)",transform:"translate3d("+(currentX+hDistancePercent)+"%, 0, 0)"})):0>hDistance&&(elements.length===index+1?$("#swipebox-overlay").addClass("rightSpringTouch"):($("#swipebox-overlay").removeClass("leftSpringTouch").removeClass("rightSpringTouch"),$("#swipebox-slider").css({"-webkit-transform":"translate3d("+(currentX+hDistancePercent)+"%, 0, 0)",transform:"translate3d("+(currentX+hDistancePercent)+"%, 0, 0)"}))))})),!1})).bind("touchend",(function(event){if(event.preventDefault(),event.stopPropagation(),$("#swipebox-slider").css({"-webkit-transition":"-webkit-transform 0.4s ease",transition:"transform 0.4s ease"}),vDistance=endCoords.pageY-startCoords.pageY,hDistance=endCoords.pageX-startCoords.pageX,hDistancePercent=100*hDistance/winWidth,vSwipe)if(vSwipe=!1,Math.abs(vDistance)>=100&&Math.abs(vDistance)>Math.abs(vDistanceLast)){var vOffset=vDistance>0?slider.height():-slider.height();slider.animate({top:vOffset+"px",opacity:0},300,(function(){$this.closeSlide()}))}else slider.animate({top:0,opacity:1},300);else hSwipe?(hSwipe=!1,hDistance>=10&&hDistance>=hDistanceLast?$this.getPrev():hDistance<=-10&&hDistance<=hDistanceLast&&$this.getNext()):bars.hasClass("visible-bars")?($this.clearTimeout(),$this.hideBars()):($this.showBars(),$this.setTimeout());$("#swipebox-slider").css({"-webkit-transform":"translate3d("+currentX+"%, 0, 0)",transform:"translate3d("+currentX+"%, 0, 0)"}),$("#swipebox-overlay").removeClass("leftSpringTouch").removeClass("rightSpringTouch"),$(".touching").off("touchmove").removeClass("touching")}))},setTimeout:function(){if(plugin.settings.hideBarsDelay>0){var $this=this;$this.clearTimeout(),$this.timeout=window.setTimeout((function(){$this.hideBars()}),plugin.settings.hideBarsDelay)}},clearTimeout:function(){window.clearTimeout(this.timeout),this.timeout=null},showBars:function(){var bars=$("#swipebox-top-bar, #swipebox-bottom-bar");this.doCssTrans()?bars.addClass("visible-bars"):($("#swipebox-top-bar").animate({top:0},500),$("#swipebox-bottom-bar").animate({bottom:0},500),setTimeout((function(){bars.addClass("visible-bars")}),1e3))},hideBars:function(){var bars=$("#swipebox-top-bar, #swipebox-bottom-bar");this.doCssTrans()?bars.removeClass("visible-bars"):($("#swipebox-top-bar").animate({top:"-50px"},500),$("#swipebox-bottom-bar").animate({bottom:"-50px"},500),setTimeout((function(){bars.removeClass("visible-bars")}),1e3))},animBars:function(){var $this=this,bars=$("#swipebox-top-bar, #swipebox-bottom-bar");bars.addClass("visible-bars"),$this.setTimeout(),$("#swipebox-slider").click((function(){bars.hasClass("visible-bars")||($this.showBars(),$this.setTimeout())})),$("#swipebox-bottom-bar").hover((function(){$this.showBars(),bars.addClass("visible-bars"),$this.clearTimeout()}),(function(){plugin.settings.hideBarsDelay>0&&(bars.removeClass("visible-bars"),$this.setTimeout())}))},keyboard:function(){var $this=this;$(window).bind("keyup",(function(event){event.preventDefault(),event.stopPropagation(),37===event.keyCode?$this.getPrev():39===event.keyCode?$this.getNext():27===event.keyCode&&$this.closeSlide()}))},actions:function(){var $this=this,action="touchend click";elements.length<2?($("#swipebox-bottom-bar").hide(),void 0===elements[1]&&$("#swipebox-top-bar").hide()):($("#swipebox-prev").bind(action,(function(event){event.preventDefault(),event.stopPropagation(),$this.getPrev(),$this.setTimeout()})),$("#swipebox-next").bind(action,(function(event){event.preventDefault(),event.stopPropagation(),$this.getNext(),$this.setTimeout()}))),$("#swipebox-close").bind(action,(function(event){event.preventDefault(),event.stopPropagation(),$this.closeSlide()}))},setSlide:function(index,isFirst){isFirst=isFirst||!1;var slider=$("#swipebox-slider");currentX=100*-index,this.doCssTrans()?slider.css({"-webkit-transform":"translate3d("+100*-index+"%, 0, 0)",transform:"translate3d("+100*-index+"%, 0, 0)"}):slider.animate({left:100*-index+"%"}),$("#swipebox-slider .slide").removeClass("current"),$("#swipebox-slider .slide").eq(index).addClass("current"),this.setTitle(index),isFirst&&slider.fadeIn(),$("#swipebox-prev, #swipebox-next").removeClass("disabled"),0===index?$("#swipebox-prev").addClass("disabled"):index===elements.length-1&&!0!==plugin.settings.loopAtEnd&&$("#swipebox-next").addClass("disabled")},openSlide:function(index){$("html").addClass("swipebox-html"),isTouch?($("html").addClass("swipebox-touch"),plugin.settings.hideCloseButtonOnMobile&&$("html").addClass("swipebox-no-close-button")):$("html").addClass("swipebox-no-touch"),$(window).trigger("resize"),this.setSlide(index,!0)},preloadMedia:function(index){var $this=this,src=null;void 0!==elements[index]&&(src=elements[index].href),$this.isVideo(src)?$this.openMedia(index):setTimeout((function(){$this.openMedia(index)}),1e3)},openMedia:function(index){var $this=this,src,slide;if(void 0!==elements[index]&&(src=elements[index].href),index<0||index>=elements.length)return!1;if(slide=$("#swipebox-slider .slide").eq(index),this.isVideo(src))slide.html(this.getVideo(src)),plugin.settings.afterMedia&&plugin.settings.afterMedia(index);else{if(slide.addClass("slide-loading"),this.doCssLoadingAnimation()){const loadingHtml=$('\t\t\t\t\t\t<div class="loading-animation-wrapper">\t\t\t\t\t\t\t<span class="loading"></span>\t\t\t\t\t\t</div>');slide.append(loadingHtml)}this.loadMedia(src,(function(){slide.removeClass("slide-loading"),slide.html(this),plugin.settings.afterMedia&&plugin.settings.afterMedia(index)}))}},setTitle:function(index){var title=null,description=null;$("#swipebox-title").empty(),void 0!==elements[index]&&(title=elements[index].title,description=elements[index].description),title?($("#swipebox-top-bar").show(),$("#swipebox-title").append(title)):$("#swipebox-top-bar").hide(),$("#swipebox-description").empty(),$("#swipebox-description").append(description)},isVideo:function(src){if(src){if(src.match(/(youtube\.com|youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/)||src.match(/vimeo\.com\/([0-9]*)/)||src.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/))return!0;if(src.toLowerCase().indexOf("swipeboxvideo=1")>=0)return!0}},parseUri:function(uri,customData){var a=document.createElement("a"),qs={};return a.href=decodeURIComponent(uri),a.search&&(qs=JSON.parse('{"'+a.search.toLowerCase().replace("?","").replace(/&/g,'","').replace(/=/g,'":"')+'"}')),$.isPlainObject(customData)&&(qs=$.extend(qs,customData,plugin.settings.queryStringData)),$.map(qs,(function(val,key){if(val&&val>"")return encodeURIComponent(key)+"="+encodeURIComponent(val)})).join("&")},getVideo:function(url){var iframe="",youtubeUrl=url.match(/((?:www\.)?youtube\.com|(?:www\.)?youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/),youtubeShortUrl=url.match(/(?:www\.)?youtu\.be\/([a-zA-Z0-9\-_]+)/),vimeoUrl=url.match(/(?:www\.)?vimeo\.com\/([0-9]*)/),qs="";return youtubeUrl||youtubeShortUrl?(youtubeShortUrl&&(youtubeUrl=youtubeShortUrl),qs=ui.parseUri(url,{autoplay:plugin.settings.autoplayVideos?"1":"0",v:""}),iframe='<iframe width="560" height="315" src="//'+youtubeUrl[1]+"/embed/"+youtubeUrl[2]+"?"+qs+'" frameborder="0" allowfullscreen></iframe>'):vimeoUrl?(qs=ui.parseUri(url,{autoplay:plugin.settings.autoplayVideos?"1":"0",byline:"0",portrait:"0",color:plugin.settings.vimeoColor}),iframe='<iframe width="560" height="315" src="//player.vimeo.com/video/'+vimeoUrl[1]+"?"+qs+'" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>'):iframe='<iframe width="560" height="315" src="'+url+'" frameborder="0" allowfullscreen></iframe>','<div class="swipebox-video-container" style="max-width:'+plugin.settings.videoMaxWidth+'px"><div class="swipebox-video">'+iframe+"</div></div>"},loadMedia:function(src,callback){if(0===src.trim().indexOf("#"))callback.call($("<div>",{class:"swipebox-inline-container"}).append($(src).clone().toggleClass(plugin.settings.toggleClassOnLoad)));else if(!this.isVideo(src)){var img=$("<img>").on("load",(function(){callback.call(img)}));img.attr("src",src)}},getNext:function(){var $this=this,src,index=$("#swipebox-slider .slide").index($("#swipebox-slider .slide.current"));index+1<elements.length?(src=$("#swipebox-slider .slide").eq(index).contents().find("iframe").attr("src"),$("#swipebox-slider .slide").eq(index).contents().find("iframe").attr("src",src),index++,this.setSlide(index),this.preloadMedia(index+1),plugin.settings.nextSlide&&plugin.settings.nextSlide(index)):!0===plugin.settings.loopAtEnd?(src=$("#swipebox-slider .slide").eq(index).contents().find("iframe").attr("src"),$("#swipebox-slider .slide").eq(index).contents().find("iframe").attr("src",src),index=0,this.preloadMedia(index),this.setSlide(index),this.preloadMedia(index+1),plugin.settings.nextSlide&&plugin.settings.nextSlide(index)):($("#swipebox-overlay").addClass("rightSpring"),setTimeout((function(){$("#swipebox-overlay").removeClass("rightSpring")}),500))},getPrev:function(){var index=$("#swipebox-slider .slide").index($("#swipebox-slider .slide.current")),src;index>0?(src=$("#swipebox-slider .slide").eq(index).contents().find("iframe").attr("src"),$("#swipebox-slider .slide").eq(index).contents().find("iframe").attr("src",src),index--,this.setSlide(index),this.preloadMedia(index-1),plugin.settings.prevSlide&&plugin.settings.prevSlide(index)):($("#swipebox-overlay").addClass("leftSpring"),setTimeout((function(){$("#swipebox-overlay").removeClass("leftSpring")}),500))},nextSlide:function(index){},prevSlide:function(index){},closeSlide:function(){plugin.settings.closeFadeOutTime>0&&$("#swipebox-overlay").fadeOut(plugin.settings.closeFadeOutTime,function(){this.destroy()}.bind(this)),$("html").removeClass("swipebox-html"),$("html").removeClass("swipebox-touch"),$(window).trigger("resize"),plugin.settings.closeFadeOutTime<=0&&this.destroy()},destroy:function(){$(window).unbind("keyup"),$("body").unbind("touchstart"),$("body").unbind("touchmove"),$("body").unbind("touchend"),$("#swipebox-slider").unbind(),$("#swipebox-overlay").remove(),$.isArray(elem)||elem.removeData("_swipebox"),this.target&&this.target.trigger("swipebox-destroy"),$.swipebox.isOpen=!1,plugin.settings.afterClose&&plugin.settings.afterClose()}},plugin.init()},$.fn.swipebox=function(options){if(!$.data(this,"_swipebox")){var swipebox=new $.swipebox(this,options);this.data("_swipebox",swipebox)}return this.data("_swipebox")}}(window,document,jQuery); |