Comparing version 0.10.0 to 1.0.0-beta
# Changelog | ||
## 1.0.0-beta (Dec 12, 2017) | ||
- Add `style` field to `package.json`. | ||
- Fix the issue of NodeList deconstructing (#118). | ||
- Fall back to `document.documentElement` if `document.body` is not existing (#120). | ||
## 0.10.0 (Nov 5, 2017) | ||
@@ -4,0 +10,0 @@ |
/*! | ||
* Viewer.js v0.10.0 | ||
* Viewer.js v1.0.0-beta | ||
* https://github.com/fengyuanchen/viewerjs | ||
@@ -8,4 +8,4 @@ * | ||
* | ||
* Date: 2017-11-05T04:38:31.466Z | ||
* Date: 2017-12-17T10:29:35.102Z | ||
*/ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.Viewer=e()}(this,function(){"use strict";function t(t){return"string"==typeof t}function e(t){return"number"==typeof t&&!V(t)}function i(t){return void 0===t}function n(t){return"object"===(void 0===t?"undefined":H(t))&&null!==t}function s(t){if(!n(t))return!1;try{var e=t.constructor,i=e.prototype;return e&&i&&K.call(i,"isPrototypeOf")}catch(t){return!1}}function o(t){return"function"==typeof t}function r(t,i){if(t&&o(i))if(Array.isArray(t)||e(t.length)){var s=t.length,r=void 0;for(r=0;r<s&&!1!==i.call(t,t[r],r,t);r+=1);}else n(t)&&Object.keys(t).forEach(function(e){i.call(t,t[e],e,t)});return t}function a(t){for(var e=arguments.length,i=Array(e>1?e-1:0),s=1;s<e;s++)i[s-1]=arguments[s];if(n(t)&&i.length>0){if(Object.assign)return Object.assign.apply(Object,[t].concat(i));i.forEach(function(e){n(e)&&Object.keys(e).forEach(function(i){t[i]=e[i]})})}return t}function h(t,e){for(var i=arguments.length,n=Array(i>2?i-2:0),s=2;s<i;s++)n[s-2]=arguments[s];return function(){for(var i=arguments.length,s=Array(i),o=0;o<i;o++)s[o]=arguments[o];return t.apply(e,n.concat(s))}}function l(t,i){var n=t.style;r(i,function(t,i){U.test(i)&&e(t)&&(t+="px"),n[i]=t})}function c(t){return window.getComputedStyle?window.getComputedStyle(t,null):t.currentStyle}function u(t,e){return t.classList?t.classList.contains(e):t.className.indexOf(e)>-1}function d(t,i){if(i)if(e(t.length))r(t,function(t){d(t,i)});else if(t.classList)t.classList.add(i);else{var n=t.className.trim();n?n.indexOf(i)<0&&(t.className=n+" "+i):t.className=i}}function v(t,i){i&&(e(t.length)?r(t,function(t){v(t,i)}):t.classList?t.classList.remove(i):t.className.indexOf(i)>=0&&(t.className=t.className.replace(i,"")))}function f(t,i,n){i&&(e(t.length)?r(t,function(t){f(t,i,n)}):n?d(t,i):v(t,i))}function m(t){return t.replace(Z,"$1-$2").toLowerCase()}function g(t,e){return n(t[e])?t[e]:t.dataset?t.dataset[e]:t.getAttribute("data-"+m(e))}function w(t,e,i){n(i)?t[e]=i:t.dataset?t.dataset[e]=i:t.setAttribute("data-"+m(e),i)}function p(t,e){if(n(t[e]))delete t[e];else if(t.dataset)try{delete t.dataset[e]}catch(i){t.dataset[e]=null}else t.removeAttribute("data-"+m(e))}function b(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(o(i)){var s=e.trim().split($);s.length>1?r(s,function(e){b(t,e,i,n)}):t.removeEventListener?t.removeEventListener(e,i,n):t.detachEvent&&t.detachEvent("on"+e,i)}}function y(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(o(i)){var s=e.trim().split($);if(s.length>1)r(s,function(e){y(t,e,i,n)});else{if(n.once){var a=i;i=function(){for(var s=arguments.length,o=Array(s),r=0;r<s;r++)o[r]=arguments[r];return b(t,e,i,n),a.apply(t,o)}}t.addEventListener?t.addEventListener(e,i,n):t.attachEvent&&t.attachEvent("on"+e,i)}}}function x(t,e,n){if(t.dispatchEvent){var s=void 0;return o(Event)&&o(CustomEvent)?s=i(n)?new Event(e,{bubbles:!0,cancelable:!0}):new CustomEvent(e,{detail:n,bubbles:!0,cancelable:!0}):i(n)?(s=document.createEvent("Event")).initEvent(e,!0,!0):(s=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,n),t.dispatchEvent(s)}return!t.fireEvent||t.fireEvent("on"+e)}function D(t){var e=document.documentElement,i=t.getBoundingClientRect();return{left:i.left+((window.scrollX||e&&e.scrollLeft||0)-(e&&e.clientLeft||0)),top:i.top+((window.scrollY||e&&e.scrollTop||0)-(e&&e.clientTop||0))}}function k(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function E(t){var i=t.rotate,n=t.scaleX,s=t.scaleY,o=[];e(i)&&0!==i&&o.push("rotate("+i+"deg)"),e(n)&&1!==n&&o.push("scaleX("+n+")"),e(s)&&1!==s&&o.push("scaleY("+s+")");var r=o.length?o.join(" "):"none";return{WebkitTransform:r,msTransform:r,transform:r}}function z(e){return t(e)?e.replace(/^.*\//,"").replace(/[?&#].*$/,""):""}function I(t,e){if(!t.naturalWidth||G){var i=document.createElement("img");i.onload=function(){e(i.width,i.height)},i.src=t.src}else e(t.naturalWidth,t.naturalHeight)}function T(t){switch(t){case 2:return A;case 3:return X;case 4:return F;default:return""}}function S(t){var e=a({},t),i=[];return r(t,function(t,n){delete e[n],r(e,function(e){var n=Math.abs(t.startX-e.startX),s=Math.abs(t.startY-e.startY),o=Math.abs(t.endX-e.endX),r=Math.abs(t.endY-e.endY),a=Math.sqrt(n*n+s*s),h=(Math.sqrt(o*o+r*r)-a)/a;i.push(h)})}),i.sort(function(t,e){return Math.abs(t)<Math.abs(e)}),i[0]}function L(t,e){var i=t.pageX,n=t.pageY,s={endX:i,endY:n};return e?s:a({startX:i,startY:n},s)}function C(t){var e=0,i=0,n=0;return r(t,function(t){var s=t.startX,o=t.startY;e+=s,i+=o,n+=1}),e/=n,i/=n,{pageX:e,pageY:i}}function N(t){if(Array.isArray(t)){for(var e=0,i=Array(t.length);e<t.length;e++)i[e]=t[e];return i}return Array.from(t)}function M(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var Y={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,loop:!1,minWidth:200,minHeight:100,zoomRatio:.1,minZoomRatio:.01,maxZoomRatio:100,zIndex:2015,zIndexInline:0,url:"src",filter:null,ready:null,show:null,shown:null,hide:null,hidden:null,view:null,viewed:null},q="undefined"!=typeof window?window:{},F="viewer-hide-md-down",X="viewer-hide-sm-down",A="viewer-hide-xs-down",O="viewer-in",R="viewer-transition",W=q.PointerEvent?"pointerdown":"touchstart mousedown",P=q.PointerEvent?"pointermove":"mousemove touchmove",j=q.PointerEvent?"pointerup pointercancel":"touchend touchcancel mouseup",B=["zoom-in","zoom-out","one-to-one","reset","prev","play","next","rotate-left","rotate-right","flip-horizontal","flip-vertical"],H="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},V=Number.isNaN||q.isNaN,K=Object.prototype.hasOwnProperty,U=/^(width|height|left|top|marginLeft|marginTop)$/,Z=/([a-z\d])([A-Z])/g,$=/\s+/,_=q.navigator,G=_&&/(Macintosh|iPhone|iPod|iPad).*AppleWebKit/i.test(_.userAgent),J={render:function(){this.initContainer(),this.initViewer(),this.initList(),this.renderViewer()},initContainer:function(){this.containerData={width:window.innerWidth,height:window.innerHeight}},initViewer:function(){var t=this.options,e=this.parent,i=void 0;t.inline&&(i={width:Math.max(e.offsetWidth,t.minWidth),height:Math.max(e.offsetHeight,t.minHeight)},this.parentData=i),!this.fulled&&i||(i=this.containerData),this.viewerData=a({},i)},renderViewer:function(){this.options.inline&&!this.fulled&&l(this.viewer,this.viewerData)},initList:function(){var e=this,i=this.element,n=this.options,s=this.list,a=[];r(this.images,function(e,i){var s=e.src,r=e.alt||z(s),h=n.url;t(h)?h=e.getAttribute(h):o(h)&&(h=h.call(e,e)),(s||h)&&a.push('<li><img src="'+(s||h)+'" role="button" data-action="view" data-index="'+i+'" data-original-url="'+(h||s)+'" alt="'+r+'"></li>')}),s.innerHTML=a.join(""),r(s.getElementsByTagName("img"),function(t){w(t,"filled",!0),y(t,"load",h(e.loadImage,e),{once:!0})}),this.items=s.getElementsByTagName("li"),n.transition&&y(i,"viewed",function(){d(s,R)},{once:!0})},renderList:function(t){var e=t||this.index,i=this.items[e].offsetWidth||30,n=i+1;l(this.list,{width:n*this.length,marginLeft:(this.viewerData.width-i)/2-n*e})},resetList:function(){k(this.list),v(this.list,R),l({marginLeft:0})},initImage:function(t){var e=this,i=this.options,n=this.image,s=this.viewerData,r=this.footer.offsetHeight,h=s.width,l=Math.max(s.height-r,r),c=this.ImageData||{};I(n,function(n,s){var r=n/s,u=h,d=l;l*r>h?d=h/r:u=l*r;var v={naturalWidth:n,naturalHeight:s,aspectRatio:r,ratio:(u=Math.min(.9*u,n))/n,width:u,height:d=Math.min(.9*d,s),left:(h-u)/2,top:(l-d)/2},f=a({},v);i.rotatable&&(v.rotate=c.rotate||0,f.rotate=0),i.scalable&&(v.scaleX=c.scaleX||1,v.scaleY=c.scaleY||1,f.scaleX=1,f.scaleY=1),e.imageData=v,e.initialImageData=f,o(t)&&t()})},renderImage:function(t){var e=this.image,i=this.imageData;l(e,a({width:i.width,height:i.height,marginLeft:i.left,marginTop:i.top},E(i))),o(t)&&(this.transitioning?y(e,"transitionend",t,{once:!0}):t())},resetImage:function(){var t=this.image;t&&(t.parentNode.removeChild(t),this.image=null)}},Q={bind:function(){var t=this.element,e=this.options,i=this.viewer;o(e.view)&&y(t,"view",e.view),o(e.viewed)&&y(t,"viewed",e.viewed),y(i,"click",this.onClick=h(this.click,this)),y(i,"wheel mousewheel DOMMouseScroll",this.onWheel=h(this.wheel,this)),y(i,"dragstart",this.onDragStart=h(this.dragstart,this)),y(this.canvas,W,this.onPointerDown=h(this.pointerdown,this)),y(t.ownerDocument,P,this.onPointerMove=h(this.pointermove,this)),y(t.ownerDocument,j,this.onPointerUp=h(this.pointerup,this)),y(t.ownerDocument,"keydown",this.onKeyDown=h(this.keydown,this)),y(window,"resize",this.onResize=h(this.resize,this))},unbind:function(){var t=this.element,e=this.options,i=this.viewer;o(e.view)&&b(t,"view",e.view),o(e.viewed)&&b(t,"viewed",e.viewed),b(i,"click",this.onClick),b(i,"wheel mousewheel DOMMouseScroll",this.onWheel),b(i,"dragstart",this.onDragStart),b(this.canvas,W,this.onPointerDown),b(t.ownerDocument,P,this.onPointerMove),b(t.ownerDocument,j,this.onPointerUp),b(t.ownerDocument,"keydown",this.onKeyDown),b(window,"resize",this.onResize)}},tt={click:function(t){var e=t.target,i=this.options,n=this.imageData;switch(g(e,"action")){case"mix":this.played?this.stop():i.inline?this.fulled?this.exit():this.full():this.hide();break;case"view":this.view(g(e,"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(i.loop);break;case"play":this.play();break;case"next":this.next(i.loop);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.played&&this.stop()}},load:function(){var t=this,e=this.options,i=this.image,n=this.index,s=this.viewerData;this.timeout&&(clearTimeout(this.timeout),this.timeout=!1),i&&(v(i,"viewer-invisible"),i.style.cssText="width:0;height:0;margin-left:"+s.width/2+"px;margin-top:"+s.height/2+"px;max-width:none!important;visibility:visible;",this.initImage(function(){f(i,R,e.transition),f(i,"viewer-move",e.movable),t.renderImage(function(){t.viewed=!0,x(t.element,"viewed",{originalImage:t.images[n],index:n,image:i})})}))},loadImage:function(t){var e=t.target,i=e.parentNode,n=i.offsetWidth||30,s=i.offsetHeight||50,o=!!g(e,"filled");I(e,function(t,i){var r=t/i,a=n,h=s;s*r>n?o?a=s*r:h=n/r:o?h=n/r:a=s*r,l(e,{width:a,height:h,marginLeft:(n-a)/2,marginTop:(s-h)/2})})},keydown:function(t){var e=this.options,i=t.keyCode||t.which||t.charCode;if(this.fulled&&e.keyboard)switch(i){case 27:this.played?this.stop():e.inline?this.fulled&&this.exit():this.hide();break;case 32:this.played&&this.stop();break;case 37:this.prev(e.loop);break;case 38:t.preventDefault(),this.zoom(e.zoomRatio,!0);break;case 39:this.next(e.loop);break;case 40:t.preventDefault(),this.zoom(-e.zoomRatio,!0);break;case 48:case 49:(t.ctrlKey||t.shiftKey)&&(t.preventDefault(),this.toggle())}},dragstart:function(t){"img"===t.target.tagName.toLowerCase()&&t.preventDefault()},pointerdown:function(t){var e=this.options,i=this.pointers;if(this.viewed&&!this.transitioning){t.changedTouches?r(t.changedTouches,function(t){i[t.identifier]=L(t)}):i[t.pointerId||0]=L(t);var n=!!e.movable&&"move";Object.keys(i).length>1?n="zoom":"touch"!==t.pointerType&&"touchstart"!==t.type||!this.isSwitchable()||(n="switch"),this.action=n}},pointermove:function(t){var e=this.options,i=this.pointers,n=this.action,s=this.image;this.viewed&&n&&(t.preventDefault(),t.changedTouches?r(t.changedTouches,function(t){a(i[t.identifier],L(t,!0))}):a(i[t.pointerId||0],L(t,!0)),"move"===n&&e.transition&&u(s,R)&&v(s,R),this.change(t))},pointerup:function(t){var e=this.action,i=this.pointers;t.changedTouches?r(t.changedTouches,function(t){delete i[t.identifier]}):delete i[t.pointerId||0],e&&("move"===e&&this.options.transition&&d(this.image,R),this.action=!1)},resize:function(){var t=this;if(this.initContainer(),this.initViewer(),this.renderViewer(),this.renderList(),this.viewed&&this.initImage(function(){t.renderImage()}),this.played){if(this.options.fullscreen&&this.fulled&&!document.fullscreenElement&&!document.mozFullScreenElement&&!document.webkitFullscreenElement&&!document.msFullscreenElement)return void this.stop();r(this.player.getElementsByTagName("img"),function(e){y(e,"load",h(t.loadImage,t),{once:!0}),x(e,"load")})}},start:function(t){var e=t.target;"img"===e.tagName.toLowerCase()&&-1!==this.images.indexOf(e)&&(this.target=e,this.show())},wheel:function(t){var e=this;if(this.viewed&&(t.preventDefault(),!this.wheeling)){this.wheeling=!0,setTimeout(function(){e.wheeling=!1},50);var i=Number(this.options.zoomRatio)||.1,n=1;t.deltaY?n=t.deltaY>0?1:-1:t.wheelDelta?n=-t.wheelDelta/120:t.detail&&(n=t.detail>0?1:-1),this.zoom(-n*i,!0,t)}}},et={show:function(){var t=this,e=this.element,i=this.options;if(i.inline||this.transitioning||this.visible)return this;if(this.ready||this.build(),o(i.show)&&y(e,"show",i.show,{once:!0}),!1===x(e,"show"))return this;this.open();var n=this.viewer;return v(n,"viewer-hide"),y(e,"shown",function(){t.view(t.target?[].concat(N(t.images)).indexOf(t.target):t.index),t.target=!1},{once:!0}),i.transition?(this.transitioning=!0,d(n,R),n.offsetWidth,y(n,"transitionend",h(this.shown,this),{once:!0}),d(n,O)):(d(n,O),this.shown()),this},hide:function(){var t=this,e=this.element,i=this.options,n=this.viewer;return i.inline||this.transitioning||!this.visible?this:(o(i.hide)&&y(e,"hide",i.hide,{once:!0}),!1===x(e,"hide")?this:(this.viewed&&i.transition?(this.transitioning=!0,y(this.image,"transitionend",function(){y(n,"transitionend",h(t.hidden,t),{once:!0}),v(n,O)},{once:!0}),this.zoomTo(0,!1,!1,!0)):(v(n,O),this.hidden()),this))},view:function(t){var e=this,i=this.element,n=this.title,s=this.canvas;if(t=Number(t)||0,!this.ready||!this.visible||this.played||t<0||t>=this.length||this.viewed&&t===this.index)return this;var o=this.items[t],r=o.querySelector("img"),a=g(r,"originalUrl"),l=r.getAttribute("alt"),c=document.createElement("img");return c.src=a,c.alt=l,!1===x(i,"view",{originalImage:this.images[t],index:t,image:c})?this:(this.image=c,v(this.items[this.index],"viewer-active"),d(o,"viewer-active"),this.viewed=!1,this.index=t,this.imageData=null,d(c,"viewer-invisible"),k(s),s.appendChild(c),this.renderList(),k(n),y(i,"viewed",function(){var t=e.imageData;n.textContent=l+" ("+t.naturalWidth+" × "+t.naturalHeight+")"},{once:!0}),c.complete?this.load():(y(c,"load",h(this.load,this),{once:!0}),this.timeout&&clearTimeout(this.timeout),this.timeout=setTimeout(function(){v(c,"viewer-invisible"),e.timeout=!1},1e3)),this)},prev:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.index-1;return e<0&&(e=t?this.length-1:0),this.view(e),this},next:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.length-1,i=this.index+1;return i>e&&(i=t?0:e),this.view(i),this},move:function(t,e){var n=this.imageData;return this.moveTo(i(t)?t:n.left+Number(t),i(e)?e:n.top+Number(e)),this},moveTo:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=this.imageData;if(t=Number(t),i=Number(i),this.viewed&&!this.played&&this.options.movable){var s=!1;e(t)&&(n.left=t,s=!0),e(i)&&(n.top=i,s=!0),s&&this.renderImage()}return this},zoom:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n=this.imageData;return t=Number(t),t=t<0?1/(1-t):1+t,this.zoomTo(n.width*t/n.naturalWidth,e,i),this},zoomTo:function(t){var i=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,s=arguments.length>3&&void 0!==arguments[3]&&arguments[3],o=this.options,r=this.pointers,a=this.imageData;if(t=Math.max(0,t),e(t)&&this.viewed&&!this.played&&(s||o.zoomable)){if(!s){var h=Math.max(.01,o.minZoomRatio),l=Math.min(100,o.maxZoomRatio);t=Math.min(Math.max(t,h),l)}n&&t>.95&&t<1.05&&(t=1);var c=a.naturalWidth*t,u=a.naturalHeight*t;if(n){var d=D(this.viewer),v=r&&Object.keys(r).length?C(r):{pageX:n.pageX,pageY:n.pageY};a.left-=(c-a.width)*((v.pageX-d.left-a.left)/a.width),a.top-=(u-a.height)*((v.pageY-d.top-a.top)/a.height)}else a.left-=(c-a.width)/2,a.top-=(u-a.height)/2;a.width=c,a.height=u,a.ratio=t,this.renderImage(),i&&this.tooltip()}return this},rotate:function(t){return this.rotateTo((this.imageData.rotate||0)+Number(t)),this},rotateTo:function(t){var i=this.imageData;return t=Number(t),e(t)&&this.viewed&&!this.played&&this.options.rotatable&&(i.rotate=t,this.renderImage()),this},scaleX:function(t){return this.scale(t,this.imageData.scaleY),this},scaleY:function(t){return this.scale(this.imageData.scaleX,t),this},scale:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=this.imageData;if(t=Number(t),i=Number(i),this.viewed&&!this.played&&this.options.scalable){var s=!1;e(t)&&(n.scaleX=t,s=!0),e(i)&&(n.scaleY=i,s=!0),s&&this.renderImage()}return this},play:function(){var t=this,i=this.options,n=this.player,s=h(this.loadImage,this),o=[],a=0,l=0;if(!this.visible||this.played)return this;if(i.fullscreen&&this.requestFullscreen(),this.played=!0,this.onLoadWhenPlay=s,d(n,"viewer-show"),r(this.items,function(t,e){var r=t.querySelector("img"),h=document.createElement("img");h.src=g(r,"originalUrl"),h.alt=r.getAttribute("alt"),a+=1,d(h,"viewer-fade"),f(h,R,i.transition),u(t,"viewer-active")&&(d(h,O),l=e),o.push(h),y(h,"load",s,{once:!0}),n.appendChild(h)}),e(i.interval)&&i.interval>0){a>1&&function e(){t.playing=setTimeout(function(){v(o[l],O),d(o[l=(l+=1)<a?l:0],O),e()},i.interval)}()}return this},stop:function(){var t=this,e=this.player;return this.played?(this.options.fullscreen&&this.exitFullscreen(),this.played=!1,clearTimeout(this.playing),r(this.player.getElementsByTagName("img"),function(e){e.complete||b(e,"load",t.onLoadWhenPlay)}),v(e,"viewer-show"),k(e),this):this},full:function(){var t=this,e=this.options,i=this.viewer,n=this.image,s=this.list;return!this.visible||this.played||this.fulled||!e.inline?this:(this.fulled=!0,this.open(),d(this.button,"viewer-fullscreen-exit"),e.transition&&(v(n,R),v(s,R)),d(i,"viewer-fixed"),i.setAttribute("style",""),l(i,{zIndex:e.zIndex}),this.initContainer(),this.viewerData=a({},this.containerData),this.renderList(),this.initImage(function(){t.renderImage(function(){e.transition&&setTimeout(function(){d(n,R),d(s,R)},0)})}),this)},exit:function(){var t=this,e=this.options,i=this.viewer,n=this.image,s=this.list;return this.fulled?(this.fulled=!1,this.close(),v(this.button,"viewer-fullscreen-exit"),e.transition&&(v(n,R),v(s,R)),v(i,"viewer-fixed"),l(i,{zIndex:e.zIndexInline}),this.viewerData=a({},this.parentData),this.renderViewer(),this.renderList(),this.initImage(function(){t.renderImage(function(){e.transition&&setTimeout(function(){d(n,R),d(s,R)},0)})}),this):this},tooltip:function(){var t=this,e=this.options,i=this.tooltipBox,n=this.imageData;return this.viewed&&!this.played&&e.tooltip?(i.textContent=Math.round(100*n.ratio)+"%",this.tooltiping?clearTimeout(this.tooltiping):e.transition?(this.fading&&x(i,"transitionend"),d(i,"viewer-show"),d(i,"viewer-fade"),d(i,R),i.offsetWidth,d(i,O)):d(i,"viewer-show"),this.tooltiping=setTimeout(function(){e.transition?(y(i,"transitionend",function(){v(i,"viewer-show"),v(i,"viewer-fade"),v(i,R),t.fading=!1},{once:!0}),v(i,O),t.fading=!0):v(i,"viewer-show"),t.tooltiping=!1},1e3),this):this},toggle:function(){return 1===this.imageData.ratio?this.zoomTo(this.initialImageData.ratio,!0):this.zoomTo(1,!0),this},reset:function(){return this.viewed&&!this.played&&(this.imageData=a({},this.initialImageData),this.renderImage()),this},update:function(){var t=this.element,e=this.options,i=this.isImg,n=[];if(i&&!t.parentNode)return this.destroy();var s=[];if(r(i?[t]:t.querySelectorAll("img"),function(t){e.filter?e.filter(t)&&s.push(t):s.push(t)}),this.images=s,this.length=s.length,this.ready&&(r(this.items,function(t,e){var i=t.querySelector("img"),o=s[e];o?o.src!==i.src&&n.push(e):n.push(e)}),l(this.list,{width:"auto"}),this.initList(),this.visible))if(this.length){if(this.viewed){var o=n.indexOf(this.index);o>=0?(this.viewed=!1,this.view(Math.max(this.index-(o+1),0))):d(this.items[this.index],"viewer-active")}}else this.image=null,this.viewed=!1,this.index=0,this.imageData=null,k(this.canvas),k(this.title);return this},destroy:function(){var t=this.element;return g(t,"viewer")?(this.options.inline?this.unbind():(this.visible&&this.unbind(),b(t,"click",this.onStart)),this.close(),this.unbuild(),p(t,"viewer"),this):this}},it={open:function(){var t=this.body;d(t,"viewer-open"),t.style.paddingRight=this.scrollbarWidth+(parseFloat(this.initialBodyPaddingRight)||0)+"px"},close:function(){var t=this.body;v(t,"viewer-open"),t.style.paddingRight=this.initialBodyPaddingRight},shown:function(){var t=this.element,e=this.options;this.transitioning=!1,this.fulled=!0,this.visible=!0,this.render(),this.bind(),o(e.shown)&&y(t,"shown",e.shown,{once:!0}),x(t,"shown")},hidden:function(){var t=this.element,e=this.options;this.transitioning=!1,this.viewed=!1,this.fulled=!1,this.visible=!1,this.close(),this.unbind(),d(this.viewer,"viewer-hide"),this.resetList(),this.resetImage(),o(e.hidden)&&y(t,"hidden",e.hidden,{once:!0}),x(t,"hidden")},requestFullscreen:function(){var t=window.document;if(this.fulled&&!t.fullscreenElement&&!t.mozFullScreenElement&&!t.webkitFullscreenElement&&!t.msFullscreenElement){var e=t.documentElement;e.requestFullscreen?e.requestFullscreen():e.msRequestFullscreen?e.msRequestFullscreen():e.mozRequestFullScreen?e.mozRequestFullScreen():e.webkitRequestFullscreen&&e.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT)}},exitFullscreen:function(){this.fulled&&(document.exitFullscreen?document.exitFullscreen():document.msExitFullscreen?document.msExitFullscreen():document.mozCancelFullScreen?document.mozCancelFullScreen():document.webkitExitFullscreen&&document.webkitExitFullscreen())},change:function(t){var e=this.options,i=this.pointers,n=i[Object.keys(i)[0]],s=n.endX-n.startX,o=n.endY-n.startY;switch(this.action){case"move":this.move(s,o);break;case"zoom":this.zoom(S(i),!1,t);break;case"switch":this.action="switched",Math.abs(s)>Math.abs(o)&&(s>1?this.prev(e.loop):s<-1&&this.next(e.loop))}r(i,function(t){t.startX=t.endX,t.startY=t.endY})},isSwitchable:function(){var t=this.imageData,e=this.viewerData;return this.length>1&&t.left>=0&&t.top>=0&&t.width<=e.width&&t.height<=e.height}},nt=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}(),st=q.Viewer,ot=function(){function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(M(this,t),!e||1!==e.nodeType)throw new Error("The first argument is required and must be an element.");this.element=e,this.options=a({},Y,s(i)&&i),this.isImg=!1,this.ready=!1,this.visible=!1,this.viewed=!1,this.fulled=!1,this.played=!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.pointers={},this.init()}return nt(t,[{key:"init",value:function(){var t=this,e=this.element,n=this.options;if(!g(e,"viewer")){w(e,"viewer",this);var s="img"===e.tagName.toLowerCase(),a=[];r(s?[e]:e.querySelectorAll("img"),function(t){n.filter?n.filter(t)&&a.push(t):a.push(t)});var l=a.length;if(l){o(n.ready)&&y(e,"ready",n.ready,{once:!0}),i(document.createElement("viewer").style.transition)&&(n.transition=!1),this.isImg=s,this.length=l,this.count=0,this.images=a;var u=document.body;if(this.body=u,this.scrollbarWidth=window.innerWidth-document.documentElement.clientWidth,this.initialBodyPaddingRight=c(u).paddingRight,n.inline){var d=h(this.progress,this);y(e,"ready",function(){t.view()},{once:!0}),r(a,function(t){t.complete?d():y(t,"load",d,{once:!0})})}else y(e,"click",this.onStart=h(this.start,this))}}}},{key:"progress",value:function(){this.count+=1,this.count===this.length&&this.build()}},{key:"build",value:function(){var t=this.options,n=this.element;if(!this.ready){var a=n.parentNode,h=document.createElement("div");h.innerHTML='<div class="viewer-container"><div class="viewer-canvas"></div><div class="viewer-footer"><div class="viewer-title"></div><div class="viewer-toolbar"></div><div class="viewer-navbar"><ul class="viewer-list"></ul></div></div><div class="viewer-tooltip"></div><div role="button" class="viewer-button" data-action="mix"></div><div class="viewer-player"></div></div>';var u=h.querySelector(".viewer-container"),v=u.querySelector(".viewer-title"),g=u.querySelector(".viewer-toolbar"),p=u.querySelector(".viewer-navbar"),b=u.querySelector(".viewer-button");if(this.parent=a,this.viewer=u,this.title=v,this.toolbar=g,this.navbar=p,this.button=b,this.canvas=u.querySelector(".viewer-canvas"),this.footer=u.querySelector(".viewer-footer"),this.tooltipBox=u.querySelector(".viewer-tooltip"),this.player=u.querySelector(".viewer-player"),this.list=u.querySelector(".viewer-list"),d(v,t.title?T(t.title):"viewer-hide"),d(p,t.navbar?T(t.navbar):"viewer-hide"),f(b,"viewer-hide",!t.button),t.toolbar){var D=document.createElement("ul"),k=s(t.toolbar),E=B.slice(0,3),z=B.slice(7,9),I=B.slice(9);k||d(g,T(t.toolbar)),r(k?t.toolbar:B,function(n,r){var a=k&&s(n),h=k?m(r):n,l=a&&!i(n.show)?n.show:n;if(l&&(t.zoomable||-1===E.indexOf(h))&&(t.rotatable||-1===z.indexOf(h))&&(t.scalable||-1===I.indexOf(h))){var c=a&&!i(n.size)?n.size:n,u=a&&!i(n.click)?n.click:n,v=document.createElement("li");v.setAttribute("role","button"),d(v,"viewer-"+h),o(u)||w(v,"action",h),e(l)&&d(v,T(l)),-1!==["small","large"].indexOf(c)?d(v,"viewer-"+c):"play"===h&&d(v,"viewer-large"),o(u)&&y(v,"click",u),D.appendChild(v)}}),g.appendChild(D)}else d(g,"viewer-hide");if(!t.rotatable){var S=g.querySelectorAll('li[class*="rotate"]');d(S,"viewer-invisible"),r(S,function(t){g.appendChild(t)})}t.inline?(d(b,"viewer-fullscreen"),l(u,{zIndex:t.zIndexInline}),"static"===c(a).position&&l(a,{position:"relative"}),a.insertBefore(u,n.nextSibling)):(d(b,"viewer-close"),d(u,"viewer-fixed"),d(u,"viewer-fade"),d(u,"viewer-hide"),l(u,{zIndex:t.zIndex}),this.body.appendChild(u)),t.inline&&(this.render(),this.bind(),this.visible=!0),this.ready=!0,x(n,"ready")}}},{key:"unbuild",value:function(){this.ready&&(this.ready=!1,this.viewer.parentNode.removeChild(this.viewer))}}],[{key:"noConflict",value:function(){return window.Viewer=st,t}},{key:"setDefaults",value:function(t){a(Y,s(t)&&t)}}]),t}();return a(ot.prototype,J,Q,tt,et,it),ot}); | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.Viewer=e()}(this,function(){"use strict";function t(t){return"string"==typeof t}function e(t){return"number"==typeof t&&!tt(t)}function i(t){return void 0===t}function n(t){return"object"===(void 0===t?"undefined":G(t))&&null!==t}function s(t){if(!n(t))return!1;try{var e=t.constructor,i=e.prototype;return e&&i&&et.call(i,"isPrototypeOf")}catch(t){return!1}}function o(t){return"function"==typeof t}function a(t,i){if(t&&o(i))if(Array.isArray(t)||e(t.length)){var s=t.length,a=void 0;for(a=0;a<s&&!1!==i.call(t,t[a],a,t);a+=1);}else n(t)&&Object.keys(t).forEach(function(e){i.call(t,t[e],e,t)});return t}function r(t){for(var e=arguments.length,i=Array(e>1?e-1:0),s=1;s<e;s++)i[s-1]=arguments[s];if(n(t)&&i.length>0){if(Object.assign)return Object.assign.apply(Object,[t].concat(i));i.forEach(function(e){n(e)&&Object.keys(e).forEach(function(i){t[i]=e[i]})})}return t}function h(t,e){for(var i=arguments.length,n=Array(i>2?i-2:0),s=2;s<i;s++)n[s-2]=arguments[s];return function(){for(var i=arguments.length,s=Array(i),o=0;o<i;o++)s[o]=arguments[o];return t.apply(e,n.concat(s))}}function l(t,i){var n=t.style;a(i,function(t,i){it.test(i)&&e(t)&&(t+="px"),n[i]=t})}function c(t){return window.getComputedStyle?window.getComputedStyle(t,null):t.currentStyle}function u(t,e){return t.classList?t.classList.contains(e):t.className.indexOf(e)>-1}function d(t,i){if(i)if(e(t.length))a(t,function(t){d(t,i)});else if(t.classList)t.classList.add(i);else{var n=t.className.trim();n?n.indexOf(i)<0&&(t.className=n+" "+i):t.className=i}}function f(t,i){i&&(e(t.length)?a(t,function(t){f(t,i)}):t.classList?t.classList.remove(i):t.className.indexOf(i)>=0&&(t.className=t.className.replace(i,"")))}function m(t,i,n){i&&(e(t.length)?a(t,function(t){m(t,i,n)}):n?d(t,i):f(t,i))}function v(t){return t.replace(nt,"$1-$2").toLowerCase()}function g(t,e){return n(t[e])?t[e]:t.dataset?t.dataset[e]:t.getAttribute("data-"+v(e))}function p(t,e,i){n(i)?t[e]=i:t.dataset?t.dataset[e]=i:t.setAttribute("data-"+v(e),i)}function w(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(o(i)){var s=e.trim().split(st);s.length>1?a(s,function(e){w(t,e,i,n)}):t.removeEventListener?t.removeEventListener(e,i,n):t.detachEvent&&t.detachEvent("on"+e,i)}}function b(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};if(o(i)){var s=e.trim().split(st);if(s.length>1)a(s,function(e){b(t,e,i,n)});else{if(n.once){var r=i;i=function(){for(var s=arguments.length,o=Array(s),a=0;a<s;a++)o[a]=arguments[a];return w(t,e,i,n),r.apply(t,o)}}t.addEventListener?t.addEventListener(e,i,n):t.attachEvent&&t.attachEvent("on"+e,i)}}}function y(t,e,n){if(t.dispatchEvent){var s=void 0;return o(Event)&&o(CustomEvent)?s=i(n)?new Event(e,{bubbles:!0,cancelable:!0}):new CustomEvent(e,{detail:n,bubbles:!0,cancelable:!0}):i(n)?(s=document.createEvent("Event")).initEvent(e,!0,!0):(s=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,n),t.dispatchEvent(s)}return!t.fireEvent||t.fireEvent("on"+e)}function x(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function E(t,e){if(!t.naturalWidth||at){var i=document.createElement("img"),n=document.body||document.documentElement;i.onload=function(){e(i.width,i.height),n.removeChild(i)},i.src=t.src,i.style.cssText="position: absolute; top: 0; left: 0; z-index: -1; opacity: 0;",n.appendChild(i)}else e(t.naturalWidth,t.naturalHeight)}function D(t){switch(t){case 2:return X;case 3:return F;case 4:return M;default:return""}}function k(t,e){var i=t.pageX,n=t.pageY,s={endX:i,endY:n};return e?s:r({startX:i,startY:n},s)}var z={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,loop:!1,minWidth:200,minHeight:100,zoomRatio:.1,minZoomRatio:.01,maxZoomRatio:100,zIndex:2015,zIndexInline:0,url:"src",filter:null,ready:null,show:null,shown:null,hide:null,hidden:null,view:null,viewed:null},I="undefined"!=typeof window?window:{},T="viewer",C="move",S=T+"-active",L=T+"-fade",N=T+"-fixed",Y=T+"-fullscreen-exit",q=T+"-hide",M=T+"-hide-md-down",F=T+"-hide-sm-down",X=T+"-hide-xs-down",O=T+"-in",R=T+"-invisible",W=T+"-open",A=T+"-show",P=T+"-transition",j="viewed",B="click",H="load",V=I.PointerEvent?"pointerdown":"touchstart mousedown",K=I.PointerEvent?"pointermove":"mousemove touchmove",U=I.PointerEvent?"pointerup pointercancel":"touchend touchcancel mouseup",Z="transitionend",$="wheel mousewheel DOMMouseScroll",_=["zoom-in","zoom-out","one-to-one","reset","prev","play","next","rotate-left","rotate-right","flip-horizontal","flip-vertical"],G="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},J=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},Q=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}(),tt=Number.isNaN||I.isNaN,et=Object.prototype.hasOwnProperty,it=/^(width|height|left|top|marginLeft|marginTop)$/,nt=/([a-z\d])([A-Z])/g,st=/\s+/,ot=I.navigator,at=ot&&/(Macintosh|iPhone|iPod|iPad).*AppleWebKit/i.test(ot.userAgent),rt={render:function(){this.initContainer(),this.initViewer(),this.initList(),this.renderViewer()},initContainer:function(){this.containerData={width:window.innerWidth,height:window.innerHeight}},initViewer:function(){var t=this.options,e=this.parent,i=void 0;t.inline&&(i={width:Math.max(e.offsetWidth,t.minWidth),height:Math.max(e.offsetHeight,t.minHeight)},this.parentData=i),!this.fulled&&i||(i=this.containerData),this.viewerData=r({},i)},renderViewer:function(){this.options.inline&&!this.fulled&&l(this.viewer,this.viewerData)},initList:function(){var e=this,i=this.element,n=this.options,s=this.list,r=[];a(this.images,function(e,i){var s=e.src,a=e.alt||function(e){return t(e)?e.replace(/^.*\//,"").replace(/[?&#].*$/,""):""}(s),h=n.url;t(h)?h=e.getAttribute(h):o(h)&&(h=h.call(e,e)),(s||h)&&r.push('<li><img src="'+(s||h)+'" role="button" data-action="view" data-index="'+i+'" data-original-url="'+(h||s)+'" alt="'+a+'"></li>')}),s.innerHTML=r.join(""),a(s.getElementsByTagName("img"),function(t){p(t,"filled",!0),b(t,H,h(e.loadImage,e),{once:!0})}),this.items=s.getElementsByTagName("li"),n.transition&&b(i,j,function(){d(s,P)},{once:!0})},renderList:function(t){var e=t||this.index,i=this.items[e].offsetWidth||30,n=i+1;l(this.list,{width:n*this.length,marginLeft:(this.viewerData.width-i)/2-n*e})},resetList:function(){x(this.list),f(this.list,P),l({marginLeft:0})},initImage:function(t){var e=this,i=this.options,n=this.image,s=this.viewerData,a=this.footer.offsetHeight,h=s.width,l=Math.max(s.height-a,a),c=this.ImageData||{};E(n,function(n,s){var a=n/s,u=h,d=l;l*a>h?d=h/a:u=l*a;var f={naturalWidth:n,naturalHeight:s,aspectRatio:a,ratio:(u=Math.min(.9*u,n))/n,width:u,height:d=Math.min(.9*d,s),left:(h-u)/2,top:(l-d)/2},m=r({},f);i.rotatable&&(f.rotate=c.rotate||0,m.rotate=0),i.scalable&&(f.scaleX=c.scaleX||1,f.scaleY=c.scaleY||1,m.scaleX=1,m.scaleY=1),e.imageData=f,e.initialImageData=m,o(t)&&t()})},renderImage:function(t){var i=this.image,n=this.imageData;l(i,r({width:n.width,height:n.height,marginLeft:n.left,marginTop:n.top},function(t){var i=t.rotate,n=t.scaleX,s=t.scaleY,o=[];e(i)&&0!==i&&o.push("rotate("+i+"deg)"),e(n)&&1!==n&&o.push("scaleX("+n+")"),e(s)&&1!==s&&o.push("scaleY("+s+")");var a=o.length?o.join(" "):"none";return{WebkitTransform:a,msTransform:a,transform:a}}(n))),o(t)&&(this.transitioning?b(i,Z,t,{once:!0}):t())},resetImage:function(){var t=this.image;t&&(t.parentNode.removeChild(t),this.image=null)}},ht={bind:function(){var t=this.element,e=this.options,i=this.viewer;o(e.view)&&b(t,"view",e.view),o(e.viewed)&&b(t,j,e.viewed),b(i,B,this.onClick=h(this.click,this)),b(i,$,this.onWheel=h(this.wheel,this)),b(i,"dragstart",this.onDragStart=h(this.dragstart,this)),b(this.canvas,V,this.onPointerDown=h(this.pointerdown,this)),b(t.ownerDocument,K,this.onPointerMove=h(this.pointermove,this)),b(t.ownerDocument,U,this.onPointerUp=h(this.pointerup,this)),b(t.ownerDocument,"keydown",this.onKeyDown=h(this.keydown,this)),b(window,"resize",this.onResize=h(this.resize,this))},unbind:function(){var t=this.element,e=this.options,i=this.viewer;o(e.view)&&w(t,"view",e.view),o(e.viewed)&&w(t,j,e.viewed),w(i,B,this.onClick),w(i,$,this.onWheel),w(i,"dragstart",this.onDragStart),w(this.canvas,V,this.onPointerDown),w(t.ownerDocument,K,this.onPointerMove),w(t.ownerDocument,U,this.onPointerUp),w(t.ownerDocument,"keydown",this.onKeyDown),w(window,"resize",this.onResize)}},lt={click:function(t){var e=t.target,i=this.options,n=this.imageData;switch(g(e,"action")){case"mix":this.played?this.stop():i.inline?this.fulled?this.exit():this.full():this.hide();break;case"view":this.view(g(e,"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(i.loop);break;case"play":this.play();break;case"next":this.next(i.loop);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.played&&this.stop()}},load:function(){var t=this,e=this.options,i=this.image,n=this.index,s=this.viewerData;this.timeout&&(clearTimeout(this.timeout),this.timeout=!1),i&&(f(i,R),i.style.cssText="width:0;height:0;margin-left:"+s.width/2+"px;margin-top:"+s.height/2+"px;max-width:none!important;visibility:visible;",this.initImage(function(){m(i,P,e.transition),m(i,"viewer-move",e.movable),t.renderImage(function(){t.viewed=!0,y(t.element,j,{originalImage:t.images[n],index:n,image:i})})}))},loadImage:function(t){var e=t.target,i=e.parentNode,n=i.offsetWidth||30,s=i.offsetHeight||50,o=!!g(e,"filled");E(e,function(t,i){var a=t/i,r=n,h=s;s*a>n?o?r=s*a:h=n/a:o?h=n/a:r=s*a,l(e,{width:r,height:h,marginLeft:(n-r)/2,marginTop:(s-h)/2})})},keydown:function(t){var e=this.options,i=t.keyCode||t.which||t.charCode;if(this.fulled&&e.keyboard)switch(i){case 27:this.played?this.stop():e.inline?this.fulled&&this.exit():this.hide();break;case 32:this.played&&this.stop();break;case 37:this.prev(e.loop);break;case 38:t.preventDefault(),this.zoom(e.zoomRatio,!0);break;case 39:this.next(e.loop);break;case 40:t.preventDefault(),this.zoom(-e.zoomRatio,!0);break;case 48:case 49:(t.ctrlKey||t.shiftKey)&&(t.preventDefault(),this.toggle())}},dragstart:function(t){"img"===t.target.tagName.toLowerCase()&&t.preventDefault()},pointerdown:function(t){var e=this.options,i=this.pointers;if(this.viewed&&!this.transitioning){t.changedTouches?a(t.changedTouches,function(t){i[t.identifier]=k(t)}):i[t.pointerId||0]=k(t);var n=!!e.movable&&C;Object.keys(i).length>1?n="zoom":"touch"!==t.pointerType&&"touchstart"!==t.type||!this.isSwitchable()||(n="switch"),this.action=n}},pointermove:function(t){var e=this.options,i=this.pointers,n=this.action,s=this.image;this.viewed&&n&&(t.preventDefault(),t.changedTouches?a(t.changedTouches,function(t){r(i[t.identifier],k(t,!0))}):r(i[t.pointerId||0],k(t,!0)),n===C&&e.transition&&u(s,P)&&f(s,P),this.change(t))},pointerup:function(t){var e=this.action,i=this.pointers;t.changedTouches?a(t.changedTouches,function(t){delete i[t.identifier]}):delete i[t.pointerId||0],e&&(e===C&&this.options.transition&&d(this.image,P),this.action=!1)},resize:function(){var t=this;if(this.initContainer(),this.initViewer(),this.renderViewer(),this.renderList(),this.viewed&&this.initImage(function(){t.renderImage()}),this.played){if(this.options.fullscreen&&this.fulled&&!document.fullscreenElement&&!document.mozFullScreenElement&&!document.webkitFullscreenElement&&!document.msFullscreenElement)return void this.stop();a(this.player.getElementsByTagName("img"),function(e){b(e,H,h(t.loadImage,t),{once:!0}),y(e,H)})}},start:function(t){var e=t.target;"img"===e.tagName.toLowerCase()&&-1!==this.images.indexOf(e)&&(this.target=e,this.show())},wheel:function(t){var e=this;if(this.viewed&&(t.preventDefault(),!this.wheeling)){this.wheeling=!0,setTimeout(function(){e.wheeling=!1},50);var i=Number(this.options.zoomRatio)||.1,n=1;t.deltaY?n=t.deltaY>0?1:-1:t.wheelDelta?n=-t.wheelDelta/120:t.detail&&(n=t.detail>0?1:-1),this.zoom(-n*i,!0,t)}}},ct={show:function(){var t=this,e=this.element,i=this.options;if(i.inline||this.transitioning||this.visible)return this;if(this.ready||this.build(),o(i.show)&&b(e,"show",i.show,{once:!0}),!1===y(e,"show"))return this;this.open();var n=this.viewer;return f(n,q),b(e,"shown",function(){t.view(t.target?[].concat(t.images).indexOf(t.target):t.index),t.target=!1},{once:!0}),i.transition?(this.transitioning=!0,d(n,P),n.offsetWidth,b(n,Z,h(this.shown,this),{once:!0}),d(n,O)):(d(n,O),this.shown()),this},hide:function(){var t=this,e=this.element,i=this.options,n=this.viewer;return i.inline||this.transitioning||!this.visible?this:(o(i.hide)&&b(e,"hide",i.hide,{once:!0}),!1===y(e,"hide")?this:(this.viewed&&i.transition?(this.transitioning=!0,b(this.image,Z,function(){b(n,Z,h(t.hidden,t),{once:!0}),f(n,O)},{once:!0}),this.zoomTo(0,!1,!1,!0)):(f(n,O),this.hidden()),this))},view:function(t){var e=this,i=this.element,n=this.title,s=this.canvas;if(t=Number(t)||0,!this.ready||!this.visible||this.played||t<0||t>=this.length||this.viewed&&t===this.index)return this;var o=this.items[t],a=o.querySelector("img"),r=g(a,"originalUrl"),l=a.getAttribute("alt"),c=document.createElement("img");return c.src=r,c.alt=l,!1===y(i,"view",{originalImage:this.images[t],index:t,image:c})?this:(this.image=c,f(this.items[this.index],S),d(o,S),this.viewed=!1,this.index=t,this.imageData=null,d(c,R),x(s),s.appendChild(c),this.renderList(),x(n),b(i,j,function(){var t=e.imageData;n.textContent=l+" ("+t.naturalWidth+" × "+t.naturalHeight+")"},{once:!0}),c.complete?this.load():(b(c,H,h(this.load,this),{once:!0}),this.timeout&&clearTimeout(this.timeout),this.timeout=setTimeout(function(){f(c,R),e.timeout=!1},1e3)),this)},prev:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.index-1;return e<0&&(e=t?this.length-1:0),this.view(e),this},next:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.length-1,i=this.index+1;return i>e&&(i=t?0:e),this.view(i),this},move:function(t,e){var n=this.imageData;return this.moveTo(i(t)?t:n.left+Number(t),i(e)?e:n.top+Number(e)),this},moveTo:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=this.imageData;if(t=Number(t),i=Number(i),this.viewed&&!this.played&&this.options.movable){var s=!1;e(t)&&(n.left=t,s=!0),e(i)&&(n.top=i,s=!0),s&&this.renderImage()}return this},zoom:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n=this.imageData;return t=Number(t),t=t<0?1/(1-t):1+t,this.zoomTo(n.width*t/n.naturalWidth,e,i),this},zoomTo:function(t){var i=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,s=arguments.length>3&&void 0!==arguments[3]&&arguments[3],o=this.options,r=this.pointers,h=this.imageData;if(t=Math.max(0,t),e(t)&&this.viewed&&!this.played&&(s||o.zoomable)){if(!s){var l=Math.max(.01,o.minZoomRatio),c=Math.min(100,o.maxZoomRatio);t=Math.min(Math.max(t,l),c)}n&&t>.95&&t<1.05&&(t=1);var u=h.naturalWidth*t,d=h.naturalHeight*t;if(n){var f=function(t){var e=document.documentElement,i=t.getBoundingClientRect();return{left:i.left+((window.scrollX||e&&e.scrollLeft||0)-(e&&e.clientLeft||0)),top:i.top+((window.scrollY||e&&e.scrollTop||0)-(e&&e.clientTop||0))}}(this.viewer),m=r&&Object.keys(r).length?function(t){var e=0,i=0,n=0;return a(t,function(t){var s=t.startX,o=t.startY;e+=s,i+=o,n+=1}),e/=n,i/=n,{pageX:e,pageY:i}}(r):{pageX:n.pageX,pageY:n.pageY};h.left-=(u-h.width)*((m.pageX-f.left-h.left)/h.width),h.top-=(d-h.height)*((m.pageY-f.top-h.top)/h.height)}else h.left-=(u-h.width)/2,h.top-=(d-h.height)/2;h.width=u,h.height=d,h.ratio=t,this.renderImage(),i&&this.tooltip()}return this},rotate:function(t){return this.rotateTo((this.imageData.rotate||0)+Number(t)),this},rotateTo:function(t){var i=this.imageData;return t=Number(t),e(t)&&this.viewed&&!this.played&&this.options.rotatable&&(i.rotate=t,this.renderImage()),this},scaleX:function(t){return this.scale(t,this.imageData.scaleY),this},scaleY:function(t){return this.scale(this.imageData.scaleX,t),this},scale:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,n=this.imageData;if(t=Number(t),i=Number(i),this.viewed&&!this.played&&this.options.scalable){var s=!1;e(t)&&(n.scaleX=t,s=!0),e(i)&&(n.scaleY=i,s=!0),s&&this.renderImage()}return this},play:function(){var t=this,i=this.options,n=this.player,s=h(this.loadImage,this),o=[],r=0,l=0;if(!this.visible||this.played)return this;if(i.fullscreen&&this.requestFullscreen(),this.played=!0,this.onLoadWhenPlay=s,d(n,A),a(this.items,function(t,e){var a=t.querySelector("img"),h=document.createElement("img");h.src=g(a,"originalUrl"),h.alt=a.getAttribute("alt"),r+=1,d(h,L),m(h,P,i.transition),u(t,S)&&(d(h,O),l=e),o.push(h),b(h,H,s,{once:!0}),n.appendChild(h)}),e(i.interval)&&i.interval>0){r>1&&function e(){t.playing=setTimeout(function(){f(o[l],O),d(o[l=(l+=1)<r?l:0],O),e()},i.interval)}()}return this},stop:function(){var t=this,e=this.player;return this.played?(this.options.fullscreen&&this.exitFullscreen(),this.played=!1,clearTimeout(this.playing),a(this.player.getElementsByTagName("img"),function(e){e.complete||w(e,H,t.onLoadWhenPlay)}),f(e,A),x(e),this):this},full:function(){var t=this,e=this.options,i=this.viewer,n=this.image,s=this.list;return!this.visible||this.played||this.fulled||!e.inline?this:(this.fulled=!0,this.open(),d(this.button,Y),e.transition&&(f(n,P),f(s,P)),d(i,N),i.setAttribute("style",""),l(i,{zIndex:e.zIndex}),this.initContainer(),this.viewerData=r({},this.containerData),this.renderList(),this.initImage(function(){t.renderImage(function(){e.transition&&setTimeout(function(){d(n,P),d(s,P)},0)})}),this)},exit:function(){var t=this,e=this.options,i=this.viewer,n=this.image,s=this.list;return this.fulled?(this.fulled=!1,this.close(),f(this.button,Y),e.transition&&(f(n,P),f(s,P)),f(i,N),l(i,{zIndex:e.zIndexInline}),this.viewerData=r({},this.parentData),this.renderViewer(),this.renderList(),this.initImage(function(){t.renderImage(function(){e.transition&&setTimeout(function(){d(n,P),d(s,P)},0)})}),this):this},tooltip:function(){var t=this,e=this.options,i=this.tooltipBox,n=this.imageData;return this.viewed&&!this.played&&e.tooltip?(i.textContent=Math.round(100*n.ratio)+"%",this.tooltiping?clearTimeout(this.tooltiping):e.transition?(this.fading&&y(i,Z),d(i,A),d(i,L),d(i,P),i.offsetWidth,d(i,O)):d(i,A),this.tooltiping=setTimeout(function(){e.transition?(b(i,Z,function(){f(i,A),f(i,L),f(i,P),t.fading=!1},{once:!0}),f(i,O),t.fading=!0):f(i,A),t.tooltiping=!1},1e3),this):this},toggle:function(){return 1===this.imageData.ratio?this.zoomTo(this.initialImageData.ratio,!0):this.zoomTo(1,!0),this},reset:function(){return this.viewed&&!this.played&&(this.imageData=r({},this.initialImageData),this.renderImage()),this},update:function(){var t=this.element,e=this.options,i=this.isImg,n=[];if(i&&!t.parentNode)return this.destroy();var s=[];if(a(i?[t]:t.querySelectorAll("img"),function(t){e.filter?e.filter(t)&&s.push(t):s.push(t)}),this.images=s,this.length=s.length,this.ready&&(a(this.items,function(t,e){var i=t.querySelector("img"),o=s[e];o?o.src!==i.src&&n.push(e):n.push(e)}),l(this.list,{width:"auto"}),this.initList(),this.visible))if(this.length){if(this.viewed){var o=n.indexOf(this.index);o>=0?(this.viewed=!1,this.view(Math.max(this.index-(o+1),0))):d(this.items[this.index],S)}}else this.image=null,this.viewed=!1,this.index=0,this.imageData=null,x(this.canvas),x(this.title);return this},destroy:function(){var t=this.element;return g(t,T)?(this.options.inline?this.unbind():(this.visible&&this.unbind(),w(t,B,this.onStart)),this.close(),this.unbuild(),function(t,e){if(n(t[e]))try{delete t[e]}catch(i){t[e]=null}else if(t.dataset)try{delete t.dataset[e]}catch(i){t.dataset[e]=null}else t.removeAttribute("data-"+v(e))}(t,T),this):this}},ut={open:function(){var t=this.body;d(t,W),t.style.paddingRight=this.scrollbarWidth+(parseFloat(this.initialBodyPaddingRight)||0)+"px"},close:function(){var t=this.body;t&&(f(t,W),t.style.paddingRight=this.initialBodyPaddingRight)},shown:function(){var t=this.element,e=this.options;this.transitioning=!1,this.fulled=!0,this.visible=!0,this.render(),this.bind(),o(e.shown)&&b(t,"shown",e.shown,{once:!0}),y(t,"shown")},hidden:function(){var t=this.element,e=this.options;this.transitioning=!1,this.viewed=!1,this.fulled=!1,this.visible=!1,this.close(),this.unbind(),d(this.viewer,q),this.resetList(),this.resetImage(),o(e.hidden)&&b(t,"hidden",e.hidden,{once:!0}),y(t,"hidden")},requestFullscreen:function(){var t=window.document;if(this.fulled&&!t.fullscreenElement&&!t.mozFullScreenElement&&!t.webkitFullscreenElement&&!t.msFullscreenElement){var e=t.documentElement;e.requestFullscreen?e.requestFullscreen():e.msRequestFullscreen?e.msRequestFullscreen():e.mozRequestFullScreen?e.mozRequestFullScreen():e.webkitRequestFullscreen&&e.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT)}},exitFullscreen:function(){this.fulled&&(document.exitFullscreen?document.exitFullscreen():document.msExitFullscreen?document.msExitFullscreen():document.mozCancelFullScreen?document.mozCancelFullScreen():document.webkitExitFullscreen&&document.webkitExitFullscreen())},change:function(t){var e=this.options,i=this.pointers,n=i[Object.keys(i)[0]],s=n.endX-n.startX,o=n.endY-n.startY;switch(this.action){case C:this.move(s,o);break;case"zoom":this.zoom(function(t){var e=r({},t),i=[];return a(t,function(t,n){delete e[n],a(e,function(e){var n=Math.abs(t.startX-e.startX),s=Math.abs(t.startY-e.startY),o=Math.abs(t.endX-e.endX),a=Math.abs(t.endY-e.endY),r=Math.sqrt(n*n+s*s),h=(Math.sqrt(o*o+a*a)-r)/r;i.push(h)})}),i.sort(function(t,e){return Math.abs(t)<Math.abs(e)}),i[0]}(i),!1,t);break;case"switch":this.action="switched",Math.abs(s)>Math.abs(o)&&(s>1?this.prev(e.loop):s<-1&&this.next(e.loop))}a(i,function(t){t.startX=t.endX,t.startY=t.endY})},isSwitchable:function(){var t=this.imageData,e=this.viewerData;return this.length>1&&t.left>=0&&t.top>=0&&t.width<=e.width&&t.height<=e.height}},dt=I.Viewer,ft=function(){function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(J(this,t),!e||1!==e.nodeType)throw new Error("The first argument is required and must be an element.");this.element=e,this.options=r({},z,s(i)&&i),this.isImg=!1,this.ready=!1,this.visible=!1,this.viewed=!1,this.fulled=!1,this.played=!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.pointers={},this.init()}return Q(t,[{key:"init",value:function(){var t=this,e=this.element,n=this.options;if(!g(e,T)){p(e,T,this);var s="img"===e.tagName.toLowerCase(),r=[];a(s?[e]:e.querySelectorAll("img"),function(t){n.filter?n.filter(t)&&r.push(t):r.push(t)});var l=r.length;if(l){o(n.ready)&&b(e,"ready",n.ready,{once:!0}),i(document.createElement(T).style.transition)&&(n.transition=!1),this.isImg=s,this.length=l,this.count=0,this.images=r;var u=document.body||document.documentElement;if(this.body=u,this.scrollbarWidth=window.innerWidth-document.documentElement.clientWidth,this.initialBodyPaddingRight=c(u).paddingRight,n.inline){var d=h(this.progress,this);b(e,"ready",function(){t.view()},{once:!0}),a(r,function(t){t.complete?d():b(t,H,d,{once:!0})})}else b(e,B,this.onStart=h(this.start,this))}}}},{key:"progress",value:function(){this.count+=1,this.count===this.length&&this.build()}},{key:"build",value:function(){var t=this.options,n=this.element;if(!this.ready){var r=n.parentNode,h=document.createElement("div");h.innerHTML='<div class="viewer-container"><div class="viewer-canvas"></div><div class="viewer-footer"><div class="viewer-title"></div><div class="viewer-toolbar"></div><div class="viewer-navbar"><ul class="viewer-list"></ul></div></div><div class="viewer-tooltip"></div><div role="button" class="viewer-button" data-action="mix"></div><div class="viewer-player"></div></div>';var u=h.querySelector(".viewer-container"),f=u.querySelector(".viewer-title"),g=u.querySelector(".viewer-toolbar"),w=u.querySelector(".viewer-navbar"),x=u.querySelector(".viewer-button");if(this.parent=r,this.viewer=u,this.title=f,this.toolbar=g,this.navbar=w,this.button=x,this.canvas=u.querySelector(".viewer-canvas"),this.footer=u.querySelector(".viewer-footer"),this.tooltipBox=u.querySelector(".viewer-tooltip"),this.player=u.querySelector(".viewer-player"),this.list=u.querySelector(".viewer-list"),d(f,t.title?D(t.title):q),d(w,t.navbar?D(t.navbar):q),m(x,q,!t.button),t.toolbar){var E=document.createElement("ul"),k=s(t.toolbar),z=_.slice(0,3),I=_.slice(7,9),C=_.slice(9);k||d(g,D(t.toolbar)),a(k?t.toolbar:_,function(n,a){var r=k&&s(n),h=k?v(a):n,l=r&&!i(n.show)?n.show:n;if(l&&(t.zoomable||-1===z.indexOf(h))&&(t.rotatable||-1===I.indexOf(h))&&(t.scalable||-1===C.indexOf(h))){var c=r&&!i(n.size)?n.size:n,u=r&&!i(n.click)?n.click:n,f=document.createElement("li");f.setAttribute("role","button"),d(f,T+"-"+h),o(u)||p(f,"action",h),e(l)&&d(f,D(l)),-1!==["small","large"].indexOf(c)?d(f,T+"-"+c):"play"===h&&d(f,T+"-large"),o(u)&&b(f,B,u),E.appendChild(f)}}),g.appendChild(E)}else d(g,q);if(!t.rotatable){var S=g.querySelectorAll('li[class*="rotate"]');d(S,R),a(S,function(t){g.appendChild(t)})}t.inline?(d(x,"viewer-fullscreen"),l(u,{zIndex:t.zIndexInline}),"static"===c(r).position&&l(r,{position:"relative"}),r.insertBefore(u,n.nextSibling)):(d(x,"viewer-close"),d(u,N),d(u,L),d(u,q),l(u,{zIndex:t.zIndex}),this.body.appendChild(u)),t.inline&&(this.render(),this.bind(),this.visible=!0),this.ready=!0,y(n,"ready")}}},{key:"unbuild",value:function(){this.ready&&(this.ready=!1,this.viewer.parentNode.removeChild(this.viewer))}}],[{key:"noConflict",value:function(){return window.Viewer=dt,t}},{key:"setDefaults",value:function(t){r(z,s(t)&&t)}}]),t}();return r(ft.prototype,rt,ht,lt,ct,ut),ft}); |
{ | ||
"name": "viewerjs", | ||
"description": "JavaScript image viewer.", | ||
"version": "0.10.0", | ||
"version": "1.0.0-beta", | ||
"main": "dist/viewer.common.js", | ||
"module": "dist/viewer.esm.js", | ||
"browser": "dist/viewer.js", | ||
"style": "dist/viewer.css", | ||
"repository": "fengyuanchen/viewerjs", | ||
@@ -50,2 +51,3 @@ "homepage": "https://fengyuanchen.github.io/viewerjs", | ||
"babel-core": "^6.26.0", | ||
"babel-plugin-external-helpers": "^6.22.0", | ||
"babel-preset-env": "^1.6.1", | ||
@@ -55,17 +57,17 @@ "cpy-cli": "^1.0.1", | ||
"del-cli": "^1.1.0", | ||
"eslint": "^4.10.0", | ||
"eslint": "^4.13.1", | ||
"eslint-config-airbnb-base": "^12.1.0", | ||
"eslint-plugin-import": "^2.8.0", | ||
"node-qunit-phantomjs": "^1.6.0", | ||
"npm-run-all": "^4.1.1", | ||
"node-qunit-phantomjs": "^2.0.0", | ||
"npm-run-all": "^4.1.2", | ||
"postcss-cli": "^4.1.1", | ||
"postcss-cssnext": "^3.0.2", | ||
"postcss-header": "^1.0.0", | ||
"postcss-url": "^7.1.2", | ||
"rollup": "^0.50.0", | ||
"postcss-url": "^7.3.0", | ||
"rollup": "^0.52.2", | ||
"rollup-plugin-babel": "^3.0.2", | ||
"rollup-watch": "^4.3.1", | ||
"stylefmt": "^6.0.0", | ||
"uglify-js": "^3.1.6" | ||
"uglify-js": "^3.2.2" | ||
} | ||
} |
@@ -72,3 +72,3 @@ import { | ||
addListener(element, EVENT_SHOWN, () => { | ||
this.view(this.target ? [...this.images].indexOf(this.target) : this.index); | ||
this.view(this.target ? ([].concat(this.images)).indexOf(this.target) : this.index); | ||
this.target = false; | ||
@@ -75,0 +75,0 @@ }, { |
@@ -32,2 +32,6 @@ import { | ||
if (!body) { | ||
return; | ||
} | ||
removeClass(body, CLASS_OPEN); | ||
@@ -34,0 +38,0 @@ body.style.paddingRight = this.initialBodyPaddingRight; |
@@ -317,5 +317,8 @@ import { | ||
if (isObject(element[name])) { | ||
delete element[name]; | ||
try { | ||
delete element[name]; | ||
} catch (e) { | ||
element[name] = null; | ||
} | ||
} else if (element.dataset) { | ||
// #128 Safari not allows to delete dataset property | ||
try { | ||
@@ -527,8 +530,12 @@ delete element.dataset[name]; | ||
const newImage = document.createElement('img'); | ||
const body = document.body || document.documentElement; | ||
newImage.onload = () => { | ||
callback(newImage.width, newImage.height); | ||
body.removeChild(newImage); | ||
}; | ||
newImage.src = image.src; | ||
newImage.style.cssText = 'position: absolute; top: 0; left: 0; z-index: -1; opacity: 0;'; | ||
body.appendChild(newImage); | ||
} | ||
@@ -535,0 +542,0 @@ |
@@ -121,3 +121,3 @@ import DEFAULTS from './defaults'; | ||
const { body } = document; | ||
const body = document.body || document.documentElement; | ||
@@ -124,0 +124,0 @@ this.body = body; |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
397529
9629
20