vue-compare-image
Version:
Vue component to compare two images using slider.
2 lines • 32.7 kB
JavaScript
(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("vue")):"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["vueCompareImage"]=t(require("vue")):e["vueCompareImage"]=t(e["Vue"])})("undefined"!==typeof self?self:this,(function(e){return function(e){var t={};function n(i){if(t[i])return t[i].exports;var r=t[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(i,r,function(t){return e[t]}.bind(null,r));return i},n.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s="fb15")}({"06cf":function(e,t,n){var i=n("83ab"),r=n("d1e7"),o=n("5c6c"),a=n("fc6a"),s=n("c04e"),c=n("5135"),u=n("0cfb"),d=Object.getOwnPropertyDescriptor;t.f=i?d:function(e,t){if(e=a(e),t=s(t,!0),u)try{return d(e,t)}catch(n){}if(c(e,t))return o(!r.f.call(e,t),e[t])}},"0cfb":function(e,t,n){var i=n("83ab"),r=n("d039"),o=n("cc12");e.exports=!i&&!r((function(){return 7!=Object.defineProperty(o("div"),"a",{get:function(){return 7}}).a}))},"1be4":function(e,t,n){var i=n("d066");e.exports=i("document","documentElement")},"1d80":function(e,t){e.exports=function(e){if(void 0==e)throw TypeError("Can't call method on "+e);return e}},"213d":function(e,t,n){"use strict";var i=n("3dd4"),r=n.n(i);r.a},"23cb":function(e,t,n){var i=n("a691"),r=Math.max,o=Math.min;e.exports=function(e,t){var n=i(e);return n<0?r(n+t,0):o(n,t)}},"241c":function(e,t,n){var i=n("ca84"),r=n("7839"),o=r.concat("length","prototype");t.f=Object.getOwnPropertyNames||function(e){return i(e,o)}},"24fb":function(e,t,n){"use strict";function i(e,t){var n=e[1]||"",i=e[3];if(!i)return n;if(t&&"function"===typeof btoa){var o=r(i),a=i.sources.map((function(e){return"/*# sourceURL=".concat(i.sourceRoot).concat(e," */")}));return[n].concat(a).concat([o]).join("\n")}return[n].join("\n")}function r(e){var t=btoa(unescape(encodeURIComponent(JSON.stringify(e)))),n="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(t);return"/*# ".concat(n," */")}e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=i(t,e);return t[2]?"@media ".concat(t[2],"{").concat(n,"}"):n})).join("")},t.i=function(e,n){"string"===typeof e&&(e=[[null,e,""]]);for(var i={},r=0;r<this.length;r++){var o=this[r][0];null!=o&&(i[o]=!0)}for(var a=0;a<e.length;a++){var s=e[a];null!=s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="(".concat(s[2],") and (").concat(n,")")),t.push(s))}},t}},"2ad6":function(e,t,n){"use strict";var i,r;(function(o,a){i=a,r="function"===typeof i?i.call(t,n,t,e):i,void 0===r||(e.exports=r)})("undefined"!==typeof window&&window,(function(){if("undefined"===typeof window)return null;var e="undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")(),t=e.requestAnimationFrame||e.mozRequestAnimationFrame||e.webkitRequestAnimationFrame||function(t){return e.setTimeout(t,20)};function n(e,t){var n=Object.prototype.toString.call(e),i="[object Array]"===n||"[object NodeList]"===n||"[object HTMLCollection]"===n||"[object Object]"===n||"undefined"!==typeof jQuery&&e instanceof jQuery||"undefined"!==typeof Elements&&e instanceof Elements,r=0,o=e.length;if(i)for(;r<o;r++)t(e[r]);else t(e)}function i(e){if(!e.getBoundingClientRect)return{width:e.offsetWidth,height:e.offsetHeight};var t=e.getBoundingClientRect();return{width:Math.round(t.width),height:Math.round(t.height)}}function r(e,t){Object.keys(t).forEach((function(n){e.style[n]=t[n]}))}var o=function(e,a){function s(){var e,t,n=[];this.add=function(e){n.push(e)},this.call=function(i){for(e=0,t=n.length;e<t;e++)n[e].call(this,i)},this.remove=function(i){var r=[];for(e=0,t=n.length;e<t;e++)n[e]!==i&&r.push(n[e]);n=r},this.length=function(){return n.length}}function c(e,n){if(e)if(e.resizedAttached)e.resizedAttached.add(n);else{e.resizedAttached=new s,e.resizedAttached.add(n),e.resizeSensor=document.createElement("div"),e.resizeSensor.dir="ltr",e.resizeSensor.className="resize-sensor";var o={pointerEvents:"none",position:"absolute",left:"0px",top:"0px",right:"0px",bottom:"0px",overflow:"hidden",zIndex:"-1",visibility:"hidden",maxWidth:"100%"},a={position:"absolute",left:"0px",top:"0px",transition:"0s"};r(e.resizeSensor,o);var c=document.createElement("div");c.className="resize-sensor-expand",r(c,o);var u=document.createElement("div");r(u,a),c.appendChild(u);var d=document.createElement("div");d.className="resize-sensor-shrink",r(d,o);var l=document.createElement("div");r(l,a),r(l,{width:"200%",height:"200%"}),d.appendChild(l),e.resizeSensor.appendChild(c),e.resizeSensor.appendChild(d),e.appendChild(e.resizeSensor);var f,h,p=window.getComputedStyle(e),m=p?p.getPropertyValue("position"):null;"absolute"!==m&&"relative"!==m&&"fixed"!==m&&(e.style.position="relative");var v=i(e),g=0,y=0,b=!0,x=0,w=function(){var t=e.offsetWidth,n=e.offsetHeight;u.style.width=t+10+"px",u.style.height=n+10+"px",c.scrollLeft=t+10,c.scrollTop=n+10,d.scrollLeft=t+10,d.scrollTop=n+10},S=function(){if(b){var n=0===e.offsetWidth&&0===e.offsetHeight;if(n)return void(x||(x=t((function(){x=0,S()}))));b=!1}w()};e.resizeSensor.resetSensor=S;var E=function(){h=0,f&&(g=v.width,y=v.height,e.resizedAttached&&e.resizedAttached.call(v))},O=function(){v=i(e),f=v.width!==g||v.height!==y,f&&!h&&(h=t(E)),S()},C=function(e,t,n){e.attachEvent?e.attachEvent("on"+t,n):e.addEventListener(t,n)};C(c,"scroll",O),C(d,"scroll",O),t(S)}}n(e,(function(e){c(e,a)})),this.detach=function(t){o.detach(e,t)},this.reset=function(){e.resizeSensor.resetSensor()}};if(o.reset=function(e){n(e,(function(e){e.resizeSensor.resetSensor()}))},o.detach=function(e,t){n(e,(function(e){e&&(e.resizedAttached&&"function"===typeof t&&(e.resizedAttached.remove(t),e.resizedAttached.length())||e.resizeSensor&&(e.contains(e.resizeSensor)&&e.removeChild(e.resizeSensor),delete e.resizeSensor,delete e.resizedAttached))}))},"undefined"!==typeof MutationObserver){var a=new MutationObserver((function(e){for(var t in e)if(e.hasOwnProperty(t))for(var n=e[t].addedNodes,i=0;i<n.length;i++)n[i].resizeSensor&&o.reset(n[i])}));document.addEventListener("DOMContentLoaded",(function(e){a.observe(document.body,{childList:!0,subtree:!0})}))}return o}))},"2e56":function(e,t,n){t=e.exports=n("24fb")(!1),t.push([e.i,'.vci-container[data-v-1e5eda20]{-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;width:100%;overflow:hidden}.left-image[data-v-1e5eda20]{display:block;height:100%;-o-object-fit:cover;object-fit:cover;position:absolute;top:0;width:100%}.left-label[data-v-1e5eda20]{position:absolute;top:0;left:0;padding:10px}.right-image[data-v-1e5eda20]{display:block;height:auto;width:100%}.right-label[data-v-1e5eda20]{position:absolute;top:0;right:0;padding:10px}.vci-slider[data-v-1e5eda20]{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:absolute;top:0}.vci-slider .line[data-v-1e5eda20]{background:#fff;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;height:100%}.vci-slider .handle[data-v-1e5eda20],.vci-slider .line[data-v-1e5eda20]{-webkit-box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}.vci-slider .handle[data-v-1e5eda20]{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:100%;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.vci-slider .left-arrow[data-v-1e5eda20],.vci-slider .right-arrow[data-v-1e5eda20]{height:"0px";width:"0px"}',""])},"37e8":function(e,t,n){var i=n("83ab"),r=n("9bf2"),o=n("825a"),a=n("df75");e.exports=i?Object.defineProperties:function(e,t){o(e);var n,i=a(t),s=i.length,c=0;while(s>c)r.f(e,n=i[c++],t[n]);return e}},"3bbe":function(e,t,n){var i=n("861d");e.exports=function(e){if(!i(e)&&null!==e)throw TypeError("Can't set "+String(e)+" as a prototype");return e}},"3dd4":function(e,t,n){var i=n("2e56");"string"===typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);var r=n("499e").default;r("2403ed1e",i,!0,{sourceMap:!1,shadowMode:!1})},"428f":function(e,t,n){e.exports=n("da84")},"44ad":function(e,t,n){var i=n("d039"),r=n("c6b6"),o="".split;e.exports=i((function(){return!Object("z").propertyIsEnumerable(0)}))?function(e){return"String"==r(e)?o.call(e,""):Object(e)}:Object},"499e":function(e,t,n){"use strict";function i(e,t){for(var n=[],i={},r=0;r<t.length;r++){var o=t[r],a=o[0],s=o[1],c=o[2],u=o[3],d={id:e+":"+r,css:s,media:c,sourceMap:u};i[a]?i[a].parts.push(d):n.push(i[a]={id:a,parts:[d]})}return n}n.r(t),n.d(t,"default",(function(){return p}));var r="undefined"!==typeof document;if("undefined"!==typeof DEBUG&&DEBUG&&!r)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var o={},a=r&&(document.head||document.getElementsByTagName("head")[0]),s=null,c=0,u=!1,d=function(){},l=null,f="data-vue-ssr-id",h="undefined"!==typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function p(e,t,n,r){u=n,l=r||{};var a=i(e,t);return m(a),function(t){for(var n=[],r=0;r<a.length;r++){var s=a[r],c=o[s.id];c.refs--,n.push(c)}t?(a=i(e,t),m(a)):a=[];for(r=0;r<n.length;r++){c=n[r];if(0===c.refs){for(var u=0;u<c.parts.length;u++)c.parts[u]();delete o[c.id]}}}}function m(e){for(var t=0;t<e.length;t++){var n=e[t],i=o[n.id];if(i){i.refs++;for(var r=0;r<i.parts.length;r++)i.parts[r](n.parts[r]);for(;r<n.parts.length;r++)i.parts.push(g(n.parts[r]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{var a=[];for(r=0;r<n.parts.length;r++)a.push(g(n.parts[r]));o[n.id]={id:n.id,refs:1,parts:a}}}}function v(){var e=document.createElement("style");return e.type="text/css",a.appendChild(e),e}function g(e){var t,n,i=document.querySelector("style["+f+'~="'+e.id+'"]');if(i){if(u)return d;i.parentNode.removeChild(i)}if(h){var r=c++;i=s||(s=v()),t=b.bind(null,i,r,!1),n=b.bind(null,i,r,!0)}else i=v(),t=x.bind(null,i),n=function(){i.parentNode.removeChild(i)};return t(e),function(i){if(i){if(i.css===e.css&&i.media===e.media&&i.sourceMap===e.sourceMap)return;t(e=i)}else n()}}var y=function(){var e=[];return function(t,n){return e[t]=n,e.filter(Boolean).join("\n")}}();function b(e,t,n,i){var r=n?"":i.css;if(e.styleSheet)e.styleSheet.cssText=y(t,r);else{var o=document.createTextNode(r),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(o,a[t]):e.appendChild(o)}}function x(e,t){var n=t.css,i=t.media,r=t.sourceMap;if(i&&e.setAttribute("media",i),l.ssrId&&e.setAttribute(f,t.id),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),e.styleSheet)e.styleSheet.cssText=n;else{while(e.firstChild)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}},"4d64":function(e,t,n){var i=n("fc6a"),r=n("50c4"),o=n("23cb"),a=function(e){return function(t,n,a){var s,c=i(t),u=r(c.length),d=o(a,u);if(e&&n!=n){while(u>d)if(s=c[d++],s!=s)return!0}else for(;u>d;d++)if((e||d in c)&&c[d]===n)return e||d||0;return!e&&-1}};e.exports={includes:a(!0),indexOf:a(!1)}},"50c4":function(e,t,n){var i=n("a691"),r=Math.min;e.exports=function(e){return e>0?r(i(e),9007199254740991):0}},5135:function(e,t){var n={}.hasOwnProperty;e.exports=function(e,t){return n.call(e,t)}},5692:function(e,t,n){var i=n("c430"),r=n("c6cd");(e.exports=function(e,t){return r[e]||(r[e]=void 0!==t?t:{})})("versions",[]).push({version:"3.3.2",mode:i?"pure":"global",copyright:"© 2019 Denis Pushkarev (zloirock.ru)"})},5899:function(e,t){e.exports="\t\n\v\f\r \u2028\u2029\ufeff"},"58a8":function(e,t,n){var i=n("1d80"),r=n("5899"),o="["+r+"]",a=RegExp("^"+o+o+"*"),s=RegExp(o+o+"*$"),c=function(e){return function(t){var n=String(i(t));return 1&e&&(n=n.replace(a,"")),2&e&&(n=n.replace(s,"")),n}};e.exports={start:c(1),end:c(2),trim:c(3)}},"5c6c":function(e,t){e.exports=function(e,t){return{enumerable:!(1&e),configurable:!(2&e),writable:!(4&e),value:t}}},"69f3":function(e,t,n){var i,r,o,a=n("7f9a"),s=n("da84"),c=n("861d"),u=n("9112"),d=n("5135"),l=n("f772"),f=n("d012"),h=s.WeakMap,p=function(e){return o(e)?r(e):i(e,{})},m=function(e){return function(t){var n;if(!c(t)||(n=r(t)).type!==e)throw TypeError("Incompatible receiver, "+e+" required");return n}};if(a){var v=new h,g=v.get,y=v.has,b=v.set;i=function(e,t){return b.call(v,e,t),t},r=function(e){return g.call(v,e)||{}},o=function(e){return y.call(v,e)}}else{var x=l("state");f[x]=!0,i=function(e,t){return u(e,x,t),t},r=function(e){return d(e,x)?e[x]:{}},o=function(e){return d(e,x)}}e.exports={set:i,get:r,has:o,enforce:p,getterFor:m}},"6eeb":function(e,t,n){var i=n("da84"),r=n("5692"),o=n("9112"),a=n("5135"),s=n("ce4e"),c=n("9e81"),u=n("69f3"),d=u.get,l=u.enforce,f=String(c).split("toString");r("inspectSource",(function(e){return c.call(e)})),(e.exports=function(e,t,n,r){var c=!!r&&!!r.unsafe,u=!!r&&!!r.enumerable,d=!!r&&!!r.noTargetGet;"function"==typeof n&&("string"!=typeof t||a(n,"name")||o(n,"name",t),l(n).source=f.join("string"==typeof t?t:"")),e!==i?(c?!d&&e[t]&&(u=!0):delete e[t],u?e[t]=n:o(e,t,n)):u?e[t]=n:s(t,n)})(Function.prototype,"toString",(function(){return"function"==typeof this&&d(this).source||c.call(this)}))},7156:function(e,t,n){var i=n("861d"),r=n("d2bb");e.exports=function(e,t,n){var o,a;return r&&"function"==typeof(o=t.constructor)&&o!==n&&i(a=o.prototype)&&a!==n.prototype&&r(e,a),e}},7839:function(e,t){e.exports=["constructor","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","toLocaleString","toString","valueOf"]},"7c73":function(e,t,n){var i=n("825a"),r=n("37e8"),o=n("7839"),a=n("d012"),s=n("1be4"),c=n("cc12"),u=n("f772"),d=u("IE_PROTO"),l="prototype",f=function(){},h=function(){var e,t=c("iframe"),n=o.length,i="<",r="script",a=">",u="java"+r+":";t.style.display="none",s.appendChild(t),t.src=String(u),e=t.contentWindow.document,e.open(),e.write(i+r+a+"document.F=Object"+i+"/"+r+a),e.close(),h=e.F;while(n--)delete h[l][o[n]];return h()};e.exports=Object.create||function(e,t){var n;return null!==e?(f[l]=i(e),n=new f,f[l]=null,n[d]=e):n=h(),void 0===t?n:r(n,t)},a[d]=!0},"7f9a":function(e,t,n){var i=n("da84"),r=n("9e81"),o=i.WeakMap;e.exports="function"===typeof o&&/native code/.test(r.call(o))},"825a":function(e,t,n){var i=n("861d");e.exports=function(e){if(!i(e))throw TypeError(String(e)+" is not an object");return e}},"83ab":function(e,t,n){var i=n("d039");e.exports=!i((function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a}))},"861d":function(e,t){e.exports=function(e){return"object"===typeof e?null!==e:"function"===typeof e}},"87d4":function(e,t,n){e.exports={ResizeSensor:n("2ad6"),ElementQueries:n("ae72")}},"8bbf":function(t,n){t.exports=e},"90e3":function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol("+String(void 0===e?"":e)+")_"+(++n+i).toString(36)}},9112:function(e,t,n){var i=n("83ab"),r=n("9bf2"),o=n("5c6c");e.exports=i?function(e,t,n){return r.f(e,t,o(1,n))}:function(e,t,n){return e[t]=n,e}},"94ca":function(e,t,n){var i=n("d039"),r=/#|\.prototype\./,o=function(e,t){var n=s[a(e)];return n==u||n!=c&&("function"==typeof t?i(t):!!t)},a=o.normalize=function(e){return String(e).replace(r,".").toLowerCase()},s=o.data={},c=o.NATIVE="N",u=o.POLYFILL="P";e.exports=o},"9bf2":function(e,t,n){var i=n("83ab"),r=n("0cfb"),o=n("825a"),a=n("c04e"),s=Object.defineProperty;t.f=i?s:function(e,t,n){if(o(e),t=a(t,!0),o(n),r)try{return s(e,t,n)}catch(i){}if("get"in n||"set"in n)throw TypeError("Accessors not supported");return"value"in n&&(e[t]=n.value),e}},"9e81":function(e,t,n){var i=n("5692");e.exports=i("native-function-to-string",Function.toString)},a691:function(e,t){var n=Math.ceil,i=Math.floor;e.exports=function(e){return isNaN(e=+e)?0:(e>0?i:n)(e)}},a9e3:function(e,t,n){"use strict";var i=n("83ab"),r=n("da84"),o=n("94ca"),a=n("6eeb"),s=n("5135"),c=n("c6b6"),u=n("7156"),d=n("c04e"),l=n("d039"),f=n("7c73"),h=n("241c").f,p=n("06cf").f,m=n("9bf2").f,v=n("58a8").trim,g="Number",y=r[g],b=y.prototype,x=c(f(b))==g,w=function(e){var t,n,i,r,o,a,s,c,u=d(e,!1);if("string"==typeof u&&u.length>2)if(u=v(u),t=u.charCodeAt(0),43===t||45===t){if(n=u.charCodeAt(2),88===n||120===n)return NaN}else if(48===t){switch(u.charCodeAt(1)){case 66:case 98:i=2,r=49;break;case 79:case 111:i=8,r=55;break;default:return+u}for(o=u.slice(2),a=o.length,s=0;s<a;s++)if(c=o.charCodeAt(s),c<48||c>r)return NaN;return parseInt(o,i)}return+u};if(o(g,!y(" 0o1")||!y("0b1")||y("+0x1"))){for(var S,E=function(e){var t=arguments.length<1?0:e,n=this;return n instanceof E&&(x?l((function(){b.valueOf.call(n)})):c(n)!=g)?u(new y(w(t)),n,E):w(t)},O=i?h(y):"MAX_VALUE,MIN_VALUE,NaN,NEGATIVE_INFINITY,POSITIVE_INFINITY,EPSILON,isFinite,isInteger,isNaN,isSafeInteger,MAX_SAFE_INTEGER,MIN_SAFE_INTEGER,parseFloat,parseInt,isInteger".split(","),C=0;O.length>C;C++)s(y,S=O[C])&&!s(E,S)&&m(E,S,p(y,S));E.prototype=b,b.constructor=E,a(r,g,E)}},ae72:function(e,t,n){"use strict";var i,r,o;(function(a,s){r=[n("2ad6")],i=s,o="function"===typeof i?i.apply(t,r):i,void 0===o||(e.exports=o)})("undefined"!==typeof window&&window,(function(e){var t=function(){var t,n={},i=[];function r(e){e||(e=document.documentElement);var t=window.getComputedStyle(e,null).fontSize;return parseFloat(t)||16}function o(e){if(!e.getBoundingClientRect)return{width:e.offsetWidth,height:e.offsetHeight};var t=e.getBoundingClientRect();return{width:Math.round(t.width),height:Math.round(t.height)}}function a(e,t){var n=t.split(/\d/),i=n[n.length-1];switch(t=parseFloat(t),i){case"px":return t;case"em":return t*r(e);case"rem":return t*r();case"vw":return t*document.documentElement.clientWidth/100;case"vh":return t*document.documentElement.clientHeight/100;case"vmin":case"vmax":var o=document.documentElement.clientWidth/100,a=document.documentElement.clientHeight/100,s=Math["vmin"===i?"min":"max"];return t*s(o,a);default:return t}}function s(e,t){var i,r,s,c,u,d,l,f;this.element=e;var h=["min-width","min-height","max-width","max-height"];this.call=function(){for(i in s=o(this.element),d={},n[t])n[t].hasOwnProperty(i)&&(r=n[t][i],c=a(this.element,r.value),u="width"===r.property?s.width:s.height,f=r.mode+"-"+r.property,l="","min"===r.mode&&u>=c&&(l+=r.value),"max"===r.mode&&u<=c&&(l+=r.value),d[f]||(d[f]=""),l&&-1===(" "+d[f]+" ").indexOf(" "+l+" ")&&(d[f]+=" "+l));for(var e in h)h.hasOwnProperty(e)&&(d[h[e]]?this.element.setAttribute(h[e],d[h[e]].substr(1)):this.element.removeAttribute(h[e]))}}function c(t,n){t.elementQueriesSetupInformation||(t.elementQueriesSetupInformation=new s(t,n)),t.elementQueriesSensor||(t.elementQueriesSensor=new e(t,(function(){t.elementQueriesSetupInformation.call()})))}function u(e,r,o,a){if("undefined"===typeof n[e]){n[e]=[];var s=i.length;t.innerHTML+="\n"+e+" {animation: 0.1s element-queries;}",t.innerHTML+="\n"+e+" > .resize-sensor {min-width: "+s+"px;}",i.push(e)}n[e].push({mode:r,property:o,value:a})}function d(e){var t;if(document.querySelectorAll&&(t=e?e.querySelectorAll.bind(e):document.querySelectorAll.bind(document)),t||"undefined"===typeof $$||(t=$$),t||"undefined"===typeof jQuery||(t=jQuery),!t)throw"No document.querySelectorAll, jQuery or Mootools's $$ found.";return t}function l(e){var t=d(e);for(var i in n)if(n.hasOwnProperty(i))for(var r=t(i,e),o=0,a=r.length;o<a;o++)c(r[o],i)}function f(t){var n=[],i=[],r=[],o=0,a=-1,s=[];for(var c in t.children)if(t.children.hasOwnProperty(c)&&t.children[c].tagName&&"img"===t.children[c].tagName.toLowerCase()){n.push(t.children[c]);var u=t.children[c].getAttribute("min-width")||t.children[c].getAttribute("data-min-width"),d=t.children[c].getAttribute("data-src")||t.children[c].getAttribute("url");r.push(d);var l={minWidth:u};i.push(l),u?t.children[c].style.display="none":(o=n.length-1,t.children[c].style.display="block")}function f(){var e,c=!1;for(e in n)n.hasOwnProperty(e)&&i[e].minWidth&&t.offsetWidth>i[e].minWidth&&(c=e);if(c||(c=o),a!==c)if(s[c])n[a].style.display="none",n[c].style.display="block",a=c;else{var u=new Image;u.onload=function(){n[c].src=r[c],n[a].style.display="none",n[c].style.display="block",s[c]=!0,a=c},u.src=r[c]}else n[c].src=r[c]}a=o,t.resizeSensorInstance=new e(t,f),f()}function h(){for(var e=d(),t=e("[data-responsive-image],[responsive-image]"),n=0,i=t.length;n<i;n++)f(t[n])}var p=/,?[\s\t]*([^,\n]*?)((?:\[[\s\t]*?(?:min|max)-(?:width|height)[\s\t]*?[~$\^]?=[\s\t]*?"[^"]*?"[\s\t]*?])+)([^,\n\s\{]*)/gim,m=/\[[\s\t]*?(min|max)-(width|height)[\s\t]*?[~$\^]?=[\s\t]*?"([^"]*?)"[\s\t]*?]/gim;function v(e){var t,n,i,r;e=e.replace(/'/g,'"');while(null!==(t=p.exec(e))){n=t[1]+t[3],i=t[2];while(null!==(r=m.exec(i)))u(n,r[1],r[2],r[3])}}function g(e){var t="";if(e)if("string"===typeof e)e=e.toLowerCase(),-1===e.indexOf("min-width")&&-1===e.indexOf("max-width")||v(e);else for(var n=0,i=e.length;n<i;n++)1===e[n].type?(t=e[n].selectorText||e[n].cssText,-1!==t.indexOf("min-height")||-1!==t.indexOf("max-height")?v(t):-1===t.indexOf("min-width")&&-1===t.indexOf("max-width")||v(t)):4===e[n].type?g(e[n].cssRules||e[n].rules):3===e[n].type&&e[n].styleSheet.hasOwnProperty("cssRules")&&g(e[n].styleSheet.cssRules)}var y=!1;this.init=function(){var n="animationstart";"undefined"!==typeof document.documentElement.style["webkitAnimationName"]?n="webkitAnimationStart":"undefined"!==typeof document.documentElement.style["MozAnimationName"]?n="mozanimationstart":"undefined"!==typeof document.documentElement.style["OAnimationName"]&&(n="oanimationstart"),document.body.addEventListener(n,(function(t){var n=t.target,r=n&&window.getComputedStyle(n,null),o=r&&r.getPropertyValue("animation-name"),a=o&&-1!==o.indexOf("element-queries");if(a){n.elementQueriesSensor=new e(n,(function(){n.elementQueriesSetupInformation&&n.elementQueriesSetupInformation.call()}));var s=window.getComputedStyle(n.resizeSensor,null),u=s.getPropertyValue("min-width");u=parseInt(u.replace("px","")),c(t.target,i[u])}})),y||(t=document.createElement("style"),t.type="text/css",t.innerHTML="[responsive-image] > img, [data-responsive-image] {overflow: hidden; padding: 0; } [responsive-image] > img, [data-responsive-image] > img {width: 100%;}",t.innerHTML+="\n@keyframes element-queries { 0% { visibility: inherit; } }",document.getElementsByTagName("head")[0].appendChild(t),y=!0);for(var r=0,o=document.styleSheets.length;r<o;r++)try{document.styleSheets[r].href&&0===document.styleSheets[r].href.indexOf("file://")&&console.warn("CssElementQueries: unable to parse local css files, "+document.styleSheets[r].href),g(document.styleSheets[r].cssRules||document.styleSheets[r].rules||document.styleSheets[r].cssText)}catch(a){}h()},this.findElementQueriesElements=function(e){l(e)},this.update=function(){this.init()}};t.update=function(){t.instance.update()},t.detach=function(e){e.elementQueriesSetupInformation?(e.elementQueriesSensor.detach(),delete e.elementQueriesSetupInformation,delete e.elementQueriesSensor):e.resizeSensorInstance&&(e.resizeSensorInstance.detach(),delete e.resizeSensorInstance)},t.init=function(){t.instance||(t.instance=new t),t.instance.init()};var n=function(e){if(document.addEventListener)document.addEventListener("DOMContentLoaded",e,!1);else if(/KHTML|WebKit|iCab/i.test(navigator.userAgent))var t=setInterval((function(){/loaded|complete/i.test(document.readyState)&&(e(),clearInterval(t))}),10);else window.onload=e};return t.findElementQueriesElements=function(e){t.instance.findElementQueriesElements(e)},t.listen=function(){n(t.init)},t}))},c04e:function(e,t,n){var i=n("861d");e.exports=function(e,t){if(!i(e))return e;var n,r;if(t&&"function"==typeof(n=e.toString)&&!i(r=n.call(e)))return r;if("function"==typeof(n=e.valueOf)&&!i(r=n.call(e)))return r;if(!t&&"function"==typeof(n=e.toString)&&!i(r=n.call(e)))return r;throw TypeError("Can't convert object to primitive value")}},c430:function(e,t){e.exports=!1},c6b6:function(e,t){var n={}.toString;e.exports=function(e){return n.call(e).slice(8,-1)}},c6cd:function(e,t,n){var i=n("da84"),r=n("ce4e"),o="__core-js_shared__",a=i[o]||r(o,{});e.exports=a},c8ba:function(e,t){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(i){"object"===typeof window&&(n=window)}e.exports=n},ca84:function(e,t,n){var i=n("5135"),r=n("fc6a"),o=n("4d64").indexOf,a=n("d012");e.exports=function(e,t){var n,s=r(e),c=0,u=[];for(n in s)!i(a,n)&&i(s,n)&&u.push(n);while(t.length>c)i(s,n=t[c++])&&(~o(u,n)||u.push(n));return u}},cc12:function(e,t,n){var i=n("da84"),r=n("861d"),o=i.document,a=r(o)&&r(o.createElement);e.exports=function(e){return a?o.createElement(e):{}}},ce4e:function(e,t,n){var i=n("da84"),r=n("9112");e.exports=function(e,t){try{r(i,e,t)}catch(n){i[e]=t}return t}},d012:function(e,t){e.exports={}},d039:function(e,t){e.exports=function(e){try{return!!e()}catch(t){return!0}}},d066:function(e,t,n){var i=n("428f"),r=n("da84"),o=function(e){return"function"==typeof e?e:void 0};e.exports=function(e,t){return arguments.length<2?o(i[e])||o(r[e]):i[e]&&i[e][t]||r[e]&&r[e][t]}},d1e7:function(e,t,n){"use strict";var i={}.propertyIsEnumerable,r=Object.getOwnPropertyDescriptor,o=r&&!i.call({1:2},1);t.f=o?function(e){var t=r(this,e);return!!t&&t.enumerable}:i},d2bb:function(e,t,n){var i=n("825a"),r=n("3bbe");e.exports=Object.setPrototypeOf||("__proto__"in{}?function(){var e,t=!1,n={};try{e=Object.getOwnPropertyDescriptor(Object.prototype,"__proto__").set,e.call(n,[]),t=n instanceof Array}catch(o){}return function(n,o){return i(n),r(o),t?e.call(n,o):n.__proto__=o,n}}():void 0)},da84:function(e,t,n){(function(t){var n=function(e){return e&&e.Math==Math&&e};e.exports=n("object"==typeof globalThis&&globalThis)||n("object"==typeof window&&window)||n("object"==typeof self&&self)||n("object"==typeof t&&t)||Function("return this")()}).call(this,n("c8ba"))},df75:function(e,t,n){var i=n("ca84"),r=n("7839");e.exports=Object.keys||function(e){return i(e,r)}},f6fd:function(e,t){(function(e){var t="currentScript",n=e.getElementsByTagName("script");t in e||Object.defineProperty(e,t,{get:function(){try{throw new Error}catch(i){var e,t=(/.*at [^\(]*\((.*):.+:.+\)$/gi.exec(i.stack)||[!1])[1];for(e in n)if(n[e].src==t||"interactive"==n[e].readyState)return n[e];return null}}})})(document)},f772:function(e,t,n){var i=n("5692"),r=n("90e3"),o=i("keys");e.exports=function(e){return o[e]||(o[e]=r(e))}},fb15:function(e,t,n){"use strict";var i;(n.r(t),"undefined"!==typeof window)&&(n("f6fd"),(i=window.document.currentScript)&&(i=i.src.match(/(.+\/)[^/]+\.js(\?.*)?$/))&&(n.p=i[1]));var r=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{ref:"containerRef",staticClass:"vci-container"},[n("img",{ref:"leftImageRef",staticClass:"left-image",style:e.leftImageStyle,attrs:{alt:e.leftImageAlt,src:e.leftImage}}),n("div",{staticClass:"left-label",style:e.leftImageStyle},[e._v(e._s(e.leftLabel))]),n("img",{ref:"rightImageRef",staticClass:"right-image",attrs:{alt:e.rightImageAlt,src:e.rightImage}}),n("div",{ref:"rightLabelRef",staticClass:"right-label",style:e.rightLabelStyle},[e._v(e._s(e.rightLabel))]),n("div",{staticClass:"vci-slider",style:e.sliderStyle},[n("div",{staticClass:"line",style:e.sliderLineStyle}),n("div",{staticClass:"handle",style:e.sliderHandleStyle},[n("div",{staticClass:"left-arrow",style:e.sliderLeftArrowStyle}),n("div",{staticClass:"right-arrow",style:e.sliderRightArrowStyle})]),n("div",{staticClass:"line",style:e.sliderLineStyle})])])},o=[],a=(n("a9e3"),n("8bbf")),s=n.n(a),c=n("87d4"),u=s.a.extend({mounted:function(){var e=this;new c["ResizeSensor"](this.$refs.containerRef,(function(){e.getAndSetImageWidth()}));var t=this.$refs.containerRef;t.addEventListener("touchstart",this.startSliding),window.addEventListener("touchend",this.finishSliding),this.hover?(t.addEventListener("mouseenter",this.startSliding),t.addEventListener("mouseleave",this.finishSliding)):(t.addEventListener("mousedown",this.startSliding),window.addEventListener("mouseup",this.finishSliding))},beforeDestroy:function(){this.finishSliding(),window.removeEventListener("mouseup",this.finishSliding),window.removeEventListener("touchend",this.finishSliding)},props:{leftImage:{type:String,default:""},leftImageAlt:{type:String,default:null},leftLabel:{type:String,default:""},rightImage:{type:String,default:""},rightImageAlt:{type:String,default:null},rightLabel:{type:String,default:""},hover:{type:Boolean,default:!1},handleSize:{type:Number,default:40},sliderLineWidth:{type:Number,default:2},sliderPositionPercentage:{type:Number,default:.5}},methods:{getAndSetImageWidth:function(){this.imageWidth=this.$refs.rightImageRef.getBoundingClientRect().width,this.rightLabelWidth=this.$refs.rightLabelRef.getBoundingClientRect().width},startSliding:function(e){"touches"in e||e.preventDefault(),this.updateSliderPosition(e),window.addEventListener("mousemove",this.updateSliderPosition),window.addEventListener("touchmove",this.updateSliderPosition)},finishSliding:function(){window.removeEventListener("mousemove",this.updateSliderPosition),window.removeEventListener("touchmove",this.updateSliderPosition)},updateSliderPosition:function(e){var t=e||window.event,n=t.touches?t.touches[0].pageX:t.pageX,i=n-window.pageXOffset,r=this.$refs.rightImageRef.getBoundingClientRect(),o=i-r.left,a=0+this.sliderLineWidth/2,s=this.imageWidth-this.sliderLineWidth/2;o<a&&(o=a),o>s&&(o=s),this.positionPct=o/this.imageWidth}},data:function(){return{positionPct:this.sliderPositionPercentage||.5,imageWidth:0}},computed:{leftImageStyle:function(){return{clip:"rect(auto, ".concat(this.imageWidth*this.positionPct,"px, auto, auto)")}},rightLabelStyle:function(){var e=Math.max(0,this.rightLabelWidth+this.imageWidth*(this.positionPct-1));return{clip:"rect(auto, auto, auto, ".concat(e,"px)")}},sliderStyle:function(){return{cursor:!this.hover&&"ew-resize",left:this.imageWidth*this.positionPct-this.handleSize/2+"px",width:"".concat(this.handleSize,"px")}},sliderLineStyle:function(){return{width:"".concat(this.sliderLineWidth,"px")}},sliderHandleStyle:function(){return{border:"".concat(this.sliderLineWidth,"px solid white"),height:"".concat(this.handleSize,"px"),width:"".concat(this.handleSize,"px")}},sliderLeftArrowStyle:function(){return{border:"inset ".concat(.15*this.handleSize,"px rgba(0,0,0,0)"),borderRight:"".concat(.15*this.handleSize,"px solid white"),marginLeft:"-".concat(.25*this.handleSize,"px"),marginRight:"".concat(.25*this.handleSize,"px")}},sliderRightArrowStyle:function(){return{border:"inset ".concat(.15*this.handleSize,"px rgba(0,0,0,0)"),borderLeft:"".concat(.15*this.handleSize,"px solid white"),marginRight:"-".concat(.25*this.handleSize,"px")}}}}),d=u;n("213d");function l(e,t,n,i,r,o,a,s){var c,u="function"===typeof e?e.options:e;if(t&&(u.render=t,u.staticRenderFns=n,u._compiled=!0),i&&(u.functional=!0),o&&(u._scopeId="data-v-"+o),a?(c=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(a)},u._ssrRegister=c):r&&(c=s?function(){r.call(this,this.$root.$options.shadowRoot)}:r),c)if(u.functional){u._injectStyles=c;var d=u.render;u.render=function(e,t){return c.call(t),d(e,t)}}else{var l=u.beforeCreate;u.beforeCreate=l?[].concat(l,c):[c]}return{exports:e,options:u}}var f=l(d,r,o,!1,null,"1e5eda20",null),h=f.exports;t["default"]=h},fc6a:function(e,t,n){var i=n("44ad"),r=n("1d80");e.exports=function(e){return i(r(e))}}})["default"]}));
//# sourceMappingURL=vueCompareImage.umd.min.js.map