d4bed3e5c7
* fix bug * updata UI * 0.3.2 ### Added - [Files] Files can now be selected multiple files and downloaded, deleted, moved, etc. - [Apps] Support to modify the application opening address.([#204](https://github.com/IceWhaleTech/CasaOS/issues/204)) ### Changed - [Apps] Hide the display of non-essential environment variables in the application. - [System] Network, disk, cpu, memory, etc. information is modified to be pushed via socket. - [System] Optimize opening speed.([#214](https://github.com/IceWhaleTech/CasaOS/issues/214)) ### Fixed - [System] Fixed the problem that sync data cannot submit the device ID ([#68](https://github.com/IceWhaleTech/CasaOS/issues/68)) - [Files] Fixed the code editor center alignment display problem.([#210](https://github.com/IceWhaleTech/CasaOS/issues/210)) - [Files] Fixed the problem of wrong name when downloading files.([#240](https://github.com/IceWhaleTech/CasaOS/issues/240)) - [System] Fixed the network display as a negative number problem.([#224](https://github.com/IceWhaleTech/CasaOS/issues/224)) * Modify log help class * Fix some bugs in 0.3.2 * Solve the operation file queue problem * Exclude web folders * update UI
13 lines
No EOL
128 KiB
JavaScript
13 lines
No EOL
128 KiB
JavaScript
(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([[16],{"./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, '&').replace(/\"/g, '"').replace(/'/g, ''').replace(/</g, '<').replace(/>/g, '>') : 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?")}}]); |