/*! * viewer v0.5.0 * https://github.com/fengyuanchen/viewer * * copyright (c) 2015-2016 fengyuan chen * released under the mit license * * date: 2016-01-21t09:59:52.834z */ !function(i){"function"==typeof define&&define.amd?define("viewer",["jquery"],i):i("object"==typeof exports?require("jquery"):jquery)}(function(i){"use strict";function t(i){return"string"==typeof i}function e(i){return"number"==typeof i&&!isnan(i)}function s(i){return"undefined"==typeof i}function n(i,t){var s=[];return e(t)&&s.push(t),s.slice.apply(i,s)}function o(i,t){var e=n(arguments,2);return function(){return i.apply(t,e.concat(n(arguments)))}}function a(i){var t=[],s=i.rotate,n=i.scalex,o=i.scaley;return e(s)&&t.push("rotate("+s+"deg)"),e(n)&&e(o)&&t.push("scale("+n+","+o+")"),t.length?t.join(" "):"none"}function h(i){return i.offsetwidth}function r(i){return t(i)?i.replace(/^.*\//,"").replace(/[\?].*$/,""):""}function l(i,t){var e;return i.naturalwidth?t(i.naturalwidth,i.naturalheight):(e=document.createelement("img"),e.onload=function(){t(this.width,this.height)},void(e.src=i.src))}function d(t){var e=t.length,s=0,n=0;return e&&(i.each(t,function(i,t){s+=t.pagex,n+=t.pagey}),s/=e,n/=e),{pagex:s,pagey:n}}function c(i){switch(i){case 2:return x;case 3:return $;case 4:return c}}function u(t,e){this.$element=i(t),this.options=i.extend({},u.defaults,i.isplainobject(e)&&e),this.isimg=!1,this.isbuilt=!1,this.isshown=!1,this.isviewed=!1,this.isfulled=!1,this.isplayed=!1,this.wheeling=!1,this.playing=!1,this.fading=!1,this.tooltiping=!1,this.transitioning=!1,this.action=!1,this.target=!1,this.timeout=!1,this.index=0,this.length=0,this.init()}var m=i(window),v=i(document),f="viewer",g=document.createelement(f),w="viewer-fixed",p="viewer-open",b="viewer-show",y="viewer-hide",x="viewer-hide-xs-down",$="viewer-hide-sm-down",c="viewer-hide-md-down",z="viewer-fade",f="viewer-in",y="viewer-move",k="viewer-active",i="viewer-invisible",x="viewer-transition",p="viewer-fullscreen",t="viewer-fullscreen-exit",v="viewer-close",e="img",s="mousedown touchstart pointerdown mspointerdown",d="mousemove touchmove pointermove mspointermove",l="mouseup touchend touchcancel pointerup pointercancel mspointerup mspointercancel",q="wheel mousewheel dommousescroll",r="transitionend",m="load."+f,w="keydown."+f,_="click."+f,j="resize."+f,a="build."+f,b="built."+f,h="show."+f,u="shown."+f,n="hide."+f,o="hidden."+f,z="view."+f,k="viewed."+f,q="undefined"!=typeof g.style.transition,g=math.round,j=math.sqrt,ii=math.abs,ti=math.min,ei=math.max,si=number;u.prototype={constructor:u,init:function(){var t=this.options,e=this.$element,s=e.is(e),n=s?e:e.find(e),o=n.length,a=i.proxy(this.ready,this);o&&(i.isfunction(t.build)&&e.one(a,t.build),this.trigger(a).isdefaultprevented()||(q||(t.transition=!1),this.isimg=s,this.length=o,this.count=0,this.$images=n,this.$body=i("body"),t.inline?(e.one(b,i.proxy(function(){this.view()},this)),n.each(function(){this.complete?a():i(this).one(m,a)})):e.on(_,i.proxy(this.start,this))))},ready:function(){this.count++,this.count===this.length&&this.build()},build:function(){var t,e,s,n,o,a,h=this.options,r=this.$element;this.isbuilt||(this.$parent=t=r.parent(),this.$viewer=e=i(u.template),this.$canvas=e.find(".viewer-canvas"),this.$footer=e.find(".viewer-footer"),this.$title=s=e.find(".viewer-title"),this.$toolbar=n=e.find(".viewer-toolbar"),this.$navbar=o=e.find(".viewer-navbar"),this.$button=a=e.find(".viewer-button"),this.$tooltip=e.find(".viewer-tooltip"),this.$player=e.find(".viewer-player"),this.$list=e.find(".viewer-list"),s.addclass(h.title?c(h.title):y),n.addclass(h.toolbar?c(h.toolbar):y),n.find("li[class*=zoom]").toggleclass(i,!h.zoomable),n.find("li[class*=flip]").toggleclass(i,!h.scalable),h.rotatable||n.find("li[class*=rotate]").addclass(i).appendto(n),o.addclass(h.navbar?c(h.navbar):y),h.inline?(a.addclass(p),e.css("z-index",h.zindexinline),"static"===t.css("position")&&t.css("position","relative")):(a.addclass(v),e.css("z-index",h.zindex).addclass([w,z,y].join(" "))),r.after(e),h.inline&&(this.render(),this.bind(),this.isshown=!0),this.isbuilt=!0,i.isfunction(h.built)&&r.one(b,h.built),this.trigger(b))},unbuild:function(){var i=this.options,t=this.$element;this.isbuilt&&(i.inline&&t.removeclass(y),this.$viewer.remove())},bind:function(){var t=this.options,e=this.$element;i.isfunction(t.view)&&e.on(z,t.view),i.isfunction(t.viewed)&&e.on(k,t.viewed),this.$viewer.on(_,i.proxy(this.click,this)).on(q,i.proxy(this.wheel,this)),this.$canvas.on(s,i.proxy(this.mousedown,this)),v.on(d,this._mousemove=o(this.mousemove,this)).on(l,this._mouseup=o(this.mouseup,this)).on(w,this._keydown=o(this.keydown,this)),m.on(j,this._resize=o(this.resize,this))},unbind:function(){var t=this.options,e=this.$element;i.isfunction(t.view)&&e.off(z,t.view),i.isfunction(t.viewed)&&e.off(k,t.viewed),this.$viewer.off(_,this.click).off(q,this.wheel),this.$canvas.off(s,this.mousedown),v.off(d,this._mousemove).off(l,this._mouseup).off(w,this._keydown),m.off(j,this._resize)},render:function(){this.initcontainer(),this.initviewer(),this.initlist(),this.renderviewer()},initcontainer:function(){this.container={width:m.innerwidth(),height:m.innerheight()}},initviewer:function(){var t,e=this.options,s=this.$parent;e.inline&&(this.parent=t={width:ei(s.width(),e.minwidth),height:ei(s.height(),e.minheight)}),(this.isfulled||!t)&&(t=this.container),this.viewer=i.extend({},t)},renderviewer:function(){this.options.inline&&!this.isfulled&&this.$viewer.css(this.viewer)},initlist:function(){var e=this.options,s=this.$element,n=this.$list,o=[];this.$images.each(function(s){var n=this.src,a=this.alt||r(n),h=e.url;n&&(t(h)?h=this.getattribute(h):i.isfunction(h)&&(h=h.call(this,this)),o.push('
'))}),n.html(o.join("")).find(e).one(m,{filled:!0},i.proxy(this.loadimage,this)),this.$items=n.children(),e.transition&&s.one(k,function(){n.addclass(x)})},renderlist:function(i){var t=i||this.index,e=this.$items.eq(t).width(),s=e+1;this.$list.css({width:s*this.length,marginleft:(this.viewer.width-e)/2-s*t})},resetlist:function(){this.$list.empty().removeclass(x).css("margin-left",0)},initimage:function(t){var e=this.options,s=this.$image,n=this.viewer,o=this.$footer.height(),a=n.width,h=ei(n.height-o,o),r=this.image||{};l(s[0],i.proxy(function(s,n){var o,l,d=s/n,c=a,u=h;h*d>a?u=a/d:c=h*d,c=ti(.9*c,s),u=ti(.9*u,n),l={naturalwidth:s,naturalheight:n,aspectratio:d,ratio:c/s,width:c,height:u,left:(a-c)/2,top:(h-u)/2},o=i.extend({},l),e.rotatable&&(l.rotate=r.rotate||0,o.rotate=0),e.scalable&&(l.scalex=r.scalex||1,l.scaley=r.scaley||1,o.scalex=1,o.scaley=1),this.image=l,this.initialimage=o,i.isfunction(t)&&t()},this))},renderimage:function(t){var e=this.image,s=this.$image;s.css({width:e.width,height:e.height,marginleft:e.left,margintop:e.top,transform:a(e)}),i.isfunction(t)&&(this.transitioning?s.one(r,t):t())},resetimage:function(){this.$image.remove(),this.$image=null},start:function(t){var e=t.target;i(e).is("img")&&(this.target=e,this.show())},click:function(t){var e=i(t.target),s=e.data("action"),n=this.image;switch(s){case"mix":this.isplayed?this.stop():this.options.inline?this.isfulled?this.exit():this.full():this.hide();break;case"view":this.view(e.data("index"));break;case"zoom-in":this.zoom(.1,!0);break;case"zoom-out":this.zoom(-.1,!0);break;case"one-to-one":this.toggle();break;case"reset":this.reset();break;case"prev":this.prev();break;case"play":this.play();break;case"next":this.next();break;case"rotate-left":this.rotate(-90);break;case"rotate-right":this.rotate(90);break;case"flip-horizontal":this.scalex(-n.scalex||-1);break;case"flip-vertical":this.scaley(-n.scaley||-1);break;default:this.isplayed&&this.stop()}},load:function(){var t=this.options,e=this.viewer,s=this.$image;this.timeout&&(cleartimeout(this.timeout),this.timeout=!1),s.removeclass(i).css("csstext","width:0;height:0;margin-left:"+e.width/2+"px;margin-top:"+e.height/2+"px;max-width:none!important;visibility:visible;"),this.initimage(i.proxy(function(){s.toggleclass(x,t.transition).toggleclass(y,t.movable),this.renderimage(i.proxy(function(){this.isviewed=!0,this.trigger(k)},this))},this))},loadimage:function(t){var e=t.target,s=i(e),n=s.parent(),o=n.width(),a=n.height(),h=t.data&&t.data.filled;l(e,function(i,t){var e=i/t,n=o,r=a;a*e>o?h?n=a*e:r=o/e:h?r=o/e:n=a*e,s.css({width:n,height:r,marginleft:(o-n)/2,margintop:(a-r)/2})})},resize:function(){this.initcontainer(),this.initviewer(),this.renderviewer(),this.renderlist(),this.initimage(i.proxy(function(){this.renderimage()},this)),this.isplayed&&this.$player.find(e).one(m,i.proxy(this.loadimage,this)).trigger(m)},wheel:function(t){var e=t.originalevent||t,s=si(this.options.zoomratio)||.1,n=1;this.isviewed&&(t.preventdefault(),this.wheeling||(this.wheeling=!0,settimeout(i.proxy(function(){this.wheeling=!1},this),50),e.deltay?n=e.deltay>0?1:-1:e.wheeldelta?n=-e.wheeldelta/120:e.detail&&(n=e.detail>0?1:-1),this.zoom(-n*s,!0,t)))},keydown:function(i){var t=this.options,e=i.which;if(this.isfulled&&t.keyboard)switch(e){case 27:this.isplayed?this.stop():t.inline?this.isfulled&&this.exit():this.hide();break;case 32:this.isplayed&&this.stop();break;case 37:this.prev();break;case 38:i.preventdefault(),this.zoom(t.zoomratio,!0);break;case 39:this.next();break;case 40:i.preventdefault(),this.zoom(-t.zoomratio,!0);break;case 48:case 49:(i.ctrlkey||i.shiftkey)&&(i.preventdefault(),this.toggle())}},mousedown:function(i){var t,e=this.options,s=i.originalevent,n=s&&s.touches,o=i,a=e.movable?"move":!1;if(this.isviewed){if(n){if(t=n.length,t>1){if(!e.zoomable||2!==t)return;o=n[1],this.startx2=o.pagex,this.starty2=o.pagey,a="zoom"}else this.isswitchable()&&(a="switch");o=n[0]}a&&(i.preventdefault(),this.action=a,this.startx=o.pagex||s&&s.pagex,this.starty=o.pagey||s&&s.pagey)}},mousemove:function(i){var t,e=this.options,s=this.action,n=this.$image,o=i.originalevent,a=o&&o.touches,h=i;if(this.isviewed){if(a){if(t=a.length,t>1){if(!e.zoomable||2!==t)return;h=a[1],this.endx2=h.pagex,this.endy2=h.pagey}h=a[0]}s&&(i.preventdefault(),"move"===s&&e.transition&&n.hasclass(x)&&n.removeclass(x),this.endx=h.pagex||o&&o.pagex,this.endy=h.pagey||o&&o.pagey,this.change(i))}},mouseup:function(i){var t=this.action;t&&(i.preventdefault(),"move"===t&&this.options.transition&&this.$image.addclass(x),this.action=!1)},show:function(){var t,e=this.options;e.inline||this.transitioning||(this.isbuilt||this.build(),i.isfunction(e.show)&&this.$element.one(h,e.show),this.trigger(h).isdefaultprevented()||(this.$body.addclass(p),t=this.$viewer.removeclass(y),this.$element.one(u,i.proxy(function(){this.view(this.target?this.$images.index(this.target):this.index),this.target=!1},this)),e.transition?(this.transitioning=!0,t.addclass(x),h(t[0]),t.one(r,i.proxy(this.shown,this)).addclass(f)):(t.addclass(f),this.shown())))},hide:function(){var t=this.options,e=this.$viewer;t.inline||this.transitioning||!this.isshown||(i.isfunction(t.hide)&&this.$element.one(n,t.hide),this.trigger(n).isdefaultprevented()||(this.isviewed&&t.transition?(this.transitioning=!0,this.$image.one(r,i.proxy(function(){e.one(r,i.proxy(this.hidden,this)).removeclass(f)},this)),this.zoomto(0,!1,!1,!0)):(e.removeclass(f),this.hidden())))},view:function(t){var e,s,n,o,a,h=this.$title;t=number(t)||0,!this.isshown||this.isplayed||0>t||t>=this.length||this.isviewed&&t===this.index||this.trigger(z).isdefaultprevented()||(s=this.$items.eq(t),n=s.find(e),o=n.data("originalurl"),a=n.attr("alt"),this.$image=e=i(''),this.isviewed&&this.$items.eq(this.index).removeclass(k),s.addclass(k),this.isviewed=!1,this.index=t,this.image=null,this.$canvas.html(e.addclass(i)),this.renderlist(),h.empty(),this.$element.one(k,i.proxy(function(){var i=this.image,t=i.naturalwidth,e=i.naturalheight;h.html(a+" ("+t+" × "+e+")")},this)),e[0].complete?this.load():(e.one(m,i.proxy(this.load,this)),this.timeout&&cleartimeout(this.timeout),this.timeout=settimeout(i.proxy(function(){e.removeclass(i),this.timeout=!1},this),1e3)))},prev:function(){this.view(ei(this.index-1,0))},next:function(){this.view(ti(this.index+1,this.length-1))},move:function(i,t){var e=this.image;this.moveto(s(i)?i:e.left+si(i),s(t)?t:e.top+si(t))},moveto:function(i,t){var n=this.image,o=!1;s(t)&&(t=i),i=si(i),t=si(t),this.isviewed&&!this.isplayed&&this.options.movable&&(e(i)&&(n.left=i,o=!0),e(t)&&(n.top=t,o=!0),o&&this.renderimage())},zoom:function(i,t,e){var s=this.image;i=si(i),i=0>i?1/(1-i):1+i,this.zoomto(s.width*i/s.naturalwidth,t,e)},zoomto:function(i,t,s,n){var o,a,h,r,l,c=this.options,u=.01,m=100,v=this.image,f=v.width,g=v.height;i=ei(0,i),e(i)&&this.isviewed&&!this.isplayed&&(n||c.zoomable)&&(n||(u=ei(u,c.minzoomratio),m=ti(m,c.maxzoomratio),i=ti(ei(i,u),m)),i>.95&&1.05>i&&(i=1),a=v.naturalwidth*i,h=v.naturalheight*i,s&&(o=s.originalevent)?(r=this.$viewer.offset(),l=o.touches?d(o.touches):{pagex:s.pagex||o.pagex||0,pagey:s.pagey||o.pagey||0},v.left-=(a-f)*((l.pagex-r.left-v.left)/f),v.top-=(h-g)*((l.pagey-r.top-v.top)/g)):(v.left-=(a-f)/2,v.top-=(h-g)/2),v.width=a,v.height=h,v.ratio=i,this.renderimage(),t&&this.tooltip())},rotate:function(i){this.rotateto((this.image.rotate||0)+si(i))},rotateto:function(i){var t=this.image;i=si(i),e(i)&&this.isviewed&&!this.isplayed&&this.options.rotatable&&(t.rotate=i,this.renderimage())},scale:function(i,t){var n=this.image,o=!1;s(t)&&(t=i),i=si(i),t=si(t),this.isviewed&&!this.isplayed&&this.options.scalable&&(e(i)&&(n.scalex=i,o=!0),e(t)&&(n.scaley=t,o=!0),o&&this.renderimage())},scalex:function(i){this.scale(i,this.image.scaley)},scaley:function(i){this.scale(this.image.scalex,i)},play:function(){var t,s=this.options,n=this.$player,o=i.proxy(this.loadimage,this),a=[],h=0,r=0;this.isshown&&!this.isplayed&&(s.fullscreen&&this.requestfullscreen(),this.isplayed=!0,n.addclass(b),this.$items.each(function(t){var e=i(this),l=e.find(e),d=i('');h++,d.addclass(z).toggleclass(x,s.transition),e.hasclass(k)&&(d.addclass(f),r=t),a.push(d),d.one(m,{filled:!1},o),n.append(d)}),e(s.interval)&&s.interval>0&&(t=i.proxy(function(){this.playing=settimeout(function(){a[r].removeclass(f),r++,r=h>r?r:0,a[r].addclass(f),t()},s.interval)},this),h>1&&t()))},stop:function(){this.isplayed&&(this.options.fullscreen&&this.exitfullscreen(),this.isplayed=!1,cleartimeout(this.playing),this.$player.removeclass(b).empty())},full:function(){var t=this.options,e=this.$image,s=this.$list;this.isshown&&!this.isplayed&&!this.isfulled&&t.inline&&(this.isfulled=!0,this.$body.addclass(p),this.$button.addclass(t),t.transition&&(e.removeclass(x),s.removeclass(x)),this.$viewer.addclass(w).removeattr("style").css("z-index",t.zindex),this.initcontainer(),this.viewer=i.extend({},this.container),this.renderlist(),this.initimage(i.proxy(function(){this.renderimage(function(){t.transition&&settimeout(function(){e.addclass(x),s.addclass(x)},0)})},this)))},exit:function(){var t=this.options,e=this.$image,s=this.$list;this.isfulled&&(this.isfulled=!1,this.$body.removeclass(p),this.$button.removeclass(t),t.transition&&(e.removeclass(x),s.removeclass(x)),this.$viewer.removeclass(w).css("z-index",t.zindexinline),this.viewer=i.extend({},this.parent),this.renderviewer(),this.renderlist(),this.initimage(i.proxy(function(){this.renderimage(function(){t.transition&&settimeout(function(){e.addclass(x),s.addclass(x)},0)})},this)))},tooltip:function(){var t=this.options,e=this.$tooltip,s=this.image,n=[b,z,x].join(" ");this.isviewed&&!this.isplayed&&t.tooltip&&(e.text(g(100*s.ratio)+"%"),this.tooltiping?cleartimeout(this.tooltiping):t.transition?(this.fading&&e.trigger(r),e.addclass(n),h(e[0]),e.addclass(f)):e.addclass(b),this.tooltiping=settimeout(i.proxy(function(){t.transition?(e.one(r,i.proxy(function(){e.removeclass(n),this.fading=!1},this)).removeclass(f),this.fading=!0):e.removeclass(b),this.tooltiping=!1},this),1e3))},toggle:function(){1===this.image.ratio?this.zoomto(this.initialimage.ratio,!0):this.zoomto(1,!0)},reset:function(){this.isviewed&&!this.isplayed&&(this.image=i.extend({},this.initialimage),this.renderimage())},update:function(){var t,e=this.$element,s=this.$images,n=[];if(this.isimg){if(!e.parent().length)return this.destroy()}else this.$images=s=e.find(e),this.length=s.length;this.isbuilt&&(i.each(this.$items,function(t){var e=i(this).find("img")[0],o=s[t];o?o.src!==e.src&&n.push(t):n.push(t)}),this.$list.width("auto"),this.initlist(),this.isshown&&(this.length?this.isviewed&&(t=i.inarray(this.index,n),t>=0?(this.isviewed=!1,this.view(ei(this.index-(t+1),0))):this.$items.eq(this.index).addclass(k)):(this.$image=null,this.isviewed=!1,this.index=0,this.image=null,this.$canvas.empty(),this.$title.empty())))},destroy:function(){var i=this.$element;this.options.inline?this.unbind():(this.isshown&&this.unbind(),i.off(_,this.start)),this.unbuild(),i.removedata(f)},trigger:function(t,e){var s=i.event(t,e);return this.$element.trigger(s),s},shown:function(){var t=this.options;this.transitioning=!1,this.isfulled=!0,this.isshown=!0,this.isvisible=!0,this.render(),this.bind(),i.isfunction(t.shown)&&this.$element.one(u,t.shown),this.trigger(u)},hidden:function(){var t=this.options;this.transitioning=!1,this.isviewed=!1,this.isfulled=!1,this.isshown=!1,this.isvisible=!1,this.unbind(),this.$body.removeclass(p),this.$viewer.addclass(y),this.resetlist(),this.resetimage(),i.isfunction(t.hidden)&&this.$element.one(o,t.hidden),this.trigger(o)},requestfullscreen:function(){var i=document.documentelement;!this.isfulled||document.fullscreenelement||document.mozfullscreenelement||document.webkitfullscreenelement||document.msfullscreenelement||(i.requestfullscreen?i.requestfullscreen():i.msrequestfullscreen?i.msrequestfullscreen():i.mozrequestfullscreen?i.mozrequestfullscreen():i.webkitrequestfullscreen&&i.webkitrequestfullscreen(element.allow_keyboard_input))},exitfullscreen:function(){this.isfulled&&(document.exitfullscreen?document.exitfullscreen():document.msexitfullscreen?document.msexitfullscreen():document.mozcancelfullscreen?document.mozcancelfullscreen():document.webkitexitfullscreen&&document.webkitexitfullscreen())},change:function(i){var t=this.endx-this.startx,e=this.endy-this.starty;switch(this.action){case"move":this.move(t,e);break;case"zoom":this.zoom(function(i,t,e,s){var n=j(i*i+t*t),o=j(e*e+s*s);return(o-n)/n}(ii(this.startx-this.startx2),ii(this.starty-this.starty2),ii(this.endx-this.endx2),ii(this.endy-this.endy2)),!1,i),this.startx2=this.endx2,this.starty2=this.endy2;break;case"switch":this.action="switched",ii(t)>ii(e)&&(t>1?this.prev():-1>t&&this.next())}this.startx=this.endx,this.starty=this.endy},isswitchable:function(){var i=this.image,t=this.viewer;return i.left>=0&&i.top>=0&&i.width<=t.width&&i.height<=t.height}},u.defaults={inline:!1,button:!0,navbar:!0,title:!0,toolbar:!0,tooltip:!0,movable:!0,zoomable:!0,rotatable:!0,scalable:!0,transition:!0,fullscreen:!0,keyboard:!0,interval:5e3,minwidth:200,minheight:100,zoomratio:.1,minzoomratio:.01,maxzoomratio:100,zindex:2015,zindexinline:0,url:"src",build:null,built:null,show:null,shown:null,hide:null,hidden:null,view:null,viewed:null},u.template='