');\n this.element.appendChild(messageElement);\n }\n\n var span = messageElement.getElementsByTagName(\"span\")[0];\n\n if (span) {\n if (span.textContent != null) {\n span.textContent = this.options.dictFallbackMessage;\n } else if (span.innerText != null) {\n span.innerText = this.options.dictFallbackMessage;\n }\n }\n\n return this.element.appendChild(this.getFallbackForm());\n },\n\n /**\n * Gets called to calculate the thumbnail dimensions.\n *\n * It gets `file`, `width` and `height` (both may be `null`) as parameters and must return an object containing:\n *\n * - `srcWidth` & `srcHeight` (required)\n * - `trgWidth` & `trgHeight` (required)\n * - `srcX` & `srcY` (optional, default `0`)\n * - `trgX` & `trgY` (optional, default `0`)\n *\n * Those values are going to be used by `ctx.drawImage()`.\n */\n resize: function resize(file, width, height, resizeMethod) {\n var info = {\n srcX: 0,\n srcY: 0,\n srcWidth: file.width,\n srcHeight: file.height\n };\n var srcRatio = file.width / file.height; // Automatically calculate dimensions if not specified\n\n if (width == null && height == null) {\n width = info.srcWidth;\n height = info.srcHeight;\n } else if (width == null) {\n width = height * srcRatio;\n } else if (height == null) {\n height = width / srcRatio;\n } // Make sure images aren't upscaled\n\n\n width = Math.min(width, info.srcWidth);\n height = Math.min(height, info.srcHeight);\n var trgRatio = width / height;\n\n if (info.srcWidth > width || info.srcHeight > height) {\n // Image is bigger and needs rescaling\n if (resizeMethod === \"crop\") {\n if (srcRatio > trgRatio) {\n info.srcHeight = file.height;\n info.srcWidth = info.srcHeight * trgRatio;\n } else {\n info.srcWidth = file.width;\n info.srcHeight = info.srcWidth / trgRatio;\n }\n } else if (resizeMethod === \"contain\") {\n // Method 'contain'\n if (srcRatio > trgRatio) {\n height = width / srcRatio;\n } else {\n width = height * srcRatio;\n }\n } else {\n throw new Error(\"Unknown resizeMethod '\".concat(resizeMethod, \"'\"));\n }\n }\n\n info.srcX = (file.width - info.srcWidth) / 2;\n info.srcY = (file.height - info.srcHeight) / 2;\n info.trgWidth = width;\n info.trgHeight = height;\n return info;\n },\n\n /**\n * Can be used to transform the file (for example, resize an image if necessary).\n *\n * The default implementation uses `resizeWidth` and `resizeHeight` (if provided) and resizes\n * images according to those dimensions.\n *\n * Gets the `file` as the first parameter, and a `done()` function as the second, that needs\n * to be invoked with the file when the transformation is done.\n */\n transformFile: function transformFile(file, done) {\n if ((this.options.resizeWidth || this.options.resizeHeight) && file.type.match(/image.*/)) {\n return this.resizeImage(file, this.options.resizeWidth, this.options.resizeHeight, this.options.resizeMethod, done);\n } else {\n return done(file);\n }\n },\n\n /**\n * A string that contains the template used for each dropped\n * file. Change it to fulfill your needs but make sure to properly\n * provide all elements.\n *\n * If you want to use an actual HTML element instead of providing a String\n * as a config option, you could create a div with the id `tpl`,\n * put the template inside it and provide the element like this:\n *\n * document\n * .querySelector('#tpl')\n * .innerHTML\n *\n */\n previewTemplate: preview_template,\n\n /*\n Those functions register themselves to the events on init and handle all\n the user interface specific stuff. Overwriting them won't break the upload\n but can break the way it's displayed.\n You can overwrite them if you don't like the default behavior. If you just\n want to add an additional event handler, register it on the dropzone object\n and don't overwrite those options.\n */\n // Those are self explanatory and simply concern the DragnDrop.\n drop: function drop(e) {\n return this.element.classList.remove(\"dz-drag-hover\");\n },\n dragstart: function dragstart(e) {},\n dragend: function dragend(e) {\n return this.element.classList.remove(\"dz-drag-hover\");\n },\n dragenter: function dragenter(e) {\n return this.element.classList.add(\"dz-drag-hover\");\n },\n dragover: function dragover(e) {\n return this.element.classList.add(\"dz-drag-hover\");\n },\n dragleave: function dragleave(e) {\n return this.element.classList.remove(\"dz-drag-hover\");\n },\n paste: function paste(e) {},\n // Called whenever there are no files left in the dropzone anymore, and the\n // dropzone should be displayed as if in the initial state.\n reset: function reset() {\n return this.element.classList.remove(\"dz-started\");\n },\n // Called when a file is added to the queue\n // Receives `file`\n addedfile: function addedfile(file) {\n var _this = this;\n\n if (this.element === this.previewsContainer) {\n this.element.classList.add(\"dz-started\");\n }\n\n if (this.previewsContainer && !this.options.disablePreviews) {\n file.previewElement = Dropzone.createElement(this.options.previewTemplate.trim());\n file.previewTemplate = file.previewElement; // Backwards compatibility\n\n this.previewsContainer.appendChild(file.previewElement);\n\n var _iterator2 = options_createForOfIteratorHelper(file.previewElement.querySelectorAll(\"[data-dz-name]\"), true),\n _step2;\n\n try {\n for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {\n var node = _step2.value;\n node.textContent = file.name;\n }\n } catch (err) {\n _iterator2.e(err);\n } finally {\n _iterator2.f();\n }\n\n var _iterator3 = options_createForOfIteratorHelper(file.previewElement.querySelectorAll(\"[data-dz-size]\"), true),\n _step3;\n\n try {\n for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {\n node = _step3.value;\n node.innerHTML = this.filesize(file.size);\n }\n } catch (err) {\n _iterator3.e(err);\n } finally {\n _iterator3.f();\n }\n\n if (this.options.addRemoveLinks) {\n file._removeLink = Dropzone.createElement(\"\".concat(this.options.dictRemoveFile, \"\"));\n file.previewElement.appendChild(file._removeLink);\n }\n\n var removeFileEvent = function removeFileEvent(e) {\n e.preventDefault();\n e.stopPropagation();\n\n if (file.status === Dropzone.UPLOADING) {\n return Dropzone.confirm(_this.options.dictCancelUploadConfirmation, function () {\n return _this.removeFile(file);\n });\n } else {\n if (_this.options.dictRemoveFileConfirmation) {\n return Dropzone.confirm(_this.options.dictRemoveFileConfirmation, function () {\n return _this.removeFile(file);\n });\n } else {\n return _this.removeFile(file);\n }\n }\n };\n\n var _iterator4 = options_createForOfIteratorHelper(file.previewElement.querySelectorAll(\"[data-dz-remove]\"), true),\n _step4;\n\n try {\n for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {\n var removeLink = _step4.value;\n removeLink.addEventListener(\"click\", removeFileEvent);\n }\n } catch (err) {\n _iterator4.e(err);\n } finally {\n _iterator4.f();\n }\n }\n },\n // Called whenever a file is removed.\n removedfile: function removedfile(file) {\n if (file.previewElement != null && file.previewElement.parentNode != null) {\n file.previewElement.parentNode.removeChild(file.previewElement);\n }\n\n return this._updateMaxFilesReachedClass();\n },\n // Called when a thumbnail has been generated\n // Receives `file` and `dataUrl`\n thumbnail: function thumbnail(file, dataUrl) {\n if (file.previewElement) {\n file.previewElement.classList.remove(\"dz-file-preview\");\n\n var _iterator5 = options_createForOfIteratorHelper(file.previewElement.querySelectorAll(\"[data-dz-thumbnail]\"), true),\n _step5;\n\n try {\n for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {\n var thumbnailElement = _step5.value;\n thumbnailElement.alt = file.name;\n thumbnailElement.src = dataUrl;\n }\n } catch (err) {\n _iterator5.e(err);\n } finally {\n _iterator5.f();\n }\n\n return setTimeout(function () {\n return file.previewElement.classList.add(\"dz-image-preview\");\n }, 1);\n }\n },\n // Called whenever an error occurs\n // Receives `file` and `message`\n error: function error(file, message) {\n if (file.previewElement) {\n file.previewElement.classList.add(\"dz-error\");\n\n if (typeof message !== \"string\" && message.error) {\n message = message.error;\n }\n\n var _iterator6 = options_createForOfIteratorHelper(file.previewElement.querySelectorAll(\"[data-dz-errormessage]\"), true),\n _step6;\n\n try {\n for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {\n var node = _step6.value;\n node.textContent = message;\n }\n } catch (err) {\n _iterator6.e(err);\n } finally {\n _iterator6.f();\n }\n }\n },\n errormultiple: function errormultiple() {},\n // Called when a file gets processed. Since there is a cue, not all added\n // files are processed immediately.\n // Receives `file`\n processing: function processing(file) {\n if (file.previewElement) {\n file.previewElement.classList.add(\"dz-processing\");\n\n if (file._removeLink) {\n return file._removeLink.innerHTML = this.options.dictCancelUpload;\n }\n }\n },\n processingmultiple: function processingmultiple() {},\n // Called whenever the upload progress gets updated.\n // Receives `file`, `progress` (percentage 0-100) and `bytesSent`.\n // To get the total number of bytes of the file, use `file.size`\n uploadprogress: function uploadprogress(file, progress, bytesSent) {\n if (file.previewElement) {\n var _iterator7 = options_createForOfIteratorHelper(file.previewElement.querySelectorAll(\"[data-dz-uploadprogress]\"), true),\n _step7;\n\n try {\n for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {\n var node = _step7.value;\n node.nodeName === \"PROGRESS\" ? node.value = progress : node.style.width = \"\".concat(progress, \"%\");\n }\n } catch (err) {\n _iterator7.e(err);\n } finally {\n _iterator7.f();\n }\n }\n },\n // Called whenever the total upload progress gets updated.\n // Called with totalUploadProgress (0-100), totalBytes and totalBytesSent\n totaluploadprogress: function totaluploadprogress() {},\n // Called just before the file is sent. Gets the `xhr` object as second\n // parameter, so you can modify it (for example to add a CSRF token) and a\n // `formData` object to add additional information.\n sending: function sending() {},\n sendingmultiple: function sendingmultiple() {},\n // When the complete upload is finished and successful\n // Receives `file`\n success: function success(file) {\n if (file.previewElement) {\n return file.previewElement.classList.add(\"dz-success\");\n }\n },\n successmultiple: function successmultiple() {},\n // When the upload is canceled.\n canceled: function canceled(file) {\n return this.emit(\"error\", file, this.options.dictUploadCanceled);\n },\n canceledmultiple: function canceledmultiple() {},\n // When the upload is finished, either with success or an error.\n // Receives `file`\n complete: function complete(file) {\n if (file._removeLink) {\n file._removeLink.innerHTML = this.options.dictRemoveFile;\n }\n\n if (file.previewElement) {\n return file.previewElement.classList.add(\"dz-complete\");\n }\n },\n completemultiple: function completemultiple() {},\n maxfilesexceeded: function maxfilesexceeded() {},\n maxfilesreached: function maxfilesreached() {},\n queuecomplete: function queuecomplete() {},\n addedfiles: function addedfiles() {}\n};\n/* harmony default export */ var src_options = (defaultOptions);\n;// CONCATENATED MODULE: ./src/dropzone.js\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nfunction dropzone_createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === \"undefined\" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = dropzone_unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }\n\nfunction dropzone_unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return dropzone_arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return dropzone_arrayLikeToArray(o, minLen); }\n\nfunction dropzone_arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction dropzone_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction dropzone_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction dropzone_createClass(Constructor, protoProps, staticProps) { if (protoProps) dropzone_defineProperties(Constructor.prototype, protoProps); if (staticProps) dropzone_defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n\nvar Dropzone = /*#__PURE__*/function (_Emitter) {\n _inherits(Dropzone, _Emitter);\n\n var _super = _createSuper(Dropzone);\n\n function Dropzone(el, options) {\n var _this;\n\n dropzone_classCallCheck(this, Dropzone);\n\n _this = _super.call(this);\n var fallback, left;\n _this.element = el; // For backwards compatibility since the version was in the prototype previously\n\n _this.version = Dropzone.version;\n _this.clickableElements = [];\n _this.listeners = [];\n _this.files = []; // All files\n\n if (typeof _this.element === \"string\") {\n _this.element = document.querySelector(_this.element);\n } // Not checking if instance of HTMLElement or Element since IE9 is extremely weird.\n\n\n if (!_this.element || _this.element.nodeType == null) {\n throw new Error(\"Invalid dropzone element.\");\n }\n\n if (_this.element.dropzone) {\n throw new Error(\"Dropzone already attached.\");\n } // Now add this dropzone to the instances.\n\n\n Dropzone.instances.push(_assertThisInitialized(_this)); // Put the dropzone inside the element itself.\n\n _this.element.dropzone = _assertThisInitialized(_this);\n var elementOptions = (left = Dropzone.optionsForElement(_this.element)) != null ? left : {};\n _this.options = Dropzone.extend({}, src_options, elementOptions, options != null ? options : {});\n _this.options.previewTemplate = _this.options.previewTemplate.replace(/\\n*/g, \"\"); // If the browser failed, just call the fallback and leave\n\n if (_this.options.forceFallback || !Dropzone.isBrowserSupported()) {\n return _possibleConstructorReturn(_this, _this.options.fallback.call(_assertThisInitialized(_this)));\n } // @options.url = @element.getAttribute \"action\" unless @options.url?\n\n\n if (_this.options.url == null) {\n _this.options.url = _this.element.getAttribute(\"action\");\n }\n\n if (!_this.options.url) {\n throw new Error(\"No URL provided.\");\n }\n\n if (_this.options.acceptedFiles && _this.options.acceptedMimeTypes) {\n throw new Error(\"You can't provide both 'acceptedFiles' and 'acceptedMimeTypes'. 'acceptedMimeTypes' is deprecated.\");\n }\n\n if (_this.options.uploadMultiple && _this.options.chunking) {\n throw new Error(\"You cannot set both: uploadMultiple and chunking.\");\n } // Backwards compatibility\n\n\n if (_this.options.acceptedMimeTypes) {\n _this.options.acceptedFiles = _this.options.acceptedMimeTypes;\n delete _this.options.acceptedMimeTypes;\n } // Backwards compatibility\n\n\n if (_this.options.renameFilename != null) {\n _this.options.renameFile = function (file) {\n return _this.options.renameFilename.call(_assertThisInitialized(_this), file.name, file);\n };\n }\n\n if (typeof _this.options.method === \"string\") {\n _this.options.method = _this.options.method.toUpperCase();\n }\n\n if ((fallback = _this.getExistingFallback()) && fallback.parentNode) {\n // Remove the fallback\n fallback.parentNode.removeChild(fallback);\n } // Display previews in the previewsContainer element or the Dropzone element unless explicitly set to false\n\n\n if (_this.options.previewsContainer !== false) {\n if (_this.options.previewsContainer) {\n _this.previewsContainer = Dropzone.getElement(_this.options.previewsContainer, \"previewsContainer\");\n } else {\n _this.previewsContainer = _this.element;\n }\n }\n\n if (_this.options.clickable) {\n if (_this.options.clickable === true) {\n _this.clickableElements = [_this.element];\n } else {\n _this.clickableElements = Dropzone.getElements(_this.options.clickable, \"clickable\");\n }\n }\n\n _this.init();\n\n return _this;\n } // Returns all files that have been accepted\n\n\n dropzone_createClass(Dropzone, [{\n key: \"getAcceptedFiles\",\n value: function getAcceptedFiles() {\n return this.files.filter(function (file) {\n return file.accepted;\n }).map(function (file) {\n return file;\n });\n } // Returns all files that have been rejected\n // Not sure when that's going to be useful, but added for completeness.\n\n }, {\n key: \"getRejectedFiles\",\n value: function getRejectedFiles() {\n return this.files.filter(function (file) {\n return !file.accepted;\n }).map(function (file) {\n return file;\n });\n }\n }, {\n key: \"getFilesWithStatus\",\n value: function getFilesWithStatus(status) {\n return this.files.filter(function (file) {\n return file.status === status;\n }).map(function (file) {\n return file;\n });\n } // Returns all files that are in the queue\n\n }, {\n key: \"getQueuedFiles\",\n value: function getQueuedFiles() {\n return this.getFilesWithStatus(Dropzone.QUEUED);\n }\n }, {\n key: \"getUploadingFiles\",\n value: function getUploadingFiles() {\n return this.getFilesWithStatus(Dropzone.UPLOADING);\n }\n }, {\n key: \"getAddedFiles\",\n value: function getAddedFiles() {\n return this.getFilesWithStatus(Dropzone.ADDED);\n } // Files that are either queued or uploading\n\n }, {\n key: \"getActiveFiles\",\n value: function getActiveFiles() {\n return this.files.filter(function (file) {\n return file.status === Dropzone.UPLOADING || file.status === Dropzone.QUEUED;\n }).map(function (file) {\n return file;\n });\n } // The function that gets called when Dropzone is initialized. You\n // can (and should) setup event listeners inside this function.\n\n }, {\n key: \"init\",\n value: function init() {\n var _this2 = this;\n\n // In case it isn't set already\n if (this.element.tagName === \"form\") {\n this.element.setAttribute(\"enctype\", \"multipart/form-data\");\n }\n\n if (this.element.classList.contains(\"dropzone\") && !this.element.querySelector(\".dz-message\")) {\n this.element.appendChild(Dropzone.createElement(\"\")));\n }\n\n if (this.clickableElements.length) {\n var setupHiddenFileInput = function setupHiddenFileInput() {\n if (_this2.hiddenFileInput) {\n _this2.hiddenFileInput.parentNode.removeChild(_this2.hiddenFileInput);\n }\n\n _this2.hiddenFileInput = document.createElement(\"input\");\n\n _this2.hiddenFileInput.setAttribute(\"type\", \"file\");\n\n if (_this2.options.maxFiles === null || _this2.options.maxFiles > 1) {\n _this2.hiddenFileInput.setAttribute(\"multiple\", \"multiple\");\n }\n\n _this2.hiddenFileInput.className = \"dz-hidden-input\";\n\n if (_this2.options.acceptedFiles !== null) {\n _this2.hiddenFileInput.setAttribute(\"accept\", _this2.options.acceptedFiles);\n }\n\n if (_this2.options.capture !== null) {\n _this2.hiddenFileInput.setAttribute(\"capture\", _this2.options.capture);\n } // Making sure that no one can \"tab\" into this field.\n\n\n _this2.hiddenFileInput.setAttribute(\"tabindex\", \"-1\"); // Not setting `display=\"none\"` because some browsers don't accept clicks\n // on elements that aren't displayed.\n\n\n _this2.hiddenFileInput.style.visibility = \"hidden\";\n _this2.hiddenFileInput.style.position = \"absolute\";\n _this2.hiddenFileInput.style.top = \"0\";\n _this2.hiddenFileInput.style.left = \"0\";\n _this2.hiddenFileInput.style.height = \"0\";\n _this2.hiddenFileInput.style.width = \"0\";\n Dropzone.getElement(_this2.options.hiddenInputContainer, \"hiddenInputContainer\").appendChild(_this2.hiddenFileInput);\n\n _this2.hiddenFileInput.addEventListener(\"change\", function () {\n var files = _this2.hiddenFileInput.files;\n\n if (files.length) {\n var _iterator = dropzone_createForOfIteratorHelper(files, true),\n _step;\n\n try {\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var file = _step.value;\n\n _this2.addFile(file);\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n }\n\n _this2.emit(\"addedfiles\", files);\n\n setupHiddenFileInput();\n });\n };\n\n setupHiddenFileInput();\n }\n\n this.URL = window.URL !== null ? window.URL : window.webkitURL; // Setup all event listeners on the Dropzone object itself.\n // They're not in @setupEventListeners() because they shouldn't be removed\n // again when the dropzone gets disabled.\n\n var _iterator2 = dropzone_createForOfIteratorHelper(this.events, true),\n _step2;\n\n try {\n for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {\n var eventName = _step2.value;\n this.on(eventName, this.options[eventName]);\n }\n } catch (err) {\n _iterator2.e(err);\n } finally {\n _iterator2.f();\n }\n\n this.on(\"uploadprogress\", function () {\n return _this2.updateTotalUploadProgress();\n });\n this.on(\"removedfile\", function () {\n return _this2.updateTotalUploadProgress();\n });\n this.on(\"canceled\", function (file) {\n return _this2.emit(\"complete\", file);\n }); // Emit a `queuecomplete` event if all files finished uploading.\n\n this.on(\"complete\", function (file) {\n if (_this2.getAddedFiles().length === 0 && _this2.getUploadingFiles().length === 0 && _this2.getQueuedFiles().length === 0) {\n // This needs to be deferred so that `queuecomplete` really triggers after `complete`\n return setTimeout(function () {\n return _this2.emit(\"queuecomplete\");\n }, 0);\n }\n });\n\n var containsFiles = function containsFiles(e) {\n if (e.dataTransfer.types) {\n // Because e.dataTransfer.types is an Object in\n // IE, we need to iterate like this instead of\n // using e.dataTransfer.types.some()\n for (var i = 0; i < e.dataTransfer.types.length; i++) {\n if (e.dataTransfer.types[i] === \"Files\") return true;\n }\n }\n\n return false;\n };\n\n var noPropagation = function noPropagation(e) {\n // If there are no files, we don't want to stop\n // propagation so we don't interfere with other\n // drag and drop behaviour.\n if (!containsFiles(e)) return;\n e.stopPropagation();\n\n if (e.preventDefault) {\n return e.preventDefault();\n } else {\n return e.returnValue = false;\n }\n }; // Create the listeners\n\n\n this.listeners = [{\n element: this.element,\n events: {\n dragstart: function dragstart(e) {\n return _this2.emit(\"dragstart\", e);\n },\n dragenter: function dragenter(e) {\n noPropagation(e);\n return _this2.emit(\"dragenter\", e);\n },\n dragover: function dragover(e) {\n // Makes it possible to drag files from chrome's download bar\n // http://stackoverflow.com/questions/19526430/drag-and-drop-file-uploads-from-chrome-downloads-bar\n // Try is required to prevent bug in Internet Explorer 11 (SCRIPT65535 exception)\n var efct;\n\n try {\n efct = e.dataTransfer.effectAllowed;\n } catch (error) {}\n\n e.dataTransfer.dropEffect = \"move\" === efct || \"linkMove\" === efct ? \"move\" : \"copy\";\n noPropagation(e);\n return _this2.emit(\"dragover\", e);\n },\n dragleave: function dragleave(e) {\n return _this2.emit(\"dragleave\", e);\n },\n drop: function drop(e) {\n noPropagation(e);\n return _this2.drop(e);\n },\n dragend: function dragend(e) {\n return _this2.emit(\"dragend\", e);\n }\n } // This is disabled right now, because the browsers don't implement it properly.\n // \"paste\": (e) =>\n // noPropagation e\n // @paste e\n\n }];\n this.clickableElements.forEach(function (clickableElement) {\n return _this2.listeners.push({\n element: clickableElement,\n events: {\n click: function click(evt) {\n // Only the actual dropzone or the message element should trigger file selection\n if (clickableElement !== _this2.element || evt.target === _this2.element || Dropzone.elementInside(evt.target, _this2.element.querySelector(\".dz-message\"))) {\n _this2.hiddenFileInput.click(); // Forward the click\n\n }\n\n return true;\n }\n }\n });\n });\n this.enable();\n return this.options.init.call(this);\n } // Not fully tested yet\n\n }, {\n key: \"destroy\",\n value: function destroy() {\n this.disable();\n this.removeAllFiles(true);\n\n if (this.hiddenFileInput != null ? this.hiddenFileInput.parentNode : undefined) {\n this.hiddenFileInput.parentNode.removeChild(this.hiddenFileInput);\n this.hiddenFileInput = null;\n }\n\n delete this.element.dropzone;\n return Dropzone.instances.splice(Dropzone.instances.indexOf(this), 1);\n }\n }, {\n key: \"updateTotalUploadProgress\",\n value: function updateTotalUploadProgress() {\n var totalUploadProgress;\n var totalBytesSent = 0;\n var totalBytes = 0;\n var activeFiles = this.getActiveFiles();\n\n if (activeFiles.length) {\n var _iterator3 = dropzone_createForOfIteratorHelper(this.getActiveFiles(), true),\n _step3;\n\n try {\n for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {\n var file = _step3.value;\n totalBytesSent += file.upload.bytesSent;\n totalBytes += file.upload.total;\n }\n } catch (err) {\n _iterator3.e(err);\n } finally {\n _iterator3.f();\n }\n\n totalUploadProgress = 100 * totalBytesSent / totalBytes;\n } else {\n totalUploadProgress = 100;\n }\n\n return this.emit(\"totaluploadprogress\", totalUploadProgress, totalBytes, totalBytesSent);\n } // @options.paramName can be a function taking one parameter rather than a string.\n // A parameter name for a file is obtained simply by calling this with an index number.\n\n }, {\n key: \"_getParamName\",\n value: function _getParamName(n) {\n if (typeof this.options.paramName === \"function\") {\n return this.options.paramName(n);\n } else {\n return \"\".concat(this.options.paramName).concat(this.options.uploadMultiple ? \"[\".concat(n, \"]\") : \"\");\n }\n } // If @options.renameFile is a function,\n // the function will be used to rename the file.name before appending it to the formData\n\n }, {\n key: \"_renameFile\",\n value: function _renameFile(file) {\n if (typeof this.options.renameFile !== \"function\") {\n return file.name;\n }\n\n return this.options.renameFile(file);\n } // Returns a form that can be used as fallback if the browser does not support DragnDrop\n //\n // If the dropzone is already a form, only the input field and button are returned. Otherwise a complete form element is provided.\n // This code has to pass in IE7 :(\n\n }, {\n key: \"getFallbackForm\",\n value: function getFallbackForm() {\n var existingFallback, form;\n\n if (existingFallback = this.getExistingFallback()) {\n return existingFallback;\n }\n\n var fieldsString = '
';\n\n if (this.options.dictFallbackText) {\n fieldsString += \"
\".concat(this.options.dictFallbackText, \"
\");\n }\n\n fieldsString += \"
\");\n var fields = Dropzone.createElement(fieldsString);\n\n if (this.element.tagName !== \"FORM\") {\n form = Dropzone.createElement(\"\"));\n form.appendChild(fields);\n } else {\n // Make sure that the enctype and method attributes are set properly\n this.element.setAttribute(\"enctype\", \"multipart/form-data\");\n this.element.setAttribute(\"method\", this.options.method);\n }\n\n return form != null ? form : fields;\n } // Returns the fallback elements if they exist already\n //\n // This code has to pass in IE7 :(\n\n }, {\n key: \"getExistingFallback\",\n value: function getExistingFallback() {\n var getFallback = function getFallback(elements) {\n var _iterator4 = dropzone_createForOfIteratorHelper(elements, true),\n _step4;\n\n try {\n for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {\n var el = _step4.value;\n\n if (/(^| )fallback($| )/.test(el.className)) {\n return el;\n }\n }\n } catch (err) {\n _iterator4.e(err);\n } finally {\n _iterator4.f();\n }\n };\n\n for (var _i = 0, _arr = [\"div\", \"form\"]; _i < _arr.length; _i++) {\n var tagName = _arr[_i];\n var fallback;\n\n if (fallback = getFallback(this.element.getElementsByTagName(tagName))) {\n return fallback;\n }\n }\n } // Activates all listeners stored in @listeners\n\n }, {\n key: \"setupEventListeners\",\n value: function setupEventListeners() {\n return this.listeners.map(function (elementListeners) {\n return function () {\n var result = [];\n\n for (var event in elementListeners.events) {\n var listener = elementListeners.events[event];\n result.push(elementListeners.element.addEventListener(event, listener, false));\n }\n\n return result;\n }();\n });\n } // Deactivates all listeners stored in @listeners\n\n }, {\n key: \"removeEventListeners\",\n value: function removeEventListeners() {\n return this.listeners.map(function (elementListeners) {\n return function () {\n var result = [];\n\n for (var event in elementListeners.events) {\n var listener = elementListeners.events[event];\n result.push(elementListeners.element.removeEventListener(event, listener, false));\n }\n\n return result;\n }();\n });\n } // Removes all event listeners and cancels all files in the queue or being processed.\n\n }, {\n key: \"disable\",\n value: function disable() {\n var _this3 = this;\n\n this.clickableElements.forEach(function (element) {\n return element.classList.remove(\"dz-clickable\");\n });\n this.removeEventListeners();\n this.disabled = true;\n return this.files.map(function (file) {\n return _this3.cancelUpload(file);\n });\n }\n }, {\n key: \"enable\",\n value: function enable() {\n delete this.disabled;\n this.clickableElements.forEach(function (element) {\n return element.classList.add(\"dz-clickable\");\n });\n return this.setupEventListeners();\n } // Returns a nicely formatted filesize\n\n }, {\n key: \"filesize\",\n value: function filesize(size) {\n var selectedSize = 0;\n var selectedUnit = \"b\";\n\n if (size > 0) {\n var units = [\"tb\", \"gb\", \"mb\", \"kb\", \"b\"];\n\n for (var i = 0; i < units.length; i++) {\n var unit = units[i];\n var cutoff = Math.pow(this.options.filesizeBase, 4 - i) / 10;\n\n if (size >= cutoff) {\n selectedSize = size / Math.pow(this.options.filesizeBase, 4 - i);\n selectedUnit = unit;\n break;\n }\n }\n\n selectedSize = Math.round(10 * selectedSize) / 10; // Cutting of digits\n }\n\n return \"\".concat(selectedSize, \" \").concat(this.options.dictFileSizeUnits[selectedUnit]);\n } // Adds or removes the `dz-max-files-reached` class from the form.\n\n }, {\n key: \"_updateMaxFilesReachedClass\",\n value: function _updateMaxFilesReachedClass() {\n if (this.options.maxFiles != null && this.getAcceptedFiles().length >= this.options.maxFiles) {\n if (this.getAcceptedFiles().length === this.options.maxFiles) {\n this.emit(\"maxfilesreached\", this.files);\n }\n\n return this.element.classList.add(\"dz-max-files-reached\");\n } else {\n return this.element.classList.remove(\"dz-max-files-reached\");\n }\n }\n }, {\n key: \"drop\",\n value: function drop(e) {\n if (!e.dataTransfer) {\n return;\n }\n\n this.emit(\"drop\", e); // Convert the FileList to an Array\n // This is necessary for IE11\n\n var files = [];\n\n for (var i = 0; i < e.dataTransfer.files.length; i++) {\n files[i] = e.dataTransfer.files[i];\n } // Even if it's a folder, files.length will contain the folders.\n\n\n if (files.length) {\n var items = e.dataTransfer.items;\n\n if (items && items.length && items[0].webkitGetAsEntry != null) {\n // The browser supports dropping of folders, so handle items instead of files\n this._addFilesFromItems(items);\n } else {\n this.handleFiles(files);\n }\n }\n\n this.emit(\"addedfiles\", files);\n }\n }, {\n key: \"paste\",\n value: function paste(e) {\n if (__guard__(e != null ? e.clipboardData : undefined, function (x) {\n return x.items;\n }) == null) {\n return;\n }\n\n this.emit(\"paste\", e);\n var items = e.clipboardData.items;\n\n if (items.length) {\n return this._addFilesFromItems(items);\n }\n }\n }, {\n key: \"handleFiles\",\n value: function handleFiles(files) {\n var _iterator5 = dropzone_createForOfIteratorHelper(files, true),\n _step5;\n\n try {\n for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {\n var file = _step5.value;\n this.addFile(file);\n }\n } catch (err) {\n _iterator5.e(err);\n } finally {\n _iterator5.f();\n }\n } // When a folder is dropped (or files are pasted), items must be handled\n // instead of files.\n\n }, {\n key: \"_addFilesFromItems\",\n value: function _addFilesFromItems(items) {\n var _this4 = this;\n\n return function () {\n var result = [];\n\n var _iterator6 = dropzone_createForOfIteratorHelper(items, true),\n _step6;\n\n try {\n for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {\n var item = _step6.value;\n var entry;\n\n if (item.webkitGetAsEntry != null && (entry = item.webkitGetAsEntry())) {\n if (entry.isFile) {\n result.push(_this4.addFile(item.getAsFile()));\n } else if (entry.isDirectory) {\n // Append all files from that directory to files\n result.push(_this4._addFilesFromDirectory(entry, entry.name));\n } else {\n result.push(undefined);\n }\n } else if (item.getAsFile != null) {\n if (item.kind == null || item.kind === \"file\") {\n result.push(_this4.addFile(item.getAsFile()));\n } else {\n result.push(undefined);\n }\n } else {\n result.push(undefined);\n }\n }\n } catch (err) {\n _iterator6.e(err);\n } finally {\n _iterator6.f();\n }\n\n return result;\n }();\n } // Goes through the directory, and adds each file it finds recursively\n\n }, {\n key: \"_addFilesFromDirectory\",\n value: function _addFilesFromDirectory(directory, path) {\n var _this5 = this;\n\n var dirReader = directory.createReader();\n\n var errorHandler = function errorHandler(error) {\n return __guardMethod__(console, \"log\", function (o) {\n return o.log(error);\n });\n };\n\n var readEntries = function readEntries() {\n return dirReader.readEntries(function (entries) {\n if (entries.length > 0) {\n var _iterator7 = dropzone_createForOfIteratorHelper(entries, true),\n _step7;\n\n try {\n for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {\n var entry = _step7.value;\n\n if (entry.isFile) {\n entry.file(function (file) {\n if (_this5.options.ignoreHiddenFiles && file.name.substring(0, 1) === \".\") {\n return;\n }\n\n file.fullPath = \"\".concat(path, \"/\").concat(file.name);\n return _this5.addFile(file);\n });\n } else if (entry.isDirectory) {\n _this5._addFilesFromDirectory(entry, \"\".concat(path, \"/\").concat(entry.name));\n }\n } // Recursively call readEntries() again, since browser only handle\n // the first 100 entries.\n // See: https://developer.mozilla.org/en-US/docs/Web/API/DirectoryReader#readEntries\n\n } catch (err) {\n _iterator7.e(err);\n } finally {\n _iterator7.f();\n }\n\n readEntries();\n }\n\n return null;\n }, errorHandler);\n };\n\n return readEntries();\n } // If `done()` is called without argument the file is accepted\n // If you call it with an error message, the file is rejected\n // (This allows for asynchronous validation)\n //\n // This function checks the filesize, and if the file.type passes the\n // `acceptedFiles` check.\n\n }, {\n key: \"accept\",\n value: function accept(file, done) {\n if (this.options.maxFilesize && file.size > this.options.maxFilesize * 1024 * 1024) {\n done(this.options.dictFileTooBig.replace(\"{{filesize}}\", Math.round(file.size / 1024 / 10.24) / 100).replace(\"{{maxFilesize}}\", this.options.maxFilesize));\n } else if (!Dropzone.isValidFile(file, this.options.acceptedFiles)) {\n done(this.options.dictInvalidFileType);\n } else if (this.options.maxFiles != null && this.getAcceptedFiles().length >= this.options.maxFiles) {\n done(this.options.dictMaxFilesExceeded.replace(\"{{maxFiles}}\", this.options.maxFiles));\n this.emit(\"maxfilesexceeded\", file);\n } else {\n this.options.accept.call(this, file, done);\n }\n }\n }, {\n key: \"addFile\",\n value: function addFile(file) {\n var _this6 = this;\n\n file.upload = {\n uuid: Dropzone.uuidv4(),\n progress: 0,\n // Setting the total upload size to file.size for the beginning\n // It's actual different than the size to be transmitted.\n total: file.size,\n bytesSent: 0,\n filename: this._renameFile(file) // Not setting chunking information here, because the acutal data \u2014 and\n // thus the chunks \u2014 might change if `options.transformFile` is set\n // and does something to the data.\n\n };\n this.files.push(file);\n file.status = Dropzone.ADDED;\n this.emit(\"addedfile\", file);\n\n this._enqueueThumbnail(file);\n\n this.accept(file, function (error) {\n if (error) {\n file.accepted = false;\n\n _this6._errorProcessing([file], error); // Will set the file.status\n\n } else {\n file.accepted = true;\n\n if (_this6.options.autoQueue) {\n _this6.enqueueFile(file);\n } // Will set .accepted = true\n\n }\n\n _this6._updateMaxFilesReachedClass();\n });\n } // Wrapper for enqueueFile\n\n }, {\n key: \"enqueueFiles\",\n value: function enqueueFiles(files) {\n var _iterator8 = dropzone_createForOfIteratorHelper(files, true),\n _step8;\n\n try {\n for (_iterator8.s(); !(_step8 = _iterator8.n()).done;) {\n var file = _step8.value;\n this.enqueueFile(file);\n }\n } catch (err) {\n _iterator8.e(err);\n } finally {\n _iterator8.f();\n }\n\n return null;\n }\n }, {\n key: \"enqueueFile\",\n value: function enqueueFile(file) {\n var _this7 = this;\n\n if (file.status === Dropzone.ADDED && file.accepted === true) {\n file.status = Dropzone.QUEUED;\n\n if (this.options.autoProcessQueue) {\n return setTimeout(function () {\n return _this7.processQueue();\n }, 0); // Deferring the call\n }\n } else {\n throw new Error(\"This file can't be queued because it has already been processed or was rejected.\");\n }\n }\n }, {\n key: \"_enqueueThumbnail\",\n value: function _enqueueThumbnail(file) {\n var _this8 = this;\n\n if (this.options.createImageThumbnails && file.type.match(/image.*/) && file.size <= this.options.maxThumbnailFilesize * 1024 * 1024) {\n this._thumbnailQueue.push(file);\n\n return setTimeout(function () {\n return _this8._processThumbnailQueue();\n }, 0); // Deferring the call\n }\n }\n }, {\n key: \"_processThumbnailQueue\",\n value: function _processThumbnailQueue() {\n var _this9 = this;\n\n if (this._processingThumbnail || this._thumbnailQueue.length === 0) {\n return;\n }\n\n this._processingThumbnail = true;\n\n var file = this._thumbnailQueue.shift();\n\n return this.createThumbnail(file, this.options.thumbnailWidth, this.options.thumbnailHeight, this.options.thumbnailMethod, true, function (dataUrl) {\n _this9.emit(\"thumbnail\", file, dataUrl);\n\n _this9._processingThumbnail = false;\n return _this9._processThumbnailQueue();\n });\n } // Can be called by the user to remove a file\n\n }, {\n key: \"removeFile\",\n value: function removeFile(file) {\n if (file.status === Dropzone.UPLOADING) {\n this.cancelUpload(file);\n }\n\n this.files = without(this.files, file);\n this.emit(\"removedfile\", file);\n\n if (this.files.length === 0) {\n return this.emit(\"reset\");\n }\n } // Removes all files that aren't currently processed from the list\n\n }, {\n key: \"removeAllFiles\",\n value: function removeAllFiles(cancelIfNecessary) {\n // Create a copy of files since removeFile() changes the @files array.\n if (cancelIfNecessary == null) {\n cancelIfNecessary = false;\n }\n\n var _iterator9 = dropzone_createForOfIteratorHelper(this.files.slice(), true),\n _step9;\n\n try {\n for (_iterator9.s(); !(_step9 = _iterator9.n()).done;) {\n var file = _step9.value;\n\n if (file.status !== Dropzone.UPLOADING || cancelIfNecessary) {\n this.removeFile(file);\n }\n }\n } catch (err) {\n _iterator9.e(err);\n } finally {\n _iterator9.f();\n }\n\n return null;\n } // Resizes an image before it gets sent to the server. This function is the default behavior of\n // `options.transformFile` if `resizeWidth` or `resizeHeight` are set. The callback is invoked with\n // the resized blob.\n\n }, {\n key: \"resizeImage\",\n value: function resizeImage(file, width, height, resizeMethod, callback) {\n var _this10 = this;\n\n return this.createThumbnail(file, width, height, resizeMethod, true, function (dataUrl, canvas) {\n if (canvas == null) {\n // The image has not been resized\n return callback(file);\n } else {\n var resizeMimeType = _this10.options.resizeMimeType;\n\n if (resizeMimeType == null) {\n resizeMimeType = file.type;\n }\n\n var resizedDataURL = canvas.toDataURL(resizeMimeType, _this10.options.resizeQuality);\n\n if (resizeMimeType === \"image/jpeg\" || resizeMimeType === \"image/jpg\") {\n // Now add the original EXIF information\n resizedDataURL = ExifRestore.restore(file.dataURL, resizedDataURL);\n }\n\n return callback(Dropzone.dataURItoBlob(resizedDataURL));\n }\n });\n }\n }, {\n key: \"createThumbnail\",\n value: function createThumbnail(file, width, height, resizeMethod, fixOrientation, callback) {\n var _this11 = this;\n\n var fileReader = new FileReader();\n\n fileReader.onload = function () {\n file.dataURL = fileReader.result; // Don't bother creating a thumbnail for SVG images since they're vector\n\n if (file.type === \"image/svg+xml\") {\n if (callback != null) {\n callback(fileReader.result);\n }\n\n return;\n }\n\n _this11.createThumbnailFromUrl(file, width, height, resizeMethod, fixOrientation, callback);\n };\n\n fileReader.readAsDataURL(file);\n } // `mockFile` needs to have these attributes:\n //\n // { name: 'name', size: 12345, imageUrl: '' }\n //\n // `callback` will be invoked when the image has been downloaded and displayed.\n // `crossOrigin` will be added to the `img` tag when accessing the file.\n\n }, {\n key: \"displayExistingFile\",\n value: function displayExistingFile(mockFile, imageUrl, callback, crossOrigin) {\n var _this12 = this;\n\n var resizeThumbnail = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : true;\n this.emit(\"addedfile\", mockFile);\n this.emit(\"complete\", mockFile);\n\n if (!resizeThumbnail) {\n this.emit(\"thumbnail\", mockFile, imageUrl);\n if (callback) callback();\n } else {\n var onDone = function onDone(thumbnail) {\n _this12.emit(\"thumbnail\", mockFile, thumbnail);\n\n if (callback) callback();\n };\n\n mockFile.dataURL = imageUrl;\n this.createThumbnailFromUrl(mockFile, this.options.thumbnailWidth, this.options.thumbnailHeight, this.options.thumbnailMethod, this.options.fixOrientation, onDone, crossOrigin);\n }\n }\n }, {\n key: \"createThumbnailFromUrl\",\n value: function createThumbnailFromUrl(file, width, height, resizeMethod, fixOrientation, callback, crossOrigin) {\n var _this13 = this;\n\n // Not using `new Image` here because of a bug in latest Chrome versions.\n // See https://github.com/enyo/dropzone/pull/226\n var img = document.createElement(\"img\");\n\n if (crossOrigin) {\n img.crossOrigin = crossOrigin;\n } // fixOrientation is not needed anymore with browsers handling imageOrientation\n\n\n fixOrientation = getComputedStyle(document.body)[\"imageOrientation\"] == \"from-image\" ? false : fixOrientation;\n\n img.onload = function () {\n var loadExif = function loadExif(callback) {\n return callback(1);\n };\n\n if (typeof EXIF !== \"undefined\" && EXIF !== null && fixOrientation) {\n loadExif = function loadExif(callback) {\n return EXIF.getData(img, function () {\n return callback(EXIF.getTag(this, \"Orientation\"));\n });\n };\n }\n\n return loadExif(function (orientation) {\n file.width = img.width;\n file.height = img.height;\n\n var resizeInfo = _this13.options.resize.call(_this13, file, width, height, resizeMethod);\n\n var canvas = document.createElement(\"canvas\");\n var ctx = canvas.getContext(\"2d\");\n canvas.width = resizeInfo.trgWidth;\n canvas.height = resizeInfo.trgHeight;\n\n if (orientation > 4) {\n canvas.width = resizeInfo.trgHeight;\n canvas.height = resizeInfo.trgWidth;\n }\n\n switch (orientation) {\n case 2:\n // horizontal flip\n ctx.translate(canvas.width, 0);\n ctx.scale(-1, 1);\n break;\n\n case 3:\n // 180\u00B0 rotate left\n ctx.translate(canvas.width, canvas.height);\n ctx.rotate(Math.PI);\n break;\n\n case 4:\n // vertical flip\n ctx.translate(0, canvas.height);\n ctx.scale(1, -1);\n break;\n\n case 5:\n // vertical flip + 90 rotate right\n ctx.rotate(0.5 * Math.PI);\n ctx.scale(1, -1);\n break;\n\n case 6:\n // 90\u00B0 rotate right\n ctx.rotate(0.5 * Math.PI);\n ctx.translate(0, -canvas.width);\n break;\n\n case 7:\n // horizontal flip + 90 rotate right\n ctx.rotate(0.5 * Math.PI);\n ctx.translate(canvas.height, -canvas.width);\n ctx.scale(-1, 1);\n break;\n\n case 8:\n // 90\u00B0 rotate left\n ctx.rotate(-0.5 * Math.PI);\n ctx.translate(-canvas.height, 0);\n break;\n } // This is a bugfix for iOS' scaling bug.\n\n\n drawImageIOSFix(ctx, img, resizeInfo.srcX != null ? resizeInfo.srcX : 0, resizeInfo.srcY != null ? resizeInfo.srcY : 0, resizeInfo.srcWidth, resizeInfo.srcHeight, resizeInfo.trgX != null ? resizeInfo.trgX : 0, resizeInfo.trgY != null ? resizeInfo.trgY : 0, resizeInfo.trgWidth, resizeInfo.trgHeight);\n var thumbnail = canvas.toDataURL(\"image/png\");\n\n if (callback != null) {\n return callback(thumbnail, canvas);\n }\n });\n };\n\n if (callback != null) {\n img.onerror = callback;\n }\n\n return img.src = file.dataURL;\n } // Goes through the queue and processes files if there aren't too many already.\n\n }, {\n key: \"processQueue\",\n value: function processQueue() {\n var parallelUploads = this.options.parallelUploads;\n var processingLength = this.getUploadingFiles().length;\n var i = processingLength; // There are already at least as many files uploading than should be\n\n if (processingLength >= parallelUploads) {\n return;\n }\n\n var queuedFiles = this.getQueuedFiles();\n\n if (!(queuedFiles.length > 0)) {\n return;\n }\n\n if (this.options.uploadMultiple) {\n // The files should be uploaded in one request\n return this.processFiles(queuedFiles.slice(0, parallelUploads - processingLength));\n } else {\n while (i < parallelUploads) {\n if (!queuedFiles.length) {\n return;\n } // Nothing left to process\n\n\n this.processFile(queuedFiles.shift());\n i++;\n }\n }\n } // Wrapper for `processFiles`\n\n }, {\n key: \"processFile\",\n value: function processFile(file) {\n return this.processFiles([file]);\n } // Loads the file, then calls finishedLoading()\n\n }, {\n key: \"processFiles\",\n value: function processFiles(files) {\n var _iterator10 = dropzone_createForOfIteratorHelper(files, true),\n _step10;\n\n try {\n for (_iterator10.s(); !(_step10 = _iterator10.n()).done;) {\n var file = _step10.value;\n file.processing = true; // Backwards compatibility\n\n file.status = Dropzone.UPLOADING;\n this.emit(\"processing\", file);\n }\n } catch (err) {\n _iterator10.e(err);\n } finally {\n _iterator10.f();\n }\n\n if (this.options.uploadMultiple) {\n this.emit(\"processingmultiple\", files);\n }\n\n return this.uploadFiles(files);\n }\n }, {\n key: \"_getFilesWithXhr\",\n value: function _getFilesWithXhr(xhr) {\n var files;\n return files = this.files.filter(function (file) {\n return file.xhr === xhr;\n }).map(function (file) {\n return file;\n });\n } // Cancels the file upload and sets the status to CANCELED\n // **if** the file is actually being uploaded.\n // If it's still in the queue, the file is being removed from it and the status\n // set to CANCELED.\n\n }, {\n key: \"cancelUpload\",\n value: function cancelUpload(file) {\n if (file.status === Dropzone.UPLOADING) {\n var groupedFiles = this._getFilesWithXhr(file.xhr);\n\n var _iterator11 = dropzone_createForOfIteratorHelper(groupedFiles, true),\n _step11;\n\n try {\n for (_iterator11.s(); !(_step11 = _iterator11.n()).done;) {\n var groupedFile = _step11.value;\n groupedFile.status = Dropzone.CANCELED;\n }\n } catch (err) {\n _iterator11.e(err);\n } finally {\n _iterator11.f();\n }\n\n if (typeof file.xhr !== \"undefined\") {\n file.xhr.abort();\n }\n\n var _iterator12 = dropzone_createForOfIteratorHelper(groupedFiles, true),\n _step12;\n\n try {\n for (_iterator12.s(); !(_step12 = _iterator12.n()).done;) {\n var _groupedFile = _step12.value;\n this.emit(\"canceled\", _groupedFile);\n }\n } catch (err) {\n _iterator12.e(err);\n } finally {\n _iterator12.f();\n }\n\n if (this.options.uploadMultiple) {\n this.emit(\"canceledmultiple\", groupedFiles);\n }\n } else if (file.status === Dropzone.ADDED || file.status === Dropzone.QUEUED) {\n file.status = Dropzone.CANCELED;\n this.emit(\"canceled\", file);\n\n if (this.options.uploadMultiple) {\n this.emit(\"canceledmultiple\", [file]);\n }\n }\n\n if (this.options.autoProcessQueue) {\n return this.processQueue();\n }\n }\n }, {\n key: \"resolveOption\",\n value: function resolveOption(option) {\n if (typeof option === \"function\") {\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 return option.apply(this, args);\n }\n\n return option;\n }\n }, {\n key: \"uploadFile\",\n value: function uploadFile(file) {\n return this.uploadFiles([file]);\n }\n }, {\n key: \"uploadFiles\",\n value: function uploadFiles(files) {\n var _this14 = this;\n\n this._transformFiles(files, function (transformedFiles) {\n if (_this14.options.chunking) {\n // Chunking is not allowed to be used with `uploadMultiple` so we know\n // that there is only __one__file.\n var transformedFile = transformedFiles[0];\n files[0].upload.chunked = _this14.options.chunking && (_this14.options.forceChunking || transformedFile.size > _this14.options.chunkSize);\n files[0].upload.totalChunkCount = Math.ceil(transformedFile.size / _this14.options.chunkSize);\n }\n\n if (files[0].upload.chunked) {\n // This file should be sent in chunks!\n // If the chunking option is set, we **know** that there can only be **one** file, since\n // uploadMultiple is not allowed with this option.\n var file = files[0];\n var _transformedFile = transformedFiles[0];\n var startedChunkCount = 0;\n file.upload.chunks = [];\n\n var handleNextChunk = function handleNextChunk() {\n var chunkIndex = 0; // Find the next item in file.upload.chunks that is not defined yet.\n\n while (file.upload.chunks[chunkIndex] !== undefined) {\n chunkIndex++;\n } // This means, that all chunks have already been started.\n\n\n if (chunkIndex >= file.upload.totalChunkCount) return;\n startedChunkCount++;\n var start = chunkIndex * _this14.options.chunkSize;\n var end = Math.min(start + _this14.options.chunkSize, _transformedFile.size);\n var dataBlock = {\n name: _this14._getParamName(0),\n data: _transformedFile.webkitSlice ? _transformedFile.webkitSlice(start, end) : _transformedFile.slice(start, end),\n filename: file.upload.filename,\n chunkIndex: chunkIndex\n };\n file.upload.chunks[chunkIndex] = {\n file: file,\n index: chunkIndex,\n dataBlock: dataBlock,\n // In case we want to retry.\n status: Dropzone.UPLOADING,\n progress: 0,\n retries: 0 // The number of times this block has been retried.\n\n };\n\n _this14._uploadData(files, [dataBlock]);\n };\n\n file.upload.finishedChunkUpload = function (chunk, response) {\n var allFinished = true;\n chunk.status = Dropzone.SUCCESS; // Clear the data from the chunk\n\n chunk.dataBlock = null; // Leaving this reference to xhr intact here will cause memory leaks in some browsers\n\n chunk.xhr = null;\n\n for (var i = 0; i < file.upload.totalChunkCount; i++) {\n if (file.upload.chunks[i] === undefined) {\n return handleNextChunk();\n }\n\n if (file.upload.chunks[i].status !== Dropzone.SUCCESS) {\n allFinished = false;\n }\n }\n\n if (allFinished) {\n _this14.options.chunksUploaded(file, function () {\n _this14._finished(files, response, null);\n });\n }\n };\n\n if (_this14.options.parallelChunkUploads) {\n for (var i = 0; i < file.upload.totalChunkCount; i++) {\n handleNextChunk();\n }\n } else {\n handleNextChunk();\n }\n } else {\n var dataBlocks = [];\n\n for (var _i2 = 0; _i2 < files.length; _i2++) {\n dataBlocks[_i2] = {\n name: _this14._getParamName(_i2),\n data: transformedFiles[_i2],\n filename: files[_i2].upload.filename\n };\n }\n\n _this14._uploadData(files, dataBlocks);\n }\n });\n } /// Returns the right chunk for given file and xhr\n\n }, {\n key: \"_getChunk\",\n value: function _getChunk(file, xhr) {\n for (var i = 0; i < file.upload.totalChunkCount; i++) {\n if (file.upload.chunks[i] !== undefined && file.upload.chunks[i].xhr === xhr) {\n return file.upload.chunks[i];\n }\n }\n } // This function actually uploads the file(s) to the server.\n // If dataBlocks contains the actual data to upload (meaning, that this could either be transformed\n // files, or individual chunks for chunked upload).\n\n }, {\n key: \"_uploadData\",\n value: function _uploadData(files, dataBlocks) {\n var _this15 = this;\n\n var xhr = new XMLHttpRequest(); // Put the xhr object in the file objects to be able to reference it later.\n\n var _iterator13 = dropzone_createForOfIteratorHelper(files, true),\n _step13;\n\n try {\n for (_iterator13.s(); !(_step13 = _iterator13.n()).done;) {\n var file = _step13.value;\n file.xhr = xhr;\n }\n } catch (err) {\n _iterator13.e(err);\n } finally {\n _iterator13.f();\n }\n\n if (files[0].upload.chunked) {\n // Put the xhr object in the right chunk object, so it can be associated later, and found with _getChunk\n files[0].upload.chunks[dataBlocks[0].chunkIndex].xhr = xhr;\n }\n\n var method = this.resolveOption(this.options.method, files);\n var url = this.resolveOption(this.options.url, files);\n xhr.open(method, url, true); // Setting the timeout after open because of IE11 issue: https://gitlab.com/meno/dropzone/issues/8\n\n var timeout = this.resolveOption(this.options.timeout, files);\n if (timeout) xhr.timeout = this.resolveOption(this.options.timeout, files); // Has to be after `.open()`. See https://github.com/enyo/dropzone/issues/179\n\n xhr.withCredentials = !!this.options.withCredentials;\n\n xhr.onload = function (e) {\n _this15._finishedUploading(files, xhr, e);\n };\n\n xhr.ontimeout = function () {\n _this15._handleUploadError(files, xhr, \"Request timedout after \".concat(_this15.options.timeout / 1000, \" seconds\"));\n };\n\n xhr.onerror = function () {\n _this15._handleUploadError(files, xhr);\n }; // Some browsers do not have the .upload property\n\n\n var progressObj = xhr.upload != null ? xhr.upload : xhr;\n\n progressObj.onprogress = function (e) {\n return _this15._updateFilesUploadProgress(files, xhr, e);\n };\n\n var headers = {\n Accept: \"application/json\",\n \"Cache-Control\": \"no-cache\",\n \"X-Requested-With\": \"XMLHttpRequest\"\n };\n\n if (this.options.headers) {\n Dropzone.extend(headers, this.options.headers);\n }\n\n for (var headerName in headers) {\n var headerValue = headers[headerName];\n\n if (headerValue) {\n xhr.setRequestHeader(headerName, headerValue);\n }\n }\n\n var formData = new FormData(); // Adding all @options parameters\n\n if (this.options.params) {\n var additionalParams = this.options.params;\n\n if (typeof additionalParams === \"function\") {\n additionalParams = additionalParams.call(this, files, xhr, files[0].upload.chunked ? this._getChunk(files[0], xhr) : null);\n }\n\n for (var key in additionalParams) {\n var value = additionalParams[key];\n\n if (Array.isArray(value)) {\n // The additional parameter contains an array,\n // so lets iterate over it to attach each value\n // individually.\n for (var i = 0; i < value.length; i++) {\n formData.append(key, value[i]);\n }\n } else {\n formData.append(key, value);\n }\n }\n } // Let the user add additional data if necessary\n\n\n var _iterator14 = dropzone_createForOfIteratorHelper(files, true),\n _step14;\n\n try {\n for (_iterator14.s(); !(_step14 = _iterator14.n()).done;) {\n var _file = _step14.value;\n this.emit(\"sending\", _file, xhr, formData);\n }\n } catch (err) {\n _iterator14.e(err);\n } finally {\n _iterator14.f();\n }\n\n if (this.options.uploadMultiple) {\n this.emit(\"sendingmultiple\", files, xhr, formData);\n }\n\n this._addFormElementData(formData); // Finally add the files\n // Has to be last because some servers (eg: S3) expect the file to be the last parameter\n\n\n for (var _i3 = 0; _i3 < dataBlocks.length; _i3++) {\n var dataBlock = dataBlocks[_i3];\n formData.append(dataBlock.name, dataBlock.data, dataBlock.filename);\n }\n\n this.submitRequest(xhr, formData, files);\n } // Transforms all files with this.options.transformFile and invokes done with the transformed files when done.\n\n }, {\n key: \"_transformFiles\",\n value: function _transformFiles(files, done) {\n var _this16 = this;\n\n var transformedFiles = []; // Clumsy way of handling asynchronous calls, until I get to add a proper Future library.\n\n var doneCounter = 0;\n\n var _loop = function _loop(i) {\n _this16.options.transformFile.call(_this16, files[i], function (transformedFile) {\n transformedFiles[i] = transformedFile;\n\n if (++doneCounter === files.length) {\n done(transformedFiles);\n }\n });\n };\n\n for (var i = 0; i < files.length; i++) {\n _loop(i);\n }\n } // Takes care of adding other input elements of the form to the AJAX request\n\n }, {\n key: \"_addFormElementData\",\n value: function _addFormElementData(formData) {\n // Take care of other input elements\n if (this.element.tagName === \"FORM\") {\n var _iterator15 = dropzone_createForOfIteratorHelper(this.element.querySelectorAll(\"input, textarea, select, button\"), true),\n _step15;\n\n try {\n for (_iterator15.s(); !(_step15 = _iterator15.n()).done;) {\n var input = _step15.value;\n var inputName = input.getAttribute(\"name\");\n var inputType = input.getAttribute(\"type\");\n if (inputType) inputType = inputType.toLowerCase(); // If the input doesn't have a name, we can't use it.\n\n if (typeof inputName === \"undefined\" || inputName === null) continue;\n\n if (input.tagName === \"SELECT\" && input.hasAttribute(\"multiple\")) {\n // Possibly multiple values\n var _iterator16 = dropzone_createForOfIteratorHelper(input.options, true),\n _step16;\n\n try {\n for (_iterator16.s(); !(_step16 = _iterator16.n()).done;) {\n var option = _step16.value;\n\n if (option.selected) {\n formData.append(inputName, option.value);\n }\n }\n } catch (err) {\n _iterator16.e(err);\n } finally {\n _iterator16.f();\n }\n } else if (!inputType || inputType !== \"checkbox\" && inputType !== \"radio\" || input.checked) {\n formData.append(inputName, input.value);\n }\n }\n } catch (err) {\n _iterator15.e(err);\n } finally {\n _iterator15.f();\n }\n }\n } // Invoked when there is new progress information about given files.\n // If e is not provided, it is assumed that the upload is finished.\n\n }, {\n key: \"_updateFilesUploadProgress\",\n value: function _updateFilesUploadProgress(files, xhr, e) {\n if (!files[0].upload.chunked) {\n // Handle file uploads without chunking\n var _iterator17 = dropzone_createForOfIteratorHelper(files, true),\n _step17;\n\n try {\n for (_iterator17.s(); !(_step17 = _iterator17.n()).done;) {\n var file = _step17.value;\n\n if (file.upload.total && file.upload.bytesSent && file.upload.bytesSent == file.upload.total) {\n // If both, the `total` and `bytesSent` have already been set, and\n // they are equal (meaning progress is at 100%), we can skip this\n // file, since an upload progress shouldn't go down.\n continue;\n }\n\n if (e) {\n file.upload.progress = 100 * e.loaded / e.total;\n file.upload.total = e.total;\n file.upload.bytesSent = e.loaded;\n } else {\n // No event, so we're at 100%\n file.upload.progress = 100;\n file.upload.bytesSent = file.upload.total;\n }\n\n this.emit(\"uploadprogress\", file, file.upload.progress, file.upload.bytesSent);\n }\n } catch (err) {\n _iterator17.e(err);\n } finally {\n _iterator17.f();\n }\n } else {\n // Handle chunked file uploads\n // Chunked upload is not compatible with uploading multiple files in one\n // request, so we know there's only one file.\n var _file2 = files[0]; // Since this is a chunked upload, we need to update the appropriate chunk\n // progress.\n\n var chunk = this._getChunk(_file2, xhr);\n\n if (e) {\n chunk.progress = 100 * e.loaded / e.total;\n chunk.total = e.total;\n chunk.bytesSent = e.loaded;\n } else {\n // No event, so we're at 100%\n chunk.progress = 100;\n chunk.bytesSent = chunk.total;\n } // Now tally the *file* upload progress from its individual chunks\n\n\n _file2.upload.progress = 0;\n _file2.upload.total = 0;\n _file2.upload.bytesSent = 0;\n\n for (var i = 0; i < _file2.upload.totalChunkCount; i++) {\n if (_file2.upload.chunks[i] && typeof _file2.upload.chunks[i].progress !== \"undefined\") {\n _file2.upload.progress += _file2.upload.chunks[i].progress;\n _file2.upload.total += _file2.upload.chunks[i].total;\n _file2.upload.bytesSent += _file2.upload.chunks[i].bytesSent;\n }\n } // Since the process is a percentage, we need to divide by the amount of\n // chunks we've used.\n\n\n _file2.upload.progress = _file2.upload.progress / _file2.upload.totalChunkCount;\n this.emit(\"uploadprogress\", _file2, _file2.upload.progress, _file2.upload.bytesSent);\n }\n }\n }, {\n key: \"_finishedUploading\",\n value: function _finishedUploading(files, xhr, e) {\n var response;\n\n if (files[0].status === Dropzone.CANCELED) {\n return;\n }\n\n if (xhr.readyState !== 4) {\n return;\n }\n\n if (xhr.responseType !== \"arraybuffer\" && xhr.responseType !== \"blob\") {\n response = xhr.responseText;\n\n if (xhr.getResponseHeader(\"content-type\") && ~xhr.getResponseHeader(\"content-type\").indexOf(\"application/json\")) {\n try {\n response = JSON.parse(response);\n } catch (error) {\n e = error;\n response = \"Invalid JSON response from server.\";\n }\n }\n }\n\n this._updateFilesUploadProgress(files, xhr);\n\n if (!(200 <= xhr.status && xhr.status < 300)) {\n this._handleUploadError(files, xhr, response);\n } else {\n if (files[0].upload.chunked) {\n files[0].upload.finishedChunkUpload(this._getChunk(files[0], xhr), response);\n } else {\n this._finished(files, response, e);\n }\n }\n }\n }, {\n key: \"_handleUploadError\",\n value: function _handleUploadError(files, xhr, response) {\n if (files[0].status === Dropzone.CANCELED) {\n return;\n }\n\n if (files[0].upload.chunked && this.options.retryChunks) {\n var chunk = this._getChunk(files[0], xhr);\n\n if (chunk.retries++ < this.options.retryChunksLimit) {\n this._uploadData(files, [chunk.dataBlock]);\n\n return;\n } else {\n console.warn(\"Retried this chunk too often. Giving up.\");\n }\n }\n\n this._errorProcessing(files, response || this.options.dictResponseError.replace(\"{{statusCode}}\", xhr.status), xhr);\n }\n }, {\n key: \"submitRequest\",\n value: function submitRequest(xhr, formData, files) {\n if (xhr.readyState != 1) {\n console.warn(\"Cannot send this request because the XMLHttpRequest.readyState is not OPENED.\");\n return;\n }\n\n xhr.send(formData);\n } // Called internally when processing is finished.\n // Individual callbacks have to be called in the appropriate sections.\n\n }, {\n key: \"_finished\",\n value: function _finished(files, responseText, e) {\n var _iterator18 = dropzone_createForOfIteratorHelper(files, true),\n _step18;\n\n try {\n for (_iterator18.s(); !(_step18 = _iterator18.n()).done;) {\n var file = _step18.value;\n file.status = Dropzone.SUCCESS;\n this.emit(\"success\", file, responseText, e);\n this.emit(\"complete\", file);\n }\n } catch (err) {\n _iterator18.e(err);\n } finally {\n _iterator18.f();\n }\n\n if (this.options.uploadMultiple) {\n this.emit(\"successmultiple\", files, responseText, e);\n this.emit(\"completemultiple\", files);\n }\n\n if (this.options.autoProcessQueue) {\n return this.processQueue();\n }\n } // Called internally when processing is finished.\n // Individual callbacks have to be called in the appropriate sections.\n\n }, {\n key: \"_errorProcessing\",\n value: function _errorProcessing(files, message, xhr) {\n var _iterator19 = dropzone_createForOfIteratorHelper(files, true),\n _step19;\n\n try {\n for (_iterator19.s(); !(_step19 = _iterator19.n()).done;) {\n var file = _step19.value;\n file.status = Dropzone.ERROR;\n this.emit(\"error\", file, message, xhr);\n this.emit(\"complete\", file);\n }\n } catch (err) {\n _iterator19.e(err);\n } finally {\n _iterator19.f();\n }\n\n if (this.options.uploadMultiple) {\n this.emit(\"errormultiple\", files, message, xhr);\n this.emit(\"completemultiple\", files);\n }\n\n if (this.options.autoProcessQueue) {\n return this.processQueue();\n }\n }\n }], [{\n key: \"initClass\",\n value: function initClass() {\n // Exposing the emitter class, mainly for tests\n this.prototype.Emitter = Emitter;\n /*\n This is a list of all available events you can register on a dropzone object.\n You can register an event handler like this:\n dropzone.on(\"dragEnter\", function() { });\n */\n\n this.prototype.events = [\"drop\", \"dragstart\", \"dragend\", \"dragenter\", \"dragover\", \"dragleave\", \"addedfile\", \"addedfiles\", \"removedfile\", \"thumbnail\", \"error\", \"errormultiple\", \"processing\", \"processingmultiple\", \"uploadprogress\", \"totaluploadprogress\", \"sending\", \"sendingmultiple\", \"success\", \"successmultiple\", \"canceled\", \"canceledmultiple\", \"complete\", \"completemultiple\", \"reset\", \"maxfilesexceeded\", \"maxfilesreached\", \"queuecomplete\"];\n this.prototype._thumbnailQueue = [];\n this.prototype._processingThumbnail = false;\n } // global utility\n\n }, {\n key: \"extend\",\n value: function extend(target) {\n for (var _len2 = arguments.length, objects = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {\n objects[_key2 - 1] = arguments[_key2];\n }\n\n for (var _i4 = 0, _objects = objects; _i4 < _objects.length; _i4++) {\n var object = _objects[_i4];\n\n for (var key in object) {\n var val = object[key];\n target[key] = val;\n }\n }\n\n return target;\n }\n }, {\n key: \"uuidv4\",\n value: function uuidv4() {\n return \"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx\".replace(/[xy]/g, function (c) {\n var r = Math.random() * 16 | 0,\n v = c === \"x\" ? r : r & 0x3 | 0x8;\n return v.toString(16);\n });\n }\n }]);\n\n return Dropzone;\n}(Emitter);\n\n\nDropzone.initClass();\nDropzone.version = \"5.9.3\"; // This is a map of options for your different dropzones. Add configurations\n// to this object for your different dropzone elemens.\n//\n// Example:\n//\n// Dropzone.options.myDropzoneElementId = { maxFilesize: 1 };\n//\n// To disable autoDiscover for a specific element, you can set `false` as an option:\n//\n// Dropzone.options.myDisabledElementId = false;\n//\n// And in html:\n//\n// \n\nDropzone.options = {}; // Returns the options for an element or undefined if none available.\n\nDropzone.optionsForElement = function (element) {\n // Get the `Dropzone.options.elementId` for this element if it exists\n if (element.getAttribute(\"id\")) {\n return Dropzone.options[camelize(element.getAttribute(\"id\"))];\n } else {\n return undefined;\n }\n}; // Holds a list of all dropzone instances\n\n\nDropzone.instances = []; // Returns the dropzone for given element if any\n\nDropzone.forElement = function (element) {\n if (typeof element === \"string\") {\n element = document.querySelector(element);\n }\n\n if ((element != null ? element.dropzone : undefined) == null) {\n throw new Error(\"No Dropzone found for given element. This is probably because you're trying to access it before Dropzone had the time to initialize. Use the `init` option to setup any additional observers on your Dropzone.\");\n }\n\n return element.dropzone;\n}; // Set to false if you don't want Dropzone to automatically find and attach to .dropzone elements.\n\n\nDropzone.autoDiscover = true; // Looks for all .dropzone elements and creates a dropzone for them\n\nDropzone.discover = function () {\n var dropzones;\n\n if (document.querySelectorAll) {\n dropzones = document.querySelectorAll(\".dropzone\");\n } else {\n dropzones = []; // IE :(\n\n var checkElements = function checkElements(elements) {\n return function () {\n var result = [];\n\n var _iterator20 = dropzone_createForOfIteratorHelper(elements, true),\n _step20;\n\n try {\n for (_iterator20.s(); !(_step20 = _iterator20.n()).done;) {\n var el = _step20.value;\n\n if (/(^| )dropzone($| )/.test(el.className)) {\n result.push(dropzones.push(el));\n } else {\n result.push(undefined);\n }\n }\n } catch (err) {\n _iterator20.e(err);\n } finally {\n _iterator20.f();\n }\n\n return result;\n }();\n };\n\n checkElements(document.getElementsByTagName(\"div\"));\n checkElements(document.getElementsByTagName(\"form\"));\n }\n\n return function () {\n var result = [];\n\n var _iterator21 = dropzone_createForOfIteratorHelper(dropzones, true),\n _step21;\n\n try {\n for (_iterator21.s(); !(_step21 = _iterator21.n()).done;) {\n var dropzone = _step21.value;\n\n // Create a dropzone unless auto discover has been disabled for specific element\n if (Dropzone.optionsForElement(dropzone) !== false) {\n result.push(new Dropzone(dropzone));\n } else {\n result.push(undefined);\n }\n }\n } catch (err) {\n _iterator21.e(err);\n } finally {\n _iterator21.f();\n }\n\n return result;\n }();\n}; // Some browsers support drag and drog functionality, but not correctly.\n//\n// So I created a blocklist of userAgents. Yes, yes. Browser sniffing, I know.\n// But what to do when browsers *theoretically* support an API, but crash\n// when using it.\n//\n// This is a list of regular expressions tested against navigator.userAgent\n//\n// ** It should only be used on browser that *do* support the API, but\n// incorrectly **\n\n\nDropzone.blockedBrowsers = [// The mac os and windows phone version of opera 12 seems to have a problem with the File drag'n'drop API.\n/opera.*(Macintosh|Windows Phone).*version\\/12/i]; // Checks if the browser is supported\n\nDropzone.isBrowserSupported = function () {\n var capableBrowser = true;\n\n if (window.File && window.FileReader && window.FileList && window.Blob && window.FormData && document.querySelector) {\n if (!(\"classList\" in document.createElement(\"a\"))) {\n capableBrowser = false;\n } else {\n if (Dropzone.blacklistedBrowsers !== undefined) {\n // Since this has been renamed, this makes sure we don't break older\n // configuration.\n Dropzone.blockedBrowsers = Dropzone.blacklistedBrowsers;\n } // The browser supports the API, but may be blocked.\n\n\n var _iterator22 = dropzone_createForOfIteratorHelper(Dropzone.blockedBrowsers, true),\n _step22;\n\n try {\n for (_iterator22.s(); !(_step22 = _iterator22.n()).done;) {\n var regex = _step22.value;\n\n if (regex.test(navigator.userAgent)) {\n capableBrowser = false;\n continue;\n }\n }\n } catch (err) {\n _iterator22.e(err);\n } finally {\n _iterator22.f();\n }\n }\n } else {\n capableBrowser = false;\n }\n\n return capableBrowser;\n};\n\nDropzone.dataURItoBlob = function (dataURI) {\n // convert base64 to raw binary data held in a string\n // doesn't handle URLEncoded DataURIs - see SO answer #6850276 for code that does this\n var byteString = atob(dataURI.split(\",\")[1]); // separate out the mime component\n\n var mimeString = dataURI.split(\",\")[0].split(\":\")[1].split(\";\")[0]; // write the bytes of the string to an ArrayBuffer\n\n var ab = new ArrayBuffer(byteString.length);\n var ia = new Uint8Array(ab);\n\n for (var i = 0, end = byteString.length, asc = 0 <= end; asc ? i <= end : i >= end; asc ? i++ : i--) {\n ia[i] = byteString.charCodeAt(i);\n } // write the ArrayBuffer to a blob\n\n\n return new Blob([ab], {\n type: mimeString\n });\n}; // Returns an array without the rejected item\n\n\nvar without = function without(list, rejectedItem) {\n return list.filter(function (item) {\n return item !== rejectedItem;\n }).map(function (item) {\n return item;\n });\n}; // abc-def_ghi -> abcDefGhi\n\n\nvar camelize = function camelize(str) {\n return str.replace(/[\\-_](\\w)/g, function (match) {\n return match.charAt(1).toUpperCase();\n });\n}; // Creates an element from string\n\n\nDropzone.createElement = function (string) {\n var div = document.createElement(\"div\");\n div.innerHTML = string;\n return div.childNodes[0];\n}; // Tests if given element is inside (or simply is) the container\n\n\nDropzone.elementInside = function (element, container) {\n if (element === container) {\n return true;\n } // Coffeescript doesn't support do/while loops\n\n\n while (element = element.parentNode) {\n if (element === container) {\n return true;\n }\n }\n\n return false;\n};\n\nDropzone.getElement = function (el, name) {\n var element;\n\n if (typeof el === \"string\") {\n element = document.querySelector(el);\n } else if (el.nodeType != null) {\n element = el;\n }\n\n if (element == null) {\n throw new Error(\"Invalid `\".concat(name, \"` option provided. Please provide a CSS selector or a plain HTML element.\"));\n }\n\n return element;\n};\n\nDropzone.getElements = function (els, name) {\n var el, elements;\n\n if (els instanceof Array) {\n elements = [];\n\n try {\n var _iterator23 = dropzone_createForOfIteratorHelper(els, true),\n _step23;\n\n try {\n for (_iterator23.s(); !(_step23 = _iterator23.n()).done;) {\n el = _step23.value;\n elements.push(this.getElement(el, name));\n }\n } catch (err) {\n _iterator23.e(err);\n } finally {\n _iterator23.f();\n }\n } catch (e) {\n elements = null;\n }\n } else if (typeof els === \"string\") {\n elements = [];\n\n var _iterator24 = dropzone_createForOfIteratorHelper(document.querySelectorAll(els), true),\n _step24;\n\n try {\n for (_iterator24.s(); !(_step24 = _iterator24.n()).done;) {\n el = _step24.value;\n elements.push(el);\n }\n } catch (err) {\n _iterator24.e(err);\n } finally {\n _iterator24.f();\n }\n } else if (els.nodeType != null) {\n elements = [els];\n }\n\n if (elements == null || !elements.length) {\n throw new Error(\"Invalid `\".concat(name, \"` option provided. Please provide a CSS selector, a plain HTML element or a list of those.\"));\n }\n\n return elements;\n}; // Asks the user the question and calls accepted or rejected accordingly\n//\n// The default implementation just uses `window.confirm` and then calls the\n// appropriate callback.\n\n\nDropzone.confirm = function (question, accepted, rejected) {\n if (window.confirm(question)) {\n return accepted();\n } else if (rejected != null) {\n return rejected();\n }\n}; // Validates the mime type like this:\n//\n// https://developer.mozilla.org/en-US/docs/HTML/Element/input#attr-accept\n\n\nDropzone.isValidFile = function (file, acceptedFiles) {\n if (!acceptedFiles) {\n return true;\n } // If there are no accepted mime types, it's OK\n\n\n acceptedFiles = acceptedFiles.split(\",\");\n var mimeType = file.type;\n var baseMimeType = mimeType.replace(/\\/.*$/, \"\");\n\n var _iterator25 = dropzone_createForOfIteratorHelper(acceptedFiles, true),\n _step25;\n\n try {\n for (_iterator25.s(); !(_step25 = _iterator25.n()).done;) {\n var validType = _step25.value;\n validType = validType.trim();\n\n if (validType.charAt(0) === \".\") {\n if (file.name.toLowerCase().indexOf(validType.toLowerCase(), file.name.length - validType.length) !== -1) {\n return true;\n }\n } else if (/\\/\\*$/.test(validType)) {\n // This is something like a image/* mime type\n if (baseMimeType === validType.replace(/\\/.*$/, \"\")) {\n return true;\n }\n } else {\n if (mimeType === validType) {\n return true;\n }\n }\n }\n } catch (err) {\n _iterator25.e(err);\n } finally {\n _iterator25.f();\n }\n\n return false;\n}; // Augment jQuery\n\n\nif (typeof jQuery !== \"undefined\" && jQuery !== null) {\n jQuery.fn.dropzone = function (options) {\n return this.each(function () {\n return new Dropzone(this, options);\n });\n };\n} // Dropzone file status codes\n\n\nDropzone.ADDED = \"added\";\nDropzone.QUEUED = \"queued\"; // For backwards compatibility. Now, if a file is accepted, it's either queued\n// or uploading.\n\nDropzone.ACCEPTED = Dropzone.QUEUED;\nDropzone.UPLOADING = \"uploading\";\nDropzone.PROCESSING = Dropzone.UPLOADING; // alias\n\nDropzone.CANCELED = \"canceled\";\nDropzone.ERROR = \"error\";\nDropzone.SUCCESS = \"success\";\n/*\n\n Bugfix for iOS 6 and 7\n Source: http://stackoverflow.com/questions/11929099/html5-canvas-drawimage-ratio-bug-ios\n based on the work of https://github.com/stomita/ios-imagefile-megapixel\n\n */\n// Detecting vertical squash in loaded image.\n// Fixes a bug which squash image vertically while drawing into canvas for some images.\n// This is a bug in iOS6 devices. This function from https://github.com/stomita/ios-imagefile-megapixel\n\nvar detectVerticalSquash = function detectVerticalSquash(img) {\n var iw = img.naturalWidth;\n var ih = img.naturalHeight;\n var canvas = document.createElement(\"canvas\");\n canvas.width = 1;\n canvas.height = ih;\n var ctx = canvas.getContext(\"2d\");\n ctx.drawImage(img, 0, 0);\n\n var _ctx$getImageData = ctx.getImageData(1, 0, 1, ih),\n data = _ctx$getImageData.data; // search image edge pixel position in case it is squashed vertically.\n\n\n var sy = 0;\n var ey = ih;\n var py = ih;\n\n while (py > sy) {\n var alpha = data[(py - 1) * 4 + 3];\n\n if (alpha === 0) {\n ey = py;\n } else {\n sy = py;\n }\n\n py = ey + sy >> 1;\n }\n\n var ratio = py / ih;\n\n if (ratio === 0) {\n return 1;\n } else {\n return ratio;\n }\n}; // A replacement for context.drawImage\n// (args are for source and destination).\n\n\nvar drawImageIOSFix = function drawImageIOSFix(ctx, img, sx, sy, sw, sh, dx, dy, dw, dh) {\n var vertSquashRatio = detectVerticalSquash(img);\n return ctx.drawImage(img, sx, sy, sw, sh, dx, dy, dw, dh / vertSquashRatio);\n}; // Based on MinifyJpeg\n// Source: http://www.perry.cz/files/ExifRestorer.js\n// http://elicon.blog57.fc2.com/blog-entry-206.html\n\n\nvar ExifRestore = /*#__PURE__*/function () {\n function ExifRestore() {\n dropzone_classCallCheck(this, ExifRestore);\n }\n\n dropzone_createClass(ExifRestore, null, [{\n key: \"initClass\",\n value: function initClass() {\n this.KEY_STR = \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=\";\n }\n }, {\n key: \"encode64\",\n value: function encode64(input) {\n var output = \"\";\n var chr1 = undefined;\n var chr2 = undefined;\n var chr3 = \"\";\n var enc1 = undefined;\n var enc2 = undefined;\n var enc3 = undefined;\n var enc4 = \"\";\n var i = 0;\n\n while (true) {\n chr1 = input[i++];\n chr2 = input[i++];\n chr3 = input[i++];\n enc1 = chr1 >> 2;\n enc2 = (chr1 & 3) << 4 | chr2 >> 4;\n enc3 = (chr2 & 15) << 2 | chr3 >> 6;\n enc4 = chr3 & 63;\n\n if (isNaN(chr2)) {\n enc3 = enc4 = 64;\n } else if (isNaN(chr3)) {\n enc4 = 64;\n }\n\n output = output + this.KEY_STR.charAt(enc1) + this.KEY_STR.charAt(enc2) + this.KEY_STR.charAt(enc3) + this.KEY_STR.charAt(enc4);\n chr1 = chr2 = chr3 = \"\";\n enc1 = enc2 = enc3 = enc4 = \"\";\n\n if (!(i < input.length)) {\n break;\n }\n }\n\n return output;\n }\n }, {\n key: \"restore\",\n value: function restore(origFileBase64, resizedFileBase64) {\n if (!origFileBase64.match(\"data:image/jpeg;base64,\")) {\n return resizedFileBase64;\n }\n\n var rawImage = this.decode64(origFileBase64.replace(\"data:image/jpeg;base64,\", \"\"));\n var segments = this.slice2Segments(rawImage);\n var image = this.exifManipulation(resizedFileBase64, segments);\n return \"data:image/jpeg;base64,\".concat(this.encode64(image));\n }\n }, {\n key: \"exifManipulation\",\n value: function exifManipulation(resizedFileBase64, segments) {\n var exifArray = this.getExifArray(segments);\n var newImageArray = this.insertExif(resizedFileBase64, exifArray);\n var aBuffer = new Uint8Array(newImageArray);\n return aBuffer;\n }\n }, {\n key: \"getExifArray\",\n value: function getExifArray(segments) {\n var seg = undefined;\n var x = 0;\n\n while (x < segments.length) {\n seg = segments[x];\n\n if (seg[0] === 255 & seg[1] === 225) {\n return seg;\n }\n\n x++;\n }\n\n return [];\n }\n }, {\n key: \"insertExif\",\n value: function insertExif(resizedFileBase64, exifArray) {\n var imageData = resizedFileBase64.replace(\"data:image/jpeg;base64,\", \"\");\n var buf = this.decode64(imageData);\n var separatePoint = buf.indexOf(255, 3);\n var mae = buf.slice(0, separatePoint);\n var ato = buf.slice(separatePoint);\n var array = mae;\n array = array.concat(exifArray);\n array = array.concat(ato);\n return array;\n }\n }, {\n key: \"slice2Segments\",\n value: function slice2Segments(rawImageArray) {\n var head = 0;\n var segments = [];\n\n while (true) {\n var length;\n\n if (rawImageArray[head] === 255 & rawImageArray[head + 1] === 218) {\n break;\n }\n\n if (rawImageArray[head] === 255 & rawImageArray[head + 1] === 216) {\n head += 2;\n } else {\n length = rawImageArray[head + 2] * 256 + rawImageArray[head + 3];\n var endPoint = head + length + 2;\n var seg = rawImageArray.slice(head, endPoint);\n segments.push(seg);\n head = endPoint;\n }\n\n if (head > rawImageArray.length) {\n break;\n }\n }\n\n return segments;\n }\n }, {\n key: \"decode64\",\n value: function decode64(input) {\n var output = \"\";\n var chr1 = undefined;\n var chr2 = undefined;\n var chr3 = \"\";\n var enc1 = undefined;\n var enc2 = undefined;\n var enc3 = undefined;\n var enc4 = \"\";\n var i = 0;\n var buf = []; // remove all characters that are not A-Z, a-z, 0-9, +, /, or =\n\n var base64test = /[^A-Za-z0-9\\+\\/\\=]/g;\n\n if (base64test.exec(input)) {\n console.warn(\"There were invalid base64 characters in the input text.\\nValid base64 characters are A-Z, a-z, 0-9, '+', '/',and '='\\nExpect errors in decoding.\");\n }\n\n input = input.replace(/[^A-Za-z0-9\\+\\/\\=]/g, \"\");\n\n while (true) {\n enc1 = this.KEY_STR.indexOf(input.charAt(i++));\n enc2 = this.KEY_STR.indexOf(input.charAt(i++));\n enc3 = this.KEY_STR.indexOf(input.charAt(i++));\n enc4 = this.KEY_STR.indexOf(input.charAt(i++));\n chr1 = enc1 << 2 | enc2 >> 4;\n chr2 = (enc2 & 15) << 4 | enc3 >> 2;\n chr3 = (enc3 & 3) << 6 | enc4;\n buf.push(chr1);\n\n if (enc3 !== 64) {\n buf.push(chr2);\n }\n\n if (enc4 !== 64) {\n buf.push(chr3);\n }\n\n chr1 = chr2 = chr3 = \"\";\n enc1 = enc2 = enc3 = enc4 = \"\";\n\n if (!(i < input.length)) {\n break;\n }\n }\n\n return buf;\n }\n }]);\n\n return ExifRestore;\n}();\n\nExifRestore.initClass();\n/*\n * contentloaded.js\n *\n * Author: Diego Perini (diego.perini at gmail.com)\n * Summary: cross-browser wrapper for DOMContentLoaded\n * Updated: 20101020\n * License: MIT\n * Version: 1.2\n *\n * URL:\n * http://javascript.nwbox.com/ContentLoaded/\n * http://javascript.nwbox.com/ContentLoaded/MIT-LICENSE\n */\n// @win window reference\n// @fn function reference\n\nvar contentLoaded = function contentLoaded(win, fn) {\n var done = false;\n var top = true;\n var doc = win.document;\n var root = doc.documentElement;\n var add = doc.addEventListener ? \"addEventListener\" : \"attachEvent\";\n var rem = doc.addEventListener ? \"removeEventListener\" : \"detachEvent\";\n var pre = doc.addEventListener ? \"\" : \"on\";\n\n var init = function init(e) {\n if (e.type === \"readystatechange\" && doc.readyState !== \"complete\") {\n return;\n }\n\n (e.type === \"load\" ? win : doc)[rem](pre + e.type, init, false);\n\n if (!done && (done = true)) {\n return fn.call(win, e.type || e);\n }\n };\n\n var poll = function poll() {\n try {\n root.doScroll(\"left\");\n } catch (e) {\n setTimeout(poll, 50);\n return;\n }\n\n return init(\"poll\");\n };\n\n if (doc.readyState !== \"complete\") {\n if (doc.createEventObject && root.doScroll) {\n try {\n top = !win.frameElement;\n } catch (error) {}\n\n if (top) {\n poll();\n }\n }\n\n doc[add](pre + \"DOMContentLoaded\", init, false);\n doc[add](pre + \"readystatechange\", init, false);\n return win[add](pre + \"load\", init, false);\n }\n}; // As a single function to be able to write tests.\n\n\nDropzone._autoDiscoverFunction = function () {\n if (Dropzone.autoDiscover) {\n return Dropzone.discover();\n }\n};\n\ncontentLoaded(window, Dropzone._autoDiscoverFunction);\n\nfunction __guard__(value, transform) {\n return typeof value !== \"undefined\" && value !== null ? transform(value) : undefined;\n}\n\nfunction __guardMethod__(obj, methodName, transform) {\n if (typeof obj !== \"undefined\" && obj !== null && typeof obj[methodName] === \"function\") {\n return transform(obj, methodName);\n } else {\n return undefined;\n }\n}\n\n\n;// CONCATENATED MODULE: ./tool/dropzone.dist.js\n /// Make Dropzone a global variable.\n\nwindow.Dropzone = Dropzone;\n/* harmony default export */ var dropzone_dist = (Dropzone);\n\n}();\n/******/ \treturn __webpack_exports__;\n/******/ })()\n;\n});", "(function(global, factory) {\n typeof exports === \"object\" && typeof module !== \"undefined\" ? factory(exports) : typeof define === \"function\" && define.amd ? define([ \"exports\" ], factory) : (global = typeof globalThis !== \"undefined\" ? globalThis : global || self, \n factory(global.ActiveStorage = {}));\n})(this, (function(exports) {\n \"use strict\";\n var sparkMd5 = {\n exports: {}\n };\n (function(module, exports) {\n (function(factory) {\n {\n module.exports = factory();\n }\n })((function(undefined$1) {\n var hex_chr = [ \"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\", \"a\", \"b\", \"c\", \"d\", \"e\", \"f\" ];\n function md5cycle(x, k) {\n var a = x[0], b = x[1], c = x[2], d = x[3];\n a += (b & c | ~b & d) + k[0] - 680876936 | 0;\n a = (a << 7 | a >>> 25) + b | 0;\n d += (a & b | ~a & c) + k[1] - 389564586 | 0;\n d = (d << 12 | d >>> 20) + a | 0;\n c += (d & a | ~d & b) + k[2] + 606105819 | 0;\n c = (c << 17 | c >>> 15) + d | 0;\n b += (c & d | ~c & a) + k[3] - 1044525330 | 0;\n b = (b << 22 | b >>> 10) + c | 0;\n a += (b & c | ~b & d) + k[4] - 176418897 | 0;\n a = (a << 7 | a >>> 25) + b | 0;\n d += (a & b | ~a & c) + k[5] + 1200080426 | 0;\n d = (d << 12 | d >>> 20) + a | 0;\n c += (d & a | ~d & b) + k[6] - 1473231341 | 0;\n c = (c << 17 | c >>> 15) + d | 0;\n b += (c & d | ~c & a) + k[7] - 45705983 | 0;\n b = (b << 22 | b >>> 10) + c | 0;\n a += (b & c | ~b & d) + k[8] + 1770035416 | 0;\n a = (a << 7 | a >>> 25) + b | 0;\n d += (a & b | ~a & c) + k[9] - 1958414417 | 0;\n d = (d << 12 | d >>> 20) + a | 0;\n c += (d & a | ~d & b) + k[10] - 42063 | 0;\n c = (c << 17 | c >>> 15) + d | 0;\n b += (c & d | ~c & a) + k[11] - 1990404162 | 0;\n b = (b << 22 | b >>> 10) + c | 0;\n a += (b & c | ~b & d) + k[12] + 1804603682 | 0;\n a = (a << 7 | a >>> 25) + b | 0;\n d += (a & b | ~a & c) + k[13] - 40341101 | 0;\n d = (d << 12 | d >>> 20) + a | 0;\n c += (d & a | ~d & b) + k[14] - 1502002290 | 0;\n c = (c << 17 | c >>> 15) + d | 0;\n b += (c & d | ~c & a) + k[15] + 1236535329 | 0;\n b = (b << 22 | b >>> 10) + c | 0;\n a += (b & d | c & ~d) + k[1] - 165796510 | 0;\n a = (a << 5 | a >>> 27) + b | 0;\n d += (a & c | b & ~c) + k[6] - 1069501632 | 0;\n d = (d << 9 | d >>> 23) + a | 0;\n c += (d & b | a & ~b) + k[11] + 643717713 | 0;\n c = (c << 14 | c >>> 18) + d | 0;\n b += (c & a | d & ~a) + k[0] - 373897302 | 0;\n b = (b << 20 | b >>> 12) + c | 0;\n a += (b & d | c & ~d) + k[5] - 701558691 | 0;\n a = (a << 5 | a >>> 27) + b | 0;\n d += (a & c | b & ~c) + k[10] + 38016083 | 0;\n d = (d << 9 | d >>> 23) + a | 0;\n c += (d & b | a & ~b) + k[15] - 660478335 | 0;\n c = (c << 14 | c >>> 18) + d | 0;\n b += (c & a | d & ~a) + k[4] - 405537848 | 0;\n b = (b << 20 | b >>> 12) + c | 0;\n a += (b & d | c & ~d) + k[9] + 568446438 | 0;\n a = (a << 5 | a >>> 27) + b | 0;\n d += (a & c | b & ~c) + k[14] - 1019803690 | 0;\n d = (d << 9 | d >>> 23) + a | 0;\n c += (d & b | a & ~b) + k[3] - 187363961 | 0;\n c = (c << 14 | c >>> 18) + d | 0;\n b += (c & a | d & ~a) + k[8] + 1163531501 | 0;\n b = (b << 20 | b >>> 12) + c | 0;\n a += (b & d | c & ~d) + k[13] - 1444681467 | 0;\n a = (a << 5 | a >>> 27) + b | 0;\n d += (a & c | b & ~c) + k[2] - 51403784 | 0;\n d = (d << 9 | d >>> 23) + a | 0;\n c += (d & b | a & ~b) + k[7] + 1735328473 | 0;\n c = (c << 14 | c >>> 18) + d | 0;\n b += (c & a | d & ~a) + k[12] - 1926607734 | 0;\n b = (b << 20 | b >>> 12) + c | 0;\n a += (b ^ c ^ d) + k[5] - 378558 | 0;\n a = (a << 4 | a >>> 28) + b | 0;\n d += (a ^ b ^ c) + k[8] - 2022574463 | 0;\n d = (d << 11 | d >>> 21) + a | 0;\n c += (d ^ a ^ b) + k[11] + 1839030562 | 0;\n c = (c << 16 | c >>> 16) + d | 0;\n b += (c ^ d ^ a) + k[14] - 35309556 | 0;\n b = (b << 23 | b >>> 9) + c | 0;\n a += (b ^ c ^ d) + k[1] - 1530992060 | 0;\n a = (a << 4 | a >>> 28) + b | 0;\n d += (a ^ b ^ c) + k[4] + 1272893353 | 0;\n d = (d << 11 | d >>> 21) + a | 0;\n c += (d ^ a ^ b) + k[7] - 155497632 | 0;\n c = (c << 16 | c >>> 16) + d | 0;\n b += (c ^ d ^ a) + k[10] - 1094730640 | 0;\n b = (b << 23 | b >>> 9) + c | 0;\n a += (b ^ c ^ d) + k[13] + 681279174 | 0;\n a = (a << 4 | a >>> 28) + b | 0;\n d += (a ^ b ^ c) + k[0] - 358537222 | 0;\n d = (d << 11 | d >>> 21) + a | 0;\n c += (d ^ a ^ b) + k[3] - 722521979 | 0;\n c = (c << 16 | c >>> 16) + d | 0;\n b += (c ^ d ^ a) + k[6] + 76029189 | 0;\n b = (b << 23 | b >>> 9) + c | 0;\n a += (b ^ c ^ d) + k[9] - 640364487 | 0;\n a = (a << 4 | a >>> 28) + b | 0;\n d += (a ^ b ^ c) + k[12] - 421815835 | 0;\n d = (d << 11 | d >>> 21) + a | 0;\n c += (d ^ a ^ b) + k[15] + 530742520 | 0;\n c = (c << 16 | c >>> 16) + d | 0;\n b += (c ^ d ^ a) + k[2] - 995338651 | 0;\n b = (b << 23 | b >>> 9) + c | 0;\n a += (c ^ (b | ~d)) + k[0] - 198630844 | 0;\n a = (a << 6 | a >>> 26) + b | 0;\n d += (b ^ (a | ~c)) + k[7] + 1126891415 | 0;\n d = (d << 10 | d >>> 22) + a | 0;\n c += (a ^ (d | ~b)) + k[14] - 1416354905 | 0;\n c = (c << 15 | c >>> 17) + d | 0;\n b += (d ^ (c | ~a)) + k[5] - 57434055 | 0;\n b = (b << 21 | b >>> 11) + c | 0;\n a += (c ^ (b | ~d)) + k[12] + 1700485571 | 0;\n a = (a << 6 | a >>> 26) + b | 0;\n d += (b ^ (a | ~c)) + k[3] - 1894986606 | 0;\n d = (d << 10 | d >>> 22) + a | 0;\n c += (a ^ (d | ~b)) + k[10] - 1051523 | 0;\n c = (c << 15 | c >>> 17) + d | 0;\n b += (d ^ (c | ~a)) + k[1] - 2054922799 | 0;\n b = (b << 21 | b >>> 11) + c | 0;\n a += (c ^ (b | ~d)) + k[8] + 1873313359 | 0;\n a = (a << 6 | a >>> 26) + b | 0;\n d += (b ^ (a | ~c)) + k[15] - 30611744 | 0;\n d = (d << 10 | d >>> 22) + a | 0;\n c += (a ^ (d | ~b)) + k[6] - 1560198380 | 0;\n c = (c << 15 | c >>> 17) + d | 0;\n b += (d ^ (c | ~a)) + k[13] + 1309151649 | 0;\n b = (b << 21 | b >>> 11) + c | 0;\n a += (c ^ (b | ~d)) + k[4] - 145523070 | 0;\n a = (a << 6 | a >>> 26) + b | 0;\n d += (b ^ (a | ~c)) + k[11] - 1120210379 | 0;\n d = (d << 10 | d >>> 22) + a | 0;\n c += (a ^ (d | ~b)) + k[2] + 718787259 | 0;\n c = (c << 15 | c >>> 17) + d | 0;\n b += (d ^ (c | ~a)) + k[9] - 343485551 | 0;\n b = (b << 21 | b >>> 11) + c | 0;\n x[0] = a + x[0] | 0;\n x[1] = b + x[1] | 0;\n x[2] = c + x[2] | 0;\n x[3] = d + x[3] | 0;\n }\n function md5blk(s) {\n var md5blks = [], i;\n for (i = 0; i < 64; i += 4) {\n md5blks[i >> 2] = s.charCodeAt(i) + (s.charCodeAt(i + 1) << 8) + (s.charCodeAt(i + 2) << 16) + (s.charCodeAt(i + 3) << 24);\n }\n return md5blks;\n }\n function md5blk_array(a) {\n var md5blks = [], i;\n for (i = 0; i < 64; i += 4) {\n md5blks[i >> 2] = a[i] + (a[i + 1] << 8) + (a[i + 2] << 16) + (a[i + 3] << 24);\n }\n return md5blks;\n }\n function md51(s) {\n var n = s.length, state = [ 1732584193, -271733879, -1732584194, 271733878 ], i, length, tail, tmp, lo, hi;\n for (i = 64; i <= n; i += 64) {\n md5cycle(state, md5blk(s.substring(i - 64, i)));\n }\n s = s.substring(i - 64);\n length = s.length;\n tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];\n for (i = 0; i < length; i += 1) {\n tail[i >> 2] |= s.charCodeAt(i) << (i % 4 << 3);\n }\n tail[i >> 2] |= 128 << (i % 4 << 3);\n if (i > 55) {\n md5cycle(state, tail);\n for (i = 0; i < 16; i += 1) {\n tail[i] = 0;\n }\n }\n tmp = n * 8;\n tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);\n lo = parseInt(tmp[2], 16);\n hi = parseInt(tmp[1], 16) || 0;\n tail[14] = lo;\n tail[15] = hi;\n md5cycle(state, tail);\n return state;\n }\n function md51_array(a) {\n var n = a.length, state = [ 1732584193, -271733879, -1732584194, 271733878 ], i, length, tail, tmp, lo, hi;\n for (i = 64; i <= n; i += 64) {\n md5cycle(state, md5blk_array(a.subarray(i - 64, i)));\n }\n a = i - 64 < n ? a.subarray(i - 64) : new Uint8Array(0);\n length = a.length;\n tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];\n for (i = 0; i < length; i += 1) {\n tail[i >> 2] |= a[i] << (i % 4 << 3);\n }\n tail[i >> 2] |= 128 << (i % 4 << 3);\n if (i > 55) {\n md5cycle(state, tail);\n for (i = 0; i < 16; i += 1) {\n tail[i] = 0;\n }\n }\n tmp = n * 8;\n tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);\n lo = parseInt(tmp[2], 16);\n hi = parseInt(tmp[1], 16) || 0;\n tail[14] = lo;\n tail[15] = hi;\n md5cycle(state, tail);\n return state;\n }\n function rhex(n) {\n var s = \"\", j;\n for (j = 0; j < 4; j += 1) {\n s += hex_chr[n >> j * 8 + 4 & 15] + hex_chr[n >> j * 8 & 15];\n }\n return s;\n }\n function hex(x) {\n var i;\n for (i = 0; i < x.length; i += 1) {\n x[i] = rhex(x[i]);\n }\n return x.join(\"\");\n }\n if (hex(md51(\"hello\")) !== \"5d41402abc4b2a76b9719d911017c592\") ;\n if (typeof ArrayBuffer !== \"undefined\" && !ArrayBuffer.prototype.slice) {\n (function() {\n function clamp(val, length) {\n val = val | 0 || 0;\n if (val < 0) {\n return Math.max(val + length, 0);\n }\n return Math.min(val, length);\n }\n ArrayBuffer.prototype.slice = function(from, to) {\n var length = this.byteLength, begin = clamp(from, length), end = length, num, target, targetArray, sourceArray;\n if (to !== undefined$1) {\n end = clamp(to, length);\n }\n if (begin > end) {\n return new ArrayBuffer(0);\n }\n num = end - begin;\n target = new ArrayBuffer(num);\n targetArray = new Uint8Array(target);\n sourceArray = new Uint8Array(this, begin, num);\n targetArray.set(sourceArray);\n return target;\n };\n })();\n }\n function toUtf8(str) {\n if (/[\\u0080-\\uFFFF]/.test(str)) {\n str = unescape(encodeURIComponent(str));\n }\n return str;\n }\n function utf8Str2ArrayBuffer(str, returnUInt8Array) {\n var length = str.length, buff = new ArrayBuffer(length), arr = new Uint8Array(buff), i;\n for (i = 0; i < length; i += 1) {\n arr[i] = str.charCodeAt(i);\n }\n return returnUInt8Array ? arr : buff;\n }\n function arrayBuffer2Utf8Str(buff) {\n return String.fromCharCode.apply(null, new Uint8Array(buff));\n }\n function concatenateArrayBuffers(first, second, returnUInt8Array) {\n var result = new Uint8Array(first.byteLength + second.byteLength);\n result.set(new Uint8Array(first));\n result.set(new Uint8Array(second), first.byteLength);\n return returnUInt8Array ? result : result.buffer;\n }\n function hexToBinaryString(hex) {\n var bytes = [], length = hex.length, x;\n for (x = 0; x < length - 1; x += 2) {\n bytes.push(parseInt(hex.substr(x, 2), 16));\n }\n return String.fromCharCode.apply(String, bytes);\n }\n function SparkMD5() {\n this.reset();\n }\n SparkMD5.prototype.append = function(str) {\n this.appendBinary(toUtf8(str));\n return this;\n };\n SparkMD5.prototype.appendBinary = function(contents) {\n this._buff += contents;\n this._length += contents.length;\n var length = this._buff.length, i;\n for (i = 64; i <= length; i += 64) {\n md5cycle(this._hash, md5blk(this._buff.substring(i - 64, i)));\n }\n this._buff = this._buff.substring(i - 64);\n return this;\n };\n SparkMD5.prototype.end = function(raw) {\n var buff = this._buff, length = buff.length, i, tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], ret;\n for (i = 0; i < length; i += 1) {\n tail[i >> 2] |= buff.charCodeAt(i) << (i % 4 << 3);\n }\n this._finish(tail, length);\n ret = hex(this._hash);\n if (raw) {\n ret = hexToBinaryString(ret);\n }\n this.reset();\n return ret;\n };\n SparkMD5.prototype.reset = function() {\n this._buff = \"\";\n this._length = 0;\n this._hash = [ 1732584193, -271733879, -1732584194, 271733878 ];\n return this;\n };\n SparkMD5.prototype.getState = function() {\n return {\n buff: this._buff,\n length: this._length,\n hash: this._hash.slice()\n };\n };\n SparkMD5.prototype.setState = function(state) {\n this._buff = state.buff;\n this._length = state.length;\n this._hash = state.hash;\n return this;\n };\n SparkMD5.prototype.destroy = function() {\n delete this._hash;\n delete this._buff;\n delete this._length;\n };\n SparkMD5.prototype._finish = function(tail, length) {\n var i = length, tmp, lo, hi;\n tail[i >> 2] |= 128 << (i % 4 << 3);\n if (i > 55) {\n md5cycle(this._hash, tail);\n for (i = 0; i < 16; i += 1) {\n tail[i] = 0;\n }\n }\n tmp = this._length * 8;\n tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);\n lo = parseInt(tmp[2], 16);\n hi = parseInt(tmp[1], 16) || 0;\n tail[14] = lo;\n tail[15] = hi;\n md5cycle(this._hash, tail);\n };\n SparkMD5.hash = function(str, raw) {\n return SparkMD5.hashBinary(toUtf8(str), raw);\n };\n SparkMD5.hashBinary = function(content, raw) {\n var hash = md51(content), ret = hex(hash);\n return raw ? hexToBinaryString(ret) : ret;\n };\n SparkMD5.ArrayBuffer = function() {\n this.reset();\n };\n SparkMD5.ArrayBuffer.prototype.append = function(arr) {\n var buff = concatenateArrayBuffers(this._buff.buffer, arr, true), length = buff.length, i;\n this._length += arr.byteLength;\n for (i = 64; i <= length; i += 64) {\n md5cycle(this._hash, md5blk_array(buff.subarray(i - 64, i)));\n }\n this._buff = i - 64 < length ? new Uint8Array(buff.buffer.slice(i - 64)) : new Uint8Array(0);\n return this;\n };\n SparkMD5.ArrayBuffer.prototype.end = function(raw) {\n var buff = this._buff, length = buff.length, tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], i, ret;\n for (i = 0; i < length; i += 1) {\n tail[i >> 2] |= buff[i] << (i % 4 << 3);\n }\n this._finish(tail, length);\n ret = hex(this._hash);\n if (raw) {\n ret = hexToBinaryString(ret);\n }\n this.reset();\n return ret;\n };\n SparkMD5.ArrayBuffer.prototype.reset = function() {\n this._buff = new Uint8Array(0);\n this._length = 0;\n this._hash = [ 1732584193, -271733879, -1732584194, 271733878 ];\n return this;\n };\n SparkMD5.ArrayBuffer.prototype.getState = function() {\n var state = SparkMD5.prototype.getState.call(this);\n state.buff = arrayBuffer2Utf8Str(state.buff);\n return state;\n };\n SparkMD5.ArrayBuffer.prototype.setState = function(state) {\n state.buff = utf8Str2ArrayBuffer(state.buff, true);\n return SparkMD5.prototype.setState.call(this, state);\n };\n SparkMD5.ArrayBuffer.prototype.destroy = SparkMD5.prototype.destroy;\n SparkMD5.ArrayBuffer.prototype._finish = SparkMD5.prototype._finish;\n SparkMD5.ArrayBuffer.hash = function(arr, raw) {\n var hash = md51_array(new Uint8Array(arr)), ret = hex(hash);\n return raw ? hexToBinaryString(ret) : ret;\n };\n return SparkMD5;\n }));\n })(sparkMd5);\n var SparkMD5 = sparkMd5.exports;\n const fileSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice;\n class FileChecksum {\n static create(file, callback) {\n const instance = new FileChecksum(file);\n instance.create(callback);\n }\n constructor(file) {\n this.file = file;\n this.chunkSize = 2097152;\n this.chunkCount = Math.ceil(this.file.size / this.chunkSize);\n this.chunkIndex = 0;\n }\n create(callback) {\n this.callback = callback;\n this.md5Buffer = new SparkMD5.ArrayBuffer;\n this.fileReader = new FileReader;\n this.fileReader.addEventListener(\"load\", (event => this.fileReaderDidLoad(event)));\n this.fileReader.addEventListener(\"error\", (event => this.fileReaderDidError(event)));\n this.readNextChunk();\n }\n fileReaderDidLoad(event) {\n this.md5Buffer.append(event.target.result);\n if (!this.readNextChunk()) {\n const binaryDigest = this.md5Buffer.end(true);\n const base64digest = btoa(binaryDigest);\n this.callback(null, base64digest);\n }\n }\n fileReaderDidError(event) {\n this.callback(`Error reading ${this.file.name}`);\n }\n readNextChunk() {\n if (this.chunkIndex < this.chunkCount || this.chunkIndex == 0 && this.chunkCount == 0) {\n const start = this.chunkIndex * this.chunkSize;\n const end = Math.min(start + this.chunkSize, this.file.size);\n const bytes = fileSlice.call(this.file, start, end);\n this.fileReader.readAsArrayBuffer(bytes);\n this.chunkIndex++;\n return true;\n } else {\n return false;\n }\n }\n }\n function getMetaValue(name) {\n const element = findElement(document.head, `meta[name=\"${name}\"]`);\n if (element) {\n return element.getAttribute(\"content\");\n }\n }\n function findElements(root, selector) {\n if (typeof root == \"string\") {\n selector = root;\n root = document;\n }\n const elements = root.querySelectorAll(selector);\n return toArray(elements);\n }\n function findElement(root, selector) {\n if (typeof root == \"string\") {\n selector = root;\n root = document;\n }\n return root.querySelector(selector);\n }\n function dispatchEvent(element, type, eventInit = {}) {\n const {disabled: disabled} = element;\n const {bubbles: bubbles, cancelable: cancelable, detail: detail} = eventInit;\n const event = document.createEvent(\"Event\");\n event.initEvent(type, bubbles || true, cancelable || true);\n event.detail = detail || {};\n try {\n element.disabled = false;\n element.dispatchEvent(event);\n } finally {\n element.disabled = disabled;\n }\n return event;\n }\n function toArray(value) {\n if (Array.isArray(value)) {\n return value;\n } else if (Array.from) {\n return Array.from(value);\n } else {\n return [].slice.call(value);\n }\n }\n class BlobRecord {\n constructor(file, checksum, url, customHeaders = {}) {\n this.file = file;\n this.attributes = {\n filename: file.name,\n content_type: file.type || \"application/octet-stream\",\n byte_size: file.size,\n checksum: checksum\n };\n this.xhr = new XMLHttpRequest;\n this.xhr.open(\"POST\", url, true);\n this.xhr.responseType = \"json\";\n this.xhr.setRequestHeader(\"Content-Type\", \"application/json\");\n this.xhr.setRequestHeader(\"Accept\", \"application/json\");\n this.xhr.setRequestHeader(\"X-Requested-With\", \"XMLHttpRequest\");\n Object.keys(customHeaders).forEach((headerKey => {\n this.xhr.setRequestHeader(headerKey, customHeaders[headerKey]);\n }));\n const csrfToken = getMetaValue(\"csrf-token\");\n if (csrfToken != undefined) {\n this.xhr.setRequestHeader(\"X-CSRF-Token\", csrfToken);\n }\n this.xhr.addEventListener(\"load\", (event => this.requestDidLoad(event)));\n this.xhr.addEventListener(\"error\", (event => this.requestDidError(event)));\n }\n get status() {\n return this.xhr.status;\n }\n get response() {\n const {responseType: responseType, response: response} = this.xhr;\n if (responseType == \"json\") {\n return response;\n } else {\n return JSON.parse(response);\n }\n }\n create(callback) {\n this.callback = callback;\n this.xhr.send(JSON.stringify({\n blob: this.attributes\n }));\n }\n requestDidLoad(event) {\n if (this.status >= 200 && this.status < 300) {\n const {response: response} = this;\n const {direct_upload: direct_upload} = response;\n delete response.direct_upload;\n this.attributes = response;\n this.directUploadData = direct_upload;\n this.callback(null, this.toJSON());\n } else {\n this.requestDidError(event);\n }\n }\n requestDidError(event) {\n this.callback(`Error creating Blob for \"${this.file.name}\". Status: ${this.status}`);\n }\n toJSON() {\n const result = {};\n for (const key in this.attributes) {\n result[key] = this.attributes[key];\n }\n return result;\n }\n }\n class BlobUpload {\n constructor(blob) {\n this.blob = blob;\n this.file = blob.file;\n const {url: url, headers: headers} = blob.directUploadData;\n this.xhr = new XMLHttpRequest;\n this.xhr.open(\"PUT\", url, true);\n this.xhr.responseType = \"text\";\n for (const key in headers) {\n this.xhr.setRequestHeader(key, headers[key]);\n }\n this.xhr.addEventListener(\"load\", (event => this.requestDidLoad(event)));\n this.xhr.addEventListener(\"error\", (event => this.requestDidError(event)));\n }\n create(callback) {\n this.callback = callback;\n this.xhr.send(this.file.slice());\n }\n requestDidLoad(event) {\n const {status: status, response: response} = this.xhr;\n if (status >= 200 && status < 300) {\n this.callback(null, response);\n } else {\n this.requestDidError(event);\n }\n }\n requestDidError(event) {\n this.callback(`Error storing \"${this.file.name}\". Status: ${this.xhr.status}`);\n }\n }\n let id = 0;\n class DirectUpload {\n constructor(file, url, delegate, customHeaders = {}) {\n this.id = ++id;\n this.file = file;\n this.url = url;\n this.delegate = delegate;\n this.customHeaders = customHeaders;\n }\n create(callback) {\n FileChecksum.create(this.file, ((error, checksum) => {\n if (error) {\n callback(error);\n return;\n }\n const blob = new BlobRecord(this.file, checksum, this.url, this.customHeaders);\n notify(this.delegate, \"directUploadWillCreateBlobWithXHR\", blob.xhr);\n blob.create((error => {\n if (error) {\n callback(error);\n } else {\n const upload = new BlobUpload(blob);\n notify(this.delegate, \"directUploadWillStoreFileWithXHR\", upload.xhr);\n upload.create((error => {\n if (error) {\n callback(error);\n } else {\n callback(null, blob.toJSON());\n }\n }));\n }\n }));\n }));\n }\n }\n function notify(object, methodName, ...messages) {\n if (object && typeof object[methodName] == \"function\") {\n return object[methodName](...messages);\n }\n }\n class DirectUploadController {\n constructor(input, file) {\n this.input = input;\n this.file = file;\n this.directUpload = new DirectUpload(this.file, this.url, this);\n this.dispatch(\"initialize\");\n }\n start(callback) {\n const hiddenInput = document.createElement(\"input\");\n hiddenInput.type = \"hidden\";\n hiddenInput.name = this.input.name;\n this.input.insertAdjacentElement(\"beforebegin\", hiddenInput);\n this.dispatch(\"start\");\n this.directUpload.create(((error, attributes) => {\n if (error) {\n hiddenInput.parentNode.removeChild(hiddenInput);\n this.dispatchError(error);\n } else {\n hiddenInput.value = attributes.signed_id;\n }\n this.dispatch(\"end\");\n callback(error);\n }));\n }\n uploadRequestDidProgress(event) {\n const progress = event.loaded / event.total * 90;\n if (progress) {\n this.dispatch(\"progress\", {\n progress: progress\n });\n }\n }\n get url() {\n return this.input.getAttribute(\"data-direct-upload-url\");\n }\n dispatch(name, detail = {}) {\n detail.file = this.file;\n detail.id = this.directUpload.id;\n return dispatchEvent(this.input, `direct-upload:${name}`, {\n detail: detail\n });\n }\n dispatchError(error) {\n const event = this.dispatch(\"error\", {\n error: error\n });\n if (!event.defaultPrevented) {\n alert(error);\n }\n }\n directUploadWillCreateBlobWithXHR(xhr) {\n this.dispatch(\"before-blob-request\", {\n xhr: xhr\n });\n }\n directUploadWillStoreFileWithXHR(xhr) {\n this.dispatch(\"before-storage-request\", {\n xhr: xhr\n });\n xhr.upload.addEventListener(\"progress\", (event => this.uploadRequestDidProgress(event)));\n xhr.upload.addEventListener(\"loadend\", (() => {\n this.simulateResponseProgress(xhr);\n }));\n }\n simulateResponseProgress(xhr) {\n let progress = 90;\n const startTime = Date.now();\n const updateProgress = () => {\n const elapsed = Date.now() - startTime;\n const estimatedResponseTime = this.estimateResponseTime();\n const responseProgress = Math.min(elapsed / estimatedResponseTime, 1);\n progress = 90 + responseProgress * 9;\n this.dispatch(\"progress\", {\n progress: progress\n });\n if (xhr.readyState !== XMLHttpRequest.DONE && progress < 99) {\n requestAnimationFrame(updateProgress);\n }\n };\n xhr.addEventListener(\"loadend\", (() => {\n this.dispatch(\"progress\", {\n progress: 100\n });\n }));\n requestAnimationFrame(updateProgress);\n }\n estimateResponseTime() {\n const fileSize = this.file.size;\n const MB = 1024 * 1024;\n if (fileSize < MB) {\n return 1e3;\n } else if (fileSize < 10 * MB) {\n return 2e3;\n } else {\n return 3e3 + fileSize / MB * 50;\n }\n }\n }\n const inputSelector = \"input[type=file][data-direct-upload-url]:not([disabled])\";\n class DirectUploadsController {\n constructor(form) {\n this.form = form;\n this.inputs = findElements(form, inputSelector).filter((input => input.files.length));\n }\n start(callback) {\n const controllers = this.createDirectUploadControllers();\n const startNextController = () => {\n const controller = controllers.shift();\n if (controller) {\n controller.start((error => {\n if (error) {\n callback(error);\n this.dispatch(\"end\");\n } else {\n startNextController();\n }\n }));\n } else {\n callback();\n this.dispatch(\"end\");\n }\n };\n this.dispatch(\"start\");\n startNextController();\n }\n createDirectUploadControllers() {\n const controllers = [];\n this.inputs.forEach((input => {\n toArray(input.files).forEach((file => {\n const controller = new DirectUploadController(input, file);\n controllers.push(controller);\n }));\n }));\n return controllers;\n }\n dispatch(name, detail = {}) {\n return dispatchEvent(this.form, `direct-uploads:${name}`, {\n detail: detail\n });\n }\n }\n const processingAttribute = \"data-direct-uploads-processing\";\n const submitButtonsByForm = new WeakMap;\n let started = false;\n function start() {\n if (!started) {\n started = true;\n document.addEventListener(\"click\", didClick, true);\n document.addEventListener(\"submit\", didSubmitForm, true);\n document.addEventListener(\"ajax:before\", didSubmitRemoteElement);\n }\n }\n function didClick(event) {\n const button = event.target.closest(\"button, input\");\n if (button && button.type === \"submit\" && button.form) {\n submitButtonsByForm.set(button.form, button);\n }\n }\n function didSubmitForm(event) {\n handleFormSubmissionEvent(event);\n }\n function didSubmitRemoteElement(event) {\n if (event.target.tagName == \"FORM\") {\n handleFormSubmissionEvent(event);\n }\n }\n function handleFormSubmissionEvent(event) {\n const form = event.target;\n if (form.hasAttribute(processingAttribute)) {\n event.preventDefault();\n return;\n }\n const controller = new DirectUploadsController(form);\n const {inputs: inputs} = controller;\n if (inputs.length) {\n event.preventDefault();\n form.setAttribute(processingAttribute, \"\");\n inputs.forEach(disable);\n controller.start((error => {\n form.removeAttribute(processingAttribute);\n if (error) {\n inputs.forEach(enable);\n } else {\n submitForm(form);\n }\n }));\n }\n }\n function submitForm(form) {\n let button = submitButtonsByForm.get(form) || findElement(form, \"input[type=submit], button[type=submit]\");\n if (button) {\n const {disabled: disabled} = button;\n button.disabled = false;\n button.focus();\n button.click();\n button.disabled = disabled;\n } else {\n button = document.createElement(\"input\");\n button.type = \"submit\";\n button.style.display = \"none\";\n form.appendChild(button);\n button.click();\n form.removeChild(button);\n }\n submitButtonsByForm.delete(form);\n }\n function disable(input) {\n input.disabled = true;\n }\n function enable(input) {\n input.disabled = false;\n }\n function autostart() {\n if (window.ActiveStorage) {\n start();\n }\n }\n setTimeout(autostart, 1);\n exports.DirectUpload = DirectUpload;\n exports.DirectUploadController = DirectUploadController;\n exports.DirectUploadsController = DirectUploadsController;\n exports.dispatchEvent = dispatchEvent;\n exports.start = start;\n Object.defineProperty(exports, \"__esModule\", {\n value: true\n });\n}));\n", "/** @typedef {import('../photoswipe.js').Point} Point */\r\n\r\n/**\r\n * @template {keyof HTMLElementTagNameMap} T\r\n * @param {string} className\r\n * @param {T} tagName\r\n * @param {Node} [appendToEl]\r\n * @returns {HTMLElementTagNameMap[T]}\r\n */\r\nexport function createElement(className, tagName, appendToEl) {\r\n const el = document.createElement(tagName);\r\n if (className) {\r\n el.className = className;\r\n }\r\n if (appendToEl) {\r\n appendToEl.appendChild(el);\r\n }\r\n return el;\r\n}\r\n\r\n/**\r\n * @param {Point} p1\r\n * @param {Point} p2\r\n * @returns {Point}\r\n */\r\nexport function equalizePoints(p1, p2) {\r\n p1.x = p2.x;\r\n p1.y = p2.y;\r\n if (p2.id !== undefined) {\r\n p1.id = p2.id;\r\n }\r\n return p1;\r\n}\r\n\r\n/**\r\n * @param {Point} p\r\n */\r\nexport function roundPoint(p) {\r\n p.x = Math.round(p.x);\r\n p.y = Math.round(p.y);\r\n}\r\n\r\n/**\r\n * Returns distance between two points.\r\n *\r\n * @param {Point} p1\r\n * @param {Point} p2\r\n * @returns {number}\r\n */\r\nexport function getDistanceBetween(p1, p2) {\r\n const x = Math.abs(p1.x - p2.x);\r\n const y = Math.abs(p1.y - p2.y);\r\n return Math.sqrt((x * x) + (y * y));\r\n}\r\n\r\n/**\r\n * Whether X and Y positions of points are equal\r\n *\r\n * @param {Point} p1\r\n * @param {Point} p2\r\n * @returns {boolean}\r\n */\r\nexport function pointsEqual(p1, p2) {\r\n return p1.x === p2.x && p1.y === p2.y;\r\n}\r\n\r\n/**\r\n * The float result between the min and max values.\r\n *\r\n * @param {number} val\r\n * @param {number} min\r\n * @param {number} max\r\n * @returns {number}\r\n */\r\nexport function clamp(val, min, max) {\r\n return Math.min(Math.max(val, min), max);\r\n}\r\n\r\n/**\r\n * Get transform string\r\n *\r\n * @param {number} x\r\n * @param {number} [y]\r\n * @param {number} [scale]\r\n * @returns {string}\r\n */\r\nexport function toTransformString(x, y, scale) {\r\n let propValue = `translate3d(${x}px,${y || 0}px,0)`;\r\n\r\n if (scale !== undefined) {\r\n propValue += ` scale3d(${scale},${scale},1)`;\r\n }\r\n\r\n return propValue;\r\n}\r\n\r\n/**\r\n * Apply transform:translate(x, y) scale(scale) to element\r\n *\r\n * @param {HTMLElement} el\r\n * @param {number} x\r\n * @param {number} [y]\r\n * @param {number} [scale]\r\n */\r\nexport function setTransform(el, x, y, scale) {\r\n el.style.transform = toTransformString(x, y, scale);\r\n}\r\n\r\nconst defaultCSSEasing = 'cubic-bezier(.4,0,.22,1)';\r\n\r\n/**\r\n * Apply CSS transition to element\r\n *\r\n * @param {HTMLElement} el\r\n * @param {string} [prop] CSS property to animate\r\n * @param {number} [duration] in ms\r\n * @param {string} [ease] CSS easing function\r\n */\r\nexport function setTransitionStyle(el, prop, duration, ease) {\r\n // inOut: 'cubic-bezier(.4, 0, .22, 1)', // for \"toggle state\" transitions\r\n // out: 'cubic-bezier(0, 0, .22, 1)', // for \"show\" transitions\r\n // in: 'cubic-bezier(.4, 0, 1, 1)'// for \"hide\" transitions\r\n el.style.transition = prop\r\n ? `${prop} ${duration}ms ${ease || defaultCSSEasing}`\r\n : 'none';\r\n}\r\n\r\n/**\r\n * Apply width and height CSS properties to element\r\n *\r\n * @param {HTMLElement} el\r\n * @param {string | number} w\r\n * @param {string | number} h\r\n */\r\nexport function setWidthHeight(el, w, h) {\r\n el.style.width = (typeof w === 'number') ? `${w}px` : w;\r\n el.style.height = (typeof h === 'number') ? `${h}px` : h;\r\n}\r\n\r\n/**\r\n * @param {HTMLElement} el\r\n */\r\nexport function removeTransitionStyle(el) {\r\n setTransitionStyle(el);\r\n}\r\n\r\n/**\r\n * @param {HTMLImageElement} img\r\n * @returns {Promise}\r\n */\r\nexport function decodeImage(img) {\r\n if ('decode' in img) {\r\n return img.decode().catch(() => {});\r\n }\r\n\r\n if (img.complete) {\r\n return Promise.resolve(img);\r\n }\r\n\r\n return new Promise((resolve, reject) => {\r\n img.onload = () => resolve(img);\r\n img.onerror = reject;\r\n });\r\n}\r\n\r\n/** @typedef {LOAD_STATE[keyof LOAD_STATE]} LoadState */\r\n/** @type {{ IDLE: 'idle'; LOADING: 'loading'; LOADED: 'loaded'; ERROR: 'error' }} */\r\nexport const LOAD_STATE = {\r\n IDLE: 'idle',\r\n LOADING: 'loading',\r\n LOADED: 'loaded',\r\n ERROR: 'error',\r\n};\r\n\r\n\r\n/**\r\n * Check if click or keydown event was dispatched\r\n * with a special key or via mouse wheel.\r\n *\r\n * @param {MouseEvent | KeyboardEvent} e\r\n * @returns {boolean}\r\n */\r\nexport function specialKeyUsed(e) {\r\n return ('button' in e && e.button === 1) || e.ctrlKey || e.metaKey || e.altKey || e.shiftKey;\r\n}\r\n\r\n/**\r\n * Parse `gallery` or `children` options.\r\n *\r\n * @param {import('../photoswipe.js').ElementProvider} [option]\r\n * @param {string} [legacySelector]\r\n * @param {HTMLElement | Document} [parent]\r\n * @returns HTMLElement[]\r\n */\r\nexport function getElementsFromOption(option, legacySelector, parent = document) {\r\n /** @type {HTMLElement[]} */\r\n let elements = [];\r\n\r\n if (option instanceof Element) {\r\n elements = [option];\r\n } else if (option instanceof NodeList || Array.isArray(option)) {\r\n elements = Array.from(option);\r\n } else {\r\n const selector = typeof option === 'string' ? option : legacySelector;\r\n if (selector) {\r\n elements = Array.from(parent.querySelectorAll(selector));\r\n }\r\n }\r\n\r\n return elements;\r\n}\r\n\r\n/**\r\n * Check if variable is PhotoSwipe class\r\n *\r\n * @param {any} fn\r\n * @returns {boolean}\r\n */\r\nexport function isPswpClass(fn) {\r\n return typeof fn === 'function'\r\n && fn.prototype\r\n && fn.prototype.goTo;\r\n}\r\n\r\n/**\r\n * Check if browser is Safari\r\n *\r\n * @returns {boolean}\r\n */\r\nexport function isSafari() {\r\n return !!(navigator.vendor && navigator.vendor.match(/apple/i));\r\n}\r\n\r\n", "// Detect passive event listener support\r\nlet supportsPassive = false;\r\n/* eslint-disable */\r\ntry {\r\n /* @ts-ignore */\r\n window.addEventListener('test', null, Object.defineProperty({}, 'passive', {\r\n get: () => {\r\n supportsPassive = true;\r\n }\r\n }));\r\n} catch (e) {}\r\n/* eslint-enable */\r\n\r\n/**\r\n * @typedef {Object} PoolItem\r\n * @prop {HTMLElement | Window | Document | undefined | null} target\r\n * @prop {string} type\r\n * @prop {EventListenerOrEventListenerObject} listener\r\n * @prop {boolean} [passive]\r\n */\r\n\r\nclass DOMEvents {\r\n constructor() {\r\n /**\r\n * @type {PoolItem[]}\r\n * @private\r\n */\r\n this._pool = [];\r\n }\r\n\r\n /**\r\n * Adds event listeners\r\n *\r\n * @param {PoolItem['target']} target\r\n * @param {PoolItem['type']} type Can be multiple, separated by space.\r\n * @param {PoolItem['listener']} listener\r\n * @param {PoolItem['passive']} [passive]\r\n */\r\n add(target, type, listener, passive) {\r\n this._toggleListener(target, type, listener, passive);\r\n }\r\n\r\n /**\r\n * Removes event listeners\r\n *\r\n * @param {PoolItem['target']} target\r\n * @param {PoolItem['type']} type\r\n * @param {PoolItem['listener']} listener\r\n * @param {PoolItem['passive']} [passive]\r\n */\r\n remove(target, type, listener, passive) {\r\n this._toggleListener(target, type, listener, passive, true);\r\n }\r\n\r\n /**\r\n * Removes all bound events\r\n */\r\n removeAll() {\r\n this._pool.forEach((poolItem) => {\r\n this._toggleListener(\r\n poolItem.target,\r\n poolItem.type,\r\n poolItem.listener,\r\n poolItem.passive,\r\n true,\r\n true\r\n );\r\n });\r\n this._pool = [];\r\n }\r\n\r\n /**\r\n * Adds or removes event\r\n *\r\n * @private\r\n * @param {PoolItem['target']} target\r\n * @param {PoolItem['type']} type\r\n * @param {PoolItem['listener']} listener\r\n * @param {PoolItem['passive']} [passive]\r\n * @param {boolean} [unbind] Whether the event should be added or removed\r\n * @param {boolean} [skipPool] Whether events pool should be skipped\r\n */\r\n _toggleListener(target, type, listener, passive, unbind, skipPool) {\r\n if (!target) {\r\n return;\r\n }\r\n\r\n const methodName = unbind ? 'removeEventListener' : 'addEventListener';\r\n const types = type.split(' ');\r\n types.forEach((eType) => {\r\n if (eType) {\r\n // Events pool is used to easily unbind all events when PhotoSwipe is closed,\r\n // so developer doesn't need to do this manually\r\n if (!skipPool) {\r\n if (unbind) {\r\n // Remove from the events pool\r\n this._pool = this._pool.filter((poolItem) => {\r\n return poolItem.type !== eType\r\n || poolItem.listener !== listener\r\n || poolItem.target !== target;\r\n });\r\n } else {\r\n // Add to the events pool\r\n this._pool.push({\r\n target,\r\n type: eType,\r\n listener,\r\n passive\r\n });\r\n }\r\n }\r\n\r\n // most PhotoSwipe events call preventDefault,\r\n // and we do not need browser to scroll the page\r\n const eventOptions = supportsPassive ? { passive: (passive || false) } : false;\r\n\r\n target[methodName](\r\n eType,\r\n listener,\r\n eventOptions\r\n );\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default DOMEvents;\r\n", "/** @typedef {import('../photoswipe.js').PhotoSwipeOptions} PhotoSwipeOptions */\r\n/** @typedef {import('../core/base.js').default} PhotoSwipeBase */\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n/** @typedef {import('../slide/slide.js').SlideData} SlideData */\r\n\r\n/**\r\n * @param {PhotoSwipeOptions} options\r\n * @param {PhotoSwipeBase} pswp\r\n * @returns {Point}\r\n */\r\nexport function getViewportSize(options, pswp) {\r\n if (options.getViewportSizeFn) {\r\n const newViewportSize = options.getViewportSizeFn(options, pswp);\r\n if (newViewportSize) {\r\n return newViewportSize;\r\n }\r\n }\r\n\r\n return {\r\n x: document.documentElement.clientWidth,\r\n\r\n // TODO: height on mobile is very incosistent due to toolbar\r\n // find a way to improve this\r\n //\r\n // document.documentElement.clientHeight - doesn't seem to work well\r\n y: window.innerHeight\r\n };\r\n}\r\n\r\n/**\r\n * Parses padding option.\r\n * Supported formats:\r\n *\r\n * // Object\r\n * padding: {\r\n * top: 0,\r\n * bottom: 0,\r\n * left: 0,\r\n * right: 0\r\n * }\r\n *\r\n * // A function that returns the object\r\n * paddingFn: (viewportSize, itemData, index) => {\r\n * return {\r\n * top: 0,\r\n * bottom: 0,\r\n * left: 0,\r\n * right: 0\r\n * };\r\n * }\r\n *\r\n * // Legacy variant\r\n * paddingLeft: 0,\r\n * paddingRight: 0,\r\n * paddingTop: 0,\r\n * paddingBottom: 0,\r\n *\r\n * @param {'left' | 'top' | 'bottom' | 'right'} prop\r\n * @param {PhotoSwipeOptions} options PhotoSwipe options\r\n * @param {Point} viewportSize PhotoSwipe viewport size, for example: { x:800, y:600 }\r\n * @param {SlideData} itemData Data about the slide\r\n * @param {number} index Slide index\r\n * @returns {number}\r\n */\r\nexport function parsePaddingOption(prop, options, viewportSize, itemData, index) {\r\n let paddingValue = 0;\r\n\r\n if (options.paddingFn) {\r\n paddingValue = options.paddingFn(viewportSize, itemData, index)[prop];\r\n } else if (options.padding) {\r\n paddingValue = options.padding[prop];\r\n } else {\r\n const legacyPropName = 'padding' + prop[0].toUpperCase() + prop.slice(1);\r\n // @ts-expect-error\r\n if (options[legacyPropName]) {\r\n // @ts-expect-error\r\n paddingValue = options[legacyPropName];\r\n }\r\n }\r\n\r\n return Number(paddingValue) || 0;\r\n}\r\n\r\n/**\r\n * @param {PhotoSwipeOptions} options\r\n * @param {Point} viewportSize\r\n * @param {SlideData} itemData\r\n * @param {number} index\r\n * @returns {Point}\r\n */\r\nexport function getPanAreaSize(options, viewportSize, itemData, index) {\r\n return {\r\n x: viewportSize.x\r\n - parsePaddingOption('left', options, viewportSize, itemData, index)\r\n - parsePaddingOption('right', options, viewportSize, itemData, index),\r\n y: viewportSize.y\r\n - parsePaddingOption('top', options, viewportSize, itemData, index)\r\n - parsePaddingOption('bottom', options, viewportSize, itemData, index)\r\n };\r\n}\r\n", "import { clamp } from '../util/util.js';\r\nimport { parsePaddingOption } from '../util/viewport-size.js';\r\n\r\n/** @typedef {import('./slide.js').default} Slide */\r\n/** @typedef {Record} Point */\r\n/** @typedef {'x' | 'y'} Axis */\r\n\r\n/**\r\n * Calculates minimum, maximum and initial (center) bounds of a slide\r\n */\r\nclass PanBounds {\r\n /**\r\n * @param {Slide} slide\r\n */\r\n constructor(slide) {\r\n this.slide = slide;\r\n this.currZoomLevel = 1;\r\n this.center = /** @type {Point} */ { x: 0, y: 0 };\r\n this.max = /** @type {Point} */ { x: 0, y: 0 };\r\n this.min = /** @type {Point} */ { x: 0, y: 0 };\r\n }\r\n\r\n /**\r\n * _getItemBounds\r\n *\r\n * @param {number} currZoomLevel\r\n */\r\n update(currZoomLevel) {\r\n this.currZoomLevel = currZoomLevel;\r\n\r\n if (!this.slide.width) {\r\n this.reset();\r\n } else {\r\n this._updateAxis('x');\r\n this._updateAxis('y');\r\n this.slide.pswp.dispatch('calcBounds', { slide: this.slide });\r\n }\r\n }\r\n\r\n /**\r\n * _calculateItemBoundsForAxis\r\n *\r\n * @param {Axis} axis\r\n */\r\n _updateAxis(axis) {\r\n const { pswp } = this.slide;\r\n const elSize = this.slide[axis === 'x' ? 'width' : 'height'] * this.currZoomLevel;\r\n const paddingProp = axis === 'x' ? 'left' : 'top';\r\n const padding = parsePaddingOption(\r\n paddingProp,\r\n pswp.options,\r\n pswp.viewportSize,\r\n this.slide.data,\r\n this.slide.index\r\n );\r\n\r\n const panAreaSize = this.slide.panAreaSize[axis];\r\n\r\n // Default position of element.\r\n // By default, it is center of viewport:\r\n this.center[axis] = Math.round((panAreaSize - elSize) / 2) + padding;\r\n\r\n // maximum pan position\r\n this.max[axis] = (elSize > panAreaSize)\r\n ? Math.round(panAreaSize - elSize) + padding\r\n : this.center[axis];\r\n\r\n // minimum pan position\r\n this.min[axis] = (elSize > panAreaSize)\r\n ? padding\r\n : this.center[axis];\r\n }\r\n\r\n // _getZeroBounds\r\n reset() {\r\n this.center.x = 0;\r\n this.center.y = 0;\r\n this.max.x = 0;\r\n this.max.y = 0;\r\n this.min.x = 0;\r\n this.min.y = 0;\r\n }\r\n\r\n /**\r\n * Correct pan position if it's beyond the bounds\r\n *\r\n * @param {Axis} axis x or y\r\n * @param {number} panOffset\r\n * @returns {number}\r\n */\r\n correctPan(axis, panOffset) { // checkPanBounds\r\n return clamp(panOffset, this.max[axis], this.min[axis]);\r\n }\r\n}\r\n\r\nexport default PanBounds;\r\n", "const MAX_IMAGE_WIDTH = 4000;\r\n\r\n/** @typedef {import('../photoswipe.js').default} PhotoSwipe */\r\n/** @typedef {import('../photoswipe.js').PhotoSwipeOptions} PhotoSwipeOptions */\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n/** @typedef {import('../slide/slide.js').SlideData} SlideData */\r\n\r\n/** @typedef {'fit' | 'fill' | number | ((zoomLevelObject: ZoomLevel) => number)} ZoomLevelOption */\r\n\r\n/**\r\n * Calculates zoom levels for specific slide.\r\n * Depends on viewport size and image size.\r\n */\r\nclass ZoomLevel {\r\n /**\r\n * @param {PhotoSwipeOptions} options PhotoSwipe options\r\n * @param {SlideData} itemData Slide data\r\n * @param {number} index Slide index\r\n * @param {PhotoSwipe} [pswp] PhotoSwipe instance, can be undefined if not initialized yet\r\n */\r\n constructor(options, itemData, index, pswp) {\r\n this.pswp = pswp;\r\n this.options = options;\r\n this.itemData = itemData;\r\n this.index = index;\r\n /** @type { Point | null } */\r\n this.panAreaSize = null;\r\n /** @type { Point | null } */\r\n this.elementSize = null;\r\n this.fit = 1;\r\n this.fill = 1;\r\n this.vFill = 1;\r\n this.initial = 1;\r\n this.secondary = 1;\r\n this.max = 1;\r\n this.min = 1;\r\n }\r\n\r\n /**\r\n * Calculate initial, secondary and maximum zoom level for the specified slide.\r\n *\r\n * It should be called when either image or viewport size changes.\r\n *\r\n * @param {number} maxWidth\r\n * @param {number} maxHeight\r\n * @param {Point} panAreaSize\r\n */\r\n update(maxWidth, maxHeight, panAreaSize) {\r\n /** @type {Point} */\r\n const elementSize = { x: maxWidth, y: maxHeight };\r\n this.elementSize = elementSize;\r\n this.panAreaSize = panAreaSize;\r\n\r\n const hRatio = panAreaSize.x / elementSize.x;\r\n const vRatio = panAreaSize.y / elementSize.y;\r\n\r\n this.fit = Math.min(1, hRatio < vRatio ? hRatio : vRatio);\r\n this.fill = Math.min(1, hRatio > vRatio ? hRatio : vRatio);\r\n\r\n // zoom.vFill defines zoom level of the image\r\n // when it has 100% of viewport vertical space (height)\r\n this.vFill = Math.min(1, vRatio);\r\n\r\n this.initial = this._getInitial();\r\n this.secondary = this._getSecondary();\r\n this.max = Math.max(\r\n this.initial,\r\n this.secondary,\r\n this._getMax()\r\n );\r\n\r\n this.min = Math.min(\r\n this.fit,\r\n this.initial,\r\n this.secondary\r\n );\r\n\r\n if (this.pswp) {\r\n this.pswp.dispatch('zoomLevelsUpdate', { zoomLevels: this, slideData: this.itemData });\r\n }\r\n }\r\n\r\n /**\r\n * Parses user-defined zoom option.\r\n *\r\n * @private\r\n * @param {'initial' | 'secondary' | 'max'} optionPrefix Zoom level option prefix (initial, secondary, max)\r\n * @returns { number | undefined }\r\n */\r\n _parseZoomLevelOption(optionPrefix) {\r\n const optionName = /** @type {'initialZoomLevel' | 'secondaryZoomLevel' | 'maxZoomLevel'} */ (\r\n optionPrefix + 'ZoomLevel'\r\n );\r\n const optionValue = this.options[optionName];\r\n\r\n if (!optionValue) {\r\n return;\r\n }\r\n\r\n if (typeof optionValue === 'function') {\r\n return optionValue(this);\r\n }\r\n\r\n if (optionValue === 'fill') {\r\n return this.fill;\r\n }\r\n\r\n if (optionValue === 'fit') {\r\n return this.fit;\r\n }\r\n\r\n return Number(optionValue);\r\n }\r\n\r\n /**\r\n * Get zoom level to which image will be zoomed after double-tap gesture,\r\n * or when user clicks on zoom icon,\r\n * or mouse-click on image itself.\r\n * If you return 1 image will be zoomed to its original size.\r\n *\r\n * @private\r\n * @return {number}\r\n */\r\n _getSecondary() {\r\n let currZoomLevel = this._parseZoomLevelOption('secondary');\r\n\r\n if (currZoomLevel) {\r\n return currZoomLevel;\r\n }\r\n\r\n // 3x of \"fit\" state, but not larger than original\r\n currZoomLevel = Math.min(1, this.fit * 3);\r\n\r\n if (this.elementSize && currZoomLevel * this.elementSize.x > MAX_IMAGE_WIDTH) {\r\n currZoomLevel = MAX_IMAGE_WIDTH / this.elementSize.x;\r\n }\r\n\r\n return currZoomLevel;\r\n }\r\n\r\n /**\r\n * Get initial image zoom level.\r\n *\r\n * @private\r\n * @return {number}\r\n */\r\n _getInitial() {\r\n return this._parseZoomLevelOption('initial') || this.fit;\r\n }\r\n\r\n /**\r\n * Maximum zoom level when user zooms\r\n * via zoom/pinch gesture,\r\n * via cmd/ctrl-wheel or via trackpad.\r\n *\r\n * @private\r\n * @return {number}\r\n */\r\n _getMax() {\r\n // max zoom level is x4 from \"fit state\",\r\n // used for zoom gesture and ctrl/trackpad zoom\r\n return this._parseZoomLevelOption('max') || Math.max(1, this.fit * 4);\r\n }\r\n}\r\n\r\nexport default ZoomLevel;\r\n", "/** @typedef {import('../photoswipe.js').default} PhotoSwipe */\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n\r\n/**\r\n * @typedef {_SlideData & Record} SlideData\r\n * @typedef {Object} _SlideData\r\n * @prop {HTMLElement} [element] thumbnail element\r\n * @prop {string} [src] image URL\r\n * @prop {string} [srcset] image srcset\r\n * @prop {number} [w] image width (deprecated)\r\n * @prop {number} [h] image height (deprecated)\r\n * @prop {number} [width] image width\r\n * @prop {number} [height] image height\r\n * @prop {string} [msrc] placeholder image URL that's displayed before large image is loaded\r\n * @prop {string} [alt] image alt text\r\n * @prop {boolean} [thumbCropped] whether thumbnail is cropped client-side or not\r\n * @prop {string} [html] html content of a slide\r\n * @prop {'image' | 'html' | string} [type] slide type\r\n */\r\n\r\nimport {\r\n createElement,\r\n setTransform,\r\n equalizePoints,\r\n roundPoint,\r\n toTransformString,\r\n clamp,\r\n} from '../util/util.js';\r\n\r\nimport PanBounds from './pan-bounds.js';\r\nimport ZoomLevel from './zoom-level.js';\r\nimport { getPanAreaSize } from '../util/viewport-size.js';\r\n\r\n/**\r\n * Renders and allows to control a single slide\r\n */\r\nclass Slide {\r\n /**\r\n * @param {SlideData} data\r\n * @param {number} index\r\n * @param {PhotoSwipe} pswp\r\n */\r\n constructor(data, index, pswp) {\r\n this.data = data;\r\n this.index = index;\r\n this.pswp = pswp;\r\n this.isActive = (index === pswp.currIndex);\r\n this.currentResolution = 0;\r\n /** @type {Point} */\r\n this.panAreaSize = { x: 0, y: 0 };\r\n /** @type {Point} */\r\n this.pan = { x: 0, y: 0 };\r\n\r\n this.isFirstSlide = (this.isActive && !pswp.opener.isOpen);\r\n\r\n this.zoomLevels = new ZoomLevel(pswp.options, data, index, pswp);\r\n\r\n this.pswp.dispatch('gettingData', {\r\n slide: this,\r\n data: this.data,\r\n index\r\n });\r\n\r\n this.content = this.pswp.contentLoader.getContentBySlide(this);\r\n this.container = createElement('pswp__zoom-wrap', 'div');\r\n /** @type {HTMLElement | null} */\r\n this.holderElement = null;\r\n\r\n this.currZoomLevel = 1;\r\n /** @type {number} */\r\n this.width = this.content.width;\r\n /** @type {number} */\r\n this.height = this.content.height;\r\n this.heavyAppended = false;\r\n this.bounds = new PanBounds(this);\r\n\r\n this.prevDisplayedWidth = -1;\r\n this.prevDisplayedHeight = -1;\r\n\r\n this.pswp.dispatch('slideInit', { slide: this });\r\n }\r\n\r\n /**\r\n * If this slide is active/current/visible\r\n *\r\n * @param {boolean} isActive\r\n */\r\n setIsActive(isActive) {\r\n if (isActive && !this.isActive) {\r\n // slide just became active\r\n this.activate();\r\n } else if (!isActive && this.isActive) {\r\n // slide just became non-active\r\n this.deactivate();\r\n }\r\n }\r\n\r\n /**\r\n * Appends slide content to DOM\r\n *\r\n * @param {HTMLElement} holderElement\r\n */\r\n append(holderElement) {\r\n this.holderElement = holderElement;\r\n\r\n this.container.style.transformOrigin = '0 0';\r\n\r\n // Slide appended to DOM\r\n if (!this.data) {\r\n return;\r\n }\r\n\r\n this.calculateSize();\r\n\r\n this.load();\r\n this.updateContentSize();\r\n this.appendHeavy();\r\n\r\n this.holderElement.appendChild(this.container);\r\n\r\n this.zoomAndPanToInitial();\r\n\r\n this.pswp.dispatch('firstZoomPan', { slide: this });\r\n\r\n this.applyCurrentZoomPan();\r\n\r\n this.pswp.dispatch('afterSetContent', { slide: this });\r\n\r\n if (this.isActive) {\r\n this.activate();\r\n }\r\n }\r\n\r\n load() {\r\n this.content.load(false);\r\n this.pswp.dispatch('slideLoad', { slide: this });\r\n }\r\n\r\n /**\r\n * Append \"heavy\" DOM elements\r\n *\r\n * This may depend on a type of slide,\r\n * but generally these are large images.\r\n */\r\n appendHeavy() {\r\n const { pswp } = this;\r\n const appendHeavyNearby = true; // todo\r\n\r\n // Avoid appending heavy elements during animations\r\n if (this.heavyAppended\r\n || !pswp.opener.isOpen\r\n || pswp.mainScroll.isShifted()\r\n || (!this.isActive && !appendHeavyNearby)) {\r\n return;\r\n }\r\n\r\n if (this.pswp.dispatch('appendHeavy', { slide: this }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n this.heavyAppended = true;\r\n\r\n this.content.append();\r\n\r\n this.pswp.dispatch('appendHeavyContent', { slide: this });\r\n }\r\n\r\n /**\r\n * Triggered when this slide is active (selected).\r\n *\r\n * If it's part of opening/closing transition -\r\n * activate() will trigger after the transition is ended.\r\n */\r\n activate() {\r\n this.isActive = true;\r\n this.appendHeavy();\r\n this.content.activate();\r\n this.pswp.dispatch('slideActivate', { slide: this });\r\n }\r\n\r\n /**\r\n * Triggered when this slide becomes inactive.\r\n *\r\n * Slide can become inactive only after it was active.\r\n */\r\n deactivate() {\r\n this.isActive = false;\r\n this.content.deactivate();\r\n\r\n if (this.currZoomLevel !== this.zoomLevels.initial) {\r\n // allow filtering\r\n this.calculateSize();\r\n }\r\n\r\n // reset zoom level\r\n this.currentResolution = 0;\r\n this.zoomAndPanToInitial();\r\n this.applyCurrentZoomPan();\r\n this.updateContentSize();\r\n\r\n this.pswp.dispatch('slideDeactivate', { slide: this });\r\n }\r\n\r\n /**\r\n * The slide should destroy itself, it will never be used again.\r\n * (unbind all events and destroy internal components)\r\n */\r\n destroy() {\r\n this.content.hasSlide = false;\r\n this.content.remove();\r\n this.container.remove();\r\n this.pswp.dispatch('slideDestroy', { slide: this });\r\n }\r\n\r\n resize() {\r\n if (this.currZoomLevel === this.zoomLevels.initial || !this.isActive) {\r\n // Keep initial zoom level if it was before the resize,\r\n // as well as when this slide is not active\r\n\r\n // Reset position and scale to original state\r\n this.calculateSize();\r\n this.currentResolution = 0;\r\n this.zoomAndPanToInitial();\r\n this.applyCurrentZoomPan();\r\n this.updateContentSize();\r\n } else {\r\n // readjust pan position if it's beyond the bounds\r\n this.calculateSize();\r\n this.bounds.update(this.currZoomLevel);\r\n this.panTo(this.pan.x, this.pan.y);\r\n }\r\n }\r\n\r\n\r\n /**\r\n * Apply size to current slide content,\r\n * based on the current resolution and scale.\r\n *\r\n * @param {boolean} [force] if size should be updated even if dimensions weren't changed\r\n */\r\n updateContentSize(force) {\r\n // Use initial zoom level\r\n // if resolution is not defined (user didn't zoom yet)\r\n const scaleMultiplier = this.currentResolution || this.zoomLevels.initial;\r\n\r\n if (!scaleMultiplier) {\r\n return;\r\n }\r\n\r\n const width = Math.round(this.width * scaleMultiplier) || this.pswp.viewportSize.x;\r\n const height = Math.round(this.height * scaleMultiplier) || this.pswp.viewportSize.y;\r\n\r\n if (!this.sizeChanged(width, height) && !force) {\r\n return;\r\n }\r\n this.content.setDisplayedSize(width, height);\r\n }\r\n\r\n /**\r\n * @param {number} width\r\n * @param {number} height\r\n */\r\n sizeChanged(width, height) {\r\n if (width !== this.prevDisplayedWidth\r\n || height !== this.prevDisplayedHeight) {\r\n this.prevDisplayedWidth = width;\r\n this.prevDisplayedHeight = height;\r\n return true;\r\n }\r\n\r\n return false;\r\n }\r\n\r\n /** @returns {HTMLImageElement | HTMLDivElement | null | undefined} */\r\n getPlaceholderElement() {\r\n return this.content.placeholder?.element;\r\n }\r\n\r\n /**\r\n * Zoom current slide image to...\r\n *\r\n * @param {number} destZoomLevel Destination zoom level.\r\n * @param {Point} [centerPoint]\r\n * Transform origin center point, or false if viewport center should be used.\r\n * @param {number | false} [transitionDuration] Transition duration, may be set to 0.\r\n * @param {boolean} [ignoreBounds] Minimum and maximum zoom levels will be ignored.\r\n */\r\n zoomTo(destZoomLevel, centerPoint, transitionDuration, ignoreBounds) {\r\n const { pswp } = this;\r\n if (!this.isZoomable()\r\n || pswp.mainScroll.isShifted()) {\r\n return;\r\n }\r\n\r\n pswp.dispatch('beforeZoomTo', {\r\n destZoomLevel, centerPoint, transitionDuration\r\n });\r\n\r\n // stop all pan and zoom transitions\r\n pswp.animations.stopAllPan();\r\n\r\n // if (!centerPoint) {\r\n // centerPoint = pswp.getViewportCenterPoint();\r\n // }\r\n\r\n const prevZoomLevel = this.currZoomLevel;\r\n\r\n if (!ignoreBounds) {\r\n destZoomLevel = clamp(destZoomLevel, this.zoomLevels.min, this.zoomLevels.max);\r\n }\r\n\r\n // if (transitionDuration === undefined) {\r\n // transitionDuration = this.pswp.options.zoomAnimationDuration;\r\n // }\r\n\r\n this.setZoomLevel(destZoomLevel);\r\n this.pan.x = this.calculateZoomToPanOffset('x', centerPoint, prevZoomLevel);\r\n this.pan.y = this.calculateZoomToPanOffset('y', centerPoint, prevZoomLevel);\r\n roundPoint(this.pan);\r\n\r\n const finishTransition = () => {\r\n this._setResolution(destZoomLevel);\r\n this.applyCurrentZoomPan();\r\n };\r\n\r\n if (!transitionDuration) {\r\n finishTransition();\r\n } else {\r\n pswp.animations.startTransition({\r\n isPan: true,\r\n name: 'zoomTo',\r\n target: this.container,\r\n transform: this.getCurrentTransform(),\r\n onComplete: finishTransition,\r\n duration: transitionDuration,\r\n easing: pswp.options.easing\r\n });\r\n }\r\n }\r\n\r\n /**\r\n * @param {Point} [centerPoint]\r\n */\r\n toggleZoom(centerPoint) {\r\n this.zoomTo(\r\n this.currZoomLevel === this.zoomLevels.initial\r\n ? this.zoomLevels.secondary : this.zoomLevels.initial,\r\n centerPoint,\r\n this.pswp.options.zoomAnimationDuration\r\n );\r\n }\r\n\r\n /**\r\n * Updates zoom level property and recalculates new pan bounds,\r\n * unlike zoomTo it does not apply transform (use applyCurrentZoomPan)\r\n *\r\n * @param {number} currZoomLevel\r\n */\r\n setZoomLevel(currZoomLevel) {\r\n this.currZoomLevel = currZoomLevel;\r\n this.bounds.update(this.currZoomLevel);\r\n }\r\n\r\n /**\r\n * Get pan position after zoom at a given `point`.\r\n *\r\n * Always call setZoomLevel(newZoomLevel) beforehand to recalculate\r\n * pan bounds according to the new zoom level.\r\n *\r\n * @param {'x' | 'y'} axis\r\n * @param {Point} [point]\r\n * point based on which zoom is performed, usually refers to the current mouse position,\r\n * if false - viewport center will be used.\r\n * @param {number} [prevZoomLevel] Zoom level before new zoom was applied.\r\n * @returns {number}\r\n */\r\n calculateZoomToPanOffset(axis, point, prevZoomLevel) {\r\n const totalPanDistance = this.bounds.max[axis] - this.bounds.min[axis];\r\n if (totalPanDistance === 0) {\r\n return this.bounds.center[axis];\r\n }\r\n\r\n if (!point) {\r\n point = this.pswp.getViewportCenterPoint();\r\n }\r\n\r\n if (!prevZoomLevel) {\r\n prevZoomLevel = this.zoomLevels.initial;\r\n }\r\n\r\n const zoomFactor = this.currZoomLevel / prevZoomLevel;\r\n return this.bounds.correctPan(\r\n axis,\r\n (this.pan[axis] - point[axis]) * zoomFactor + point[axis]\r\n );\r\n }\r\n\r\n /**\r\n * Apply pan and keep it within bounds.\r\n *\r\n * @param {number} panX\r\n * @param {number} panY\r\n */\r\n panTo(panX, panY) {\r\n this.pan.x = this.bounds.correctPan('x', panX);\r\n this.pan.y = this.bounds.correctPan('y', panY);\r\n this.applyCurrentZoomPan();\r\n }\r\n\r\n /**\r\n * If the slide in the current state can be panned by the user\r\n * @returns {boolean}\r\n */\r\n isPannable() {\r\n return Boolean(this.width) && (this.currZoomLevel > this.zoomLevels.fit);\r\n }\r\n\r\n /**\r\n * If the slide can be zoomed\r\n * @returns {boolean}\r\n */\r\n isZoomable() {\r\n return Boolean(this.width) && this.content.isZoomable();\r\n }\r\n\r\n /**\r\n * Apply transform and scale based on\r\n * the current pan position (this.pan) and zoom level (this.currZoomLevel)\r\n */\r\n applyCurrentZoomPan() {\r\n this._applyZoomTransform(this.pan.x, this.pan.y, this.currZoomLevel);\r\n if (this === this.pswp.currSlide) {\r\n this.pswp.dispatch('zoomPanUpdate', { slide: this });\r\n }\r\n }\r\n\r\n zoomAndPanToInitial() {\r\n this.currZoomLevel = this.zoomLevels.initial;\r\n\r\n // pan according to the zoom level\r\n this.bounds.update(this.currZoomLevel);\r\n equalizePoints(this.pan, this.bounds.center);\r\n this.pswp.dispatch('initialZoomPan', { slide: this });\r\n }\r\n\r\n /**\r\n * Set translate and scale based on current resolution\r\n *\r\n * @param {number} x\r\n * @param {number} y\r\n * @param {number} zoom\r\n * @private\r\n */\r\n _applyZoomTransform(x, y, zoom) {\r\n zoom /= this.currentResolution || this.zoomLevels.initial;\r\n setTransform(this.container, x, y, zoom);\r\n }\r\n\r\n calculateSize() {\r\n const { pswp } = this;\r\n\r\n equalizePoints(\r\n this.panAreaSize,\r\n getPanAreaSize(pswp.options, pswp.viewportSize, this.data, this.index)\r\n );\r\n\r\n this.zoomLevels.update(this.width, this.height, this.panAreaSize);\r\n\r\n pswp.dispatch('calcSlideSize', {\r\n slide: this\r\n });\r\n }\r\n\r\n /** @returns {string} */\r\n getCurrentTransform() {\r\n const scale = this.currZoomLevel / (this.currentResolution || this.zoomLevels.initial);\r\n return toTransformString(this.pan.x, this.pan.y, scale);\r\n }\r\n\r\n /**\r\n * Set resolution and re-render the image.\r\n *\r\n * For example, if the real image size is 2000x1500,\r\n * and resolution is 0.5 - it will be rendered as 1000x750.\r\n *\r\n * Image with zoom level 2 and resolution 0.5 is\r\n * the same as image with zoom level 1 and resolution 1.\r\n *\r\n * Used to optimize animations and make\r\n * sure that browser renders image in the highest quality.\r\n * Also used by responsive images to load the correct one.\r\n *\r\n * @param {number} newResolution\r\n */\r\n _setResolution(newResolution) {\r\n if (newResolution === this.currentResolution) {\r\n return;\r\n }\r\n\r\n this.currentResolution = newResolution;\r\n this.updateContentSize();\r\n\r\n this.pswp.dispatch('resolutionChanged');\r\n }\r\n}\r\n\r\nexport default Slide;\r\n", "import {\r\n equalizePoints, roundPoint, clamp\r\n} from '../util/util.js';\r\n\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n/** @typedef {import('./gestures.js').default} Gestures */\r\n\r\nconst PAN_END_FRICTION = 0.35;\r\nconst VERTICAL_DRAG_FRICTION = 0.6;\r\n\r\n// 1 corresponds to the third of viewport height\r\nconst MIN_RATIO_TO_CLOSE = 0.4;\r\n\r\n// Minimum speed required to navigate\r\n// to next or previous slide\r\nconst MIN_NEXT_SLIDE_SPEED = 0.5;\r\n\r\n/**\r\n * @param {number} initialVelocity\r\n * @param {number} decelerationRate\r\n * @returns {number}\r\n */\r\nfunction project(initialVelocity, decelerationRate) {\r\n return initialVelocity * decelerationRate / (1 - decelerationRate);\r\n}\r\n\r\n/**\r\n * Handles single pointer dragging\r\n */\r\nclass DragHandler {\r\n /**\r\n * @param {Gestures} gestures\r\n */\r\n constructor(gestures) {\r\n this.gestures = gestures;\r\n this.pswp = gestures.pswp;\r\n /** @type {Point} */\r\n this.startPan = { x: 0, y: 0 };\r\n }\r\n\r\n start() {\r\n if (this.pswp.currSlide) {\r\n equalizePoints(this.startPan, this.pswp.currSlide.pan);\r\n }\r\n this.pswp.animations.stopAll();\r\n }\r\n\r\n change() {\r\n const { p1, prevP1, dragAxis } = this.gestures;\r\n const { currSlide } = this.pswp;\r\n\r\n if (dragAxis === 'y'\r\n && this.pswp.options.closeOnVerticalDrag\r\n && (currSlide && currSlide.currZoomLevel <= currSlide.zoomLevels.fit)\r\n && !this.gestures.isMultitouch) {\r\n // Handle vertical drag to close\r\n const panY = currSlide.pan.y + (p1.y - prevP1.y);\r\n if (!this.pswp.dispatch('verticalDrag', { panY }).defaultPrevented) {\r\n this._setPanWithFriction('y', panY, VERTICAL_DRAG_FRICTION);\r\n const bgOpacity = 1 - Math.abs(this._getVerticalDragRatio(currSlide.pan.y));\r\n this.pswp.applyBgOpacity(bgOpacity);\r\n currSlide.applyCurrentZoomPan();\r\n }\r\n } else {\r\n const mainScrollChanged = this._panOrMoveMainScroll('x');\r\n if (!mainScrollChanged) {\r\n this._panOrMoveMainScroll('y');\r\n\r\n if (currSlide) {\r\n roundPoint(currSlide.pan);\r\n currSlide.applyCurrentZoomPan();\r\n }\r\n }\r\n }\r\n }\r\n\r\n end() {\r\n const { velocity } = this.gestures;\r\n const { mainScroll, currSlide } = this.pswp;\r\n let indexDiff = 0;\r\n\r\n this.pswp.animations.stopAll();\r\n\r\n // Handle main scroll if it's shifted\r\n if (mainScroll.isShifted()) {\r\n // Position of the main scroll relative to the viewport\r\n const mainScrollShiftDiff = mainScroll.x - mainScroll.getCurrSlideX();\r\n\r\n // Ratio between 0 and 1:\r\n // 0 - slide is not visible at all,\r\n // 0.5 - half of the slide is visible\r\n // 1 - slide is fully visible\r\n const currentSlideVisibilityRatio = (mainScrollShiftDiff / this.pswp.viewportSize.x);\r\n\r\n // Go next slide.\r\n //\r\n // - if velocity and its direction is matched,\r\n // and we see at least tiny part of the next slide\r\n //\r\n // - or if we see less than 50% of the current slide\r\n // and velocity is close to 0\r\n //\r\n if ((velocity.x < -MIN_NEXT_SLIDE_SPEED && currentSlideVisibilityRatio < 0)\r\n || (velocity.x < 0.1 && currentSlideVisibilityRatio < -0.5)) {\r\n // Go to next slide\r\n indexDiff = 1;\r\n velocity.x = Math.min(velocity.x, 0);\r\n } else if ((velocity.x > MIN_NEXT_SLIDE_SPEED && currentSlideVisibilityRatio > 0)\r\n || (velocity.x > -0.1 && currentSlideVisibilityRatio > 0.5)) {\r\n // Go to prev slide\r\n indexDiff = -1;\r\n velocity.x = Math.max(velocity.x, 0);\r\n }\r\n\r\n mainScroll.moveIndexBy(indexDiff, true, velocity.x);\r\n }\r\n\r\n // Restore zoom level\r\n if ((currSlide && currSlide.currZoomLevel > currSlide.zoomLevels.max)\r\n || this.gestures.isMultitouch) {\r\n this.gestures.zoomLevels.correctZoomPan(true);\r\n } else {\r\n // we run two animations instead of one,\r\n // as each axis has own pan boundaries and thus different spring function\r\n // (correctZoomPan does not have this functionality,\r\n // it animates all properties with single timing function)\r\n this._finishPanGestureForAxis('x');\r\n this._finishPanGestureForAxis('y');\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {'x' | 'y'} axis\r\n */\r\n _finishPanGestureForAxis(axis) {\r\n const { velocity } = this.gestures;\r\n const { currSlide } = this.pswp;\r\n\r\n if (!currSlide) {\r\n return;\r\n }\r\n\r\n const { pan, bounds } = currSlide;\r\n const panPos = pan[axis];\r\n const restoreBgOpacity = (this.pswp.bgOpacity < 1 && axis === 'y');\r\n\r\n // 0.995 means - scroll view loses 0.5% of its velocity per millisecond\r\n // Increasing this number will reduce travel distance\r\n const decelerationRate = 0.995; // 0.99\r\n\r\n // Pan position if there is no bounds\r\n const projectedPosition = panPos + project(velocity[axis], decelerationRate);\r\n\r\n if (restoreBgOpacity) {\r\n const vDragRatio = this._getVerticalDragRatio(panPos);\r\n const projectedVDragRatio = this._getVerticalDragRatio(projectedPosition);\r\n\r\n // If we are above and moving upwards,\r\n // or if we are below and moving downwards\r\n if ((vDragRatio < 0 && projectedVDragRatio < -MIN_RATIO_TO_CLOSE)\r\n || (vDragRatio > 0 && projectedVDragRatio > MIN_RATIO_TO_CLOSE)) {\r\n this.pswp.close();\r\n return;\r\n }\r\n }\r\n\r\n // Pan position with corrected bounds\r\n const correctedPanPosition = bounds.correctPan(axis, projectedPosition);\r\n\r\n // Exit if pan position should not be changed\r\n // or if speed it too low\r\n if (panPos === correctedPanPosition) {\r\n return;\r\n }\r\n\r\n // Overshoot if the final position is out of pan bounds\r\n const dampingRatio = (correctedPanPosition === projectedPosition) ? 1 : 0.82;\r\n\r\n const initialBgOpacity = this.pswp.bgOpacity;\r\n const totalPanDist = correctedPanPosition - panPos;\r\n\r\n this.pswp.animations.startSpring({\r\n name: 'panGesture' + axis,\r\n isPan: true,\r\n start: panPos,\r\n end: correctedPanPosition,\r\n velocity: velocity[axis],\r\n dampingRatio,\r\n onUpdate: (pos) => {\r\n // Animate opacity of background relative to Y pan position of an image\r\n if (restoreBgOpacity && this.pswp.bgOpacity < 1) {\r\n // 0 - start of animation, 1 - end of animation\r\n const animationProgressRatio = 1 - (correctedPanPosition - pos) / totalPanDist;\r\n\r\n // We clamp opacity to keep it between 0 and 1.\r\n // As progress ratio can be larger than 1 due to overshoot,\r\n // and we do not want to bounce opacity.\r\n this.pswp.applyBgOpacity(clamp(\r\n initialBgOpacity + (1 - initialBgOpacity) * animationProgressRatio,\r\n 0,\r\n 1\r\n ));\r\n }\r\n\r\n pan[axis] = Math.floor(pos);\r\n currSlide.applyCurrentZoomPan();\r\n },\r\n });\r\n }\r\n\r\n /**\r\n * Update position of the main scroll,\r\n * or/and update pan position of the current slide.\r\n *\r\n * Should return true if it changes (or can change) main scroll.\r\n *\r\n * @private\r\n * @param {'x' | 'y'} axis\r\n * @returns {boolean}\r\n */\r\n _panOrMoveMainScroll(axis) {\r\n const { p1, dragAxis, prevP1, isMultitouch } = this.gestures;\r\n const { currSlide, mainScroll } = this.pswp;\r\n const delta = (p1[axis] - prevP1[axis]);\r\n const newMainScrollX = mainScroll.x + delta;\r\n\r\n if (!delta || !currSlide) {\r\n return false;\r\n }\r\n\r\n // Always move main scroll if image can not be panned\r\n if (axis === 'x' && !currSlide.isPannable() && !isMultitouch) {\r\n mainScroll.moveTo(newMainScrollX, true);\r\n return true; // changed main scroll\r\n }\r\n\r\n const { bounds } = currSlide;\r\n const newPan = currSlide.pan[axis] + delta;\r\n\r\n if (this.pswp.options.allowPanToNext\r\n && dragAxis === 'x'\r\n && axis === 'x'\r\n && !isMultitouch) {\r\n const currSlideMainScrollX = mainScroll.getCurrSlideX();\r\n\r\n // Position of the main scroll relative to the viewport\r\n const mainScrollShiftDiff = mainScroll.x - currSlideMainScrollX;\r\n\r\n const isLeftToRight = delta > 0;\r\n const isRightToLeft = !isLeftToRight;\r\n\r\n if (newPan > bounds.min[axis] && isLeftToRight) {\r\n // Panning from left to right, beyond the left edge\r\n\r\n // Wether the image was at minimum pan position (or less)\r\n // when this drag gesture started.\r\n // Minimum pan position refers to the left edge of the image.\r\n const wasAtMinPanPosition = (bounds.min[axis] <= this.startPan[axis]);\r\n\r\n if (wasAtMinPanPosition) {\r\n mainScroll.moveTo(newMainScrollX, true);\r\n return true;\r\n } else {\r\n this._setPanWithFriction(axis, newPan);\r\n //currSlide.pan[axis] = newPan;\r\n }\r\n } else if (newPan < bounds.max[axis] && isRightToLeft) {\r\n // Paning from right to left, beyond the right edge\r\n\r\n // Maximum pan position refers to the right edge of the image.\r\n const wasAtMaxPanPosition = (this.startPan[axis] <= bounds.max[axis]);\r\n\r\n if (wasAtMaxPanPosition) {\r\n mainScroll.moveTo(newMainScrollX, true);\r\n return true;\r\n } else {\r\n this._setPanWithFriction(axis, newPan);\r\n //currSlide.pan[axis] = newPan;\r\n }\r\n } else {\r\n // If main scroll is shifted\r\n if (mainScrollShiftDiff !== 0) {\r\n // If main scroll is shifted right\r\n if (mainScrollShiftDiff > 0 /*&& isRightToLeft*/) {\r\n mainScroll.moveTo(Math.max(newMainScrollX, currSlideMainScrollX), true);\r\n return true;\r\n } else if (mainScrollShiftDiff < 0 /*&& isLeftToRight*/) {\r\n // Main scroll is shifted left (Position is less than 0 comparing to the viewport 0)\r\n mainScroll.moveTo(Math.min(newMainScrollX, currSlideMainScrollX), true);\r\n return true;\r\n }\r\n } else {\r\n // We are within pan bounds, so just pan\r\n this._setPanWithFriction(axis, newPan);\r\n }\r\n }\r\n } else {\r\n if (axis === 'y') {\r\n // Do not pan vertically if main scroll is shifted o\r\n if (!mainScroll.isShifted() && bounds.min.y !== bounds.max.y) {\r\n this._setPanWithFriction(axis, newPan);\r\n }\r\n } else {\r\n this._setPanWithFriction(axis, newPan);\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n // If we move above - the ratio is negative\r\n // If we move below the ratio is positive\r\n\r\n /**\r\n * Relation between pan Y position and third of viewport height.\r\n *\r\n * When we are at initial position (center bounds) - the ratio is 0,\r\n * if position is shifted upwards - the ratio is negative,\r\n * if position is shifted downwards - the ratio is positive.\r\n *\r\n * @private\r\n * @param {number} panY The current pan Y position.\r\n * @returns {number}\r\n */\r\n _getVerticalDragRatio(panY) {\r\n return (panY - (this.pswp.currSlide?.bounds.center.y ?? 0)) / (this.pswp.viewportSize.y / 3);\r\n }\r\n\r\n /**\r\n * Set pan position of the current slide.\r\n * Apply friction if the position is beyond the pan bounds,\r\n * or if custom friction is defined.\r\n *\r\n * @private\r\n * @param {'x' | 'y'} axis\r\n * @param {number} potentialPan\r\n * @param {number} [customFriction] (0.1 - 1)\r\n */\r\n _setPanWithFriction(axis, potentialPan, customFriction) {\r\n const { currSlide } = this.pswp;\r\n\r\n if (!currSlide) {\r\n return;\r\n }\r\n\r\n const { pan, bounds } = currSlide;\r\n const correctedPan = bounds.correctPan(axis, potentialPan);\r\n // If we are out of pan bounds\r\n if (correctedPan !== potentialPan || customFriction) {\r\n const delta = Math.round(potentialPan - pan[axis]);\r\n pan[axis] += delta * (customFriction || PAN_END_FRICTION);\r\n } else {\r\n pan[axis] = potentialPan;\r\n }\r\n }\r\n}\r\n\r\nexport default DragHandler;\r\n", "import {\r\n equalizePoints, getDistanceBetween, clamp, pointsEqual\r\n} from '../util/util.js';\r\n\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n/** @typedef {import('./gestures.js').default} Gestures */\r\n\r\nconst UPPER_ZOOM_FRICTION = 0.05;\r\nconst LOWER_ZOOM_FRICTION = 0.15;\r\n\r\n\r\n/**\r\n * Get center point between two points\r\n *\r\n * @param {Point} p\r\n * @param {Point} p1\r\n * @param {Point} p2\r\n * @returns {Point}\r\n */\r\nfunction getZoomPointsCenter(p, p1, p2) {\r\n p.x = (p1.x + p2.x) / 2;\r\n p.y = (p1.y + p2.y) / 2;\r\n return p;\r\n}\r\n\r\nclass ZoomHandler {\r\n /**\r\n * @param {Gestures} gestures\r\n */\r\n constructor(gestures) {\r\n this.gestures = gestures;\r\n /**\r\n * @private\r\n * @type {Point}\r\n */\r\n this._startPan = { x: 0, y: 0 };\r\n /**\r\n * @private\r\n * @type {Point}\r\n */\r\n this._startZoomPoint = { x: 0, y: 0 };\r\n /**\r\n * @private\r\n * @type {Point}\r\n */\r\n this._zoomPoint = { x: 0, y: 0 };\r\n /** @private */\r\n this._wasOverFitZoomLevel = false;\r\n /** @private */\r\n this._startZoomLevel = 1;\r\n }\r\n\r\n start() {\r\n const { currSlide } = this.gestures.pswp;\r\n if (currSlide) {\r\n this._startZoomLevel = currSlide.currZoomLevel;\r\n equalizePoints(this._startPan, currSlide.pan);\r\n }\r\n\r\n this.gestures.pswp.animations.stopAllPan();\r\n this._wasOverFitZoomLevel = false;\r\n }\r\n\r\n change() {\r\n const { p1, startP1, p2, startP2, pswp } = this.gestures;\r\n const { currSlide } = pswp;\r\n\r\n if (!currSlide) {\r\n return;\r\n }\r\n\r\n const minZoomLevel = currSlide.zoomLevels.min;\r\n const maxZoomLevel = currSlide.zoomLevels.max;\r\n\r\n if (!currSlide.isZoomable() || pswp.mainScroll.isShifted()) {\r\n return;\r\n }\r\n\r\n getZoomPointsCenter(this._startZoomPoint, startP1, startP2);\r\n getZoomPointsCenter(this._zoomPoint, p1, p2);\r\n\r\n let currZoomLevel = (1 / getDistanceBetween(startP1, startP2))\r\n * getDistanceBetween(p1, p2)\r\n * this._startZoomLevel;\r\n\r\n // slightly over the zoom.fit\r\n if (currZoomLevel > currSlide.zoomLevels.initial + (currSlide.zoomLevels.initial / 15)) {\r\n this._wasOverFitZoomLevel = true;\r\n }\r\n\r\n if (currZoomLevel < minZoomLevel) {\r\n if (pswp.options.pinchToClose\r\n && !this._wasOverFitZoomLevel\r\n && this._startZoomLevel <= currSlide.zoomLevels.initial) {\r\n // fade out background if zooming out\r\n const bgOpacity = 1 - ((minZoomLevel - currZoomLevel) / (minZoomLevel / 1.2));\r\n if (!pswp.dispatch('pinchClose', { bgOpacity }).defaultPrevented) {\r\n pswp.applyBgOpacity(bgOpacity);\r\n }\r\n } else {\r\n // Apply the friction if zoom level is below the min\r\n currZoomLevel = minZoomLevel - (minZoomLevel - currZoomLevel) * LOWER_ZOOM_FRICTION;\r\n }\r\n } else if (currZoomLevel > maxZoomLevel) {\r\n // Apply the friction if zoom level is above the max\r\n currZoomLevel = maxZoomLevel + (currZoomLevel - maxZoomLevel) * UPPER_ZOOM_FRICTION;\r\n }\r\n\r\n currSlide.pan.x = this._calculatePanForZoomLevel('x', currZoomLevel);\r\n currSlide.pan.y = this._calculatePanForZoomLevel('y', currZoomLevel);\r\n\r\n currSlide.setZoomLevel(currZoomLevel);\r\n currSlide.applyCurrentZoomPan();\r\n }\r\n\r\n end() {\r\n const { pswp } = this.gestures;\r\n const { currSlide } = pswp;\r\n if ((!currSlide || currSlide.currZoomLevel < currSlide.zoomLevels.initial)\r\n && !this._wasOverFitZoomLevel\r\n && pswp.options.pinchToClose) {\r\n pswp.close();\r\n } else {\r\n this.correctZoomPan();\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {'x' | 'y'} axis\r\n * @param {number} currZoomLevel\r\n * @returns {number}\r\n */\r\n _calculatePanForZoomLevel(axis, currZoomLevel) {\r\n const zoomFactor = currZoomLevel / this._startZoomLevel;\r\n return this._zoomPoint[axis]\r\n - ((this._startZoomPoint[axis] - this._startPan[axis]) * zoomFactor);\r\n }\r\n\r\n /**\r\n * Correct currZoomLevel and pan if they are\r\n * beyond minimum or maximum values.\r\n * With animation.\r\n *\r\n * @param {boolean} [ignoreGesture]\r\n * Wether gesture coordinates should be ignored when calculating destination pan position.\r\n */\r\n correctZoomPan(ignoreGesture) {\r\n const { pswp } = this.gestures;\r\n const { currSlide } = pswp;\r\n\r\n if (!currSlide?.isZoomable()) {\r\n return;\r\n }\r\n\r\n if (this._zoomPoint.x === 0) {\r\n ignoreGesture = true;\r\n }\r\n\r\n const prevZoomLevel = currSlide.currZoomLevel;\r\n\r\n /** @type {number} */\r\n let destinationZoomLevel;\r\n let currZoomLevelNeedsChange = true;\r\n\r\n if (prevZoomLevel < currSlide.zoomLevels.initial) {\r\n destinationZoomLevel = currSlide.zoomLevels.initial;\r\n // zoom to min\r\n } else if (prevZoomLevel > currSlide.zoomLevels.max) {\r\n destinationZoomLevel = currSlide.zoomLevels.max;\r\n // zoom to max\r\n } else {\r\n currZoomLevelNeedsChange = false;\r\n destinationZoomLevel = prevZoomLevel;\r\n }\r\n\r\n const initialBgOpacity = pswp.bgOpacity;\r\n const restoreBgOpacity = pswp.bgOpacity < 1;\r\n\r\n const initialPan = equalizePoints({ x: 0, y: 0 }, currSlide.pan);\r\n let destinationPan = equalizePoints({ x: 0, y: 0 }, initialPan);\r\n\r\n if (ignoreGesture) {\r\n this._zoomPoint.x = 0;\r\n this._zoomPoint.y = 0;\r\n this._startZoomPoint.x = 0;\r\n this._startZoomPoint.y = 0;\r\n this._startZoomLevel = prevZoomLevel;\r\n equalizePoints(this._startPan, initialPan);\r\n }\r\n\r\n if (currZoomLevelNeedsChange) {\r\n destinationPan = {\r\n x: this._calculatePanForZoomLevel('x', destinationZoomLevel),\r\n y: this._calculatePanForZoomLevel('y', destinationZoomLevel)\r\n };\r\n }\r\n\r\n // set zoom level, so pan bounds are updated according to it\r\n currSlide.setZoomLevel(destinationZoomLevel);\r\n\r\n destinationPan = {\r\n x: currSlide.bounds.correctPan('x', destinationPan.x),\r\n y: currSlide.bounds.correctPan('y', destinationPan.y)\r\n };\r\n\r\n // return zoom level and its bounds to initial\r\n currSlide.setZoomLevel(prevZoomLevel);\r\n\r\n const panNeedsChange = !pointsEqual(destinationPan, initialPan);\r\n\r\n if (!panNeedsChange && !currZoomLevelNeedsChange && !restoreBgOpacity) {\r\n // update resolution after gesture\r\n currSlide._setResolution(destinationZoomLevel);\r\n currSlide.applyCurrentZoomPan();\r\n\r\n // nothing to animate\r\n return;\r\n }\r\n\r\n pswp.animations.stopAllPan();\r\n\r\n pswp.animations.startSpring({\r\n isPan: true,\r\n start: 0,\r\n end: 1000,\r\n velocity: 0,\r\n dampingRatio: 1,\r\n naturalFrequency: 40,\r\n onUpdate: (now) => {\r\n now /= 1000; // 0 - start, 1 - end\r\n\r\n if (panNeedsChange || currZoomLevelNeedsChange) {\r\n if (panNeedsChange) {\r\n currSlide.pan.x = initialPan.x + (destinationPan.x - initialPan.x) * now;\r\n currSlide.pan.y = initialPan.y + (destinationPan.y - initialPan.y) * now;\r\n }\r\n\r\n if (currZoomLevelNeedsChange) {\r\n const newZoomLevel = prevZoomLevel\r\n + (destinationZoomLevel - prevZoomLevel) * now;\r\n currSlide.setZoomLevel(newZoomLevel);\r\n }\r\n\r\n currSlide.applyCurrentZoomPan();\r\n }\r\n\r\n // Restore background opacity\r\n if (restoreBgOpacity && pswp.bgOpacity < 1) {\r\n // We clamp opacity to keep it between 0 and 1.\r\n // As progress ratio can be larger than 1 due to overshoot,\r\n // and we do not want to bounce opacity.\r\n pswp.applyBgOpacity(clamp(\r\n initialBgOpacity + (1 - initialBgOpacity) * now, 0, 1\r\n ));\r\n }\r\n },\r\n onComplete: () => {\r\n // update resolution after transition ends\r\n currSlide._setResolution(destinationZoomLevel);\r\n currSlide.applyCurrentZoomPan();\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default ZoomHandler;\r\n", "/**\r\n * @template {string} T\r\n * @template {string} P\r\n * @typedef {import('../types.js').AddPostfix} AddPostfix\r\n */\r\n\r\n/** @typedef {import('./gestures.js').default} Gestures */\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n\r\n/** @typedef {'imageClick' | 'bgClick' | 'tap' | 'doubleTap'} Actions */\r\n\r\n/**\r\n * Whether the tap was performed on the main slide\r\n * (rather than controls or caption).\r\n *\r\n * @param {PointerEvent} event\r\n * @returns {boolean}\r\n */\r\nfunction didTapOnMainContent(event) {\r\n return !!(/** @type {HTMLElement} */ (event.target).closest('.pswp__container'));\r\n}\r\n\r\n/**\r\n * Tap, double-tap handler.\r\n */\r\nclass TapHandler {\r\n /**\r\n * @param {Gestures} gestures\r\n */\r\n constructor(gestures) {\r\n this.gestures = gestures;\r\n }\r\n\r\n /**\r\n * @param {Point} point\r\n * @param {PointerEvent} originalEvent\r\n */\r\n click(point, originalEvent) {\r\n const targetClassList = /** @type {HTMLElement} */ (originalEvent.target).classList;\r\n const isImageClick = targetClassList.contains('pswp__img');\r\n const isBackgroundClick = targetClassList.contains('pswp__item')\r\n || targetClassList.contains('pswp__zoom-wrap');\r\n\r\n if (isImageClick) {\r\n this._doClickOrTapAction('imageClick', point, originalEvent);\r\n } else if (isBackgroundClick) {\r\n this._doClickOrTapAction('bgClick', point, originalEvent);\r\n }\r\n }\r\n\r\n /**\r\n * @param {Point} point\r\n * @param {PointerEvent} originalEvent\r\n */\r\n tap(point, originalEvent) {\r\n if (didTapOnMainContent(originalEvent)) {\r\n this._doClickOrTapAction('tap', point, originalEvent);\r\n }\r\n }\r\n\r\n /**\r\n * @param {Point} point\r\n * @param {PointerEvent} originalEvent\r\n */\r\n doubleTap(point, originalEvent) {\r\n if (didTapOnMainContent(originalEvent)) {\r\n this._doClickOrTapAction('doubleTap', point, originalEvent);\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {Actions} actionName\r\n * @param {Point} point\r\n * @param {PointerEvent} originalEvent\r\n */\r\n _doClickOrTapAction(actionName, point, originalEvent) {\r\n const { pswp } = this.gestures;\r\n const { currSlide } = pswp;\r\n const actionFullName = /** @type {AddPostfix} */ (actionName + 'Action');\r\n const optionValue = pswp.options[actionFullName];\r\n\r\n if (pswp.dispatch(actionFullName, { point, originalEvent }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (typeof optionValue === 'function') {\r\n optionValue.call(pswp, point, originalEvent);\r\n return;\r\n }\r\n\r\n switch (optionValue) {\r\n case 'close':\r\n case 'next':\r\n pswp[optionValue]();\r\n break;\r\n case 'zoom':\r\n currSlide?.toggleZoom(point);\r\n break;\r\n case 'zoom-or-close':\r\n // by default click zooms current image,\r\n // if it can not be zoomed - gallery will be closed\r\n if (currSlide?.isZoomable()\r\n && currSlide.zoomLevels.secondary !== currSlide.zoomLevels.initial) {\r\n currSlide.toggleZoom(point);\r\n } else if (pswp.options.clickToCloseNonZoomable) {\r\n pswp.close();\r\n }\r\n break;\r\n case 'toggle-controls':\r\n this.gestures.pswp.element?.classList.toggle('pswp--ui-visible');\r\n // if (_controlsVisible) {\r\n // _ui.hideControls();\r\n // } else {\r\n // _ui.showControls();\r\n // }\r\n break;\r\n }\r\n }\r\n}\r\n\r\nexport default TapHandler;\r\n", "import {\r\n equalizePoints, pointsEqual, getDistanceBetween\r\n} from '../util/util.js';\r\n\r\nimport DragHandler from './drag-handler.js';\r\nimport ZoomHandler from './zoom-handler.js';\r\nimport TapHandler from './tap-handler.js';\r\n\r\n/** @typedef {import('../photoswipe.js').default} PhotoSwipe */\r\n/** @typedef {import('../photoswipe.js').Point} Point */\r\n\r\n// How far should user should drag\r\n// until we can determine that the gesture is swipe and its direction\r\nconst AXIS_SWIPE_HYSTERISIS = 10;\r\n//const PAN_END_FRICTION = 0.35;\r\n\r\nconst DOUBLE_TAP_DELAY = 300; // ms\r\nconst MIN_TAP_DISTANCE = 25; // px\r\n\r\n/**\r\n * Gestures class bind touch, pointer or mouse events\r\n * and emits drag to drag-handler and zoom events zoom-handler.\r\n *\r\n * Drag and zoom events are emited in requestAnimationFrame,\r\n * and only when one of pointers was actually changed.\r\n */\r\nclass Gestures {\r\n /**\r\n * @param {PhotoSwipe} pswp\r\n */\r\n constructor(pswp) {\r\n this.pswp = pswp;\r\n\r\n /** @type {'x' | 'y' | null} */\r\n this.dragAxis = null;\r\n\r\n // point objects are defined once and reused\r\n // PhotoSwipe keeps track only of two pointers, others are ignored\r\n /** @type {Point} */\r\n this.p1 = { x: 0, y: 0 }; // the first pressed pointer\r\n /** @type {Point} */\r\n this.p2 = { x: 0, y: 0 }; // the second pressed pointer\r\n /** @type {Point} */\r\n this.prevP1 = { x: 0, y: 0 };\r\n /** @type {Point} */\r\n this.prevP2 = { x: 0, y: 0 };\r\n /** @type {Point} */\r\n this.startP1 = { x: 0, y: 0 };\r\n /** @type {Point} */\r\n this.startP2 = { x: 0, y: 0 };\r\n /** @type {Point} */\r\n this.velocity = { x: 0, y: 0 };\r\n\r\n /** @type {Point}\r\n * @private\r\n */\r\n this._lastStartP1 = { x: 0, y: 0 };\r\n /** @type {Point}\r\n * @private\r\n */\r\n this._intervalP1 = { x: 0, y: 0 };\r\n /** @private */\r\n this._numActivePoints = 0;\r\n /** @type {Point[]}\r\n * @private\r\n */\r\n this._ongoingPointers = [];\r\n /** @private */\r\n this._touchEventEnabled = 'ontouchstart' in window;\r\n /** @private */\r\n this._pointerEventEnabled = !!(window.PointerEvent);\r\n this.supportsTouch = this._touchEventEnabled\r\n || (this._pointerEventEnabled && navigator.maxTouchPoints > 1);\r\n /** @private */\r\n this._numActivePoints = 0;\r\n /** @private */\r\n this._intervalTime = 0;\r\n /** @private */\r\n this._velocityCalculated = false;\r\n this.isMultitouch = false;\r\n this.isDragging = false;\r\n this.isZooming = false;\r\n /** @type {number | null} */\r\n this.raf = null;\r\n /** @type {NodeJS.Timeout | null}\r\n * @private\r\n */\r\n this._tapTimer = null;\r\n\r\n if (!this.supportsTouch) {\r\n // disable pan to next slide for non-touch devices\r\n pswp.options.allowPanToNext = false;\r\n }\r\n\r\n this.drag = new DragHandler(this);\r\n this.zoomLevels = new ZoomHandler(this);\r\n this.tapHandler = new TapHandler(this);\r\n\r\n pswp.on('bindEvents', () => {\r\n pswp.events.add(\r\n pswp.scrollWrap,\r\n 'click',\r\n /** @type EventListener */(this._onClick.bind(this))\r\n );\r\n\r\n if (this._pointerEventEnabled) {\r\n this._bindEvents('pointer', 'down', 'up', 'cancel');\r\n } else if (this._touchEventEnabled) {\r\n this._bindEvents('touch', 'start', 'end', 'cancel');\r\n\r\n // In previous versions we also bound mouse event here,\r\n // in case device supports both touch and mouse events,\r\n // but newer versions of browsers now support PointerEvent.\r\n\r\n // on iOS10 if you bind touchmove/end after touchstart,\r\n // and you don't preventDefault touchstart (which PhotoSwipe does),\r\n // preventDefault will have no effect on touchmove and touchend.\r\n // Unless you bind it previously.\r\n if (pswp.scrollWrap) {\r\n pswp.scrollWrap.ontouchmove = () => {};\r\n pswp.scrollWrap.ontouchend = () => {};\r\n }\r\n } else {\r\n this._bindEvents('mouse', 'down', 'up');\r\n }\r\n });\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {'mouse' | 'touch' | 'pointer'} pref\r\n * @param {'down' | 'start'} down\r\n * @param {'up' | 'end'} up\r\n * @param {'cancel'} [cancel]\r\n */\r\n _bindEvents(pref, down, up, cancel) {\r\n const { pswp } = this;\r\n const { events } = pswp;\r\n\r\n const cancelEvent = cancel ? pref + cancel : '';\r\n\r\n events.add(\r\n pswp.scrollWrap,\r\n pref + down,\r\n /** @type EventListener */(this.onPointerDown.bind(this))\r\n );\r\n events.add(window, pref + 'move', /** @type EventListener */(this.onPointerMove.bind(this)));\r\n events.add(window, pref + up, /** @type EventListener */(this.onPointerUp.bind(this)));\r\n if (cancelEvent) {\r\n events.add(\r\n pswp.scrollWrap,\r\n cancelEvent,\r\n /** @type EventListener */(this.onPointerUp.bind(this))\r\n );\r\n }\r\n }\r\n\r\n /**\r\n * @param {PointerEvent} e\r\n */\r\n onPointerDown(e) {\r\n // We do not call preventDefault for touch events\r\n // to allow browser to show native dialog on longpress\r\n // (the one that allows to save image or open it in new tab).\r\n //\r\n // Desktop Safari allows to drag images when preventDefault isn't called on mousedown,\r\n // even though preventDefault IS called on mousemove. That's why we preventDefault mousedown.\r\n const isMousePointer = e.type === 'mousedown' || e.pointerType === 'mouse';\r\n\r\n // Allow dragging only via left mouse button.\r\n // http://www.quirksmode.org/js/events_properties.html\r\n // https://developer.mozilla.org/en-US/docs/Web/API/event.button\r\n if (isMousePointer && e.button > 0) {\r\n return;\r\n }\r\n\r\n const { pswp } = this;\r\n\r\n // if PhotoSwipe is opening or closing\r\n if (!pswp.opener.isOpen) {\r\n e.preventDefault();\r\n return;\r\n }\r\n\r\n if (pswp.dispatch('pointerDown', { originalEvent: e }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (isMousePointer) {\r\n pswp.mouseDetected();\r\n\r\n // preventDefault mouse event to prevent\r\n // browser image drag feature\r\n this._preventPointerEventBehaviour(e, 'down');\r\n }\r\n\r\n pswp.animations.stopAll();\r\n\r\n this._updatePoints(e, 'down');\r\n\r\n if (this._numActivePoints === 1) {\r\n this.dragAxis = null;\r\n // we need to store initial point to determine the main axis,\r\n // drag is activated only after the axis is determined\r\n equalizePoints(this.startP1, this.p1);\r\n }\r\n\r\n if (this._numActivePoints > 1) {\r\n // Tap or double tap should not trigger if more than one pointer\r\n this._clearTapTimer();\r\n this.isMultitouch = true;\r\n } else {\r\n this.isMultitouch = false;\r\n }\r\n }\r\n\r\n /**\r\n * @param {PointerEvent} e\r\n */\r\n onPointerMove(e) {\r\n this._preventPointerEventBehaviour(e, 'move');\r\n\r\n if (!this._numActivePoints) {\r\n return;\r\n }\r\n\r\n this._updatePoints(e, 'move');\r\n\r\n if (this.pswp.dispatch('pointerMove', { originalEvent: e }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (this._numActivePoints === 1 && !this.isDragging) {\r\n if (!this.dragAxis) {\r\n this._calculateDragDirection();\r\n }\r\n\r\n // Drag axis was detected, emit drag.start\r\n if (this.dragAxis && !this.isDragging) {\r\n if (this.isZooming) {\r\n this.isZooming = false;\r\n this.zoomLevels.end();\r\n }\r\n\r\n this.isDragging = true;\r\n this._clearTapTimer(); // Tap can not trigger after drag\r\n\r\n // Adjust starting point\r\n this._updateStartPoints();\r\n this._intervalTime = Date.now();\r\n //this._startTime = this._intervalTime;\r\n this._velocityCalculated = false;\r\n equalizePoints(this._intervalP1, this.p1);\r\n this.velocity.x = 0;\r\n this.velocity.y = 0;\r\n this.drag.start();\r\n\r\n this._rafStopLoop();\r\n this._rafRenderLoop();\r\n }\r\n } else if (this._numActivePoints > 1 && !this.isZooming) {\r\n this._finishDrag();\r\n\r\n this.isZooming = true;\r\n\r\n // Adjust starting points\r\n this._updateStartPoints();\r\n\r\n this.zoomLevels.start();\r\n\r\n this._rafStopLoop();\r\n this._rafRenderLoop();\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n */\r\n _finishDrag() {\r\n if (this.isDragging) {\r\n this.isDragging = false;\r\n\r\n // Try to calculate velocity,\r\n // if it wasn't calculated yet in drag.change\r\n if (!this._velocityCalculated) {\r\n this._updateVelocity(true);\r\n }\r\n\r\n this.drag.end();\r\n this.dragAxis = null;\r\n }\r\n }\r\n\r\n /**\r\n * @param {PointerEvent} e\r\n */\r\n onPointerUp(e) {\r\n if (!this._numActivePoints) {\r\n return;\r\n }\r\n\r\n this._updatePoints(e, 'up');\r\n\r\n if (this.pswp.dispatch('pointerUp', { originalEvent: e }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (this._numActivePoints === 0) {\r\n this._rafStopLoop();\r\n\r\n if (this.isDragging) {\r\n this._finishDrag();\r\n } else if (!this.isZooming && !this.isMultitouch) {\r\n //this.zoomLevels.correctZoomPan();\r\n this._finishTap(e);\r\n }\r\n }\r\n\r\n if (this._numActivePoints < 2 && this.isZooming) {\r\n this.isZooming = false;\r\n this.zoomLevels.end();\r\n\r\n if (this._numActivePoints === 1) {\r\n // Since we have 1 point left, we need to reinitiate drag\r\n this.dragAxis = null;\r\n this._updateStartPoints();\r\n }\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n */\r\n _rafRenderLoop() {\r\n if (this.isDragging || this.isZooming) {\r\n this._updateVelocity();\r\n\r\n if (this.isDragging) {\r\n // make sure that pointer moved since the last update\r\n if (!pointsEqual(this.p1, this.prevP1)) {\r\n this.drag.change();\r\n }\r\n } else /* if (this.isZooming) */ {\r\n if (!pointsEqual(this.p1, this.prevP1)\r\n || !pointsEqual(this.p2, this.prevP2)) {\r\n this.zoomLevels.change();\r\n }\r\n }\r\n\r\n this._updatePrevPoints();\r\n this.raf = requestAnimationFrame(this._rafRenderLoop.bind(this));\r\n }\r\n }\r\n\r\n /**\r\n * Update velocity at 50ms interval\r\n *\r\n * @private\r\n * @param {boolean} [force]\r\n */\r\n _updateVelocity(force) {\r\n const time = Date.now();\r\n const duration = time - this._intervalTime;\r\n\r\n if (duration < 50 && !force) {\r\n return;\r\n }\r\n\r\n\r\n this.velocity.x = this._getVelocity('x', duration);\r\n this.velocity.y = this._getVelocity('y', duration);\r\n\r\n this._intervalTime = time;\r\n equalizePoints(this._intervalP1, this.p1);\r\n this._velocityCalculated = true;\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {PointerEvent} e\r\n */\r\n _finishTap(e) {\r\n const { mainScroll } = this.pswp;\r\n\r\n // Do not trigger tap events if main scroll is shifted\r\n if (mainScroll.isShifted()) {\r\n // restore main scroll position\r\n // (usually happens if stopped in the middle of animation)\r\n mainScroll.moveIndexBy(0, true);\r\n return;\r\n }\r\n\r\n // Do not trigger tap for touchcancel or pointercancel\r\n if (e.type.indexOf('cancel') > 0) {\r\n return;\r\n }\r\n\r\n // Trigger click instead of tap for mouse events\r\n if (e.type === 'mouseup' || e.pointerType === 'mouse') {\r\n this.tapHandler.click(this.startP1, e);\r\n return;\r\n }\r\n\r\n // Disable delay if there is no doubleTapAction\r\n const tapDelay = this.pswp.options.doubleTapAction ? DOUBLE_TAP_DELAY : 0;\r\n\r\n // If tapTimer is defined - we tapped recently,\r\n // check if the current tap is close to the previous one,\r\n // if yes - trigger double tap\r\n if (this._tapTimer) {\r\n this._clearTapTimer();\r\n // Check if two taps were more or less on the same place\r\n if (getDistanceBetween(this._lastStartP1, this.startP1) < MIN_TAP_DISTANCE) {\r\n this.tapHandler.doubleTap(this.startP1, e);\r\n }\r\n } else {\r\n equalizePoints(this._lastStartP1, this.startP1);\r\n this._tapTimer = setTimeout(() => {\r\n this.tapHandler.tap(this.startP1, e);\r\n this._clearTapTimer();\r\n }, tapDelay);\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n */\r\n _clearTapTimer() {\r\n if (this._tapTimer) {\r\n clearTimeout(this._tapTimer);\r\n this._tapTimer = null;\r\n }\r\n }\r\n\r\n /**\r\n * Get velocity for axis\r\n *\r\n * @private\r\n * @param {'x' | 'y'} axis\r\n * @param {number} duration\r\n * @returns {number}\r\n */\r\n _getVelocity(axis, duration) {\r\n // displacement is like distance, but can be negative.\r\n const displacement = this.p1[axis] - this._intervalP1[axis];\r\n\r\n if (Math.abs(displacement) > 1 && duration > 5) {\r\n return displacement / duration;\r\n }\r\n\r\n return 0;\r\n }\r\n\r\n /**\r\n * @private\r\n */\r\n _rafStopLoop() {\r\n if (this.raf) {\r\n cancelAnimationFrame(this.raf);\r\n this.raf = null;\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {PointerEvent} e\r\n * @param {'up' | 'down' | 'move'} pointerType Normalized pointer type\r\n */\r\n _preventPointerEventBehaviour(e, pointerType) {\r\n const preventPointerEvent = this.pswp.applyFilters('preventPointerEvent', true, e, pointerType);\r\n if (preventPointerEvent) {\r\n e.preventDefault();\r\n }\r\n }\r\n\r\n /**\r\n * Parses and normalizes points from the touch, mouse or pointer event.\r\n * Updates p1 and p2.\r\n *\r\n * @private\r\n * @param {PointerEvent | TouchEvent} e\r\n * @param {'up' | 'down' | 'move'} pointerType Normalized pointer type\r\n */\r\n _updatePoints(e, pointerType) {\r\n if (this._pointerEventEnabled) {\r\n const pointerEvent = /** @type {PointerEvent} */ (e);\r\n // Try to find the current pointer in ongoing pointers by its ID\r\n const pointerIndex = this._ongoingPointers.findIndex((ongoingPointer) => {\r\n return ongoingPointer.id === pointerEvent.pointerId;\r\n });\r\n\r\n if (pointerType === 'up' && pointerIndex > -1) {\r\n // release the pointer - remove it from ongoing\r\n this._ongoingPointers.splice(pointerIndex, 1);\r\n } else if (pointerType === 'down' && pointerIndex === -1) {\r\n // add new pointer\r\n this._ongoingPointers.push(this._convertEventPosToPoint(pointerEvent, { x: 0, y: 0 }));\r\n } else if (pointerIndex > -1) {\r\n // update existing pointer\r\n this._convertEventPosToPoint(pointerEvent, this._ongoingPointers[pointerIndex]);\r\n }\r\n\r\n this._numActivePoints = this._ongoingPointers.length;\r\n\r\n // update points that PhotoSwipe uses\r\n // to calculate position and scale\r\n if (this._numActivePoints > 0) {\r\n equalizePoints(this.p1, this._ongoingPointers[0]);\r\n }\r\n\r\n if (this._numActivePoints > 1) {\r\n equalizePoints(this.p2, this._ongoingPointers[1]);\r\n }\r\n } else {\r\n const touchEvent = /** @type {TouchEvent} */ (e);\r\n\r\n this._numActivePoints = 0;\r\n if (touchEvent.type.indexOf('touch') > -1) {\r\n // Touch Event\r\n // https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent\r\n if (touchEvent.touches && touchEvent.touches.length > 0) {\r\n this._convertEventPosToPoint(touchEvent.touches[0], this.p1);\r\n this._numActivePoints++;\r\n if (touchEvent.touches.length > 1) {\r\n this._convertEventPosToPoint(touchEvent.touches[1], this.p2);\r\n this._numActivePoints++;\r\n }\r\n }\r\n } else {\r\n // Mouse Event\r\n this._convertEventPosToPoint(/** @type {PointerEvent} */ (e), this.p1);\r\n if (pointerType === 'up') {\r\n // clear all points on mouseup\r\n this._numActivePoints = 0;\r\n } else {\r\n this._numActivePoints++;\r\n }\r\n }\r\n }\r\n }\r\n\r\n /** update points that were used during previous rAF tick\r\n * @private\r\n */\r\n _updatePrevPoints() {\r\n equalizePoints(this.prevP1, this.p1);\r\n equalizePoints(this.prevP2, this.p2);\r\n }\r\n\r\n /** update points at the start of gesture\r\n * @private\r\n */\r\n _updateStartPoints() {\r\n equalizePoints(this.startP1, this.p1);\r\n equalizePoints(this.startP2, this.p2);\r\n this._updatePrevPoints();\r\n }\r\n\r\n /** @private */\r\n _calculateDragDirection() {\r\n if (this.pswp.mainScroll.isShifted()) {\r\n // if main scroll position is shifted – direction is always horizontal\r\n this.dragAxis = 'x';\r\n } else {\r\n // calculate delta of the last touchmove tick\r\n const diff = Math.abs(this.p1.x - this.startP1.x) - Math.abs(this.p1.y - this.startP1.y);\r\n\r\n if (diff !== 0) {\r\n // check if pointer was shifted horizontally or vertically\r\n const axisToCheck = diff > 0 ? 'x' : 'y';\r\n\r\n if (Math.abs(this.p1[axisToCheck] - this.startP1[axisToCheck]) >= AXIS_SWIPE_HYSTERISIS) {\r\n this.dragAxis = axisToCheck;\r\n }\r\n }\r\n }\r\n }\r\n\r\n /**\r\n * Converts touch, pointer or mouse event\r\n * to PhotoSwipe point.\r\n *\r\n * @private\r\n * @param {Touch | PointerEvent} e\r\n * @param {Point} p\r\n * @returns {Point}\r\n */\r\n _convertEventPosToPoint(e, p) {\r\n p.x = e.pageX - this.pswp.offset.x;\r\n p.y = e.pageY - this.pswp.offset.y;\r\n\r\n if ('pointerId' in e) {\r\n p.id = e.pointerId;\r\n } else if (e.identifier !== undefined) {\r\n p.id = e.identifier;\r\n }\r\n\r\n return p;\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {PointerEvent} e\r\n */\r\n _onClick(e) {\r\n // Do not allow click event to pass through after drag\r\n if (this.pswp.mainScroll.isShifted()) {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n }\r\n }\r\n}\r\n\r\nexport default Gestures;\r\n", "import {\r\n setTransform,\r\n createElement,\r\n} from './util/util.js';\r\n\r\n/** @typedef {import('./photoswipe.js').default} PhotoSwipe */\r\n/** @typedef {import('./slide/slide.js').default} Slide */\r\n\r\n/** @typedef {{ el: HTMLDivElement; slide?: Slide }} ItemHolder */\r\n\r\nconst MAIN_SCROLL_END_FRICTION = 0.35;\r\n\r\n\r\n// const MIN_SWIPE_TRANSITION_DURATION = 250;\r\n// const MAX_SWIPE_TRABSITION_DURATION = 500;\r\n// const DEFAULT_SWIPE_TRANSITION_DURATION = 333;\r\n\r\n/**\r\n * Handles movement of the main scrolling container\r\n * (for example, it repositions when user swipes left or right).\r\n *\r\n * Also stores its state.\r\n */\r\nclass MainScroll {\r\n /**\r\n * @param {PhotoSwipe} pswp\r\n */\r\n constructor(pswp) {\r\n this.pswp = pswp;\r\n this.x = 0;\r\n this.slideWidth = 0;\r\n /** @private */\r\n this._currPositionIndex = 0;\r\n /** @private */\r\n this._prevPositionIndex = 0;\r\n /** @private */\r\n this._containerShiftIndex = -1;\r\n\r\n /** @type {ItemHolder[]} */\r\n this.itemHolders = [];\r\n }\r\n\r\n /**\r\n * Position the scroller and slide containers\r\n * according to viewport size.\r\n *\r\n * @param {boolean} [resizeSlides] Whether slides content should resized\r\n */\r\n resize(resizeSlides) {\r\n const { pswp } = this;\r\n const newSlideWidth = Math.round(\r\n pswp.viewportSize.x + pswp.viewportSize.x * pswp.options.spacing\r\n );\r\n // Mobile browsers might trigger a resize event during a gesture.\r\n // (due to toolbar appearing or hiding).\r\n // Avoid re-adjusting main scroll position if width wasn't changed\r\n const slideWidthChanged = (newSlideWidth !== this.slideWidth);\r\n\r\n if (slideWidthChanged) {\r\n this.slideWidth = newSlideWidth;\r\n this.moveTo(this.getCurrSlideX());\r\n }\r\n\r\n this.itemHolders.forEach((itemHolder, index) => {\r\n if (slideWidthChanged) {\r\n setTransform(itemHolder.el, (index + this._containerShiftIndex)\r\n * this.slideWidth);\r\n }\r\n\r\n if (resizeSlides && itemHolder.slide) {\r\n itemHolder.slide.resize();\r\n }\r\n });\r\n }\r\n\r\n /**\r\n * Reset X position of the main scroller to zero\r\n */\r\n resetPosition() {\r\n // Position on the main scroller (offset)\r\n // it is independent from slide index\r\n this._currPositionIndex = 0;\r\n this._prevPositionIndex = 0;\r\n\r\n // This will force recalculation of size on next resize()\r\n this.slideWidth = 0;\r\n\r\n // _containerShiftIndex*viewportSize will give you amount of transform of the current slide\r\n this._containerShiftIndex = -1;\r\n }\r\n\r\n /**\r\n * Create and append array of three items\r\n * that hold data about slides in DOM\r\n */\r\n appendHolders() {\r\n this.itemHolders = [];\r\n\r\n // append our three slide holders -\r\n // previous, current, and next\r\n for (let i = 0; i < 3; i++) {\r\n const el = createElement('pswp__item', 'div', this.pswp.container);\r\n el.setAttribute('role', 'group');\r\n el.setAttribute('aria-roledescription', 'slide');\r\n el.setAttribute('aria-hidden', 'true');\r\n\r\n // hide nearby item holders until initial zoom animation finishes (to avoid extra Paints)\r\n el.style.display = (i === 1) ? 'block' : 'none';\r\n\r\n this.itemHolders.push({\r\n el,\r\n //index: -1\r\n });\r\n }\r\n }\r\n\r\n /**\r\n * Whether the main scroll can be horizontally swiped to the next or previous slide.\r\n * @returns {boolean}\r\n */\r\n canBeSwiped() {\r\n return this.pswp.getNumItems() > 1;\r\n }\r\n\r\n /**\r\n * Move main scroll by X amount of slides.\r\n * For example:\r\n * `-1` will move to the previous slide,\r\n * `0` will reset the scroll position of the current slide,\r\n * `3` will move three slides forward\r\n *\r\n * If loop option is enabled - index will be automatically looped too,\r\n * (for example `-1` will move to the last slide of the gallery).\r\n *\r\n * @param {number} diff\r\n * @param {boolean} [animate]\r\n * @param {number} [velocityX]\r\n * @returns {boolean} whether index was changed or not\r\n */\r\n moveIndexBy(diff, animate, velocityX) {\r\n const { pswp } = this;\r\n let newIndex = pswp.potentialIndex + diff;\r\n const numSlides = pswp.getNumItems();\r\n\r\n if (pswp.canLoop()) {\r\n newIndex = pswp.getLoopedIndex(newIndex);\r\n const distance = (diff + numSlides) % numSlides;\r\n if (distance <= numSlides / 2) {\r\n // go forward\r\n diff = distance;\r\n } else {\r\n // go backwards\r\n diff = distance - numSlides;\r\n }\r\n } else {\r\n if (newIndex < 0) {\r\n newIndex = 0;\r\n } else if (newIndex >= numSlides) {\r\n newIndex = numSlides - 1;\r\n }\r\n diff = newIndex - pswp.potentialIndex;\r\n }\r\n\r\n pswp.potentialIndex = newIndex;\r\n this._currPositionIndex -= diff;\r\n\r\n pswp.animations.stopMainScroll();\r\n\r\n const destinationX = this.getCurrSlideX();\r\n if (!animate) {\r\n this.moveTo(destinationX);\r\n this.updateCurrItem();\r\n } else {\r\n pswp.animations.startSpring({\r\n isMainScroll: true,\r\n start: this.x,\r\n end: destinationX,\r\n velocity: velocityX || 0,\r\n naturalFrequency: 30,\r\n dampingRatio: 1, //0.7,\r\n onUpdate: (x) => {\r\n this.moveTo(x);\r\n },\r\n onComplete: () => {\r\n this.updateCurrItem();\r\n pswp.appendHeavy();\r\n }\r\n });\r\n\r\n let currDiff = pswp.potentialIndex - pswp.currIndex;\r\n if (pswp.canLoop()) {\r\n const currDistance = (currDiff + numSlides) % numSlides;\r\n if (currDistance <= numSlides / 2) {\r\n // go forward\r\n currDiff = currDistance;\r\n } else {\r\n // go backwards\r\n currDiff = currDistance - numSlides;\r\n }\r\n }\r\n\r\n // Force-append new slides during transition\r\n // if difference between slides is more than 1\r\n if (Math.abs(currDiff) > 1) {\r\n this.updateCurrItem();\r\n }\r\n }\r\n\r\n return Boolean(diff);\r\n }\r\n\r\n /**\r\n * X position of the main scroll for the current slide\r\n * (ignores position during dragging)\r\n * @returns {number}\r\n */\r\n getCurrSlideX() {\r\n return this.slideWidth * this._currPositionIndex;\r\n }\r\n\r\n /**\r\n * Whether scroll position is shifted.\r\n * For example, it will return true if the scroll is being dragged or animated.\r\n * @returns {boolean}\r\n */\r\n isShifted() {\r\n return this.x !== this.getCurrSlideX();\r\n }\r\n\r\n /**\r\n * Update slides X positions and set their content\r\n */\r\n updateCurrItem() {\r\n const { pswp } = this;\r\n const positionDifference = this._prevPositionIndex - this._currPositionIndex;\r\n\r\n if (!positionDifference) {\r\n return;\r\n }\r\n\r\n this._prevPositionIndex = this._currPositionIndex;\r\n\r\n pswp.currIndex = pswp.potentialIndex;\r\n\r\n let diffAbs = Math.abs(positionDifference);\r\n /** @type {ItemHolder | undefined} */\r\n let tempHolder;\r\n\r\n if (diffAbs >= 3) {\r\n this._containerShiftIndex += positionDifference + (positionDifference > 0 ? -3 : 3);\r\n diffAbs = 3;\r\n\r\n // If slides are changed by 3 screens or more - clean up previous slides\r\n this.itemHolders.forEach((itemHolder) => {\r\n itemHolder.slide?.destroy();\r\n itemHolder.slide = undefined;\r\n });\r\n }\r\n\r\n for (let i = 0; i < diffAbs; i++) {\r\n if (positionDifference > 0) {\r\n tempHolder = this.itemHolders.shift();\r\n if (tempHolder) {\r\n this.itemHolders[2] = tempHolder; // move first to last\r\n\r\n this._containerShiftIndex++;\r\n\r\n setTransform(tempHolder.el, (this._containerShiftIndex + 2) * this.slideWidth);\r\n\r\n pswp.setContent(tempHolder, (pswp.currIndex - diffAbs) + i + 2);\r\n }\r\n } else {\r\n tempHolder = this.itemHolders.pop();\r\n if (tempHolder) {\r\n this.itemHolders.unshift(tempHolder); // move last to first\r\n\r\n this._containerShiftIndex--;\r\n\r\n setTransform(tempHolder.el, this._containerShiftIndex * this.slideWidth);\r\n\r\n pswp.setContent(tempHolder, (pswp.currIndex + diffAbs) - i - 2);\r\n }\r\n }\r\n }\r\n\r\n // Reset transfrom every 50ish navigations in one direction.\r\n //\r\n // Otherwise transform will keep growing indefinitely,\r\n // which might cause issues as browsers have a maximum transform limit.\r\n // I wasn't able to reach it, but just to be safe.\r\n // This should not cause noticable lag.\r\n if (Math.abs(this._containerShiftIndex) > 50 && !this.isShifted()) {\r\n this.resetPosition();\r\n this.resize();\r\n }\r\n\r\n // Pan transition might be running (and consntantly updating pan position)\r\n pswp.animations.stopAllPan();\r\n\r\n this.itemHolders.forEach((itemHolder, i) => {\r\n if (itemHolder.slide) {\r\n // Slide in the 2nd holder is always active\r\n itemHolder.slide.setIsActive(i === 1);\r\n }\r\n });\r\n\r\n pswp.currSlide = this.itemHolders[1]?.slide;\r\n pswp.contentLoader.updateLazy(positionDifference);\r\n\r\n if (pswp.currSlide) {\r\n pswp.currSlide.applyCurrentZoomPan();\r\n }\r\n\r\n pswp.dispatch('change');\r\n }\r\n\r\n /**\r\n * Move the X position of the main scroll container\r\n *\r\n * @param {number} x\r\n * @param {boolean} [dragging]\r\n */\r\n moveTo(x, dragging) {\r\n if (!this.pswp.canLoop() && dragging) {\r\n // Apply friction\r\n let newSlideIndexOffset = ((this.slideWidth * this._currPositionIndex) - x) / this.slideWidth;\r\n newSlideIndexOffset += this.pswp.currIndex;\r\n const delta = Math.round(x - this.x);\r\n\r\n if ((newSlideIndexOffset < 0 && delta > 0)\r\n || (newSlideIndexOffset >= this.pswp.getNumItems() - 1 && delta < 0)) {\r\n x = this.x + (delta * MAIN_SCROLL_END_FRICTION);\r\n }\r\n }\r\n\r\n this.x = x;\r\n\r\n if (this.pswp.container) {\r\n setTransform(this.pswp.container, x);\r\n }\r\n\r\n this.pswp.dispatch('moveMainScroll', { x, dragging: dragging ?? false });\r\n }\r\n}\r\n\r\nexport default MainScroll;\r\n", "import { specialKeyUsed } from './util/util.js';\r\n\r\n/** @typedef {import('./photoswipe.js').default} PhotoSwipe */\r\n\r\n/**\r\n * @template T\r\n * @typedef {import('./types.js').Methods} Methods\r\n */\r\n\r\nconst KeyboardKeyCodesMap = {\r\n Escape: 27,\r\n z: 90,\r\n ArrowLeft: 37,\r\n ArrowUp: 38,\r\n ArrowRight: 39,\r\n ArrowDown: 40,\r\n Tab: 9,\r\n};\r\n\r\n/**\r\n * @template {keyof KeyboardKeyCodesMap} T\r\n * @param {T} key\r\n * @param {boolean} isKeySupported\r\n * @returns {T | number | undefined}\r\n */\r\nconst getKeyboardEventKey = (key, isKeySupported) => {\r\n return isKeySupported ? key : KeyboardKeyCodesMap[key];\r\n};\r\n\r\n/**\r\n * - Manages keyboard shortcuts.\r\n * - Helps trap focus within photoswipe.\r\n */\r\nclass Keyboard {\r\n /**\r\n * @param {PhotoSwipe} pswp\r\n */\r\n constructor(pswp) {\r\n this.pswp = pswp;\r\n /** @private */\r\n this._wasFocused = false;\r\n\r\n pswp.on('bindEvents', () => {\r\n if (pswp.options.trapFocus) {\r\n // Dialog was likely opened by keyboard if initial point is not defined\r\n if (!pswp.options.initialPointerPos) {\r\n // focus causes layout,\r\n // which causes lag during the animation,\r\n // that's why we delay it until the opener transition ends\r\n this._focusRoot();\r\n }\r\n\r\n pswp.events.add(\r\n document,\r\n 'focusin',\r\n /** @type EventListener */(this._onFocusIn.bind(this))\r\n );\r\n }\r\n\r\n pswp.events.add(document, 'keydown', /** @type EventListener */(this._onKeyDown.bind(this)));\r\n });\r\n\r\n const lastActiveElement = /** @type {HTMLElement} */ (document.activeElement);\r\n pswp.on('destroy', () => {\r\n if (pswp.options.returnFocus\r\n && lastActiveElement\r\n && this._wasFocused) {\r\n lastActiveElement.focus();\r\n }\r\n });\r\n }\r\n\r\n /** @private */\r\n _focusRoot() {\r\n if (!this._wasFocused && this.pswp.element) {\r\n this.pswp.element.focus();\r\n this._wasFocused = true;\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {KeyboardEvent} e\r\n */\r\n _onKeyDown(e) {\r\n const { pswp } = this;\r\n\r\n if (pswp.dispatch('keydown', { originalEvent: e }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (specialKeyUsed(e)) {\r\n // don't do anything if special key pressed\r\n // to prevent from overriding default browser actions\r\n // for example, in Chrome on Mac cmd+arrow-left returns to previous page\r\n return;\r\n }\r\n\r\n /** @type {Methods | undefined} */\r\n let keydownAction;\r\n /** @type {'x' | 'y' | undefined} */\r\n let axis;\r\n let isForward = false;\r\n const isKeySupported = 'key' in e;\r\n\r\n switch (isKeySupported ? e.key : e.keyCode) {\r\n case getKeyboardEventKey('Escape', isKeySupported):\r\n if (pswp.options.escKey) {\r\n keydownAction = 'close';\r\n }\r\n break;\r\n case getKeyboardEventKey('z', isKeySupported):\r\n keydownAction = 'toggleZoom';\r\n break;\r\n case getKeyboardEventKey('ArrowLeft', isKeySupported):\r\n axis = 'x';\r\n break;\r\n case getKeyboardEventKey('ArrowUp', isKeySupported):\r\n axis = 'y';\r\n break;\r\n case getKeyboardEventKey('ArrowRight', isKeySupported):\r\n axis = 'x';\r\n isForward = true;\r\n break;\r\n case getKeyboardEventKey('ArrowDown', isKeySupported):\r\n isForward = true;\r\n axis = 'y';\r\n break;\r\n case getKeyboardEventKey('Tab', isKeySupported):\r\n this._focusRoot();\r\n break;\r\n default:\r\n }\r\n\r\n // if left/right/top/bottom key\r\n if (axis) {\r\n // prevent page scroll\r\n e.preventDefault();\r\n\r\n const { currSlide } = pswp;\r\n\r\n if (pswp.options.arrowKeys\r\n && axis === 'x'\r\n && pswp.getNumItems() > 1) {\r\n keydownAction = isForward ? 'next' : 'prev';\r\n } else if (currSlide && currSlide.currZoomLevel > currSlide.zoomLevels.fit) {\r\n // up/down arrow keys pan the image vertically\r\n // left/right arrow keys pan horizontally.\r\n // Unless there is only one image,\r\n // or arrowKeys option is disabled\r\n currSlide.pan[axis] += isForward ? -80 : 80;\r\n currSlide.panTo(currSlide.pan.x, currSlide.pan.y);\r\n }\r\n }\r\n\r\n if (keydownAction) {\r\n e.preventDefault();\r\n // @ts-ignore\r\n pswp[keydownAction]();\r\n }\r\n }\r\n\r\n /**\r\n * Trap focus inside photoswipe\r\n *\r\n * @private\r\n * @param {FocusEvent} e\r\n */\r\n _onFocusIn(e) {\r\n const { template } = this.pswp;\r\n if (template\r\n && document !== e.target\r\n && template !== e.target\r\n && !template.contains(/** @type {Node} */ (e.target))) {\r\n // focus root element\r\n template.focus();\r\n }\r\n }\r\n}\r\n\r\nexport default Keyboard;\r\n", "import { setTransitionStyle, removeTransitionStyle } from './util.js';\r\n\r\nconst DEFAULT_EASING = 'cubic-bezier(.4,0,.22,1)';\r\n\r\n/** @typedef {import('./animations.js').SharedAnimationProps} SharedAnimationProps */\r\n\r\n/** @typedef {Object} DefaultCssAnimationProps\r\n *\r\n * @prop {HTMLElement} target\r\n * @prop {number} [duration]\r\n * @prop {string} [easing]\r\n * @prop {string} [transform]\r\n * @prop {string} [opacity]\r\n * */\r\n\r\n/** @typedef {SharedAnimationProps & DefaultCssAnimationProps} CssAnimationProps */\r\n\r\n/**\r\n * Runs CSS transition.\r\n */\r\nclass CSSAnimation {\r\n /**\r\n * onComplete can be unpredictable, be careful about current state\r\n *\r\n * @param {CssAnimationProps} props\r\n */\r\n constructor(props) {\r\n this.props = props;\r\n const {\r\n target,\r\n onComplete,\r\n transform,\r\n onFinish = () => {},\r\n duration = 333,\r\n easing = DEFAULT_EASING,\r\n } = props;\r\n\r\n this.onFinish = onFinish;\r\n\r\n // support only transform and opacity\r\n const prop = transform ? 'transform' : 'opacity';\r\n const propValue = props[prop] ?? '';\r\n\r\n /** @private */\r\n this._target = target;\r\n /** @private */\r\n this._onComplete = onComplete;\r\n /** @private */\r\n this._finished = false;\r\n\r\n /** @private */\r\n this._onTransitionEnd = this._onTransitionEnd.bind(this);\r\n\r\n // Using timeout hack to make sure that animation\r\n // starts even if the animated property was changed recently,\r\n // otherwise transitionend might not fire or transition won't start.\r\n // https://drafts.csswg.org/css-transitions/#starting\r\n //\r\n // ¯\\_(ツ)_/¯\r\n /** @private */\r\n this._helperTimeout = setTimeout(() => {\r\n setTransitionStyle(target, prop, duration, easing);\r\n this._helperTimeout = setTimeout(() => {\r\n target.addEventListener('transitionend', this._onTransitionEnd, false);\r\n target.addEventListener('transitioncancel', this._onTransitionEnd, false);\r\n\r\n // Safari occasionally does not emit transitionend event\r\n // if element property was modified during the transition,\r\n // which may be caused by resize or third party component,\r\n // using timeout as a safety fallback\r\n this._helperTimeout = setTimeout(() => {\r\n this._finalizeAnimation();\r\n }, duration + 500);\r\n target.style[prop] = propValue;\r\n }, 30); // Do not reduce this number\r\n }, 0);\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {TransitionEvent} e\r\n */\r\n _onTransitionEnd(e) {\r\n if (e.target === this._target) {\r\n this._finalizeAnimation();\r\n }\r\n }\r\n\r\n /**\r\n * @private\r\n */\r\n _finalizeAnimation() {\r\n if (!this._finished) {\r\n this._finished = true;\r\n this.onFinish();\r\n if (this._onComplete) {\r\n this._onComplete();\r\n }\r\n }\r\n }\r\n\r\n // Destroy is called automatically onFinish\r\n destroy() {\r\n if (this._helperTimeout) {\r\n clearTimeout(this._helperTimeout);\r\n }\r\n removeTransitionStyle(this._target);\r\n this._target.removeEventListener('transitionend', this._onTransitionEnd, false);\r\n this._target.removeEventListener('transitioncancel', this._onTransitionEnd, false);\r\n if (!this._finished) {\r\n this._finalizeAnimation();\r\n }\r\n }\r\n}\r\n\r\nexport default CSSAnimation;\r\n", "const DEFAULT_NATURAL_FREQUENCY = 12;\r\nconst DEFAULT_DAMPING_RATIO = 0.75;\r\n\r\n/**\r\n * Spring easing helper\r\n */\r\nclass SpringEaser {\r\n /**\r\n * @param {number} initialVelocity Initial velocity, px per ms.\r\n *\r\n * @param {number} [dampingRatio]\r\n * Determines how bouncy animation will be.\r\n * From 0 to 1, 0 - always overshoot, 1 - do not overshoot.\r\n * \"overshoot\" refers to part of animation that\r\n * goes beyond the final value.\r\n *\r\n * @param {number} [naturalFrequency]\r\n * Determines how fast animation will slow down.\r\n * The higher value - the stiffer the transition will be,\r\n * and the faster it will slow down.\r\n * Recommended value from 10 to 50\r\n */\r\n constructor(initialVelocity, dampingRatio, naturalFrequency) {\r\n this.velocity = initialVelocity * 1000; // convert to \"pixels per second\"\r\n\r\n // https://en.wikipedia.org/wiki/Damping_ratio\r\n this._dampingRatio = dampingRatio || DEFAULT_DAMPING_RATIO;\r\n\r\n // https://en.wikipedia.org/wiki/Natural_frequency\r\n this._naturalFrequency = naturalFrequency || DEFAULT_NATURAL_FREQUENCY;\r\n\r\n this._dampedFrequency = this._naturalFrequency;\r\n\r\n if (this._dampingRatio < 1) {\r\n this._dampedFrequency *= Math.sqrt(1 - this._dampingRatio * this._dampingRatio);\r\n }\r\n }\r\n\r\n /**\r\n * @param {number} deltaPosition Difference between current and end position of the animation\r\n * @param {number} deltaTime Frame duration in milliseconds\r\n *\r\n * @returns {number} Displacement, relative to the end position.\r\n */\r\n easeFrame(deltaPosition, deltaTime) {\r\n // Inspired by Apple Webkit and Android spring function implementation\r\n // https://en.wikipedia.org/wiki/Oscillation\r\n // https://en.wikipedia.org/wiki/Damping_ratio\r\n // we ignore mass (assume that it's 1kg)\r\n\r\n let displacement = 0;\r\n let coeff;\r\n\r\n deltaTime /= 1000;\r\n\r\n const naturalDumpingPow = Math.E ** (-this._dampingRatio * this._naturalFrequency * deltaTime);\r\n\r\n if (this._dampingRatio === 1) {\r\n coeff = this.velocity + this._naturalFrequency * deltaPosition;\r\n\r\n displacement = (deltaPosition + coeff * deltaTime) * naturalDumpingPow;\r\n\r\n this.velocity = displacement\r\n * (-this._naturalFrequency) + coeff\r\n * naturalDumpingPow;\r\n } else if (this._dampingRatio < 1) {\r\n coeff = (1 / this._dampedFrequency)\r\n * (this._dampingRatio * this._naturalFrequency * deltaPosition + this.velocity);\r\n\r\n const dumpedFCos = Math.cos(this._dampedFrequency * deltaTime);\r\n const dumpedFSin = Math.sin(this._dampedFrequency * deltaTime);\r\n\r\n displacement = naturalDumpingPow\r\n * (deltaPosition * dumpedFCos + coeff * dumpedFSin);\r\n\r\n this.velocity = displacement\r\n * (-this._naturalFrequency)\r\n * this._dampingRatio\r\n + naturalDumpingPow\r\n * (-this._dampedFrequency * deltaPosition * dumpedFSin\r\n + this._dampedFrequency * coeff * dumpedFCos);\r\n }\r\n\r\n // Overdamped (>1) damping ratio is not supported\r\n\r\n return displacement;\r\n }\r\n}\r\n\r\nexport default SpringEaser;\r\n", "import SpringEaser from './spring-easer.js';\r\n\r\n/** @typedef {import('./animations.js').SharedAnimationProps} SharedAnimationProps */\r\n\r\n/**\r\n * @typedef {Object} DefaultSpringAnimationProps\r\n *\r\n * @prop {number} start\r\n * @prop {number} end\r\n * @prop {number} velocity\r\n * @prop {number} [dampingRatio]\r\n * @prop {number} [naturalFrequency]\r\n * @prop {(end: number) => void} onUpdate\r\n */\r\n\r\n/** @typedef {SharedAnimationProps & DefaultSpringAnimationProps} SpringAnimationProps */\r\n\r\nclass SpringAnimation {\r\n /**\r\n * @param {SpringAnimationProps} props\r\n */\r\n constructor(props) {\r\n this.props = props;\r\n this._raf = 0;\r\n\r\n const {\r\n start,\r\n end,\r\n velocity,\r\n onUpdate,\r\n onComplete,\r\n onFinish = () => {},\r\n dampingRatio,\r\n naturalFrequency\r\n } = props;\r\n\r\n this.onFinish = onFinish;\r\n\r\n const easer = new SpringEaser(velocity, dampingRatio, naturalFrequency);\r\n let prevTime = Date.now();\r\n let deltaPosition = start - end;\r\n\r\n const animationLoop = () => {\r\n if (this._raf) {\r\n deltaPosition = easer.easeFrame(deltaPosition, Date.now() - prevTime);\r\n\r\n // Stop the animation if velocity is low and position is close to end\r\n if (Math.abs(deltaPosition) < 1 && Math.abs(easer.velocity) < 50) {\r\n // Finalize the animation\r\n onUpdate(end);\r\n if (onComplete) {\r\n onComplete();\r\n }\r\n this.onFinish();\r\n } else {\r\n prevTime = Date.now();\r\n onUpdate(deltaPosition + end);\r\n this._raf = requestAnimationFrame(animationLoop);\r\n }\r\n }\r\n };\r\n\r\n this._raf = requestAnimationFrame(animationLoop);\r\n }\r\n\r\n // Destroy is called automatically onFinish\r\n destroy() {\r\n if (this._raf >= 0) {\r\n cancelAnimationFrame(this._raf);\r\n }\r\n this._raf = 0;\r\n }\r\n}\r\n\r\nexport default SpringAnimation;\r\n", "import CSSAnimation from './css-animation.js';\r\nimport SpringAnimation from './spring-animation.js';\r\n\r\n/** @typedef {import('./css-animation.js').CssAnimationProps} CssAnimationProps */\r\n/** @typedef {import('./spring-animation.js').SpringAnimationProps} SpringAnimationProps */\r\n\r\n/** @typedef {Object} SharedAnimationProps\r\n * @prop {string} [name]\r\n * @prop {boolean} [isPan]\r\n * @prop {boolean} [isMainScroll]\r\n * @prop {VoidFunction} [onComplete]\r\n * @prop {VoidFunction} [onFinish]\r\n */\r\n\r\n/** @typedef {SpringAnimation | CSSAnimation} Animation */\r\n/** @typedef {SpringAnimationProps | CssAnimationProps} AnimationProps */\r\n\r\n/**\r\n * Manages animations\r\n */\r\nclass Animations {\r\n constructor() {\r\n /** @type {Animation[]} */\r\n this.activeAnimations = [];\r\n }\r\n\r\n /**\r\n * @param {SpringAnimationProps} props\r\n */\r\n startSpring(props) {\r\n this._start(props, true);\r\n }\r\n\r\n /**\r\n * @param {CssAnimationProps} props\r\n */\r\n startTransition(props) {\r\n this._start(props);\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {AnimationProps} props\r\n * @param {boolean} [isSpring]\r\n * @returns {Animation}\r\n */\r\n _start(props, isSpring) {\r\n const animation = isSpring\r\n ? new SpringAnimation(/** @type SpringAnimationProps */ (props))\r\n : new CSSAnimation(/** @type CssAnimationProps */ (props));\r\n\r\n this.activeAnimations.push(animation);\r\n animation.onFinish = () => this.stop(animation);\r\n\r\n return animation;\r\n }\r\n\r\n /**\r\n * @param {Animation} animation\r\n */\r\n stop(animation) {\r\n animation.destroy();\r\n const index = this.activeAnimations.indexOf(animation);\r\n if (index > -1) {\r\n this.activeAnimations.splice(index, 1);\r\n }\r\n }\r\n\r\n stopAll() { // _stopAllAnimations\r\n this.activeAnimations.forEach((animation) => {\r\n animation.destroy();\r\n });\r\n this.activeAnimations = [];\r\n }\r\n\r\n /**\r\n * Stop all pan or zoom transitions\r\n */\r\n stopAllPan() {\r\n this.activeAnimations = this.activeAnimations.filter((animation) => {\r\n if (animation.props.isPan) {\r\n animation.destroy();\r\n return false;\r\n }\r\n\r\n return true;\r\n });\r\n }\r\n\r\n stopMainScroll() {\r\n this.activeAnimations = this.activeAnimations.filter((animation) => {\r\n if (animation.props.isMainScroll) {\r\n animation.destroy();\r\n return false;\r\n }\r\n\r\n return true;\r\n });\r\n }\r\n\r\n /**\r\n * Returns true if main scroll transition is running\r\n */\r\n // isMainScrollRunning() {\r\n // return this.activeAnimations.some((animation) => {\r\n // return animation.props.isMainScroll;\r\n // });\r\n // }\r\n\r\n /**\r\n * Returns true if any pan or zoom transition is running\r\n */\r\n isPanRunning() {\r\n return this.activeAnimations.some((animation) => {\r\n return animation.props.isPan;\r\n });\r\n }\r\n}\r\n\r\nexport default Animations;\r\n", "/** @typedef {import('./photoswipe.js').default} PhotoSwipe */\r\n\r\n/**\r\n * Handles scroll wheel.\r\n * Can pan and zoom current slide image.\r\n */\r\nclass ScrollWheel {\r\n /**\r\n * @param {PhotoSwipe} pswp\r\n */\r\n constructor(pswp) {\r\n this.pswp = pswp;\r\n pswp.events.add(pswp.element, 'wheel', /** @type EventListener */(this._onWheel.bind(this)));\r\n }\r\n\r\n /**\r\n * @private\r\n * @param {WheelEvent} e\r\n */\r\n _onWheel(e) {\r\n e.preventDefault();\r\n const { currSlide } = this.pswp;\r\n let { deltaX, deltaY } = e;\r\n\r\n if (!currSlide) {\r\n return;\r\n }\r\n\r\n if (this.pswp.dispatch('wheel', { originalEvent: e }).defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (e.ctrlKey || this.pswp.options.wheelToZoom) {\r\n // zoom\r\n if (currSlide.isZoomable()) {\r\n let zoomFactor = -deltaY;\r\n if (e.deltaMode === 1 /* DOM_DELTA_LINE */) {\r\n zoomFactor *= 0.05;\r\n } else {\r\n zoomFactor *= e.deltaMode ? 1 : 0.002;\r\n }\r\n zoomFactor = 2 ** zoomFactor;\r\n\r\n const destZoomLevel = currSlide.currZoomLevel * zoomFactor;\r\n currSlide.zoomTo(destZoomLevel, {\r\n x: e.clientX,\r\n y: e.clientY\r\n });\r\n }\r\n } else {\r\n // pan\r\n if (currSlide.isPannable()) {\r\n if (e.deltaMode === 1 /* DOM_DELTA_LINE */) {\r\n // 18 - average line height\r\n deltaX *= 18;\r\n deltaY *= 18;\r\n }\r\n\r\n currSlide.panTo(\r\n currSlide.pan.x - deltaX,\r\n currSlide.pan.y - deltaY\r\n );\r\n }\r\n }\r\n }\r\n}\r\n\r\nexport default ScrollWheel;\r\n", "import { createElement } from '../util/util.js';\r\n\r\n/** @typedef {import('../photoswipe.js').default} PhotoSwipe */\r\n\r\n/**\r\n * @template T\r\n * @typedef {import('../types.js').Methods} Methods\r\n */\r\n\r\n/**\r\n * @typedef {Object} UIElementMarkupProps\r\n * @prop {boolean} [isCustomSVG]\r\n * @prop {string} inner\r\n * @prop {string} [outlineID]\r\n * @prop {number | string} [size]\r\n */\r\n\r\n/**\r\n * @typedef {Object} UIElementData\r\n * @prop {DefaultUIElements | string} [name]\r\n * @prop {string} [className]\r\n * @prop {UIElementMarkup} [html]\r\n * @prop {boolean} [isButton]\r\n * @prop {keyof HTMLElementTagNameMap} [tagName]\r\n * @prop {string} [title]\r\n * @prop {string} [ariaLabel]\r\n * @prop {(element: HTMLElement, pswp: PhotoSwipe) => void} [onInit]\r\n * @prop {Methods | ((e: MouseEvent, element: HTMLElement, pswp: PhotoSwipe) => void)} [onClick]\r\n * @prop {'bar' | 'wrapper' | 'root'} [appendTo]\r\n * @prop {number} [order]\r\n */\r\n\r\n/** @typedef {'arrowPrev' | 'arrowNext' | 'close' | 'zoom' | 'counter'} DefaultUIElements */\r\n\r\n/** @typedef {string | UIElementMarkupProps} UIElementMarkup */\r\n\r\n/**\r\n * @param {UIElementMarkup} [htmlData]\r\n * @returns {string}\r\n */\r\nfunction addElementHTML(htmlData) {\r\n if (typeof htmlData === 'string') {\r\n // Allow developers to provide full svg,\r\n // For example:\r\n // \r\n // Can also be any HTML string.\r\n return htmlData;\r\n }\r\n\r\n if (!htmlData || !htmlData.isCustomSVG) {\r\n return '';\r\n }\r\n\r\n const svgData = htmlData;\r\n let out = '';\r\n\r\n return out;\r\n}\r\n\r\nclass UIElement {\r\n /**\r\n * @param {PhotoSwipe} pswp\r\n * @param {UIElementData} data\r\n */\r\n constructor(pswp, data) {\r\n const name = data.name || data.className;\r\n let elementHTML = data.html;\r\n\r\n // @ts-expect-error lookup only by `data.name` maybe?\r\n if (pswp.options[name] === false) {\r\n // exit if element is disabled from options\r\n return;\r\n }\r\n\r\n // Allow to override SVG icons from options\r\n // @ts-expect-error lookup only by `data.name` maybe?\r\n if (typeof pswp.options[name + 'SVG'] === 'string') {\r\n // arrowPrevSVG\r\n // arrowNextSVG\r\n // closeSVG\r\n // zoomSVG\r\n // @ts-expect-error lookup only by `data.name` maybe?\r\n elementHTML = pswp.options[name + 'SVG'];\r\n }\r\n\r\n pswp.dispatch('uiElementCreate', { data });\r\n\r\n let className = '';\r\n if (data.isButton) {\r\n className += 'pswp__button ';\r\n className += (data.className || `pswp__button--${data.name}`);\r\n } else {\r\n className += (data.className || `pswp__${data.name}`);\r\n }\r\n\r\n let tagName = data.isButton ? (data.tagName || 'button') : (data.tagName || 'div');\r\n tagName = /** @type {keyof HTMLElementTagNameMap} */ (tagName.toLowerCase());\r\n /** @type {HTMLElement} */\r\n const element = createElement(className, tagName);\r\n\r\n if (data.isButton) {\r\n if (tagName === 'button') {\r\n /** @type {HTMLButtonElement} */ (element).type = 'button';\r\n }\r\n\r\n let { title } = data;\r\n const { ariaLabel } = data;\r\n\r\n // @ts-expect-error lookup only by `data.name` maybe?\r\n if (typeof pswp.options[name + 'Title'] === 'string') {\r\n // @ts-expect-error lookup only by `data.name` maybe?\r\n title = pswp.options[name + 'Title'];\r\n }\r\n\r\n if (title) {\r\n element.title = title;\r\n }\r\n\r\n const ariaText = ariaLabel || title;\r\n if (ariaText) {\r\n element.setAttribute('aria-label', ariaText);\r\n }\r\n }\r\n\r\n element.innerHTML = addElementHTML(elementHTML);\r\n\r\n if (data.onInit) {\r\n data.onInit(element, pswp);\r\n }\r\n\r\n if (data.onClick) {\r\n element.onclick = (e) => {\r\n if (typeof data.onClick === 'string') {\r\n // @ts-ignore\r\n pswp[data.onClick]();\r\n } else if (typeof data.onClick === 'function') {\r\n data.onClick(e, element, pswp);\r\n }\r\n };\r\n }\r\n\r\n // Top bar is default position\r\n const appendTo = data.appendTo || 'bar';\r\n /** @type {HTMLElement | undefined} root element by default */\r\n let container = pswp.element;\r\n if (appendTo === 'bar') {\r\n if (!pswp.topBar) {\r\n pswp.topBar = createElement('pswp__top-bar pswp__hide-on-close', 'div', pswp.scrollWrap);\r\n }\r\n container = pswp.topBar;\r\n } else {\r\n // element outside of top bar gets a secondary class\r\n // that makes element fade out on close\r\n element.classList.add('pswp__hide-on-close');\r\n\r\n if (appendTo === 'wrapper') {\r\n container = pswp.scrollWrap;\r\n }\r\n }\r\n\r\n container?.appendChild(pswp.applyFilters('uiElement', element, data));\r\n }\r\n}\r\n\r\nexport default UIElement;\r\n", "/*\r\n Backward and forward arrow buttons\r\n */\r\n\r\n/** @typedef {import('./ui-element.js').UIElementData} UIElementData */\r\n/** @typedef {import('../photoswipe.js').default} PhotoSwipe */\r\n\r\n/**\r\n *\r\n * @param {HTMLElement} element\r\n * @param {PhotoSwipe} pswp\r\n * @param {boolean} [isNextButton]\r\n */\r\nfunction initArrowButton(element, pswp, isNextButton) {\r\n element.classList.add('pswp__button--arrow');\r\n // TODO: this should point to a unique id for this instance\r\n element.setAttribute('aria-controls', 'pswp__items');\r\n pswp.on('change', () => {\r\n if (!pswp.options.loop) {\r\n if (isNextButton) {\r\n /** @type {HTMLButtonElement} */\r\n (element).disabled = !(pswp.currIndex < pswp.getNumItems() - 1);\r\n } else {\r\n /** @type {HTMLButtonElement} */\r\n (element).disabled = !(pswp.currIndex > 0);\r\n }\r\n }\r\n });\r\n}\r\n\r\n/** @type {UIElementData} */\r\nexport const arrowPrev = {\r\n name: 'arrowPrev',\r\n className: 'pswp__button--arrow--prev',\r\n title: 'Previous',\r\n order: 10,\r\n isButton: true,\r\n appendTo: 'wrapper',\r\n html: {\r\n isCustomSVG: true,\r\n size: 60,\r\n inner: '',\r\n outlineID: 'pswp__icn-arrow'\r\n },\r\n onClick: 'prev',\r\n onInit: initArrowButton\r\n};\r\n\r\n/** @type {UIElementData} */\r\nexport const arrowNext = {\r\n name: 'arrowNext',\r\n className: 'pswp__button--arrow--next',\r\n title: 'Next',\r\n order: 11,\r\n isButton: true,\r\n appendTo: 'wrapper',\r\n html: {\r\n isCustomSVG: true,\r\n size: 60,\r\n inner: '