!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.focus=t():e.focus=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(s){if(o[s])return o[s].exports;var n=o[s]={i:s,l:!1,exports:{}};return e[s].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var o={};return t.m=e,t.c=o,t.d=function(e,o,s){t.o(e,o)||Object.defineProperty(e,o,{configurable:!1,enumerable:!0,get:s})},t.n=function(e){var o=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(o,"a",o),o},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,o){"use strict";function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var o=0;o<t.length;o++){var s=t[o];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}return function(t,o,s){return o&&e(t.prototype,o),s&&e(t,s),t}}(),a=function(){function e(t){return s(this,e),this.DEFAULT_IMAGE_SRC="http://via.placeholder.com/500?text=focus.js",this.params={imageSrc:this.DEFAULT_IMAGE_SRC,parentElement:null,zoomFactor:"250%",smoother:!0,width:"100%",height:"66.7%",cursor:"",displayLoc:!1,displayZoom:!1,zoomOnScroll:!1},this.focusImg=document.createElement("div"),this.focusImg.style.position="relative",t&&Object.assign(this.params,t),this.render(),this.bindEvents(),this.displayLocHud=this.params.displayLoc?document.createElement("span"):null,this.displayZoomHud=this.params.displayZoom?document.createElement("span"):null,this.params.displayLoc&&(this.displayLocHud.classList.add("hud","hud-bottom-right"),this.focusImg.appendChild(this.displayLocHud)),this.params.displayZoom&&(this.displayZoomHud.classList.add("hud","hud-bottom-left"),this.focusImg.appendChild(this.displayZoomHud)),this}return n(e,[{key:"bindEvents",value:function(){var e=this;this.focusImg.addEventListener("mouseover",function(t){e.focusImg.getElementsByClassName("focus-img")[0].style.backgroundSize=e.params.zoomFactor},!1),this.focusImg.addEventListener("mousemove",function(t){var o=e.focusImg.getBoundingClientRect();e.relX=t.clientX-o.left,e.relY=t.clientY-o.top,e.percentX=Math.round(100/(o.width/e.relX)),e.percentY=Math.round(100/(o.height/e.relY)),e.focusImg.getElementsByClassName("focus-img")[0].style.backgroundPosition=e.percentX+"% "+e.percentY+"%",e.params.displayLoc&&e.updateLocHud(),e.params.displayZoom&&e.updateZoomHud()},!1),this.focusImg.addEventListener("mouseleave",function(t){e.focusImg.getElementsByClassName("focus-img")[0].style.backgroundPosition="center",e.focusImg.getElementsByClassName("focus-img")[0].style.backgroundSize="cover"},!1),this.focusImg.addEventListener("wheel",function(t){if(e.params.zoomOnScroll){t.preventDefault();var o=parseInt(e.focusImg.getElementsByClassName("focus-img")[0].style.backgroundSize.replace("%",""));if(o<=40&&t.deltaY>0)return void(e.params.zoomFactor="40%");if(o>=1e3&&t.deltaY<0)return void(e.params.zoomFactor="1000%");e.params.zoomFactor=o+(t.deltaY<=0?10:-10)+"%",e.focusImg.getElementsByClassName("focus-img")[0].style.backgroundSize=""+e.params.zoomFactor,e.updateZoomHud()}})}},{key:"render",value:function(){this.focusImg.innerHTML='\n            <div class="\n                focus-img \n                '+(this.params.smoother?"smoother":"")+"\n                "+(this.params.cursor?this.params.cursor:"")+'"\n            style="\n                background-image: url('+this.params.imageSrc+");\n                background-repeat: no-repeat;\n                background-size: cover;\n                background-position: center center;\n                width: 100%;\n                padding-top: "+this.params.height+';\n            ">\n            </div>\n        ',this.focusImg.style.width=this.params.width,this.params.parentElement.appendChild(this.focusImg)}},{key:"updateLocHud",value:function(){this.displayLocHud.innerHTML=(Math.floor(this.relX)||0)+", "+(Math.floor(this.relY)||0)}},{key:"updateZoomHud",value:function(){this.displayZoomHud.innerHTML=""+this.params.zoomFactor}}]),e}();t.default=a}])});