beenull/CasaOS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity
CasaOS/web/js/13.js
link 87e66aae8a
0.3.4 (#408) 
* delete connect

* update user

* change branch

* API feedback (#341)

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* change branch

* update route

* change branch

* Update route.go

* 0.3.4 Function development completed

* Update system.go

* update ui

* Completed v0.3.4 and released alpha

* Update gin.go

* fix the problem of docker environment variables being displayed more than once

Co-authored-by: Tiger Wang (王豫) <tigerwang@outlook.com>
2022-07-26 11:03:45 +08:00

13 lines
No EOL
128 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([[13],{"./node_modules/v-viewer/dist/v-viewer.js":
/*!************************************************!*\
!*** ./node_modules/v-viewer/dist/v-viewer.js ***!
\************************************************/
/*! no static exports found */function(module,exports,__webpack_require__){eval("(function webpackUniversalModuleDefinition(root, factory) {\n\tif(true)\n\t\tmodule.exports = factory(__webpack_require__(/*! viewerjs */ \"./node_modules/viewerjs/dist/viewer.js\"), __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\"));\n\telse {}\n})(this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_2__) {\nreturn /******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId]) {\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/ \t\t}\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// identity function for calling harmony imports with the correct context\n/******/ \t__webpack_require__.i = function(value) { return value; };\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(__webpack_require__.s = 6);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ (function(module, exports) {\n\nmodule.exports = __WEBPACK_EXTERNAL_MODULE_0__;\n\n/***/ }),\n/* 1 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* harmony export (immutable) */ __webpack_exports__[\"a\"] = extend;\n\nfunction extend() {\n var extended = {};\n var deep = false;\n var i = 0;\n var length = arguments.length;\n\n if (Object.prototype.toString.call(arguments[0]) === '[object Boolean]') {\n deep = arguments[0];\n i++;\n }\n\n function merge(obj) {\n for (var prop in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, prop)) {\n if (deep && Object.prototype.toString.call(obj[prop]) === '[object Object]') {\n extended[prop] = extend(true, extended[prop], obj[prop]);\n } else {\n extended[prop] = obj[prop];\n }\n }\n }\n }\n\n for (; i < length; i++) {\n var obj = arguments[i];\n merge(obj);\n }\n\n return extended;\n}\n\n/***/ }),\n/* 2 */\n/***/ (function(module, exports) {\n\nmodule.exports = __WEBPACK_EXTERNAL_MODULE_2__;\n\n/***/ }),\n/* 3 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_viewerjs__ = __webpack_require__(0);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_viewerjs___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_viewerjs__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__utils__ = __webpack_require__(1);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_vue__ = __webpack_require__(2);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2_vue__);\n\n\n\n\nvar api = function api() {\n var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},\n _ref$images = _ref.images,\n images = _ref$images === undefined ? [] : _ref$images,\n _ref$options = _ref.options,\n options = _ref$options === undefined ? {} : _ref$options;\n\n options = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils__[\"a\" /* extend */])(options, {\n inline: false });\n\n var ViewerToken = __WEBPACK_IMPORTED_MODULE_2_vue___default.a.extend({\n render: function render(h) {\n return h('div', {\n style: {\n display: 'none'\n },\n class: ['__viewer-token']\n }, images.map(function (attr) {\n return h('img', {\n attrs: typeof attr === 'string' ? { src: attr } : attr\n });\n }));\n }\n });\n var token = new ViewerToken();\n token.$mount();\n document.body.appendChild(token.$el);\n\n var $viewer = new __WEBPACK_IMPORTED_MODULE_0_viewerjs___default.a(token.$el, options);\n var $destroy = $viewer.destroy.bind($viewer);\n $viewer.destroy = function () {\n $destroy();\n token.$destroy();\n document.body.removeChild(token.$el);\n return $viewer;\n };\n $viewer.show();\n\n token.$el.addEventListener('hidden', function () {\n if (this.viewer === $viewer) {\n $viewer.destroy();\n }\n });\n\n return $viewer;\n};\n\n/* harmony default export */ __webpack_exports__[\"a\"] = (api);\n\n/***/ }),\n/* 4 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* WEBPACK VAR INJECTION */(function(global) {/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_viewerjs__ = __webpack_require__(0);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_viewerjs___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_viewerjs__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_throttle_debounce__ = __webpack_require__(7);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_throttle_debounce___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_throttle_debounce__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_vue__ = __webpack_require__(2);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2_vue__);\n\n\n\n\nvar directive = function directive() {\n var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},\n _ref$name = _ref.name,\n name = _ref$name === undefined ? 'viewer' : _ref$name,\n _ref$debug = _ref.debug,\n debug = _ref$debug === undefined ? false : _ref$debug;\n\n function createViewer(el, options) {\n var rebuild = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;\n var observer = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;\n\n __WEBPACK_IMPORTED_MODULE_2_vue___default.a.nextTick(function () {\n if (observer && !imageDiff(el)) return;\n if (rebuild || !el['$' + name]) {\n destroyViewer(el);\n el['$' + name] = new __WEBPACK_IMPORTED_MODULE_0_viewerjs___default.a(el, options);\n log('Viewer created');\n } else {\n el['$' + name].update();\n log('Viewer updated');\n }\n });\n }\n\n function imageDiff(el) {\n var imageContent = el.innerHTML.match(/<img([\\w\\W]+?)[\\\\/]?>/g);\n var viewerImageText = imageContent ? imageContent.join('') : undefined;\n if (el.__viewerImageDiffCache === viewerImageText) {\n log('Element change detected, but image(s) has not changed');\n return false;\n } else {\n log('Image change detected');\n el.__viewerImageDiffCache = viewerImageText;\n return true;\n }\n }\n\n function createObserver(el, options, debouncedCreateViewer, rebuild) {\n destroyObserver(el);\n var MutationObserver = global.MutationObserver || global.WebKitMutationObserver || global.MozMutationObserver;\n if (!MutationObserver) {\n log('Observer not supported');\n return;\n }\n var observer = new MutationObserver(function (mutations) {\n mutations.forEach(function (mutation) {\n log('Viewer mutation:' + mutation.type);\n debouncedCreateViewer(el, options, rebuild, true);\n });\n });\n var config = { attributes: true, childList: true, characterData: true, subtree: true };\n observer.observe(el, config);\n el.__viewerMutationObserver = observer;\n log('Observer created');\n }\n\n function createWatcher(el, _ref2, vnode, debouncedCreateViewer) {\n var expression = _ref2.expression;\n\n var simplePathRE = /^[A-Za-z_$][\\w$]*(?:\\.[A-Za-z_$][\\w$]*|\\['[^']*?']|\\[\"[^\"]*?\"]|\\[\\d+]|\\[[A-Za-z_$][\\w$]*])*$/;\n if (!expression || !simplePathRE.test(expression)) {\n log('Only simple dot-delimited paths can create watcher');\n return;\n }\n el.__viewerUnwatch = vnode.context.$watch(expression, function (newVal, oldVal) {\n log('Change detected by watcher: ', expression);\n debouncedCreateViewer(el, newVal, true);\n }, {\n deep: true\n });\n log('Watcher created, expression: ', expression);\n }\n\n function destroyViewer(el) {\n if (!el['$' + name]) {\n return;\n }\n el['$' + name].destroy();\n delete el['$' + name];\n log('Viewer destroyed');\n }\n\n function destroyObserver(el) {\n if (!el.__viewerMutationObserver) {\n return;\n }\n el.__viewerMutationObserver.disconnect();\n delete el.__viewerMutationObserver;\n log('Observer destroyed');\n }\n\n function destroyWatcher(el) {\n if (!el.__viewerUnwatch) {\n return;\n }\n el.__viewerUnwatch();\n delete el.__viewerUnwatch;\n log('Watcher destroyed');\n }\n\n function log() {\n var _console;\n\n debug && (_console = console).log.apply(_console, arguments);\n }\n\n var directive = {\n bind: function bind(el, binding, vnode) {\n log('Viewer bind');\n var debouncedCreateViewer = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1_throttle_debounce__[\"debounce\"])(50, createViewer);\n debouncedCreateViewer(el, binding.value);\n\n createWatcher(el, binding, vnode, debouncedCreateViewer);\n\n if (!binding.modifiers.static) {\n createObserver(el, binding.value, debouncedCreateViewer, binding.modifiers.rebuild);\n }\n },\n unbind: function unbind(el, binding) {\n log('Viewer unbind');\n\n destroyObserver(el);\n\n destroyWatcher(el);\n\n destroyViewer(el);\n }\n };\n\n return directive;\n};\n\n/* harmony default export */ __webpack_exports__[\"a\"] = (directive);\n/* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(9)))\n\n/***/ }),\n/* 5 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar Component = __webpack_require__(10)(\n /* script */\n __webpack_require__(8),\n /* template */\n __webpack_require__(11),\n /* scopeId */\n null,\n /* cssModules */\n null\n)\nComponent.options.__file = \"/Volumes/public/Workspace/web/v-viewer/src/component.vue\"\nif (Component.esModule && Object.keys(Component.esModule).some(function (key) {return key !== \"default\" && key !== \"__esModule\"})) {console.error(\"named exports are not supported in *.vue files.\")}\nif (Component.options.functional) {console.error(\"[vue-loader] component.vue: functional components are not supported with templates, they should use render functions.\")}\n\n/* hot reload */\nif (false) {}\n\nmodule.exports = Component.exports\n\n\n/***/ }),\n/* 6 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__utils__ = __webpack_require__(1);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_viewerjs__ = __webpack_require__(0);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_viewerjs___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_viewerjs__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__component_vue__ = __webpack_require__(5);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__component_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__component_vue__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__directive__ = __webpack_require__(4);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__api__ = __webpack_require__(3);\n/* harmony reexport (default from non-hamory) */ __webpack_require__.d(__webpack_exports__, \"component\", function() { return __WEBPACK_IMPORTED_MODULE_2__component_vue___default.a; });\n/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, \"directive\", function() { return __WEBPACK_IMPORTED_MODULE_3__directive__[\"a\"]; });\n/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, \"api\", function() { return __WEBPACK_IMPORTED_MODULE_4__api__[\"a\"]; });\n/* harmony reexport (default from non-hamory) */ __webpack_require__.d(__webpack_exports__, \"Viewer\", function() { return __WEBPACK_IMPORTED_MODULE_1_viewerjs___default.a; });\n\n\n\n\n\n\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n install: function install(Vue) {\n var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},\n _ref$name = _ref.name,\n name = _ref$name === undefined ? 'viewer' : _ref$name,\n _ref$debug = _ref.debug,\n debug = _ref$debug === undefined ? false : _ref$debug,\n defaultOptions = _ref.defaultOptions;\n\n __WEBPACK_IMPORTED_MODULE_1_viewerjs___default.a.setDefaults(defaultOptions);\n\n Vue.component(name, __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__utils__[\"a\" /* extend */])(__WEBPACK_IMPORTED_MODULE_2__component_vue___default.a, { name: name }));\n Vue.directive(name, __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__directive__[\"a\" /* default */])({ name: name, debug: debug }));\n Vue.prototype['$' + name + 'Api'] = __WEBPACK_IMPORTED_MODULE_4__api__[\"a\" /* default */];\n },\n setDefaults: function setDefaults(defaultOptions) {\n __WEBPACK_IMPORTED_MODULE_1_viewerjs___default.a.setDefaults(defaultOptions);\n }\n});\n\n/***/ }),\n/* 7 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;var _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; };\n\n(function (global, factory) {\n\t( false ? undefined : _typeof(exports)) === 'object' && typeof module !== 'undefined' ? factory(exports) : true ? !(__WEBPACK_AMD_DEFINE_ARRAY__ = [exports], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?\n\t\t\t\t(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)) : (undefined);\n})(this, function (exports) {\n\t'use strict';\n\n\tfunction throttle(delay, noTrailing, callback, debounceMode) {\n\t\tvar timeoutID;\n\t\tvar cancelled = false;\n\n\t\tvar lastExec = 0;\n\n\t\tfunction clearExistingTimeout() {\n\t\t\tif (timeoutID) {\n\t\t\t\tclearTimeout(timeoutID);\n\t\t\t}\n\t\t}\n\n\t\tfunction cancel() {\n\t\t\tclearExistingTimeout();\n\t\t\tcancelled = true;\n\t\t}\n\n\t\tif (typeof noTrailing !== 'boolean') {\n\t\t\tdebounceMode = callback;\n\t\t\tcallback = noTrailing;\n\t\t\tnoTrailing = undefined;\n\t\t}\n\n\n\t\tfunction wrapper() {\n\t\t\tfor (var _len = arguments.length, arguments_ = new Array(_len), _key = 0; _key < _len; _key++) {\n\t\t\t\targuments_[_key] = arguments[_key];\n\t\t\t}\n\n\t\t\tvar self = this;\n\t\t\tvar elapsed = Date.now() - lastExec;\n\n\t\t\tif (cancelled) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfunction exec() {\n\t\t\t\tlastExec = Date.now();\n\t\t\t\tcallback.apply(self, arguments_);\n\t\t\t}\n\n\n\t\t\tfunction clear() {\n\t\t\t\ttimeoutID = undefined;\n\t\t\t}\n\n\t\t\tif (debounceMode && !timeoutID) {\n\t\t\t\texec();\n\t\t\t}\n\n\t\t\tclearExistingTimeout();\n\n\t\t\tif (debounceMode === undefined && elapsed > delay) {\n\t\t\t\texec();\n\t\t\t} else if (noTrailing !== true) {\n\t\t\t\ttimeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);\n\t\t\t}\n\t\t}\n\n\t\twrapper.cancel = cancel;\n\n\t\treturn wrapper;\n\t}\n\n\tfunction debounce(delay, atBegin, callback) {\n\t\treturn callback === undefined ? throttle(delay, atBegin, false) : throttle(delay, callback, atBegin !== false);\n\t}\n\n\texports.debounce = debounce;\n\texports.throttle = throttle;\n\n\tObject.defineProperty(exports, '__esModule', { value: true });\n});\n\n/***/ }),\n/* 8 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_viewerjs__ = __webpack_require__(0);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_viewerjs___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_viewerjs__);\n\n\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n props: {\n images: {\n type: Array\n },\n rebuild: {\n type: Boolean,\n default: false\n },\n trigger: {},\n options: {\n type: Object\n }\n },\n\n data: function data() {\n return {};\n },\n\n\n computed: {},\n\n methods: {\n onChange: function onChange() {\n if (this.rebuild) {\n this.rebuildViewer();\n } else {\n this.updateViewer();\n }\n },\n rebuildViewer: function rebuildViewer() {\n this.destroyViewer();\n this.createViewer();\n },\n updateViewer: function updateViewer() {\n if (this.$viewer) {\n this.$viewer.update();\n this.$emit('inited', this.$viewer);\n } else {\n this.createViewer();\n }\n },\n destroyViewer: function destroyViewer() {\n this.$viewer && this.$viewer.destroy();\n },\n createViewer: function createViewer() {\n this.$viewer = new __WEBPACK_IMPORTED_MODULE_0_viewerjs___default.a(this.$el, this.options);\n this.$emit('inited', this.$viewer);\n }\n },\n\n watch: {\n images: function images() {\n var _this = this;\n\n this.$nextTick(function () {\n _this.onChange();\n });\n },\n\n trigger: {\n handler: function handler() {\n var _this2 = this;\n\n this.$nextTick(function () {\n _this2.onChange();\n });\n },\n\n deep: true\n },\n options: {\n handler: function handler() {\n var _this3 = this;\n\n this.$nextTick(function () {\n _this3.rebuildViewer();\n });\n },\n\n deep: true\n }\n },\n\n mounted: function mounted() {\n this.createViewer();\n },\n destroyed: function destroyed() {\n this.destroyViewer();\n }\n});\n\n/***/ }),\n/* 9 */\n/***/ (function(module, exports) {\n\nvar _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; };\n\nvar g;\n\ng = function () {\n\treturn this;\n}();\n\ntry {\n\tg = g || Function(\"return this\")() || (1, eval)(\"this\");\n} catch (e) {\n\tif ((typeof window === \"undefined\" ? \"undefined\" : _typeof(window)) === \"object\") g = window;\n}\n\nmodule.exports = g;\n\n/***/ }),\n/* 10 */\n/***/ (function(module, exports) {\n\n// this module is a runtime utility for cleaner component module output and will\n// be included in the final webpack user bundle\n\nmodule.exports = function normalizeComponent (\n rawScriptExports,\n compiledTemplate,\n scopeId,\n cssModules\n) {\n var esModule\n var scriptExports = rawScriptExports = rawScriptExports || {}\n\n // ES6 modules interop\n var type = typeof rawScriptExports.default\n if (type === 'object' || type === 'function') {\n esModule = rawScriptExports\n scriptExports = rawScriptExports.default\n }\n\n // Vue.extend constructor export interop\n var options = typeof scriptExports === 'function'\n ? scriptExports.options\n : scriptExports\n\n // render functions\n if (compiledTemplate) {\n options.render = compiledTemplate.render\n options.staticRenderFns = compiledTemplate.staticRenderFns\n }\n\n // scopedId\n if (scopeId) {\n options._scopeId = scopeId\n }\n\n // inject cssModules\n if (cssModules) {\n var computed = Object.create(options.computed || null)\n Object.keys(cssModules).forEach(function (key) {\n var module = cssModules[key]\n computed[key] = function () { return module }\n })\n options.computed = computed\n }\n\n return {\n esModule: esModule,\n exports: scriptExports,\n options: options\n }\n}\n\n\n/***/ }),\n/* 11 */\n/***/ (function(module, exports, __webpack_require__) {\n\nmodule.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n return _c('div', [_vm._t(\"default\", null, {\n \"images\": _vm.images,\n \"options\": _vm.options\n })], 2)\n},staticRenderFns: []}\nmodule.exports.render._withStripped = true\nif (false) {}\n\n/***/ })\n/******/ ]);\n});\n\n//# sourceURL=webpack:///./node_modules/v-viewer/dist/v-viewer.js?")},"./node_modules/viewerjs/dist/viewer.css":
/*!***********************************************!*\
!*** ./node_modules/viewerjs/dist/viewer.css ***!
\***********************************************/
/*! no static exports found */function(module,exports,__webpack_require__){eval("// extracted by mini-css-extract-plugin\n if(false) { var cssReload; }\n \n\n//# sourceURL=webpack:///./node_modules/viewerjs/dist/viewer.css?")},"./node_modules/viewerjs/dist/viewer.js":
/*!**********************************************!*\
!*** ./node_modules/viewerjs/dist/viewer.js ***!
\**********************************************/
/*! no static exports found */function(module,exports,__webpack_require__){eval("/*!\n * Viewer.js v1.10.5\n * https://fengyuanchen.github.io/viewerjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2022-04-05T08:21:02.491Z\n */\n\n(function (global, factory) {\n true ? module.exports = factory() :\n undefined;\n})(this, (function () { 'use strict';\n\n function ownKeys(object, enumerableOnly) {\n var keys = Object.keys(object);\n\n if (Object.getOwnPropertySymbols) {\n var symbols = Object.getOwnPropertySymbols(object);\n enumerableOnly && (symbols = symbols.filter(function (sym) {\n return Object.getOwnPropertyDescriptor(object, sym).enumerable;\n })), keys.push.apply(keys, symbols);\n }\n\n return keys;\n }\n\n function _objectSpread2(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = null != arguments[i] ? arguments[i] : {};\n i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {\n _defineProperty(target, key, source[key]);\n }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {\n Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));\n });\n }\n\n return target;\n }\n\n function _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) {\n return typeof obj;\n } : function (obj) {\n return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n }, _typeof(obj);\n }\n\n function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n }\n\n function _defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n function _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n Object.defineProperty(Constructor, \"prototype\", {\n writable: false\n });\n return Constructor;\n }\n\n function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n }\n\n var DEFAULTS = {\n /**\n * Enable a modal backdrop, specify `static` for a backdrop\n * which doesn't close the modal on click.\n * @type {boolean}\n */\n backdrop: true,\n\n /**\n * Show the button on the top-right of the viewer.\n * @type {boolean}\n */\n button: true,\n\n /**\n * Show the navbar.\n * @type {boolean | number}\n */\n navbar: true,\n\n /**\n * Specify the visibility and the content of the title.\n * @type {boolean | number | Function | Array}\n */\n title: true,\n\n /**\n * Show the toolbar.\n * @type {boolean | number | Object}\n */\n toolbar: true,\n\n /**\n * Custom class name(s) to add to the viewer's root element.\n * @type {string}\n */\n className: '',\n\n /**\n * Define where to put the viewer in modal mode.\n * @type {string | Element}\n */\n container: 'body',\n\n /**\n * Filter the images for viewing. Return true if the image is viewable.\n * @type {Function}\n */\n filter: null,\n\n /**\n * Enable to request fullscreen when play.\n * {@link https://developer.mozilla.org/en-US/docs/Web/API/FullscreenOptions}\n * @type {boolean|FullscreenOptions}\n */\n fullscreen: true,\n\n /**\n * Define the extra attributes to inherit from the original image.\n * @type {Array}\n */\n inheritedAttributes: ['crossOrigin', 'decoding', 'isMap', 'loading', 'referrerPolicy', 'sizes', 'srcset', 'useMap'],\n\n /**\n * Define the initial index of image for viewing.\n * @type {number}\n */\n initialViewIndex: 0,\n\n /**\n * Enable inline mode.\n * @type {boolean}\n */\n inline: false,\n\n /**\n * The amount of time to delay between automatically cycling an image when playing.\n * @type {number}\n */\n interval: 5000,\n\n /**\n * Enable keyboard support.\n * @type {boolean}\n */\n keyboard: true,\n\n /**\n * Focus the viewer when initialized.\n * @type {boolean}\n */\n focus: true,\n\n /**\n * Indicate if show a loading spinner when load image or not.\n * @type {boolean}\n */\n loading: true,\n\n /**\n * Indicate if enable loop viewing or not.\n * @type {boolean}\n */\n loop: true,\n\n /**\n * Min width of the viewer in inline mode.\n * @type {number}\n */\n minWidth: 200,\n\n /**\n * Min height of the viewer in inline mode.\n * @type {number}\n */\n minHeight: 100,\n\n /**\n * Enable to move the image.\n * @type {boolean}\n */\n movable: true,\n\n /**\n * Enable to rotate the image.\n * @type {boolean}\n */\n rotatable: true,\n\n /**\n * Enable to scale the image.\n * @type {boolean}\n */\n scalable: true,\n\n /**\n * Enable to zoom the image.\n * @type {boolean}\n */\n zoomable: true,\n\n /**\n * Enable to zoom the current image by dragging on the touch screen.\n * @type {boolean}\n */\n zoomOnTouch: true,\n\n /**\n * Enable to zoom the image by wheeling mouse.\n * @type {boolean}\n */\n zoomOnWheel: true,\n\n /**\n * Enable to slide to the next or previous image by swiping on the touch screen.\n * @type {boolean}\n */\n slideOnTouch: true,\n\n /**\n * Indicate if toggle the image size between its natural size\n * and initial size when double click on the image or not.\n * @type {boolean}\n */\n toggleOnDblclick: true,\n\n /**\n * Show the tooltip with image ratio (percentage) when zoom in or zoom out.\n * @type {boolean}\n */\n tooltip: true,\n\n /**\n * Enable CSS3 Transition for some special elements.\n * @type {boolean}\n */\n transition: true,\n\n /**\n * Define the CSS `z-index` value of viewer in modal mode.\n * @type {number}\n */\n zIndex: 2015,\n\n /**\n * Define the CSS `z-index` value of viewer in inline mode.\n * @type {number}\n */\n zIndexInline: 0,\n\n /**\n * Define the ratio when zoom the image by wheeling mouse.\n * @type {number}\n */\n zoomRatio: 0.1,\n\n /**\n * Define the min ratio of the image when zoom out.\n * @type {number}\n */\n minZoomRatio: 0.01,\n\n /**\n * Define the max ratio of the image when zoom in.\n * @type {number}\n */\n maxZoomRatio: 100,\n\n /**\n * Define where to get the original image URL for viewing.\n * @type {string | Function}\n */\n url: 'src',\n\n /**\n * Event shortcuts.\n * @type {Function}\n */\n ready: null,\n show: null,\n shown: null,\n hide: null,\n hidden: null,\n view: null,\n viewed: null,\n move: null,\n moved: null,\n rotate: null,\n rotated: null,\n scale: null,\n scaled: null,\n zoom: null,\n zoomed: null,\n play: null,\n stop: null\n };\n\n var TEMPLATE = '<div class=\"viewer-container\" tabindex=\"-1\" touch-action=\"none\">' + '<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\" role=\"navigation\"></ul>' + '</div>' + '</div>' + '<div class=\"viewer-tooltip\" role=\"alert\" aria-hidden=\"true\"></div>' + '<div class=\"viewer-button\" data-viewer-action=\"mix\" role=\"button\"></div>' + '<div class=\"viewer-player\"></div>' + '</div>';\n\n var IS_BROWSER = typeof window !== 'undefined' && typeof window.document !== 'undefined';\n var WINDOW = IS_BROWSER ? window : {};\n var IS_TOUCH_DEVICE = IS_BROWSER && WINDOW.document.documentElement ? 'ontouchstart' in WINDOW.document.documentElement : false;\n var HAS_POINTER_EVENT = IS_BROWSER ? 'PointerEvent' in WINDOW : false;\n var NAMESPACE = 'viewer'; // Actions\n\n var ACTION_MOVE = 'move';\n var ACTION_SWITCH = 'switch';\n var ACTION_ZOOM = 'zoom'; // Classes\n\n var CLASS_ACTIVE = \"\".concat(NAMESPACE, \"-active\");\n var CLASS_CLOSE = \"\".concat(NAMESPACE, \"-close\");\n var CLASS_FADE = \"\".concat(NAMESPACE, \"-fade\");\n var CLASS_FIXED = \"\".concat(NAMESPACE, \"-fixed\");\n var CLASS_FULLSCREEN = \"\".concat(NAMESPACE, \"-fullscreen\");\n var CLASS_FULLSCREEN_EXIT = \"\".concat(NAMESPACE, \"-fullscreen-exit\");\n var CLASS_HIDE = \"\".concat(NAMESPACE, \"-hide\");\n var CLASS_HIDE_MD_DOWN = \"\".concat(NAMESPACE, \"-hide-md-down\");\n var CLASS_HIDE_SM_DOWN = \"\".concat(NAMESPACE, \"-hide-sm-down\");\n var CLASS_HIDE_XS_DOWN = \"\".concat(NAMESPACE, \"-hide-xs-down\");\n var CLASS_IN = \"\".concat(NAMESPACE, \"-in\");\n var CLASS_INVISIBLE = \"\".concat(NAMESPACE, \"-invisible\");\n var CLASS_LOADING = \"\".concat(NAMESPACE, \"-loading\");\n var CLASS_MOVE = \"\".concat(NAMESPACE, \"-move\");\n var CLASS_OPEN = \"\".concat(NAMESPACE, \"-open\");\n var CLASS_SHOW = \"\".concat(NAMESPACE, \"-show\");\n var CLASS_TRANSITION = \"\".concat(NAMESPACE, \"-transition\"); // Native events\n\n var EVENT_CLICK = 'click';\n var EVENT_DBLCLICK = 'dblclick';\n var EVENT_DRAG_START = 'dragstart';\n var EVENT_FOCUSIN = 'focusin';\n var EVENT_KEY_DOWN = 'keydown';\n var EVENT_LOAD = 'load';\n var EVENT_ERROR = 'error';\n var EVENT_TOUCH_END = IS_TOUCH_DEVICE ? 'touchend touchcancel' : 'mouseup';\n var EVENT_TOUCH_MOVE = IS_TOUCH_DEVICE ? 'touchmove' : 'mousemove';\n var EVENT_TOUCH_START = IS_TOUCH_DEVICE ? 'touchstart' : 'mousedown';\n var EVENT_POINTER_DOWN = HAS_POINTER_EVENT ? 'pointerdown' : EVENT_TOUCH_START;\n var EVENT_POINTER_MOVE = HAS_POINTER_EVENT ? 'pointermove' : EVENT_TOUCH_MOVE;\n var EVENT_POINTER_UP = HAS_POINTER_EVENT ? 'pointerup pointercancel' : EVENT_TOUCH_END;\n var EVENT_RESIZE = 'resize';\n var EVENT_TRANSITION_END = 'transitionend';\n var EVENT_WHEEL = 'wheel'; // Custom events\n\n var EVENT_READY = 'ready';\n var EVENT_SHOW = 'show';\n var EVENT_SHOWN = 'shown';\n var EVENT_HIDE = 'hide';\n var EVENT_HIDDEN = 'hidden';\n var EVENT_VIEW = 'view';\n var EVENT_VIEWED = 'viewed';\n var EVENT_MOVE = 'move';\n var EVENT_MOVED = 'moved';\n var EVENT_ROTATE = 'rotate';\n var EVENT_ROTATED = 'rotated';\n var EVENT_SCALE = 'scale';\n var EVENT_SCALED = 'scaled';\n var EVENT_ZOOM = 'zoom';\n var EVENT_ZOOMED = 'zoomed';\n var EVENT_PLAY = 'play';\n var EVENT_STOP = 'stop'; // Data keys\n\n var DATA_ACTION = \"\".concat(NAMESPACE, \"Action\"); // RegExps\n\n var REGEXP_SPACES = /\\s\\s*/; // Misc\n\n var BUTTONS = ['zoom-in', 'zoom-out', 'one-to-one', 'reset', 'prev', 'play', 'next', 'rotate-left', 'rotate-right', 'flip-horizontal', 'flip-vertical'];\n\n /**\n * Check if the given value is a string.\n * @param {*} value - The value to check.\n * @returns {boolean} Returns `true` if the given value is a string, else `false`.\n */\n\n function isString(value) {\n return typeof value === 'string';\n }\n /**\n * Check if the given value is not a number.\n */\n\n var isNaN = Number.isNaN || WINDOW.isNaN;\n /**\n * Check if the given value is a number.\n * @param {*} value - The value to check.\n * @returns {boolean} Returns `true` if the given value is a number, else `false`.\n */\n\n function isNumber(value) {\n return typeof value === 'number' && !isNaN(value);\n }\n /**\n * Check if the given value is undefined.\n * @param {*} value - The value to check.\n * @returns {boolean} Returns `true` if the given value is undefined, else `false`.\n */\n\n function isUndefined(value) {\n return typeof value === 'undefined';\n }\n /**\n * Check if the given value is an object.\n * @param {*} value - The value to check.\n * @returns {boolean} Returns `true` if the given value is an object, else `false`.\n */\n\n function isObject(value) {\n return _typeof(value) === 'object' && value !== null;\n }\n var hasOwnProperty = Object.prototype.hasOwnProperty;\n /**\n * Check if the given value is a plain object.\n * @param {*} value - The value to check.\n * @returns {boolean} Returns `true` if the given value is a plain object, else `false`.\n */\n\n function isPlainObject(value) {\n if (!isObject(value)) {\n return false;\n }\n\n try {\n var _constructor = value.constructor;\n var prototype = _constructor.prototype;\n return _constructor && prototype && hasOwnProperty.call(prototype, 'isPrototypeOf');\n } catch (error) {\n return false;\n }\n }\n /**\n * Check if the given value is a function.\n * @param {*} value - The value to check.\n * @returns {boolean} Returns `true` if the given value is a function, else `false`.\n */\n\n function isFunction(value) {\n return typeof value === 'function';\n }\n /**\n * Iterate the given data.\n * @param {*} data - The data to iterate.\n * @param {Function} callback - The process function for each element.\n * @returns {*} The original data.\n */\n\n function forEach(data, callback) {\n if (data && isFunction(callback)) {\n if (Array.isArray(data) || isNumber(data.length)\n /* array-like */\n ) {\n var length = data.length;\n var i;\n\n for (i = 0; i < length; i += 1) {\n if (callback.call(data, data[i], i, data) === false) {\n break;\n }\n }\n } else if (isObject(data)) {\n Object.keys(data).forEach(function (key) {\n callback.call(data, data[key], key, data);\n });\n }\n }\n\n return data;\n }\n /**\n * Extend the given object.\n * @param {*} obj - The object to be extended.\n * @param {*} args - The rest objects which will be merged to the first object.\n * @returns {Object} The extended object.\n */\n\n var assign = Object.assign || function assign(obj) {\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n if (isObject(obj) && args.length > 0) {\n args.forEach(function (arg) {\n if (isObject(arg)) {\n Object.keys(arg).forEach(function (key) {\n obj[key] = arg[key];\n });\n }\n });\n }\n\n return obj;\n };\n var REGEXP_SUFFIX = /^(?:width|height|left|top|marginLeft|marginTop)$/;\n /**\n * Apply styles to the given element.\n * @param {Element} element - The target element.\n * @param {Object} styles - The styles for applying.\n */\n\n function setStyle(element, styles) {\n var style = element.style;\n forEach(styles, function (value, property) {\n if (REGEXP_SUFFIX.test(property) && isNumber(value)) {\n value += 'px';\n }\n\n style[property] = value;\n });\n }\n /**\n * Escape a string for using in HTML.\n * @param {String} value - The string to escape.\n * @returns {String} Returns the escaped string.\n */\n\n function escapeHTMLEntities(value) {\n return isString(value) ? value.replace(/&(?!amp;|quot;|#39;|lt;|gt;)/g, '&amp;').replace(/\"/g, '&quot;').replace(/'/g, '&#39;').replace(/</g, '&lt;').replace(/>/g, '&gt;') : value;\n }\n /**\n * Check if the given element has a special class.\n * @param {Element} element - The element to check.\n * @param {string} value - The class to search.\n * @returns {boolean} Returns `true` if the special class was found.\n */\n\n function hasClass(element, value) {\n if (!element || !value) {\n return false;\n }\n\n return element.classList ? element.classList.contains(value) : element.className.indexOf(value) > -1;\n }\n /**\n * Add classes to the given element.\n * @param {Element} element - The target element.\n * @param {string} value - The classes to be added.\n */\n\n function addClass(element, value) {\n if (!element || !value) {\n return;\n }\n\n if (isNumber(element.length)) {\n forEach(element, function (elem) {\n addClass(elem, value);\n });\n return;\n }\n\n if (element.classList) {\n element.classList.add(value);\n return;\n }\n\n var className = element.className.trim();\n\n if (!className) {\n element.className = value;\n } else if (className.indexOf(value) < 0) {\n element.className = \"\".concat(className, \" \").concat(value);\n }\n }\n /**\n * Remove classes from the given element.\n * @param {Element} element - The target element.\n * @param {string} value - The classes to be removed.\n */\n\n function removeClass(element, value) {\n if (!element || !value) {\n return;\n }\n\n if (isNumber(element.length)) {\n forEach(element, function (elem) {\n removeClass(elem, value);\n });\n return;\n }\n\n if (element.classList) {\n element.classList.remove(value);\n return;\n }\n\n if (element.className.indexOf(value) >= 0) {\n element.className = element.className.replace(value, '');\n }\n }\n /**\n * Add or remove classes from the given element.\n * @param {Element} element - The target element.\n * @param {string} value - The classes to be toggled.\n * @param {boolean} added - Add only.\n */\n\n function toggleClass(element, value, added) {\n if (!value) {\n return;\n }\n\n if (isNumber(element.length)) {\n forEach(element, function (elem) {\n toggleClass(elem, value, added);\n });\n return;\n } // IE10-11 doesn't support the second parameter of `classList.toggle`\n\n\n if (added) {\n addClass(element, value);\n } else {\n removeClass(element, value);\n }\n }\n var REGEXP_HYPHENATE = /([a-z\\d])([A-Z])/g;\n /**\n * Transform the given string from camelCase to kebab-case\n * @param {string} value - The value to transform.\n * @returns {string} The transformed value.\n */\n\n function hyphenate(value) {\n return value.replace(REGEXP_HYPHENATE, '$1-$2').toLowerCase();\n }\n /**\n * Get data from the given element.\n * @param {Element} element - The target element.\n * @param {string} name - The data key to get.\n * @returns {string} The data value.\n */\n\n function getData(element, name) {\n if (isObject(element[name])) {\n return element[name];\n }\n\n if (element.dataset) {\n return element.dataset[name];\n }\n\n return element.getAttribute(\"data-\".concat(hyphenate(name)));\n }\n /**\n * Set data to the given element.\n * @param {Element} element - The target element.\n * @param {string} name - The data key to set.\n * @param {string} data - The data value.\n */\n\n function setData(element, name, data) {\n if (isObject(data)) {\n element[name] = data;\n } else if (element.dataset) {\n element.dataset[name] = data;\n } else {\n element.setAttribute(\"data-\".concat(hyphenate(name)), data);\n }\n }\n\n var onceSupported = function () {\n var supported = false;\n\n if (IS_BROWSER) {\n var once = false;\n\n var listener = function listener() {};\n\n var options = Object.defineProperty({}, 'once', {\n get: function get() {\n supported = true;\n return once;\n },\n\n /**\n * This setter can fix a `TypeError` in strict mode\n * {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Getter_only}\n * @param {boolean} value - The value to set\n */\n set: function set(value) {\n once = value;\n }\n });\n WINDOW.addEventListener('test', listener, options);\n WINDOW.removeEventListener('test', listener, options);\n }\n\n return supported;\n }();\n /**\n * Remove event listener from the target element.\n * @param {Element} element - The event target.\n * @param {string} type - The event type(s).\n * @param {Function} listener - The event listener.\n * @param {Object} options - The event options.\n */\n\n\n function removeListener(element, type, listener) {\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};\n var handler = listener;\n type.trim().split(REGEXP_SPACES).forEach(function (event) {\n if (!onceSupported) {\n var listeners = element.listeners;\n\n if (listeners && listeners[event] && listeners[event][listener]) {\n handler = listeners[event][listener];\n delete listeners[event][listener];\n\n if (Object.keys(listeners[event]).length === 0) {\n delete listeners[event];\n }\n\n if (Object.keys(listeners).length === 0) {\n delete element.listeners;\n }\n }\n }\n\n element.removeEventListener(event, handler, options);\n });\n }\n /**\n * Add event listener to the target element.\n * @param {Element} element - The event target.\n * @param {string} type - The event type(s).\n * @param {Function} listener - The event listener.\n * @param {Object} options - The event options.\n */\n\n function addListener(element, type, listener) {\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};\n var _handler = listener;\n type.trim().split(REGEXP_SPACES).forEach(function (event) {\n if (options.once && !onceSupported) {\n var _element$listeners = element.listeners,\n listeners = _element$listeners === void 0 ? {} : _element$listeners;\n\n _handler = function handler() {\n delete listeners[event][listener];\n element.removeEventListener(event, _handler, options);\n\n for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n args[_key2] = arguments[_key2];\n }\n\n listener.apply(element, args);\n };\n\n if (!listeners[event]) {\n listeners[event] = {};\n }\n\n if (listeners[event][listener]) {\n element.removeEventListener(event, listeners[event][listener], options);\n }\n\n listeners[event][listener] = _handler;\n element.listeners = listeners;\n }\n\n element.addEventListener(event, _handler, options);\n });\n }\n /**\n * Dispatch event on the target element.\n * @param {Element} element - The event target.\n * @param {string} type - The event type(s).\n * @param {Object} data - The additional event data.\n * @param {Object} options - The additional event options.\n * @returns {boolean} Indicate if the event is default prevented or not.\n */\n\n function dispatchEvent(element, type, data, options) {\n var event; // Event and CustomEvent on IE9-11 are global objects, not constructors\n\n if (isFunction(Event) && isFunction(CustomEvent)) {\n event = new CustomEvent(type, _objectSpread2({\n bubbles: true,\n cancelable: true,\n detail: data\n }, options));\n } else {\n event = document.createEvent('CustomEvent');\n event.initCustomEvent(type, true, true, data);\n }\n\n return element.dispatchEvent(event);\n }\n /**\n * Get the offset base on the document.\n * @param {Element} element - The target element.\n * @returns {Object} The offset data.\n */\n\n function getOffset(element) {\n var box = element.getBoundingClientRect();\n return {\n left: box.left + (window.pageXOffset - document.documentElement.clientLeft),\n top: box.top + (window.pageYOffset - document.documentElement.clientTop)\n };\n }\n /**\n * Get transforms base on the given object.\n * @param {Object} obj - The target object.\n * @returns {string} A string contains transform values.\n */\n\n function getTransforms(_ref) {\n var rotate = _ref.rotate,\n scaleX = _ref.scaleX,\n scaleY = _ref.scaleY,\n translateX = _ref.translateX,\n translateY = _ref.translateY;\n var values = [];\n\n if (isNumber(translateX) && translateX !== 0) {\n values.push(\"translateX(\".concat(translateX, \"px)\"));\n }\n\n if (isNumber(translateY) && translateY !== 0) {\n values.push(\"translateY(\".concat(translateY, \"px)\"));\n } // Rotate should come first before scale to match orientation transform\n\n\n if (isNumber(rotate) && rotate !== 0) {\n values.push(\"rotate(\".concat(rotate, \"deg)\"));\n }\n\n if (isNumber(scaleX) && scaleX !== 1) {\n values.push(\"scaleX(\".concat(scaleX, \")\"));\n }\n\n if (isNumber(scaleY) && scaleY !== 1) {\n values.push(\"scaleY(\".concat(scaleY, \")\"));\n }\n\n var transform = values.length ? values.join(' ') : 'none';\n return {\n WebkitTransform: transform,\n msTransform: transform,\n transform: transform\n };\n }\n /**\n * Get an image name from an image url.\n * @param {string} url - The target url.\n * @example\n * // picture.jpg\n * getImageNameFromURL('https://domain.com/path/to/picture.jpg?size=1280×960')\n * @returns {string} A string contains the image name.\n */\n\n function getImageNameFromURL(url) {\n return isString(url) ? decodeURIComponent(url.replace(/^.*\\//, '').replace(/[?&#].*$/, '')) : '';\n }\n var IS_SAFARI = WINDOW.navigator && /(Macintosh|iPhone|iPod|iPad).*AppleWebKit/i.test(WINDOW.navigator.userAgent);\n /**\n * Get an image's natural sizes.\n * @param {string} image - The target image.\n * @param {Object} options - The viewer options.\n * @param {Function} callback - The callback function.\n * @returns {HTMLImageElement} The new image.\n */\n\n function getImageNaturalSizes(image, options, callback) {\n var newImage = document.createElement('img'); // Modern browsers (except Safari)\n\n if (image.naturalWidth && !IS_SAFARI) {\n callback(image.naturalWidth, image.naturalHeight);\n return newImage;\n }\n\n var body = document.body || document.documentElement;\n\n newImage.onload = function () {\n callback(newImage.width, newImage.height);\n\n if (!IS_SAFARI) {\n body.removeChild(newImage);\n }\n };\n\n forEach(options.inheritedAttributes, function (name) {\n var value = image.getAttribute(name);\n\n if (value !== null) {\n newImage.setAttribute(name, value);\n }\n });\n newImage.src = image.src; // iOS Safari will convert the image automatically\n // with its orientation once append it into DOM\n\n if (!IS_SAFARI) {\n newImage.style.cssText = 'left:0;' + 'max-height:none!important;' + 'max-width:none!important;' + 'min-height:0!important;' + 'min-width:0!important;' + 'opacity:0;' + 'position:absolute;' + 'top:0;' + 'z-index:-1;';\n body.appendChild(newImage);\n }\n\n return newImage;\n }\n /**\n * Get the related class name of a responsive type number.\n * @param {string} type - The responsive type.\n * @returns {string} The related class name.\n */\n\n function getResponsiveClass(type) {\n switch (type) {\n case 2:\n return CLASS_HIDE_XS_DOWN;\n\n case 3:\n return CLASS_HIDE_SM_DOWN;\n\n case 4:\n return CLASS_HIDE_MD_DOWN;\n\n default:\n return '';\n }\n }\n /**\n * Get the max ratio of a group of pointers.\n * @param {string} pointers - The target pointers.\n * @returns {number} The result ratio.\n */\n\n function getMaxZoomRatio(pointers) {\n var pointers2 = _objectSpread2({}, pointers);\n\n var ratios = [];\n forEach(pointers, function (pointer, pointerId) {\n delete pointers2[pointerId];\n forEach(pointers2, function (pointer2) {\n var x1 = Math.abs(pointer.startX - pointer2.startX);\n var y1 = Math.abs(pointer.startY - pointer2.startY);\n var x2 = Math.abs(pointer.endX - pointer2.endX);\n var y2 = Math.abs(pointer.endY - pointer2.endY);\n var z1 = Math.sqrt(x1 * x1 + y1 * y1);\n var z2 = Math.sqrt(x2 * x2 + y2 * y2);\n var ratio = (z2 - z1) / z1;\n ratios.push(ratio);\n });\n });\n ratios.sort(function (a, b) {\n return Math.abs(a) < Math.abs(b);\n });\n return ratios[0];\n }\n /**\n * Get a pointer from an event object.\n * @param {Object} event - The target event object.\n * @param {boolean} endOnly - Indicates if only returns the end point coordinate or not.\n * @returns {Object} The result pointer contains start and/or end point coordinates.\n */\n\n function getPointer(_ref2, endOnly) {\n var pageX = _ref2.pageX,\n pageY = _ref2.pageY;\n var end = {\n endX: pageX,\n endY: pageY\n };\n return endOnly ? end : _objectSpread2({\n timeStamp: Date.now(),\n startX: pageX,\n startY: pageY\n }, end);\n }\n /**\n * Get the center point coordinate of a group of pointers.\n * @param {Object} pointers - The target pointers.\n * @returns {Object} The center point coordinate.\n */\n\n function getPointersCenter(pointers) {\n var pageX = 0;\n var pageY = 0;\n var count = 0;\n forEach(pointers, function (_ref3) {\n var startX = _ref3.startX,\n startY = _ref3.startY;\n pageX += startX;\n pageY += startY;\n count += 1;\n });\n pageX /= count;\n pageY /= count;\n return {\n pageX: pageX,\n pageY: pageY\n };\n }\n\n var render = {\n render: function render() {\n this.initContainer();\n this.initViewer();\n this.initList();\n this.renderViewer();\n },\n initBody: function initBody() {\n var ownerDocument = this.element.ownerDocument;\n var body = ownerDocument.body || ownerDocument.documentElement;\n this.body = body;\n this.scrollbarWidth = window.innerWidth - ownerDocument.documentElement.clientWidth;\n this.initialBodyPaddingRight = body.style.paddingRight;\n this.initialBodyComputedPaddingRight = window.getComputedStyle(body).paddingRight;\n },\n initContainer: function initContainer() {\n this.containerData = {\n width: window.innerWidth,\n height: window.innerHeight\n };\n },\n initViewer: function initViewer() {\n var options = this.options,\n parent = this.parent;\n var viewerData;\n\n if (options.inline) {\n viewerData = {\n width: Math.max(parent.offsetWidth, options.minWidth),\n height: Math.max(parent.offsetHeight, options.minHeight)\n };\n this.parentData = viewerData;\n }\n\n if (this.fulled || !viewerData) {\n viewerData = this.containerData;\n }\n\n this.viewerData = assign({}, viewerData);\n },\n renderViewer: function renderViewer() {\n if (this.options.inline && !this.fulled) {\n setStyle(this.viewer, this.viewerData);\n }\n },\n initList: function initList() {\n var _this = this;\n\n var element = this.element,\n options = this.options,\n list = this.list;\n var items = []; // initList may be called in this.update, so should keep idempotent\n\n list.innerHTML = '';\n forEach(this.images, function (image, index) {\n var src = image.src;\n var alt = image.alt || getImageNameFromURL(src);\n\n var url = _this.getImageURL(image);\n\n if (src || url) {\n var item = document.createElement('li');\n var img = document.createElement('img');\n forEach(options.inheritedAttributes, function (name) {\n var value = image.getAttribute(name);\n\n if (value !== null) {\n img.setAttribute(name, value);\n }\n });\n img.src = src || url;\n img.alt = alt;\n img.setAttribute('data-original-url', url || src);\n item.setAttribute('data-index', index);\n item.setAttribute('data-viewer-action', 'view');\n item.setAttribute('role', 'button');\n\n if (options.keyboard) {\n item.setAttribute('tabindex', 0);\n }\n\n item.appendChild(img);\n list.appendChild(item);\n items.push(item);\n }\n });\n this.items = items;\n forEach(items, function (item) {\n var image = item.firstElementChild;\n var onLoad;\n var onError;\n setData(image, 'filled', true);\n\n if (options.loading) {\n addClass(item, CLASS_LOADING);\n }\n\n addListener(image, EVENT_LOAD, onLoad = function onLoad(event) {\n removeListener(image, EVENT_ERROR, onError);\n\n if (options.loading) {\n removeClass(item, CLASS_LOADING);\n }\n\n _this.loadImage(event);\n }, {\n once: true\n });\n addListener(image, EVENT_ERROR, onError = function onError() {\n removeListener(image, EVENT_LOAD, onLoad);\n\n if (options.loading) {\n removeClass(item, CLASS_LOADING);\n }\n }, {\n once: true\n });\n });\n\n if (options.transition) {\n addListener(element, EVENT_VIEWED, function () {\n addClass(list, CLASS_TRANSITION);\n }, {\n once: true\n });\n }\n },\n renderList: function renderList() {\n var index = this.index;\n var item = this.items[index];\n\n if (!item) {\n return;\n }\n\n var next = item.nextElementSibling;\n var gutter = parseInt(window.getComputedStyle(next || item).marginLeft, 10);\n var offsetWidth = item.offsetWidth;\n var outerWidth = offsetWidth + gutter; // Place the active item in the center of the screen\n\n setStyle(this.list, assign({\n width: outerWidth * this.length - gutter\n }, getTransforms({\n translateX: (this.viewerData.width - offsetWidth) / 2 - outerWidth * index\n })));\n },\n resetList: function resetList() {\n var list = this.list;\n list.innerHTML = '';\n removeClass(list, CLASS_TRANSITION);\n setStyle(list, getTransforms({\n translateX: 0\n }));\n },\n initImage: function initImage(done) {\n var _this2 = this;\n\n var options = this.options,\n image = this.image,\n viewerData = this.viewerData;\n var footerHeight = this.footer.offsetHeight;\n var viewerWidth = viewerData.width;\n var viewerHeight = Math.max(viewerData.height - footerHeight, footerHeight);\n var oldImageData = this.imageData || {};\n var sizingImage;\n this.imageInitializing = {\n abort: function abort() {\n sizingImage.onload = null;\n }\n };\n sizingImage = getImageNaturalSizes(image, options, function (naturalWidth, naturalHeight) {\n var aspectRatio = naturalWidth / naturalHeight;\n var width = viewerWidth;\n var height = viewerHeight;\n _this2.imageInitializing = false;\n\n if (viewerHeight * aspectRatio > viewerWidth) {\n height = viewerWidth / aspectRatio;\n } else {\n width = viewerHeight * aspectRatio;\n }\n\n width = Math.min(width * 0.9, naturalWidth);\n height = Math.min(height * 0.9, naturalHeight);\n var left = (viewerWidth - width) / 2;\n var top = (viewerHeight - height) / 2;\n var imageData = {\n left: left,\n top: top,\n x: left,\n y: top,\n width: width,\n height: height,\n oldRatio: 1,\n ratio: width / naturalWidth,\n aspectRatio: aspectRatio,\n naturalWidth: naturalWidth,\n naturalHeight: naturalHeight\n };\n var initialImageData = assign({}, imageData);\n\n if (options.rotatable) {\n imageData.rotate = oldImageData.rotate || 0;\n initialImageData.rotate = 0;\n }\n\n if (options.scalable) {\n imageData.scaleX = oldImageData.scaleX || 1;\n imageData.scaleY = oldImageData.scaleY || 1;\n initialImageData.scaleX = 1;\n initialImageData.scaleY = 1;\n }\n\n _this2.imageData = imageData;\n _this2.initialImageData = initialImageData;\n\n if (done) {\n done();\n }\n });\n },\n renderImage: function renderImage(done) {\n var _this3 = this;\n\n var image = this.image,\n imageData = this.imageData;\n setStyle(image, assign({\n width: imageData.width,\n height: imageData.height,\n // XXX: Not to use translateX/Y to avoid image shaking when zooming\n marginLeft: imageData.x,\n marginTop: imageData.y\n }, getTransforms(imageData)));\n\n if (done) {\n if ((this.viewing || this.moving || this.rotating || this.scaling || this.zooming) && this.options.transition && hasClass(image, CLASS_TRANSITION)) {\n var onTransitionEnd = function onTransitionEnd() {\n _this3.imageRendering = false;\n done();\n };\n\n this.imageRendering = {\n abort: function abort() {\n removeListener(image, EVENT_TRANSITION_END, onTransitionEnd);\n }\n };\n addListener(image, EVENT_TRANSITION_END, onTransitionEnd, {\n once: true\n });\n } else {\n done();\n }\n }\n },\n resetImage: function resetImage() {\n // this.image only defined after viewed\n if (this.viewing || this.viewed) {\n var image = this.image;\n\n if (this.viewing) {\n this.viewing.abort();\n }\n\n image.parentNode.removeChild(image);\n this.image = null;\n }\n }\n };\n\n var events = {\n bind: function bind() {\n var options = this.options,\n viewer = this.viewer,\n canvas = this.canvas;\n var document = this.element.ownerDocument;\n addListener(viewer, EVENT_CLICK, this.onClick = this.click.bind(this));\n addListener(viewer, EVENT_DRAG_START, this.onDragStart = this.dragstart.bind(this));\n addListener(canvas, EVENT_POINTER_DOWN, this.onPointerDown = this.pointerdown.bind(this));\n addListener(document, EVENT_POINTER_MOVE, this.onPointerMove = this.pointermove.bind(this));\n addListener(document, EVENT_POINTER_UP, this.onPointerUp = this.pointerup.bind(this));\n addListener(document, EVENT_KEY_DOWN, this.onKeyDown = this.keydown.bind(this));\n addListener(window, EVENT_RESIZE, this.onResize = this.resize.bind(this));\n\n if (options.zoomable && options.zoomOnWheel) {\n addListener(viewer, EVENT_WHEEL, this.onWheel = this.wheel.bind(this), {\n passive: false,\n capture: true\n });\n }\n\n if (options.toggleOnDblclick) {\n addListener(canvas, EVENT_DBLCLICK, this.onDblclick = this.dblclick.bind(this));\n }\n },\n unbind: function unbind() {\n var options = this.options,\n viewer = this.viewer,\n canvas = this.canvas;\n var document = this.element.ownerDocument;\n removeListener(viewer, EVENT_CLICK, this.onClick);\n removeListener(viewer, EVENT_DRAG_START, this.onDragStart);\n removeListener(canvas, EVENT_POINTER_DOWN, this.onPointerDown);\n removeListener(document, EVENT_POINTER_MOVE, this.onPointerMove);\n removeListener(document, EVENT_POINTER_UP, this.onPointerUp);\n removeListener(document, EVENT_KEY_DOWN, this.onKeyDown);\n removeListener(window, EVENT_RESIZE, this.onResize);\n\n if (options.zoomable && options.zoomOnWheel) {\n removeListener(viewer, EVENT_WHEEL, this.onWheel, {\n passive: false,\n capture: true\n });\n }\n\n if (options.toggleOnDblclick) {\n removeListener(canvas, EVENT_DBLCLICK, this.onDblclick);\n }\n }\n };\n\n var handlers = {\n click: function click(event) {\n var options = this.options,\n imageData = this.imageData;\n var target = event.target;\n var action = getData(target, DATA_ACTION);\n\n if (!action && target.localName === 'img' && target.parentElement.localName === 'li') {\n target = target.parentElement;\n action = getData(target, DATA_ACTION);\n } // Cancel the emulated click when the native click event was triggered.\n\n\n if (IS_TOUCH_DEVICE && event.isTrusted && target === this.canvas) {\n clearTimeout(this.clickCanvasTimeout);\n }\n\n switch (action) {\n case 'mix':\n if (this.played) {\n this.stop();\n } else if (options.inline) {\n if (this.fulled) {\n this.exit();\n } else {\n this.full();\n }\n } else {\n this.hide();\n }\n\n break;\n\n case 'hide':\n this.hide();\n break;\n\n case 'view':\n this.view(getData(target, 'index'));\n break;\n\n case 'zoom-in':\n this.zoom(0.1, true);\n break;\n\n case 'zoom-out':\n this.zoom(-0.1, true);\n break;\n\n case 'one-to-one':\n this.toggle();\n break;\n\n case 'reset':\n this.reset();\n break;\n\n case 'prev':\n this.prev(options.loop);\n break;\n\n case 'play':\n this.play(options.fullscreen);\n break;\n\n case 'next':\n this.next(options.loop);\n break;\n\n case 'rotate-left':\n this.rotate(-90);\n break;\n\n case 'rotate-right':\n this.rotate(90);\n break;\n\n case 'flip-horizontal':\n this.scaleX(-imageData.scaleX || -1);\n break;\n\n case 'flip-vertical':\n this.scaleY(-imageData.scaleY || -1);\n break;\n\n default:\n if (this.played) {\n this.stop();\n }\n\n }\n },\n dblclick: function dblclick(event) {\n event.preventDefault();\n\n if (this.viewed && event.target === this.image) {\n // Cancel the emulated double click when the native dblclick event was triggered.\n if (IS_TOUCH_DEVICE && event.isTrusted) {\n clearTimeout(this.doubleClickImageTimeout);\n } // XXX: No pageX/Y properties in custom event, fallback to the original event.\n\n\n this.toggle(event.isTrusted ? event : event.detail && event.detail.originalEvent);\n }\n },\n load: function load() {\n var _this = this;\n\n if (this.timeout) {\n clearTimeout(this.timeout);\n this.timeout = false;\n }\n\n var element = this.element,\n options = this.options,\n image = this.image,\n index = this.index,\n viewerData = this.viewerData;\n removeClass(image, CLASS_INVISIBLE);\n\n if (options.loading) {\n removeClass(this.canvas, CLASS_LOADING);\n }\n\n image.style.cssText = 'height:0;' + \"margin-left:\".concat(viewerData.width / 2, \"px;\") + \"margin-top:\".concat(viewerData.height / 2, \"px;\") + 'max-width:none!important;' + 'position:relative;' + 'width:0;';\n this.initImage(function () {\n toggleClass(image, CLASS_MOVE, options.movable);\n toggleClass(image, CLASS_TRANSITION, options.transition);\n\n _this.renderImage(function () {\n _this.viewed = true;\n _this.viewing = false;\n\n if (isFunction(options.viewed)) {\n addListener(element, EVENT_VIEWED, options.viewed, {\n once: true\n });\n }\n\n dispatchEvent(element, EVENT_VIEWED, {\n originalImage: _this.images[index],\n index: index,\n image: image\n }, {\n cancelable: false\n });\n });\n });\n },\n loadImage: function loadImage(event) {\n var image = event.target;\n var parent = image.parentNode;\n var parentWidth = parent.offsetWidth || 30;\n var parentHeight = parent.offsetHeight || 50;\n var filled = !!getData(image, 'filled');\n getImageNaturalSizes(image, this.options, function (naturalWidth, naturalHeight) {\n var aspectRatio = naturalWidth / naturalHeight;\n var width = parentWidth;\n var height = parentHeight;\n\n if (parentHeight * aspectRatio > parentWidth) {\n if (filled) {\n width = parentHeight * aspectRatio;\n } else {\n height = parentWidth / aspectRatio;\n }\n } else if (filled) {\n height = parentWidth / aspectRatio;\n } else {\n width = parentHeight * aspectRatio;\n }\n\n setStyle(image, assign({\n width: width,\n height: height\n }, getTransforms({\n translateX: (parentWidth - width) / 2,\n translateY: (parentHeight - height) / 2\n })));\n });\n },\n keydown: function keydown(event) {\n var options = this.options;\n\n if (!options.keyboard) {\n return;\n }\n\n var keyCode = event.keyCode || event.which || event.charCode;\n\n switch (keyCode) {\n // Enter\n case 13:\n if (this.viewer.contains(event.target)) {\n this.click(event);\n }\n\n break;\n }\n\n if (!this.fulled) {\n return;\n }\n\n switch (keyCode) {\n // Escape\n case 27:\n if (this.played) {\n this.stop();\n } else if (options.inline) {\n if (this.fulled) {\n this.exit();\n }\n } else {\n this.hide();\n }\n\n break;\n // Space\n\n case 32:\n if (this.played) {\n this.stop();\n }\n\n break;\n // ArrowLeft\n\n case 37:\n this.prev(options.loop);\n break;\n // ArrowUp\n\n case 38:\n // Prevent scroll on Firefox\n event.preventDefault(); // Zoom in\n\n this.zoom(options.zoomRatio, true);\n break;\n // ArrowRight\n\n case 39:\n this.next(options.loop);\n break;\n // ArrowDown\n\n case 40:\n // Prevent scroll on Firefox\n event.preventDefault(); // Zoom out\n\n this.zoom(-options.zoomRatio, true);\n break;\n // Ctrl + 0\n\n case 48: // Fall through\n // Ctrl + 1\n // eslint-disable-next-line no-fallthrough\n\n case 49:\n if (event.ctrlKey) {\n event.preventDefault();\n this.toggle();\n }\n\n break;\n }\n },\n dragstart: function dragstart(event) {\n if (event.target.localName === 'img') {\n event.preventDefault();\n }\n },\n pointerdown: function pointerdown(event) {\n var options = this.options,\n pointers = this.pointers;\n var buttons = event.buttons,\n button = event.button;\n\n if (!this.viewed || this.showing || this.viewing || this.hiding // Handle mouse event and pointer event and ignore touch event\n || (event.type === 'mousedown' || event.type === 'pointerdown' && event.pointerType === 'mouse') && ( // No primary button (Usually the left button)\n isNumber(buttons) && buttons !== 1 || isNumber(button) && button !== 0 // Open context menu\n || event.ctrlKey)) {\n return;\n } // Prevent default behaviours as page zooming in touch devices.\n\n\n event.preventDefault();\n\n if (event.changedTouches) {\n forEach(event.changedTouches, function (touch) {\n pointers[touch.identifier] = getPointer(touch);\n });\n } else {\n pointers[event.pointerId || 0] = getPointer(event);\n }\n\n var action = options.movable ? ACTION_MOVE : false;\n\n if (options.zoomOnTouch && options.zoomable && Object.keys(pointers).length > 1) {\n action = ACTION_ZOOM;\n } else if (options.slideOnTouch && (event.pointerType === 'touch' || event.type === 'touchstart') && this.isSwitchable()) {\n action = ACTION_SWITCH;\n }\n\n if (options.transition && (action === ACTION_MOVE || action === ACTION_ZOOM)) {\n removeClass(this.image, CLASS_TRANSITION);\n }\n\n this.action = action;\n },\n pointermove: function pointermove(event) {\n var pointers = this.pointers,\n action = this.action;\n\n if (!this.viewed || !action) {\n return;\n }\n\n event.preventDefault();\n\n if (event.changedTouches) {\n forEach(event.changedTouches, function (touch) {\n assign(pointers[touch.identifier] || {}, getPointer(touch, true));\n });\n } else {\n assign(pointers[event.pointerId || 0] || {}, getPointer(event, true));\n }\n\n this.change(event);\n },\n pointerup: function pointerup(event) {\n var _this2 = this;\n\n var options = this.options,\n action = this.action,\n pointers = this.pointers;\n var pointer;\n\n if (event.changedTouches) {\n forEach(event.changedTouches, function (touch) {\n pointer = pointers[touch.identifier];\n delete pointers[touch.identifier];\n });\n } else {\n pointer = pointers[event.pointerId || 0];\n delete pointers[event.pointerId || 0];\n }\n\n if (!action) {\n return;\n }\n\n event.preventDefault();\n\n if (options.transition && (action === ACTION_MOVE || action === ACTION_ZOOM)) {\n addClass(this.image, CLASS_TRANSITION);\n }\n\n this.action = false; // Emulate click and double click in touch devices to support backdrop and image zooming (#210).\n\n if (IS_TOUCH_DEVICE && action !== ACTION_ZOOM && pointer && Date.now() - pointer.timeStamp < 500) {\n clearTimeout(this.clickCanvasTimeout);\n clearTimeout(this.doubleClickImageTimeout);\n\n if (options.toggleOnDblclick && this.viewed && event.target === this.image) {\n if (this.imageClicked) {\n this.imageClicked = false; // This timeout will be cleared later when a native dblclick event is triggering\n\n this.doubleClickImageTimeout = setTimeout(function () {\n dispatchEvent(_this2.image, EVENT_DBLCLICK, {\n originalEvent: event\n });\n }, 50);\n } else {\n this.imageClicked = true; // The default timing of a double click in Windows is 500 ms\n\n this.doubleClickImageTimeout = setTimeout(function () {\n _this2.imageClicked = false;\n }, 500);\n }\n } else {\n this.imageClicked = false;\n\n if (options.backdrop && options.backdrop !== 'static' && event.target === this.canvas) {\n // This timeout will be cleared later when a native click event is triggering\n this.clickCanvasTimeout = setTimeout(function () {\n dispatchEvent(_this2.canvas, EVENT_CLICK, {\n originalEvent: event\n });\n }, 50);\n }\n }\n }\n },\n resize: function resize() {\n var _this3 = this;\n\n if (!this.isShown || this.hiding) {\n return;\n }\n\n if (this.fulled) {\n this.close();\n this.initBody();\n this.open();\n }\n\n this.initContainer();\n this.initViewer();\n this.renderViewer();\n this.renderList();\n\n if (this.viewed) {\n this.initImage(function () {\n _this3.renderImage();\n });\n }\n\n if (this.played) {\n if (this.options.fullscreen && this.fulled && !(document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement)) {\n this.stop();\n return;\n }\n\n forEach(this.player.getElementsByTagName('img'), function (image) {\n addListener(image, EVENT_LOAD, _this3.loadImage.bind(_this3), {\n once: true\n });\n dispatchEvent(image, EVENT_LOAD);\n });\n }\n },\n wheel: function wheel(event) {\n var _this4 = this;\n\n if (!this.viewed) {\n return;\n }\n\n event.preventDefault(); // Limit wheel speed to prevent zoom too fast\n\n if (this.wheeling) {\n return;\n }\n\n this.wheeling = true;\n setTimeout(function () {\n _this4.wheeling = false;\n }, 50);\n var ratio = Number(this.options.zoomRatio) || 0.1;\n var delta = 1;\n\n if (event.deltaY) {\n delta = event.deltaY > 0 ? 1 : -1;\n } else if (event.wheelDelta) {\n delta = -event.wheelDelta / 120;\n } else if (event.detail) {\n delta = event.detail > 0 ? 1 : -1;\n }\n\n this.zoom(-delta * ratio, true, event);\n }\n };\n\n var methods = {\n /** Show the viewer (only available in modal mode)\n * @param {boolean} [immediate=false] - Indicates if show the viewer immediately or not.\n * @returns {Viewer} this\n */\n show: function show() {\n var immediate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n var element = this.element,\n options = this.options;\n\n if (options.inline || this.showing || this.isShown || this.showing) {\n return this;\n }\n\n if (!this.ready) {\n this.build();\n\n if (this.ready) {\n this.show(immediate);\n }\n\n return this;\n }\n\n if (isFunction(options.show)) {\n addListener(element, EVENT_SHOW, options.show, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_SHOW) === false || !this.ready) {\n return this;\n }\n\n if (this.hiding) {\n this.transitioning.abort();\n }\n\n this.showing = true;\n this.open();\n var viewer = this.viewer;\n removeClass(viewer, CLASS_HIDE);\n viewer.setAttribute('role', 'dialog');\n viewer.setAttribute('aria-labelledby', this.title.id);\n viewer.setAttribute('aria-modal', true);\n viewer.removeAttribute('aria-hidden');\n\n if (options.transition && !immediate) {\n var shown = this.shown.bind(this);\n this.transitioning = {\n abort: function abort() {\n removeListener(viewer, EVENT_TRANSITION_END, shown);\n removeClass(viewer, CLASS_IN);\n }\n };\n addClass(viewer, CLASS_TRANSITION); // Force reflow to enable CSS3 transition\n\n viewer.initialOffsetWidth = viewer.offsetWidth;\n addListener(viewer, EVENT_TRANSITION_END, shown, {\n once: true\n });\n addClass(viewer, CLASS_IN);\n } else {\n addClass(viewer, CLASS_IN);\n this.shown();\n }\n\n return this;\n },\n\n /**\n * Hide the viewer (only available in modal mode)\n * @param {boolean} [immediate=false] - Indicates if hide the viewer immediately or not.\n * @returns {Viewer} this\n */\n hide: function hide() {\n var _this = this;\n\n var immediate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n var element = this.element,\n options = this.options;\n\n if (options.inline || this.hiding || !(this.isShown || this.showing)) {\n return this;\n }\n\n if (isFunction(options.hide)) {\n addListener(element, EVENT_HIDE, options.hide, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_HIDE) === false) {\n return this;\n }\n\n if (this.showing) {\n this.transitioning.abort();\n }\n\n this.hiding = true;\n\n if (this.played) {\n this.stop();\n } else if (this.viewing) {\n this.viewing.abort();\n }\n\n var viewer = this.viewer,\n image = this.image;\n\n var hideImmediately = function hideImmediately() {\n removeClass(viewer, CLASS_IN);\n\n _this.hidden();\n };\n\n if (options.transition && !immediate) {\n var onViewerTransitionEnd = function onViewerTransitionEnd(event) {\n // Ignore all propagating `transitionend` events (#275).\n if (event && event.target === viewer) {\n removeListener(viewer, EVENT_TRANSITION_END, onViewerTransitionEnd);\n\n _this.hidden();\n }\n };\n\n var onImageTransitionEnd = function onImageTransitionEnd() {\n // In case of show the viewer by `viewer.show(true)` previously (#407).\n if (hasClass(viewer, CLASS_TRANSITION)) {\n addListener(viewer, EVENT_TRANSITION_END, onViewerTransitionEnd);\n removeClass(viewer, CLASS_IN);\n } else {\n hideImmediately();\n }\n };\n\n this.transitioning = {\n abort: function abort() {\n if (_this.viewed && hasClass(image, CLASS_TRANSITION)) {\n removeListener(image, EVENT_TRANSITION_END, onImageTransitionEnd);\n } else if (hasClass(viewer, CLASS_TRANSITION)) {\n removeListener(viewer, EVENT_TRANSITION_END, onViewerTransitionEnd);\n }\n }\n }; // In case of hiding the viewer when holding on the image (#255),\n // note that the `CLASS_TRANSITION` class will be removed on pointer down.\n\n if (this.viewed && hasClass(image, CLASS_TRANSITION)) {\n addListener(image, EVENT_TRANSITION_END, onImageTransitionEnd, {\n once: true\n });\n this.zoomTo(0, false, null, true);\n } else {\n onImageTransitionEnd();\n }\n } else {\n hideImmediately();\n }\n\n return this;\n },\n\n /**\n * View one of the images with image's index\n * @param {number} index - The index of the image to view.\n * @returns {Viewer} this\n */\n view: function view() {\n var _this2 = this;\n\n var index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.options.initialViewIndex;\n index = Number(index) || 0;\n\n if (this.hiding || this.played || index < 0 || index >= this.length || this.viewed && index === this.index) {\n return this;\n }\n\n if (!this.isShown) {\n this.index = index;\n return this.show();\n }\n\n if (this.viewing) {\n this.viewing.abort();\n }\n\n var element = this.element,\n options = this.options,\n title = this.title,\n canvas = this.canvas;\n var item = this.items[index];\n var img = item.querySelector('img');\n var url = getData(img, 'originalUrl');\n var alt = img.getAttribute('alt');\n var image = document.createElement('img');\n forEach(options.inheritedAttributes, function (name) {\n var value = img.getAttribute(name);\n\n if (value !== null) {\n image.setAttribute(name, value);\n }\n });\n image.src = url;\n image.alt = alt;\n\n if (isFunction(options.view)) {\n addListener(element, EVENT_VIEW, options.view, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_VIEW, {\n originalImage: this.images[index],\n index: index,\n image: image\n }) === false || !this.isShown || this.hiding || this.played) {\n return this;\n }\n\n var activeItem = this.items[this.index];\n\n if (activeItem) {\n removeClass(activeItem, CLASS_ACTIVE);\n activeItem.removeAttribute('aria-selected');\n }\n\n addClass(item, CLASS_ACTIVE);\n item.setAttribute('aria-selected', true);\n\n if (options.focus) {\n item.focus();\n }\n\n this.image = image;\n this.viewed = false;\n this.index = index;\n this.imageData = {};\n addClass(image, CLASS_INVISIBLE);\n\n if (options.loading) {\n addClass(canvas, CLASS_LOADING);\n }\n\n canvas.innerHTML = '';\n canvas.appendChild(image); // Center current item\n\n this.renderList(); // Clear title\n\n title.innerHTML = ''; // Generate title after viewed\n\n var onViewed = function onViewed() {\n var imageData = _this2.imageData;\n var render = Array.isArray(options.title) ? options.title[1] : options.title;\n title.innerHTML = escapeHTMLEntities(isFunction(render) ? render.call(_this2, image, imageData) : \"\".concat(alt, \" (\").concat(imageData.naturalWidth, \" \\xD7 \").concat(imageData.naturalHeight, \")\"));\n };\n\n var onLoad;\n var onError;\n addListener(element, EVENT_VIEWED, onViewed, {\n once: true\n });\n this.viewing = {\n abort: function abort() {\n removeListener(element, EVENT_VIEWED, onViewed);\n\n if (image.complete) {\n if (_this2.imageRendering) {\n _this2.imageRendering.abort();\n } else if (_this2.imageInitializing) {\n _this2.imageInitializing.abort();\n }\n } else {\n // Cancel download to save bandwidth.\n image.src = '';\n removeListener(image, EVENT_LOAD, onLoad);\n\n if (_this2.timeout) {\n clearTimeout(_this2.timeout);\n }\n }\n }\n };\n\n if (image.complete) {\n this.load();\n } else {\n addListener(image, EVENT_LOAD, onLoad = function onLoad() {\n removeListener(image, EVENT_ERROR, onError);\n\n _this2.load();\n }, {\n once: true\n });\n addListener(image, EVENT_ERROR, onError = function onError() {\n removeListener(image, EVENT_LOAD, onLoad);\n\n if (_this2.timeout) {\n clearTimeout(_this2.timeout);\n _this2.timeout = false;\n }\n\n removeClass(image, CLASS_INVISIBLE);\n\n if (options.loading) {\n removeClass(_this2.canvas, CLASS_LOADING);\n }\n }, {\n once: true\n });\n\n if (this.timeout) {\n clearTimeout(this.timeout);\n } // Make the image visible if it fails to load within 1s\n\n\n this.timeout = setTimeout(function () {\n removeClass(image, CLASS_INVISIBLE);\n _this2.timeout = false;\n }, 1000);\n }\n\n return this;\n },\n\n /**\n * View the previous image\n * @param {boolean} [loop=false] - Indicate if view the last one\n * when it is the first one at present.\n * @returns {Viewer} this\n */\n prev: function prev() {\n var loop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n var index = this.index - 1;\n\n if (index < 0) {\n index = loop ? this.length - 1 : 0;\n }\n\n this.view(index);\n return this;\n },\n\n /**\n * View the next image\n * @param {boolean} [loop=false] - Indicate if view the first one\n * when it is the last one at present.\n * @returns {Viewer} this\n */\n next: function next() {\n var loop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n var maxIndex = this.length - 1;\n var index = this.index + 1;\n\n if (index > maxIndex) {\n index = loop ? 0 : maxIndex;\n }\n\n this.view(index);\n return this;\n },\n\n /**\n * Move the image with relative offsets.\n * @param {number} x - The moving distance in the horizontal direction.\n * @param {number} [y=x] The moving distance in the vertical direction.\n * @returns {Viewer} this\n */\n move: function move(x) {\n var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;\n var imageData = this.imageData;\n this.moveTo(isUndefined(x) ? x : imageData.x + Number(x), isUndefined(y) ? y : imageData.y + Number(y));\n return this;\n },\n\n /**\n * Move the image to an absolute point.\n * @param {number} x - The new position in the horizontal direction.\n * @param {number} [y=x] - The new position in the vertical direction.\n * @param {Event} [_originalEvent=null] - The original event if any.\n * @returns {Viewer} this\n */\n moveTo: function moveTo(x) {\n var _this3 = this;\n\n var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;\n\n var _originalEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;\n\n var element = this.element,\n options = this.options,\n imageData = this.imageData;\n x = Number(x);\n y = Number(y);\n\n if (this.viewed && !this.played && options.movable) {\n var oldX = imageData.x;\n var oldY = imageData.y;\n var changed = false;\n\n if (isNumber(x)) {\n changed = true;\n } else {\n x = oldX;\n }\n\n if (isNumber(y)) {\n changed = true;\n } else {\n y = oldY;\n }\n\n if (changed) {\n if (isFunction(options.move)) {\n addListener(element, EVENT_MOVE, options.move, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_MOVE, {\n x: x,\n y: y,\n oldX: oldX,\n oldY: oldY,\n originalEvent: _originalEvent\n }) === false) {\n return this;\n }\n\n imageData.x = x;\n imageData.y = y;\n imageData.left = x;\n imageData.top = y;\n this.moving = true;\n this.renderImage(function () {\n _this3.moving = false;\n\n if (isFunction(options.moved)) {\n addListener(element, EVENT_MOVED, options.moved, {\n once: true\n });\n }\n\n dispatchEvent(element, EVENT_MOVED, {\n x: x,\n y: y,\n oldX: oldX,\n oldY: oldY,\n originalEvent: _originalEvent\n }, {\n cancelable: false\n });\n });\n }\n }\n\n return this;\n },\n\n /**\n * Rotate the image with a relative degree.\n * @param {number} degree - The rotate degree.\n * @returns {Viewer} this\n */\n rotate: function rotate(degree) {\n this.rotateTo((this.imageData.rotate || 0) + Number(degree));\n return this;\n },\n\n /**\n * Rotate the image to an absolute degree.\n * @param {number} degree - The rotate degree.\n * @returns {Viewer} this\n */\n rotateTo: function rotateTo(degree) {\n var _this4 = this;\n\n var element = this.element,\n options = this.options,\n imageData = this.imageData;\n degree = Number(degree);\n\n if (isNumber(degree) && this.viewed && !this.played && options.rotatable) {\n var oldDegree = imageData.rotate;\n\n if (isFunction(options.rotate)) {\n addListener(element, EVENT_ROTATE, options.rotate, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_ROTATE, {\n degree: degree,\n oldDegree: oldDegree\n }) === false) {\n return this;\n }\n\n imageData.rotate = degree;\n this.rotating = true;\n this.renderImage(function () {\n _this4.rotating = false;\n\n if (isFunction(options.rotated)) {\n addListener(element, EVENT_ROTATED, options.rotated, {\n once: true\n });\n }\n\n dispatchEvent(element, EVENT_ROTATED, {\n degree: degree,\n oldDegree: oldDegree\n }, {\n cancelable: false\n });\n });\n }\n\n return this;\n },\n\n /**\n * Scale the image on the x-axis.\n * @param {number} scaleX - The scale ratio on the x-axis.\n * @returns {Viewer} this\n */\n scaleX: function scaleX(_scaleX) {\n this.scale(_scaleX, this.imageData.scaleY);\n return this;\n },\n\n /**\n * Scale the image on the y-axis.\n * @param {number} scaleY - The scale ratio on the y-axis.\n * @returns {Viewer} this\n */\n scaleY: function scaleY(_scaleY) {\n this.scale(this.imageData.scaleX, _scaleY);\n return this;\n },\n\n /**\n * Scale the image.\n * @param {number} scaleX - The scale ratio on the x-axis.\n * @param {number} [scaleY=scaleX] - The scale ratio on the y-axis.\n * @returns {Viewer} this\n */\n scale: function scale(scaleX) {\n var _this5 = this;\n\n var scaleY = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : scaleX;\n var element = this.element,\n options = this.options,\n imageData = this.imageData;\n scaleX = Number(scaleX);\n scaleY = Number(scaleY);\n\n if (this.viewed && !this.played && options.scalable) {\n var oldScaleX = imageData.scaleX;\n var oldScaleY = imageData.scaleY;\n var changed = false;\n\n if (isNumber(scaleX)) {\n changed = true;\n } else {\n scaleX = oldScaleX;\n }\n\n if (isNumber(scaleY)) {\n changed = true;\n } else {\n scaleY = oldScaleY;\n }\n\n if (changed) {\n if (isFunction(options.scale)) {\n addListener(element, EVENT_SCALE, options.scale, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_SCALE, {\n scaleX: scaleX,\n scaleY: scaleY,\n oldScaleX: oldScaleX,\n oldScaleY: oldScaleY\n }) === false) {\n return this;\n }\n\n imageData.scaleX = scaleX;\n imageData.scaleY = scaleY;\n this.scaling = true;\n this.renderImage(function () {\n _this5.scaling = false;\n\n if (isFunction(options.scaled)) {\n addListener(element, EVENT_SCALED, options.scaled, {\n once: true\n });\n }\n\n dispatchEvent(element, EVENT_SCALED, {\n scaleX: scaleX,\n scaleY: scaleY,\n oldScaleX: oldScaleX,\n oldScaleY: oldScaleY\n }, {\n cancelable: false\n });\n });\n }\n }\n\n return this;\n },\n\n /**\n * Zoom the image with a relative ratio.\n * @param {number} ratio - The target ratio.\n * @param {boolean} [hasTooltip=false] - Indicates if it has a tooltip or not.\n * @param {Event} [_originalEvent=null] - The original event if any.\n * @returns {Viewer} this\n */\n zoom: function zoom(ratio) {\n var hasTooltip = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;\n\n var _originalEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;\n\n var imageData = this.imageData;\n ratio = Number(ratio);\n\n if (ratio < 0) {\n ratio = 1 / (1 - ratio);\n } else {\n ratio = 1 + ratio;\n }\n\n this.zoomTo(imageData.width * ratio / imageData.naturalWidth, hasTooltip, _originalEvent);\n return this;\n },\n\n /**\n * Zoom the image to an absolute ratio.\n * @param {number} ratio - The target ratio.\n * @param {boolean} [hasTooltip=false] - Indicates if it has a tooltip or not.\n * @param {Event} [_originalEvent=null] - The original event if any.\n * @param {Event} [_zoomable=false] - Indicates if the current zoom is available or not.\n * @returns {Viewer} this\n */\n zoomTo: function zoomTo(ratio) {\n var _this6 = this;\n\n var hasTooltip = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;\n\n var _originalEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;\n\n var _zoomable = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;\n\n var element = this.element,\n options = this.options,\n pointers = this.pointers,\n imageData = this.imageData;\n var x = imageData.x,\n y = imageData.y,\n width = imageData.width,\n height = imageData.height,\n naturalWidth = imageData.naturalWidth,\n naturalHeight = imageData.naturalHeight;\n ratio = Math.max(0, ratio);\n\n if (isNumber(ratio) && this.viewed && !this.played && (_zoomable || options.zoomable)) {\n if (!_zoomable) {\n var minZoomRatio = Math.max(0.01, options.minZoomRatio);\n var maxZoomRatio = Math.min(100, options.maxZoomRatio);\n ratio = Math.min(Math.max(ratio, minZoomRatio), maxZoomRatio);\n }\n\n if (_originalEvent) {\n switch (_originalEvent.type) {\n case 'wheel':\n if (options.zoomRatio >= 0.055 && ratio > 0.95 && ratio < 1.05) {\n ratio = 1;\n }\n\n break;\n\n case 'pointermove':\n case 'touchmove':\n case 'mousemove':\n if (ratio > 0.99 && ratio < 1.01) {\n ratio = 1;\n }\n\n break;\n }\n }\n\n var newWidth = naturalWidth * ratio;\n var newHeight = naturalHeight * ratio;\n var offsetWidth = newWidth - width;\n var offsetHeight = newHeight - height;\n var oldRatio = imageData.ratio;\n\n if (isFunction(options.zoom)) {\n addListener(element, EVENT_ZOOM, options.zoom, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_ZOOM, {\n ratio: ratio,\n oldRatio: oldRatio,\n originalEvent: _originalEvent\n }) === false) {\n return this;\n }\n\n this.zooming = true;\n\n if (_originalEvent) {\n var offset = getOffset(this.viewer);\n var center = pointers && Object.keys(pointers).length > 0 ? getPointersCenter(pointers) : {\n pageX: _originalEvent.pageX,\n pageY: _originalEvent.pageY\n }; // Zoom from the triggering point of the event\n\n imageData.x -= offsetWidth * ((center.pageX - offset.left - x) / width);\n imageData.y -= offsetHeight * ((center.pageY - offset.top - y) / height);\n } else {\n // Zoom from the center of the image\n imageData.x -= offsetWidth / 2;\n imageData.y -= offsetHeight / 2;\n }\n\n imageData.left = imageData.x;\n imageData.top = imageData.y;\n imageData.width = newWidth;\n imageData.height = newHeight;\n imageData.oldRatio = oldRatio;\n imageData.ratio = ratio;\n this.renderImage(function () {\n _this6.zooming = false;\n\n if (isFunction(options.zoomed)) {\n addListener(element, EVENT_ZOOMED, options.zoomed, {\n once: true\n });\n }\n\n dispatchEvent(element, EVENT_ZOOMED, {\n ratio: ratio,\n oldRatio: oldRatio,\n originalEvent: _originalEvent\n }, {\n cancelable: false\n });\n });\n\n if (hasTooltip) {\n this.tooltip();\n }\n }\n\n return this;\n },\n\n /**\n * Play the images\n * @param {boolean|FullscreenOptions} [fullscreen=false] - Indicate if request fullscreen or not.\n * @returns {Viewer} this\n */\n play: function play() {\n var _this7 = this;\n\n var fullscreen = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n\n if (!this.isShown || this.played) {\n return this;\n }\n\n var element = this.element,\n options = this.options;\n\n if (isFunction(options.play)) {\n addListener(element, EVENT_PLAY, options.play, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_PLAY) === false) {\n return this;\n }\n\n var player = this.player;\n var onLoad = this.loadImage.bind(this);\n var list = [];\n var total = 0;\n var index = 0;\n this.played = true;\n this.onLoadWhenPlay = onLoad;\n\n if (fullscreen) {\n this.requestFullscreen(fullscreen);\n }\n\n addClass(player, CLASS_SHOW);\n forEach(this.items, function (item, i) {\n var img = item.querySelector('img');\n var image = document.createElement('img');\n image.src = getData(img, 'originalUrl');\n image.alt = img.getAttribute('alt');\n image.referrerPolicy = img.referrerPolicy;\n total += 1;\n addClass(image, CLASS_FADE);\n toggleClass(image, CLASS_TRANSITION, options.transition);\n\n if (hasClass(item, CLASS_ACTIVE)) {\n addClass(image, CLASS_IN);\n index = i;\n }\n\n list.push(image);\n addListener(image, EVENT_LOAD, onLoad, {\n once: true\n });\n player.appendChild(image);\n });\n\n if (isNumber(options.interval) && options.interval > 0) {\n var play = function play() {\n _this7.playing = setTimeout(function () {\n removeClass(list[index], CLASS_IN);\n index += 1;\n index = index < total ? index : 0;\n addClass(list[index], CLASS_IN);\n play();\n }, options.interval);\n };\n\n if (total > 1) {\n play();\n }\n }\n\n return this;\n },\n // Stop play\n stop: function stop() {\n var _this8 = this;\n\n if (!this.played) {\n return this;\n }\n\n var element = this.element,\n options = this.options;\n\n if (isFunction(options.stop)) {\n addListener(element, EVENT_STOP, options.stop, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_STOP) === false) {\n return this;\n }\n\n var player = this.player;\n this.played = false;\n clearTimeout(this.playing);\n forEach(player.getElementsByTagName('img'), function (image) {\n removeListener(image, EVENT_LOAD, _this8.onLoadWhenPlay);\n });\n removeClass(player, CLASS_SHOW);\n player.innerHTML = '';\n this.exitFullscreen();\n return this;\n },\n // Enter modal mode (only available in inline mode)\n full: function full() {\n var _this9 = this;\n\n var options = this.options,\n viewer = this.viewer,\n image = this.image,\n list = this.list;\n\n if (!this.isShown || this.played || this.fulled || !options.inline) {\n return this;\n }\n\n this.fulled = true;\n this.open();\n addClass(this.button, CLASS_FULLSCREEN_EXIT);\n\n if (options.transition) {\n removeClass(list, CLASS_TRANSITION);\n\n if (this.viewed) {\n removeClass(image, CLASS_TRANSITION);\n }\n }\n\n addClass(viewer, CLASS_FIXED);\n viewer.setAttribute('role', 'dialog');\n viewer.setAttribute('aria-labelledby', this.title.id);\n viewer.setAttribute('aria-modal', true);\n viewer.removeAttribute('style');\n setStyle(viewer, {\n zIndex: options.zIndex\n });\n\n if (options.focus) {\n this.enforceFocus();\n }\n\n this.initContainer();\n this.viewerData = assign({}, this.containerData);\n this.renderList();\n\n if (this.viewed) {\n this.initImage(function () {\n _this9.renderImage(function () {\n if (options.transition) {\n setTimeout(function () {\n addClass(image, CLASS_TRANSITION);\n addClass(list, CLASS_TRANSITION);\n }, 0);\n }\n });\n });\n }\n\n return this;\n },\n // Exit modal mode (only available in inline mode)\n exit: function exit() {\n var _this10 = this;\n\n var options = this.options,\n viewer = this.viewer,\n image = this.image,\n list = this.list;\n\n if (!this.isShown || this.played || !this.fulled || !options.inline) {\n return this;\n }\n\n this.fulled = false;\n this.close();\n removeClass(this.button, CLASS_FULLSCREEN_EXIT);\n\n if (options.transition) {\n removeClass(list, CLASS_TRANSITION);\n\n if (this.viewed) {\n removeClass(image, CLASS_TRANSITION);\n }\n }\n\n if (options.focus) {\n this.clearEnforceFocus();\n }\n\n viewer.removeAttribute('role');\n viewer.removeAttribute('aria-labelledby');\n viewer.removeAttribute('aria-modal');\n removeClass(viewer, CLASS_FIXED);\n setStyle(viewer, {\n zIndex: options.zIndexInline\n });\n this.viewerData = assign({}, this.parentData);\n this.renderViewer();\n this.renderList();\n\n if (this.viewed) {\n this.initImage(function () {\n _this10.renderImage(function () {\n if (options.transition) {\n setTimeout(function () {\n addClass(image, CLASS_TRANSITION);\n addClass(list, CLASS_TRANSITION);\n }, 0);\n }\n });\n });\n }\n\n return this;\n },\n // Show the current ratio of the image with percentage\n tooltip: function tooltip() {\n var _this11 = this;\n\n var options = this.options,\n tooltipBox = this.tooltipBox,\n imageData = this.imageData;\n\n if (!this.viewed || this.played || !options.tooltip) {\n return this;\n }\n\n tooltipBox.textContent = \"\".concat(Math.round(imageData.ratio * 100), \"%\");\n\n if (!this.tooltipping) {\n if (options.transition) {\n if (this.fading) {\n dispatchEvent(tooltipBox, EVENT_TRANSITION_END);\n }\n\n addClass(tooltipBox, CLASS_SHOW);\n addClass(tooltipBox, CLASS_FADE);\n addClass(tooltipBox, CLASS_TRANSITION);\n tooltipBox.removeAttribute('aria-hidden'); // Force reflow to enable CSS3 transition\n\n tooltipBox.initialOffsetWidth = tooltipBox.offsetWidth;\n addClass(tooltipBox, CLASS_IN);\n } else {\n addClass(tooltipBox, CLASS_SHOW);\n tooltipBox.removeAttribute('aria-hidden');\n }\n } else {\n clearTimeout(this.tooltipping);\n }\n\n this.tooltipping = setTimeout(function () {\n if (options.transition) {\n addListener(tooltipBox, EVENT_TRANSITION_END, function () {\n removeClass(tooltipBox, CLASS_SHOW);\n removeClass(tooltipBox, CLASS_FADE);\n removeClass(tooltipBox, CLASS_TRANSITION);\n tooltipBox.setAttribute('aria-hidden', true);\n _this11.fading = false;\n }, {\n once: true\n });\n removeClass(tooltipBox, CLASS_IN);\n _this11.fading = true;\n } else {\n removeClass(tooltipBox, CLASS_SHOW);\n tooltipBox.setAttribute('aria-hidden', true);\n }\n\n _this11.tooltipping = false;\n }, 1000);\n return this;\n },\n\n /**\n * Toggle the image size between its current size and natural size\n * @param {Event} [_originalEvent=null] - The original event if any.\n * @returns {Viewer} this\n */\n toggle: function toggle() {\n var _originalEvent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;\n\n if (this.imageData.ratio === 1) {\n this.zoomTo(this.imageData.oldRatio, true, _originalEvent);\n } else {\n this.zoomTo(1, true, _originalEvent);\n }\n\n return this;\n },\n // Reset the image to its initial state\n reset: function reset() {\n if (this.viewed && !this.played) {\n this.imageData = assign({}, this.initialImageData);\n this.renderImage();\n }\n\n return this;\n },\n // Update viewer when images changed\n update: function update() {\n var _this12 = this;\n\n var element = this.element,\n options = this.options,\n isImg = this.isImg; // Destroy viewer if the target image was deleted\n\n if (isImg && !element.parentNode) {\n return this.destroy();\n }\n\n var images = [];\n forEach(isImg ? [element] : element.querySelectorAll('img'), function (image) {\n if (isFunction(options.filter)) {\n if (options.filter.call(_this12, image)) {\n images.push(image);\n }\n } else if (_this12.getImageURL(image)) {\n images.push(image);\n }\n });\n\n if (!images.length) {\n return this;\n }\n\n this.images = images;\n this.length = images.length;\n\n if (this.ready) {\n var changedIndexes = [];\n forEach(this.items, function (item, i) {\n var img = item.querySelector('img');\n var image = images[i];\n\n if (image && img) {\n if (image.src !== img.src // Title changed (#408)\n || image.alt !== img.alt) {\n changedIndexes.push(i);\n }\n } else {\n changedIndexes.push(i);\n }\n });\n setStyle(this.list, {\n width: 'auto'\n });\n this.initList();\n\n if (this.isShown) {\n if (this.length) {\n if (this.viewed) {\n var changedIndex = changedIndexes.indexOf(this.index);\n\n if (changedIndex >= 0) {\n this.viewed = false;\n this.view(Math.max(Math.min(this.index - changedIndex, this.length - 1), 0));\n } else {\n var activeItem = this.items[this.index]; // Reactivate the current viewing item after reset the list.\n\n addClass(activeItem, CLASS_ACTIVE);\n activeItem.setAttribute('aria-selected', true);\n }\n }\n } else {\n this.image = null;\n this.viewed = false;\n this.index = 0;\n this.imageData = {};\n this.canvas.innerHTML = '';\n this.title.innerHTML = '';\n }\n }\n } else {\n this.build();\n }\n\n return this;\n },\n // Destroy the viewer\n destroy: function destroy() {\n var element = this.element,\n options = this.options;\n\n if (!element[NAMESPACE]) {\n return this;\n }\n\n this.destroyed = true;\n\n if (this.ready) {\n if (this.played) {\n this.stop();\n }\n\n if (options.inline) {\n if (this.fulled) {\n this.exit();\n }\n\n this.unbind();\n } else if (this.isShown) {\n if (this.viewing) {\n if (this.imageRendering) {\n this.imageRendering.abort();\n } else if (this.imageInitializing) {\n this.imageInitializing.abort();\n }\n }\n\n if (this.hiding) {\n this.transitioning.abort();\n }\n\n this.hidden();\n } else if (this.showing) {\n this.transitioning.abort();\n this.hidden();\n }\n\n this.ready = false;\n this.viewer.parentNode.removeChild(this.viewer);\n } else if (options.inline) {\n if (this.delaying) {\n this.delaying.abort();\n } else if (this.initializing) {\n this.initializing.abort();\n }\n }\n\n if (!options.inline) {\n removeListener(element, EVENT_CLICK, this.onStart);\n }\n\n element[NAMESPACE] = undefined;\n return this;\n }\n };\n\n var others = {\n getImageURL: function getImageURL(image) {\n var url = this.options.url;\n\n if (isString(url)) {\n url = image.getAttribute(url);\n } else if (isFunction(url)) {\n url = url.call(this, image);\n } else {\n url = '';\n }\n\n return url;\n },\n enforceFocus: function enforceFocus() {\n var _this = this;\n\n this.clearEnforceFocus();\n addListener(document, EVENT_FOCUSIN, this.onFocusin = function (event) {\n var viewer = _this.viewer;\n var target = event.target;\n\n if (target === document || target === viewer || viewer.contains(target)) {\n return;\n }\n\n while (target) {\n // Avoid conflicts with other modals (#474, #540)\n if (target.getAttribute('tabindex') !== null || target.getAttribute('aria-modal') === 'true') {\n return;\n }\n\n target = target.parentElement;\n }\n\n viewer.focus();\n });\n },\n clearEnforceFocus: function clearEnforceFocus() {\n if (this.onFocusin) {\n removeListener(document, EVENT_FOCUSIN, this.onFocusin);\n this.onFocusin = null;\n }\n },\n open: function open() {\n var body = this.body;\n addClass(body, CLASS_OPEN);\n body.style.paddingRight = \"\".concat(this.scrollbarWidth + (parseFloat(this.initialBodyComputedPaddingRight) || 0), \"px\");\n },\n close: function close() {\n var body = this.body;\n removeClass(body, CLASS_OPEN);\n body.style.paddingRight = this.initialBodyPaddingRight;\n },\n shown: function shown() {\n var element = this.element,\n options = this.options,\n viewer = this.viewer;\n this.fulled = true;\n this.isShown = true;\n this.render();\n this.bind();\n this.showing = false;\n\n if (options.focus) {\n viewer.focus();\n this.enforceFocus();\n }\n\n if (isFunction(options.shown)) {\n addListener(element, EVENT_SHOWN, options.shown, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_SHOWN) === false) {\n return;\n }\n\n if (this.ready && this.isShown && !this.hiding) {\n this.view(this.index);\n }\n },\n hidden: function hidden() {\n var element = this.element,\n options = this.options,\n viewer = this.viewer;\n\n if (options.fucus) {\n this.clearEnforceFocus();\n }\n\n this.fulled = false;\n this.viewed = false;\n this.isShown = false;\n this.close();\n this.unbind();\n addClass(viewer, CLASS_HIDE);\n viewer.removeAttribute('role');\n viewer.removeAttribute('aria-labelledby');\n viewer.removeAttribute('aria-modal');\n viewer.setAttribute('aria-hidden', true);\n this.resetList();\n this.resetImage();\n this.hiding = false;\n\n if (!this.destroyed) {\n if (isFunction(options.hidden)) {\n addListener(element, EVENT_HIDDEN, options.hidden, {\n once: true\n });\n }\n\n dispatchEvent(element, EVENT_HIDDEN, null, {\n cancelable: false\n });\n }\n },\n requestFullscreen: function requestFullscreen(options) {\n var document = this.element.ownerDocument;\n\n if (this.fulled && !(document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement)) {\n var documentElement = document.documentElement; // Element.requestFullscreen()\n\n if (documentElement.requestFullscreen) {\n // Avoid TypeError when convert `options` to dictionary\n if (isPlainObject(options)) {\n documentElement.requestFullscreen(options);\n } else {\n documentElement.requestFullscreen();\n }\n } else if (documentElement.webkitRequestFullscreen) {\n documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);\n } else if (documentElement.mozRequestFullScreen) {\n documentElement.mozRequestFullScreen();\n } else if (documentElement.msRequestFullscreen) {\n documentElement.msRequestFullscreen();\n }\n }\n },\n exitFullscreen: function exitFullscreen() {\n var document = this.element.ownerDocument;\n\n if (this.fulled && (document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement)) {\n // Document.exitFullscreen()\n if (document.exitFullscreen) {\n document.exitFullscreen();\n } else if (document.webkitExitFullscreen) {\n document.webkitExitFullscreen();\n } else if (document.mozCancelFullScreen) {\n document.mozCancelFullScreen();\n } else if (document.msExitFullscreen) {\n document.msExitFullscreen();\n }\n }\n },\n change: function change(event) {\n var options = this.options,\n pointers = this.pointers;\n var pointer = pointers[Object.keys(pointers)[0]]; // In the case of the `pointers` object is empty (#421)\n\n if (!pointer) {\n return;\n }\n\n var offsetX = pointer.endX - pointer.startX;\n var offsetY = pointer.endY - pointer.startY;\n\n switch (this.action) {\n // Move the current image\n case ACTION_MOVE:\n this.move(offsetX, offsetY, event);\n break;\n // Zoom the current image\n\n case ACTION_ZOOM:\n this.zoom(getMaxZoomRatio(pointers), false, event);\n break;\n\n case ACTION_SWITCH:\n {\n this.action = 'switched';\n var absoluteOffsetX = Math.abs(offsetX);\n\n if (absoluteOffsetX > 1 && absoluteOffsetX > Math.abs(offsetY)) {\n // Empty `pointers` as `touchend` event will not be fired after swiped in iOS browsers.\n this.pointers = {};\n\n if (offsetX > 1) {\n this.prev(options.loop);\n } else if (offsetX < -1) {\n this.next(options.loop);\n }\n }\n\n break;\n }\n } // Override\n\n\n forEach(pointers, function (p) {\n p.startX = p.endX;\n p.startY = p.endY;\n });\n },\n isSwitchable: function isSwitchable() {\n var imageData = this.imageData,\n viewerData = this.viewerData;\n return this.length > 1 && imageData.x >= 0 && imageData.y >= 0 && imageData.width <= viewerData.width && imageData.height <= viewerData.height;\n }\n };\n\n var AnotherViewer = WINDOW.Viewer;\n\n var getUniqueID = function (id) {\n return function () {\n id += 1;\n return id;\n };\n }(-1);\n\n var Viewer = /*#__PURE__*/function () {\n /**\n * Create a new Viewer.\n * @param {Element} element - The target element for viewing.\n * @param {Object} [options={}] - The configuration options.\n */\n function Viewer(element) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n _classCallCheck(this, Viewer);\n\n if (!element || element.nodeType !== 1) {\n throw new Error('The first argument is required and must be an element.');\n }\n\n this.element = element;\n this.options = assign({}, DEFAULTS, isPlainObject(options) && options);\n this.action = false;\n this.fading = false;\n this.fulled = false;\n this.hiding = false;\n this.imageClicked = false;\n this.imageData = {};\n this.index = this.options.initialViewIndex;\n this.isImg = false;\n this.isShown = false;\n this.length = 0;\n this.moving = false;\n this.played = false;\n this.playing = false;\n this.pointers = {};\n this.ready = false;\n this.rotating = false;\n this.scaling = false;\n this.showing = false;\n this.timeout = false;\n this.tooltipping = false;\n this.viewed = false;\n this.viewing = false;\n this.wheeling = false;\n this.zooming = false;\n this.id = getUniqueID();\n this.init();\n }\n\n _createClass(Viewer, [{\n key: \"init\",\n value: function init() {\n var _this = this;\n\n var element = this.element,\n options = this.options;\n\n if (element[NAMESPACE]) {\n return;\n }\n\n element[NAMESPACE] = this; // The `focus` option requires the `keyboard` option set to `true`.\n\n if (options.focus && !options.keyboard) {\n options.focus = false;\n }\n\n var isImg = element.localName === 'img';\n var images = [];\n forEach(isImg ? [element] : element.querySelectorAll('img'), function (image) {\n if (isFunction(options.filter)) {\n if (options.filter.call(_this, image)) {\n images.push(image);\n }\n } else if (_this.getImageURL(image)) {\n images.push(image);\n }\n });\n this.isImg = isImg;\n this.length = images.length;\n this.images = images;\n this.initBody(); // Override `transition` option if it is not supported\n\n if (isUndefined(document.createElement(NAMESPACE).style.transition)) {\n options.transition = false;\n }\n\n if (options.inline) {\n var count = 0;\n\n var progress = function progress() {\n count += 1;\n\n if (count === _this.length) {\n var timeout;\n _this.initializing = false;\n _this.delaying = {\n abort: function abort() {\n clearTimeout(timeout);\n }\n }; // build asynchronously to keep `this.viewer` is accessible in `ready` event handler.\n\n timeout = setTimeout(function () {\n _this.delaying = false;\n\n _this.build();\n }, 0);\n }\n };\n\n this.initializing = {\n abort: function abort() {\n forEach(images, function (image) {\n if (!image.complete) {\n removeListener(image, EVENT_LOAD, progress);\n removeListener(image, EVENT_ERROR, progress);\n }\n });\n }\n };\n forEach(images, function (image) {\n if (image.complete) {\n progress();\n } else {\n var onLoad;\n var onError;\n addListener(image, EVENT_LOAD, onLoad = function onLoad() {\n removeListener(image, EVENT_ERROR, onError);\n progress();\n }, {\n once: true\n });\n addListener(image, EVENT_ERROR, onError = function onError() {\n removeListener(image, EVENT_LOAD, onLoad);\n progress();\n }, {\n once: true\n });\n }\n });\n } else {\n addListener(element, EVENT_CLICK, this.onStart = function (_ref) {\n var target = _ref.target;\n\n if (target.localName === 'img' && (!isFunction(options.filter) || options.filter.call(_this, target))) {\n _this.view(_this.images.indexOf(target));\n }\n });\n }\n }\n }, {\n key: \"build\",\n value: function build() {\n if (this.ready) {\n return;\n }\n\n var element = this.element,\n options = this.options;\n var parent = element.parentNode;\n var template = document.createElement('div');\n template.innerHTML = TEMPLATE;\n var viewer = template.querySelector(\".\".concat(NAMESPACE, \"-container\"));\n var title = viewer.querySelector(\".\".concat(NAMESPACE, \"-title\"));\n var toolbar = viewer.querySelector(\".\".concat(NAMESPACE, \"-toolbar\"));\n var navbar = viewer.querySelector(\".\".concat(NAMESPACE, \"-navbar\"));\n var button = viewer.querySelector(\".\".concat(NAMESPACE, \"-button\"));\n var canvas = viewer.querySelector(\".\".concat(NAMESPACE, \"-canvas\"));\n this.parent = parent;\n this.viewer = viewer;\n this.title = title;\n this.toolbar = toolbar;\n this.navbar = navbar;\n this.button = button;\n this.canvas = canvas;\n this.footer = viewer.querySelector(\".\".concat(NAMESPACE, \"-footer\"));\n this.tooltipBox = viewer.querySelector(\".\".concat(NAMESPACE, \"-tooltip\"));\n this.player = viewer.querySelector(\".\".concat(NAMESPACE, \"-player\"));\n this.list = viewer.querySelector(\".\".concat(NAMESPACE, \"-list\"));\n viewer.id = \"\".concat(NAMESPACE).concat(this.id);\n title.id = \"\".concat(NAMESPACE, \"Title\").concat(this.id);\n addClass(title, !options.title ? CLASS_HIDE : getResponsiveClass(Array.isArray(options.title) ? options.title[0] : options.title));\n addClass(navbar, !options.navbar ? CLASS_HIDE : getResponsiveClass(options.navbar));\n toggleClass(button, CLASS_HIDE, !options.button);\n\n if (options.keyboard) {\n button.setAttribute('tabindex', 0);\n }\n\n if (options.backdrop) {\n addClass(viewer, \"\".concat(NAMESPACE, \"-backdrop\"));\n\n if (!options.inline && options.backdrop !== 'static') {\n setData(canvas, DATA_ACTION, 'hide');\n }\n }\n\n if (isString(options.className) && options.className) {\n // In case there are multiple class names\n options.className.split(REGEXP_SPACES).forEach(function (className) {\n addClass(viewer, className);\n });\n }\n\n if (options.toolbar) {\n var list = document.createElement('ul');\n var custom = isPlainObject(options.toolbar);\n var zoomButtons = BUTTONS.slice(0, 3);\n var rotateButtons = BUTTONS.slice(7, 9);\n var scaleButtons = BUTTONS.slice(9);\n\n if (!custom) {\n addClass(toolbar, getResponsiveClass(options.toolbar));\n }\n\n forEach(custom ? options.toolbar : BUTTONS, function (value, index) {\n var deep = custom && isPlainObject(value);\n var name = custom ? hyphenate(index) : value;\n var show = deep && !isUndefined(value.show) ? value.show : value;\n\n if (!show || !options.zoomable && zoomButtons.indexOf(name) !== -1 || !options.rotatable && rotateButtons.indexOf(name) !== -1 || !options.scalable && scaleButtons.indexOf(name) !== -1) {\n return;\n }\n\n var size = deep && !isUndefined(value.size) ? value.size : value;\n var click = deep && !isUndefined(value.click) ? value.click : value;\n var item = document.createElement('li');\n\n if (options.keyboard) {\n item.setAttribute('tabindex', 0);\n }\n\n item.setAttribute('role', 'button');\n addClass(item, \"\".concat(NAMESPACE, \"-\").concat(name));\n\n if (!isFunction(click)) {\n setData(item, DATA_ACTION, name);\n }\n\n if (isNumber(show)) {\n addClass(item, getResponsiveClass(show));\n }\n\n if (['small', 'large'].indexOf(size) !== -1) {\n addClass(item, \"\".concat(NAMESPACE, \"-\").concat(size));\n } else if (name === 'play') {\n addClass(item, \"\".concat(NAMESPACE, \"-large\"));\n }\n\n if (isFunction(click)) {\n addListener(item, EVENT_CLICK, click);\n }\n\n list.appendChild(item);\n });\n toolbar.appendChild(list);\n } else {\n addClass(toolbar, CLASS_HIDE);\n }\n\n if (!options.rotatable) {\n var rotates = toolbar.querySelectorAll('li[class*=\"rotate\"]');\n addClass(rotates, CLASS_INVISIBLE);\n forEach(rotates, function (rotate) {\n toolbar.appendChild(rotate);\n });\n }\n\n if (options.inline) {\n addClass(button, CLASS_FULLSCREEN);\n setStyle(viewer, {\n zIndex: options.zIndexInline\n });\n\n if (window.getComputedStyle(parent).position === 'static') {\n setStyle(parent, {\n position: 'relative'\n });\n }\n\n parent.insertBefore(viewer, element.nextSibling);\n } else {\n addClass(button, CLASS_CLOSE);\n addClass(viewer, CLASS_FIXED);\n addClass(viewer, CLASS_FADE);\n addClass(viewer, CLASS_HIDE);\n setStyle(viewer, {\n zIndex: options.zIndex\n });\n var container = options.container;\n\n if (isString(container)) {\n container = element.ownerDocument.querySelector(container);\n }\n\n if (!container) {\n container = this.body;\n }\n\n container.appendChild(viewer);\n }\n\n if (options.inline) {\n this.render();\n this.bind();\n this.isShown = true;\n }\n\n this.ready = true;\n\n if (isFunction(options.ready)) {\n addListener(element, EVENT_READY, options.ready, {\n once: true\n });\n }\n\n if (dispatchEvent(element, EVENT_READY) === false) {\n this.ready = false;\n return;\n }\n\n if (this.ready && options.inline) {\n this.view(this.index);\n }\n }\n /**\n * Get the no conflict viewer class.\n * @returns {Viewer} The viewer class.\n */\n\n }], [{\n key: \"noConflict\",\n value: function noConflict() {\n window.Viewer = AnotherViewer;\n return Viewer;\n }\n /**\n * Change the default options.\n * @param {Object} options - The new default options.\n */\n\n }, {\n key: \"setDefaults\",\n value: function setDefaults(options) {\n assign(DEFAULTS, isPlainObject(options) && options);\n }\n }]);\n\n return Viewer;\n }();\n\n assign(Viewer.prototype, render, events, handlers, methods, others);\n\n return Viewer;\n\n}));\n\n\n//# sourceURL=webpack:///./node_modules/viewerjs/dist/viewer.js?")}}]);
Reference in a new issue View git blame Copy permalink