(function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(); else if(typeof define === 'function' && define.amd) define([], factory); else { var a = factory(); for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i]; } })(window, function() { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); /******/ } /******/ }; /******/ /******/ // define __esModule on exports /******/ __webpack_require__.r = function(exports) { /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); /******/ } /******/ Object.defineProperty(exports, '__esModule', { value: true }); /******/ }; /******/ /******/ // create a fake namespace object /******/ // mode & 1: value is a module id, require it /******/ // mode & 2: merge all properties of value into the ns /******/ // mode & 4: return value when already ns object /******/ // mode & 8|1: behave like require /******/ __webpack_require__.t = function(value, mode) { /******/ if(mode & 1) value = __webpack_require__(value); /******/ if(mode & 8) return value; /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; /******/ var ns = Object.create(null); /******/ __webpack_require__.r(ns); /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); /******/ return ns; /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = "./src/index.ts"); /******/ }) /************************************************************************/ /******/ ({ /***/ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/drawboard/Drawboard/index.less": /*!*********************************************************************************************************************************************************************************!*\ !*** ./node_modules/css-loader/dist/cjs.js??ref--11-1!./node_modules/postcss-loader/src!./node_modules/less-loader/dist/cjs.js??ref--11-3!./src/drawboard/Drawboard/index.less ***! \*********************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js")(false); // Module exports.push([module.i, ".fc-whiteboard-logo {\n display: inline-block;\n margin: 0px;\n padding: 0px;\n fill: #333333;\n}\n.fc-whiteboard-logo a {\n display: grid;\n -ms-flex-align: center;\n align-items: center;\n justify-items: center;\n padding: 3px;\n width: 20px;\n height: 20px;\n}\n.fc-whiteboard-logo a:hover {\n fill: #ff8080;\n}\n.fc-whiteboard-text-editor {\n position: fixed;\n z-index: 20000;\n left: 0px;\n top: 0px;\n width: 100vw;\n height: 100vh;\n background-color: rgba(0, 0, 0, 0.9);\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n.fc-whiteboard-text-editor textarea {\n width: 50%;\n min-width: 50px;\n max-width: 500px;\n height: 50%;\n min-height: 50px;\n max-height: 500px;\n}\n.fc-whiteboard-text-editor .fc-whiteboard-text-editor-button-bar {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: row;\n flex-direction: row;\n -ms-flex-pack: end;\n justify-content: flex-end;\n width: 50%;\n min-width: 50px;\n max-width: 500px;\n padding-top: 10px;\n}\n.fc-whiteboard-text-editor .fc-whiteboard-text-editor-button {\n display: grid;\n -ms-flex-align: center;\n align-items: center;\n padding: 0px;\n margin-left: 15px;\n width: 20px;\n height: 20px;\n cursor: pointer;\n fill: #888888;\n}\n.fc-whiteboard-text-editor .fc-whiteboard-text-editor-button:hover {\n fill: #ff8080;\n}\n", ""]); /***/ }), /***/ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/toolbar/index.less": /*!*********************************************************************************************************************************************************************!*\ !*** ./node_modules/css-loader/dist/cjs.js??ref--11-1!./node_modules/postcss-loader/src!./node_modules/less-loader/dist/cjs.js??ref--11-3!./src/toolbar/index.less ***! \*********************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js")(false); // Module exports.push([module.i, ".fc-whiteboard-toolbar {\n height: 36px;\n background: #ffffff;\n -webkit-box-shadow: 0px 2px 9px 0px rgba(194, 185, 187, 0.29);\n box-shadow: 0px 2px 9px 0px rgba(194, 185, 187, 0.29);\n border-radius: 13px;\n opacity: 0.9;\n border: 1px solid #e6ecf7;\n padding: 0 8px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n}\n.fc-whiteboard-toolbar-button,\n.fc-whiteboard-toolbar-logo a {\n display: inline-block;\n margin: 2px;\n padding: 3px;\n cursor: pointer;\n width: 20px;\n height: 20px;\n border-radius: 2px;\n border-bottom: transparent solid 1px;\n border-right: transparent solid 1px;\n fill: #333333;\n display: grid;\n -ms-flex-align: center;\n align-items: center;\n justify-items: center;\n}\n.fc-whiteboard-toolbar-separator {\n width: 0px;\n height: 20px;\n margin: 5px 5px;\n border: 1px solid #cad3df;\n}\n.fc-whiteboard-toolbar-button:hover,\n.fc-whiteboard-toolbar-logo a:hover {\n background-color: #eeeeee;\n background: -webkit-radial-gradient(#eeeeee, #cccccc);\n background: -o-radial-gradient(#eeeeee, #cccccc);\n background: radial-gradient(#eeeeee, #cccccc);\n fill: #ff8080;\n}\n.fc-whiteboard-toolbar-button svg {\n height: 16px;\n}\n.fc-whiteboard-indicator-container {\n font-size: 13px;\n line-height: 27px;\n height: 27px;\n width: 40px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: center;\n justify-content: center;\n letter-spacing: 2;\n}\n", ""]); /***/ }), /***/ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/whiteboard/AbstractWhiteboard/index.less": /*!*******************************************************************************************************************************************************************************************!*\ !*** ./node_modules/css-loader/dist/cjs.js??ref--11-1!./node_modules/postcss-loader/src!./node_modules/less-loader/dist/cjs.js??ref--11-3!./src/whiteboard/AbstractWhiteboard/index.less ***! \*******************************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js")(false); // Module exports.push([module.i, ".fcw-board {\n position: relative;\n}\n.fcw-board-imgs,\n.fcw-board-pages,\n.fcw-board .fcw-page {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.fcw-board-imgs > div,\n.fcw-board-imgs > div > div {\n height: 100%;\n}\n.fcw-board-img {\n width: 100%;\n height: 100%;\n}\n.fcw-board-img-wrapper {\n background-image: url(https://i.postimg.cc/RZwf0MRw/image.png);\n background-size: contain;\n background-position: center;\n height: 100%;\n width: 100%;\n background-repeat: no-repeat;\n}\n.fcw-board-flip-arrow {\n height: 20px;\n width: 20px;\n cursor: pointer;\n}\n.fcw-board-controller {\n position: absolute;\n display: -ms-flexbox;\n display: flex;\n width: 50px;\n height: 30px;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n top: -30px;\n background-color: #cccccc;\n padding: 0px 5px;\n margin: 0px;\n border-top-left-radius: 10px;\n border-top-right-radius: 10px;\n}\n", ""]); /***/ }), /***/ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/whiteboard/WhitePage/index.less": /*!**********************************************************************************************************************************************************************************!*\ !*** ./node_modules/css-loader/dist/cjs.js??ref--11-1!./node_modules/postcss-loader/src!./node_modules/less-loader/dist/cjs.js??ref--11-3!./src/whiteboard/WhitePage/index.less ***! \**********************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js")(false); // Module exports.push([module.i, ".fcw-page img {\n width: 100%;\n height: 100%;\n}\n", ""]); /***/ }), /***/ "./node_modules/css-loader/dist/runtime/api.js": /*!*****************************************************!*\ !*** ./node_modules/css-loader/dist/runtime/api.js ***! \*****************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; /* MIT License http://www.opensource.org/licenses/mit-license.php Author Tobias Koppers @sokra */ // css base code, injected by the css-loader module.exports = function (useSourceMap) { var list = []; // return the list of modules as css string list.toString = function toString() { return this.map(function (item) { var content = cssWithMappingToString(item, useSourceMap); if (item[2]) { return '@media ' + item[2] + '{' + content + '}'; } else { return content; } }).join(''); }; // import a list of modules into the list list.i = function (modules, mediaQuery) { if (typeof modules === 'string') { modules = [[null, modules, '']]; } var alreadyImportedModules = {}; for (var i = 0; i < this.length; i++) { var id = this[i][0]; if (id != null) { alreadyImportedModules[id] = true; } } for (i = 0; i < modules.length; i++) { var item = modules[i]; // skip already imported module // this implementation is not 100% perfect for weird media query combinations // when a module is imported multiple times with different media queries. // I hope this will never occur (Hey this way we have smaller bundles) if (item[0] == null || !alreadyImportedModules[item[0]]) { if (mediaQuery && !item[2]) { item[2] = mediaQuery; } else if (mediaQuery) { item[2] = '(' + item[2] + ') and (' + mediaQuery + ')'; } list.push(item); } } }; return list; }; function cssWithMappingToString(item, useSourceMap) { var content = item[1] || ''; var cssMapping = item[3]; if (!cssMapping) { return content; } if (useSourceMap && typeof btoa === 'function') { var sourceMapping = toComment(cssMapping); var sourceURLs = cssMapping.sources.map(function (source) { return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'; }); return [content].concat(sourceURLs).concat([sourceMapping]).join('\n'); } return [content].join('\n'); } // Adapted from convert-source-map (MIT) function toComment(sourceMap) { // eslint-disable-next-line no-undef var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))); var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64; return '/*# ' + data + ' */'; } /***/ }), /***/ "./node_modules/eventemitter3/index.js": /*!*********************************************!*\ !*** ./node_modules/eventemitter3/index.js ***! \*********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var has = Object.prototype.hasOwnProperty , prefix = '~'; /** * Constructor to create a storage for our `EE` objects. * An `Events` instance is a plain object whose properties are event names. * * @constructor * @private */ function Events() {} // // We try to not inherit from `Object.prototype`. In some engines creating an // instance in this way is faster than calling `Object.create(null)` directly. // If `Object.create(null)` is not supported we prefix the event names with a // character to make sure that the built-in object properties are not // overridden or used as an attack vector. // if (Object.create) { Events.prototype = Object.create(null); // // This hack is needed because the `__proto__` property is still inherited in // some old browsers like Android 4, iPhone 5.1, Opera 11 and Safari 5. // if (!new Events().__proto__) prefix = false; } /** * Representation of a single event listener. * * @param {Function} fn The listener function. * @param {*} context The context to invoke the listener with. * @param {Boolean} [once=false] Specify if the listener is a one-time listener. * @constructor * @private */ function EE(fn, context, once) { this.fn = fn; this.context = context; this.once = once || false; } /** * Add a listener for a given event. * * @param {EventEmitter} emitter Reference to the `EventEmitter` instance. * @param {(String|Symbol)} event The event name. * @param {Function} fn The listener function. * @param {*} context The context to invoke the listener with. * @param {Boolean} once Specify if the listener is a one-time listener. * @returns {EventEmitter} * @private */ function addListener(emitter, event, fn, context, once) { if (typeof fn !== 'function') { throw new TypeError('The listener must be a function'); } var listener = new EE(fn, context || emitter, once) , evt = prefix ? prefix + event : event; if (!emitter._events[evt]) emitter._events[evt] = listener, emitter._eventsCount++; else if (!emitter._events[evt].fn) emitter._events[evt].push(listener); else emitter._events[evt] = [emitter._events[evt], listener]; return emitter; } /** * Clear event by name. * * @param {EventEmitter} emitter Reference to the `EventEmitter` instance. * @param {(String|Symbol)} evt The Event name. * @private */ function clearEvent(emitter, evt) { if (--emitter._eventsCount === 0) emitter._events = new Events(); else delete emitter._events[evt]; } /** * Minimal `EventEmitter` interface that is molded against the Node.js * `EventEmitter` interface. * * @constructor * @public */ function EventEmitter() { this._events = new Events(); this._eventsCount = 0; } /** * Return an array listing the events for which the emitter has registered * listeners. * * @returns {Array} * @public */ EventEmitter.prototype.eventNames = function eventNames() { var names = [] , events , name; if (this._eventsCount === 0) return names; for (name in (events = this._events)) { if (has.call(events, name)) names.push(prefix ? name.slice(1) : name); } if (Object.getOwnPropertySymbols) { return names.concat(Object.getOwnPropertySymbols(events)); } return names; }; /** * Return the listeners registered for a given event. * * @param {(String|Symbol)} event The event name. * @returns {Array} The registered listeners. * @public */ EventEmitter.prototype.listeners = function listeners(event) { var evt = prefix ? prefix + event : event , handlers = this._events[evt]; if (!handlers) return []; if (handlers.fn) return [handlers.fn]; for (var i = 0, l = handlers.length, ee = new Array(l); i < l; i++) { ee[i] = handlers[i].fn; } return ee; }; /** * Return the number of listeners listening to a given event. * * @param {(String|Symbol)} event The event name. * @returns {Number} The number of listeners. * @public */ EventEmitter.prototype.listenerCount = function listenerCount(event) { var evt = prefix ? prefix + event : event , listeners = this._events[evt]; if (!listeners) return 0; if (listeners.fn) return 1; return listeners.length; }; /** * Calls each of the listeners registered for a given event. * * @param {(String|Symbol)} event The event name. * @returns {Boolean} `true` if the event had listeners, else `false`. * @public */ EventEmitter.prototype.emit = function emit(event, a1, a2, a3, a4, a5) { var evt = prefix ? prefix + event : event; if (!this._events[evt]) return false; var listeners = this._events[evt] , len = arguments.length , args , i; if (listeners.fn) { if (listeners.once) this.removeListener(event, listeners.fn, undefined, true); switch (len) { case 1: return listeners.fn.call(listeners.context), true; case 2: return listeners.fn.call(listeners.context, a1), true; case 3: return listeners.fn.call(listeners.context, a1, a2), true; case 4: return listeners.fn.call(listeners.context, a1, a2, a3), true; case 5: return listeners.fn.call(listeners.context, a1, a2, a3, a4), true; case 6: return listeners.fn.call(listeners.context, a1, a2, a3, a4, a5), true; } for (i = 1, args = new Array(len -1); i < len; i++) { args[i - 1] = arguments[i]; } listeners.fn.apply(listeners.context, args); } else { var length = listeners.length , j; for (i = 0; i < length; i++) { if (listeners[i].once) this.removeListener(event, listeners[i].fn, undefined, true); switch (len) { case 1: listeners[i].fn.call(listeners[i].context); break; case 2: listeners[i].fn.call(listeners[i].context, a1); break; case 3: listeners[i].fn.call(listeners[i].context, a1, a2); break; case 4: listeners[i].fn.call(listeners[i].context, a1, a2, a3); break; default: if (!args) for (j = 1, args = new Array(len -1); j < len; j++) { args[j - 1] = arguments[j]; } listeners[i].fn.apply(listeners[i].context, args); } } } return true; }; /** * Add a listener for a given event. * * @param {(String|Symbol)} event The event name. * @param {Function} fn The listener function. * @param {*} [context=this] The context to invoke the listener with. * @returns {EventEmitter} `this`. * @public */ EventEmitter.prototype.on = function on(event, fn, context) { return addListener(this, event, fn, context, false); }; /** * Add a one-time listener for a given event. * * @param {(String|Symbol)} event The event name. * @param {Function} fn The listener function. * @param {*} [context=this] The context to invoke the listener with. * @returns {EventEmitter} `this`. * @public */ EventEmitter.prototype.once = function once(event, fn, context) { return addListener(this, event, fn, context, true); }; /** * Remove the listeners of a given event. * * @param {(String|Symbol)} event The event name. * @param {Function} fn Only remove the listeners that match this function. * @param {*} context Only remove the listeners that have this context. * @param {Boolean} once Only remove one-time listeners. * @returns {EventEmitter} `this`. * @public */ EventEmitter.prototype.removeListener = function removeListener(event, fn, context, once) { var evt = prefix ? prefix + event : event; if (!this._events[evt]) return this; if (!fn) { clearEvent(this, evt); return this; } var listeners = this._events[evt]; if (listeners.fn) { if ( listeners.fn === fn && (!once || listeners.once) && (!context || listeners.context === context) ) { clearEvent(this, evt); } } else { for (var i = 0, events = [], length = listeners.length; i < length; i++) { if ( listeners[i].fn !== fn || (once && !listeners[i].once) || (context && listeners[i].context !== context) ) { events.push(listeners[i]); } } // // Reset the array, or remove it completely if we have no more listeners. // if (events.length) this._events[evt] = events.length === 1 ? events[0] : events; else clearEvent(this, evt); } return this; }; /** * Remove all listeners, or those of the specified event. * * @param {(String|Symbol)} [event] The event name. * @returns {EventEmitter} `this`. * @public */ EventEmitter.prototype.removeAllListeners = function removeAllListeners(event) { var evt; if (event) { evt = prefix ? prefix + event : event; if (this._events[evt]) clearEvent(this, evt); } else { this._events = new Events(); this._eventsCount = 0; } return this; }; // // Alias methods names because people roll like that. // EventEmitter.prototype.off = EventEmitter.prototype.removeListener; EventEmitter.prototype.addListener = EventEmitter.prototype.on; // // Expose the prefix. // EventEmitter.prefixed = prefix; // // Allow `EventEmitter` to be imported as module namespace. // EventEmitter.EventEmitter = EventEmitter; // // Expose the module. // if (true) { module.exports = EventEmitter; } /***/ }), /***/ "./node_modules/fc-hotkeys/dist/index.js": /*!***********************************************!*\ !*** ./node_modules/fc-hotkeys/dist/index.js ***! \***********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { !function(t,e){if(true)module.exports=e();else { var r, n; }}(window,function(){return function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.KEY_ESC="ESC",e.KEY_ALL="*",e.normalizeModifiersMap={ctrl:"Ctrl",control:"Ctrl",alt:"Alt",shift:"Shift",command:"Command",meta:"Command"}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),function(t){for(var n in t)e.hasOwnProperty(n)||(e[n]=t[n])}(n(0));var r=n(2);e.HotkeysListener=r.default},function(t,e,n){"use strict";var r,o=this&&this.__extends||(r=function(t,e){return(r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)},function(t,e){function n(){this.constructor=t}r(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)});Object.defineProperty(e,"__esModule",{value:!0});var i=n(3),a=n(0),s=n(4),c=function(){function t(t,e){var n=this;void 0===t&&(t=document.body),void 0===e&&(e=i),this.listeners={},this._notify=function(t,e,r){var o=n.listeners[a.KEY_ALL];o&&o.length>0&&o.forEach(function(t){!1===t(e,r)&&s.preventAndStopEvent(e)});var i=n.listeners[t];i&&i.length>0&&i.forEach(function(t){!1===t(e,r)&&s.preventAndStopEvent(e)})};var r=this._notify,c=function(t){function e(){return null!==t&&t.apply(this,arguments)||this}return o(e,t),e.prototype.handleKey=function(t,e,n){var o=s.normalizeHotkeys(t,e);n&&"keyup"!==n.type&&r(o,n,{char:t,modifiers:e,hotkey:o})},e}(e);this.trapObj=new c(t)}return t.prototype.on=function(t,e){var n=this;if("string"==typeof t){var r=t,o=this.listeners[r]||[];o.push(e),this.listeners[r]=o}else{if(!Array.isArray(t))throw new Error("first param of on() must be a string or an array of string");t.forEach(function(t){n.on(t,e)})}},t.prototype.off=function(t,e){var n=this;if("string"==typeof t){var r=t,o=this.listeners[r]||[],i=o.indexOf(e);i>=0&&o.splice(i,1),this.listeners[r]=o}else{if(!Array.isArray(t))throw new Error("first param of off() must be a string or an array of string");t.forEach(function(t){n.off(t,e)})}},t.prototype.reset=function(){this.listeners={},this.trapObj.reset()},t}();e.default=c},function(t,e,n){var r;!function(o,i,a){if(o){for(var s,c={8:"backspace",9:"tab",13:"enter",16:"shift",17:"ctrl",18:"alt",20:"capslock",27:"esc",32:"space",33:"pageup",34:"pagedown",35:"end",36:"home",37:"left",38:"up",39:"right",40:"down",45:"ins",46:"del",91:"meta",93:"meta",224:"meta"},u={106:"*",107:"+",109:"-",110:".",111:"/",186:";",187:"=",188:",",189:"-",190:".",191:"/",192:"`",219:"[",220:"\\",221:"]",222:"'"},f={"~":"`","!":"1","@":"2","#":"3",$:"4","%":"5","^":"6","&":"7","*":"8","(":"9",")":"0",_:"-","+":"=",":":";",'"':"'","<":",",">":".","?":"/","|":"\\"},l={option:"alt",command:"meta",return:"enter",escape:"esc",plus:"+",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},p=1;p<20;++p)c[111+p]="f"+p;for(p=0;p<=9;++p)c[p+96]=p.toString();b.prototype.bind=function(t,e,n){return t=t instanceof Array?t:[t],this._bindMultiple.call(this,t,e,n),this},b.prototype.unbind=function(t,e){return this.bind.call(this,t,function(){},e)},b.prototype.trigger=function(t,e){return this._directMap[t+":"+e]&&this._directMap[t+":"+e]({},t),this},b.prototype.reset=function(){return this._callbacks={},this._directMap={},this},b.prototype.stopCallback=function(t,e){if((" "+e.className+" ").indexOf(" mousetrap ")>-1)return!1;if(function t(e,n){return null!==e&&e!==i&&(e===n||t(e.parentNode,n))}(e,this.target))return!1;if("composedPath"in t&&"function"==typeof t.composedPath){var n=t.composedPath()[0];n!==t.target&&(e=n)}return"INPUT"==e.tagName||"SELECT"==e.tagName||"TEXTAREA"==e.tagName||e.isContentEditable},b.prototype.handleKey=function(){return this._handleKey.apply(this,arguments)},b.addKeycodes=function(t){for(var e in t)t.hasOwnProperty(e)&&(c[e]=t[e]);s=null},b.init=function(){var t=b(i);for(var e in t)"_"!==e.charAt(0)&&(b[e]=function(e){return function(){return t[e].apply(t,arguments)}}(e))},b.init(),o.Mousetrap=b,t.exports&&(t.exports=b),void 0===(r=function(){return b}.call(e,n,e,t))||(t.exports=r)}function h(t,e,n){t.addEventListener?t.addEventListener(e,n,!1):t.attachEvent("on"+e,n)}function d(t){if("keypress"==t.type){var e=String.fromCharCode(t.which);return t.shiftKey||(e=e.toLowerCase()),e}return c[t.which]?c[t.which]:u[t.which]?u[t.which]:String.fromCharCode(t.which).toLowerCase()}function y(t){return"shift"==t||"ctrl"==t||"alt"==t||"meta"==t}function v(t,e,n){return n||(n=function(){if(!s)for(var t in s={},c)t>95&&t<112||c.hasOwnProperty(t)&&(s[c[t]]=t);return s}()[t]?"keydown":"keypress"),"keypress"==n&&e.length&&(n="keydown"),n}function m(t,e){var n,r,o,i=[];for(n=function(t){return"+"===t?["+"]:(t=t.replace(/\+{2}/g,"+plus")).split("+")}(t),o=0;o1?p(t,s,n,r):(a=m(t,r),e._callbacks[a.key]=e._callbacks[a.key]||[],u(a.key,a.modifiers,{type:a.action},o,t,i),e._callbacks[a.key][o?"unshift":"push"]({callback:n,modifiers:a.modifiers,action:a.action,seq:o,level:i,combo:t}))}e._handleKey=function(t,e,n){var r,o=u(t,e,n),i={},l=0,p=!1;for(r=0;r * Released under the MIT License. * https://raw.github.com/taye/interact.js/master/LICENSE */ (function(f){if(true){module.exports=f()}else { var g; }})(function(){var define,module,exports; var createModuleFactory = function createModuleFactory(t){var e;return function(r){return e||t(e={exports:{},parent:r},e.exports),e.exports}}; var _$scope_24 = createModuleFactory(function (module, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); /* common-shake removed: exports.createScope = */ void createScope; /* common-shake removed: exports.initScope = */ void initScope; exports.Scope = exports.ActionName = void 0; var utils = _interopRequireWildcard(_$utils_55); var _domObjects = _interopRequireDefault(_$domObjects_49); var _defaultOptions = _interopRequireDefault(_$defaultOptions_20); var _Eventable = _interopRequireDefault(_$Eventable_14); var _Interactable = _interopRequireDefault(_$Interactable_16); var _InteractableSet = _interopRequireDefault(_$InteractableSet_17); var _InteractEvent = _interopRequireDefault(_$InteractEvent_15); var _interactions = _interopRequireDefault(_$interactions_23({})); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function _typeof(obj) { 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); } function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _get(target, property, receiver) { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get; } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(receiver); } return desc.value; }; } return _get(target, property, receiver || target); } function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } function _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); } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _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); } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } var win = utils.win, browser = utils.browser, raf = utils.raf, Signals = utils.Signals, events = utils.events; var ActionName; exports.ActionName = ActionName; (function (ActionName) {})(ActionName || (exports.ActionName = ActionName = {})); function createScope() { return new Scope(); } var Scope = /*#__PURE__*/ function () { function Scope() { var _this = this; _classCallCheck(this, Scope); this.id = "__interact_scope_".concat(Math.floor(Math.random() * 100)); this.signals = new Signals(); this.browser = browser; this.events = events; this.utils = utils; this.defaults = utils.clone(_defaultOptions["default"]); this.Eventable = _Eventable["default"]; this.actions = { names: [], methodDict: {}, eventTypes: [] }; this.InteractEvent = _InteractEvent["default"]; this.interactables = new _InteractableSet["default"](this); // all documents being listened to this.documents = []; this._plugins = []; this._pluginMap = {}; this.onWindowUnload = function (event) { return _this.removeDocument(event.target); }; var scope = this; this.Interactable = /*#__PURE__*/ function (_InteractableBase) { _inherits(Interactable, _InteractableBase); function Interactable() { _classCallCheck(this, Interactable); return _possibleConstructorReturn(this, _getPrototypeOf(Interactable).apply(this, arguments)); } _createClass(Interactable, [{ key: "set", value: function set(options) { _get(_getPrototypeOf(Interactable.prototype), "set", this).call(this, options); scope.interactables.signals.fire('set', { options: options, interactable: this }); return this; } }, { key: "unset", value: function unset() { _get(_getPrototypeOf(Interactable.prototype), "unset", this).call(this); for (var i = scope.interactions.list.length - 1; i >= 0; i--) { var interaction = scope.interactions.list[i]; if (interaction.interactable === this) { interaction.stop(); scope.interactions.signals.fire('destroy', { interaction: interaction }); interaction.destroy(); if (scope.interactions.list.length > 2) { scope.interactions.list.splice(i, 1); } } } scope.interactables.signals.fire('unset', { interactable: this }); } }, { key: "_defaults", get: function get() { return scope.defaults; } }]); return Interactable; }(_Interactable["default"]); } _createClass(Scope, [{ key: "init", value: function init(window) { return initScope(this, window); } }, { key: "pluginIsInstalled", value: function pluginIsInstalled(plugin) { return this._pluginMap[plugin.id] || this._plugins.indexOf(plugin) !== -1; } }, { key: "usePlugin", value: function usePlugin(plugin, options) { if (this.pluginIsInstalled(plugin)) { return this; } if (plugin.id) { this._pluginMap[plugin.id] = plugin; } plugin.install(this, options); this._plugins.push(plugin); return this; } }, { key: "addDocument", value: function addDocument(doc, options) { // do nothing if document is already known if (this.getDocIndex(doc) !== -1) { return false; } var window = win.getWindow(doc); options = options ? utils.extend({}, options) : {}; this.documents.push({ doc: doc, options: options }); events.documents.push(doc); // don't add an unload event for the main document // so that the page may be cached in browser history if (doc !== this.document) { events.add(window, 'unload', this.onWindowUnload); } this.signals.fire('add-document', { doc: doc, window: window, scope: this, options: options }); } }, { key: "removeDocument", value: function removeDocument(doc) { var index = this.getDocIndex(doc); var window = win.getWindow(doc); var options = this.documents[index].options; events.remove(window, 'unload', this.onWindowUnload); this.documents.splice(index, 1); events.documents.splice(index, 1); this.signals.fire('remove-document', { doc: doc, window: window, scope: this, options: options }); } }, { key: "getDocIndex", value: function getDocIndex(doc) { for (var i = 0; i < this.documents.length; i++) { if (this.documents[i].doc === doc) { return i; } } return -1; } }, { key: "getDocOptions", value: function getDocOptions(doc) { var docIndex = this.getDocIndex(doc); return docIndex === -1 ? null : this.documents[docIndex].options; } }, { key: "now", value: function now() { return (this.window.Date || Date).now(); } }]); return Scope; }(); exports.Scope = Scope; function initScope(scope, window) { win.init(window); _domObjects["default"].init(window); browser.init(window); raf.init(window); events.init(window); scope.usePlugin(_interactions["default"]); scope.document = window.document; scope.window = window; return scope; } }); var _$interactions_23 = createModuleFactory(function (module, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = void 0; var _browser = _interopRequireDefault(_$browser_47); var _domObjects = _interopRequireDefault(_$domObjects_49); /* removed: var _$domUtils_50 = require("@interactjs/utils/domUtils"); */; var _events = _interopRequireDefault(_$events_51); var _pointerUtils = _interopRequireDefault(_$pointerUtils_60); var _Signals = _interopRequireDefault(_$Signals_45); var _Interaction = _interopRequireDefault(_$Interaction_18({})); var _interactionFinder = _interopRequireDefault(_$interactionFinder_22); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function _typeof(obj) { 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); } function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _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); } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } function _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); } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } var methodNames = ['pointerDown', 'pointerMove', 'pointerUp', 'updatePointer', 'removePointer', 'windowBlur']; function install(scope) { var signals = new _Signals["default"](); var listeners = {}; for (var _i = 0; _i < methodNames.length; _i++) { var method = methodNames[_i]; listeners[method] = doOnInteractions(method, scope); } var pEventTypes = _browser["default"].pEventTypes; var eventMap; if (_domObjects["default"].PointerEvent) { eventMap = [{ type: pEventTypes.down, listener: releasePointersOnRemovedEls }, { type: pEventTypes.down, listener: listeners.pointerDown }, { type: pEventTypes.move, listener: listeners.pointerMove }, { type: pEventTypes.up, listener: listeners.pointerUp }, { type: pEventTypes.cancel, listener: listeners.pointerUp }]; } else { eventMap = [{ type: 'mousedown', listener: listeners.pointerDown }, { type: 'mousemove', listener: listeners.pointerMove }, { type: 'mouseup', listener: listeners.pointerUp }, { type: 'touchstart', listener: releasePointersOnRemovedEls }, { type: 'touchstart', listener: listeners.pointerDown }, { type: 'touchmove', listener: listeners.pointerMove }, { type: 'touchend', listener: listeners.pointerUp }, { type: 'touchcancel', listener: listeners.pointerUp }]; } eventMap.push({ type: 'blur', listener: function listener(event) { for (var _i2 = 0; _i2 < scope.interactions.list.length; _i2++) { var _ref; _ref = scope.interactions.list[_i2]; var interaction = _ref; interaction.documentBlur(event); } } }); scope.signals.on('add-document', onDocSignal); scope.signals.on('remove-document', onDocSignal); // for ignoring browser's simulated mouse events scope.prevTouchTime = 0; scope.Interaction = /*#__PURE__*/ function (_InteractionBase) { _inherits(Interaction, _InteractionBase); function Interaction() { _classCallCheck(this, Interaction); return _possibleConstructorReturn(this, _getPrototypeOf(Interaction).apply(this, arguments)); } _createClass(Interaction, [{ key: "_now", value: function _now() { return scope.now(); } }, { key: "pointerMoveTolerance", get: function get() { return scope.interactions.pointerMoveTolerance; }, set: function set(value) { scope.interactions.pointerMoveTolerance = value; } }]); return Interaction; }(_Interaction["default"]); scope.interactions = { signals: signals, // all active and idle interactions list: [], "new": function _new(options) { options.signals = signals; var interaction = new scope.Interaction(options); scope.interactions.list.push(interaction); return interaction; }, listeners: listeners, eventMap: eventMap, pointerMoveTolerance: 1 }; function releasePointersOnRemovedEls() { // for all inactive touch interactions with pointers down for (var _i3 = 0; _i3 < scope.interactions.list.length; _i3++) { var _ref2; _ref2 = scope.interactions.list[_i3]; var interaction = _ref2; if (!interaction.pointerIsDown || interaction.pointerType !== 'touch' || interaction._interacting) { continue; } // if a pointer is down on an element that is no longer in the DOM tree var _loop = function _loop() { _ref3 = interaction.pointers[_i4]; var pointer = _ref3; if (!scope.documents.some(function (_ref4) { var doc = _ref4.doc; return (0, _$domUtils_50.nodeContains)(doc, pointer.downTarget); })) { // remove the pointer from the interaction interaction.removePointer(pointer.pointer, pointer.event); } }; for (var _i4 = 0; _i4 < interaction.pointers.length; _i4++) { var _ref3; _loop(); } } } } function doOnInteractions(method, scope) { return function (event) { var interactions = scope.interactions.list; var pointerType = _pointerUtils["default"].getPointerType(event); var _pointerUtils$getEven = _pointerUtils["default"].getEventTargets(event), _pointerUtils$getEven2 = _slicedToArray(_pointerUtils$getEven, 2), eventTarget = _pointerUtils$getEven2[0], curEventTarget = _pointerUtils$getEven2[1]; var matches = []; // [ [pointer, interaction], ...] if (/^touch/.test(event.type)) { scope.prevTouchTime = scope.now(); for (var _i5 = 0; _i5 < event.changedTouches.length; _i5++) { var _ref5; _ref5 = event.changedTouches[_i5]; var changedTouch = _ref5; var pointer = changedTouch; var pointerId = _pointerUtils["default"].getPointerId(pointer); var searchDetails = { pointer: pointer, pointerId: pointerId, pointerType: pointerType, eventType: event.type, eventTarget: eventTarget, curEventTarget: curEventTarget, scope: scope }; var interaction = getInteraction(searchDetails); matches.push([searchDetails.pointer, searchDetails.eventTarget, searchDetails.curEventTarget, interaction]); } } else { var invalidPointer = false; if (!_browser["default"].supportsPointerEvent && /mouse/.test(event.type)) { // ignore mouse events while touch interactions are active for (var i = 0; i < interactions.length && !invalidPointer; i++) { invalidPointer = interactions[i].pointerType !== 'mouse' && interactions[i].pointerIsDown; } // try to ignore mouse events that are simulated by the browser // after a touch event invalidPointer = invalidPointer || scope.now() - scope.prevTouchTime < 500 || // on iOS and Firefox Mobile, MouseEvent.timeStamp is zero if simulated event.timeStamp === 0; } if (!invalidPointer) { var _searchDetails = { pointer: event, pointerId: _pointerUtils["default"].getPointerId(event), pointerType: pointerType, eventType: event.type, curEventTarget: curEventTarget, eventTarget: eventTarget, scope: scope }; var _interaction = getInteraction(_searchDetails); matches.push([_searchDetails.pointer, _searchDetails.eventTarget, _searchDetails.curEventTarget, _interaction]); } } // eslint-disable-next-line no-shadow for (var _i6 = 0; _i6 < matches.length; _i6++) { var _matches$_i = _slicedToArray(matches[_i6], 4), _pointer = _matches$_i[0], _eventTarget = _matches$_i[1], _curEventTarget = _matches$_i[2], _interaction2 = _matches$_i[3]; _interaction2[method](_pointer, event, _eventTarget, _curEventTarget); } }; } function getInteraction(searchDetails) { var pointerType = searchDetails.pointerType, scope = searchDetails.scope; var foundInteraction = _interactionFinder["default"].search(searchDetails); var signalArg = { interaction: foundInteraction, searchDetails: searchDetails }; scope.interactions.signals.fire('find', signalArg); return signalArg.interaction || scope.interactions["new"]({ pointerType: pointerType }); } function onDocSignal(_ref6, signalName) { var doc = _ref6.doc, scope = _ref6.scope, options = _ref6.options; var eventMap = scope.interactions.eventMap; var eventMethod = signalName.indexOf('add') === 0 ? _events["default"].add : _events["default"].remove; if (scope.browser.isIOS && !options.events) { options.events = { passive: false }; } // delegate event listener for (var eventType in _events["default"].delegatedEvents) { eventMethod(doc, eventType, _events["default"].delegateListener); eventMethod(doc, eventType, _events["default"].delegateUseCapture, true); } var eventOptions = options && options.events; for (var _i7 = 0; _i7 < eventMap.length; _i7++) { var _ref7; _ref7 = eventMap[_i7]; var _ref8 = _ref7, type = _ref8.type, listener = _ref8.listener; eventMethod(doc, type, listener, eventOptions); } } var _default = { id: 'core/interactions', install: install, onDocSignal: onDocSignal, doOnInteractions: doOnInteractions, methodNames: methodNames }; exports["default"] = _default; }); var _$Interaction_18 = createModuleFactory(function (module, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); Object.defineProperty(exports, "PointerInfo", { enumerable: true, get: function get() { return _PointerInfo["default"]; } }); exports["default"] = exports.Interaction = exports._ProxyMethods = exports._ProxyValues = void 0; var utils = _interopRequireWildcard(_$utils_55); var _InteractEvent = _interopRequireWildcard(_$InteractEvent_15); var _PointerInfo = _interopRequireDefault(_$PointerInfo_19); var _scope = _$scope_24({}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _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); } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } var _ProxyValues; exports._ProxyValues = _ProxyValues; (function (_ProxyValues) { _ProxyValues["interactable"] = ""; _ProxyValues["element"] = ""; _ProxyValues["prepared"] = ""; _ProxyValues["pointerIsDown"] = ""; _ProxyValues["pointerWasMoved"] = ""; _ProxyValues["_proxy"] = ""; })(_ProxyValues || (exports._ProxyValues = _ProxyValues = {})); var _ProxyMethods; exports._ProxyMethods = _ProxyMethods; (function (_ProxyMethods) { _ProxyMethods["start"] = ""; _ProxyMethods["move"] = ""; _ProxyMethods["end"] = ""; _ProxyMethods["stop"] = ""; _ProxyMethods["interacting"] = ""; })(_ProxyMethods || (exports._ProxyMethods = _ProxyMethods = {})); var Interaction = /*#__PURE__*/ function () { /** */ function Interaction(_ref) { var _this = this; var pointerType = _ref.pointerType, signals = _ref.signals; _classCallCheck(this, Interaction); // current interactable being interacted with this.interactable = null; // the target element of the interactable this.element = null; // action that's ready to be fired on next move event this.prepared = { name: null, axis: null, edges: null }; // keep track of added pointers this.pointers = []; // pointerdown/mousedown/touchstart event this.downEvent = null; this.downPointer = {}; this._latestPointer = { pointer: null, event: null, eventTarget: null }; // previous action event this.prevEvent = null; this.pointerIsDown = false; this.pointerWasMoved = false; this._interacting = false; this._ending = false; this._proxy = null; this.simulation = null; /** * @alias Interaction.prototype.move */ this.doMove = utils.warnOnce(function (signalArg) { this.move(signalArg); }, 'The interaction.doMove() method has been renamed to interaction.move()'); this.coords = { // Starting InteractEvent pointer coordinates start: utils.pointer.newCoords(), // Previous native pointer move event coordinates prev: utils.pointer.newCoords(), // current native pointer move event coordinates cur: utils.pointer.newCoords(), // Change in coordinates and time of the pointer delta: utils.pointer.newCoords(), // pointer velocity velocity: utils.pointer.newCoords() }; this._signals = signals; this.pointerType = pointerType; var that = this; this._proxy = {}; var _loop = function _loop(key) { Object.defineProperty(_this._proxy, key, { get: function get() { return that[key]; } }); }; for (var key in _ProxyValues) { _loop(key); } var _loop2 = function _loop2(key) { Object.defineProperty(_this._proxy, key, { value: function value() { return that[key].apply(that, arguments); } }); }; for (var key in _ProxyMethods) { _loop2(key); } this._signals.fire('new', { interaction: this }); } _createClass(Interaction, [{ key: "pointerDown", value: function pointerDown(pointer, event, eventTarget) { var pointerIndex = this.updatePointer(pointer, event, eventTarget, true); this._signals.fire('down', { pointer: pointer, event: event, eventTarget: eventTarget, pointerIndex: pointerIndex, interaction: this }); } /** * ```js * interact(target) * .draggable({ * // disable the default drag start by down->move * manualStart: true * }) * // start dragging after the user holds the pointer down * .on('hold', function (event) { * var interaction = event.interaction * * if (!interaction.interacting()) { * interaction.start({ name: 'drag' }, * event.interactable, * event.currentTarget) * } * }) * ``` * * Start an action with the given Interactable and Element as tartgets. The * action must be enabled for the target Interactable and an appropriate * number of pointers must be held down - 1 for drag/resize, 2 for gesture. * * Use it with `interactable.able({ manualStart: false })` to always * [start actions manually](https://github.com/taye/interact.js/issues/114) * * @param {object} action The action to be performed - drag, resize, etc. * @param {Interactable} target The Interactable to target * @param {Element} element The DOM Element to target * @return {object} interact */ }, { key: "start", value: function start(action, interactable, element) { if (this.interacting() || !this.pointerIsDown || this.pointers.length < (action.name === _scope.ActionName.Gesture ? 2 : 1) || !interactable.options[action.name].enabled) { return false; } utils.copyAction(this.prepared, action); this.interactable = interactable; this.element = element; this.rect = interactable.getRect(element); this.edges = this.prepared.edges; this._interacting = this._doPhase({ interaction: this, event: this.downEvent, phase: _InteractEvent.EventPhase.Start }); return this._interacting; } }, { key: "pointerMove", value: function pointerMove(pointer, event, eventTarget) { if (!this.simulation && !(this.modifiers && this.modifiers.endPrevented)) { this.updatePointer(pointer, event, eventTarget, false); utils.pointer.setCoords(this.coords.cur, this.pointers.map(function (p) { return p.pointer; }), this._now()); } var duplicateMove = this.coords.cur.page.x === this.coords.prev.page.x && this.coords.cur.page.y === this.coords.prev.page.y && this.coords.cur.client.x === this.coords.prev.client.x && this.coords.cur.client.y === this.coords.prev.client.y; var dx; var dy; // register movement greater than pointerMoveTolerance if (this.pointerIsDown && !this.pointerWasMoved) { dx = this.coords.cur.client.x - this.coords.start.client.x; dy = this.coords.cur.client.y - this.coords.start.client.y; this.pointerWasMoved = utils.hypot(dx, dy) > this.pointerMoveTolerance; } var signalArg = { pointer: pointer, pointerIndex: this.getPointerIndex(pointer), event: event, eventTarget: eventTarget, dx: dx, dy: dy, duplicate: duplicateMove, interaction: this }; if (!duplicateMove) { // set pointer coordinate, time changes and velocity utils.pointer.setCoordDeltas(this.coords.delta, this.coords.prev, this.coords.cur); utils.pointer.setCoordVelocity(this.coords.velocity, this.coords.delta); } this._signals.fire('move', signalArg); if (!duplicateMove) { // if interacting, fire an 'action-move' signal etc if (this.interacting()) { this.move(signalArg); } if (this.pointerWasMoved) { utils.pointer.copyCoords(this.coords.prev, this.coords.cur); } } } /** * ```js * interact(target) * .draggable(true) * .on('dragmove', function (event) { * if (someCondition) { * // change the snap settings * event.interactable.draggable({ snap: { targets: [] }}) * // fire another move event with re-calculated snap * event.interaction.move() * } * }) * ``` * * Force a move of the current action at the same coordinates. Useful if * snap/restrict has been changed and you want a movement with the new * settings. */ }, { key: "move", value: function move(signalArg) { signalArg = utils.extend({ pointer: this._latestPointer.pointer, event: this._latestPointer.event, eventTarget: this._latestPointer.eventTarget, interaction: this }, signalArg || {}); signalArg.phase = _InteractEvent.EventPhase.Move; this._doPhase(signalArg); } // End interact move events and stop auto-scroll unless simulation is running }, { key: "pointerUp", value: function pointerUp(pointer, event, eventTarget, curEventTarget) { var pointerIndex = this.getPointerIndex(pointer); if (pointerIndex === -1) { pointerIndex = this.updatePointer(pointer, event, eventTarget, false); } this._signals.fire(/cancel$/i.test(event.type) ? 'cancel' : 'up', { pointer: pointer, pointerIndex: pointerIndex, event: event, eventTarget: eventTarget, curEventTarget: curEventTarget, interaction: this }); if (!this.simulation) { this.end(event); } this.pointerIsDown = false; this.removePointer(pointer, event); } }, { key: "documentBlur", value: function documentBlur(event) { this.end(event); this._signals.fire('blur', { event: event, interaction: this }); } /** * ```js * interact(target) * .draggable(true) * .on('move', function (event) { * if (event.pageX > 1000) { * // end the current action * event.interaction.end() * // stop all further listeners from being called * event.stopImmediatePropagation() * } * }) * ``` * * @param {PointerEvent} [event] */ }, { key: "end", value: function end(event) { this._ending = true; event = event || this._latestPointer.event; var endPhaseResult; if (this.interacting()) { endPhaseResult = this._doPhase({ event: event, interaction: this, phase: _InteractEvent.EventPhase.End }); } this._ending = false; if (endPhaseResult === true) { this.stop(); } } }, { key: "currentAction", value: function currentAction() { return this._interacting ? this.prepared.name : null; } }, { key: "interacting", value: function interacting() { return this._interacting; } /** */ }, { key: "stop", value: function stop() { this._signals.fire('stop', { interaction: this }); this.interactable = this.element = null; this._interacting = false; this.prepared.name = this.prevEvent = null; } }, { key: "getPointerIndex", value: function getPointerIndex(pointer) { var pointerId = utils.pointer.getPointerId(pointer); // mouse and pen interactions may have only one pointer return this.pointerType === 'mouse' || this.pointerType === 'pen' ? this.pointers.length - 1 : utils.arr.findIndex(this.pointers, function (curPointer) { return curPointer.id === pointerId; }); } }, { key: "getPointerInfo", value: function getPointerInfo(pointer) { return this.pointers[this.getPointerIndex(pointer)]; } }, { key: "updatePointer", value: function updatePointer(pointer, event, eventTarget, down) { var id = utils.pointer.getPointerId(pointer); var pointerIndex = this.getPointerIndex(pointer); var pointerInfo = this.pointers[pointerIndex]; down = down === false ? false : down || /(down|start)$/i.test(event.type); if (!pointerInfo) { pointerInfo = new _PointerInfo["default"](id, pointer, event, null, null); pointerIndex = this.pointers.length; this.pointers.push(pointerInfo); } else { pointerInfo.pointer = pointer; } if (down) { this.pointerIsDown = true; if (!this.interacting()) { utils.pointer.setCoords(this.coords.start, this.pointers.map(function (p) { return p.pointer; }), this._now()); utils.pointer.copyCoords(this.coords.cur, this.coords.start); utils.pointer.copyCoords(this.coords.prev, this.coords.start); utils.pointer.pointerExtend(this.downPointer, pointer); this.downEvent = event; pointerInfo.downTime = this.coords.cur.timeStamp; pointerInfo.downTarget = eventTarget; this.pointerWasMoved = false; } } this._updateLatestPointer(pointer, event, eventTarget); this._signals.fire('update-pointer', { pointer: pointer, event: event, eventTarget: eventTarget, down: down, pointerInfo: pointerInfo, pointerIndex: pointerIndex, interaction: this }); return pointerIndex; } }, { key: "removePointer", value: function removePointer(pointer, event) { var pointerIndex = this.getPointerIndex(pointer); if (pointerIndex === -1) { return; } var pointerInfo = this.pointers[pointerIndex]; this._signals.fire('remove-pointer', { pointer: pointer, event: event, pointerIndex: pointerIndex, pointerInfo: pointerInfo, interaction: this }); this.pointers.splice(pointerIndex, 1); } }, { key: "_updateLatestPointer", value: function _updateLatestPointer(pointer, event, eventTarget) { this._latestPointer.pointer = pointer; this._latestPointer.event = event; this._latestPointer.eventTarget = eventTarget; } }, { key: "destroy", value: function destroy() { this._latestPointer.pointer = null; this._latestPointer.event = null; this._latestPointer.eventTarget = null; } }, { key: "_createPreparedEvent", value: function _createPreparedEvent(event, phase, preEnd, type) { var actionName = this.prepared.name; return new _InteractEvent["default"](this, event, actionName, phase, this.element, null, preEnd, type); } }, { key: "_fireEvent", value: function _fireEvent(iEvent) { this.interactable.fire(iEvent); if (!this.prevEvent || iEvent.timeStamp >= this.prevEvent.timeStamp) { this.prevEvent = iEvent; } } }, { key: "_doPhase", value: function _doPhase(signalArg) { var event = signalArg.event, phase = signalArg.phase, preEnd = signalArg.preEnd, type = signalArg.type; var beforeResult = this._signals.fire("before-action-".concat(phase), signalArg); if (beforeResult === false) { return false; } var iEvent = signalArg.iEvent = this._createPreparedEvent(event, phase, preEnd, type); var rect = this.rect; if (rect) { // update the rect modifications var edges = this.edges || this.prepared.edges || { left: true, right: true, top: true, bottom: true }; if (edges.top) { rect.top += iEvent.delta.y; } if (edges.bottom) { rect.bottom += iEvent.delta.y; } if (edges.left) { rect.left += iEvent.delta.x; } if (edges.right) { rect.right += iEvent.delta.x; } rect.width = rect.right - rect.left; rect.height = rect.bottom - rect.top; } this._signals.fire("action-".concat(phase), signalArg); this._fireEvent(iEvent); this._signals.fire("after-action-".concat(phase), signalArg); return true; } }, { key: "_now", value: function _now() { return Date.now(); } }, { key: "pointerMoveTolerance", get: function get() { return 1; } }]); return Interaction; }(); exports.Interaction = Interaction; var _default = Interaction; exports["default"] = _default; }); var _$arr_46 = {}; "use strict"; Object.defineProperty(_$arr_46, "__esModule", { value: true }); _$arr_46.contains = contains; _$arr_46.remove = remove; _$arr_46.merge = merge; _$arr_46.from = from; _$arr_46.findIndex = findIndex; _$arr_46.find = find; function contains(array, target) { return array.indexOf(target) !== -1; } function remove(array, target) { return array.splice(array.indexOf(target), 1); } function merge(target, source) { for (var _i = 0; _i < source.length; _i++) { var _ref; _ref = source[_i]; var item = _ref; target.push(item); } return target; } function from(source) { return merge([], source); } function findIndex(array, func) { for (var i = 0; i < array.length; i++) { if (func(array[i], i, array)) { return i; } } return -1; } function find(array, func) { return array[findIndex(array, func)]; } var _$domObjects_49 = {}; "use strict"; Object.defineProperty(_$domObjects_49, "__esModule", { value: true }); _$domObjects_49["default"] = void 0; var domObjects = { init: init, document: null, DocumentFragment: null, SVGElement: null, SVGSVGElement: null, // eslint-disable-next-line no-undef SVGElementInstance: null, Element: null, HTMLElement: null, Event: null, Touch: null, PointerEvent: null }; function blank() {} var _default = domObjects; _$domObjects_49["default"] = _default; function init(window) { var win = window; domObjects.document = win.document; domObjects.DocumentFragment = win.DocumentFragment || blank; domObjects.SVGElement = win.SVGElement || blank; domObjects.SVGSVGElement = win.SVGSVGElement || blank; domObjects.SVGElementInstance = win.SVGElementInstance || blank; domObjects.Element = win.Element || blank; domObjects.HTMLElement = win.HTMLElement || domObjects.Element; domObjects.Event = win.Event; domObjects.Touch = win.Touch || blank; domObjects.PointerEvent = win.PointerEvent || win.MSPointerEvent; } var _$isWindow_57 = {}; "use strict"; Object.defineProperty(_$isWindow_57, "__esModule", { value: true }); _$isWindow_57["default"] = void 0; var ___default_57 = function _default(thing) { return !!(thing && thing.Window) && thing instanceof thing.Window; }; _$isWindow_57["default"] = ___default_57; var _$window_65 = {}; "use strict"; Object.defineProperty(_$window_65, "__esModule", { value: true }); _$window_65.init = __init_65; _$window_65.getWindow = getWindow; _$window_65["default"] = void 0; var _isWindow = _interopRequireDefault(_$isWindow_57); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } var win = { realWindow: undefined, window: undefined, getWindow: getWindow, init: __init_65 }; function __init_65(window) { // get wrapped window if using Shadow DOM polyfill win.realWindow = window; // create a TextNode var el = window.document.createTextNode(''); // check if it's wrapped by a polyfill if (el.ownerDocument !== window.document && typeof window.wrap === 'function' && window.wrap(el) === el) { // use wrapped window window = window.wrap(window); } win.window = window; } if (typeof window === 'undefined') { win.window = undefined; win.realWindow = undefined; } else { __init_65(window); } function getWindow(node) { if ((0, _isWindow["default"])(node)) { return node; } var rootNode = node.ownerDocument || node; return rootNode.defaultView || win.window; } win.init = __init_65; var ___default_65 = win; _$window_65["default"] = ___default_65; var _$is_56 = {}; "use strict"; Object.defineProperty(_$is_56, "__esModule", { value: true }); _$is_56.array = _$is_56.plainObject = _$is_56.element = _$is_56.string = _$is_56.bool = _$is_56.number = _$is_56.func = _$is_56.object = _$is_56.docFrag = _$is_56.window = void 0; var ___isWindow_56 = ___interopRequireDefault_56(_$isWindow_57); var _window2 = ___interopRequireDefault_56(_$window_65); function ___interopRequireDefault_56(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function _typeof(obj) { 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); } var __window_56 = function window(thing) { return thing === _window2["default"].window || (0, ___isWindow_56["default"])(thing); }; _$is_56.window = __window_56; var docFrag = function docFrag(thing) { return object(thing) && thing.nodeType === 11; }; _$is_56.docFrag = docFrag; var object = function object(thing) { return !!thing && _typeof(thing) === 'object'; }; _$is_56.object = object; var func = function func(thing) { return typeof thing === 'function'; }; _$is_56.func = func; var number = function number(thing) { return typeof thing === 'number'; }; _$is_56.number = number; var bool = function bool(thing) { return typeof thing === 'boolean'; }; _$is_56.bool = bool; var string = function string(thing) { return typeof thing === 'string'; }; _$is_56.string = string; var element = function element(thing) { if (!thing || _typeof(thing) !== 'object') { return false; } var _window = _window2["default"].getWindow(thing) || _window2["default"].window; return /object|function/.test(_typeof(_window.Element)) ? thing instanceof _window.Element // DOM2 : thing.nodeType === 1 && typeof thing.nodeName === 'string'; }; _$is_56.element = element; var plainObject = function plainObject(thing) { return object(thing) && !!thing.constructor && /function Object\b/.test(thing.constructor.toString()); }; _$is_56.plainObject = plainObject; var array = function array(thing) { return object(thing) && typeof thing.length !== 'undefined' && func(thing.splice); }; _$is_56.array = array; var _$browser_47 = {}; "use strict"; Object.defineProperty(_$browser_47, "__esModule", { value: true }); _$browser_47["default"] = void 0; var _domObjects = ___interopRequireDefault_47(_$domObjects_49); var is = _interopRequireWildcard(_$is_56); var _window = ___interopRequireDefault_47(_$window_65); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_47(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } var browser = { init: __init_47, supportsTouch: null, supportsPointerEvent: null, isIOS7: null, isIOS: null, isIe9: null, isOperaMobile: null, prefixedMatchesSelector: null, pEventTypes: null, wheelEvent: null }; function __init_47(window) { var Element = _domObjects["default"].Element; var navigator = _window["default"].window.navigator; // Does the browser support touch input? browser.supportsTouch = 'ontouchstart' in window || is.func(window.DocumentTouch) && _domObjects["default"].document instanceof window.DocumentTouch; // Does the browser support PointerEvents browser.supportsPointerEvent = navigator.pointerEnabled !== false && !!_domObjects["default"].PointerEvent; browser.isIOS = /iP(hone|od|ad)/.test(navigator.platform); // scrolling doesn't change the result of getClientRects on iOS 7 browser.isIOS7 = /iP(hone|od|ad)/.test(navigator.platform) && /OS 7[^\d]/.test(navigator.appVersion); browser.isIe9 = /MSIE 9/.test(navigator.userAgent); // Opera Mobile must be handled differently browser.isOperaMobile = navigator.appName === 'Opera' && browser.supportsTouch && /Presto/.test(navigator.userAgent); // prefix matchesSelector browser.prefixedMatchesSelector = 'matches' in Element.prototype ? 'matches' : 'webkitMatchesSelector' in Element.prototype ? 'webkitMatchesSelector' : 'mozMatchesSelector' in Element.prototype ? 'mozMatchesSelector' : 'oMatchesSelector' in Element.prototype ? 'oMatchesSelector' : 'msMatchesSelector'; browser.pEventTypes = browser.supportsPointerEvent ? _domObjects["default"].PointerEvent === window.MSPointerEvent ? { up: 'MSPointerUp', down: 'MSPointerDown', over: 'mouseover', out: 'mouseout', move: 'MSPointerMove', cancel: 'MSPointerCancel' } : { up: 'pointerup', down: 'pointerdown', over: 'pointerover', out: 'pointerout', move: 'pointermove', cancel: 'pointercancel' } : null; // because Webkit and Opera still use 'mousewheel' event type browser.wheelEvent = 'onmousewheel' in _domObjects["default"].document ? 'mousewheel' : 'wheel'; } var ___default_47 = browser; _$browser_47["default"] = ___default_47; var _$domUtils_50 = {}; "use strict"; Object.defineProperty(_$domUtils_50, "__esModule", { value: true }); _$domUtils_50.nodeContains = nodeContains; _$domUtils_50.closest = closest; _$domUtils_50.parentNode = parentNode; _$domUtils_50.matchesSelector = matchesSelector; _$domUtils_50.indexOfDeepestElement = indexOfDeepestElement; _$domUtils_50.matchesUpTo = matchesUpTo; _$domUtils_50.getActualElement = getActualElement; _$domUtils_50.getScrollXY = getScrollXY; _$domUtils_50.getElementClientRect = getElementClientRect; _$domUtils_50.getElementRect = getElementRect; _$domUtils_50.getPath = getPath; _$domUtils_50.trySelector = trySelector; var _browser = ___interopRequireDefault_50(_$browser_47); var ___domObjects_50 = ___interopRequireDefault_50(_$domObjects_49); var __is_50 = ___interopRequireWildcard_50(_$is_56); var ___window_50 = ___interopRequireDefault_50(_$window_65); function ___interopRequireWildcard_50(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_50(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function nodeContains(parent, child) { while (child) { if (child === parent) { return true; } child = child.parentNode; } return false; } function closest(element, selector) { while (__is_50.element(element)) { if (matchesSelector(element, selector)) { return element; } element = parentNode(element); } return null; } function parentNode(node) { var parent = node.parentNode; if (__is_50.docFrag(parent)) { // skip past #shado-root fragments // tslint:disable-next-line while ((parent = parent.host) && __is_50.docFrag(parent)) { continue; } return parent; } return parent; } function matchesSelector(element, selector) { // remove /deep/ from selectors if shadowDOM polyfill is used if (___window_50["default"].window !== ___window_50["default"].realWindow) { selector = selector.replace(/\/deep\//g, ' '); } return element[_browser["default"].prefixedMatchesSelector](selector); } var getParent = function getParent(el) { return el.parentNode ? el.parentNode : el.host; }; // Test for the element that's "above" all other qualifiers function indexOfDeepestElement(elements) { var deepestZoneParents = []; var dropzoneParents = []; var dropzone; var deepestZone = elements[0]; var index = deepestZone ? 0 : -1; var parent; var child; var i; var n; for (i = 1; i < elements.length; i++) { dropzone = elements[i]; // an element might belong to multiple selector dropzones if (!dropzone || dropzone === deepestZone) { continue; } if (!deepestZone) { deepestZone = dropzone; index = i; continue; } // check if the deepest or current are document.documentElement or document.rootElement // - if the current dropzone is, do nothing and continue if (dropzone.parentNode === dropzone.ownerDocument) { continue; } // - if deepest is, update with the current dropzone and continue to next else if (deepestZone.parentNode === dropzone.ownerDocument) { deepestZone = dropzone; index = i; continue; } if (!deepestZoneParents.length) { parent = deepestZone; while (getParent(parent) && getParent(parent) !== parent.ownerDocument) { deepestZoneParents.unshift(parent); parent = getParent(parent); } } // if this element is an svg element and the current deepest is // an HTMLElement if (deepestZone instanceof ___domObjects_50["default"].HTMLElement && dropzone instanceof ___domObjects_50["default"].SVGElement && !(dropzone instanceof ___domObjects_50["default"].SVGSVGElement)) { if (dropzone === deepestZone.parentNode) { continue; } parent = dropzone.ownerSVGElement; } else { parent = dropzone; } dropzoneParents = []; while (parent.parentNode !== parent.ownerDocument) { dropzoneParents.unshift(parent); parent = getParent(parent); } n = 0; // get (position of last common ancestor) + 1 while (dropzoneParents[n] && dropzoneParents[n] === deepestZoneParents[n]) { n++; } var parents = [dropzoneParents[n - 1], dropzoneParents[n], deepestZoneParents[n]]; child = parents[0].lastChild; while (child) { if (child === parents[1]) { deepestZone = dropzone; index = i; deepestZoneParents = []; break; } else if (child === parents[2]) { break; } child = child.previousSibling; } } return index; } function matchesUpTo(element, selector, limit) { while (__is_50.element(element)) { if (matchesSelector(element, selector)) { return true; } element = parentNode(element); if (element === limit) { return matchesSelector(element, selector); } } return false; } function getActualElement(element) { return element instanceof ___domObjects_50["default"].SVGElementInstance ? element.correspondingUseElement : element; } function getScrollXY(relevantWindow) { relevantWindow = relevantWindow || ___window_50["default"].window; return { x: relevantWindow.scrollX || relevantWindow.document.documentElement.scrollLeft, y: relevantWindow.scrollY || relevantWindow.document.documentElement.scrollTop }; } function getElementClientRect(element) { var clientRect = element instanceof ___domObjects_50["default"].SVGElement ? element.getBoundingClientRect() : element.getClientRects()[0]; return clientRect && { left: clientRect.left, right: clientRect.right, top: clientRect.top, bottom: clientRect.bottom, width: clientRect.width || clientRect.right - clientRect.left, height: clientRect.height || clientRect.bottom - clientRect.top }; } function getElementRect(element) { var clientRect = getElementClientRect(element); if (!_browser["default"].isIOS7 && clientRect) { var scroll = getScrollXY(___window_50["default"].getWindow(element)); clientRect.left += scroll.x; clientRect.right += scroll.x; clientRect.top += scroll.y; clientRect.bottom += scroll.y; } return clientRect; } function getPath(node) { var path = []; while (node) { path.push(node); node = parentNode(node); } return path; } function trySelector(value) { if (!__is_50.string(value)) { return false; } // an exception will be raised if it is invalid ___domObjects_50["default"].document.querySelector(value); return true; } var _$clone_48 = {}; "use strict"; Object.defineProperty(_$clone_48, "__esModule", { value: true }); _$clone_48["default"] = clone; var arr = ___interopRequireWildcard_48(_$arr_46); var __is_48 = ___interopRequireWildcard_48(_$is_56); function ___interopRequireWildcard_48(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function clone(source) { var dest = {}; for (var prop in source) { var value = source[prop]; if (__is_48.plainObject(value)) { dest[prop] = clone(value); } else if (__is_48.array(value)) { dest[prop] = arr.from(value); } else { dest[prop] = value; } } return dest; } var _$pointerExtend_59 = {}; "use strict"; Object.defineProperty(_$pointerExtend_59, "__esModule", { value: true }); _$pointerExtend_59["default"] = void 0; function pointerExtend(dest, source) { for (var prop in source) { var prefixedPropREs = pointerExtend.prefixedPropREs; var deprecated = false; // skip deprecated prefixed properties for (var vendor in prefixedPropREs) { if (prop.indexOf(vendor) === 0 && prefixedPropREs[vendor].test(prop)) { deprecated = true; break; } } if (!deprecated && typeof source[prop] !== 'function') { dest[prop] = source[prop]; } } return dest; } pointerExtend.prefixedPropREs = { webkit: /(Movement[XY]|Radius[XY]|RotationAngle|Force)$/ }; var ___default_59 = pointerExtend; _$pointerExtend_59["default"] = ___default_59; var _$hypot_54 = {}; "use strict"; Object.defineProperty(_$hypot_54, "__esModule", { value: true }); _$hypot_54["default"] = void 0; var ___default_54 = function _default(x, y) { return Math.sqrt(x * x + y * y); }; _$hypot_54["default"] = ___default_54; var _$pointerUtils_60 = {}; "use strict"; Object.defineProperty(_$pointerUtils_60, "__esModule", { value: true }); _$pointerUtils_60["default"] = void 0; var ___browser_60 = ___interopRequireDefault_60(_$browser_47); var ___domObjects_60 = ___interopRequireDefault_60(_$domObjects_49); var domUtils = ___interopRequireWildcard_60(_$domUtils_50); var _hypot = ___interopRequireDefault_60(_$hypot_54); var __is_60 = ___interopRequireWildcard_60(_$is_56); var _pointerExtend = ___interopRequireDefault_60(_$pointerExtend_59); function ___interopRequireWildcard_60(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_60(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } var pointerUtils = { copyCoords: function copyCoords(dest, src) { dest.page = dest.page || {}; dest.page.x = src.page.x; dest.page.y = src.page.y; dest.client = dest.client || {}; dest.client.x = src.client.x; dest.client.y = src.client.y; dest.timeStamp = src.timeStamp; }, setCoordDeltas: function setCoordDeltas(targetObj, prev, cur) { targetObj.page.x = cur.page.x - prev.page.x; targetObj.page.y = cur.page.y - prev.page.y; targetObj.client.x = cur.client.x - prev.client.x; targetObj.client.y = cur.client.y - prev.client.y; targetObj.timeStamp = cur.timeStamp - prev.timeStamp; }, setCoordVelocity: function setCoordVelocity(targetObj, delta) { var dt = Math.max(delta.timeStamp / 1000, 0.001); targetObj.page.x = delta.page.x / dt; targetObj.page.y = delta.page.y / dt; targetObj.client.x = delta.client.x / dt; targetObj.client.y = delta.client.y / dt; targetObj.timeStamp = dt; }, isNativePointer: function isNativePointer(pointer) { return pointer instanceof ___domObjects_60["default"].Event || pointer instanceof ___domObjects_60["default"].Touch; }, // Get specified X/Y coords for mouse or event.touches[0] getXY: function getXY(type, pointer, xy) { xy = xy || {}; type = type || 'page'; xy.x = pointer[type + 'X']; xy.y = pointer[type + 'Y']; return xy; }, getPageXY: function getPageXY(pointer, page) { page = page || { x: 0, y: 0 }; // Opera Mobile handles the viewport and scrolling oddly if (___browser_60["default"].isOperaMobile && pointerUtils.isNativePointer(pointer)) { pointerUtils.getXY('screen', pointer, page); page.x += window.scrollX; page.y += window.scrollY; } else { pointerUtils.getXY('page', pointer, page); } return page; }, getClientXY: function getClientXY(pointer, client) { client = client || {}; if (___browser_60["default"].isOperaMobile && pointerUtils.isNativePointer(pointer)) { // Opera Mobile handles the viewport and scrolling oddly pointerUtils.getXY('screen', pointer, client); } else { pointerUtils.getXY('client', pointer, client); } return client; }, getPointerId: function getPointerId(pointer) { return __is_60.number(pointer.pointerId) ? pointer.pointerId : pointer.identifier; }, setCoords: function setCoords(targetObj, pointers, timeStamp) { var pointer = pointers.length > 1 ? pointerUtils.pointerAverage(pointers) : pointers[0]; var tmpXY = {}; pointerUtils.getPageXY(pointer, tmpXY); targetObj.page.x = tmpXY.x; targetObj.page.y = tmpXY.y; pointerUtils.getClientXY(pointer, tmpXY); targetObj.client.x = tmpXY.x; targetObj.client.y = tmpXY.y; targetObj.timeStamp = timeStamp; }, pointerExtend: _pointerExtend["default"], getTouchPair: function getTouchPair(event) { var touches = []; // array of touches is supplied if (__is_60.array(event)) { touches[0] = event[0]; touches[1] = event[1]; } // an event else { if (event.type === 'touchend') { if (event.touches.length === 1) { touches[0] = event.touches[0]; touches[1] = event.changedTouches[0]; } else if (event.touches.length === 0) { touches[0] = event.changedTouches[0]; touches[1] = event.changedTouches[1]; } } else { touches[0] = event.touches[0]; touches[1] = event.touches[1]; } } return touches; }, pointerAverage: function pointerAverage(pointers) { var average = { pageX: 0, pageY: 0, clientX: 0, clientY: 0, screenX: 0, screenY: 0 }; for (var _i = 0; _i < pointers.length; _i++) { var _ref; _ref = pointers[_i]; var pointer = _ref; for (var _prop in average) { average[_prop] += pointer[_prop]; } } for (var prop in average) { average[prop] /= pointers.length; } return average; }, touchBBox: function touchBBox(event) { if (!event.length && !(event.touches && event.touches.length > 1)) { return null; } var touches = pointerUtils.getTouchPair(event); var minX = Math.min(touches[0].pageX, touches[1].pageX); var minY = Math.min(touches[0].pageY, touches[1].pageY); var maxX = Math.max(touches[0].pageX, touches[1].pageX); var maxY = Math.max(touches[0].pageY, touches[1].pageY); return { x: minX, y: minY, left: minX, top: minY, right: maxX, bottom: maxY, width: maxX - minX, height: maxY - minY }; }, touchDistance: function touchDistance(event, deltaSource) { var sourceX = deltaSource + 'X'; var sourceY = deltaSource + 'Y'; var touches = pointerUtils.getTouchPair(event); var dx = touches[0][sourceX] - touches[1][sourceX]; var dy = touches[0][sourceY] - touches[1][sourceY]; return (0, _hypot["default"])(dx, dy); }, touchAngle: function touchAngle(event, deltaSource) { var sourceX = deltaSource + 'X'; var sourceY = deltaSource + 'Y'; var touches = pointerUtils.getTouchPair(event); var dx = touches[1][sourceX] - touches[0][sourceX]; var dy = touches[1][sourceY] - touches[0][sourceY]; var angle = 180 * Math.atan2(dy, dx) / Math.PI; return angle; }, getPointerType: function getPointerType(pointer) { return __is_60.string(pointer.pointerType) ? pointer.pointerType : __is_60.number(pointer.pointerType) ? [undefined, undefined, 'touch', 'pen', 'mouse'][pointer.pointerType] // if the PointerEvent API isn't available, then the "pointer" must // be either a MouseEvent, TouchEvent, or Touch object : /touch/.test(pointer.type) || pointer instanceof ___domObjects_60["default"].Touch ? 'touch' : 'mouse'; }, // [ event.target, event.currentTarget ] getEventTargets: function getEventTargets(event) { var path = __is_60.func(event.composedPath) ? event.composedPath() : event.path; return [domUtils.getActualElement(path ? path[0] : event.target), domUtils.getActualElement(event.currentTarget)]; }, newCoords: function newCoords() { return { page: { x: 0, y: 0 }, client: { x: 0, y: 0 }, timeStamp: 0 }; }, coordsToEvent: function coordsToEvent(coords) { var event = { coords: coords, get page() { return this.coords.page; }, get client() { return this.coords.client; }, get timeStamp() { return this.coords.timeStamp; }, get pageX() { return this.coords.page.x; }, get pageY() { return this.coords.page.y; }, get clientX() { return this.coords.client.x; }, get clientY() { return this.coords.client.y; }, get pointerId() { return this.coords.pointerId; }, get target() { return this.coords.target; }, get type() { return this.coords.type; }, get pointerType() { return this.coords.pointerType; } }; return event; } }; var ___default_60 = pointerUtils; _$pointerUtils_60["default"] = ___default_60; var _$events_51 = {}; "use strict"; Object.defineProperty(_$events_51, "__esModule", { value: true }); _$events_51["default"] = _$events_51.FakeEvent = void 0; /* removed: var _$arr_46 = require("./arr"); */; var __domUtils_51 = ___interopRequireWildcard_51(_$domUtils_50); var __is_51 = ___interopRequireWildcard_51(_$is_56); var ___pointerExtend_51 = ___interopRequireDefault_51(_$pointerExtend_59); var _pointerUtils = ___interopRequireDefault_51(_$pointerUtils_60); function ___interopRequireDefault_51(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_51(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _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); } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } var elements = []; var targets = []; var delegatedEvents = {}; var documents = []; function add(element, type, listener, optionalArg) { var options = getOptions(optionalArg); var elementIndex = elements.indexOf(element); var target = targets[elementIndex]; if (!target) { target = { events: {}, typeCount: 0 }; elementIndex = elements.push(element) - 1; targets.push(target); } if (!target.events[type]) { target.events[type] = []; target.typeCount++; } if (!(0, _$arr_46.contains)(target.events[type], listener)) { element.addEventListener(type, listener, events.supportsOptions ? options : !!options.capture); target.events[type].push(listener); } } function __remove_51(element, type, listener, optionalArg) { var options = getOptions(optionalArg); var elementIndex = elements.indexOf(element); var target = targets[elementIndex]; if (!target || !target.events) { return; } if (type === 'all') { for (type in target.events) { if (target.events.hasOwnProperty(type)) { __remove_51(element, type, 'all'); } } return; } if (target.events[type]) { var len = target.events[type].length; if (listener === 'all') { for (var i = 0; i < len; i++) { __remove_51(element, type, target.events[type][i], options); } return; } else { for (var _i = 0; _i < len; _i++) { if (target.events[type][_i] === listener) { element.removeEventListener(type, listener, events.supportsOptions ? options : !!options.capture); target.events[type].splice(_i, 1); break; } } } if (target.events[type] && target.events[type].length === 0) { target.events[type] = null; target.typeCount--; } } if (!target.typeCount) { targets.splice(elementIndex, 1); elements.splice(elementIndex, 1); } } function addDelegate(selector, context, type, listener, optionalArg) { var options = getOptions(optionalArg); if (!delegatedEvents[type]) { delegatedEvents[type] = { contexts: [], listeners: [], selectors: [] }; // add delegate listener functions for (var _i2 = 0; _i2 < documents.length; _i2++) { var doc = documents[_i2]; add(doc, type, delegateListener); add(doc, type, delegateUseCapture, true); } } var delegated = delegatedEvents[type]; var index; for (index = delegated.selectors.length - 1; index >= 0; index--) { if (delegated.selectors[index] === selector && delegated.contexts[index] === context) { break; } } if (index === -1) { index = delegated.selectors.length; delegated.selectors.push(selector); delegated.contexts.push(context); delegated.listeners.push([]); } // keep listener and capture and passive flags delegated.listeners[index].push([listener, !!options.capture, options.passive]); } function removeDelegate(selector, context, type, listener, optionalArg) { var options = getOptions(optionalArg); var delegated = delegatedEvents[type]; var matchFound = false; var index; if (!delegated) { return; } // count from last index of delegated to 0 for (index = delegated.selectors.length - 1; index >= 0; index--) { // look for matching selector and context Node if (delegated.selectors[index] === selector && delegated.contexts[index] === context) { var listeners = delegated.listeners[index]; // each item of the listeners array is an array: [function, capture, passive] for (var i = listeners.length - 1; i >= 0; i--) { var _listeners$i = _slicedToArray(listeners[i], 3), fn = _listeners$i[0], capture = _listeners$i[1], passive = _listeners$i[2]; // check if the listener functions and capture and passive flags match if (fn === listener && capture === !!options.capture && passive === options.passive) { // remove the listener from the array of listeners listeners.splice(i, 1); // if all listeners for this interactable have been removed // remove the interactable from the delegated arrays if (!listeners.length) { delegated.selectors.splice(index, 1); delegated.contexts.splice(index, 1); delegated.listeners.splice(index, 1); // remove delegate function from context __remove_51(context, type, delegateListener); __remove_51(context, type, delegateUseCapture, true); // remove the arrays if they are empty if (!delegated.selectors.length) { delegatedEvents[type] = null; } } // only remove one listener matchFound = true; break; } } if (matchFound) { break; } } } } // bound to the interactable context when a DOM event // listener is added to a selector interactable function delegateListener(event, optionalArg) { var options = getOptions(optionalArg); var fakeEvent = new FakeEvent(event); var delegated = delegatedEvents[event.type]; var _pointerUtils$getEven = _pointerUtils["default"].getEventTargets(event), _pointerUtils$getEven2 = _slicedToArray(_pointerUtils$getEven, 1), eventTarget = _pointerUtils$getEven2[0]; var element = eventTarget; // climb up document tree looking for selector matches while (__is_51.element(element)) { for (var i = 0; i < delegated.selectors.length; i++) { var selector = delegated.selectors[i]; var context = delegated.contexts[i]; if (__domUtils_51.matchesSelector(element, selector) && __domUtils_51.nodeContains(context, eventTarget) && __domUtils_51.nodeContains(context, element)) { var listeners = delegated.listeners[i]; fakeEvent.currentTarget = element; for (var _i3 = 0; _i3 < listeners.length; _i3++) { var _ref; _ref = listeners[_i3]; var _ref2 = _ref, _ref3 = _slicedToArray(_ref2, 3), fn = _ref3[0], capture = _ref3[1], passive = _ref3[2]; if (capture === !!options.capture && passive === options.passive) { fn(fakeEvent); } } } } element = __domUtils_51.parentNode(element); } } function delegateUseCapture(event) { return delegateListener.call(this, event, true); } function getOptions(param) { return __is_51.object(param) ? param : { capture: param }; } var FakeEvent = /*#__PURE__*/ function () { function FakeEvent(originalEvent) { _classCallCheck(this, FakeEvent); this.originalEvent = originalEvent; // duplicate the event so that currentTarget can be changed (0, ___pointerExtend_51["default"])(this, originalEvent); } _createClass(FakeEvent, [{ key: "preventOriginalDefault", value: function preventOriginalDefault() { this.originalEvent.preventDefault(); } }, { key: "stopPropagation", value: function stopPropagation() { this.originalEvent.stopPropagation(); } }, { key: "stopImmediatePropagation", value: function stopImmediatePropagation() { this.originalEvent.stopImmediatePropagation(); } }]); return FakeEvent; }(); _$events_51.FakeEvent = FakeEvent; var events = { add: add, remove: __remove_51, addDelegate: addDelegate, removeDelegate: removeDelegate, delegateListener: delegateListener, delegateUseCapture: delegateUseCapture, delegatedEvents: delegatedEvents, documents: documents, supportsOptions: false, supportsPassive: false, _elements: elements, _targets: targets, init: function init(window) { window.document.createElement('div').addEventListener('test', null, { get capture() { return events.supportsOptions = true; }, get passive() { return events.supportsPassive = true; } }); } }; var ___default_51 = events; _$events_51["default"] = ___default_51; var _$extend_52 = {}; "use strict"; Object.defineProperty(_$extend_52, "__esModule", { value: true }); _$extend_52["default"] = extend; function extend(dest, source) { for (var prop in source) { dest[prop] = source[prop]; } return dest; } var _$rect_62 = {}; "use strict"; Object.defineProperty(_$rect_62, "__esModule", { value: true }); _$rect_62.getStringOptionResult = getStringOptionResult; _$rect_62.resolveRectLike = resolveRectLike; _$rect_62.rectToXY = rectToXY; _$rect_62.xywhToTlbr = xywhToTlbr; _$rect_62.tlbrToXywh = tlbrToXywh; _$rect_62["default"] = void 0; /* removed: var _$domUtils_50 = require("./domUtils"); */; var _extend = ___interopRequireDefault_62(_$extend_52); var __is_62 = ___interopRequireWildcard_62(_$is_56); function ___interopRequireWildcard_62(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_62(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function getStringOptionResult(value, interactable, element) { if (!__is_62.string(value)) { return null; } if (value === 'parent') { value = (0, _$domUtils_50.parentNode)(element); } else if (value === 'self') { value = interactable.getRect(element); } else { value = (0, _$domUtils_50.closest)(element, value); } return value; } function resolveRectLike(value, interactable, element, functionArgs) { value = getStringOptionResult(value, interactable, element) || value; if (__is_62.func(value)) { value = value.apply(null, functionArgs); } if (__is_62.element(value)) { value = (0, _$domUtils_50.getElementRect)(value); } return value; } function rectToXY(rect) { return rect && { x: 'x' in rect ? rect.x : rect.left, y: 'y' in rect ? rect.y : rect.top }; } function xywhToTlbr(rect) { if (rect && !('left' in rect && 'top' in rect)) { rect = (0, _extend["default"])({}, rect); rect.left = rect.x || 0; rect.top = rect.y || 0; rect.right = rect.right || rect.left + rect.width; rect.bottom = rect.bottom || rect.top + rect.height; } return rect; } function tlbrToXywh(rect) { if (rect && !('x' in rect && 'y' in rect)) { rect = (0, _extend["default"])({}, rect); rect.x = rect.left || 0; rect.y = rect.top || 0; rect.width = rect.width || rect.right - rect.x; rect.height = rect.height || rect.bottom - rect.y; } return rect; } var ___default_62 = { getStringOptionResult: getStringOptionResult, resolveRectLike: resolveRectLike, rectToXY: rectToXY, xywhToTlbr: xywhToTlbr, tlbrToXywh: tlbrToXywh }; _$rect_62["default"] = ___default_62; var _$getOriginXY_53 = {}; "use strict"; Object.defineProperty(_$getOriginXY_53, "__esModule", { value: true }); _$getOriginXY_53["default"] = ___default_53; /* removed: var _$rect_62 = require("./rect"); */; function ___default_53(target, element, action) { var actionOptions = target.options[action]; var actionOrigin = actionOptions && actionOptions.origin; var origin = actionOrigin || target.options.origin; var originRect = (0, _$rect_62.resolveRectLike)(origin, target, element, [target && element]); return (0, _$rect_62.rectToXY)(originRect) || { x: 0, y: 0 }; } var _$normalizeListeners_58 = {}; "use strict"; Object.defineProperty(_$normalizeListeners_58, "__esModule", { value: true }); _$normalizeListeners_58["default"] = normalize; var ___extend_58 = ___interopRequireDefault_58(_$extend_52); var __is_58 = ___interopRequireWildcard_58(_$is_56); function ___interopRequireWildcard_58(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_58(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function normalize(type, listeners, result) { result = result || {}; if (__is_58.string(type) && type.search(' ') !== -1) { type = split(type); } if (__is_58.array(type)) { return type.reduce(function (acc, t) { return (0, ___extend_58["default"])(acc, normalize(t, listeners, result)); }, result); } // ({ type: fn }) -> ('', { type: fn }) if (__is_58.object(type)) { listeners = type; type = ''; } if (__is_58.func(listeners)) { result[type] = result[type] || []; result[type].push(listeners); } else if (__is_58.array(listeners)) { for (var _i = 0; _i < listeners.length; _i++) { var _ref; _ref = listeners[_i]; var l = _ref; normalize(type, l, result); } } else if (__is_58.object(listeners)) { for (var prefix in listeners) { var combinedTypes = split(prefix).map(function (p) { return "".concat(type).concat(p); }); normalize(combinedTypes, listeners[prefix], result); } } return result; } function split(type) { return type.trim().split(/ +/); } var _$raf_61 = {}; "use strict"; Object.defineProperty(_$raf_61, "__esModule", { value: true }); _$raf_61["default"] = void 0; var lastTime = 0; var _request; var _cancel; function __init_61(window) { _request = window.requestAnimationFrame; _cancel = window.cancelAnimationFrame; if (!_request) { var vendors = ['ms', 'moz', 'webkit', 'o']; for (var _i = 0; _i < vendors.length; _i++) { var vendor = vendors[_i]; _request = window["".concat(vendor, "RequestAnimationFrame")]; _cancel = window["".concat(vendor, "CancelAnimationFrame")] || window["".concat(vendor, "CancelRequestAnimationFrame")]; } } if (!_request) { _request = function request(callback) { var currTime = Date.now(); var timeToCall = Math.max(0, 16 - (currTime - lastTime)); // eslint-disable-next-line standard/no-callback-literal var token = setTimeout(function () { callback(currTime + timeToCall); }, timeToCall); lastTime = currTime + timeToCall; return token; }; _cancel = function cancel(token) { return clearTimeout(token); }; } } var ___default_61 = { request: function request(callback) { return _request(callback); }, cancel: function cancel(token) { return _cancel(token); }, init: __init_61 }; _$raf_61["default"] = ___default_61; var _$Signals_45 = {}; "use strict"; Object.defineProperty(_$Signals_45, "__esModule", { value: true }); _$Signals_45["default"] = void 0; function ___classCallCheck_45(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_45(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); } } function ___createClass_45(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_45(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_45(Constructor, staticProps); return Constructor; } var Signals = /*#__PURE__*/ function () { function Signals() { ___classCallCheck_45(this, Signals); this.listeners = {}; } ___createClass_45(Signals, [{ key: "on", value: function on(name, listener) { if (!this.listeners[name]) { this.listeners[name] = [listener]; return; } this.listeners[name].push(listener); } }, { key: "off", value: function off(name, listener) { if (!this.listeners[name]) { return; } var index = this.listeners[name].indexOf(listener); if (index !== -1) { this.listeners[name].splice(index, 1); } } }, { key: "fire", value: function fire(name, arg) { var targetListeners = this.listeners[name]; if (!targetListeners) { return; } for (var _i = 0; _i < targetListeners.length; _i++) { var _ref; _ref = targetListeners[_i]; var listener = _ref; if (listener(arg, name) === false) { return false; } } } }]); return Signals; }(); var ___default_45 = Signals; _$Signals_45["default"] = ___default_45; var _$utils_55 = {}; "use strict"; Object.defineProperty(_$utils_55, "__esModule", { value: true }); _$utils_55.warnOnce = warnOnce; _$utils_55._getQBezierValue = _getQBezierValue; _$utils_55.getQuadraticCurvePoint = getQuadraticCurvePoint; _$utils_55.easeOutQuad = easeOutQuad; _$utils_55.copyAction = copyAction; Object.defineProperty(_$utils_55, "win", { enumerable: true, get: function get() { return ___window_55["default"]; } }); Object.defineProperty(_$utils_55, "browser", { enumerable: true, get: function get() { return ___browser_55["default"]; } }); Object.defineProperty(_$utils_55, "clone", { enumerable: true, get: function get() { return _clone["default"]; } }); Object.defineProperty(_$utils_55, "events", { enumerable: true, get: function get() { return _events["default"]; } }); Object.defineProperty(_$utils_55, "extend", { enumerable: true, get: function get() { return ___extend_55["default"]; } }); Object.defineProperty(_$utils_55, "getOriginXY", { enumerable: true, get: function get() { return _getOriginXY["default"]; } }); Object.defineProperty(_$utils_55, "hypot", { enumerable: true, get: function get() { return ___hypot_55["default"]; } }); Object.defineProperty(_$utils_55, "normalizeListeners", { enumerable: true, get: function get() { return _normalizeListeners["default"]; } }); Object.defineProperty(_$utils_55, "pointer", { enumerable: true, get: function get() { return ___pointerUtils_55["default"]; } }); Object.defineProperty(_$utils_55, "raf", { enumerable: true, get: function get() { return _raf["default"]; } }); Object.defineProperty(_$utils_55, "rect", { enumerable: true, get: function get() { return ___rect_55["default"]; } }); Object.defineProperty(_$utils_55, "Signals", { enumerable: true, get: function get() { return _Signals["default"]; } }); _$utils_55.is = _$utils_55.dom = _$utils_55.arr = void 0; var __arr_55 = ___interopRequireWildcard_55(_$arr_46); _$utils_55.arr = __arr_55; var dom = ___interopRequireWildcard_55(_$domUtils_50); _$utils_55.dom = dom; var __is_55 = ___interopRequireWildcard_55(_$is_56); _$utils_55.is = __is_55; var ___window_55 = ___interopRequireDefault_55(_$window_65); var ___browser_55 = ___interopRequireDefault_55(_$browser_47); var _clone = ___interopRequireDefault_55(_$clone_48); var _events = ___interopRequireDefault_55(_$events_51); var ___extend_55 = ___interopRequireDefault_55(_$extend_52); var _getOriginXY = ___interopRequireDefault_55(_$getOriginXY_53); var ___hypot_55 = ___interopRequireDefault_55(_$hypot_54); var _normalizeListeners = ___interopRequireDefault_55(_$normalizeListeners_58); var ___pointerUtils_55 = ___interopRequireDefault_55(_$pointerUtils_60); var _raf = ___interopRequireDefault_55(_$raf_61); var ___rect_55 = ___interopRequireDefault_55(_$rect_62); var _Signals = ___interopRequireDefault_55(_$Signals_45); function ___interopRequireDefault_55(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_55(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function warnOnce(method, message) { var warned = false; // eslint-disable-next-line no-shadow return function () { if (!warned) { ___window_55["default"].window.console.warn(message); warned = true; } return method.apply(this, arguments); }; } // http://stackoverflow.com/a/5634528/2280888 function _getQBezierValue(t, p1, p2, p3) { var iT = 1 - t; return iT * iT * p1 + 2 * iT * t * p2 + t * t * p3; } function getQuadraticCurvePoint(startX, startY, cpX, cpY, endX, endY, position) { return { x: _getQBezierValue(position, startX, cpX, endX), y: _getQBezierValue(position, startY, cpY, endY) }; } // http://gizma.com/easing/ function easeOutQuad(t, b, c, d) { t /= d; return -c * t * (t - 2) + b; } function copyAction(dest, src) { dest.name = src.name; dest.axis = src.axis; dest.edges = src.edges; return dest; } var _$defaultOptions_20 = {}; "use strict"; Object.defineProperty(_$defaultOptions_20, "__esModule", { value: true }); _$defaultOptions_20["default"] = _$defaultOptions_20.defaults = void 0; // tslint:disable no-empty-interface var defaults = { base: { preventDefault: 'auto', deltaSource: 'page' }, perAction: { enabled: false, origin: { x: 0, y: 0 } }, actions: {} }; _$defaultOptions_20.defaults = defaults; var ___default_20 = defaults; _$defaultOptions_20["default"] = ___default_20; var _$Eventable_14 = {}; "use strict"; Object.defineProperty(_$Eventable_14, "__esModule", { value: true }); _$Eventable_14["default"] = void 0; var __arr_14 = ___interopRequireWildcard_14(_$arr_46); var ___extend_14 = ___interopRequireDefault_14(_$extend_52); var ___normalizeListeners_14 = ___interopRequireDefault_14(_$normalizeListeners_58); function ___interopRequireDefault_14(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_14(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___classCallCheck_14(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_14(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); } } function ___createClass_14(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_14(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_14(Constructor, staticProps); return Constructor; } function fireUntilImmediateStopped(event, listeners) { for (var _i = 0; _i < listeners.length; _i++) { var _ref; _ref = listeners[_i]; var listener = _ref; if (event.immediatePropagationStopped) { break; } listener(event); } } var Eventable = /*#__PURE__*/ function () { function Eventable(options) { ___classCallCheck_14(this, Eventable); this.types = {}; this.propagationStopped = false; this.immediatePropagationStopped = false; this.options = (0, ___extend_14["default"])({}, options || {}); } ___createClass_14(Eventable, [{ key: "fire", value: function fire(event) { var listeners; var global = this.global; // Interactable#on() listeners // tslint:disable no-conditional-assignment if (listeners = this.types[event.type]) { fireUntilImmediateStopped(event, listeners); } // interact.on() listeners if (!event.propagationStopped && global && (listeners = global[event.type])) { fireUntilImmediateStopped(event, listeners); } } }, { key: "on", value: function on(type, listener) { var listeners = (0, ___normalizeListeners_14["default"])(type, listener); for (type in listeners) { this.types[type] = __arr_14.merge(this.types[type] || [], listeners[type]); } } }, { key: "off", value: function off(type, listener) { var listeners = (0, ___normalizeListeners_14["default"])(type, listener); for (type in listeners) { var eventList = this.types[type]; if (!eventList || !eventList.length) { continue; } for (var _i2 = 0; _i2 < listeners[type].length; _i2++) { var _ref2; _ref2 = listeners[type][_i2]; var subListener = _ref2; var index = eventList.indexOf(subListener); if (index !== -1) { eventList.splice(index, 1); } } } } }]); return Eventable; }(); var ___default_14 = Eventable; _$Eventable_14["default"] = ___default_14; var _$Interactable_16 = {}; "use strict"; Object.defineProperty(_$Interactable_16, "__esModule", { value: true }); _$Interactable_16["default"] = _$Interactable_16.Interactable = void 0; var __arr_16 = ___interopRequireWildcard_16(_$arr_46); var ___browser_16 = ___interopRequireDefault_16(_$browser_47); var ___clone_16 = ___interopRequireDefault_16(_$clone_48); /* removed: var _$domUtils_50 = require("@interactjs/utils/domUtils"); */; var ___events_16 = ___interopRequireDefault_16(_$events_51); var ___extend_16 = ___interopRequireDefault_16(_$extend_52); var __is_16 = ___interopRequireWildcard_16(_$is_56); var ___normalizeListeners_16 = ___interopRequireDefault_16(_$normalizeListeners_58); /* removed: var _$window_65 = require("@interactjs/utils/window"); */; var _Eventable = ___interopRequireDefault_16(_$Eventable_14); function ___interopRequireDefault_16(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_16(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___classCallCheck_16(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_16(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); } } function ___createClass_16(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_16(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_16(Constructor, staticProps); return Constructor; } /** */ var Interactable = /*#__PURE__*/ function () { /** */ function Interactable(target, options, defaultContext) { ___classCallCheck_16(this, Interactable); this.events = new _Eventable["default"](); this._actions = options.actions; this.target = target; this._context = options.context || defaultContext; this._win = (0, _$window_65.getWindow)((0, _$domUtils_50.trySelector)(target) ? this._context : target); this._doc = this._win.document; this.set(options); } ___createClass_16(Interactable, [{ key: "setOnEvents", value: function setOnEvents(actionName, phases) { if (__is_16.func(phases.onstart)) { this.on("".concat(actionName, "start"), phases.onstart); } if (__is_16.func(phases.onmove)) { this.on("".concat(actionName, "move"), phases.onmove); } if (__is_16.func(phases.onend)) { this.on("".concat(actionName, "end"), phases.onend); } if (__is_16.func(phases.oninertiastart)) { this.on("".concat(actionName, "inertiastart"), phases.oninertiastart); } return this; } }, { key: "updatePerActionListeners", value: function updatePerActionListeners(actionName, prev, cur) { if (__is_16.array(prev) || __is_16.object(prev)) { this.off(actionName, prev); } if (__is_16.array(cur) || __is_16.object(cur)) { this.on(actionName, cur); } } }, { key: "setPerAction", value: function setPerAction(actionName, options) { var defaults = this._defaults; // for all the default per-action options for (var optionName in options) { var actionOptions = this.options[actionName]; var optionValue = options[optionName]; var isArray = __is_16.array(optionValue); // remove old event listeners and add new ones if (optionName === 'listeners') { this.updatePerActionListeners(actionName, actionOptions.listeners, optionValue); } // if the option value is an array if (isArray) { actionOptions[optionName] = __arr_16.from(optionValue); } // if the option value is an object else if (!isArray && __is_16.plainObject(optionValue)) { // copy the object actionOptions[optionName] = (0, ___extend_16["default"])(actionOptions[optionName] || {}, (0, ___clone_16["default"])(optionValue)); // set anabled field to true if it exists in the defaults if (__is_16.object(defaults.perAction[optionName]) && 'enabled' in defaults.perAction[optionName]) { actionOptions[optionName].enabled = optionValue.enabled !== false; } } // if the option value is a boolean and the default is an object else if (__is_16.bool(optionValue) && __is_16.object(defaults.perAction[optionName])) { actionOptions[optionName].enabled = optionValue; } // if it's anything else, do a plain assignment else { actionOptions[optionName] = optionValue; } } } /** * The default function to get an Interactables bounding rect. Can be * overridden using {@link Interactable.rectChecker}. * * @param {Element} [element] The element to measure. * @return {object} The object's bounding rectangle. */ }, { key: "getRect", value: function getRect(element) { element = element || (__is_16.element(this.target) ? this.target : null); if (__is_16.string(this.target)) { element = element || this._context.querySelector(this.target); } return (0, _$domUtils_50.getElementRect)(element); } /** * Returns or sets the function used to calculate the interactable's * element's rectangle * * @param {function} [checker] A function which returns this Interactable's * bounding rectangle. See {@link Interactable.getRect} * @return {function | object} The checker function or this Interactable */ }, { key: "rectChecker", value: function rectChecker(checker) { if (__is_16.func(checker)) { this.getRect = checker; return this; } if (checker === null) { delete this.getRect; return this; } return this.getRect; } }, { key: "_backCompatOption", value: function _backCompatOption(optionName, newValue) { if ((0, _$domUtils_50.trySelector)(newValue) || __is_16.object(newValue)) { this.options[optionName] = newValue; for (var _i = 0; _i < this._actions.names.length; _i++) { var _ref; _ref = this._actions.names[_i]; var action = _ref; this.options[action][optionName] = newValue; } return this; } return this.options[optionName]; } /** * Gets or sets the origin of the Interactable's element. The x and y * of the origin will be subtracted from action event coordinates. * * @param {Element | object | string} [origin] An HTML or SVG Element whose * rect will be used, an object eg. { x: 0, y: 0 } or string 'parent', 'self' * or any CSS selector * * @return {object} The current origin or this Interactable */ }, { key: "origin", value: function origin(newValue) { return this._backCompatOption('origin', newValue); } /** * Returns or sets the mouse coordinate types used to calculate the * movement of the pointer. * * @param {string} [newValue] Use 'client' if you will be scrolling while * interacting; Use 'page' if you want autoScroll to work * @return {string | object} The current deltaSource or this Interactable */ }, { key: "deltaSource", value: function deltaSource(newValue) { if (newValue === 'page' || newValue === 'client') { this.options.deltaSource = newValue; return this; } return this.options.deltaSource; } /** * Gets the selector context Node of the Interactable. The default is * `window.document`. * * @return {Node} The context Node of this Interactable */ }, { key: "context", value: function context() { return this._context; } }, { key: "inContext", value: function inContext(element) { return this._context === element.ownerDocument || (0, _$domUtils_50.nodeContains)(this._context, element); } }, { key: "testIgnoreAllow", value: function testIgnoreAllow(options, targetNode, eventTarget) { return !this.testIgnore(options.ignoreFrom, targetNode, eventTarget) && this.testAllow(options.allowFrom, targetNode, eventTarget); } }, { key: "testAllow", value: function testAllow(allowFrom, targetNode, element) { if (!allowFrom) { return true; } if (!__is_16.element(element)) { return false; } if (__is_16.string(allowFrom)) { return (0, _$domUtils_50.matchesUpTo)(element, allowFrom, targetNode); } else if (__is_16.element(allowFrom)) { return (0, _$domUtils_50.nodeContains)(allowFrom, element); } return false; } }, { key: "testIgnore", value: function testIgnore(ignoreFrom, targetNode, element) { if (!ignoreFrom || !__is_16.element(element)) { return false; } if (__is_16.string(ignoreFrom)) { return (0, _$domUtils_50.matchesUpTo)(element, ignoreFrom, targetNode); } else if (__is_16.element(ignoreFrom)) { return (0, _$domUtils_50.nodeContains)(ignoreFrom, element); } return false; } /** * Calls listeners for the given InteractEvent type bound globally * and directly to this Interactable * * @param {InteractEvent} iEvent The InteractEvent object to be fired on this * Interactable * @return {Interactable} this Interactable */ }, { key: "fire", value: function fire(iEvent) { this.events.fire(iEvent); return this; } }, { key: "_onOff", value: function _onOff(method, typeArg, listenerArg, options) { if (__is_16.object(typeArg) && !__is_16.array(typeArg)) { options = listenerArg; listenerArg = null; } var addRemove = method === 'on' ? 'add' : 'remove'; var listeners = (0, ___normalizeListeners_16["default"])(typeArg, listenerArg); for (var type in listeners) { if (type === 'wheel') { type = ___browser_16["default"].wheelEvent; } for (var _i2 = 0; _i2 < listeners[type].length; _i2++) { var _ref2; _ref2 = listeners[type][_i2]; var listener = _ref2; // if it is an action event type if (__arr_16.contains(this._actions.eventTypes, type)) { this.events[method](type, listener); } // delegated event else if (__is_16.string(this.target)) { ___events_16["default"]["".concat(addRemove, "Delegate")](this.target, this._context, type, listener, options); } // remove listener from this Interatable's element else { ___events_16["default"][addRemove](this.target, type, listener, options); } } } return this; } /** * Binds a listener for an InteractEvent, pointerEvent or DOM event. * * @param {string | array | object} types The types of events to listen * for * @param {function | array | object} [listener] The event listener function(s) * @param {object | boolean} [options] options object or useCapture flag for * addEventListener * @return {Interactable} This Interactable */ }, { key: "on", value: function on(types, listener, options) { return this._onOff('on', types, listener, options); } /** * Removes an InteractEvent, pointerEvent or DOM event listener. * * @param {string | array | object} types The types of events that were * listened for * @param {function | array | object} [listener] The event listener function(s) * @param {object | boolean} [options] options object or useCapture flag for * removeEventListener * @return {Interactable} This Interactable */ }, { key: "off", value: function off(types, listener, options) { return this._onOff('off', types, listener, options); } /** * Reset the options of this Interactable * * @param {object} options The new settings to apply * @return {object} This Interactable */ }, { key: "set", value: function set(options) { var defaults = this._defaults; if (!__is_16.object(options)) { options = {}; } this.options = (0, ___clone_16["default"])(defaults.base); for (var actionName in this._actions.methodDict) { var methodName = this._actions.methodDict[actionName]; this.options[actionName] = {}; this.setPerAction(actionName, (0, ___extend_16["default"])((0, ___extend_16["default"])({}, defaults.perAction), defaults.actions[actionName])); this[methodName](options[actionName]); } for (var setting in options) { if (__is_16.func(this[setting])) { this[setting](options[setting]); } } return this; } /** * Remove this interactable from the list of interactables and remove it's * action capabilities and event listeners * * @return {interact} */ }, { key: "unset", value: function unset() { ___events_16["default"].remove(this.target, 'all'); if (__is_16.string(this.target)) { // remove delegated events for (var type in ___events_16["default"].delegatedEvents) { var delegated = ___events_16["default"].delegatedEvents[type]; if (delegated.selectors[0] === this.target && delegated.contexts[0] === this._context) { delegated.selectors.splice(0, 1); delegated.contexts.splice(0, 1); delegated.listeners.splice(0, 1); // remove the arrays if they are empty if (!delegated.selectors.length) { delegated[type] = null; } } ___events_16["default"].remove(this._context, type, ___events_16["default"].delegateListener); ___events_16["default"].remove(this._context, type, ___events_16["default"].delegateUseCapture, true); } } else { ___events_16["default"].remove(this.target, 'all'); } } }, { key: "_defaults", get: function get() { return { base: {}, perAction: {}, actions: {} }; } }]); return Interactable; }(); _$Interactable_16.Interactable = Interactable; var ___default_16 = Interactable; _$Interactable_16["default"] = ___default_16; var _$InteractableSet_17 = {}; "use strict"; Object.defineProperty(_$InteractableSet_17, "__esModule", { value: true }); _$InteractableSet_17["default"] = void 0; var __arr_17 = ___interopRequireWildcard_17(_$arr_46); var __domUtils_17 = ___interopRequireWildcard_17(_$domUtils_50); var ___extend_17 = ___interopRequireDefault_17(_$extend_52); var __is_17 = ___interopRequireWildcard_17(_$is_56); var ___Signals_17 = ___interopRequireDefault_17(_$Signals_45); function ___interopRequireDefault_17(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_17(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___classCallCheck_17(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_17(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); } } function ___createClass_17(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_17(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_17(Constructor, staticProps); return Constructor; } var InteractableSet = /*#__PURE__*/ function () { function InteractableSet(scope) { var _this = this; ___classCallCheck_17(this, InteractableSet); this.scope = scope; this.signals = new ___Signals_17["default"](); // all set interactables this.list = []; this.selectorMap = {}; this.signals.on('unset', function (_ref) { var interactable = _ref.interactable; var target = interactable.target, context = interactable._context; var targetMappings = __is_17.string(target) ? _this.selectorMap[target] : target[_this.scope.id]; var targetIndex = targetMappings.findIndex(function (m) { return m.context === context; }); if (targetMappings[targetIndex]) { // Destroying mappingInfo's context and interactable targetMappings[targetIndex].context = null; targetMappings[targetIndex].interactable = null; } targetMappings.splice(targetIndex, 1); }); } ___createClass_17(InteractableSet, [{ key: "new", value: function _new(target, options) { options = (0, ___extend_17["default"])(options || {}, { actions: this.scope.actions }); var interactable = new this.scope.Interactable(target, options, this.scope.document); var mappingInfo = { context: interactable._context, interactable: interactable }; this.scope.addDocument(interactable._doc); this.list.push(interactable); if (__is_17.string(target)) { if (!this.selectorMap[target]) { this.selectorMap[target] = []; } this.selectorMap[target].push(mappingInfo); } else { if (!interactable.target[this.scope.id]) { Object.defineProperty(target, this.scope.id, { value: [], configurable: true }); } target[this.scope.id].push(mappingInfo); } this.signals.fire('new', { target: target, options: options, interactable: interactable, win: this.scope._win }); return interactable; } }, { key: "get", value: function get(target, options) { var context = options && options.context || this.scope.document; var isSelector = __is_17.string(target); var targetMappings = isSelector ? this.selectorMap[target] : target[this.scope.id]; if (!targetMappings) { return null; } var found = __arr_17.find(targetMappings, function (m) { return m.context === context && (isSelector || m.interactable.inContext(target)); }); return found && found.interactable; } }, { key: "forEachMatch", value: function forEachMatch(node, callback) { for (var _i = 0; _i < this.list.length; _i++) { var _ref2; _ref2 = this.list[_i]; var interactable = _ref2; var ret = void 0; if ((__is_17.string(interactable.target) // target is a selector and the element matches ? __is_17.element(node) && __domUtils_17.matchesSelector(node, interactable.target) : // target is the element node === interactable.target) && // the element is in context interactable.inContext(node)) { ret = callback(interactable); } if (ret !== undefined) { return ret; } } } }]); return InteractableSet; }(); _$InteractableSet_17["default"] = InteractableSet; var _$BaseEvent_13 = {}; "use strict"; Object.defineProperty(_$BaseEvent_13, "__esModule", { value: true }); _$BaseEvent_13["default"] = _$BaseEvent_13.BaseEvent = _$BaseEvent_13.EventPhase = void 0; function ___classCallCheck_13(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_13(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); } } function ___createClass_13(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_13(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_13(Constructor, staticProps); return Constructor; } var EventPhase; _$BaseEvent_13.EventPhase = EventPhase; (function (EventPhase) { EventPhase["Start"] = "start"; EventPhase["Move"] = "move"; EventPhase["End"] = "end"; EventPhase["_NONE"] = ""; })(EventPhase || (_$BaseEvent_13.EventPhase = EventPhase = {})); var BaseEvent = /*#__PURE__*/ function () { function BaseEvent(interaction) { ___classCallCheck_13(this, BaseEvent); this.immediatePropagationStopped = false; this.propagationStopped = false; this._interaction = interaction; } ___createClass_13(BaseEvent, [{ key: "preventDefault", value: function preventDefault() {} /** * Don't call any other listeners (even on the current target) */ }, { key: "stopPropagation", value: function stopPropagation() { this.propagationStopped = true; } /** * Don't call listeners on the remaining targets */ }, { key: "stopImmediatePropagation", value: function stopImmediatePropagation() { this.immediatePropagationStopped = this.propagationStopped = true; } }, { key: "interaction", get: function get() { return this._interaction._proxy; } }]); return BaseEvent; }(); _$BaseEvent_13.BaseEvent = BaseEvent; var ___default_13 = BaseEvent; _$BaseEvent_13["default"] = ___default_13; var _$InteractEvent_15 = {}; "use strict"; Object.defineProperty(_$InteractEvent_15, "__esModule", { value: true }); _$InteractEvent_15["default"] = _$InteractEvent_15.InteractEvent = _$InteractEvent_15.EventPhase = void 0; var ___extend_15 = ___interopRequireDefault_15(_$extend_52); var ___getOriginXY_15 = ___interopRequireDefault_15(_$getOriginXY_53); var ___hypot_15 = ___interopRequireDefault_15(_$hypot_54); var _BaseEvent2 = ___interopRequireDefault_15(_$BaseEvent_13); var _defaultOptions = ___interopRequireDefault_15(_$defaultOptions_20); function ___interopRequireDefault_15(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___typeof_15(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { ___typeof_15 = function _typeof(obj) { return typeof obj; }; } else { ___typeof_15 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return ___typeof_15(obj); } function ___classCallCheck_15(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_15(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); } } function ___createClass_15(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_15(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_15(Constructor, staticProps); return Constructor; } function _possibleConstructorReturn(self, call) { if (call && (___typeof_15(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _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); } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } var __EventPhase_15; _$InteractEvent_15.EventPhase = __EventPhase_15; (function (EventPhase) { EventPhase["Start"] = "start"; EventPhase["Move"] = "move"; EventPhase["End"] = "end"; EventPhase["_NONE"] = ""; })(__EventPhase_15 || (_$InteractEvent_15.EventPhase = __EventPhase_15 = {})); var InteractEvent = /*#__PURE__*/ function (_BaseEvent) { _inherits(InteractEvent, _BaseEvent); /** */ function InteractEvent(interaction, event, actionName, phase, element, related, preEnd, type) { var _this; ___classCallCheck_15(this, InteractEvent); _this = _possibleConstructorReturn(this, _getPrototypeOf(InteractEvent).call(this, interaction)); element = element || interaction.element; var target = interaction.interactable; // FIXME: add deltaSource to defaults var deltaSource = (target && target.options || _defaultOptions["default"]).deltaSource; var origin = (0, ___getOriginXY_15["default"])(target, element, actionName); var starting = phase === 'start'; var ending = phase === 'end'; var prevEvent = starting ? _assertThisInitialized(_this) : interaction.prevEvent; var coords = starting ? interaction.coords.start : ending ? { page: prevEvent.page, client: prevEvent.client, timeStamp: interaction.coords.cur.timeStamp } : interaction.coords.cur; _this.page = (0, ___extend_15["default"])({}, coords.page); _this.client = (0, ___extend_15["default"])({}, coords.client); _this.rect = (0, ___extend_15["default"])({}, interaction.rect); _this.timeStamp = coords.timeStamp; if (!ending) { _this.page.x -= origin.x; _this.page.y -= origin.y; _this.client.x -= origin.x; _this.client.y -= origin.y; } _this.ctrlKey = event.ctrlKey; _this.altKey = event.altKey; _this.shiftKey = event.shiftKey; _this.metaKey = event.metaKey; _this.button = event.button; _this.buttons = event.buttons; _this.target = element; _this.currentTarget = element; _this.relatedTarget = related || null; _this.preEnd = preEnd; _this.type = type || actionName + (phase || ''); _this.interactable = target; _this.t0 = starting ? interaction.pointers[interaction.pointers.length - 1].downTime : prevEvent.t0; _this.x0 = interaction.coords.start.page.x - origin.x; _this.y0 = interaction.coords.start.page.y - origin.y; _this.clientX0 = interaction.coords.start.client.x - origin.x; _this.clientY0 = interaction.coords.start.client.y - origin.y; if (starting || ending) { _this.delta = { x: 0, y: 0 }; } else { _this.delta = { x: _this[deltaSource].x - prevEvent[deltaSource].x, y: _this[deltaSource].y - prevEvent[deltaSource].y }; } _this.dt = interaction.coords.delta.timeStamp; _this.duration = _this.timeStamp - _this.t0; // velocity and speed in pixels per second _this.velocity = (0, ___extend_15["default"])({}, interaction.coords.velocity[deltaSource]); _this.speed = (0, ___hypot_15["default"])(_this.velocity.x, _this.velocity.y); _this.swipe = ending || phase === 'inertiastart' ? _this.getSwipe() : null; return _this; } ___createClass_15(InteractEvent, [{ key: "getSwipe", value: function getSwipe() { var interaction = this._interaction; if (interaction.prevEvent.speed < 600 || this.timeStamp - interaction.prevEvent.timeStamp > 150) { return null; } var angle = 180 * Math.atan2(interaction.prevEvent.velocityY, interaction.prevEvent.velocityX) / Math.PI; var overlap = 22.5; if (angle < 0) { angle += 360; } var left = 135 - overlap <= angle && angle < 225 + overlap; var up = 225 - overlap <= angle && angle < 315 + overlap; var right = !left && (315 - overlap <= angle || angle < 45 + overlap); var down = !up && 45 - overlap <= angle && angle < 135 + overlap; return { up: up, down: down, left: left, right: right, angle: angle, speed: interaction.prevEvent.speed, velocity: { x: interaction.prevEvent.velocityX, y: interaction.prevEvent.velocityY } }; } }, { key: "preventDefault", value: function preventDefault() {} /** * Don't call listeners on the remaining targets */ }, { key: "stopImmediatePropagation", value: function stopImmediatePropagation() { this.immediatePropagationStopped = this.propagationStopped = true; } /** * Don't call any other listeners (even on the current target) */ }, { key: "stopPropagation", value: function stopPropagation() { this.propagationStopped = true; } }, { key: "pageX", get: function get() { return this.page.x; }, set: function set(value) { this.page.x = value; } }, { key: "pageY", get: function get() { return this.page.y; }, set: function set(value) { this.page.y = value; } }, { key: "clientX", get: function get() { return this.client.x; }, set: function set(value) { this.client.x = value; } }, { key: "clientY", get: function get() { return this.client.y; }, set: function set(value) { this.client.y = value; } }, { key: "dx", get: function get() { return this.delta.x; }, set: function set(value) { this.delta.x = value; } }, { key: "dy", get: function get() { return this.delta.y; }, set: function set(value) { this.delta.y = value; } }, { key: "velocityX", get: function get() { return this.velocity.x; }, set: function set(value) { this.velocity.x = value; } }, { key: "velocityY", get: function get() { return this.velocity.y; }, set: function set(value) { this.velocity.y = value; } }]); return InteractEvent; }(_BaseEvent2["default"]); _$InteractEvent_15.InteractEvent = InteractEvent; var ___default_15 = InteractEvent; _$InteractEvent_15["default"] = ___default_15; var _$PointerInfo_19 = {}; "use strict"; Object.defineProperty(_$PointerInfo_19, "__esModule", { value: true }); _$PointerInfo_19["default"] = _$PointerInfo_19.PointerInfo = void 0; function ___classCallCheck_19(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var PointerInfo = function PointerInfo(id, pointer, event, downTime, downTarget) { ___classCallCheck_19(this, PointerInfo); this.id = id; this.pointer = pointer; this.event = event; this.downTime = downTime; this.downTarget = downTarget; }; _$PointerInfo_19.PointerInfo = PointerInfo; var ___default_19 = PointerInfo; _$PointerInfo_19["default"] = ___default_19; var _$interactionFinder_22 = {}; "use strict"; Object.defineProperty(_$interactionFinder_22, "__esModule", { value: true }); _$interactionFinder_22["default"] = void 0; var __dom_22 = ___interopRequireWildcard_22(_$domUtils_50); function ___interopRequireWildcard_22(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } var finder = { methodOrder: ['simulationResume', 'mouseOrPen', 'hasPointer', 'idle'], search: function search(details) { for (var _i = 0; _i < finder.methodOrder.length; _i++) { var _ref; _ref = finder.methodOrder[_i]; var method = _ref; var interaction = finder[method](details); if (interaction) { return interaction; } } }, // try to resume simulation with a new pointer simulationResume: function simulationResume(_ref2) { var pointerType = _ref2.pointerType, eventType = _ref2.eventType, eventTarget = _ref2.eventTarget, scope = _ref2.scope; if (!/down|start/i.test(eventType)) { return null; } for (var _i2 = 0; _i2 < scope.interactions.list.length; _i2++) { var _ref3; _ref3 = scope.interactions.list[_i2]; var interaction = _ref3; var element = eventTarget; if (interaction.simulation && interaction.simulation.allowResume && interaction.pointerType === pointerType) { while (element) { // if the element is the interaction element if (element === interaction.element) { return interaction; } element = __dom_22.parentNode(element); } } } return null; }, // if it's a mouse or pen interaction mouseOrPen: function mouseOrPen(_ref4) { var pointerId = _ref4.pointerId, pointerType = _ref4.pointerType, eventType = _ref4.eventType, scope = _ref4.scope; if (pointerType !== 'mouse' && pointerType !== 'pen') { return null; } var firstNonActive; for (var _i3 = 0; _i3 < scope.interactions.list.length; _i3++) { var _ref5; _ref5 = scope.interactions.list[_i3]; var interaction = _ref5; if (interaction.pointerType === pointerType) { // if it's a down event, skip interactions with running simulations if (interaction.simulation && !hasPointerId(interaction, pointerId)) { continue; } // if the interaction is active, return it immediately if (interaction.interacting()) { return interaction; } // otherwise save it and look for another active interaction else if (!firstNonActive) { firstNonActive = interaction; } } } // if no active mouse interaction was found use the first inactive mouse // interaction if (firstNonActive) { return firstNonActive; } // find any mouse or pen interaction. // ignore the interaction if the eventType is a *down, and a simulation // is active for (var _i4 = 0; _i4 < scope.interactions.list.length; _i4++) { var _ref6; _ref6 = scope.interactions.list[_i4]; var _interaction = _ref6; if (_interaction.pointerType === pointerType && !(/down/i.test(eventType) && _interaction.simulation)) { return _interaction; } } return null; }, // get interaction that has this pointer hasPointer: function hasPointer(_ref7) { var pointerId = _ref7.pointerId, scope = _ref7.scope; for (var _i5 = 0; _i5 < scope.interactions.list.length; _i5++) { var _ref8; _ref8 = scope.interactions.list[_i5]; var interaction = _ref8; if (hasPointerId(interaction, pointerId)) { return interaction; } } return null; }, // get first idle interaction with a matching pointerType idle: function idle(_ref9) { var pointerType = _ref9.pointerType, scope = _ref9.scope; for (var _i6 = 0; _i6 < scope.interactions.list.length; _i6++) { var _ref10; _ref10 = scope.interactions.list[_i6]; var interaction = _ref10; // if there's already a pointer held down if (interaction.pointers.length === 1) { var target = interaction.interactable; // don't add this pointer if there is a target interactable and it // isn't gesturable if (target && !target.options.gesture.enabled) { continue; } } // maximum of 2 pointers per interaction else if (interaction.pointers.length >= 2) { continue; } if (!interaction.interacting() && pointerType === interaction.pointerType) { return interaction; } } return null; } }; function hasPointerId(interaction, pointerId) { return interaction.pointers.some(function (_ref11) { var id = _ref11.id; return id === pointerId; }); } var ___default_22 = finder; _$interactionFinder_22["default"] = ___default_22; var _$drag_1 = {}; "use strict"; Object.defineProperty(_$drag_1, "__esModule", { value: true }); _$drag_1["default"] = void 0; var ___scope_1 = _$scope_24({}); var __arr_1 = ___interopRequireWildcard_1(_$arr_46); var __is_1 = ___interopRequireWildcard_1(_$is_56); function ___interopRequireWildcard_1(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } ___scope_1.ActionName.Drag = 'drag'; function __install_1(scope) { var actions = scope.actions, Interactable = scope.Interactable, interactions = scope.interactions, defaults = scope.defaults; interactions.signals.on('before-action-move', beforeMove); interactions.signals.on('action-resume', beforeMove); // dragmove interactions.signals.on('action-move', move); Interactable.prototype.draggable = drag.draggable; actions[___scope_1.ActionName.Drag] = drag; actions.names.push(___scope_1.ActionName.Drag); __arr_1.merge(actions.eventTypes, ['dragstart', 'dragmove', 'draginertiastart', 'dragresume', 'dragend']); actions.methodDict.drag = 'draggable'; defaults.actions.drag = drag.defaults; } function beforeMove(_ref) { var interaction = _ref.interaction; if (interaction.prepared.name !== 'drag') { return; } var axis = interaction.prepared.axis; if (axis === 'x') { interaction.coords.cur.page.y = interaction.coords.start.page.y; interaction.coords.cur.client.y = interaction.coords.start.client.y; interaction.coords.velocity.client.y = 0; interaction.coords.velocity.page.y = 0; } else if (axis === 'y') { interaction.coords.cur.page.x = interaction.coords.start.page.x; interaction.coords.cur.client.x = interaction.coords.start.client.x; interaction.coords.velocity.client.x = 0; interaction.coords.velocity.page.x = 0; } } function move(_ref2) { var iEvent = _ref2.iEvent, interaction = _ref2.interaction; if (interaction.prepared.name !== 'drag') { return; } var axis = interaction.prepared.axis; if (axis === 'x' || axis === 'y') { var opposite = axis === 'x' ? 'y' : 'x'; iEvent.page[opposite] = interaction.coords.start.page[opposite]; iEvent.client[opposite] = interaction.coords.start.client[opposite]; iEvent.delta[opposite] = 0; } } /** * ```js * interact(element).draggable({ * onstart: function (event) {}, * onmove : function (event) {}, * onend : function (event) {}, * * // the axis in which the first movement must be * // for the drag sequence to start * // 'xy' by default - any direction * startAxis: 'x' || 'y' || 'xy', * * // 'xy' by default - don't restrict to one axis (move in any direction) * // 'x' or 'y' to restrict movement to either axis * // 'start' to restrict movement to the axis the drag started in * lockAxis: 'x' || 'y' || 'xy' || 'start', * * // max number of drags that can happen concurrently * // with elements of this Interactable. Infinity by default * max: Infinity, * * // max number of drags that can target the same element+Interactable * // 1 by default * maxPerElement: 2 * }) * * var isDraggable = interact('element').draggable(); // true * ``` * * Get or set whether drag actions can be performed on the target * * @alias Interactable.prototype.draggable * * @param {boolean | object} [options] true/false or An object with event * listeners to be fired on drag events (object makes the Interactable * draggable) * @return {boolean | Interactable} boolean indicating if this can be the * target of drag events, or this Interctable */ var draggable = function draggable(options) { if (__is_1.object(options)) { this.options.drag.enabled = options.enabled !== false; this.setPerAction('drag', options); this.setOnEvents('drag', options); if (/^(xy|x|y|start)$/.test(options.lockAxis)) { this.options.drag.lockAxis = options.lockAxis; } if (/^(xy|x|y)$/.test(options.startAxis)) { this.options.drag.startAxis = options.startAxis; } return this; } if (__is_1.bool(options)) { this.options.drag.enabled = options; return this; } return this.options.drag; }; var drag = { id: 'actions/drag', install: __install_1, draggable: draggable, beforeMove: beforeMove, move: move, defaults: { startAxis: 'xy', lockAxis: 'xy' }, checker: function checker(_pointer, _event, interactable) { var dragOptions = interactable.options.drag; return dragOptions.enabled ? { name: 'drag', axis: dragOptions.lockAxis === 'start' ? dragOptions.startAxis : dragOptions.lockAxis } : null; }, getCursor: function getCursor() { return 'move'; } }; var ___default_1 = drag; _$drag_1["default"] = ___default_1; var _$DropEvent_2 = {}; "use strict"; Object.defineProperty(_$DropEvent_2, "__esModule", { value: true }); _$DropEvent_2["default"] = void 0; var ___BaseEvent2_2 = ___interopRequireDefault_2(_$BaseEvent_13); var __arr_2 = ___interopRequireWildcard_2(_$arr_46); function ___interopRequireWildcard_2(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_2(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___typeof_2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { ___typeof_2 = function _typeof(obj) { return typeof obj; }; } else { ___typeof_2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return ___typeof_2(obj); } function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); } function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); } function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); } function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } } function ___classCallCheck_2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_2(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); } } function ___createClass_2(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_2(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_2(Constructor, staticProps); return Constructor; } function ___possibleConstructorReturn_2(self, call) { if (call && (___typeof_2(call) === "object" || typeof call === "function")) { return call; } return ___assertThisInitialized_2(self); } function ___assertThisInitialized_2(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function ___getPrototypeOf_2(o) { ___getPrototypeOf_2 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return ___getPrototypeOf_2(o); } function ___inherits_2(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_2(subClass, superClass); } function ___setPrototypeOf_2(o, p) { ___setPrototypeOf_2 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return ___setPrototypeOf_2(o, p); } var DropEvent = /*#__PURE__*/ function (_BaseEvent) { ___inherits_2(DropEvent, _BaseEvent); /** * Class of events fired on dropzones during drags with acceptable targets. */ function DropEvent(dropState, dragEvent, type) { var _this; ___classCallCheck_2(this, DropEvent); _this = ___possibleConstructorReturn_2(this, ___getPrototypeOf_2(DropEvent).call(this, dragEvent._interaction)); _this.propagationStopped = false; _this.immediatePropagationStopped = false; var _ref = type === 'dragleave' ? dropState.prev : dropState.cur, element = _ref.element, dropzone = _ref.dropzone; _this.type = type; _this.target = element; _this.currentTarget = element; _this.dropzone = dropzone; _this.dragEvent = dragEvent; _this.relatedTarget = dragEvent.target; _this.draggable = dragEvent.interactable; _this.timeStamp = dragEvent.timeStamp; return _this; } /** * If this is a `dropactivate` event, the dropzone element will be * deactivated. * * If this is a `dragmove` or `dragenter`, a `dragleave` will be fired on the * dropzone element and more. */ ___createClass_2(DropEvent, [{ key: "reject", value: function reject() { var _this2 = this; var dropState = this._interaction.dropState; if (this.type !== 'dropactivate' && (!this.dropzone || dropState.cur.dropzone !== this.dropzone || dropState.cur.element !== this.target)) { return; } dropState.prev.dropzone = this.dropzone; dropState.prev.element = this.target; dropState.rejected = true; dropState.events.enter = null; this.stopImmediatePropagation(); if (this.type === 'dropactivate') { var activeDrops = dropState.activeDrops; var index = __arr_2.findIndex(activeDrops, function (_ref2) { var dropzone = _ref2.dropzone, element = _ref2.element; return dropzone === _this2.dropzone && element === _this2.target; }); dropState.activeDrops = [].concat(_toConsumableArray(activeDrops.slice(0, index)), _toConsumableArray(activeDrops.slice(index + 1))); var deactivateEvent = new DropEvent(dropState, this.dragEvent, 'dropdeactivate'); deactivateEvent.dropzone = this.dropzone; deactivateEvent.target = this.target; this.dropzone.fire(deactivateEvent); } else { this.dropzone.fire(new DropEvent(dropState, this.dragEvent, 'dragleave')); } } }, { key: "preventDefault", value: function preventDefault() {} }, { key: "stopPropagation", value: function stopPropagation() { this.propagationStopped = true; } }, { key: "stopImmediatePropagation", value: function stopImmediatePropagation() { this.immediatePropagationStopped = this.propagationStopped = true; } }]); return DropEvent; }(___BaseEvent2_2["default"]); var ___default_2 = DropEvent; _$DropEvent_2["default"] = ___default_2; var _$drop_3 = {}; "use strict"; Object.defineProperty(_$drop_3, "__esModule", { value: true }); _$drop_3["default"] = void 0; var __utils_3 = ___interopRequireWildcard_3(_$utils_55); var _drag = ___interopRequireDefault_3(_$drag_1); var _DropEvent = ___interopRequireDefault_3(_$DropEvent_2); function ___interopRequireDefault_3(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_3(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __install_3(scope) { var actions = scope.actions, interact = scope.interact, Interactable = scope.Interactable, interactions = scope.interactions, defaults = scope.defaults; scope.usePlugin(_drag["default"]); interactions.signals.on('before-action-start', function (_ref) { var interaction = _ref.interaction; if (interaction.prepared.name !== 'drag') { return; } interaction.dropState = { cur: { dropzone: null, element: null }, prev: { dropzone: null, element: null }, rejected: null, events: null, activeDrops: null }; }); interactions.signals.on('after-action-start', function (_ref2) { var interaction = _ref2.interaction, event = _ref2.event, dragEvent = _ref2.iEvent; if (interaction.prepared.name !== 'drag') { return; } var dropState = interaction.dropState; // reset active dropzones dropState.activeDrops = null; dropState.events = null; dropState.activeDrops = getActiveDrops(scope, interaction.element); dropState.events = getDropEvents(interaction, event, dragEvent); if (dropState.events.activate) { fireActivationEvents(dropState.activeDrops, dropState.events.activate); } }); // FIXME proper signal types interactions.signals.on('action-move', function (arg) { return onEventCreated(arg, scope); }); interactions.signals.on('action-end', function (arg) { return onEventCreated(arg, scope); }); interactions.signals.on('after-action-move', function (_ref3) { var interaction = _ref3.interaction; if (interaction.prepared.name !== 'drag') { return; } fireDropEvents(interaction, interaction.dropState.events); interaction.dropState.events = {}; }); interactions.signals.on('after-action-end', function (_ref4) { var interaction = _ref4.interaction; if (interaction.prepared.name !== 'drag') { return; } fireDropEvents(interaction, interaction.dropState.events); }); interactions.signals.on('stop', function (_ref5) { var interaction = _ref5.interaction; if (interaction.prepared.name !== 'drag') { return; } var dropState = interaction.dropState; if (dropState) { dropState.activeDrops = null; dropState.events = null; dropState.cur.dropzone = null; dropState.cur.element = null; dropState.prev.dropzone = null; dropState.prev.element = null; dropState.rejected = false; } }); /** * * ```js * interact('.drop').dropzone({ * accept: '.can-drop' || document.getElementById('single-drop'), * overlap: 'pointer' || 'center' || zeroToOne * } * ``` * * Returns or sets whether draggables can be dropped onto this target to * trigger drop events * * Dropzones can receive the following events: * - `dropactivate` and `dropdeactivate` when an acceptable drag starts and ends * - `dragenter` and `dragleave` when a draggable enters and leaves the dropzone * - `dragmove` when a draggable that has entered the dropzone is moved * - `drop` when a draggable is dropped into this dropzone * * Use the `accept` option to allow only elements that match the given CSS * selector or element. The value can be: * * - **an Element** - only that element can be dropped into this dropzone. * - **a string**, - the element being dragged must match it as a CSS selector. * - **`null`** - accept options is cleared - it accepts any element. * * Use the `overlap` option to set how drops are checked for. The allowed * values are: * * - `'pointer'`, the pointer must be over the dropzone (default) * - `'center'`, the draggable element's center must be over the dropzone * - a number from 0-1 which is the `(intersection area) / (draggable area)`. * e.g. `0.5` for drop to happen when half of the area of the draggable is * over the dropzone * * Use the `checker` option to specify a function to check if a dragged element * is over this Interactable. * * @param {boolean | object | null} [options] The new options to be set. * @return {boolean | Interactable} The current setting or this Interactable */ Interactable.prototype.dropzone = function (options) { return dropzoneMethod(this, options); }; /** * ```js * interact(target) * .dropChecker(function(dragEvent, // related dragmove or dragend event * event, // TouchEvent/PointerEvent/MouseEvent * dropped, // bool result of the default checker * dropzone, // dropzone Interactable * dropElement, // dropzone elemnt * draggable, // draggable Interactable * draggableElement) {// draggable element * * return dropped && event.target.hasAttribute('allow-drop') * } * ``` */ Interactable.prototype.dropCheck = function (dragEvent, event, draggable, draggableElement, dropElement, rect) { return dropCheckMethod(this, dragEvent, event, draggable, draggableElement, dropElement, rect); }; /** * Returns or sets whether the dimensions of dropzone elements are calculated * on every dragmove or only on dragstart for the default dropChecker * * @param {boolean} [newValue] True to check on each move. False to check only * before start * @return {boolean | interact} The current setting or interact */ interact.dynamicDrop = function (newValue) { if (__utils_3.is.bool(newValue)) { // if (dragging && scope.dynamicDrop !== newValue && !newValue) { // calcRects(dropzones) // } scope.dynamicDrop = newValue; return interact; } return scope.dynamicDrop; }; __utils_3.arr.merge(actions.eventTypes, ['dragenter', 'dragleave', 'dropactivate', 'dropdeactivate', 'dropmove', 'drop']); actions.methodDict.drop = 'dropzone'; scope.dynamicDrop = false; defaults.actions.drop = drop.defaults; } function collectDrops(_ref6, draggableElement) { var interactables = _ref6.interactables; var drops = []; // collect all dropzones and their elements which qualify for a drop for (var _i = 0; _i < interactables.list.length; _i++) { var _ref7; _ref7 = interactables.list[_i]; var dropzone = _ref7; if (!dropzone.options.drop.enabled) { continue; } var accept = dropzone.options.drop.accept; // test the draggable draggableElement against the dropzone's accept setting if (__utils_3.is.element(accept) && accept !== draggableElement || __utils_3.is.string(accept) && !__utils_3.dom.matchesSelector(draggableElement, accept) || __utils_3.is.func(accept) && !accept({ dropzone: dropzone, draggableElement: draggableElement })) { continue; } // query for new elements if necessary var dropElements = __utils_3.is.string(dropzone.target) ? dropzone._context.querySelectorAll(dropzone.target) : __utils_3.is.array(dropzone.target) ? dropzone.target : [dropzone.target]; for (var _i2 = 0; _i2 < dropElements.length; _i2++) { var _ref8; _ref8 = dropElements[_i2]; var dropzoneElement = _ref8; if (dropzoneElement !== draggableElement) { drops.push({ dropzone: dropzone, element: dropzoneElement }); } } } return drops; } function fireActivationEvents(activeDrops, event) { // loop through all active dropzones and trigger event for (var _i3 = 0; _i3 < activeDrops.length; _i3++) { var _ref9; _ref9 = activeDrops[_i3]; var _ref10 = _ref9, dropzone = _ref10.dropzone, element = _ref10.element; event.dropzone = dropzone; // set current element as event target event.target = element; dropzone.fire(event); event.propagationStopped = event.immediatePropagationStopped = false; } } // return a new array of possible drops. getActiveDrops should always be // called when a drag has just started or a drag event happens while // dynamicDrop is true function getActiveDrops(scope, dragElement) { // get dropzones and their elements that could receive the draggable var activeDrops = collectDrops(scope, dragElement); for (var _i4 = 0; _i4 < activeDrops.length; _i4++) { var _ref11; _ref11 = activeDrops[_i4]; var activeDrop = _ref11; activeDrop.rect = activeDrop.dropzone.getRect(activeDrop.element); } return activeDrops; } function getDrop(_ref12, dragEvent, pointerEvent) { var dropState = _ref12.dropState, draggable = _ref12.interactable, dragElement = _ref12.element; var validDrops = []; // collect all dropzones and their elements which qualify for a drop for (var _i5 = 0; _i5 < dropState.activeDrops.length; _i5++) { var _ref13; _ref13 = dropState.activeDrops[_i5]; var _ref14 = _ref13, dropzone = _ref14.dropzone, dropzoneElement = _ref14.element, rect = _ref14.rect; validDrops.push(dropzone.dropCheck(dragEvent, pointerEvent, draggable, dragElement, dropzoneElement, rect) ? dropzoneElement : null); } // get the most appropriate dropzone based on DOM depth and order var dropIndex = __utils_3.dom.indexOfDeepestElement(validDrops); return dropState.activeDrops[dropIndex] || null; } function getDropEvents(interaction, _pointerEvent, dragEvent) { var dropState = interaction.dropState; var dropEvents = { enter: null, leave: null, activate: null, deactivate: null, move: null, drop: null }; if (dragEvent.type === 'dragstart') { dropEvents.activate = new _DropEvent["default"](dropState, dragEvent, 'dropactivate'); dropEvents.activate.target = null; dropEvents.activate.dropzone = null; } if (dragEvent.type === 'dragend') { dropEvents.deactivate = new _DropEvent["default"](dropState, dragEvent, 'dropdeactivate'); dropEvents.deactivate.target = null; dropEvents.deactivate.dropzone = null; } if (dropState.rejected) { return dropEvents; } if (dropState.cur.element !== dropState.prev.element) { // if there was a previous dropzone, create a dragleave event if (dropState.prev.dropzone) { dropEvents.leave = new _DropEvent["default"](dropState, dragEvent, 'dragleave'); dragEvent.dragLeave = dropEvents.leave.target = dropState.prev.element; dragEvent.prevDropzone = dropEvents.leave.dropzone = dropState.prev.dropzone; } // if dropzone is not null, create a dragenter event if (dropState.cur.dropzone) { dropEvents.enter = new _DropEvent["default"](dropState, dragEvent, 'dragenter'); dragEvent.dragEnter = dropState.cur.element; dragEvent.dropzone = dropState.cur.dropzone; } } if (dragEvent.type === 'dragend' && dropState.cur.dropzone) { dropEvents.drop = new _DropEvent["default"](dropState, dragEvent, 'drop'); dragEvent.dropzone = dropState.cur.dropzone; dragEvent.relatedTarget = dropState.cur.element; } if (dragEvent.type === 'dragmove' && dropState.cur.dropzone) { dropEvents.move = new _DropEvent["default"](dropState, dragEvent, 'dropmove'); dropEvents.move.dragmove = dragEvent; dragEvent.dropzone = dropState.cur.dropzone; } return dropEvents; } function fireDropEvents(interaction, events) { var dropState = interaction.dropState; var activeDrops = dropState.activeDrops, cur = dropState.cur, prev = dropState.prev; if (events.leave) { prev.dropzone.fire(events.leave); } if (events.move) { cur.dropzone.fire(events.move); } if (events.enter) { cur.dropzone.fire(events.enter); } if (events.drop) { cur.dropzone.fire(events.drop); } if (events.deactivate) { fireActivationEvents(activeDrops, events.deactivate); } dropState.prev.dropzone = cur.dropzone; dropState.prev.element = cur.element; } function onEventCreated(_ref15, scope) { var interaction = _ref15.interaction, iEvent = _ref15.iEvent, event = _ref15.event; if (iEvent.type !== 'dragmove' && iEvent.type !== 'dragend') { return; } var dropState = interaction.dropState; if (scope.dynamicDrop) { dropState.activeDrops = getActiveDrops(scope, interaction.element); } var dragEvent = iEvent; var dropResult = getDrop(interaction, dragEvent, event); // update rejected status dropState.rejected = dropState.rejected && !!dropResult && dropResult.dropzone === dropState.cur.dropzone && dropResult.element === dropState.cur.element; dropState.cur.dropzone = dropResult && dropResult.dropzone; dropState.cur.element = dropResult && dropResult.element; dropState.events = getDropEvents(interaction, event, dragEvent); } function dropzoneMethod(interactable, options) { if (__utils_3.is.object(options)) { interactable.options.drop.enabled = options.enabled !== false; if (options.listeners) { var normalized = __utils_3.normalizeListeners(options.listeners); // rename 'drop' to '' as it will be prefixed with 'drop' var corrected = Object.keys(normalized).reduce(function (acc, type) { var correctedType = /^(enter|leave)/.test(type) ? "drag".concat(type) : /^(activate|deactivate|move)/.test(type) ? "drop".concat(type) : type; acc[correctedType] = normalized[type]; return acc; }, {}); interactable.off(interactable.options.drop.listeners); interactable.on(corrected); interactable.options.drop.listeners = corrected; } if (__utils_3.is.func(options.ondrop)) { interactable.on('drop', options.ondrop); } if (__utils_3.is.func(options.ondropactivate)) { interactable.on('dropactivate', options.ondropactivate); } if (__utils_3.is.func(options.ondropdeactivate)) { interactable.on('dropdeactivate', options.ondropdeactivate); } if (__utils_3.is.func(options.ondragenter)) { interactable.on('dragenter', options.ondragenter); } if (__utils_3.is.func(options.ondragleave)) { interactable.on('dragleave', options.ondragleave); } if (__utils_3.is.func(options.ondropmove)) { interactable.on('dropmove', options.ondropmove); } if (/^(pointer|center)$/.test(options.overlap)) { interactable.options.drop.overlap = options.overlap; } else if (__utils_3.is.number(options.overlap)) { interactable.options.drop.overlap = Math.max(Math.min(1, options.overlap), 0); } if ('accept' in options) { interactable.options.drop.accept = options.accept; } if ('checker' in options) { interactable.options.drop.checker = options.checker; } return interactable; } if (__utils_3.is.bool(options)) { interactable.options.drop.enabled = options; return interactable; } return interactable.options.drop; } function dropCheckMethod(interactable, dragEvent, event, draggable, draggableElement, dropElement, rect) { var dropped = false; // if the dropzone has no rect (eg. display: none) // call the custom dropChecker or just return false if (!(rect = rect || interactable.getRect(dropElement))) { return interactable.options.drop.checker ? interactable.options.drop.checker(dragEvent, event, dropped, interactable, dropElement, draggable, draggableElement) : false; } var dropOverlap = interactable.options.drop.overlap; if (dropOverlap === 'pointer') { var origin = __utils_3.getOriginXY(draggable, draggableElement, 'drag'); var page = __utils_3.pointer.getPageXY(dragEvent); page.x += origin.x; page.y += origin.y; var horizontal = page.x > rect.left && page.x < rect.right; var vertical = page.y > rect.top && page.y < rect.bottom; dropped = horizontal && vertical; } var dragRect = draggable.getRect(draggableElement); if (dragRect && dropOverlap === 'center') { var cx = dragRect.left + dragRect.width / 2; var cy = dragRect.top + dragRect.height / 2; dropped = cx >= rect.left && cx <= rect.right && cy >= rect.top && cy <= rect.bottom; } if (dragRect && __utils_3.is.number(dropOverlap)) { var overlapArea = Math.max(0, Math.min(rect.right, dragRect.right) - Math.max(rect.left, dragRect.left)) * Math.max(0, Math.min(rect.bottom, dragRect.bottom) - Math.max(rect.top, dragRect.top)); var overlapRatio = overlapArea / (dragRect.width * dragRect.height); dropped = overlapRatio >= dropOverlap; } if (interactable.options.drop.checker) { dropped = interactable.options.drop.checker(dragEvent, event, dropped, interactable, dropElement, draggable, draggableElement); } return dropped; } var drop = { id: 'actions/drop', install: __install_3, getActiveDrops: getActiveDrops, getDrop: getDrop, getDropEvents: getDropEvents, fireDropEvents: fireDropEvents, defaults: { enabled: false, accept: null, overlap: 'pointer' } }; var ___default_3 = drop; _$drop_3["default"] = ___default_3; var _$gesture_4 = {}; "use strict"; Object.defineProperty(_$gesture_4, "__esModule", { value: true }); _$gesture_4["default"] = void 0; var ___InteractEvent_4 = ___interopRequireDefault_4(_$InteractEvent_15); var ___scope_4 = _$scope_24({}); var __utils_4 = ___interopRequireWildcard_4(_$utils_55); function ___interopRequireWildcard_4(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_4(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } ___scope_4.ActionName.Gesture = 'gesture'; function __install_4(scope) { var actions = scope.actions, Interactable = scope.Interactable, interactions = scope.interactions, defaults = scope.defaults; /** * ```js * interact(element).gesturable({ * onstart: function (event) {}, * onmove : function (event) {}, * onend : function (event) {}, * * // limit multiple gestures. * // See the explanation in {@link Interactable.draggable} example * max: Infinity, * maxPerElement: 1, * }) * * var isGestureable = interact(element).gesturable() * ``` * * Gets or sets whether multitouch gestures can be performed on the target * * @param {boolean | object} [options] true/false or An object with event * listeners to be fired on gesture events (makes the Interactable gesturable) * @return {boolean | Interactable} A boolean indicating if this can be the * target of gesture events, or this Interactable */ Interactable.prototype.gesturable = function (options) { if (__utils_4.is.object(options)) { this.options.gesture.enabled = options.enabled !== false; this.setPerAction('gesture', options); this.setOnEvents('gesture', options); return this; } if (__utils_4.is.bool(options)) { this.options.gesture.enabled = options; return this; } return this.options.gesture; }; interactions.signals.on('action-start', updateGestureProps); interactions.signals.on('action-move', updateGestureProps); interactions.signals.on('action-end', updateGestureProps); interactions.signals.on('new', function (_ref) { var interaction = _ref.interaction; interaction.gesture = { angle: 0, distance: 0, scale: 1, startAngle: 0, startDistance: 0 }; }); actions[___scope_4.ActionName.Gesture] = gesture; actions.names.push(___scope_4.ActionName.Gesture); __utils_4.arr.merge(actions.eventTypes, ['gesturestart', 'gesturemove', 'gestureend']); actions.methodDict.gesture = 'gesturable'; defaults.actions.gesture = gesture.defaults; } var gesture = { id: 'actions/gesture', install: __install_4, defaults: {}, checker: function checker(_pointer, _event, _interactable, _element, interaction) { if (interaction.pointers.length >= 2) { return { name: 'gesture' }; } return null; }, getCursor: function getCursor() { return ''; } }; function updateGestureProps(_ref2) { var interaction = _ref2.interaction, iEvent = _ref2.iEvent, event = _ref2.event, phase = _ref2.phase; if (interaction.prepared.name !== 'gesture') { return; } var pointers = interaction.pointers.map(function (p) { return p.pointer; }); var starting = phase === 'start'; var ending = phase === 'end'; var deltaSource = interaction.interactable.options.deltaSource; iEvent.touches = [pointers[0], pointers[1]]; if (starting) { iEvent.distance = __utils_4.pointer.touchDistance(pointers, deltaSource); iEvent.box = __utils_4.pointer.touchBBox(pointers); iEvent.scale = 1; iEvent.ds = 0; iEvent.angle = __utils_4.pointer.touchAngle(pointers, deltaSource); iEvent.da = 0; interaction.gesture.startDistance = iEvent.distance; interaction.gesture.startAngle = iEvent.angle; } else if (ending || event instanceof ___InteractEvent_4["default"]) { var prevEvent = interaction.prevEvent; iEvent.distance = prevEvent.distance; iEvent.box = prevEvent.box; iEvent.scale = prevEvent.scale; iEvent.ds = 0; iEvent.angle = prevEvent.angle; iEvent.da = 0; } else { iEvent.distance = __utils_4.pointer.touchDistance(pointers, deltaSource); iEvent.box = __utils_4.pointer.touchBBox(pointers); iEvent.scale = iEvent.distance / interaction.gesture.startDistance; iEvent.angle = __utils_4.pointer.touchAngle(pointers, deltaSource); iEvent.ds = iEvent.scale - interaction.gesture.scale; iEvent.da = iEvent.angle - interaction.gesture.angle; } interaction.gesture.distance = iEvent.distance; interaction.gesture.angle = iEvent.angle; if (__utils_4.is.number(iEvent.scale) && iEvent.scale !== Infinity && !isNaN(iEvent.scale)) { interaction.gesture.scale = iEvent.scale; } } var ___default_4 = gesture; _$gesture_4["default"] = ___default_4; var _$resize_6 = {}; "use strict"; Object.defineProperty(_$resize_6, "__esModule", { value: true }); _$resize_6["default"] = void 0; var ___scope_6 = _$scope_24({}); var __utils_6 = ___interopRequireWildcard_6(_$utils_55); function ___interopRequireWildcard_6(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } ___scope_6.ActionName.Resize = 'resize'; function __install_6(scope) { var actions = scope.actions, browser = scope.browser, Interactable = scope.Interactable, interactions = scope.interactions, defaults = scope.defaults; // Less Precision with touch input interactions.signals.on('new', function (interaction) { interaction.resizeAxes = 'xy'; }); interactions.signals.on('action-start', start); interactions.signals.on('action-move', __move_6); interactions.signals.on('action-start', updateEventAxes); interactions.signals.on('action-move', updateEventAxes); resize.cursors = initCursors(browser); resize.defaultMargin = browser.supportsTouch || browser.supportsPointerEvent ? 20 : 10; /** * ```js * interact(element).resizable({ * onstart: function (event) {}, * onmove : function (event) {}, * onend : function (event) {}, * * edges: { * top : true, // Use pointer coords to check for resize. * left : false, // Disable resizing from left edge. * bottom: '.resize-s',// Resize if pointer target matches selector * right : handleEl // Resize if pointer target is the given Element * }, * * // Width and height can be adjusted independently. When `true`, width and * // height are adjusted at a 1:1 ratio. * square: false, * * // Width and height can be adjusted independently. When `true`, width and * // height maintain the aspect ratio they had when resizing started. * preserveAspectRatio: false, * * // a value of 'none' will limit the resize rect to a minimum of 0x0 * // 'negate' will allow the rect to have negative width/height * // 'reposition' will keep the width/height positive by swapping * // the top and bottom edges and/or swapping the left and right edges * invert: 'none' || 'negate' || 'reposition' * * // limit multiple resizes. * // See the explanation in the {@link Interactable.draggable} example * max: Infinity, * maxPerElement: 1, * }) * * var isResizeable = interact(element).resizable() * ``` * * Gets or sets whether resize actions can be performed on the target * * @param {boolean | object} [options] true/false or An object with event * listeners to be fired on resize events (object makes the Interactable * resizable) * @return {boolean | Interactable} A boolean indicating if this can be the * target of resize elements, or this Interactable */ Interactable.prototype.resizable = function (options) { return resizable(this, options, scope); }; actions[___scope_6.ActionName.Resize] = resize; actions.names.push(___scope_6.ActionName.Resize); __utils_6.arr.merge(actions.eventTypes, ['resizestart', 'resizemove', 'resizeinertiastart', 'resizeresume', 'resizeend']); actions.methodDict.resize = 'resizable'; defaults.actions.resize = resize.defaults; } var resize = { id: 'actions/resize', install: __install_6, defaults: { square: false, preserveAspectRatio: false, axis: 'xy', // use default margin margin: NaN, // object with props left, right, top, bottom which are // true/false values to resize when the pointer is over that edge, // CSS selectors to match the handles for each direction // or the Elements for each handle edges: null, // a value of 'none' will limit the resize rect to a minimum of 0x0 // 'negate' will alow the rect to have negative width/height // 'reposition' will keep the width/height positive by swapping // the top and bottom edges and/or swapping the left and right edges invert: 'none' }, checker: function checker(_pointer, _event, interactable, element, interaction, rect) { if (!rect) { return null; } var page = __utils_6.extend({}, interaction.coords.cur.page); var options = interactable.options; if (options.resize.enabled) { var resizeOptions = options.resize; var resizeEdges = { left: false, right: false, top: false, bottom: false }; // if using resize.edges if (__utils_6.is.object(resizeOptions.edges)) { for (var edge in resizeEdges) { resizeEdges[edge] = checkResizeEdge(edge, resizeOptions.edges[edge], page, interaction._latestPointer.eventTarget, element, rect, resizeOptions.margin || this.defaultMargin); } resizeEdges.left = resizeEdges.left && !resizeEdges.right; resizeEdges.top = resizeEdges.top && !resizeEdges.bottom; if (resizeEdges.left || resizeEdges.right || resizeEdges.top || resizeEdges.bottom) { return { name: 'resize', edges: resizeEdges }; } } else { var right = options.resize.axis !== 'y' && page.x > rect.right - this.defaultMargin; var bottom = options.resize.axis !== 'x' && page.y > rect.bottom - this.defaultMargin; if (right || bottom) { return { name: 'resize', axes: (right ? 'x' : '') + (bottom ? 'y' : '') }; } } } return null; }, cursors: null, getCursor: function getCursor(action) { var cursors = resize.cursors; if (action.axis) { return cursors[action.name + action.axis]; } else if (action.edges) { var cursorKey = ''; var edgeNames = ['top', 'bottom', 'left', 'right']; for (var i = 0; i < 4; i++) { if (action.edges[edgeNames[i]]) { cursorKey += edgeNames[i]; } } return cursors[cursorKey]; } return null; }, defaultMargin: null }; function resizable(interactable, options, scope) { if (__utils_6.is.object(options)) { interactable.options.resize.enabled = options.enabled !== false; interactable.setPerAction('resize', options); interactable.setOnEvents('resize', options); if (__utils_6.is.string(options.axis) && /^x$|^y$|^xy$/.test(options.axis)) { interactable.options.resize.axis = options.axis; } else if (options.axis === null) { interactable.options.resize.axis = scope.defaults.actions.resize.axis; } if (__utils_6.is.bool(options.preserveAspectRatio)) { interactable.options.resize.preserveAspectRatio = options.preserveAspectRatio; } else if (__utils_6.is.bool(options.square)) { interactable.options.resize.square = options.square; } return interactable; } if (__utils_6.is.bool(options)) { interactable.options.resize.enabled = options; return interactable; } return interactable.options.resize; } function checkResizeEdge(name, value, page, element, interactableElement, rect, margin) { // false, '', undefined, null if (!value) { return false; } // true value, use pointer coords and element rect if (value === true) { // if dimensions are negative, "switch" edges var width = __utils_6.is.number(rect.width) ? rect.width : rect.right - rect.left; var height = __utils_6.is.number(rect.height) ? rect.height : rect.bottom - rect.top; // don't use margin greater than half the relevent dimension margin = Math.min(margin, (name === 'left' || name === 'right' ? width : height) / 2); if (width < 0) { if (name === 'left') { name = 'right'; } else if (name === 'right') { name = 'left'; } } if (height < 0) { if (name === 'top') { name = 'bottom'; } else if (name === 'bottom') { name = 'top'; } } if (name === 'left') { return page.x < (width >= 0 ? rect.left : rect.right) + margin; } if (name === 'top') { return page.y < (height >= 0 ? rect.top : rect.bottom) + margin; } if (name === 'right') { return page.x > (width >= 0 ? rect.right : rect.left) - margin; } if (name === 'bottom') { return page.y > (height >= 0 ? rect.bottom : rect.top) - margin; } } // the remaining checks require an element if (!__utils_6.is.element(element)) { return false; } return __utils_6.is.element(value) // the value is an element to use as a resize handle ? value === element // otherwise check if element matches value as selector : __utils_6.dom.matchesUpTo(element, value, interactableElement); } function initCursors(browser) { return browser.isIe9 ? { x: 'e-resize', y: 's-resize', xy: 'se-resize', top: 'n-resize', left: 'w-resize', bottom: 's-resize', right: 'e-resize', topleft: 'se-resize', bottomright: 'se-resize', topright: 'ne-resize', bottomleft: 'ne-resize' } : { x: 'ew-resize', y: 'ns-resize', xy: 'nwse-resize', top: 'ns-resize', left: 'ew-resize', bottom: 'ns-resize', right: 'ew-resize', topleft: 'nwse-resize', bottomright: 'nwse-resize', topright: 'nesw-resize', bottomleft: 'nesw-resize' }; } function start(_ref) { var iEvent = _ref.iEvent, interaction = _ref.interaction; if (interaction.prepared.name !== 'resize' || !interaction.prepared.edges) { return; } var startRect = interaction.rect; var resizeOptions = interaction.interactable.options.resize; /* * When using the `resizable.square` or `resizable.preserveAspectRatio` options, resizing from one edge * will affect another. E.g. with `resizable.square`, resizing to make the right edge larger will make * the bottom edge larger by the same amount. We call these 'linked' edges. Any linked edges will depend * on the active edges and the edge being interacted with. */ if (resizeOptions.square || resizeOptions.preserveAspectRatio) { var linkedEdges = __utils_6.extend({}, interaction.prepared.edges); linkedEdges.top = linkedEdges.top || linkedEdges.left && !linkedEdges.bottom; linkedEdges.left = linkedEdges.left || linkedEdges.top && !linkedEdges.right; linkedEdges.bottom = linkedEdges.bottom || linkedEdges.right && !linkedEdges.top; linkedEdges.right = linkedEdges.right || linkedEdges.bottom && !linkedEdges.left; interaction.prepared._linkedEdges = linkedEdges; } else { interaction.prepared._linkedEdges = null; } // if using `resizable.preserveAspectRatio` option, record aspect ratio at the start of the resize if (resizeOptions.preserveAspectRatio) { interaction.resizeStartAspectRatio = startRect.width / startRect.height; } interaction.resizeRects = { start: startRect, current: __utils_6.extend({}, startRect), inverted: __utils_6.extend({}, startRect), previous: __utils_6.extend({}, startRect), delta: { left: 0, right: 0, width: 0, top: 0, bottom: 0, height: 0 } }; iEvent.rect = interaction.resizeRects.inverted; iEvent.deltaRect = interaction.resizeRects.delta; } function __move_6(_ref2) { var iEvent = _ref2.iEvent, interaction = _ref2.interaction; if (interaction.prepared.name !== 'resize' || !interaction.prepared.edges) { return; } var resizeOptions = interaction.interactable.options.resize; var invert = resizeOptions.invert; var invertible = invert === 'reposition' || invert === 'negate'; var edges = interaction.prepared.edges; // eslint-disable-next-line no-shadow var start = interaction.resizeRects.start; var current = interaction.resizeRects.current; var inverted = interaction.resizeRects.inverted; var deltaRect = interaction.resizeRects.delta; var previous = __utils_6.extend(interaction.resizeRects.previous, inverted); var originalEdges = edges; var eventDelta = __utils_6.extend({}, iEvent.delta); if (resizeOptions.preserveAspectRatio || resizeOptions.square) { // `resize.preserveAspectRatio` takes precedence over `resize.square` var startAspectRatio = resizeOptions.preserveAspectRatio ? interaction.resizeStartAspectRatio : 1; edges = interaction.prepared._linkedEdges; if (originalEdges.left && originalEdges.bottom || originalEdges.right && originalEdges.top) { eventDelta.y = -eventDelta.x / startAspectRatio; } else if (originalEdges.left || originalEdges.right) { eventDelta.y = eventDelta.x / startAspectRatio; } else if (originalEdges.top || originalEdges.bottom) { eventDelta.x = eventDelta.y * startAspectRatio; } } // update the 'current' rect without modifications if (edges.top) { current.top += eventDelta.y; } if (edges.bottom) { current.bottom += eventDelta.y; } if (edges.left) { current.left += eventDelta.x; } if (edges.right) { current.right += eventDelta.x; } if (invertible) { // if invertible, copy the current rect __utils_6.extend(inverted, current); if (invert === 'reposition') { // swap edge values if necessary to keep width/height positive var swap; if (inverted.top > inverted.bottom) { swap = inverted.top; inverted.top = inverted.bottom; inverted.bottom = swap; } if (inverted.left > inverted.right) { swap = inverted.left; inverted.left = inverted.right; inverted.right = swap; } } } else { // if not invertible, restrict to minimum of 0x0 rect inverted.top = Math.min(current.top, start.bottom); inverted.bottom = Math.max(current.bottom, start.top); inverted.left = Math.min(current.left, start.right); inverted.right = Math.max(current.right, start.left); } inverted.width = inverted.right - inverted.left; inverted.height = inverted.bottom - inverted.top; for (var edge in inverted) { deltaRect[edge] = inverted[edge] - previous[edge]; } iEvent.edges = interaction.prepared.edges; iEvent.rect = inverted; iEvent.deltaRect = deltaRect; } function updateEventAxes(_ref3) { var interaction = _ref3.interaction, iEvent = _ref3.iEvent, action = _ref3.action; if (action !== 'resize' || !interaction.resizeAxes) { return; } var options = interaction.interactable.options; if (options.resize.square) { if (interaction.resizeAxes === 'y') { iEvent.delta.x = iEvent.delta.y; } else { iEvent.delta.y = iEvent.delta.x; } iEvent.axes = 'xy'; } else { iEvent.axes = interaction.resizeAxes; if (interaction.resizeAxes === 'x') { iEvent.delta.y = 0; } else if (interaction.resizeAxes === 'y') { iEvent.delta.x = 0; } } } var ___default_6 = resize; _$resize_6["default"] = ___default_6; var _$actions_5 = {}; "use strict"; Object.defineProperty(_$actions_5, "__esModule", { value: true }); _$actions_5.install = __install_5; Object.defineProperty(_$actions_5, "drag", { enumerable: true, get: function get() { return ___drag_5["default"]; } }); Object.defineProperty(_$actions_5, "drop", { enumerable: true, get: function get() { return _drop["default"]; } }); Object.defineProperty(_$actions_5, "gesture", { enumerable: true, get: function get() { return _gesture["default"]; } }); Object.defineProperty(_$actions_5, "resize", { enumerable: true, get: function get() { return _resize["default"]; } }); _$actions_5.id = void 0; var ___drag_5 = ___interopRequireDefault_5(_$drag_1); var _drop = ___interopRequireDefault_5(_$drop_3); var _gesture = ___interopRequireDefault_5(_$gesture_4); var _resize = ___interopRequireDefault_5(_$resize_6); function ___interopRequireDefault_5(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function __install_5(scope) { scope.usePlugin(_gesture["default"]); scope.usePlugin(_resize["default"]); scope.usePlugin(___drag_5["default"]); scope.usePlugin(_drop["default"]); } var id = 'actions'; _$actions_5.id = id; var _$autoScroll_7 = {}; "use strict"; Object.defineProperty(_$autoScroll_7, "__esModule", { value: true }); _$autoScroll_7.getContainer = getContainer; _$autoScroll_7.getScroll = getScroll; _$autoScroll_7.getScrollSize = getScrollSize; _$autoScroll_7.getScrollSizeDelta = getScrollSizeDelta; _$autoScroll_7["default"] = void 0; var __domUtils_7 = ___interopRequireWildcard_7(_$domUtils_50); var __is_7 = ___interopRequireWildcard_7(_$is_56); var ___raf_7 = ___interopRequireDefault_7(_$raf_61); /* removed: var _$rect_62 = require("@interactjs/utils/rect"); */; /* removed: var _$window_65 = require("@interactjs/utils/window"); */; function ___interopRequireDefault_7(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_7(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __install_7(scope) { var interactions = scope.interactions, defaults = scope.defaults, actions = scope.actions; scope.autoScroll = autoScroll; autoScroll.now = function () { return scope.now(); }; interactions.signals.on('new', function (_ref) { var interaction = _ref.interaction; interaction.autoScroll = null; }); interactions.signals.on('destroy', function (_ref2) { var interaction = _ref2.interaction; interaction.autoScroll = null; autoScroll.stop(); if (autoScroll.interaction) { autoScroll.interaction = null; } }); interactions.signals.on('stop', autoScroll.stop); interactions.signals.on('action-move', function (arg) { return autoScroll.onInteractionMove(arg); }); actions.eventTypes.push('autoscroll'); defaults.perAction.autoScroll = autoScroll.defaults; } var autoScroll = { defaults: { enabled: false, margin: 60, // the item that is scrolled (Window or HTMLElement) container: null, // the scroll speed in pixels per second speed: 300 }, now: Date.now, interaction: null, i: null, x: 0, y: 0, isScrolling: false, prevTime: 0, margin: 0, speed: 0, start: function start(interaction) { autoScroll.isScrolling = true; ___raf_7["default"].cancel(autoScroll.i); interaction.autoScroll = autoScroll; autoScroll.interaction = interaction; autoScroll.prevTime = autoScroll.now(); autoScroll.i = ___raf_7["default"].request(autoScroll.scroll); }, stop: function stop() { autoScroll.isScrolling = false; if (autoScroll.interaction) { autoScroll.interaction.autoScroll = null; } ___raf_7["default"].cancel(autoScroll.i); }, // scroll the window by the values in scroll.x/y scroll: function scroll() { var interaction = autoScroll.interaction; var interactable = interaction.interactable, element = interaction.element; var options = interactable.options[autoScroll.interaction.prepared.name].autoScroll; var container = getContainer(options.container, interactable, element); var now = autoScroll.now(); // change in time in seconds var dt = (now - autoScroll.prevTime) / 1000; // displacement var s = options.speed * dt; if (s >= 1) { var scrollBy = { x: autoScroll.x * s, y: autoScroll.y * s }; if (scrollBy.x || scrollBy.y) { var prevScroll = getScroll(container); if (__is_7.window(container)) { container.scrollBy(scrollBy.x, scrollBy.y); } else if (container) { container.scrollLeft += scrollBy.x; container.scrollTop += scrollBy.y; } var curScroll = getScroll(container); var delta = { x: curScroll.x - prevScroll.x, y: curScroll.y - prevScroll.y }; if (delta.x || delta.y) { interactable.fire({ type: 'autoscroll', target: element, interactable: interactable, delta: delta, interaction: interaction, container: container }); } } autoScroll.prevTime = now; } if (autoScroll.isScrolling) { ___raf_7["default"].cancel(autoScroll.i); autoScroll.i = ___raf_7["default"].request(autoScroll.scroll); } }, check: function check(interactable, actionName) { var options = interactable.options; return options[actionName].autoScroll && options[actionName].autoScroll.enabled; }, onInteractionMove: function onInteractionMove(_ref3) { var interaction = _ref3.interaction, pointer = _ref3.pointer; if (!(interaction.interacting() && autoScroll.check(interaction.interactable, interaction.prepared.name))) { return; } if (interaction.simulation) { autoScroll.x = autoScroll.y = 0; return; } var top; var right; var bottom; var left; var interactable = interaction.interactable, element = interaction.element; var options = interactable.options[interaction.prepared.name].autoScroll; var container = getContainer(options.container, interactable, element); if (__is_7.window(container)) { left = pointer.clientX < autoScroll.margin; top = pointer.clientY < autoScroll.margin; right = pointer.clientX > container.innerWidth - autoScroll.margin; bottom = pointer.clientY > container.innerHeight - autoScroll.margin; } else { var rect = __domUtils_7.getElementClientRect(container); left = pointer.clientX < rect.left + autoScroll.margin; top = pointer.clientY < rect.top + autoScroll.margin; right = pointer.clientX > rect.right - autoScroll.margin; bottom = pointer.clientY > rect.bottom - autoScroll.margin; } autoScroll.x = right ? 1 : left ? -1 : 0; autoScroll.y = bottom ? 1 : top ? -1 : 0; if (!autoScroll.isScrolling) { // set the autoScroll properties to those of the target autoScroll.margin = options.margin; autoScroll.speed = options.speed; autoScroll.start(interaction); } } }; function getContainer(value, interactable, element) { return (__is_7.string(value) ? (0, _$rect_62.getStringOptionResult)(value, interactable, element) : value) || (0, _$window_65.getWindow)(element); } function getScroll(container) { if (__is_7.window(container)) { container = window.document.body; } return { x: container.scrollLeft, y: container.scrollTop }; } function getScrollSize(container) { if (__is_7.window(container)) { container = window.document.body; } return { x: container.scrollWidth, y: container.scrollHeight }; } function getScrollSizeDelta(_ref4, func) { var interaction = _ref4.interaction, element = _ref4.element; var scrollOptions = interaction && interaction.interactable.options[interaction.prepared.name].autoScroll; if (!scrollOptions || !scrollOptions.enabled) { func(); return { x: 0, y: 0 }; } var scrollContainer = getContainer(scrollOptions.container, interaction.interactable, element); var prevSize = getScroll(scrollContainer); func(); var curSize = getScroll(scrollContainer); return { x: curSize.x - prevSize.x, y: curSize.y - prevSize.y }; } var ___default_7 = { id: 'auto-scroll', install: __install_7 }; _$autoScroll_7["default"] = ___default_7; var _$InteractableMethods_8 = {}; "use strict"; Object.defineProperty(_$InteractableMethods_8, "__esModule", { value: true }); _$InteractableMethods_8["default"] = void 0; /* removed: var _$utils_55 = require("@interactjs/utils"); */; var __is_8 = ___interopRequireWildcard_8(_$is_56); function ___interopRequireWildcard_8(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __install_8(scope) { var Interactable = scope.Interactable, actions = scope.actions; Interactable.prototype.getAction = getAction; /** * ```js * interact(element, { ignoreFrom: document.getElementById('no-action') }) * // or * interact(element).ignoreFrom('input, textarea, a') * ``` * @deprecated * If the target of the `mousedown`, `pointerdown` or `touchstart` event or any * of it's parents match the given CSS selector or Element, no * drag/resize/gesture is started. * * Don't use this method. Instead set the `ignoreFrom` option for each action * or for `pointerEvents` * * @example * interact(targett) * .draggable({ * ignoreFrom: 'input, textarea, a[href]'', * }) * .pointerEvents({ * ignoreFrom: '[no-pointer]', * }) * * @param {string | Element | null} [newValue] a CSS selector string, an * Element or `null` to not ignore any elements * @return {string | Element | object} The current ignoreFrom value or this * Interactable */ Interactable.prototype.ignoreFrom = (0, _$utils_55.warnOnce)(function (newValue) { return this._backCompatOption('ignoreFrom', newValue); }, 'Interactable.ignoreFrom() has been deprecated. Use Interactble.draggable({ignoreFrom: newValue}).'); /** * @deprecated * * A drag/resize/gesture is started only If the target of the `mousedown`, * `pointerdown` or `touchstart` event or any of it's parents match the given * CSS selector or Element. * * Don't use this method. Instead set the `allowFrom` option for each action * or for `pointerEvents` * * @example * interact(targett) * .resizable({ * allowFrom: '.resize-handle', * .pointerEvents({ * allowFrom: '.handle',, * }) * * @param {string | Element | null} [newValue] a CSS selector string, an * Element or `null` to allow from any element * @return {string | Element | object} The current allowFrom value or this * Interactable */ Interactable.prototype.allowFrom = (0, _$utils_55.warnOnce)(function (newValue) { return this._backCompatOption('allowFrom', newValue); }, 'Interactable.allowFrom() has been deprecated. Use Interactble.draggable({allowFrom: newValue}).'); /** * ```js * interact('.resize-drag') * .resizable(true) * .draggable(true) * .actionChecker(function (pointer, event, action, interactable, element, interaction) { * * if (interact.matchesSelector(event.target, '.drag-handle')) { * // force drag with handle target * action.name = drag * } * else { * // resize from the top and right edges * action.name = 'resize' * action.edges = { top: true, right: true } * } * * return action * }) * ``` * * Returns or sets the function used to check action to be performed on * pointerDown * * @param {function | null} [checker] A function which takes a pointer event, * defaultAction string, interactable, element and interaction as parameters * and returns an object with name property 'drag' 'resize' or 'gesture' and * optionally an `edges` object with boolean 'top', 'left', 'bottom' and right * props. * @return {Function | Interactable} The checker function or this Interactable */ Interactable.prototype.actionChecker = actionChecker; /** * Returns or sets whether the the cursor should be changed depending on the * action that would be performed if the mouse were pressed and dragged. * * @param {boolean} [newValue] * @return {boolean | Interactable} The current setting or this Interactable */ Interactable.prototype.styleCursor = styleCursor; Interactable.prototype.defaultActionChecker = function (pointer, event, interaction, element) { return defaultActionChecker(this, pointer, event, interaction, element, actions); }; } function getAction(pointer, event, interaction, element) { var action = this.defaultActionChecker(pointer, event, interaction, element); if (this.options.actionChecker) { return this.options.actionChecker(pointer, event, action, this, element, interaction); } return action; } function defaultActionChecker(interactable, pointer, event, interaction, element, actions) { var rect = interactable.getRect(element); var buttons = event.buttons || { 0: 1, 1: 4, 3: 8, 4: 16 }[event.button]; var action = null; for (var _i = 0; _i < actions.names.length; _i++) { var _ref; _ref = actions.names[_i]; var actionName = _ref; // check mouseButton setting if the pointer is down if (interaction.pointerIsDown && /mouse|pointer/.test(interaction.pointerType) && (buttons & interactable.options[actionName].mouseButtons) === 0) { continue; } action = actions[actionName].checker(pointer, event, interactable, element, interaction, rect); if (action) { return action; } } } function styleCursor(newValue) { if (__is_8.bool(newValue)) { this.options.styleCursor = newValue; return this; } if (newValue === null) { delete this.options.styleCursor; return this; } return this.options.styleCursor; } function actionChecker(checker) { if (__is_8.func(checker)) { this.options.actionChecker = checker; return this; } if (checker === null) { delete this.options.actionChecker; return this; } return this.options.actionChecker; } var ___default_8 = { id: 'auto-start/interactableMethods', install: __install_8 }; _$InteractableMethods_8["default"] = ___default_8; var _$base_9 = {}; "use strict"; Object.defineProperty(_$base_9, "__esModule", { value: true }); _$base_9["default"] = void 0; var __utils_9 = ___interopRequireWildcard_9(_$utils_55); var _InteractableMethods = ___interopRequireDefault_9(_$InteractableMethods_8); function ___interopRequireDefault_9(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_9(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __install_9(scope) { var interact = scope.interact, interactions = scope.interactions, defaults = scope.defaults; scope.usePlugin(_InteractableMethods["default"]); // set cursor style on mousedown interactions.signals.on('down', function (_ref) { var interaction = _ref.interaction, pointer = _ref.pointer, event = _ref.event, eventTarget = _ref.eventTarget; if (interaction.interacting()) { return; } var actionInfo = getActionInfo(interaction, pointer, event, eventTarget, scope); prepare(interaction, actionInfo, scope); }); // set cursor style on mousemove interactions.signals.on('move', function (_ref2) { var interaction = _ref2.interaction, pointer = _ref2.pointer, event = _ref2.event, eventTarget = _ref2.eventTarget; if (interaction.pointerType !== 'mouse' || interaction.pointerIsDown || interaction.interacting()) { return; } var actionInfo = getActionInfo(interaction, pointer, event, eventTarget, scope); prepare(interaction, actionInfo, scope); }); interactions.signals.on('move', function (arg) { var interaction = arg.interaction; if (!interaction.pointerIsDown || interaction.interacting() || !interaction.pointerWasMoved || !interaction.prepared.name) { return; } scope.autoStart.signals.fire('before-start', arg); var interactable = interaction.interactable; if (interaction.prepared.name && interactable) { // check manualStart and interaction limit if (interactable.options[interaction.prepared.name].manualStart || !withinInteractionLimit(interactable, interaction.element, interaction.prepared, scope)) { interaction.stop(); } else { interaction.start(interaction.prepared, interactable, interaction.element); } } }); interactions.signals.on('stop', function (_ref3) { var interaction = _ref3.interaction; var interactable = interaction.interactable; if (interactable && interactable.options.styleCursor) { setCursor(interaction.element, '', scope); } }); defaults.base.actionChecker = null; defaults.base.styleCursor = true; __utils_9.extend(defaults.perAction, { manualStart: false, max: Infinity, maxPerElement: 1, allowFrom: null, ignoreFrom: null, // only allow left button by default // see https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons#Return_value mouseButtons: 1 }); /** * Returns or sets the maximum number of concurrent interactions allowed. By * default only 1 interaction is allowed at a time (for backwards * compatibility). To allow multiple interactions on the same Interactables and * elements, you need to enable it in the draggable, resizable and gesturable * `'max'` and `'maxPerElement'` options. * * @alias module:interact.maxInteractions * * @param {number} [newValue] Any number. newValue <= 0 means no interactions. */ interact.maxInteractions = function (newValue) { return maxInteractions(newValue, scope); }; scope.autoStart = { // Allow this many interactions to happen simultaneously maxInteractions: Infinity, withinInteractionLimit: withinInteractionLimit, cursorElement: null, signals: new __utils_9.Signals() }; } // Check if the current interactable supports the action. // If so, return the validated action. Otherwise, return null function validateAction(action, interactable, element, eventTarget, scope) { if (interactable.testIgnoreAllow(interactable.options[action.name], element, eventTarget) && interactable.options[action.name].enabled && withinInteractionLimit(interactable, element, action, scope)) { return action; } return null; } function validateMatches(interaction, pointer, event, matches, matchElements, eventTarget, scope) { for (var i = 0, len = matches.length; i < len; i++) { var match = matches[i]; var matchElement = matchElements[i]; var matchAction = match.getAction(pointer, event, interaction, matchElement); if (!matchAction) { continue; } var action = validateAction(matchAction, match, matchElement, eventTarget, scope); if (action) { return { action: action, interactable: match, element: matchElement }; } } return { action: null, interactable: null, element: null }; } function getActionInfo(interaction, pointer, event, eventTarget, scope) { var matches = []; var matchElements = []; var element = eventTarget; function pushMatches(interactable) { matches.push(interactable); matchElements.push(element); } while (__utils_9.is.element(element)) { matches = []; matchElements = []; scope.interactables.forEachMatch(element, pushMatches); var actionInfo = validateMatches(interaction, pointer, event, matches, matchElements, eventTarget, scope); if (actionInfo.action && !actionInfo.interactable.options[actionInfo.action.name].manualStart) { return actionInfo; } element = __utils_9.dom.parentNode(element); } return { action: null, interactable: null, element: null }; } function prepare(interaction, _ref4, scope) { var action = _ref4.action, interactable = _ref4.interactable, element = _ref4.element; action = action || {}; if (interaction.interactable && interaction.interactable.options.styleCursor) { setCursor(interaction.element, '', scope); } interaction.interactable = interactable; interaction.element = element; __utils_9.copyAction(interaction.prepared, action); interaction.rect = interactable && action.name ? interactable.getRect(element) : null; if (interactable && interactable.options.styleCursor) { var cursor = action ? scope.actions[action.name].getCursor(action) : ''; setCursor(interaction.element, cursor, scope); } scope.autoStart.signals.fire('prepared', { interaction: interaction }); } function withinInteractionLimit(interactable, element, action, scope) { var options = interactable.options; var maxActions = options[action.name].max; var maxPerElement = options[action.name].maxPerElement; var autoStartMax = scope.autoStart.maxInteractions; var activeInteractions = 0; var interactableCount = 0; var elementCount = 0; // no actions if any of these values == 0 if (!(maxActions && maxPerElement && autoStartMax)) { return false; } for (var _i = 0; _i < scope.interactions.list.length; _i++) { var _ref5; _ref5 = scope.interactions.list[_i]; var interaction = _ref5; var otherAction = interaction.prepared.name; if (!interaction.interacting()) { continue; } activeInteractions++; if (activeInteractions >= autoStartMax) { return false; } if (interaction.interactable !== interactable) { continue; } interactableCount += otherAction === action.name ? 1 : 0; if (interactableCount >= maxActions) { return false; } if (interaction.element === element) { elementCount++; if (otherAction === action.name && elementCount >= maxPerElement) { return false; } } } return autoStartMax > 0; } function maxInteractions(newValue, scope) { if (__utils_9.is.number(newValue)) { scope.autoStart.maxInteractions = newValue; return this; } return scope.autoStart.maxInteractions; } function setCursor(element, cursor, scope) { if (scope.autoStart.cursorElement) { scope.autoStart.cursorElement.style.cursor = ''; } element.ownerDocument.documentElement.style.cursor = cursor; element.style.cursor = cursor; scope.autoStart.cursorElement = cursor ? element : null; } var ___default_9 = { id: 'auto-start/base', install: __install_9, maxInteractions: maxInteractions, withinInteractionLimit: withinInteractionLimit, validateAction: validateAction }; _$base_9["default"] = ___default_9; var _$dragAxis_10 = {}; "use strict"; Object.defineProperty(_$dragAxis_10, "__esModule", { value: true }); _$dragAxis_10["default"] = void 0; var ___scope_10 = _$scope_24({}); /* removed: var _$domUtils_50 = require("@interactjs/utils/domUtils"); */; var __is_10 = ___interopRequireWildcard_10(_$is_56); var _base = ___interopRequireDefault_10(_$base_9); function ___interopRequireDefault_10(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_10(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __install_10(scope) { scope.autoStart.signals.on('before-start', function (_ref) { var interaction = _ref.interaction, eventTarget = _ref.eventTarget, dx = _ref.dx, dy = _ref.dy; if (interaction.prepared.name !== 'drag') { return; } // check if a drag is in the correct axis var absX = Math.abs(dx); var absY = Math.abs(dy); var targetOptions = interaction.interactable.options.drag; var startAxis = targetOptions.startAxis; var currentAxis = absX > absY ? 'x' : absX < absY ? 'y' : 'xy'; interaction.prepared.axis = targetOptions.lockAxis === 'start' ? currentAxis[0] // always lock to one axis even if currentAxis === 'xy' : targetOptions.lockAxis; // if the movement isn't in the startAxis of the interactable if (currentAxis !== 'xy' && startAxis !== 'xy' && startAxis !== currentAxis) { // cancel the prepared action interaction.prepared.name = null; // then try to get a drag from another ineractable var element = eventTarget; var getDraggable = function getDraggable(interactable) { if (interactable === interaction.interactable) { return; } var options = interaction.interactable.options.drag; if (!options.manualStart && interactable.testIgnoreAllow(options, element, eventTarget)) { var action = interactable.getAction(interaction.downPointer, interaction.downEvent, interaction, element); if (action && action.name === ___scope_10.ActionName.Drag && checkStartAxis(currentAxis, interactable) && _base["default"].validateAction(action, interactable, element, eventTarget, scope)) { return interactable; } } }; // check all interactables while (__is_10.element(element)) { var interactable = scope.interactables.forEachMatch(element, getDraggable); if (interactable) { interaction.prepared.name = ___scope_10.ActionName.Drag; interaction.interactable = interactable; interaction.element = element; break; } element = (0, _$domUtils_50.parentNode)(element); } } }); function checkStartAxis(startAxis, interactable) { if (!interactable) { return false; } var thisAxis = interactable.options[___scope_10.ActionName.Drag].startAxis; return startAxis === 'xy' || thisAxis === 'xy' || thisAxis === startAxis; } } var ___default_10 = { id: 'auto-start/dragAxis', install: __install_10 }; _$dragAxis_10["default"] = ___default_10; var _$hold_11 = {}; "use strict"; Object.defineProperty(_$hold_11, "__esModule", { value: true }); _$hold_11["default"] = void 0; var ___base_11 = ___interopRequireDefault_11(_$base_9); function ___interopRequireDefault_11(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function __install_11(scope) { var autoStart = scope.autoStart, interactions = scope.interactions, defaults = scope.defaults; scope.usePlugin(___base_11["default"]); defaults.perAction.hold = 0; defaults.perAction.delay = 0; interactions.signals.on('new', function (interaction) { interaction.autoStartHoldTimer = null; }); autoStart.signals.on('prepared', function (_ref) { var interaction = _ref.interaction; var hold = getHoldDuration(interaction); if (hold > 0) { interaction.autoStartHoldTimer = setTimeout(function () { interaction.start(interaction.prepared, interaction.interactable, interaction.element); }, hold); } }); interactions.signals.on('move', function (_ref2) { var interaction = _ref2.interaction, duplicate = _ref2.duplicate; if (interaction.pointerWasMoved && !duplicate) { clearTimeout(interaction.autoStartHoldTimer); } }); // prevent regular down->move autoStart autoStart.signals.on('before-start', function (_ref3) { var interaction = _ref3.interaction; var hold = getHoldDuration(interaction); if (hold > 0) { interaction.prepared.name = null; } }); } function getHoldDuration(interaction) { var actionName = interaction.prepared && interaction.prepared.name; if (!actionName) { return null; } var options = interaction.interactable.options; return options[actionName].hold || options[actionName].delay; } var ___default_11 = { id: 'auto-start/hold', install: __install_11, getHoldDuration: getHoldDuration }; _$hold_11["default"] = ___default_11; var _$autoStart_12 = {}; "use strict"; Object.defineProperty(_$autoStart_12, "__esModule", { value: true }); _$autoStart_12.install = __install_12; Object.defineProperty(_$autoStart_12, "autoStart", { enumerable: true, get: function get() { return ___base_12["default"]; } }); Object.defineProperty(_$autoStart_12, "dragAxis", { enumerable: true, get: function get() { return _dragAxis["default"]; } }); Object.defineProperty(_$autoStart_12, "hold", { enumerable: true, get: function get() { return _hold["default"]; } }); _$autoStart_12.id = void 0; var ___base_12 = ___interopRequireDefault_12(_$base_9); var _dragAxis = ___interopRequireDefault_12(_$dragAxis_10); var _hold = ___interopRequireDefault_12(_$hold_11); function ___interopRequireDefault_12(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function __install_12(scope) { scope.usePlugin(___base_12["default"]); scope.usePlugin(_hold["default"]); scope.usePlugin(_dragAxis["default"]); } var __id_12 = 'auto-start'; _$autoStart_12.id = __id_12; var _$interactablePreventDefault_21 = {}; "use strict"; Object.defineProperty(_$interactablePreventDefault_21, "__esModule", { value: true }); _$interactablePreventDefault_21.install = __install_21; _$interactablePreventDefault_21["default"] = void 0; /* removed: var _$domUtils_50 = require("@interactjs/utils/domUtils"); */; var ___events_21 = ___interopRequireDefault_21(_$events_51); var __is_21 = ___interopRequireWildcard_21(_$is_56); /* removed: var _$window_65 = require("@interactjs/utils/window"); */; function ___interopRequireWildcard_21(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_21(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function preventDefault(interactable, newValue) { if (/^(always|never|auto)$/.test(newValue)) { interactable.options.preventDefault = newValue; return interactable; } if (__is_21.bool(newValue)) { interactable.options.preventDefault = newValue ? 'always' : 'never'; return interactable; } return interactable.options.preventDefault; } function checkAndPreventDefault(interactable, scope, event) { var setting = interactable.options.preventDefault; if (setting === 'never') { return; } if (setting === 'always') { event.preventDefault(); return; } // setting === 'auto' // if the browser supports passive event listeners and isn't running on iOS, // don't preventDefault of touch{start,move} events. CSS touch-action and // user-select should be used instead of calling event.preventDefault(). if (___events_21["default"].supportsPassive && /^touch(start|move)$/.test(event.type)) { var doc = (0, _$window_65.getWindow)(event.target).document; var docOptions = scope.getDocOptions(doc); if (!(docOptions && docOptions.events) || docOptions.events.passive !== false) { return; } } // don't preventDefault of pointerdown events if (/^(mouse|pointer|touch)*(down|start)/i.test(event.type)) { return; } // don't preventDefault on editable elements if (__is_21.element(event.target) && (0, _$domUtils_50.matchesSelector)(event.target, 'input,select,textarea,[contenteditable=true],[contenteditable=true] *')) { return; } event.preventDefault(); } function onInteractionEvent(_ref) { var interaction = _ref.interaction, event = _ref.event; if (interaction.interactable) { interaction.interactable.checkAndPreventDefault(event); } } function __install_21(scope) { /** @lends Interactable */ var Interactable = scope.Interactable; /** * Returns or sets whether to prevent the browser's default behaviour in * response to pointer events. Can be set to: * - `'always'` to always prevent * - `'never'` to never prevent * - `'auto'` to let interact.js try to determine what would be best * * @param {string} [newValue] `'always'`, `'never'` or `'auto'` * @return {string | Interactable} The current setting or this Interactable */ Interactable.prototype.preventDefault = function (newValue) { return preventDefault(this, newValue); }; Interactable.prototype.checkAndPreventDefault = function (event) { return checkAndPreventDefault(this, scope, event); }; var _arr = ['down', 'move', 'up', 'cancel']; for (var _i = 0; _i < _arr.length; _i++) { var eventSignal = _arr[_i]; scope.interactions.signals.on(eventSignal, onInteractionEvent); } // prevent native HTML5 drag on interact.js target elements scope.interactions.eventMap.dragstart = function preventNativeDrag(event) { for (var _i2 = 0; _i2 < scope.interactions.list.length; _i2++) { var _ref2; _ref2 = scope.interactions.list[_i2]; var interaction = _ref2; if (interaction.element && (interaction.element === event.target || (0, _$domUtils_50.nodeContains)(interaction.element, event.target))) { interaction.interactable.checkAndPreventDefault(event); return; } } }; } var ___default_21 = { id: 'core/interactablePreventDefault', install: __install_21 }; _$interactablePreventDefault_21["default"] = ___default_21; var _$devTools_25 = {}; "use strict"; Object.defineProperty(_$devTools_25, "__esModule", { value: true }); _$devTools_25["default"] = void 0; var ___domObjects_25 = ___interopRequireDefault_25(_$domObjects_49); /* removed: var _$domUtils_50 = require("@interactjs/utils/domUtils"); */; var ___extend_25 = ___interopRequireDefault_25(_$extend_52); var __is_25 = ___interopRequireWildcard_25(_$is_56); var ___window_25 = ___interopRequireDefault_25(_$window_65); function ___interopRequireWildcard_25(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_25(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___toConsumableArray_25(arr) { return ___arrayWithoutHoles_25(arr) || ___iterableToArray_25(arr) || ___nonIterableSpread_25(); } function ___nonIterableSpread_25() { throw new TypeError("Invalid attempt to spread non-iterable instance"); } function ___iterableToArray_25(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); } function ___arrayWithoutHoles_25(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } } var CheckName; (function (CheckName) { CheckName["touchAction"] = ""; CheckName["boxSizing"] = ""; CheckName["noListeners"] = ""; })(CheckName || (CheckName = {})); var prefix = '[interact.js] '; var links = { touchAction: 'https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action', boxSizing: 'https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing' }; var isProduction = "production" === 'production'; // eslint-disable-next-line no-restricted-syntax function __install_25(scope) { var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, logger = _ref.logger; var interactions = scope.interactions, Interactable = scope.Interactable, defaults = scope.defaults; logger = logger || console; interactions.signals.on('action-start', function (_ref2) { var interaction = _ref2.interaction; for (var _i = 0; _i < checks.length; _i++) { var _ref3; _ref3 = checks[_i]; var check = _ref3; var options = interaction.interactable && interaction.interactable.options[interaction.prepared.name]; if (!(options && options.devTools && options.devTools.ignore[check.name]) && check.perform(interaction)) { var _logger; (_logger = logger).warn.apply(_logger, [prefix + check.text].concat(___toConsumableArray_25(check.getInfo(interaction)))); } } }); defaults.base.devTools = { ignore: {} }; Interactable.prototype.devTools = function (options) { if (options) { (0, ___extend_25["default"])(this.options.devTools, options); return this; } return this.options.devTools; }; } var checks = [{ name: 'touchAction', perform: function perform(_ref4) { var element = _ref4.element; return !parentHasStyle(element, 'touchAction', /pan-|pinch|none/); }, getInfo: function getInfo(_ref5) { var element = _ref5.element; return [element, links.touchAction]; }, text: 'Consider adding CSS "touch-action: none" to this element\n' }, { name: 'boxSizing', perform: function perform(interaction) { var element = interaction.element; return interaction.prepared.name === 'resize' && element instanceof ___domObjects_25["default"].HTMLElement && !hasStyle(element, 'boxSizing', /border-box/); }, text: 'Consider adding CSS "box-sizing: border-box" to this resizable element', getInfo: function getInfo(_ref6) { var element = _ref6.element; return [element, links.boxSizing]; } }, { name: 'noListeners', perform: function perform(interaction) { var actionName = interaction.prepared.name; var moveListeners = interaction.interactable.events.types["".concat(actionName, "move")] || []; return !moveListeners.length; }, getInfo: function getInfo(interaction) { return [interaction.prepared.name, interaction.interactable]; }, text: 'There are no listeners set for this action' }]; function hasStyle(element, prop, styleRe) { return styleRe.test(element.style[prop] || ___window_25["default"].window.getComputedStyle(element)[prop]); } function parentHasStyle(element, prop, styleRe) { var parent = element; while (__is_25.element(parent)) { if (hasStyle(parent, prop, styleRe)) { return true; } parent = (0, _$domUtils_50.parentNode)(parent); } return false; } var __id_25 = 'dev-tools'; var defaultExport = isProduction ? { id: __id_25, install: function install() {} } : { id: __id_25, install: __install_25, checks: checks, CheckName: CheckName, links: links, prefix: prefix }; var ___default_25 = defaultExport; _$devTools_25["default"] = ___default_25; var _$base_30 = {}; "use strict"; Object.defineProperty(_$base_30, "__esModule", { value: true }); _$base_30.startAll = startAll; _$base_30.setAll = setAll; _$base_30.prepareStates = prepareStates; _$base_30.makeModifier = makeModifier; _$base_30["default"] = void 0; var ___extend_30 = ___interopRequireDefault_30(_$extend_52); function ___interopRequireDefault_30(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___slicedToArray_30(arr, i) { return ___arrayWithHoles_30(arr) || ___iterableToArrayLimit_30(arr, i) || ___nonIterableRest_30(); } function ___nonIterableRest_30() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } function ___iterableToArrayLimit_30(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function ___arrayWithHoles_30(arr) { if (Array.isArray(arr)) return arr; } function __install_30(scope) { var interactions = scope.interactions; scope.defaults.perAction.modifiers = []; scope.modifiers = {}; interactions.signals.on('new', function (_ref) { var interaction = _ref.interaction; interaction.modifiers = { startOffset: { left: 0, right: 0, top: 0, bottom: 0 }, offsets: {}, states: null, result: null, endPrevented: false, startDelta: null }; }); interactions.signals.on('before-action-start', function (arg) { __start_30(arg, arg.interaction.coords.start.page, scope.modifiers); }); interactions.signals.on('action-resume', function (arg) { stop(arg); __start_30(arg, arg.interaction.coords.cur.page, scope.modifiers); __beforeMove_30(arg); }); interactions.signals.on('after-action-move', restoreCoords); interactions.signals.on('before-action-move', __beforeMove_30); interactions.signals.on('before-action-start', setCoords); interactions.signals.on('after-action-start', restoreCoords); interactions.signals.on('before-action-end', beforeEnd); interactions.signals.on('stop', stop); } function __start_30(_ref2, pageCoords, registeredModifiers) { var interaction = _ref2.interaction, phase = _ref2.phase; var interactable = interaction.interactable, element = interaction.element; var modifierList = getModifierList(interaction, registeredModifiers); var states = prepareStates(modifierList); var rect = (0, ___extend_30["default"])({}, interaction.rect); if (!('width' in rect)) { rect.width = rect.right - rect.left; } if (!('height' in rect)) { rect.height = rect.bottom - rect.top; } var startOffset = getRectOffset(rect, pageCoords); interaction.modifiers.startOffset = startOffset; interaction.modifiers.startDelta = { x: 0, y: 0 }; var arg = { interaction: interaction, interactable: interactable, element: element, pageCoords: pageCoords, phase: phase, rect: rect, startOffset: startOffset, states: states, preEnd: false, requireEndOnly: false }; interaction.modifiers.states = states; interaction.modifiers.result = null; startAll(arg); arg.pageCoords = (0, ___extend_30["default"])({}, interaction.coords.start.page); var result = interaction.modifiers.result = setAll(arg); return result; } function startAll(arg) { for (var _i = 0; _i < arg.states.length; _i++) { var _ref3; _ref3 = arg.states[_i]; var state = _ref3; if (state.methods.start) { arg.state = state; state.methods.start(arg); } } } function setAll(arg) { var interaction = arg.interaction, _arg$modifiersState = arg.modifiersState, modifiersState = _arg$modifiersState === void 0 ? interaction.modifiers : _arg$modifiersState, _arg$prevCoords = arg.prevCoords, prevCoords = _arg$prevCoords === void 0 ? modifiersState.result ? modifiersState.result.coords : interaction.coords.prev.page : _arg$prevCoords, phase = arg.phase, preEnd = arg.preEnd, requireEndOnly = arg.requireEndOnly, rect = arg.rect, skipModifiers = arg.skipModifiers; var states = skipModifiers ? arg.states.slice(skipModifiers) : arg.states; arg.coords = (0, ___extend_30["default"])({}, arg.pageCoords); arg.rect = (0, ___extend_30["default"])({}, rect); var result = { delta: { x: 0, y: 0 }, rectDelta: { left: 0, right: 0, top: 0, bottom: 0 }, coords: arg.coords, changed: true }; for (var _i2 = 0; _i2 < states.length; _i2++) { var _ref4; _ref4 = states[_i2]; var state = _ref4; var options = state.options; if (!state.methods.set || !shouldDo(options, preEnd, requireEndOnly, phase)) { continue; } arg.state = state; state.methods.set(arg); } result.delta.x = arg.coords.x - arg.pageCoords.x; result.delta.y = arg.coords.y - arg.pageCoords.y; var rectChanged = false; if (rect) { result.rectDelta.left = arg.rect.left - rect.left; result.rectDelta.right = arg.rect.right - rect.right; result.rectDelta.top = arg.rect.top - rect.top; result.rectDelta.bottom = arg.rect.bottom - rect.bottom; rectChanged = result.rectDelta.left !== 0 || result.rectDelta.right !== 0 || result.rectDelta.top !== 0 || result.rectDelta.bottom !== 0; } result.changed = prevCoords.x !== result.coords.x || prevCoords.y !== result.coords.y || rectChanged; return result; } function __beforeMove_30(arg) { var interaction = arg.interaction, phase = arg.phase, preEnd = arg.preEnd, skipModifiers = arg.skipModifiers; var interactable = interaction.interactable, element = interaction.element; var modifierResult = setAll({ interaction: interaction, interactable: interactable, element: element, preEnd: preEnd, phase: phase, pageCoords: interaction.coords.cur.page, rect: interaction.rect, states: interaction.modifiers.states, requireEndOnly: false, skipModifiers: skipModifiers }); interaction.modifiers.result = modifierResult; // don't fire an action move if a modifier would keep the event in the same // cordinates as before if (!modifierResult.changed && interaction.interacting()) { return false; } setCoords(arg); } function beforeEnd(arg) { var interaction = arg.interaction, event = arg.event, noPreEnd = arg.noPreEnd; var states = interaction.modifiers.states; if (noPreEnd || !states || !states.length) { return; } var didPreEnd = false; for (var _i3 = 0; _i3 < states.length; _i3++) { var _ref5; _ref5 = states[_i3]; var state = _ref5; arg.state = state; var options = state.options, methods = state.methods; var endResult = methods.beforeEnd && methods.beforeEnd(arg); if (endResult === false) { interaction.modifiers.endPrevented = true; return false; } // if the endOnly option is true for any modifier if (!didPreEnd && shouldDo(options, true, true)) { // fire a move event at the modified coordinates interaction.move({ event: event, preEnd: true }); didPreEnd = true; } } } function stop(arg) { var interaction = arg.interaction; var states = interaction.modifiers.states; if (!states || !states.length) { return; } var modifierArg = (0, ___extend_30["default"])({ states: states, interactable: interaction.interactable, element: interaction.element }, arg); restoreCoords(arg); for (var _i4 = 0; _i4 < states.length; _i4++) { var _ref6; _ref6 = states[_i4]; var state = _ref6; modifierArg.state = state; if (state.methods.stop) { state.methods.stop(modifierArg); } } arg.interaction.modifiers.states = null; arg.interaction.modifiers.endPrevented = false; } function getModifierList(interaction, registeredModifiers) { var actionOptions = interaction.interactable.options[interaction.prepared.name]; var actionModifiers = actionOptions.modifiers; if (actionModifiers && actionModifiers.length) { return actionModifiers.filter(function (modifier) { return !modifier.options || modifier.options.enabled !== false; }).map(function (modifier) { if (!modifier.methods && modifier.type) { return registeredModifiers[modifier.type](modifier); } return modifier; }); } return ['snap', 'snapSize', 'snapEdges', 'restrict', 'restrictEdges', 'restrictSize'].map(function (type) { var options = actionOptions[type]; return options && options.enabled && { options: options, methods: options._methods }; }).filter(function (m) { return !!m; }); } function prepareStates(modifierList) { var states = []; for (var index = 0; index < modifierList.length; index++) { var _modifierList$index = modifierList[index], options = _modifierList$index.options, methods = _modifierList$index.methods, name = _modifierList$index.name; if (options && options.enabled === false) { continue; } var state = { options: options, methods: methods, index: index, name: name }; states.push(state); } return states; } function setCoords(arg) { var interaction = arg.interaction, phase = arg.phase; var curCoords = arg.curCoords || interaction.coords.cur; var startCoords = arg.startCoords || interaction.coords.start; var _interaction$modifier = interaction.modifiers, result = _interaction$modifier.result, startDelta = _interaction$modifier.startDelta; var curDelta = result.delta; if (phase === 'start') { (0, ___extend_30["default"])(interaction.modifiers.startDelta, result.delta); } var _arr = [[startCoords, startDelta], [curCoords, curDelta]]; for (var _i5 = 0; _i5 < _arr.length; _i5++) { var _arr$_i = ___slicedToArray_30(_arr[_i5], 2), coordsSet = _arr$_i[0], delta = _arr$_i[1]; coordsSet.page.x += delta.x; coordsSet.page.y += delta.y; coordsSet.client.x += delta.x; coordsSet.client.y += delta.y; } var rectDelta = interaction.modifiers.result.rectDelta; var rect = arg.rect || interaction.rect; rect.left += rectDelta.left; rect.right += rectDelta.right; rect.top += rectDelta.top; rect.bottom += rectDelta.bottom; rect.width = rect.right - rect.left; rect.height = rect.bottom - rect.top; } function restoreCoords(_ref7) { var _ref7$interaction = _ref7.interaction, coords = _ref7$interaction.coords, rect = _ref7$interaction.rect, modifiers = _ref7$interaction.modifiers; if (!modifiers.result) { return; } var startDelta = modifiers.startDelta; var _modifiers$result = modifiers.result, curDelta = _modifiers$result.delta, rectDelta = _modifiers$result.rectDelta; var coordsAndDeltas = [[coords.start, startDelta], [coords.cur, curDelta]]; for (var _i6 = 0; _i6 < coordsAndDeltas.length; _i6++) { var _coordsAndDeltas$_i = ___slicedToArray_30(coordsAndDeltas[_i6], 2), coordsSet = _coordsAndDeltas$_i[0], delta = _coordsAndDeltas$_i[1]; coordsSet.page.x -= delta.x; coordsSet.page.y -= delta.y; coordsSet.client.x -= delta.x; coordsSet.client.y -= delta.y; } rect.left -= rectDelta.left; rect.right -= rectDelta.right; rect.top -= rectDelta.top; rect.bottom -= rectDelta.bottom; } function shouldDo(options, preEnd, requireEndOnly, phase) { return options ? options.enabled !== false && (preEnd || !options.endOnly) && (!requireEndOnly || options.endOnly || options.alwaysOnEnd) && (options.setStart || phase !== 'start') : !requireEndOnly; } function getRectOffset(rect, coords) { return rect ? { left: coords.x - rect.left, top: coords.y - rect.top, right: rect.right - coords.x, bottom: rect.bottom - coords.y } : { left: 0, top: 0, right: 0, bottom: 0 }; } function makeModifier(module, name) { var defaults = module.defaults; var methods = { start: module.start, set: module.set, beforeEnd: module.beforeEnd, stop: module.stop }; var modifier = function modifier(options) { options = options || {}; options.enabled = options.enabled !== false; // add missing defaults to options for (var prop in defaults) { if (!(prop in options)) { options[prop] = defaults[prop]; } } return { options: options, methods: methods, name: name }; }; if (typeof name === 'string') { // for backwrads compatibility modifier._defaults = defaults; modifier._methods = methods; } return modifier; } var ___default_30 = { id: 'modifiers/base', install: __install_30, startAll: startAll, setAll: setAll, prepareStates: prepareStates, start: __start_30, beforeMove: __beforeMove_30, beforeEnd: beforeEnd, stop: stop, shouldDo: shouldDo, getModifierList: getModifierList, getRectOffset: getRectOffset, makeModifier: makeModifier }; _$base_30["default"] = ___default_30; var _$inertia_26 = {}; "use strict"; Object.defineProperty(_$inertia_26, "__esModule", { value: true }); _$inertia_26["default"] = void 0; /* removed: var _$InteractEvent_15 = require("@interactjs/core/InteractEvent"); */; var ___base_26 = ___interopRequireDefault_26(_$base_30); var __utils_26 = ___interopRequireWildcard_26(_$utils_55); var ___raf_26 = ___interopRequireDefault_26(_$raf_61); function ___interopRequireWildcard_26(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_26(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } _$InteractEvent_15.EventPhase.Resume = 'resume'; _$InteractEvent_15.EventPhase.InertiaStart = 'inertiastart'; function __install_26(scope) { var interactions = scope.interactions, defaults = scope.defaults; interactions.signals.on('new', function (_ref) { var interaction = _ref.interaction; interaction.inertia = { active: false, smoothEnd: false, allowResume: false, upCoords: {}, timeout: null }; }); // FIXME proper signal typing interactions.signals.on('before-action-end', function (arg) { return release(arg, scope); }); interactions.signals.on('down', function (arg) { return resume(arg, scope); }); interactions.signals.on('stop', function (arg) { return __stop_26(arg); }); defaults.perAction.inertia = { enabled: false, resistance: 10, minSpeed: 100, endSpeed: 10, allowResume: true, smoothEndDuration: 300 }; scope.usePlugin(___base_26["default"]); } function resume(_ref2, scope) { var interaction = _ref2.interaction, event = _ref2.event, pointer = _ref2.pointer, eventTarget = _ref2.eventTarget; var state = interaction.inertia; // Check if the down event hits the current inertia target if (state.active) { var element = eventTarget; // climb up the DOM tree from the event target while (__utils_26.is.element(element)) { // if interaction element is the current inertia target element if (element === interaction.element) { // stop inertia ___raf_26["default"].cancel(state.timeout); state.active = false; interaction.simulation = null; // update pointers to the down event's coordinates interaction.updatePointer(pointer, event, eventTarget, true); __utils_26.pointer.setCoords(interaction.coords.cur, interaction.pointers.map(function (p) { return p.pointer; }), interaction._now()); // fire appropriate signals var signalArg = { interaction: interaction }; scope.interactions.signals.fire('action-resume', signalArg); // fire a reume event var resumeEvent = new scope.InteractEvent(interaction, event, interaction.prepared.name, _$InteractEvent_15.EventPhase.Resume, interaction.element); interaction._fireEvent(resumeEvent); __utils_26.pointer.copyCoords(interaction.coords.prev, interaction.coords.cur); break; } element = __utils_26.dom.parentNode(element); } } } function release(_ref3, scope) { var interaction = _ref3.interaction, event = _ref3.event, noPreEnd = _ref3.noPreEnd; var state = interaction.inertia; if (!interaction.interacting() || interaction.simulation && interaction.simulation.active || noPreEnd) { return null; } var options = __getOptions_26(interaction); var now = interaction._now(); var velocityClient = interaction.coords.velocity.client; var pointerSpeed = __utils_26.hypot(velocityClient.x, velocityClient.y); var smoothEnd = false; var modifierResult; // check if inertia should be started var inertiaPossible = options && options.enabled && interaction.prepared.name !== 'gesture' && event !== state.startEvent; var inertia = inertiaPossible && now - interaction.coords.cur.timeStamp < 50 && pointerSpeed > options.minSpeed && pointerSpeed > options.endSpeed; var modifierArg = { interaction: interaction, pageCoords: __utils_26.extend({}, interaction.coords.cur.page), states: inertiaPossible && interaction.modifiers.states.map(function (modifierStatus) { return __utils_26.extend({}, modifierStatus); }), preEnd: true, prevCoords: undefined, requireEndOnly: null }; // smoothEnd if (inertiaPossible && !inertia) { modifierArg.prevCoords = interaction.prevEvent.page; modifierArg.requireEndOnly = false; modifierResult = ___base_26["default"].setAll(modifierArg); if (modifierResult.changed) { smoothEnd = true; } } if (!(inertia || smoothEnd)) { return null; } __utils_26.pointer.copyCoords(state.upCoords, interaction.coords.cur); interaction.pointers[0].pointer = state.startEvent = new scope.InteractEvent(interaction, event, // FIXME add proper typing Action.name interaction.prepared.name, _$InteractEvent_15.EventPhase.InertiaStart, interaction.element); state.t0 = now; state.active = true; state.allowResume = options.allowResume; interaction.simulation = state; interaction.interactable.fire(state.startEvent); if (inertia) { state.vx0 = interaction.coords.velocity.client.x; state.vy0 = interaction.coords.velocity.client.y; state.v0 = pointerSpeed; calcInertia(interaction, state); __utils_26.extend(modifierArg.pageCoords, interaction.coords.cur.page); modifierArg.pageCoords.x += state.xe; modifierArg.pageCoords.y += state.ye; modifierArg.prevCoords = undefined; modifierArg.requireEndOnly = true; modifierResult = ___base_26["default"].setAll(modifierArg); state.modifiedXe += modifierResult.delta.x; state.modifiedYe += modifierResult.delta.y; state.timeout = ___raf_26["default"].request(function () { return inertiaTick(interaction); }); } else { state.smoothEnd = true; state.xe = modifierResult.delta.x; state.ye = modifierResult.delta.y; state.sx = state.sy = 0; state.timeout = ___raf_26["default"].request(function () { return smothEndTick(interaction); }); } return false; } function __stop_26(_ref4) { var interaction = _ref4.interaction; var state = interaction.inertia; if (state.active) { ___raf_26["default"].cancel(state.timeout); state.active = false; interaction.simulation = null; } } function calcInertia(interaction, state) { var options = __getOptions_26(interaction); var lambda = options.resistance; var inertiaDur = -Math.log(options.endSpeed / state.v0) / lambda; state.x0 = interaction.prevEvent.page.x; state.y0 = interaction.prevEvent.page.y; state.t0 = state.startEvent.timeStamp / 1000; state.sx = state.sy = 0; state.modifiedXe = state.xe = (state.vx0 - inertiaDur) / lambda; state.modifiedYe = state.ye = (state.vy0 - inertiaDur) / lambda; state.te = inertiaDur; state.lambda_v0 = lambda / state.v0; state.one_ve_v0 = 1 - options.endSpeed / state.v0; } function inertiaTick(interaction) { updateInertiaCoords(interaction); __utils_26.pointer.setCoordDeltas(interaction.coords.delta, interaction.coords.prev, interaction.coords.cur); __utils_26.pointer.setCoordVelocity(interaction.coords.velocity, interaction.coords.delta); var state = interaction.inertia; var options = __getOptions_26(interaction); var lambda = options.resistance; var t = interaction._now() / 1000 - state.t0; if (t < state.te) { var progress = 1 - (Math.exp(-lambda * t) - state.lambda_v0) / state.one_ve_v0; if (state.modifiedXe === state.xe && state.modifiedYe === state.ye) { state.sx = state.xe * progress; state.sy = state.ye * progress; } else { var quadPoint = __utils_26.getQuadraticCurvePoint(0, 0, state.xe, state.ye, state.modifiedXe, state.modifiedYe, progress); state.sx = quadPoint.x; state.sy = quadPoint.y; } interaction.move(); state.timeout = ___raf_26["default"].request(function () { return inertiaTick(interaction); }); } else { state.sx = state.modifiedXe; state.sy = state.modifiedYe; interaction.move(); interaction.end(state.startEvent); state.active = false; interaction.simulation = null; } __utils_26.pointer.copyCoords(interaction.coords.prev, interaction.coords.cur); } function smothEndTick(interaction) { updateInertiaCoords(interaction); var state = interaction.inertia; var t = interaction._now() - state.t0; var _getOptions = __getOptions_26(interaction), duration = _getOptions.smoothEndDuration; if (t < duration) { state.sx = __utils_26.easeOutQuad(t, 0, state.xe, duration); state.sy = __utils_26.easeOutQuad(t, 0, state.ye, duration); interaction.move(); state.timeout = ___raf_26["default"].request(function () { return smothEndTick(interaction); }); } else { state.sx = state.xe; state.sy = state.ye; interaction.move(); interaction.end(state.startEvent); state.smoothEnd = state.active = false; interaction.simulation = null; } } function updateInertiaCoords(interaction) { var state = interaction.inertia; // return if inertia isn't running if (!state.active) { return; } var pageUp = state.upCoords.page; var clientUp = state.upCoords.client; __utils_26.pointer.setCoords(interaction.coords.cur, [{ pageX: pageUp.x + state.sx, pageY: pageUp.y + state.sy, clientX: clientUp.x + state.sx, clientY: clientUp.y + state.sy }], interaction._now()); } function __getOptions_26(_ref5) { var interactable = _ref5.interactable, prepared = _ref5.prepared; return interactable && interactable.options && prepared.name && interactable.options[prepared.name].inertia; } var ___default_26 = { id: 'inertia', install: __install_26, calcInertia: calcInertia, inertiaTick: inertiaTick, smothEndTick: smothEndTick, updateInertiaCoords: updateInertiaCoords }; _$inertia_26["default"] = ___default_26; var _$pointer_33 = {}; "use strict"; Object.defineProperty(_$pointer_33, "__esModule", { value: true }); _$pointer_33["default"] = void 0; var __is_33 = ___interopRequireWildcard_33(_$is_56); var ___rect_33 = ___interopRequireDefault_33(_$rect_62); function ___interopRequireDefault_33(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_33(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __start_33(_ref) { var rect = _ref.rect, startOffset = _ref.startOffset, state = _ref.state; var options = state.options; var elementRect = options.elementRect; var offset = {}; if (rect && elementRect) { offset.left = startOffset.left - rect.width * elementRect.left; offset.top = startOffset.top - rect.height * elementRect.top; offset.right = startOffset.right - rect.width * (1 - elementRect.right); offset.bottom = startOffset.bottom - rect.height * (1 - elementRect.bottom); } else { offset.left = offset.top = offset.right = offset.bottom = 0; } state.offset = offset; } function set(_ref2) { var coords = _ref2.coords, interaction = _ref2.interaction, state = _ref2.state; var options = state.options, offset = state.offset; var restriction = getRestrictionRect(options.restriction, interaction, coords); if (!restriction) { return state; } var rect = restriction; // object is assumed to have // x, y, width, height or // left, top, right, bottom if ('x' in restriction && 'y' in restriction) { coords.x = Math.max(Math.min(rect.x + rect.width - offset.right, coords.x), rect.x + offset.left); coords.y = Math.max(Math.min(rect.y + rect.height - offset.bottom, coords.y), rect.y + offset.top); } else { coords.x = Math.max(Math.min(rect.right - offset.right, coords.x), rect.left + offset.left); coords.y = Math.max(Math.min(rect.bottom - offset.bottom, coords.y), rect.top + offset.top); } } function getRestrictionRect(value, interaction, coords) { if (__is_33.func(value)) { return ___rect_33["default"].resolveRectLike(value, interaction.interactable, interaction.element, [coords.x, coords.y, interaction]); } else { return ___rect_33["default"].resolveRectLike(value, interaction.interactable, interaction.element); } } var restrict = { start: __start_33, set: set, getRestrictionRect: getRestrictionRect, defaults: { enabled: false, restriction: null, elementRect: null } }; var ___default_33 = restrict; _$pointer_33["default"] = ___default_33; var _$edges_32 = {}; "use strict"; Object.defineProperty(_$edges_32, "__esModule", { value: true }); _$edges_32["default"] = void 0; var ___extend_32 = ___interopRequireDefault_32(_$extend_52); var ___rect_32 = ___interopRequireDefault_32(_$rect_62); var _pointer = ___interopRequireDefault_32(_$pointer_33); function ___interopRequireDefault_32(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } // This module adds the options.resize.restrictEdges setting which sets min and // max for the top, left, bottom and right edges of the target being resized. // // interact(target).resize({ // edges: { top: true, left: true }, // restrictEdges: { // inner: { top: 200, left: 200, right: 400, bottom: 400 }, // outer: { top: 0, left: 0, right: 600, bottom: 600 }, // }, // }) var __getRestrictionRect_32 = _pointer["default"].getRestrictionRect; var noInner = { top: +Infinity, left: +Infinity, bottom: -Infinity, right: -Infinity }; var noOuter = { top: -Infinity, left: -Infinity, bottom: +Infinity, right: +Infinity }; function __start_32(_ref) { var interaction = _ref.interaction, state = _ref.state; var options = state.options; var startOffset = interaction.modifiers.startOffset; var offset; if (options) { var offsetRect = __getRestrictionRect_32(options.offset, interaction, interaction.coords.start.page); offset = ___rect_32["default"].rectToXY(offsetRect); } offset = offset || { x: 0, y: 0 }; state.offset = { top: offset.y + startOffset.top, left: offset.x + startOffset.left, bottom: offset.y - startOffset.bottom, right: offset.x - startOffset.right }; } function __set_32(_ref2) { var coords = _ref2.coords, interaction = _ref2.interaction, state = _ref2.state; var offset = state.offset, options = state.options; var edges = interaction.prepared._linkedEdges || interaction.prepared.edges; if (!edges) { return; } var page = (0, ___extend_32["default"])({}, coords); var inner = __getRestrictionRect_32(options.inner, interaction, page) || {}; var outer = __getRestrictionRect_32(options.outer, interaction, page) || {}; fixRect(inner, noInner); fixRect(outer, noOuter); if (edges.top) { coords.y = Math.min(Math.max(outer.top + offset.top, page.y), inner.top + offset.top); } else if (edges.bottom) { coords.y = Math.max(Math.min(outer.bottom + offset.bottom, page.y), inner.bottom + offset.bottom); } if (edges.left) { coords.x = Math.min(Math.max(outer.left + offset.left, page.x), inner.left + offset.left); } else if (edges.right) { coords.x = Math.max(Math.min(outer.right + offset.right, page.x), inner.right + offset.right); } } function fixRect(rect, defaults) { var _arr = ['top', 'left', 'bottom', 'right']; for (var _i = 0; _i < _arr.length; _i++) { var edge = _arr[_i]; if (!(edge in rect)) { rect[edge] = defaults[edge]; } } return rect; } var restrictEdges = { noInner: noInner, noOuter: noOuter, getRestrictionRect: __getRestrictionRect_32, start: __start_32, set: __set_32, defaults: { enabled: false, inner: null, outer: null, offset: null } }; var ___default_32 = restrictEdges; _$edges_32["default"] = ___default_32; var _$size_34 = {}; "use strict"; Object.defineProperty(_$size_34, "__esModule", { value: true }); _$size_34["default"] = void 0; var ___extend_34 = ___interopRequireDefault_34(_$extend_52); var ___rect_34 = ___interopRequireDefault_34(_$rect_62); var _edges = ___interopRequireDefault_34(_$edges_32); function ___interopRequireDefault_34(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } // This module adds the options.resize.restrictSize setting which sets min and // max width and height for the target being resized. // // interact(target).resize({ // edges: { top: true, left: true }, // restrictSize: { // min: { width: -600, height: -600 }, // max: { width: 600, height: 600 }, // }, // }) var noMin = { width: -Infinity, height: -Infinity }; var noMax = { width: +Infinity, height: +Infinity }; function __start_34(arg) { return _edges["default"].start(arg); } function __set_34(arg) { var interaction = arg.interaction, state = arg.state; var options = state.options; var edges = interaction.prepared.linkedEdges || interaction.prepared.edges; if (!edges) { return; } var rect = ___rect_34["default"].xywhToTlbr(interaction.resizeRects.inverted); var minSize = ___rect_34["default"].tlbrToXywh(_edges["default"].getRestrictionRect(options.min, interaction)) || noMin; var maxSize = ___rect_34["default"].tlbrToXywh(_edges["default"].getRestrictionRect(options.max, interaction)) || noMax; state.options = { enabled: options.enabled, endOnly: options.endOnly, inner: (0, ___extend_34["default"])({}, _edges["default"].noInner), outer: (0, ___extend_34["default"])({}, _edges["default"].noOuter) }; if (edges.top) { state.options.inner.top = rect.bottom - minSize.height; state.options.outer.top = rect.bottom - maxSize.height; } else if (edges.bottom) { state.options.inner.bottom = rect.top + minSize.height; state.options.outer.bottom = rect.top + maxSize.height; } if (edges.left) { state.options.inner.left = rect.right - minSize.width; state.options.outer.left = rect.right - maxSize.width; } else if (edges.right) { state.options.inner.right = rect.left + minSize.width; state.options.outer.right = rect.left + maxSize.width; } _edges["default"].set(arg); state.options = options; } var restrictSize = { start: __start_34, set: __set_34, defaults: { enabled: false, min: null, max: null } }; var ___default_34 = restrictSize; _$size_34["default"] = ___default_34; var _$pointer_36 = {}; "use strict"; Object.defineProperty(_$pointer_36, "__esModule", { value: true }); _$pointer_36["default"] = void 0; var __utils_36 = ___interopRequireWildcard_36(_$utils_55); function ___interopRequireWildcard_36(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __start_36(arg) { var interaction = arg.interaction, interactable = arg.interactable, element = arg.element, rect = arg.rect, state = arg.state, startOffset = arg.startOffset; var options = state.options; var offsets = []; var origin = options.offsetWithOrigin ? getOrigin(arg) : { x: 0, y: 0 }; var snapOffset; if (options.offset === 'startCoords') { snapOffset = { x: interaction.coords.start.page.x, y: interaction.coords.start.page.y }; } else { var offsetRect = __utils_36.rect.resolveRectLike(options.offset, interactable, element, [interaction]); snapOffset = __utils_36.rect.rectToXY(offsetRect) || { x: 0, y: 0 }; snapOffset.x += origin.x; snapOffset.y += origin.y; } var relativePoints = options.relativePoints || []; if (rect && options.relativePoints && options.relativePoints.length) { for (var index = 0; index < relativePoints.length; index++) { var relativePoint = relativePoints[index]; offsets.push({ index: index, relativePoint: relativePoint, x: startOffset.left - rect.width * relativePoint.x + snapOffset.x, y: startOffset.top - rect.height * relativePoint.y + snapOffset.y }); } } else { offsets.push(__utils_36.extend({ index: 0, relativePoint: null }, snapOffset)); } state.offsets = offsets; } function __set_36(arg) { var interaction = arg.interaction, coords = arg.coords, state = arg.state; var options = state.options, offsets = state.offsets; var origin = __utils_36.getOriginXY(interaction.interactable, interaction.element, interaction.prepared.name); var page = __utils_36.extend({}, coords); var targets = []; var target; if (!options.offsetWithOrigin) { page.x -= origin.x; page.y -= origin.y; } state.realX = page.x; state.realY = page.y; for (var _i = 0; _i < offsets.length; _i++) { var _ref; _ref = offsets[_i]; var offset = _ref; var relativeX = page.x - offset.x; var relativeY = page.y - offset.y; for (var index = 0, _len = options.targets.length; index < _len; index++) { var snapTarget = options.targets[index]; if (__utils_36.is.func(snapTarget)) { target = snapTarget(relativeX, relativeY, interaction, offset, index); } else { target = snapTarget; } if (!target) { continue; } targets.push({ x: (__utils_36.is.number(target.x) ? target.x : relativeX) + offset.x, y: (__utils_36.is.number(target.y) ? target.y : relativeY) + offset.y, range: __utils_36.is.number(target.range) ? target.range : options.range }); } } var closest = { target: null, inRange: false, distance: 0, range: 0, dx: 0, dy: 0 }; for (var i = 0, len = targets.length; i < len; i++) { target = targets[i]; var range = target.range; var dx = target.x - page.x; var dy = target.y - page.y; var distance = __utils_36.hypot(dx, dy); var inRange = distance <= range; // Infinite targets count as being out of range // compared to non infinite ones that are in range if (range === Infinity && closest.inRange && closest.range !== Infinity) { inRange = false; } if (!closest.target || (inRange // is the closest target in range? ? closest.inRange && range !== Infinity // the pointer is relatively deeper in this target ? distance / range < closest.distance / closest.range // this target has Infinite range and the closest doesn't : range === Infinity && closest.range !== Infinity || // OR this target is closer that the previous closest distance < closest.distance : // The other is not in range and the pointer is closer to this target !closest.inRange && distance < closest.distance)) { closest.target = target; closest.distance = distance; closest.range = range; closest.inRange = inRange; closest.dx = dx; closest.dy = dy; state.range = range; } } if (closest.inRange) { coords.x = closest.target.x; coords.y = closest.target.y; } state.closest = closest; } function getOrigin(arg) { var optionsOrigin = __utils_36.rect.rectToXY(__utils_36.rect.resolveRectLike(arg.state.options.origin)); var origin = optionsOrigin || __utils_36.getOriginXY(arg.interactable, arg.interaction.element, arg.interaction.prepared.name); return origin; } var snap = { start: __start_36, set: __set_36, defaults: { enabled: false, range: Infinity, targets: null, offset: null, offsetWithOrigin: true, relativePoints: null } }; var ___default_36 = snap; _$pointer_36["default"] = ___default_36; var _$size_37 = {}; "use strict"; Object.defineProperty(_$size_37, "__esModule", { value: true }); _$size_37["default"] = void 0; var ___extend_37 = ___interopRequireDefault_37(_$extend_52); var __is_37 = ___interopRequireWildcard_37(_$is_56); var ___pointer_37 = ___interopRequireDefault_37(_$pointer_36); function ___interopRequireWildcard_37(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___interopRequireDefault_37(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___slicedToArray_37(arr, i) { return ___arrayWithHoles_37(arr) || ___iterableToArrayLimit_37(arr, i) || ___nonIterableRest_37(); } function ___nonIterableRest_37() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } function ___iterableToArrayLimit_37(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function ___arrayWithHoles_37(arr) { if (Array.isArray(arr)) return arr; } function __start_37(arg) { var interaction = arg.interaction, state = arg.state; var options = state.options; var edges = interaction.prepared.edges; if (!edges) { return null; } arg.state = { options: { relativePoints: [{ x: edges.left ? 0 : 1, y: edges.top ? 0 : 1 }], origin: { x: 0, y: 0 }, offset: options.offset || 'self', range: options.range } }; state.targetFields = state.targetFields || [['width', 'height'], ['x', 'y']]; ___pointer_37["default"].start(arg); state.offsets = arg.state.offsets; arg.state = state; } function __set_37(arg) { var interaction = arg.interaction, state = arg.state, coords = arg.coords; var options = state.options, offsets = state.offsets; var relative = { x: coords.x - offsets[0].x, y: coords.y - offsets[0].y }; state.options = (0, ___extend_37["default"])({}, options); state.options.targets = []; for (var _i = 0; _i < (options.targets || []).length; _i++) { var _ref; _ref = (options.targets || [])[_i]; var snapTarget = _ref; var target = void 0; if (__is_37.func(snapTarget)) { target = snapTarget(relative.x, relative.y, interaction); } else { target = snapTarget; } if (!target) { continue; } for (var _i2 = 0; _i2 < state.targetFields.length; _i2++) { var _ref2; _ref2 = state.targetFields[_i2]; var _ref3 = _ref2, _ref4 = ___slicedToArray_37(_ref3, 2), xField = _ref4[0], yField = _ref4[1]; if (xField in target || yField in target) { target.x = target[xField]; target.y = target[yField]; break; } } state.options.targets.push(target); } ___pointer_37["default"].set(arg); state.options = options; } var snapSize = { start: __start_37, set: __set_37, defaults: { enabled: false, range: Infinity, targets: null, offset: null } }; var ___default_37 = snapSize; _$size_37["default"] = ___default_37; var _$edges_35 = {}; "use strict"; Object.defineProperty(_$edges_35, "__esModule", { value: true }); _$edges_35["default"] = void 0; var ___clone_35 = ___interopRequireDefault_35(_$clone_48); var ___extend_35 = ___interopRequireDefault_35(_$extend_52); var _size = ___interopRequireDefault_35(_$size_37); function ___interopRequireDefault_35(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } /** * @module modifiers/snapEdges * * @description * This module allows snapping of the edges of targets during resize * interactions. * * @example * interact(target).resizable({ * snapEdges: { * targets: [interact.snappers.grid({ x: 100, y: 50 })], * }, * }) * * interact(target).resizable({ * snapEdges: { * targets: [ * interact.snappers.grid({ * top: 50, * left: 50, * bottom: 100, * right: 100, * }), * ], * }, * }) */ function __start_35(arg) { var edges = arg.interaction.prepared.edges; if (!edges) { return null; } arg.state.targetFields = arg.state.targetFields || [[edges.left ? 'left' : 'right', edges.top ? 'top' : 'bottom']]; return _size["default"].start(arg); } function __set_35(arg) { return _size["default"].set(arg); } var snapEdges = { start: __start_35, set: __set_35, defaults: (0, ___extend_35["default"])((0, ___clone_35["default"])(_size["default"].defaults), { offset: { x: 0, y: 0 } }) }; var ___default_35 = snapEdges; _$edges_35["default"] = ___default_35; var _$modifiers_31 = {}; "use strict"; Object.defineProperty(_$modifiers_31, "__esModule", { value: true }); _$modifiers_31.restrictSize = _$modifiers_31.restrictEdges = _$modifiers_31.restrict = _$modifiers_31.snapEdges = _$modifiers_31.snapSize = _$modifiers_31.snap = void 0; var ___base_31 = ___interopRequireDefault_31(_$base_30); var ___edges_31 = ___interopRequireDefault_31(_$edges_32); var ___pointer_31 = ___interopRequireDefault_31(_$pointer_33); var ___size_31 = ___interopRequireDefault_31(_$size_34); var _edges2 = ___interopRequireDefault_31(_$edges_35); var _pointer2 = ___interopRequireDefault_31(_$pointer_36); var _size2 = ___interopRequireDefault_31(_$size_37); function ___interopRequireDefault_31(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } var __makeModifier_31 = ___base_31["default"].makeModifier; var __snap_31 = __makeModifier_31(_pointer2["default"], 'snap'); _$modifiers_31.snap = __snap_31; var __snapSize_31 = __makeModifier_31(_size2["default"], 'snapSize'); _$modifiers_31.snapSize = __snapSize_31; var __snapEdges_31 = __makeModifier_31(_edges2["default"], 'snapEdges'); _$modifiers_31.snapEdges = __snapEdges_31; var __restrict_31 = __makeModifier_31(___pointer_31["default"], 'restrict'); _$modifiers_31.restrict = __restrict_31; var __restrictEdges_31 = __makeModifier_31(___edges_31["default"], 'restrictEdges'); _$modifiers_31.restrictEdges = __restrictEdges_31; var __restrictSize_31 = __makeModifier_31(___size_31["default"], 'restrictSize'); _$modifiers_31.restrictSize = __restrictSize_31; var _$PointerEvent_38 = {}; "use strict"; Object.defineProperty(_$PointerEvent_38, "__esModule", { value: true }); _$PointerEvent_38["default"] = void 0; var ___BaseEvent2_38 = ___interopRequireDefault_38(_$BaseEvent_13); var ___pointerUtils_38 = ___interopRequireDefault_38(_$pointerUtils_60); function ___interopRequireDefault_38(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___typeof_38(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { ___typeof_38 = function _typeof(obj) { return typeof obj; }; } else { ___typeof_38 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return ___typeof_38(obj); } function ___classCallCheck_38(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function ___defineProperties_38(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); } } function ___createClass_38(Constructor, protoProps, staticProps) { if (protoProps) ___defineProperties_38(Constructor.prototype, protoProps); if (staticProps) ___defineProperties_38(Constructor, staticProps); return Constructor; } function ___possibleConstructorReturn_38(self, call) { if (call && (___typeof_38(call) === "object" || typeof call === "function")) { return call; } return ___assertThisInitialized_38(self); } function ___getPrototypeOf_38(o) { ___getPrototypeOf_38 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return ___getPrototypeOf_38(o); } function ___assertThisInitialized_38(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function ___inherits_38(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_38(subClass, superClass); } function ___setPrototypeOf_38(o, p) { ___setPrototypeOf_38 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return ___setPrototypeOf_38(o, p); } /** */ var PointerEvent = /*#__PURE__*/ function (_BaseEvent) { ___inherits_38(PointerEvent, _BaseEvent); /** */ function PointerEvent(type, pointer, event, eventTarget, interaction, timeStamp) { var _this; ___classCallCheck_38(this, PointerEvent); _this = ___possibleConstructorReturn_38(this, ___getPrototypeOf_38(PointerEvent).call(this, interaction)); ___pointerUtils_38["default"].pointerExtend(___assertThisInitialized_38(_this), event); if (event !== pointer) { ___pointerUtils_38["default"].pointerExtend(___assertThisInitialized_38(_this), pointer); } _this.timeStamp = timeStamp; _this.originalEvent = event; _this.type = type; _this.pointerId = ___pointerUtils_38["default"].getPointerId(pointer); _this.pointerType = ___pointerUtils_38["default"].getPointerType(pointer); _this.target = eventTarget; _this.currentTarget = null; if (type === 'tap') { var pointerIndex = interaction.getPointerIndex(pointer); _this.dt = _this.timeStamp - interaction.pointers[pointerIndex].downTime; var interval = _this.timeStamp - interaction.tapTime; _this["double"] = !!(interaction.prevTap && interaction.prevTap.type !== 'doubletap' && interaction.prevTap.target === _this.target && interval < 500); } else if (type === 'doubletap') { _this.dt = pointer.timeStamp - interaction.tapTime; } return _this; } ___createClass_38(PointerEvent, [{ key: "_subtractOrigin", value: function _subtractOrigin(_ref) { var originX = _ref.x, originY = _ref.y; this.pageX -= originX; this.pageY -= originY; this.clientX -= originX; this.clientY -= originY; return this; } }, { key: "_addOrigin", value: function _addOrigin(_ref2) { var originX = _ref2.x, originY = _ref2.y; this.pageX += originX; this.pageY += originY; this.clientX += originX; this.clientY += originY; return this; } /** * Prevent the default behaviour of the original Event */ }, { key: "preventDefault", value: function preventDefault() { this.originalEvent.preventDefault(); } }]); return PointerEvent; }(___BaseEvent2_38["default"]); _$PointerEvent_38["default"] = PointerEvent; var _$base_39 = {}; "use strict"; Object.defineProperty(_$base_39, "__esModule", { value: true }); _$base_39["default"] = void 0; var __utils_39 = ___interopRequireWildcard_39(_$utils_55); var _PointerEvent = ___interopRequireDefault_39(_$PointerEvent_38); function ___interopRequireDefault_39(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_39(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } var signals = new __utils_39.Signals(); var simpleSignals = ['down', 'up', 'cancel']; var simpleEvents = ['down', 'up', 'cancel']; var __defaults_39 = { holdDuration: 600, ignoreFrom: null, allowFrom: null, origin: { x: 0, y: 0 } }; var pointerEvents = { id: 'pointer-events/base', install: __install_39, signals: signals, PointerEvent: _PointerEvent["default"], fire: fire, collectEventTargets: collectEventTargets, createSignalListener: createSignalListener, defaults: __defaults_39, types: ['down', 'move', 'up', 'cancel', 'tap', 'doubletap', 'hold'] }; function fire(arg, scope) { var interaction = arg.interaction, pointer = arg.pointer, event = arg.event, eventTarget = arg.eventTarget, _arg$type = arg.type, type = _arg$type === void 0 ? arg.pointerEvent.type : _arg$type, _arg$targets = arg.targets, targets = _arg$targets === void 0 ? collectEventTargets(arg) : _arg$targets; var _arg$pointerEvent = arg.pointerEvent, pointerEvent = _arg$pointerEvent === void 0 ? new _PointerEvent["default"](type, pointer, event, eventTarget, interaction, scope.now()) : _arg$pointerEvent; var signalArg = { interaction: interaction, pointer: pointer, event: event, eventTarget: eventTarget, targets: targets, type: type, pointerEvent: pointerEvent }; for (var i = 0; i < targets.length; i++) { var target = targets[i]; for (var prop in target.props || {}) { pointerEvent[prop] = target.props[prop]; } var origin = __utils_39.getOriginXY(target.eventable, target.node); pointerEvent._subtractOrigin(origin); pointerEvent.eventable = target.eventable; pointerEvent.currentTarget = target.node; target.eventable.fire(pointerEvent); pointerEvent._addOrigin(origin); if (pointerEvent.immediatePropagationStopped || pointerEvent.propagationStopped && i + 1 < targets.length && targets[i + 1].node !== pointerEvent.currentTarget) { break; } } signals.fire('fired', signalArg); if (type === 'tap') { // if pointerEvent should make a double tap, create and fire a doubletap // PointerEvent and use that as the prevTap var prevTap = pointerEvent["double"] ? fire({ interaction: interaction, pointer: pointer, event: event, eventTarget: eventTarget, type: 'doubletap' }, scope) : pointerEvent; interaction.prevTap = prevTap; interaction.tapTime = prevTap.timeStamp; } return pointerEvent; } function collectEventTargets(_ref) { var interaction = _ref.interaction, pointer = _ref.pointer, event = _ref.event, eventTarget = _ref.eventTarget, type = _ref.type; var pointerIndex = interaction.getPointerIndex(pointer); var pointerInfo = interaction.pointers[pointerIndex]; // do not fire a tap event if the pointer was moved before being lifted if (type === 'tap' && (interaction.pointerWasMoved || // or if the pointerup target is different to the pointerdown target !(pointerInfo && pointerInfo.downTarget === eventTarget))) { return []; } var path = __utils_39.dom.getPath(eventTarget); var signalArg = { interaction: interaction, pointer: pointer, event: event, eventTarget: eventTarget, type: type, path: path, targets: [], node: null }; for (var _i = 0; _i < path.length; _i++) { var _ref2; _ref2 = path[_i]; var node = _ref2; signalArg.node = node; signals.fire('collect-targets', signalArg); } if (type === 'hold') { signalArg.targets = signalArg.targets.filter(function (target) { return target.eventable.options.holdDuration === interaction.pointers[pointerIndex].hold.duration; }); } return signalArg.targets; } function __install_39(scope) { var interactions = scope.interactions; scope.pointerEvents = pointerEvents; scope.defaults.actions.pointerEvents = pointerEvents.defaults; interactions.signals.on('new', function (_ref3) { var interaction = _ref3.interaction; interaction.prevTap = null; // the most recent tap event on this interaction interaction.tapTime = 0; // time of the most recent tap event }); interactions.signals.on('update-pointer', function (_ref4) { var down = _ref4.down, pointerInfo = _ref4.pointerInfo; if (!down && pointerInfo.hold) { return; } pointerInfo.hold = { duration: Infinity, timeout: null }; }); interactions.signals.on('move', function (_ref5) { var interaction = _ref5.interaction, pointer = _ref5.pointer, event = _ref5.event, eventTarget = _ref5.eventTarget, duplicateMove = _ref5.duplicateMove; var pointerIndex = interaction.getPointerIndex(pointer); if (!duplicateMove && (!interaction.pointerIsDown || interaction.pointerWasMoved)) { if (interaction.pointerIsDown) { clearTimeout(interaction.pointers[pointerIndex].hold.timeout); } fire({ interaction: interaction, pointer: pointer, event: event, eventTarget: eventTarget, type: 'move' }, scope); } }); interactions.signals.on('down', function (_ref6) { var interaction = _ref6.interaction, pointer = _ref6.pointer, event = _ref6.event, eventTarget = _ref6.eventTarget, pointerIndex = _ref6.pointerIndex; var timer = interaction.pointers[pointerIndex].hold; var path = __utils_39.dom.getPath(eventTarget); var signalArg = { interaction: interaction, pointer: pointer, event: event, eventTarget: eventTarget, type: 'hold', targets: [], path: path, element: null }; for (var _i2 = 0; _i2 < path.length; _i2++) { var _ref7; _ref7 = path[_i2]; var element = _ref7; signalArg.element = element; signals.fire('collect-targets', signalArg); } if (!signalArg.targets.length) { return; } var minDuration = Infinity; for (var _i3 = 0; _i3 < signalArg.targets.length; _i3++) { var _ref8; _ref8 = signalArg.targets[_i3]; var target = _ref8; var holdDuration = target.eventable.options.holdDuration; if (holdDuration < minDuration) { minDuration = holdDuration; } } timer.duration = minDuration; timer.timeout = setTimeout(function () { fire({ interaction: interaction, eventTarget: eventTarget, pointer: pointer, event: event, type: 'hold' }, scope); }, minDuration); }); var _arr = ['up', 'cancel']; for (var _i4 = 0; _i4 < _arr.length; _i4++) { var signalName = _arr[_i4]; interactions.signals.on(signalName, function (_ref10) { var interaction = _ref10.interaction, pointerIndex = _ref10.pointerIndex; if (interaction.pointers[pointerIndex].hold) { clearTimeout(interaction.pointers[pointerIndex].hold.timeout); } }); } for (var i = 0; i < simpleSignals.length; i++) { interactions.signals.on(simpleSignals[i], createSignalListener(simpleEvents[i], scope)); } interactions.signals.on('up', function (_ref9) { var interaction = _ref9.interaction, pointer = _ref9.pointer, event = _ref9.event, eventTarget = _ref9.eventTarget; if (!interaction.pointerWasMoved) { fire({ interaction: interaction, eventTarget: eventTarget, pointer: pointer, event: event, type: 'tap' }, scope); } }); } function createSignalListener(type, scope) { return function (_ref11) { var interaction = _ref11.interaction, pointer = _ref11.pointer, event = _ref11.event, eventTarget = _ref11.eventTarget; fire({ interaction: interaction, eventTarget: eventTarget, pointer: pointer, event: event, type: type }, scope); }; } var ___default_39 = pointerEvents; _$base_39["default"] = ___default_39; var _$holdRepeat_40 = {}; "use strict"; Object.defineProperty(_$holdRepeat_40, "__esModule", { value: true }); _$holdRepeat_40["default"] = void 0; var ___base_40 = ___interopRequireDefault_40(_$base_39); function ___interopRequireDefault_40(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function __install_40(scope) { var pointerEvents = scope.pointerEvents, interactions = scope.interactions; scope.usePlugin(___base_40["default"]); pointerEvents.signals.on('new', onNew); pointerEvents.signals.on('fired', function (arg) { return onFired(arg, scope); }); var _arr = ['move', 'up', 'cancel', 'endall']; for (var _i = 0; _i < _arr.length; _i++) { var signal = _arr[_i]; interactions.signals.on(signal, endHoldRepeat); } // don't repeat by default pointerEvents.defaults.holdRepeatInterval = 0; pointerEvents.types.push('holdrepeat'); } function onNew(_ref) { var pointerEvent = _ref.pointerEvent; if (pointerEvent.type !== 'hold') { return; } pointerEvent.count = (pointerEvent.count || 0) + 1; } function onFired(_ref2, scope) { var interaction = _ref2.interaction, pointerEvent = _ref2.pointerEvent, eventTarget = _ref2.eventTarget, targets = _ref2.targets; if (pointerEvent.type !== 'hold' || !targets.length) { return; } // get the repeat interval from the first eventable var interval = targets[0].eventable.options.holdRepeatInterval; // don't repeat if the interval is 0 or less if (interval <= 0) { return; } // set a timeout to fire the holdrepeat event interaction.holdIntervalHandle = setTimeout(function () { scope.pointerEvents.fire({ interaction: interaction, eventTarget: eventTarget, type: 'hold', pointer: pointerEvent, event: pointerEvent }, scope); }, interval); } function endHoldRepeat(_ref3) { var interaction = _ref3.interaction; // set the interaction's holdStopTime property // to stop further holdRepeat events if (interaction.holdIntervalHandle) { clearInterval(interaction.holdIntervalHandle); interaction.holdIntervalHandle = null; } } var ___default_40 = { id: 'pointer-events/holdRepeat', install: __install_40 }; _$holdRepeat_40["default"] = ___default_40; var _$interactableTargets_42 = {}; "use strict"; Object.defineProperty(_$interactableTargets_42, "__esModule", { value: true }); _$interactableTargets_42["default"] = void 0; /* removed: var _$arr_46 = require("@interactjs/utils/arr"); */; var ___extend_42 = ___interopRequireDefault_42(_$extend_52); function ___interopRequireDefault_42(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function __install_42(scope) { var pointerEvents = scope.pointerEvents, actions = scope.actions, Interactable = scope.Interactable, interactables = scope.interactables; pointerEvents.signals.on('collect-targets', function (_ref) { var targets = _ref.targets, node = _ref.node, type = _ref.type, eventTarget = _ref.eventTarget; scope.interactables.forEachMatch(node, function (interactable) { var eventable = interactable.events; var options = eventable.options; if (eventable.types[type] && eventable.types[type].length && interactable.testIgnoreAllow(options, node, eventTarget)) { targets.push({ node: node, eventable: eventable, props: { interactable: interactable } }); } }); }); interactables.signals.on('new', function (_ref2) { var interactable = _ref2.interactable; interactable.events.getRect = function (element) { return interactable.getRect(element); }; }); interactables.signals.on('set', function (_ref3) { var interactable = _ref3.interactable, options = _ref3.options; (0, ___extend_42["default"])(interactable.events.options, pointerEvents.defaults); (0, ___extend_42["default"])(interactable.events.options, options.pointerEvents || {}); }); (0, _$arr_46.merge)(actions.eventTypes, pointerEvents.types); Interactable.prototype.pointerEvents = pointerEventsMethod; var __backCompatOption = Interactable.prototype._backCompatOption; Interactable.prototype._backCompatOption = function (optionName, newValue) { var ret = __backCompatOption.call(this, optionName, newValue); if (ret === this) { this.events.options[optionName] = newValue; } return ret; }; } function pointerEventsMethod(options) { (0, ___extend_42["default"])(this.events.options, options); return this; } var ___default_42 = { id: 'pointer-events/interactableTargets', install: __install_42 }; _$interactableTargets_42["default"] = ___default_42; var _$pointerEvents_41 = {}; "use strict"; Object.defineProperty(_$pointerEvents_41, "__esModule", { value: true }); _$pointerEvents_41.install = __install_41; Object.defineProperty(_$pointerEvents_41, "pointerEvents", { enumerable: true, get: function get() { return ___base_41["default"]; } }); Object.defineProperty(_$pointerEvents_41, "holdRepeat", { enumerable: true, get: function get() { return _holdRepeat["default"]; } }); Object.defineProperty(_$pointerEvents_41, "interactableTargets", { enumerable: true, get: function get() { return _interactableTargets["default"]; } }); _$pointerEvents_41.id = void 0; var ___base_41 = ___interopRequireDefault_41(_$base_39); var _holdRepeat = ___interopRequireDefault_41(_$holdRepeat_40); var _interactableTargets = ___interopRequireDefault_41(_$interactableTargets_42); function ___interopRequireDefault_41(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function __install_41(scope) { scope.usePlugin(___base_41["default"]); scope.usePlugin(_holdRepeat["default"]); scope.usePlugin(_interactableTargets["default"]); } var __id_41 = 'pointer-events'; _$pointerEvents_41.id = __id_41; var _$reflow_43 = {}; "use strict"; Object.defineProperty(_$reflow_43, "__esModule", { value: true }); _$reflow_43.install = __install_43; _$reflow_43["default"] = void 0; /* removed: var _$InteractEvent_15 = require("@interactjs/core/InteractEvent"); */; /* removed: var _$utils_55 = require("@interactjs/utils"); */; _$InteractEvent_15.EventPhase.Reflow = 'reflow'; function __install_43(scope) { var actions = scope.actions, interactions = scope.interactions, Interactable = scope.Interactable; // add action reflow event types for (var _i = 0; _i < actions.names.length; _i++) { var _ref; _ref = actions.names[_i]; var actionName = _ref; actions.eventTypes.push("".concat(actionName, "reflow")); } // remove completed reflow interactions interactions.signals.on('stop', function (_ref2) { var interaction = _ref2.interaction; if (interaction.pointerType === _$InteractEvent_15.EventPhase.Reflow) { if (interaction._reflowResolve) { interaction._reflowResolve(); } _$utils_55.arr.remove(scope.interactions.list, interaction); } }); /** * ```js * const interactable = interact(target) * const drag = { name: drag, axis: 'x' } * const resize = { name: resize, edges: { left: true, bottom: true } * * interactable.reflow(drag) * interactable.reflow(resize) * ``` * * Start an action sequence to re-apply modifiers, check drops, etc. * * @param { Object } action The action to begin * @param { string } action.name The name of the action * @returns { Promise } */ Interactable.prototype.reflow = function (action) { return reflow(this, action, scope); }; } function reflow(interactable, action, scope) { var elements = _$utils_55.is.string(interactable.target) ? _$utils_55.arr.from(interactable._context.querySelectorAll(interactable.target)) : [interactable.target]; // tslint:disable-next-line variable-name var Promise = _$utils_55.win.window.Promise; var promises = Promise ? [] : null; var _loop = function _loop() { _ref3 = elements[_i2]; var element = _ref3; var rect = interactable.getRect(element); if (!rect) { return "break"; } var runningInteraction = _$utils_55.arr.find(scope.interactions.list, function (interaction) { return interaction.interacting() && interaction.interactable === interactable && interaction.element === element && interaction.prepared.name === action.name; }); var reflowPromise = void 0; if (runningInteraction) { runningInteraction.move(); if (promises) { reflowPromise = runningInteraction._reflowPromise || new Promise(function (resolve) { runningInteraction._reflowResolve = resolve; }); } } else { var xywh = _$utils_55.rect.tlbrToXywh(rect); var coords = { page: { x: xywh.x, y: xywh.y }, client: { x: xywh.x, y: xywh.y }, timeStamp: scope.now() }; var event = _$utils_55.pointer.coordsToEvent(coords); reflowPromise = startReflow(scope, interactable, element, action, event); } if (promises) { promises.push(reflowPromise); } }; for (var _i2 = 0; _i2 < elements.length; _i2++) { var _ref3; var _ret = _loop(); if (_ret === "break") break; } return promises && Promise.all(promises).then(function () { return interactable; }); } function startReflow(scope, interactable, element, action, event) { var interaction = scope.interactions["new"]({ pointerType: 'reflow' }); var signalArg = { interaction: interaction, event: event, pointer: event, eventTarget: element, phase: _$InteractEvent_15.EventPhase.Reflow }; interaction.interactable = interactable; interaction.element = element; interaction.prepared = (0, _$utils_55.extend)({}, action); interaction.prevEvent = event; interaction.updatePointer(event, event, element, true); interaction._doPhase(signalArg); var reflowPromise = _$utils_55.win.window.Promise ? new _$utils_55.win.window.Promise(function (resolve) { interaction._reflowResolve = resolve; }) : null; interaction._reflowPromise = reflowPromise; interaction.start(action, interactable, element); if (interaction._interacting) { interaction.move(signalArg); interaction.end(event); } else { interaction.stop(); } interaction.removePointer(event, event); interaction.pointerIsDown = false; return reflowPromise; } var ___default_43 = { id: 'reflow', install: __install_43 }; _$reflow_43["default"] = ___default_43; var _$interact_28 = {}; "use strict"; Object.defineProperty(_$interact_28, "__esModule", { value: true }); _$interact_28["default"] = _$interact_28.scope = _$interact_28.interact = void 0; var ___scope_28 = _$scope_24({}); var __utils_28 = ___interopRequireWildcard_28(_$utils_55); var ___browser_28 = ___interopRequireDefault_28(_$browser_47); var ___events_28 = ___interopRequireDefault_28(_$events_51); function ___interopRequireDefault_28(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_28(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } /** @module interact */ var globalEvents = {}; var scope = new ___scope_28.Scope(); /** * ```js * interact('#draggable').draggable(true) * * var rectables = interact('rect') * rectables * .gesturable(true) * .on('gesturemove', function (event) { * // ... * }) * ``` * * The methods of this variable can be used to set elements as interactables * and also to change various default settings. * * Calling it as a function and passing an element or a valid CSS selector * string returns an Interactable object which has various methods to configure * it. * * @global * * @param {Element | string} target The HTML or SVG Element to interact with * or CSS selector * @return {Interactable} */ _$interact_28.scope = scope; var interact = function interact(target, options) { var interactable = scope.interactables.get(target, options); if (!interactable) { interactable = scope.interactables["new"](target, options); interactable.events.global = globalEvents; } return interactable; }; /** * Use a plugin * * @alias module:interact.use * * @param {Object} plugin * @param {function} plugin.install * @return {interact} */ _$interact_28.interact = interact; interact.use = use; function use(plugin, options) { scope.usePlugin(plugin, options); return interact; } /** * Check if an element or selector has been set with the {@link interact} * function * * @alias module:interact.isSet * * @param {Element} element The Element being searched for * @return {boolean} Indicates if the element or CSS selector was previously * passed to interact */ interact.isSet = isSet; function isSet(target, options) { return !!scope.interactables.get(target, options && options.context); } /** * Add a global listener for an InteractEvent or adds a DOM event to `document` * * @alias module:interact.on * * @param {string | array | object} type The types of events to listen for * @param {function} listener The function event (s) * @param {object | boolean} [options] object or useCapture flag for * addEventListener * @return {object} interact */ interact.on = on; function on(type, listener, options) { if (__utils_28.is.string(type) && type.search(' ') !== -1) { type = type.trim().split(/ +/); } if (__utils_28.is.array(type)) { for (var _i = 0; _i < type.length; _i++) { var _ref; _ref = type[_i]; var eventType = _ref; interact.on(eventType, listener, options); } return interact; } if (__utils_28.is.object(type)) { for (var prop in type) { interact.on(prop, type[prop], listener); } return interact; } // if it is an InteractEvent type, add listener to globalEvents if (__utils_28.arr.contains(scope.actions.eventTypes, type)) { // if this type of event was never bound if (!globalEvents[type]) { globalEvents[type] = [listener]; } else { globalEvents[type].push(listener); } } // If non InteractEvent type, addEventListener to document else { ___events_28["default"].add(scope.document, type, listener, { options: options }); } return interact; } /** * Removes a global InteractEvent listener or DOM event from `document` * * @alias module:interact.off * * @param {string | array | object} type The types of events that were listened * for * @param {function} listener The listener function to be removed * @param {object | boolean} options [options] object or useCapture flag for * removeEventListener * @return {object} interact */ interact.off = off; function off(type, listener, options) { if (__utils_28.is.string(type) && type.search(' ') !== -1) { type = type.trim().split(/ +/); } if (__utils_28.is.array(type)) { for (var _i2 = 0; _i2 < type.length; _i2++) { var _ref2; _ref2 = type[_i2]; var eventType = _ref2; interact.off(eventType, listener, options); } return interact; } if (__utils_28.is.object(type)) { for (var prop in type) { interact.off(prop, type[prop], listener); } return interact; } if (!__utils_28.arr.contains(scope.actions.eventTypes, type)) { ___events_28["default"].remove(scope.document, type, listener, options); } else { var index; if (type in globalEvents && (index = globalEvents[type].indexOf(listener)) !== -1) { globalEvents[type].splice(index, 1); } } return interact; } /** * Returns an object which exposes internal data * @alias module:interact.debug * * @return {object} An object with properties that outline the current state * and expose internal functions and variables */ interact.debug = debug; function debug() { return scope; } // expose the functions used to calculate multi-touch properties interact.getPointerAverage = __utils_28.pointer.pointerAverage; interact.getTouchBBox = __utils_28.pointer.touchBBox; interact.getTouchDistance = __utils_28.pointer.touchDistance; interact.getTouchAngle = __utils_28.pointer.touchAngle; interact.getElementRect = __utils_28.dom.getElementRect; interact.getElementClientRect = __utils_28.dom.getElementClientRect; interact.matchesSelector = __utils_28.dom.matchesSelector; interact.closest = __utils_28.dom.closest; /** * @alias module:interact.supportsTouch * * @return {boolean} Whether or not the browser supports touch input */ interact.supportsTouch = supportsTouch; function supportsTouch() { return ___browser_28["default"].supportsTouch; } /** * @alias module:interact.supportsPointerEvent * * @return {boolean} Whether or not the browser supports PointerEvents */ interact.supportsPointerEvent = supportsPointerEvent; function supportsPointerEvent() { return ___browser_28["default"].supportsPointerEvent; } /** * Cancels all interactions (end events are not fired) * * @alias module:interact.stop * * @return {object} interact */ interact.stop = __stop_28; function __stop_28() { for (var _i3 = 0; _i3 < scope.interactions.list.length; _i3++) { var _ref3; _ref3 = scope.interactions.list[_i3]; var interaction = _ref3; interaction.stop(); } return interact; } /** * Returns or sets the distance the pointer must be moved before an action * sequence occurs. This also affects tolerance for tap events. * * @alias module:interact.pointerMoveTolerance * * @param {number} [newValue] The movement from the start position must be greater than this value * @return {interact | number} */ interact.pointerMoveTolerance = pointerMoveTolerance; function pointerMoveTolerance(newValue) { if (__utils_28.is.number(newValue)) { scope.interactions.pointerMoveTolerance = newValue; return interact; } return scope.interactions.pointerMoveTolerance; } scope.interactables.signals.on('unset', function (_ref4) { var interactable = _ref4.interactable; scope.interactables.list.splice(scope.interactables.list.indexOf(interactable), 1); // Stop related interactions when an Interactable is unset for (var _i4 = 0; _i4 < scope.interactions.list.length; _i4++) { var _ref5; _ref5 = scope.interactions.list[_i4]; var interaction = _ref5; if (interaction.interactable === interactable && interaction.interacting() && !interaction._ending) { interaction.stop(); } } }); interact.addDocument = function (doc, options) { return scope.addDocument(doc, options); }; interact.removeDocument = function (doc) { return scope.removeDocument(doc); }; scope.interact = interact; var ___default_28 = interact; _$interact_28["default"] = ___default_28; var _$interact_27 = {}; "use strict"; Object.defineProperty(_$interact_27, "__esModule", { value: true }); _$interact_27.init = __init_27; Object.defineProperty(_$interact_27, "autoScroll", { enumerable: true, get: function get() { return _autoScroll["default"]; } }); Object.defineProperty(_$interact_27, "interactablePreventDefault", { enumerable: true, get: function get() { return _interactablePreventDefault["default"]; } }); Object.defineProperty(_$interact_27, "inertia", { enumerable: true, get: function get() { return _inertia["default"]; } }); Object.defineProperty(_$interact_27, "modifiers", { enumerable: true, get: function get() { return ___base_27["default"]; } }); Object.defineProperty(_$interact_27, "reflow", { enumerable: true, get: function get() { return _reflow["default"]; } }); Object.defineProperty(_$interact_27, "interact", { enumerable: true, get: function get() { return _interact["default"]; } }); _$interact_27.pointerEvents = _$interact_27.actions = _$interact_27["default"] = void 0; var actions = ___interopRequireWildcard_27(_$actions_5); _$interact_27.actions = actions; var _autoScroll = ___interopRequireDefault_27(_$autoScroll_7); var autoStart = ___interopRequireWildcard_27(_$autoStart_12); var _interactablePreventDefault = ___interopRequireDefault_27(_$interactablePreventDefault_21); var _devTools = ___interopRequireDefault_27(_$devTools_25); var _inertia = ___interopRequireDefault_27(_$inertia_26); var modifiers = ___interopRequireWildcard_27(_$modifiers_31); var ___base_27 = ___interopRequireDefault_27(_$base_30); var __pointerEvents_27 = ___interopRequireWildcard_27(_$pointerEvents_41); _$interact_27.pointerEvents = __pointerEvents_27; var _reflow = ___interopRequireDefault_27(_$reflow_43); var _interact = ___interopRequireWildcard_27(_$interact_28); function ___interopRequireDefault_27(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_27(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function __init_27(window) { _interact.scope.init(window); _interact["default"].use(_interactablePreventDefault["default"]); // inertia _interact["default"].use(_inertia["default"]); // pointerEvents _interact["default"].use(__pointerEvents_27); // autoStart, hold _interact["default"].use(autoStart); // drag and drop, resize, gesture _interact["default"].use(actions); // snap, resize, etc. _interact["default"].use(___base_27["default"]); // for backwrads compatibility for (var type in modifiers) { var _modifiers$type = modifiers[type], _defaults = _modifiers$type._defaults, _methods = _modifiers$type._methods; _defaults._methods = _methods; _interact.scope.defaults.perAction[type] = _defaults; } // autoScroll _interact["default"].use(_autoScroll["default"]); // reflow _interact["default"].use(_reflow["default"]); // eslint-disable-next-line no-undef if (false) {} return _interact["default"]; } // eslint-disable-next-line no-undef _interact["default"].version = "1.4.9"; var ___default_27 = _interact["default"]; _$interact_27["default"] = ___default_27; var _$types_44 = {}; /// "use strict"; var _$grid_63 = {}; "use strict"; Object.defineProperty(_$grid_63, "__esModule", { value: true }); _$grid_63["default"] = void 0; function ___slicedToArray_63(arr, i) { return ___arrayWithHoles_63(arr) || ___iterableToArrayLimit_63(arr, i) || ___nonIterableRest_63(); } function ___nonIterableRest_63() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } function ___iterableToArrayLimit_63(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function ___arrayWithHoles_63(arr) { if (Array.isArray(arr)) return arr; } function createGrid(grid) { var coordFields = [['x', 'y'], ['left', 'top'], ['right', 'bottom'], ['width', 'height']].filter(function (_ref) { var _ref2 = ___slicedToArray_63(_ref, 2), xField = _ref2[0], yField = _ref2[1]; return xField in grid || yField in grid; }); return function (x, y) { var range = grid.range, _grid$limits = grid.limits, limits = _grid$limits === void 0 ? { left: -Infinity, right: Infinity, top: -Infinity, bottom: Infinity } : _grid$limits, _grid$offset = grid.offset, offset = _grid$offset === void 0 ? { x: 0, y: 0 } : _grid$offset; var result = { range: range }; for (var _i2 = 0; _i2 < coordFields.length; _i2++) { var _ref3; _ref3 = coordFields[_i2]; var _ref4 = _ref3, _ref5 = ___slicedToArray_63(_ref4, 2), xField = _ref5[0], yField = _ref5[1]; var gridx = Math.round((x - offset.x) / grid[xField]); var gridy = Math.round((y - offset.y) / grid[yField]); result[xField] = Math.max(limits.left, Math.min(limits.right, gridx * grid[xField] + offset.x)); result[yField] = Math.max(limits.top, Math.min(limits.bottom, gridy * grid[yField] + offset.y)); } return result; }; } var ___default_63 = createGrid; _$grid_63["default"] = ___default_63; var _$snappers_64 = {}; "use strict"; Object.defineProperty(_$snappers_64, "__esModule", { value: true }); Object.defineProperty(_$snappers_64, "grid", { enumerable: true, get: function get() { return _grid["default"]; } }); var _grid = ___interopRequireDefault_64(_$grid_63); function ___interopRequireDefault_64(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } var _$index_29 = { exports: {} }; "use strict"; Object.defineProperty(_$index_29.exports, "__esModule", { value: true }); _$index_29.exports.init = __init_29; _$index_29.exports["default"] = void 0; var ___interact_29 = ___interopRequireWildcard_29(_$interact_27); var __modifiers_29 = ___interopRequireWildcard_29(_$modifiers_31); _$types_44; var ___extend_29 = ___interopRequireDefault_29(_$extend_52); var snappers = ___interopRequireWildcard_29(_$snappers_64); function ___interopRequireDefault_29(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function ___interopRequireWildcard_29(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } } function ___typeof_29(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { ___typeof_29 = function _typeof(obj) { return typeof obj; }; } else { ___typeof_29 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return ___typeof_29(obj); } if ((typeof window === "undefined" ? "undefined" : ___typeof_29(window)) === 'object' && !!window) { __init_29(window); } function __init_29(win) { (0, ___interact_29.init)(win); return ___interact_29["default"].use({ id: 'interactjs', install: function install(scope) { ___interact_29["default"].modifiers = (0, ___extend_29["default"])(scope.modifiers, __modifiers_29); ___interact_29["default"].snappers = snappers; ___interact_29["default"].createSnapGrid = ___interact_29["default"].snappers.grid; } }); } var ___default_29 = ___interact_29["default"]; _$index_29.exports["default"] = ___default_29; ___interact_29["default"]['default'] = ___interact_29["default"]; // tslint:disable-line no-string-literal ___interact_29["default"]['init'] = __init_29; // tslint:disable-line no-string-literal if (( false ? undefined : ___typeof_29(_$index_29)) === 'object' && !!_$index_29) { _$index_29.exports = ___interact_29["default"]; } _$index_29 = _$index_29.exports return _$index_29; }); //# sourceMappingURL=interact.js.map /***/ }), /***/ "./node_modules/lodash.debounce/index.js": /*!***********************************************!*\ !*** ./node_modules/lodash.debounce/index.js ***! \***********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */(function(global) {/** * lodash (Custom Build) * Build: `lodash modularize exports="npm" -o ./` * Copyright jQuery Foundation and other contributors * Released under MIT license * Based on Underscore.js 1.8.3 * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors */ /** Used as the `TypeError` message for "Functions" methods. */ var FUNC_ERROR_TEXT = 'Expected a function'; /** Used as references for various `Number` constants. */ var NAN = 0 / 0; /** `Object#toString` result references. */ var symbolTag = '[object Symbol]'; /** Used to match leading and trailing whitespace. */ var reTrim = /^\s+|\s+$/g; /** Used to detect bad signed hexadecimal string values. */ var reIsBadHex = /^[-+]0x[0-9a-f]+$/i; /** Used to detect binary string values. */ var reIsBinary = /^0b[01]+$/i; /** Used to detect octal string values. */ var reIsOctal = /^0o[0-7]+$/i; /** Built-in method references without a dependency on `root`. */ var freeParseInt = parseInt; /** Detect free variable `global` from Node.js. */ var freeGlobal = typeof global == 'object' && global && global.Object === Object && global; /** Detect free variable `self`. */ var freeSelf = typeof self == 'object' && self && self.Object === Object && self; /** Used as a reference to the global object. */ var root = freeGlobal || freeSelf || Function('return this')(); /** Used for built-in method references. */ var objectProto = Object.prototype; /** * Used to resolve the * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring) * of values. */ var objectToString = objectProto.toString; /* Built-in method references for those with the same name as other `lodash` methods. */ var nativeMax = Math.max, nativeMin = Math.min; /** * Gets the timestamp of the number of milliseconds that have elapsed since * the Unix epoch (1 January 1970 00:00:00 UTC). * * @static * @memberOf _ * @since 2.4.0 * @category Date * @returns {number} Returns the timestamp. * @example * * _.defer(function(stamp) { * console.log(_.now() - stamp); * }, _.now()); * // => Logs the number of milliseconds it took for the deferred invocation. */ var now = function() { return root.Date.now(); }; /** * Creates a debounced function that delays invoking `func` until after `wait` * milliseconds have elapsed since the last time the debounced function was * invoked. The debounced function comes with a `cancel` method to cancel * delayed `func` invocations and a `flush` method to immediately invoke them. * Provide `options` to indicate whether `func` should be invoked on the * leading and/or trailing edge of the `wait` timeout. The `func` is invoked * with the last arguments provided to the debounced function. Subsequent * calls to the debounced function return the result of the last `func` * invocation. * * **Note:** If `leading` and `trailing` options are `true`, `func` is * invoked on the trailing edge of the timeout only if the debounced function * is invoked more than once during the `wait` timeout. * * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred * until to the next tick, similar to `setTimeout` with a timeout of `0`. * * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/) * for details over the differences between `_.debounce` and `_.throttle`. * * @static * @memberOf _ * @since 0.1.0 * @category Function * @param {Function} func The function to debounce. * @param {number} [wait=0] The number of milliseconds to delay. * @param {Object} [options={}] The options object. * @param {boolean} [options.leading=false] * Specify invoking on the leading edge of the timeout. * @param {number} [options.maxWait] * The maximum time `func` is allowed to be delayed before it's invoked. * @param {boolean} [options.trailing=true] * Specify invoking on the trailing edge of the timeout. * @returns {Function} Returns the new debounced function. * @example * * // Avoid costly calculations while the window size is in flux. * jQuery(window).on('resize', _.debounce(calculateLayout, 150)); * * // Invoke `sendMail` when clicked, debouncing subsequent calls. * jQuery(element).on('click', _.debounce(sendMail, 300, { * 'leading': true, * 'trailing': false * })); * * // Ensure `batchLog` is invoked once after 1 second of debounced calls. * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 }); * var source = new EventSource('/stream'); * jQuery(source).on('message', debounced); * * // Cancel the trailing debounced invocation. * jQuery(window).on('popstate', debounced.cancel); */ function debounce(func, wait, options) { var lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true; if (typeof func != 'function') { throw new TypeError(FUNC_ERROR_TEXT); } wait = toNumber(wait) || 0; if (isObject(options)) { leading = !!options.leading; maxing = 'maxWait' in options; maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait; trailing = 'trailing' in options ? !!options.trailing : trailing; } function invokeFunc(time) { var args = lastArgs, thisArg = lastThis; lastArgs = lastThis = undefined; lastInvokeTime = time; result = func.apply(thisArg, args); return result; } function leadingEdge(time) { // Reset any `maxWait` timer. lastInvokeTime = time; // Start the timer for the trailing edge. timerId = setTimeout(timerExpired, wait); // Invoke the leading edge. return leading ? invokeFunc(time) : result; } function remainingWait(time) { var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime, result = wait - timeSinceLastCall; return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result; } function shouldInvoke(time) { var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime; // Either this is the first call, activity has stopped and we're at the // trailing edge, the system time has gone backwards and we're treating // it as the trailing edge, or we've hit the `maxWait` limit. return (lastCallTime === undefined || (timeSinceLastCall >= wait) || (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait)); } function timerExpired() { var time = now(); if (shouldInvoke(time)) { return trailingEdge(time); } // Restart the timer. timerId = setTimeout(timerExpired, remainingWait(time)); } function trailingEdge(time) { timerId = undefined; // Only invoke if we have `lastArgs` which means `func` has been // debounced at least once. if (trailing && lastArgs) { return invokeFunc(time); } lastArgs = lastThis = undefined; return result; } function cancel() { if (timerId !== undefined) { clearTimeout(timerId); } lastInvokeTime = 0; lastArgs = lastCallTime = lastThis = timerId = undefined; } function flush() { return timerId === undefined ? result : trailingEdge(now()); } function debounced() { var time = now(), isInvoking = shouldInvoke(time); lastArgs = arguments; lastThis = this; lastCallTime = time; if (isInvoking) { if (timerId === undefined) { return leadingEdge(lastCallTime); } if (maxing) { // Handle invocations in a tight loop. timerId = setTimeout(timerExpired, wait); return invokeFunc(lastCallTime); } } if (timerId === undefined) { timerId = setTimeout(timerExpired, wait); } return result; } debounced.cancel = cancel; debounced.flush = flush; return debounced; } /** * Checks if `value` is the * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types) * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`) * * @static * @memberOf _ * @since 0.1.0 * @category Lang * @param {*} value The value to check. * @returns {boolean} Returns `true` if `value` is an object, else `false`. * @example * * _.isObject({}); * // => true * * _.isObject([1, 2, 3]); * // => true * * _.isObject(_.noop); * // => true * * _.isObject(null); * // => false */ function isObject(value) { var type = typeof value; return !!value && (type == 'object' || type == 'function'); } /** * Checks if `value` is object-like. A value is object-like if it's not `null` * and has a `typeof` result of "object". * * @static * @memberOf _ * @since 4.0.0 * @category Lang * @param {*} value The value to check. * @returns {boolean} Returns `true` if `value` is object-like, else `false`. * @example * * _.isObjectLike({}); * // => true * * _.isObjectLike([1, 2, 3]); * // => true * * _.isObjectLike(_.noop); * // => false * * _.isObjectLike(null); * // => false */ function isObjectLike(value) { return !!value && typeof value == 'object'; } /** * Checks if `value` is classified as a `Symbol` primitive or object. * * @static * @memberOf _ * @since 4.0.0 * @category Lang * @param {*} value The value to check. * @returns {boolean} Returns `true` if `value` is a symbol, else `false`. * @example * * _.isSymbol(Symbol.iterator); * // => true * * _.isSymbol('abc'); * // => false */ function isSymbol(value) { return typeof value == 'symbol' || (isObjectLike(value) && objectToString.call(value) == symbolTag); } /** * Converts `value` to a number. * * @static * @memberOf _ * @since 4.0.0 * @category Lang * @param {*} value The value to process. * @returns {number} Returns the number. * @example * * _.toNumber(3.2); * // => 3.2 * * _.toNumber(Number.MIN_VALUE); * // => 5e-324 * * _.toNumber(Infinity); * // => Infinity * * _.toNumber('3.2'); * // => 3.2 */ function toNumber(value) { if (typeof value == 'number') { return value; } if (isSymbol(value)) { return NAN; } if (isObject(value)) { var other = typeof value.valueOf == 'function' ? value.valueOf() : value; value = isObject(other) ? (other + '') : other; } if (typeof value != 'string') { return value === 0 ? value : +value; } value = value.replace(reTrim, ''); var isBinary = reIsBinary.test(value); return (isBinary || reIsOctal.test(value)) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : (reIsBadHex.test(value) ? NAN : +value); } module.exports = debounce; /* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../webpack/buildin/global.js */ "./node_modules/webpack/buildin/global.js"))) /***/ }), /***/ "./node_modules/popper.js/dist/esm/popper.js": /*!***************************************************!*\ !*** ./node_modules/popper.js/dist/esm/popper.js ***! \***************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* WEBPACK VAR INJECTION */(function(global) {/**! * @fileOverview Kickass library to create and place poppers near their reference elements. * @version 1.15.0 * @license * Copyright (c) 2016 Federico Zivolo and contributors * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is * furnished to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in all * copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined'; var longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox']; var timeoutDuration = 0; for (var i = 0; i < longerTimeoutBrowsers.length; i += 1) { if (isBrowser && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) { timeoutDuration = 1; break; } } function microtaskDebounce(fn) { var called = false; return function () { if (called) { return; } called = true; window.Promise.resolve().then(function () { called = false; fn(); }); }; } function taskDebounce(fn) { var scheduled = false; return function () { if (!scheduled) { scheduled = true; setTimeout(function () { scheduled = false; fn(); }, timeoutDuration); } }; } var supportsMicroTasks = isBrowser && window.Promise; /** * Create a debounced version of a method, that's asynchronously deferred * but called in the minimum time possible. * * @method * @memberof Popper.Utils * @argument {Function} fn * @returns {Function} */ var debounce = supportsMicroTasks ? microtaskDebounce : taskDebounce; /** * Check if the given variable is a function * @method * @memberof Popper.Utils * @argument {Any} functionToCheck - variable to check * @returns {Boolean} answer to: is a function? */ function isFunction(functionToCheck) { var getType = {}; return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]'; } /** * Get CSS computed property of the given element * @method * @memberof Popper.Utils * @argument {Eement} element * @argument {String} property */ function getStyleComputedProperty(element, property) { if (element.nodeType !== 1) { return []; } // NOTE: 1 DOM access here var window = element.ownerDocument.defaultView; var css = window.getComputedStyle(element, null); return property ? css[property] : css; } /** * Returns the parentNode or the host of the element * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} parent */ function getParentNode(element) { if (element.nodeName === 'HTML') { return element; } return element.parentNode || element.host; } /** * Returns the scrolling parent of the given element * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} scroll parent */ function getScrollParent(element) { // Return body, `getScroll` will take care to get the correct `scrollTop` from it if (!element) { return document.body; } switch (element.nodeName) { case 'HTML': case 'BODY': return element.ownerDocument.body; case '#document': return element.body; } // Firefox want us to check `-x` and `-y` variations as well var _getStyleComputedProp = getStyleComputedProperty(element), overflow = _getStyleComputedProp.overflow, overflowX = _getStyleComputedProp.overflowX, overflowY = _getStyleComputedProp.overflowY; if (/(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)) { return element; } return getScrollParent(getParentNode(element)); } var isIE11 = isBrowser && !!(window.MSInputMethodContext && document.documentMode); var isIE10 = isBrowser && /MSIE 10/.test(navigator.userAgent); /** * Determines if the browser is Internet Explorer * @method * @memberof Popper.Utils * @param {Number} version to check * @returns {Boolean} isIE */ function isIE(version) { if (version === 11) { return isIE11; } if (version === 10) { return isIE10; } return isIE11 || isIE10; } /** * Returns the offset parent of the given element * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} offset parent */ function getOffsetParent(element) { if (!element) { return document.documentElement; } var noOffsetParent = isIE(10) ? document.body : null; // NOTE: 1 DOM access here var offsetParent = element.offsetParent || null; // Skip hidden elements which don't have an offsetParent while (offsetParent === noOffsetParent && element.nextElementSibling) { offsetParent = (element = element.nextElementSibling).offsetParent; } var nodeName = offsetParent && offsetParent.nodeName; if (!nodeName || nodeName === 'BODY' || nodeName === 'HTML') { return element ? element.ownerDocument.documentElement : document.documentElement; } // .offsetParent will return the closest TH, TD or TABLE in case // no offsetParent is present, I hate this job... if (['TH', 'TD', 'TABLE'].indexOf(offsetParent.nodeName) !== -1 && getStyleComputedProperty(offsetParent, 'position') === 'static') { return getOffsetParent(offsetParent); } return offsetParent; } function isOffsetContainer(element) { var nodeName = element.nodeName; if (nodeName === 'BODY') { return false; } return nodeName === 'HTML' || getOffsetParent(element.firstElementChild) === element; } /** * Finds the root node (document, shadowDOM root) of the given element * @method * @memberof Popper.Utils * @argument {Element} node * @returns {Element} root node */ function getRoot(node) { if (node.parentNode !== null) { return getRoot(node.parentNode); } return node; } /** * Finds the offset parent common to the two provided nodes * @method * @memberof Popper.Utils * @argument {Element} element1 * @argument {Element} element2 * @returns {Element} common offset parent */ function findCommonOffsetParent(element1, element2) { // This check is needed to avoid errors in case one of the elements isn't defined for any reason if (!element1 || !element1.nodeType || !element2 || !element2.nodeType) { return document.documentElement; } // Here we make sure to give as "start" the element that comes first in the DOM var order = element1.compareDocumentPosition(element2) & Node.DOCUMENT_POSITION_FOLLOWING; var start = order ? element1 : element2; var end = order ? element2 : element1; // Get common ancestor container var range = document.createRange(); range.setStart(start, 0); range.setEnd(end, 0); var commonAncestorContainer = range.commonAncestorContainer; // Both nodes are inside #document if (element1 !== commonAncestorContainer && element2 !== commonAncestorContainer || start.contains(end)) { if (isOffsetContainer(commonAncestorContainer)) { return commonAncestorContainer; } return getOffsetParent(commonAncestorContainer); } // one of the nodes is inside shadowDOM, find which one var element1root = getRoot(element1); if (element1root.host) { return findCommonOffsetParent(element1root.host, element2); } else { return findCommonOffsetParent(element1, getRoot(element2).host); } } /** * Gets the scroll value of the given element in the given side (top and left) * @method * @memberof Popper.Utils * @argument {Element} element * @argument {String} side `top` or `left` * @returns {number} amount of scrolled pixels */ function getScroll(element) { var side = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'top'; var upperSide = side === 'top' ? 'scrollTop' : 'scrollLeft'; var nodeName = element.nodeName; if (nodeName === 'BODY' || nodeName === 'HTML') { var html = element.ownerDocument.documentElement; var scrollingElement = element.ownerDocument.scrollingElement || html; return scrollingElement[upperSide]; } return element[upperSide]; } /* * Sum or subtract the element scroll values (left and top) from a given rect object * @method * @memberof Popper.Utils * @param {Object} rect - Rect object you want to change * @param {HTMLElement} element - The element from the function reads the scroll values * @param {Boolean} subtract - set to true if you want to subtract the scroll values * @return {Object} rect - The modifier rect object */ function includeScroll(rect, element) { var subtract = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; var scrollTop = getScroll(element, 'top'); var scrollLeft = getScroll(element, 'left'); var modifier = subtract ? -1 : 1; rect.top += scrollTop * modifier; rect.bottom += scrollTop * modifier; rect.left += scrollLeft * modifier; rect.right += scrollLeft * modifier; return rect; } /* * Helper to detect borders of a given element * @method * @memberof Popper.Utils * @param {CSSStyleDeclaration} styles * Result of `getStyleComputedProperty` on the given element * @param {String} axis - `x` or `y` * @return {number} borders - The borders size of the given axis */ function getBordersSize(styles, axis) { var sideA = axis === 'x' ? 'Left' : 'Top'; var sideB = sideA === 'Left' ? 'Right' : 'Bottom'; return parseFloat(styles['border' + sideA + 'Width'], 10) + parseFloat(styles['border' + sideB + 'Width'], 10); } function getSize(axis, body, html, computedStyle) { return Math.max(body['offset' + axis], body['scroll' + axis], html['client' + axis], html['offset' + axis], html['scroll' + axis], isIE(10) ? parseInt(html['offset' + axis]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Top' : 'Left')]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Bottom' : 'Right')]) : 0); } function getWindowSizes(document) { var body = document.body; var html = document.documentElement; var computedStyle = isIE(10) && getComputedStyle(html); return { height: getSize('Height', body, html, computedStyle), width: getSize('Width', body, html, computedStyle) }; } var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var createClass = function () { function 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var defineProperty = function (obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /** * Given element offsets, generate an output similar to getBoundingClientRect * @method * @memberof Popper.Utils * @argument {Object} offsets * @returns {Object} ClientRect like output */ function getClientRect(offsets) { return _extends({}, offsets, { right: offsets.left + offsets.width, bottom: offsets.top + offsets.height }); } /** * Get bounding client rect of given element * @method * @memberof Popper.Utils * @param {HTMLElement} element * @return {Object} client rect */ function getBoundingClientRect(element) { var rect = {}; // IE10 10 FIX: Please, don't ask, the element isn't // considered in DOM in some circumstances... // This isn't reproducible in IE10 compatibility mode of IE11 try { if (isIE(10)) { rect = element.getBoundingClientRect(); var scrollTop = getScroll(element, 'top'); var scrollLeft = getScroll(element, 'left'); rect.top += scrollTop; rect.left += scrollLeft; rect.bottom += scrollTop; rect.right += scrollLeft; } else { rect = element.getBoundingClientRect(); } } catch (e) {} var result = { left: rect.left, top: rect.top, width: rect.right - rect.left, height: rect.bottom - rect.top }; // subtract scrollbar size from sizes var sizes = element.nodeName === 'HTML' ? getWindowSizes(element.ownerDocument) : {}; var width = sizes.width || element.clientWidth || result.right - result.left; var height = sizes.height || element.clientHeight || result.bottom - result.top; var horizScrollbar = element.offsetWidth - width; var vertScrollbar = element.offsetHeight - height; // if an hypothetical scrollbar is detected, we must be sure it's not a `border` // we make this check conditional for performance reasons if (horizScrollbar || vertScrollbar) { var styles = getStyleComputedProperty(element); horizScrollbar -= getBordersSize(styles, 'x'); vertScrollbar -= getBordersSize(styles, 'y'); result.width -= horizScrollbar; result.height -= vertScrollbar; } return getClientRect(result); } function getOffsetRectRelativeToArbitraryNode(children, parent) { var fixedPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; var isIE10 = isIE(10); var isHTML = parent.nodeName === 'HTML'; var childrenRect = getBoundingClientRect(children); var parentRect = getBoundingClientRect(parent); var scrollParent = getScrollParent(children); var styles = getStyleComputedProperty(parent); var borderTopWidth = parseFloat(styles.borderTopWidth, 10); var borderLeftWidth = parseFloat(styles.borderLeftWidth, 10); // In cases where the parent is fixed, we must ignore negative scroll in offset calc if (fixedPosition && isHTML) { parentRect.top = Math.max(parentRect.top, 0); parentRect.left = Math.max(parentRect.left, 0); } var offsets = getClientRect({ top: childrenRect.top - parentRect.top - borderTopWidth, left: childrenRect.left - parentRect.left - borderLeftWidth, width: childrenRect.width, height: childrenRect.height }); offsets.marginTop = 0; offsets.marginLeft = 0; // Subtract margins of documentElement in case it's being used as parent // we do this only on HTML because it's the only element that behaves // differently when margins are applied to it. The margins are included in // the box of the documentElement, in the other cases not. if (!isIE10 && isHTML) { var marginTop = parseFloat(styles.marginTop, 10); var marginLeft = parseFloat(styles.marginLeft, 10); offsets.top -= borderTopWidth - marginTop; offsets.bottom -= borderTopWidth - marginTop; offsets.left -= borderLeftWidth - marginLeft; offsets.right -= borderLeftWidth - marginLeft; // Attach marginTop and marginLeft because in some circumstances we may need them offsets.marginTop = marginTop; offsets.marginLeft = marginLeft; } if (isIE10 && !fixedPosition ? parent.contains(scrollParent) : parent === scrollParent && scrollParent.nodeName !== 'BODY') { offsets = includeScroll(offsets, parent); } return offsets; } function getViewportOffsetRectRelativeToArtbitraryNode(element) { var excludeScroll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; var html = element.ownerDocument.documentElement; var relativeOffset = getOffsetRectRelativeToArbitraryNode(element, html); var width = Math.max(html.clientWidth, window.innerWidth || 0); var height = Math.max(html.clientHeight, window.innerHeight || 0); var scrollTop = !excludeScroll ? getScroll(html) : 0; var scrollLeft = !excludeScroll ? getScroll(html, 'left') : 0; var offset = { top: scrollTop - relativeOffset.top + relativeOffset.marginTop, left: scrollLeft - relativeOffset.left + relativeOffset.marginLeft, width: width, height: height }; return getClientRect(offset); } /** * Check if the given element is fixed or is inside a fixed parent * @method * @memberof Popper.Utils * @argument {Element} element * @argument {Element} customContainer * @returns {Boolean} answer to "isFixed?" */ function isFixed(element) { var nodeName = element.nodeName; if (nodeName === 'BODY' || nodeName === 'HTML') { return false; } if (getStyleComputedProperty(element, 'position') === 'fixed') { return true; } var parentNode = getParentNode(element); if (!parentNode) { return false; } return isFixed(parentNode); } /** * Finds the first parent of an element that has a transformed property defined * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} first transformed parent or documentElement */ function getFixedPositionOffsetParent(element) { // This check is needed to avoid errors in case one of the elements isn't defined for any reason if (!element || !element.parentElement || isIE()) { return document.documentElement; } var el = element.parentElement; while (el && getStyleComputedProperty(el, 'transform') === 'none') { el = el.parentElement; } return el || document.documentElement; } /** * Computed the boundaries limits and return them * @method * @memberof Popper.Utils * @param {HTMLElement} popper * @param {HTMLElement} reference * @param {number} padding * @param {HTMLElement} boundariesElement - Element used to define the boundaries * @param {Boolean} fixedPosition - Is in fixed position mode * @returns {Object} Coordinates of the boundaries */ function getBoundaries(popper, reference, padding, boundariesElement) { var fixedPosition = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false; // NOTE: 1 DOM access here var boundaries = { top: 0, left: 0 }; var offsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference); // Handle viewport case if (boundariesElement === 'viewport') { boundaries = getViewportOffsetRectRelativeToArtbitraryNode(offsetParent, fixedPosition); } else { // Handle other cases based on DOM element used as boundaries var boundariesNode = void 0; if (boundariesElement === 'scrollParent') { boundariesNode = getScrollParent(getParentNode(reference)); if (boundariesNode.nodeName === 'BODY') { boundariesNode = popper.ownerDocument.documentElement; } } else if (boundariesElement === 'window') { boundariesNode = popper.ownerDocument.documentElement; } else { boundariesNode = boundariesElement; } var offsets = getOffsetRectRelativeToArbitraryNode(boundariesNode, offsetParent, fixedPosition); // In case of HTML, we need a different computation if (boundariesNode.nodeName === 'HTML' && !isFixed(offsetParent)) { var _getWindowSizes = getWindowSizes(popper.ownerDocument), height = _getWindowSizes.height, width = _getWindowSizes.width; boundaries.top += offsets.top - offsets.marginTop; boundaries.bottom = height + offsets.top; boundaries.left += offsets.left - offsets.marginLeft; boundaries.right = width + offsets.left; } else { // for all the other DOM elements, this one is good boundaries = offsets; } } // Add paddings padding = padding || 0; var isPaddingNumber = typeof padding === 'number'; boundaries.left += isPaddingNumber ? padding : padding.left || 0; boundaries.top += isPaddingNumber ? padding : padding.top || 0; boundaries.right -= isPaddingNumber ? padding : padding.right || 0; boundaries.bottom -= isPaddingNumber ? padding : padding.bottom || 0; return boundaries; } function getArea(_ref) { var width = _ref.width, height = _ref.height; return width * height; } /** * Utility used to transform the `auto` placement to the placement with more * available space. * @method * @memberof Popper.Utils * @argument {Object} data - The data object generated by update method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function computeAutoPlacement(placement, refRect, popper, reference, boundariesElement) { var padding = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0; if (placement.indexOf('auto') === -1) { return placement; } var boundaries = getBoundaries(popper, reference, padding, boundariesElement); var rects = { top: { width: boundaries.width, height: refRect.top - boundaries.top }, right: { width: boundaries.right - refRect.right, height: boundaries.height }, bottom: { width: boundaries.width, height: boundaries.bottom - refRect.bottom }, left: { width: refRect.left - boundaries.left, height: boundaries.height } }; var sortedAreas = Object.keys(rects).map(function (key) { return _extends({ key: key }, rects[key], { area: getArea(rects[key]) }); }).sort(function (a, b) { return b.area - a.area; }); var filteredAreas = sortedAreas.filter(function (_ref2) { var width = _ref2.width, height = _ref2.height; return width >= popper.clientWidth && height >= popper.clientHeight; }); var computedPlacement = filteredAreas.length > 0 ? filteredAreas[0].key : sortedAreas[0].key; var variation = placement.split('-')[1]; return computedPlacement + (variation ? '-' + variation : ''); } /** * Get offsets to the reference element * @method * @memberof Popper.Utils * @param {Object} state * @param {Element} popper - the popper element * @param {Element} reference - the reference element (the popper will be relative to this) * @param {Element} fixedPosition - is in fixed position mode * @returns {Object} An object containing the offsets which will be applied to the popper */ function getReferenceOffsets(state, popper, reference) { var fixedPosition = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null; var commonOffsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference); return getOffsetRectRelativeToArbitraryNode(reference, commonOffsetParent, fixedPosition); } /** * Get the outer sizes of the given element (offset size + margins) * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Object} object containing width and height properties */ function getOuterSizes(element) { var window = element.ownerDocument.defaultView; var styles = window.getComputedStyle(element); var x = parseFloat(styles.marginTop || 0) + parseFloat(styles.marginBottom || 0); var y = parseFloat(styles.marginLeft || 0) + parseFloat(styles.marginRight || 0); var result = { width: element.offsetWidth + y, height: element.offsetHeight + x }; return result; } /** * Get the opposite placement of the given one * @method * @memberof Popper.Utils * @argument {String} placement * @returns {String} flipped placement */ function getOppositePlacement(placement) { var hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' }; return placement.replace(/left|right|bottom|top/g, function (matched) { return hash[matched]; }); } /** * Get offsets to the popper * @method * @memberof Popper.Utils * @param {Object} position - CSS position the Popper will get applied * @param {HTMLElement} popper - the popper element * @param {Object} referenceOffsets - the reference offsets (the popper will be relative to this) * @param {String} placement - one of the valid placement options * @returns {Object} popperOffsets - An object containing the offsets which will be applied to the popper */ function getPopperOffsets(popper, referenceOffsets, placement) { placement = placement.split('-')[0]; // Get popper node sizes var popperRect = getOuterSizes(popper); // Add position, width and height to our offsets object var popperOffsets = { width: popperRect.width, height: popperRect.height }; // depending by the popper placement we have to compute its offsets slightly differently var isHoriz = ['right', 'left'].indexOf(placement) !== -1; var mainSide = isHoriz ? 'top' : 'left'; var secondarySide = isHoriz ? 'left' : 'top'; var measurement = isHoriz ? 'height' : 'width'; var secondaryMeasurement = !isHoriz ? 'height' : 'width'; popperOffsets[mainSide] = referenceOffsets[mainSide] + referenceOffsets[measurement] / 2 - popperRect[measurement] / 2; if (placement === secondarySide) { popperOffsets[secondarySide] = referenceOffsets[secondarySide] - popperRect[secondaryMeasurement]; } else { popperOffsets[secondarySide] = referenceOffsets[getOppositePlacement(secondarySide)]; } return popperOffsets; } /** * Mimics the `find` method of Array * @method * @memberof Popper.Utils * @argument {Array} arr * @argument prop * @argument value * @returns index or -1 */ function find(arr, check) { // use native find if supported if (Array.prototype.find) { return arr.find(check); } // use `filter` to obtain the same behavior of `find` return arr.filter(check)[0]; } /** * Return the index of the matching object * @method * @memberof Popper.Utils * @argument {Array} arr * @argument prop * @argument value * @returns index or -1 */ function findIndex(arr, prop, value) { // use native findIndex if supported if (Array.prototype.findIndex) { return arr.findIndex(function (cur) { return cur[prop] === value; }); } // use `find` + `indexOf` if `findIndex` isn't supported var match = find(arr, function (obj) { return obj[prop] === value; }); return arr.indexOf(match); } /** * Loop trough the list of modifiers and run them in order, * each of them will then edit the data object. * @method * @memberof Popper.Utils * @param {dataObject} data * @param {Array} modifiers * @param {String} ends - Optional modifier name used as stopper * @returns {dataObject} */ function runModifiers(modifiers, data, ends) { var modifiersToRun = ends === undefined ? modifiers : modifiers.slice(0, findIndex(modifiers, 'name', ends)); modifiersToRun.forEach(function (modifier) { if (modifier['function']) { // eslint-disable-line dot-notation console.warn('`modifier.function` is deprecated, use `modifier.fn`!'); } var fn = modifier['function'] || modifier.fn; // eslint-disable-line dot-notation if (modifier.enabled && isFunction(fn)) { // Add properties to offsets to make them a complete clientRect object // we do this before each modifier to make sure the previous one doesn't // mess with these values data.offsets.popper = getClientRect(data.offsets.popper); data.offsets.reference = getClientRect(data.offsets.reference); data = fn(data, modifier); } }); return data; } /** * Updates the position of the popper, computing the new offsets and applying * the new style.
* Prefer `scheduleUpdate` over `update` because of performance reasons. * @method * @memberof Popper */ function update() { // if popper is destroyed, don't perform any further update if (this.state.isDestroyed) { return; } var data = { instance: this, styles: {}, arrowStyles: {}, attributes: {}, flipped: false, offsets: {} }; // compute reference element offsets data.offsets.reference = getReferenceOffsets(this.state, this.popper, this.reference, this.options.positionFixed); // compute auto placement, store placement inside the data object, // modifiers will be able to edit `placement` if needed // and refer to originalPlacement to know the original value data.placement = computeAutoPlacement(this.options.placement, data.offsets.reference, this.popper, this.reference, this.options.modifiers.flip.boundariesElement, this.options.modifiers.flip.padding); // store the computed placement inside `originalPlacement` data.originalPlacement = data.placement; data.positionFixed = this.options.positionFixed; // compute the popper offsets data.offsets.popper = getPopperOffsets(this.popper, data.offsets.reference, data.placement); data.offsets.popper.position = this.options.positionFixed ? 'fixed' : 'absolute'; // run the modifiers data = runModifiers(this.modifiers, data); // the first `update` will call `onCreate` callback // the other ones will call `onUpdate` callback if (!this.state.isCreated) { this.state.isCreated = true; this.options.onCreate(data); } else { this.options.onUpdate(data); } } /** * Helper used to know if the given modifier is enabled. * @method * @memberof Popper.Utils * @returns {Boolean} */ function isModifierEnabled(modifiers, modifierName) { return modifiers.some(function (_ref) { var name = _ref.name, enabled = _ref.enabled; return enabled && name === modifierName; }); } /** * Get the prefixed supported property name * @method * @memberof Popper.Utils * @argument {String} property (camelCase) * @returns {String} prefixed property (camelCase or PascalCase, depending on the vendor prefix) */ function getSupportedPropertyName(property) { var prefixes = [false, 'ms', 'Webkit', 'Moz', 'O']; var upperProp = property.charAt(0).toUpperCase() + property.slice(1); for (var i = 0; i < prefixes.length; i++) { var prefix = prefixes[i]; var toCheck = prefix ? '' + prefix + upperProp : property; if (typeof document.body.style[toCheck] !== 'undefined') { return toCheck; } } return null; } /** * Destroys the popper. * @method * @memberof Popper */ function destroy() { this.state.isDestroyed = true; // touch DOM only if `applyStyle` modifier is enabled if (isModifierEnabled(this.modifiers, 'applyStyle')) { this.popper.removeAttribute('x-placement'); this.popper.style.position = ''; this.popper.style.top = ''; this.popper.style.left = ''; this.popper.style.right = ''; this.popper.style.bottom = ''; this.popper.style.willChange = ''; this.popper.style[getSupportedPropertyName('transform')] = ''; } this.disableEventListeners(); // remove the popper if user explicity asked for the deletion on destroy // do not use `remove` because IE11 doesn't support it if (this.options.removeOnDestroy) { this.popper.parentNode.removeChild(this.popper); } return this; } /** * Get the window associated with the element * @argument {Element} element * @returns {Window} */ function getWindow(element) { var ownerDocument = element.ownerDocument; return ownerDocument ? ownerDocument.defaultView : window; } function attachToScrollParents(scrollParent, event, callback, scrollParents) { var isBody = scrollParent.nodeName === 'BODY'; var target = isBody ? scrollParent.ownerDocument.defaultView : scrollParent; target.addEventListener(event, callback, { passive: true }); if (!isBody) { attachToScrollParents(getScrollParent(target.parentNode), event, callback, scrollParents); } scrollParents.push(target); } /** * Setup needed event listeners used to update the popper position * @method * @memberof Popper.Utils * @private */ function setupEventListeners(reference, options, state, updateBound) { // Resize event listener on window state.updateBound = updateBound; getWindow(reference).addEventListener('resize', state.updateBound, { passive: true }); // Scroll event listener on scroll parents var scrollElement = getScrollParent(reference); attachToScrollParents(scrollElement, 'scroll', state.updateBound, state.scrollParents); state.scrollElement = scrollElement; state.eventsEnabled = true; return state; } /** * It will add resize/scroll events and start recalculating * position of the popper element when they are triggered. * @method * @memberof Popper */ function enableEventListeners() { if (!this.state.eventsEnabled) { this.state = setupEventListeners(this.reference, this.options, this.state, this.scheduleUpdate); } } /** * Remove event listeners used to update the popper position * @method * @memberof Popper.Utils * @private */ function removeEventListeners(reference, state) { // Remove resize event listener on window getWindow(reference).removeEventListener('resize', state.updateBound); // Remove scroll event listener on scroll parents state.scrollParents.forEach(function (target) { target.removeEventListener('scroll', state.updateBound); }); // Reset state state.updateBound = null; state.scrollParents = []; state.scrollElement = null; state.eventsEnabled = false; return state; } /** * It will remove resize/scroll events and won't recalculate popper position * when they are triggered. It also won't trigger `onUpdate` callback anymore, * unless you call `update` method manually. * @method * @memberof Popper */ function disableEventListeners() { if (this.state.eventsEnabled) { cancelAnimationFrame(this.scheduleUpdate); this.state = removeEventListeners(this.reference, this.state); } } /** * Tells if a given input is a number * @method * @memberof Popper.Utils * @param {*} input to check * @return {Boolean} */ function isNumeric(n) { return n !== '' && !isNaN(parseFloat(n)) && isFinite(n); } /** * Set the style to the given popper * @method * @memberof Popper.Utils * @argument {Element} element - Element to apply the style to * @argument {Object} styles * Object with a list of properties and values which will be applied to the element */ function setStyles(element, styles) { Object.keys(styles).forEach(function (prop) { var unit = ''; // add unit if the value is numeric and is one of the following if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && isNumeric(styles[prop])) { unit = 'px'; } element.style[prop] = styles[prop] + unit; }); } /** * Set the attributes to the given popper * @method * @memberof Popper.Utils * @argument {Element} element - Element to apply the attributes to * @argument {Object} styles * Object with a list of properties and values which will be applied to the element */ function setAttributes(element, attributes) { Object.keys(attributes).forEach(function (prop) { var value = attributes[prop]; if (value !== false) { element.setAttribute(prop, attributes[prop]); } else { element.removeAttribute(prop); } }); } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by `update` method * @argument {Object} data.styles - List of style properties - values to apply to popper element * @argument {Object} data.attributes - List of attribute properties - values to apply to popper element * @argument {Object} options - Modifiers configuration and options * @returns {Object} The same data object */ function applyStyle(data) { // any property present in `data.styles` will be applied to the popper, // in this way we can make the 3rd party modifiers add custom styles to it // Be aware, modifiers could override the properties defined in the previous // lines of this modifier! setStyles(data.instance.popper, data.styles); // any property present in `data.attributes` will be applied to the popper, // they will be set as HTML attributes of the element setAttributes(data.instance.popper, data.attributes); // if arrowElement is defined and arrowStyles has some properties if (data.arrowElement && Object.keys(data.arrowStyles).length) { setStyles(data.arrowElement, data.arrowStyles); } return data; } /** * Set the x-placement attribute before everything else because it could be used * to add margins to the popper margins needs to be calculated to get the * correct popper offsets. * @method * @memberof Popper.modifiers * @param {HTMLElement} reference - The reference element used to position the popper * @param {HTMLElement} popper - The HTML element used as popper * @param {Object} options - Popper.js options */ function applyStyleOnLoad(reference, popper, options, modifierOptions, state) { // compute reference element offsets var referenceOffsets = getReferenceOffsets(state, popper, reference, options.positionFixed); // compute auto placement, store placement inside the data object, // modifiers will be able to edit `placement` if needed // and refer to originalPlacement to know the original value var placement = computeAutoPlacement(options.placement, referenceOffsets, popper, reference, options.modifiers.flip.boundariesElement, options.modifiers.flip.padding); popper.setAttribute('x-placement', placement); // Apply `position` to popper before anything else because // without the position applied we can't guarantee correct computations setStyles(popper, { position: options.positionFixed ? 'fixed' : 'absolute' }); return options; } /** * @function * @memberof Popper.Utils * @argument {Object} data - The data object generated by `update` method * @argument {Boolean} shouldRound - If the offsets should be rounded at all * @returns {Object} The popper's position offsets rounded * * The tale of pixel-perfect positioning. It's still not 100% perfect, but as * good as it can be within reason. * Discussion here: https://github.com/FezVrasta/popper.js/pull/715 * * Low DPI screens cause a popper to be blurry if not using full pixels (Safari * as well on High DPI screens). * * Firefox prefers no rounding for positioning and does not have blurriness on * high DPI screens. * * Only horizontal placement and left/right values need to be considered. */ function getRoundedOffsets(data, shouldRound) { var _data$offsets = data.offsets, popper = _data$offsets.popper, reference = _data$offsets.reference; var round = Math.round, floor = Math.floor; var noRound = function noRound(v) { return v; }; var referenceWidth = round(reference.width); var popperWidth = round(popper.width); var isVertical = ['left', 'right'].indexOf(data.placement) !== -1; var isVariation = data.placement.indexOf('-') !== -1; var sameWidthParity = referenceWidth % 2 === popperWidth % 2; var bothOddWidth = referenceWidth % 2 === 1 && popperWidth % 2 === 1; var horizontalToInteger = !shouldRound ? noRound : isVertical || isVariation || sameWidthParity ? round : floor; var verticalToInteger = !shouldRound ? noRound : round; return { left: horizontalToInteger(bothOddWidth && !isVariation && shouldRound ? popper.left - 1 : popper.left), top: verticalToInteger(popper.top), bottom: verticalToInteger(popper.bottom), right: horizontalToInteger(popper.right) }; } var isFirefox = isBrowser && /Firefox/i.test(navigator.userAgent); /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by `update` method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function computeStyle(data, options) { var x = options.x, y = options.y; var popper = data.offsets.popper; // Remove this legacy support in Popper.js v2 var legacyGpuAccelerationOption = find(data.instance.modifiers, function (modifier) { return modifier.name === 'applyStyle'; }).gpuAcceleration; if (legacyGpuAccelerationOption !== undefined) { console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!'); } var gpuAcceleration = legacyGpuAccelerationOption !== undefined ? legacyGpuAccelerationOption : options.gpuAcceleration; var offsetParent = getOffsetParent(data.instance.popper); var offsetParentRect = getBoundingClientRect(offsetParent); // Styles var styles = { position: popper.position }; var offsets = getRoundedOffsets(data, window.devicePixelRatio < 2 || !isFirefox); var sideA = x === 'bottom' ? 'top' : 'bottom'; var sideB = y === 'right' ? 'left' : 'right'; // if gpuAcceleration is set to `true` and transform is supported, // we use `translate3d` to apply the position to the popper we // automatically use the supported prefixed version if needed var prefixedProperty = getSupportedPropertyName('transform'); // now, let's make a step back and look at this code closely (wtf?) // If the content of the popper grows once it's been positioned, it // may happen that the popper gets misplaced because of the new content // overflowing its reference element // To avoid this problem, we provide two options (x and y), which allow // the consumer to define the offset origin. // If we position a popper on top of a reference element, we can set // `x` to `top` to make the popper grow towards its top instead of // its bottom. var left = void 0, top = void 0; if (sideA === 'bottom') { // when offsetParent is the positioning is relative to the bottom of the screen (excluding the scrollbar) // and not the bottom of the html element if (offsetParent.nodeName === 'HTML') { top = -offsetParent.clientHeight + offsets.bottom; } else { top = -offsetParentRect.height + offsets.bottom; } } else { top = offsets.top; } if (sideB === 'right') { if (offsetParent.nodeName === 'HTML') { left = -offsetParent.clientWidth + offsets.right; } else { left = -offsetParentRect.width + offsets.right; } } else { left = offsets.left; } if (gpuAcceleration && prefixedProperty) { styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)'; styles[sideA] = 0; styles[sideB] = 0; styles.willChange = 'transform'; } else { // othwerise, we use the standard `top`, `left`, `bottom` and `right` properties var invertTop = sideA === 'bottom' ? -1 : 1; var invertLeft = sideB === 'right' ? -1 : 1; styles[sideA] = top * invertTop; styles[sideB] = left * invertLeft; styles.willChange = sideA + ', ' + sideB; } // Attributes var attributes = { 'x-placement': data.placement }; // Update `data` attributes, styles and arrowStyles data.attributes = _extends({}, attributes, data.attributes); data.styles = _extends({}, styles, data.styles); data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles); return data; } /** * Helper used to know if the given modifier depends from another one.
* It checks if the needed modifier is listed and enabled. * @method * @memberof Popper.Utils * @param {Array} modifiers - list of modifiers * @param {String} requestingName - name of requesting modifier * @param {String} requestedName - name of requested modifier * @returns {Boolean} */ function isModifierRequired(modifiers, requestingName, requestedName) { var requesting = find(modifiers, function (_ref) { var name = _ref.name; return name === requestingName; }); var isRequired = !!requesting && modifiers.some(function (modifier) { return modifier.name === requestedName && modifier.enabled && modifier.order < requesting.order; }); if (!isRequired) { var _requesting = '`' + requestingName + '`'; var requested = '`' + requestedName + '`'; console.warn(requested + ' modifier is required by ' + _requesting + ' modifier in order to work, be sure to include it before ' + _requesting + '!'); } return isRequired; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by update method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function arrow(data, options) { var _data$offsets$arrow; // arrow depends on keepTogether in order to work if (!isModifierRequired(data.instance.modifiers, 'arrow', 'keepTogether')) { return data; } var arrowElement = options.element; // if arrowElement is a string, suppose it's a CSS selector if (typeof arrowElement === 'string') { arrowElement = data.instance.popper.querySelector(arrowElement); // if arrowElement is not found, don't run the modifier if (!arrowElement) { return data; } } else { // if the arrowElement isn't a query selector we must check that the // provided DOM node is child of its popper node if (!data.instance.popper.contains(arrowElement)) { console.warn('WARNING: `arrow.element` must be child of its popper element!'); return data; } } var placement = data.placement.split('-')[0]; var _data$offsets = data.offsets, popper = _data$offsets.popper, reference = _data$offsets.reference; var isVertical = ['left', 'right'].indexOf(placement) !== -1; var len = isVertical ? 'height' : 'width'; var sideCapitalized = isVertical ? 'Top' : 'Left'; var side = sideCapitalized.toLowerCase(); var altSide = isVertical ? 'left' : 'top'; var opSide = isVertical ? 'bottom' : 'right'; var arrowElementSize = getOuterSizes(arrowElement)[len]; // // extends keepTogether behavior making sure the popper and its // reference have enough pixels in conjunction // // top/left side if (reference[opSide] - arrowElementSize < popper[side]) { data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowElementSize); } // bottom/right side if (reference[side] + arrowElementSize > popper[opSide]) { data.offsets.popper[side] += reference[side] + arrowElementSize - popper[opSide]; } data.offsets.popper = getClientRect(data.offsets.popper); // compute center of the popper var center = reference[side] + reference[len] / 2 - arrowElementSize / 2; // Compute the sideValue using the updated popper offsets // take popper margin in account because we don't have this info available var css = getStyleComputedProperty(data.instance.popper); var popperMarginSide = parseFloat(css['margin' + sideCapitalized], 10); var popperBorderSide = parseFloat(css['border' + sideCapitalized + 'Width'], 10); var sideValue = center - data.offsets.popper[side] - popperMarginSide - popperBorderSide; // prevent arrowElement from being placed not contiguously to its popper sideValue = Math.max(Math.min(popper[len] - arrowElementSize, sideValue), 0); data.arrowElement = arrowElement; data.offsets.arrow = (_data$offsets$arrow = {}, defineProperty(_data$offsets$arrow, side, Math.round(sideValue)), defineProperty(_data$offsets$arrow, altSide, ''), _data$offsets$arrow); return data; } /** * Get the opposite placement variation of the given one * @method * @memberof Popper.Utils * @argument {String} placement variation * @returns {String} flipped placement variation */ function getOppositeVariation(variation) { if (variation === 'end') { return 'start'; } else if (variation === 'start') { return 'end'; } return variation; } /** * List of accepted placements to use as values of the `placement` option.
* Valid placements are: * - `auto` * - `top` * - `right` * - `bottom` * - `left` * * Each placement can have a variation from this list: * - `-start` * - `-end` * * Variations are interpreted easily if you think of them as the left to right * written languages. Horizontally (`top` and `bottom`), `start` is left and `end` * is right.
* Vertically (`left` and `right`), `start` is top and `end` is bottom. * * Some valid examples are: * - `top-end` (on top of reference, right aligned) * - `right-start` (on right of reference, top aligned) * - `bottom` (on bottom, centered) * - `auto-end` (on the side with more space available, alignment depends by placement) * * @static * @type {Array} * @enum {String} * @readonly * @method placements * @memberof Popper */ var placements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start']; // Get rid of `auto` `auto-start` and `auto-end` var validPlacements = placements.slice(3); /** * Given an initial placement, returns all the subsequent placements * clockwise (or counter-clockwise). * * @method * @memberof Popper.Utils * @argument {String} placement - A valid placement (it accepts variations) * @argument {Boolean} counter - Set to true to walk the placements counterclockwise * @returns {Array} placements including their variations */ function clockwise(placement) { var counter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; var index = validPlacements.indexOf(placement); var arr = validPlacements.slice(index + 1).concat(validPlacements.slice(0, index)); return counter ? arr.reverse() : arr; } var BEHAVIORS = { FLIP: 'flip', CLOCKWISE: 'clockwise', COUNTERCLOCKWISE: 'counterclockwise' }; /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by update method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function flip(data, options) { // if `inner` modifier is enabled, we can't use the `flip` modifier if (isModifierEnabled(data.instance.modifiers, 'inner')) { return data; } if (data.flipped && data.placement === data.originalPlacement) { // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides return data; } var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, options.boundariesElement, data.positionFixed); var placement = data.placement.split('-')[0]; var placementOpposite = getOppositePlacement(placement); var variation = data.placement.split('-')[1] || ''; var flipOrder = []; switch (options.behavior) { case BEHAVIORS.FLIP: flipOrder = [placement, placementOpposite]; break; case BEHAVIORS.CLOCKWISE: flipOrder = clockwise(placement); break; case BEHAVIORS.COUNTERCLOCKWISE: flipOrder = clockwise(placement, true); break; default: flipOrder = options.behavior; } flipOrder.forEach(function (step, index) { if (placement !== step || flipOrder.length === index + 1) { return data; } placement = data.placement.split('-')[0]; placementOpposite = getOppositePlacement(placement); var popperOffsets = data.offsets.popper; var refOffsets = data.offsets.reference; // using floor because the reference offsets may contain decimals we are not going to consider here var floor = Math.floor; var overlapsRef = placement === 'left' && floor(popperOffsets.right) > floor(refOffsets.left) || placement === 'right' && floor(popperOffsets.left) < floor(refOffsets.right) || placement === 'top' && floor(popperOffsets.bottom) > floor(refOffsets.top) || placement === 'bottom' && floor(popperOffsets.top) < floor(refOffsets.bottom); var overflowsLeft = floor(popperOffsets.left) < floor(boundaries.left); var overflowsRight = floor(popperOffsets.right) > floor(boundaries.right); var overflowsTop = floor(popperOffsets.top) < floor(boundaries.top); var overflowsBottom = floor(popperOffsets.bottom) > floor(boundaries.bottom); var overflowsBoundaries = placement === 'left' && overflowsLeft || placement === 'right' && overflowsRight || placement === 'top' && overflowsTop || placement === 'bottom' && overflowsBottom; // flip the variation if required var isVertical = ['top', 'bottom'].indexOf(placement) !== -1; // flips variation if reference element overflows boundaries var flippedVariationByRef = !!options.flipVariations && (isVertical && variation === 'start' && overflowsLeft || isVertical && variation === 'end' && overflowsRight || !isVertical && variation === 'start' && overflowsTop || !isVertical && variation === 'end' && overflowsBottom); // flips variation if popper content overflows boundaries var flippedVariationByContent = !!options.flipVariationsByContent && (isVertical && variation === 'start' && overflowsRight || isVertical && variation === 'end' && overflowsLeft || !isVertical && variation === 'start' && overflowsBottom || !isVertical && variation === 'end' && overflowsTop); var flippedVariation = flippedVariationByRef || flippedVariationByContent; if (overlapsRef || overflowsBoundaries || flippedVariation) { // this boolean to detect any flip loop data.flipped = true; if (overlapsRef || overflowsBoundaries) { placement = flipOrder[index + 1]; } if (flippedVariation) { variation = getOppositeVariation(variation); } data.placement = placement + (variation ? '-' + variation : ''); // this object contains `position`, we want to preserve it along with // any additional property we may add in the future data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement)); data = runModifiers(data.instance.modifiers, data, 'flip'); } }); return data; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by update method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function keepTogether(data) { var _data$offsets = data.offsets, popper = _data$offsets.popper, reference = _data$offsets.reference; var placement = data.placement.split('-')[0]; var floor = Math.floor; var isVertical = ['top', 'bottom'].indexOf(placement) !== -1; var side = isVertical ? 'right' : 'bottom'; var opSide = isVertical ? 'left' : 'top'; var measurement = isVertical ? 'width' : 'height'; if (popper[side] < floor(reference[opSide])) { data.offsets.popper[opSide] = floor(reference[opSide]) - popper[measurement]; } if (popper[opSide] > floor(reference[side])) { data.offsets.popper[opSide] = floor(reference[side]); } return data; } /** * Converts a string containing value + unit into a px value number * @function * @memberof {modifiers~offset} * @private * @argument {String} str - Value + unit string * @argument {String} measurement - `height` or `width` * @argument {Object} popperOffsets * @argument {Object} referenceOffsets * @returns {Number|String} * Value in pixels, or original string if no values were extracted */ function toValue(str, measurement, popperOffsets, referenceOffsets) { // separate value from unit var split = str.match(/((?:\-|\+)?\d*\.?\d*)(.*)/); var value = +split[1]; var unit = split[2]; // If it's not a number it's an operator, I guess if (!value) { return str; } if (unit.indexOf('%') === 0) { var element = void 0; switch (unit) { case '%p': element = popperOffsets; break; case '%': case '%r': default: element = referenceOffsets; } var rect = getClientRect(element); return rect[measurement] / 100 * value; } else if (unit === 'vh' || unit === 'vw') { // if is a vh or vw, we calculate the size based on the viewport var size = void 0; if (unit === 'vh') { size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0); } else { size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0); } return size / 100 * value; } else { // if is an explicit pixel unit, we get rid of the unit and keep the value // if is an implicit unit, it's px, and we return just the value return value; } } /** * Parse an `offset` string to extrapolate `x` and `y` numeric offsets. * @function * @memberof {modifiers~offset} * @private * @argument {String} offset * @argument {Object} popperOffsets * @argument {Object} referenceOffsets * @argument {String} basePlacement * @returns {Array} a two cells array with x and y offsets in numbers */ function parseOffset(offset, popperOffsets, referenceOffsets, basePlacement) { var offsets = [0, 0]; // Use height if placement is left or right and index is 0 otherwise use width // in this way the first offset will use an axis and the second one // will use the other one var useHeight = ['right', 'left'].indexOf(basePlacement) !== -1; // Split the offset string to obtain a list of values and operands // The regex addresses values with the plus or minus sign in front (+10, -20, etc) var fragments = offset.split(/(\+|\-)/).map(function (frag) { return frag.trim(); }); // Detect if the offset string contains a pair of values or a single one // they could be separated by comma or space var divider = fragments.indexOf(find(fragments, function (frag) { return frag.search(/,|\s/) !== -1; })); if (fragments[divider] && fragments[divider].indexOf(',') === -1) { console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.'); } // If divider is found, we divide the list of values and operands to divide // them by ofset X and Y. var splitRegex = /\s*,\s*|\s+/; var ops = divider !== -1 ? [fragments.slice(0, divider).concat([fragments[divider].split(splitRegex)[0]]), [fragments[divider].split(splitRegex)[1]].concat(fragments.slice(divider + 1))] : [fragments]; // Convert the values with units to absolute pixels to allow our computations ops = ops.map(function (op, index) { // Most of the units rely on the orientation of the popper var measurement = (index === 1 ? !useHeight : useHeight) ? 'height' : 'width'; var mergeWithPrevious = false; return op // This aggregates any `+` or `-` sign that aren't considered operators // e.g.: 10 + +5 => [10, +, +5] .reduce(function (a, b) { if (a[a.length - 1] === '' && ['+', '-'].indexOf(b) !== -1) { a[a.length - 1] = b; mergeWithPrevious = true; return a; } else if (mergeWithPrevious) { a[a.length - 1] += b; mergeWithPrevious = false; return a; } else { return a.concat(b); } }, []) // Here we convert the string values into number values (in px) .map(function (str) { return toValue(str, measurement, popperOffsets, referenceOffsets); }); }); // Loop trough the offsets arrays and execute the operations ops.forEach(function (op, index) { op.forEach(function (frag, index2) { if (isNumeric(frag)) { offsets[index] += frag * (op[index2 - 1] === '-' ? -1 : 1); } }); }); return offsets; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by update method * @argument {Object} options - Modifiers configuration and options * @argument {Number|String} options.offset=0 * The offset value as described in the modifier description * @returns {Object} The data object, properly modified */ function offset(data, _ref) { var offset = _ref.offset; var placement = data.placement, _data$offsets = data.offsets, popper = _data$offsets.popper, reference = _data$offsets.reference; var basePlacement = placement.split('-')[0]; var offsets = void 0; if (isNumeric(+offset)) { offsets = [+offset, 0]; } else { offsets = parseOffset(offset, popper, reference, basePlacement); } if (basePlacement === 'left') { popper.top += offsets[0]; popper.left -= offsets[1]; } else if (basePlacement === 'right') { popper.top += offsets[0]; popper.left += offsets[1]; } else if (basePlacement === 'top') { popper.left += offsets[0]; popper.top -= offsets[1]; } else if (basePlacement === 'bottom') { popper.left += offsets[0]; popper.top += offsets[1]; } data.popper = popper; return data; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by `update` method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function preventOverflow(data, options) { var boundariesElement = options.boundariesElement || getOffsetParent(data.instance.popper); // If offsetParent is the reference element, we really want to // go one step up and use the next offsetParent as reference to // avoid to make this modifier completely useless and look like broken if (data.instance.reference === boundariesElement) { boundariesElement = getOffsetParent(boundariesElement); } // NOTE: DOM access here // resets the popper's position so that the document size can be calculated excluding // the size of the popper element itself var transformProp = getSupportedPropertyName('transform'); var popperStyles = data.instance.popper.style; // assignment to help minification var top = popperStyles.top, left = popperStyles.left, transform = popperStyles[transformProp]; popperStyles.top = ''; popperStyles.left = ''; popperStyles[transformProp] = ''; var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, boundariesElement, data.positionFixed); // NOTE: DOM access here // restores the original style properties after the offsets have been computed popperStyles.top = top; popperStyles.left = left; popperStyles[transformProp] = transform; options.boundaries = boundaries; var order = options.priority; var popper = data.offsets.popper; var check = { primary: function primary(placement) { var value = popper[placement]; if (popper[placement] < boundaries[placement] && !options.escapeWithReference) { value = Math.max(popper[placement], boundaries[placement]); } return defineProperty({}, placement, value); }, secondary: function secondary(placement) { var mainSide = placement === 'right' ? 'left' : 'top'; var value = popper[mainSide]; if (popper[placement] > boundaries[placement] && !options.escapeWithReference) { value = Math.min(popper[mainSide], boundaries[placement] - (placement === 'right' ? popper.width : popper.height)); } return defineProperty({}, mainSide, value); } }; order.forEach(function (placement) { var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary'; popper = _extends({}, popper, check[side](placement)); }); data.offsets.popper = popper; return data; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by `update` method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function shift(data) { var placement = data.placement; var basePlacement = placement.split('-')[0]; var shiftvariation = placement.split('-')[1]; // if shift shiftvariation is specified, run the modifier if (shiftvariation) { var _data$offsets = data.offsets, reference = _data$offsets.reference, popper = _data$offsets.popper; var isVertical = ['bottom', 'top'].indexOf(basePlacement) !== -1; var side = isVertical ? 'left' : 'top'; var measurement = isVertical ? 'width' : 'height'; var shiftOffsets = { start: defineProperty({}, side, reference[side]), end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement]) }; data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]); } return data; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by update method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function hide(data) { if (!isModifierRequired(data.instance.modifiers, 'hide', 'preventOverflow')) { return data; } var refRect = data.offsets.reference; var bound = find(data.instance.modifiers, function (modifier) { return modifier.name === 'preventOverflow'; }).boundaries; if (refRect.bottom < bound.top || refRect.left > bound.right || refRect.top > bound.bottom || refRect.right < bound.left) { // Avoid unnecessary DOM access if visibility hasn't changed if (data.hide === true) { return data; } data.hide = true; data.attributes['x-out-of-boundaries'] = ''; } else { // Avoid unnecessary DOM access if visibility hasn't changed if (data.hide === false) { return data; } data.hide = false; data.attributes['x-out-of-boundaries'] = false; } return data; } /** * @function * @memberof Modifiers * @argument {Object} data - The data object generated by `update` method * @argument {Object} options - Modifiers configuration and options * @returns {Object} The data object, properly modified */ function inner(data) { var placement = data.placement; var basePlacement = placement.split('-')[0]; var _data$offsets = data.offsets, popper = _data$offsets.popper, reference = _data$offsets.reference; var isHoriz = ['left', 'right'].indexOf(basePlacement) !== -1; var subtractLength = ['top', 'left'].indexOf(basePlacement) === -1; popper[isHoriz ? 'left' : 'top'] = reference[basePlacement] - (subtractLength ? popper[isHoriz ? 'width' : 'height'] : 0); data.placement = getOppositePlacement(placement); data.offsets.popper = getClientRect(popper); return data; } /** * Modifier function, each modifier can have a function of this type assigned * to its `fn` property.
* These functions will be called on each update, this means that you must * make sure they are performant enough to avoid performance bottlenecks. * * @function ModifierFn * @argument {dataObject} data - The data object generated by `update` method * @argument {Object} options - Modifiers configuration and options * @returns {dataObject} The data object, properly modified */ /** * Modifiers are plugins used to alter the behavior of your poppers.
* Popper.js uses a set of 9 modifiers to provide all the basic functionalities * needed by the library. * * Usually you don't want to override the `order`, `fn` and `onLoad` props. * All the other properties are configurations that could be tweaked. * @namespace modifiers */ var modifiers = { /** * Modifier used to shift the popper on the start or end of its reference * element.
* It will read the variation of the `placement` property.
* It can be one either `-end` or `-start`. * @memberof modifiers * @inner */ shift: { /** @prop {number} order=100 - Index used to define the order of execution */ order: 100, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: shift }, /** * The `offset` modifier can shift your popper on both its axis. * * It accepts the following units: * - `px` or unit-less, interpreted as pixels * - `%` or `%r`, percentage relative to the length of the reference element * - `%p`, percentage relative to the length of the popper element * - `vw`, CSS viewport width unit * - `vh`, CSS viewport height unit * * For length is intended the main axis relative to the placement of the popper.
* This means that if the placement is `top` or `bottom`, the length will be the * `width`. In case of `left` or `right`, it will be the `height`. * * You can provide a single value (as `Number` or `String`), or a pair of values * as `String` divided by a comma or one (or more) white spaces.
* The latter is a deprecated method because it leads to confusion and will be * removed in v2.
* Additionally, it accepts additions and subtractions between different units. * Note that multiplications and divisions aren't supported. * * Valid examples are: * ``` * 10 * '10%' * '10, 10' * '10%, 10' * '10 + 10%' * '10 - 5vh + 3%' * '-10px + 5vh, 5px - 6%' * ``` * > **NB**: If you desire to apply offsets to your poppers in a way that may make them overlap * > with their reference element, unfortunately, you will have to disable the `flip` modifier. * > You can read more on this at this [issue](https://github.com/FezVrasta/popper.js/issues/373). * * @memberof modifiers * @inner */ offset: { /** @prop {number} order=200 - Index used to define the order of execution */ order: 200, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: offset, /** @prop {Number|String} offset=0 * The offset value as described in the modifier description */ offset: 0 }, /** * Modifier used to prevent the popper from being positioned outside the boundary. * * A scenario exists where the reference itself is not within the boundaries.
* We can say it has "escaped the boundaries" — or just "escaped".
* In this case we need to decide whether the popper should either: * * - detach from the reference and remain "trapped" in the boundaries, or * - if it should ignore the boundary and "escape with its reference" * * When `escapeWithReference` is set to`true` and reference is completely * outside its boundaries, the popper will overflow (or completely leave) * the boundaries in order to remain attached to the edge of the reference. * * @memberof modifiers * @inner */ preventOverflow: { /** @prop {number} order=300 - Index used to define the order of execution */ order: 300, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: preventOverflow, /** * @prop {Array} [priority=['left','right','top','bottom']] * Popper will try to prevent overflow following these priorities by default, * then, it could overflow on the left and on top of the `boundariesElement` */ priority: ['left', 'right', 'top', 'bottom'], /** * @prop {number} padding=5 * Amount of pixel used to define a minimum distance between the boundaries * and the popper. This makes sure the popper always has a little padding * between the edges of its container */ padding: 5, /** * @prop {String|HTMLElement} boundariesElement='scrollParent' * Boundaries used by the modifier. Can be `scrollParent`, `window`, * `viewport` or any DOM element. */ boundariesElement: 'scrollParent' }, /** * Modifier used to make sure the reference and its popper stay near each other * without leaving any gap between the two. Especially useful when the arrow is * enabled and you want to ensure that it points to its reference element. * It cares only about the first axis. You can still have poppers with margin * between the popper and its reference element. * @memberof modifiers * @inner */ keepTogether: { /** @prop {number} order=400 - Index used to define the order of execution */ order: 400, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: keepTogether }, /** * This modifier is used to move the `arrowElement` of the popper to make * sure it is positioned between the reference element and its popper element. * It will read the outer size of the `arrowElement` node to detect how many * pixels of conjunction are needed. * * It has no effect if no `arrowElement` is provided. * @memberof modifiers * @inner */ arrow: { /** @prop {number} order=500 - Index used to define the order of execution */ order: 500, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: arrow, /** @prop {String|HTMLElement} element='[x-arrow]' - Selector or node used as arrow */ element: '[x-arrow]' }, /** * Modifier used to flip the popper's placement when it starts to overlap its * reference element. * * Requires the `preventOverflow` modifier before it in order to work. * * **NOTE:** this modifier will interrupt the current update cycle and will * restart it if it detects the need to flip the placement. * @memberof modifiers * @inner */ flip: { /** @prop {number} order=600 - Index used to define the order of execution */ order: 600, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: flip, /** * @prop {String|Array} behavior='flip' * The behavior used to change the popper's placement. It can be one of * `flip`, `clockwise`, `counterclockwise` or an array with a list of valid * placements (with optional variations) */ behavior: 'flip', /** * @prop {number} padding=5 * The popper will flip if it hits the edges of the `boundariesElement` */ padding: 5, /** * @prop {String|HTMLElement} boundariesElement='viewport' * The element which will define the boundaries of the popper position. * The popper will never be placed outside of the defined boundaries * (except if `keepTogether` is enabled) */ boundariesElement: 'viewport', /** * @prop {Boolean} flipVariations=false * The popper will switch placement variation between `-start` and `-end` when * the reference element overlaps its boundaries. * * The original placement should have a set variation. */ flipVariations: false, /** * @prop {Boolean} flipVariationsByContent=false * The popper will switch placement variation between `-start` and `-end` when * the popper element overlaps its reference boundaries. * * The original placement should have a set variation. */ flipVariationsByContent: false }, /** * Modifier used to make the popper flow toward the inner of the reference element. * By default, when this modifier is disabled, the popper will be placed outside * the reference element. * @memberof modifiers * @inner */ inner: { /** @prop {number} order=700 - Index used to define the order of execution */ order: 700, /** @prop {Boolean} enabled=false - Whether the modifier is enabled or not */ enabled: false, /** @prop {ModifierFn} */ fn: inner }, /** * Modifier used to hide the popper when its reference element is outside of the * popper boundaries. It will set a `x-out-of-boundaries` attribute which can * be used to hide with a CSS selector the popper when its reference is * out of boundaries. * * Requires the `preventOverflow` modifier before it in order to work. * @memberof modifiers * @inner */ hide: { /** @prop {number} order=800 - Index used to define the order of execution */ order: 800, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: hide }, /** * Computes the style that will be applied to the popper element to gets * properly positioned. * * Note that this modifier will not touch the DOM, it just prepares the styles * so that `applyStyle` modifier can apply it. This separation is useful * in case you need to replace `applyStyle` with a custom implementation. * * This modifier has `850` as `order` value to maintain backward compatibility * with previous versions of Popper.js. Expect the modifiers ordering method * to change in future major versions of the library. * * @memberof modifiers * @inner */ computeStyle: { /** @prop {number} order=850 - Index used to define the order of execution */ order: 850, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: computeStyle, /** * @prop {Boolean} gpuAcceleration=true * If true, it uses the CSS 3D transformation to position the popper. * Otherwise, it will use the `top` and `left` properties */ gpuAcceleration: true, /** * @prop {string} [x='bottom'] * Where to anchor the X axis (`bottom` or `top`). AKA X offset origin. * Change this if your popper should grow in a direction different from `bottom` */ x: 'bottom', /** * @prop {string} [x='left'] * Where to anchor the Y axis (`left` or `right`). AKA Y offset origin. * Change this if your popper should grow in a direction different from `right` */ y: 'right' }, /** * Applies the computed styles to the popper element. * * All the DOM manipulations are limited to this modifier. This is useful in case * you want to integrate Popper.js inside a framework or view library and you * want to delegate all the DOM manipulations to it. * * Note that if you disable this modifier, you must make sure the popper element * has its position set to `absolute` before Popper.js can do its work! * * Just disable this modifier and define your own to achieve the desired effect. * * @memberof modifiers * @inner */ applyStyle: { /** @prop {number} order=900 - Index used to define the order of execution */ order: 900, /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */ enabled: true, /** @prop {ModifierFn} */ fn: applyStyle, /** @prop {Function} */ onLoad: applyStyleOnLoad, /** * @deprecated since version 1.10.0, the property moved to `computeStyle` modifier * @prop {Boolean} gpuAcceleration=true * If true, it uses the CSS 3D transformation to position the popper. * Otherwise, it will use the `top` and `left` properties */ gpuAcceleration: undefined } }; /** * The `dataObject` is an object containing all the information used by Popper.js. * This object is passed to modifiers and to the `onCreate` and `onUpdate` callbacks. * @name dataObject * @property {Object} data.instance The Popper.js instance * @property {String} data.placement Placement applied to popper * @property {String} data.originalPlacement Placement originally defined on init * @property {Boolean} data.flipped True if popper has been flipped by flip modifier * @property {Boolean} data.hide True if the reference element is out of boundaries, useful to know when to hide the popper * @property {HTMLElement} data.arrowElement Node used as arrow by arrow modifier * @property {Object} data.styles Any CSS property defined here will be applied to the popper. It expects the JavaScript nomenclature (eg. `marginBottom`) * @property {Object} data.arrowStyles Any CSS property defined here will be applied to the popper arrow. It expects the JavaScript nomenclature (eg. `marginBottom`) * @property {Object} data.boundaries Offsets of the popper boundaries * @property {Object} data.offsets The measurements of popper, reference and arrow elements * @property {Object} data.offsets.popper `top`, `left`, `width`, `height` values * @property {Object} data.offsets.reference `top`, `left`, `width`, `height` values * @property {Object} data.offsets.arrow] `top` and `left` offsets, only one of them will be different from 0 */ /** * Default options provided to Popper.js constructor.
* These can be overridden using the `options` argument of Popper.js.
* To override an option, simply pass an object with the same * structure of the `options` object, as the 3rd argument. For example: * ``` * new Popper(ref, pop, { * modifiers: { * preventOverflow: { enabled: false } * } * }) * ``` * @type {Object} * @static * @memberof Popper */ var Defaults = { /** * Popper's placement. * @prop {Popper.placements} placement='bottom' */ placement: 'bottom', /** * Set this to true if you want popper to position it self in 'fixed' mode * @prop {Boolean} positionFixed=false */ positionFixed: false, /** * Whether events (resize, scroll) are initially enabled. * @prop {Boolean} eventsEnabled=true */ eventsEnabled: true, /** * Set to true if you want to automatically remove the popper when * you call the `destroy` method. * @prop {Boolean} removeOnDestroy=false */ removeOnDestroy: false, /** * Callback called when the popper is created.
* By default, it is set to no-op.
* Access Popper.js instance with `data.instance`. * @prop {onCreate} */ onCreate: function onCreate() {}, /** * Callback called when the popper is updated. This callback is not called * on the initialization/creation of the popper, but only on subsequent * updates.
* By default, it is set to no-op.
* Access Popper.js instance with `data.instance`. * @prop {onUpdate} */ onUpdate: function onUpdate() {}, /** * List of modifiers used to modify the offsets before they are applied to the popper. * They provide most of the functionalities of Popper.js. * @prop {modifiers} */ modifiers: modifiers }; /** * @callback onCreate * @param {dataObject} data */ /** * @callback onUpdate * @param {dataObject} data */ // Utils // Methods var Popper = function () { /** * Creates a new Popper.js instance. * @class Popper * @param {Element|referenceObject} reference - The reference element used to position the popper * @param {Element} popper - The HTML / XML element used as the popper * @param {Object} options - Your custom options to override the ones defined in [Defaults](#defaults) * @return {Object} instance - The generated Popper.js instance */ function Popper(reference, popper) { var _this = this; var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; classCallCheck(this, Popper); this.scheduleUpdate = function () { return requestAnimationFrame(_this.update); }; // make update() debounced, so that it only runs at most once-per-tick this.update = debounce(this.update.bind(this)); // with {} we create a new object with the options inside it this.options = _extends({}, Popper.Defaults, options); // init state this.state = { isDestroyed: false, isCreated: false, scrollParents: [] }; // get reference and popper elements (allow jQuery wrappers) this.reference = reference && reference.jquery ? reference[0] : reference; this.popper = popper && popper.jquery ? popper[0] : popper; // Deep merge modifiers options this.options.modifiers = {}; Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) { _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {}); }); // Refactoring modifiers' list (Object => Array) this.modifiers = Object.keys(this.options.modifiers).map(function (name) { return _extends({ name: name }, _this.options.modifiers[name]); }) // sort the modifiers by order .sort(function (a, b) { return a.order - b.order; }); // modifiers have the ability to execute arbitrary code when Popper.js get inited // such code is executed in the same order of its modifier // they could add new properties to their options configuration // BE AWARE: don't add options to `options.modifiers.name` but to `modifierOptions`! this.modifiers.forEach(function (modifierOptions) { if (modifierOptions.enabled && isFunction(modifierOptions.onLoad)) { modifierOptions.onLoad(_this.reference, _this.popper, _this.options, modifierOptions, _this.state); } }); // fire the first update to position the popper in the right place this.update(); var eventsEnabled = this.options.eventsEnabled; if (eventsEnabled) { // setup event listeners, they will take care of update the position in specific situations this.enableEventListeners(); } this.state.eventsEnabled = eventsEnabled; } // We can't use class properties because they don't get listed in the // class prototype and break stuff like Sinon stubs createClass(Popper, [{ key: 'update', value: function update$$1() { return update.call(this); } }, { key: 'destroy', value: function destroy$$1() { return destroy.call(this); } }, { key: 'enableEventListeners', value: function enableEventListeners$$1() { return enableEventListeners.call(this); } }, { key: 'disableEventListeners', value: function disableEventListeners$$1() { return disableEventListeners.call(this); } /** * Schedules an update. It will run on the next UI update available. * @method scheduleUpdate * @memberof Popper */ /** * Collection of utilities useful when writing custom modifiers. * Starting from version 1.7, this method is available only if you * include `popper-utils.js` before `popper.js`. * * **DEPRECATION**: This way to access PopperUtils is deprecated * and will be removed in v2! Use the PopperUtils module directly instead. * Due to the high instability of the methods contained in Utils, we can't * guarantee them to follow semver. Use them at your own risk! * @static * @private * @type {Object} * @deprecated since version 1.8 * @member Utils * @memberof Popper */ }]); return Popper; }(); /** * The `referenceObject` is an object that provides an interface compatible with Popper.js * and lets you use it as replacement of a real DOM node.
* You can use this method to position a popper relatively to a set of coordinates * in case you don't have a DOM node to use as reference. * * ``` * new Popper(referenceObject, popperNode); * ``` * * NB: This feature isn't supported in Internet Explorer 10. * @name referenceObject * @property {Function} data.getBoundingClientRect * A function that returns a set of coordinates compatible with the native `getBoundingClientRect` method. * @property {number} data.clientWidth * An ES6 getter that will return the width of the virtual reference element. * @property {number} data.clientHeight * An ES6 getter that will return the height of the virtual reference element. */ Popper.Utils = (typeof window !== 'undefined' ? window : global).PopperUtils; Popper.placements = placements; Popper.Defaults = Defaults; /* harmony default export */ __webpack_exports__["default"] = (Popper); //# sourceMappingURL=popper.js.map /* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../../webpack/buildin/global.js */ "./node_modules/webpack/buildin/global.js"))) /***/ }), /***/ "./node_modules/siema/dist/siema.min.js": /*!**********************************************!*\ !*** ./node_modules/siema/dist/siema.min.js ***! \**********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { !function(e,t){ true?module.exports=t():undefined}("undefined"!=typeof self?self:this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var n=i[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var i={};return t.m=e,t.c=i,t.d=function(e,i,r){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,i){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s=function(){function e(e,t){for(var i=0;i=e&&(this.perPage=this.config.perPage[e])}}},{key:"prev",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide-e<0){this.disableTransition();var r=this.currentSlide+this.innerElements.length,n=this.perPage,s=r+n,l=(this.config.rtl?1:-1)*s*(this.selectorWidth/this.perPage),o=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(l+o)+"px, 0, 0)",this.currentSlide=r-e}else this.currentSlide=this.currentSlide-e}else this.currentSlide=Math.max(this.currentSlide-e,0);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"next",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide+e>this.innerElements.length-this.perPage){this.disableTransition();var r=this.currentSlide-this.innerElements.length,n=this.perPage,s=r+n,l=(this.config.rtl?1:-1)*s*(this.selectorWidth/this.perPage),o=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(l+o)+"px, 0, 0)",this.currentSlide=r+e}else this.currentSlide=this.currentSlide+e}else this.currentSlide=Math.min(this.currentSlide+e,this.innerElements.length-this.perPage);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"disableTransition",value:function(){this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing}},{key:"enableTransition",value:function(){this.sliderFrame.style.webkitTransition="all "+this.config.duration+"ms "+this.config.easing,this.sliderFrame.style.transition="all "+this.config.duration+"ms "+this.config.easing}},{key:"goTo",value:function(e,t){if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;this.currentSlide=this.config.loop?e%this.innerElements.length:Math.min(Math.max(e,0),this.innerElements.length-this.perPage),i!==this.currentSlide&&(this.slideToCurrent(),this.config.onChange.call(this),t&&t.call(this))}}},{key:"slideToCurrent",value:function(e){var t=this,i=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,r=(this.config.rtl?1:-1)*i*(this.selectorWidth/this.perPage);e?requestAnimationFrame(function(){requestAnimationFrame(function(){t.enableTransition(),t.sliderFrame.style[t.transformProperty]="translate3d("+r+"px, 0, 0)"})}):this.sliderFrame.style[this.transformProperty]="translate3d("+r+"px, 0, 0)"}},{key:"updateAfterDrag",value:function(){var e=(this.config.rtl?-1:1)*(this.drag.endX-this.drag.startX),t=Math.abs(e),i=this.config.multipleDrag?Math.ceil(t/(this.selectorWidth/this.perPage)):1,r=e>0&&this.currentSlide-i<0,n=e<0&&this.currentSlide+i>this.innerElements.length-this.perPage;e>0&&t>this.config.threshold&&this.innerElements.length>this.perPage?this.prev(i):e<0&&t>this.config.threshold&&this.innerElements.length>this.perPage&&this.next(i),this.slideToCurrent(r||n)}},{key:"resizeHandler",value:function(){this.resolveSlidesNumber(),this.currentSlide+this.perPage>this.innerElements.length&&(this.currentSlide=this.innerElements.length<=this.perPage?0:this.innerElements.length-this.perPage),this.selectorWidth=this.selector.offsetWidth,this.buildSliderFrame()}},{key:"clearDrag",value:function(){this.drag={startX:0,endX:0,startY:0,letItGo:null,preventClick:this.drag.preventClick}}},{key:"touchstartHandler",value:function(e){-1!==["TEXTAREA","OPTION","INPUT","SELECT"].indexOf(e.target.nodeName)||(e.stopPropagation(),this.pointerDown=!0,this.drag.startX=e.touches[0].pageX,this.drag.startY=e.touches[0].pageY)}},{key:"touchendHandler",value:function(e){e.stopPropagation(),this.pointerDown=!1,this.enableTransition(),this.drag.endX&&this.updateAfterDrag(),this.clearDrag()}},{key:"touchmoveHandler",value:function(e){if(e.stopPropagation(),null===this.drag.letItGo&&(this.drag.letItGo=Math.abs(this.drag.startY-e.touches[0].pageY)=this.innerElements.length)throw new Error("Item to remove doesn't exist 😭");var i=ethis.innerElements.length+1)throw new Error("Unable to inset it at this index 😭");if(-1!==this.innerElements.indexOf(e))throw new Error("The same item in a carousel? Really? Nope 😭");var r=t<=this.currentSlide>0&&this.innerElements.length;this.currentSlide=r?this.currentSlide+1:this.currentSlide,this.innerElements.splice(t,0,e),this.buildSliderFrame(),i&&i.call(this)}},{key:"prepend",value:function(e,t){this.insert(e,0),t&&t.call(this)}},{key:"append",value:function(e,t){this.insert(e,this.innerElements.length+1),t&&t.call(this)}},{key:"destroy",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=arguments[1];if(this.detachEvents(),this.selector.style.cursor="auto",e){for(var i=document.createDocumentFragment(),r=0;r // tags it will allow on a page if (!options.singleton && typeof options.singleton !== "boolean") options.singleton = isOldIE(); // By default, add " /***/ }), /***/ "./src/assets/bx-right-arrow.svg": /*!***************************************!*\ !*** ./src/assets/bx-right-arrow.svg ***! \***************************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/check.svg": /*!******************************!*\ !*** ./src/assets/check.svg ***! \******************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/cover.svg": /*!******************************!*\ !*** ./src/assets/cover.svg ***! \******************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/drag.svg": /*!*****************************!*\ !*** ./src/assets/drag.svg ***! \*****************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/eraser.svg": /*!*******************************!*\ !*** ./src/assets/eraser.svg ***! \*******************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/finish.svg": /*!*******************************!*\ !*** ./src/assets/finish.svg ***! \*******************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "teacher_ppt_bar_btn_finishCreated with Sketch." /***/ }), /***/ "./src/assets/highlight.svg": /*!**********************************!*\ !*** ./src/assets/highlight.svg ***! \**********************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/line.svg": /*!*****************************!*\ !*** ./src/assets/line.svg ***! \*****************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/rect.svg": /*!*****************************!*\ !*** ./src/assets/rect.svg ***! \*****************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/rollback.svg": /*!*********************************!*\ !*** ./src/assets/rollback.svg ***! \*********************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/text.svg": /*!*****************************!*\ !*** ./src/assets/text.svg ***! \*****************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/assets/times.svg": /*!******************************!*\ !*** ./src/assets/times.svg ***! \******************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = "" /***/ }), /***/ "./src/drawboard/Baseboard/index.ts": /*!******************************************!*\ !*** ./src/drawboard/Baseboard/index.ts ***! \******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var uuid_1 = __webpack_require__(/*! ./../../utils/uuid */ "./src/utils/uuid.ts"); var index_1 = __webpack_require__(/*! ./../../renderer/SvgHelper/index */ "./src/renderer/SvgHelper/index.ts"); var Baseboard = function () { function Baseboard(source) { var _this = this; this.id = uuid_1.uuid(); this.isFullscreen = false; this.initBoard = function (mountContainer) { _this.boardHolder = document.createElement('div'); _this.boardHolder.id = "fcw-board-holder-" + _this.id; _this.boardHolder.className = "fcw-board-holder"; _this.boardHolder.style.zIndex = '999'; _this.boardHolder.style.setProperty('touch-action', 'none'); _this.boardHolder.style.setProperty('-ms-touch-action', 'none'); mountContainer.appendChild(_this.boardHolder); _this.boardCanvas = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); _this.boardCanvas.setAttribute('xmlns', 'http://www.w3.org/2000/svg'); _this.boardCanvas.setAttribute('width', _this.width.toString()); _this.boardCanvas.setAttribute('height', _this.height.toString()); _this.boardCanvas.setAttribute('viewBox', '0 0 ' + _this.width.toString() + ' ' + _this.height.toString()); _this.boardHolder.style.position = 'fixed'; _this.boardHolder.style.width = _this.width + "px"; _this.boardHolder.style.height = _this.height + "px"; _this.boardHolder.style.transformOrigin = 'top left'; _this.positionBoard(); _this.defs = index_1.SvgHelper.createDefs(); _this.boardCanvas.appendChild(_this.defs); _this.boardHolder.appendChild(_this.boardCanvas); }; this.positionBoard = function () { _this.boardHolder.style.top = _this.targetRect.top + 'px'; _this.boardHolder.style.left = _this.targetRect.left + 'px'; }; this.source = source; if (source.imgEle) { this.target = source.imgEle; this.width = this.target.clientWidth; this.height = this.target.clientHeight; } } return Baseboard; }(); exports.Baseboard = Baseboard; /***/ }), /***/ "./src/drawboard/Drawboard/index.less": /*!********************************************!*\ !*** ./src/drawboard/Drawboard/index.less ***! \********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { var content = __webpack_require__(/*! !../../../node_modules/css-loader/dist/cjs.js??ref--11-1!../../../node_modules/postcss-loader/src!../../../node_modules/less-loader/dist/cjs.js??ref--11-3!./index.less */ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/drawboard/Drawboard/index.less"); if(typeof content === 'string') content = [[module.i, content, '']]; var transform; var insertInto; var options = {"hmr":true} options.transform = transform options.insertInto = undefined; var update = __webpack_require__(/*! ../../../node_modules/style-loader/lib/addStyles.js */ "./node_modules/style-loader/lib/addStyles.js")(content, options); if(content.locals) module.exports = content.locals; if(false) {} /***/ }), /***/ "./src/drawboard/Drawboard/index.ts": /*!******************************************!*\ !*** ./src/drawboard/Drawboard/index.ts ***! \******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var fc_hotkeys_1 = __webpack_require__(/*! fc-hotkeys */ "./node_modules/fc-hotkeys/dist/index.js"); var debounce = __webpack_require__(/*! lodash.debounce */ "./node_modules/lodash.debounce/index.js"); var index_1 = __webpack_require__(/*! ./../Baseboard/index */ "./src/drawboard/Baseboard/index.ts"); var toolbar_items_1 = __webpack_require__(/*! ./../../toolbar/toolbar-items */ "./src/toolbar/toolbar-items.ts"); var Synthetizer_1 = __webpack_require__(/*! ../../renderer/Synthetizer */ "./src/renderer/Synthetizer/index.ts"); var Toolbar_1 = __webpack_require__(/*! ../../toolbar/Toolbar */ "./src/toolbar/Toolbar.ts"); __webpack_require__(/*! ./index.less */ "./src/drawboard/Drawboard/index.less"); var layout_1 = __webpack_require__(/*! ../../utils/layout */ "./src/utils/layout.ts"); var index_2 = __webpack_require__(/*! ../../markers/RectMarker/index */ "./src/markers/RectMarker/index.ts"); var index_3 = __webpack_require__(/*! ../../markers/HighlightMarker/index */ "./src/markers/HighlightMarker/index.ts"); var index_4 = __webpack_require__(/*! ../../markers/CoverMarker/index */ "./src/markers/CoverMarker/index.ts"); var index_5 = __webpack_require__(/*! ../../markers/LineMarker/index */ "./src/markers/LineMarker/index.ts"); var index_6 = __webpack_require__(/*! ../../markers/ArrowMarker/index */ "./src/markers/ArrowMarker/index.ts"); var index_7 = __webpack_require__(/*! ../../markers/TextMarker/index */ "./src/markers/TextMarker/index.ts"); var Drawboard = function (_super) { __extends(Drawboard, _super); function Drawboard(source, _a) { var _b = _a === void 0 ? {} : _a, _c = _b.allowKeyboard, allowKeyboard = _c === void 0 ? true : _c, extraToolbarItems = _b.extraToolbarItems, mountContainer = _b.mountContainer, page = _b.page, zIndex = _b.zIndex, onChange = _b.onChange; var _this = _super.call(this, source) || this; _this.mountContainer = document.body; _this.scale = 1.0; _this.zIndex = 999; _this.allowKeyboard = true; _this.onComplete = function () {}; _this.onChange = function () {}; _this.open = function (onComplete, onCancel) { if (onComplete) { _this.onComplete = onComplete; } if (onCancel) { _this.onCancel = onCancel; } _this.setTargetRect(); _this.initBoard(_this.mountContainer); _this.attachEvents(); _this.setStyles(); window.addEventListener('resize', _this.adjustUI); if (_this.page && _this.page.mode === 'master' || !_this.page) { _this.showUI(); } }; _this.hide = function () { if (_this.source.imgSrc) { _this.target.style.display = 'none'; } _this.boardHolder.style.visibility = 'hidden'; _this.boardHolder.style.zIndex = '-1'; if (_this.toolbar) { _this.toolbar.hide(); } }; _this.show = function () { if (_this.source.imgSrc) { _this.target.style.display = 'block'; } _this.boardHolder.style.visibility = 'visible'; _this.boardHolder.style.zIndex = "" + _this.zIndex; if (_this.toolbar) { _this.toolbar.show(); } }; _this.destroy = function () { if (_this.toolbarUI) { _this.mountContainer.removeChild(_this.toolbarUI); } if (_this.boardCanvas) { _this.mountContainer.removeChild(_this.boardHolder); } if (_this.listener) { _this.listener.reset(); } }; _this.render = function (onComplete, onCancel) { _this.onComplete = onComplete; if (onCancel) { _this.onCancel = onCancel; } _this.selectMarker(null); _this.startRender(_this.renderFinished); }; _this.addMarker = function (markerType, _a) { var _b = _a === void 0 ? {} : _a, id = _b.id, originX = _b.originX, originY = _b.originY; var marker = markerType.createMarker(_this.page); if (id) { marker.id = id; } marker.drawboard = _this; marker.onSelected = _this.selectMarker; marker.onChange = _this.onChange; if (marker.defs && marker.defs.length > 0) { for (var _i = 0, _c = marker.defs; _i < _c.length; _i++) { var d = _c[_i]; if (d.id && !_this.boardCanvas.getElementById(d.id)) { _this.defs.appendChild(d); } } } _this.markers.push(marker); _this.selectMarker(marker); _this.boardCanvas.appendChild(marker.visual); var x; var y; if (originX && originY) { x = originX; y = originY; } else { var bbox = marker.visual.getBBox(); x = _this.width / 2 / _this.scale - bbox.width / 2; y = _this.height / 2 / _this.scale - bbox.height / 2; } _this.onChange({ target: 'marker', parentId: _this.page ? _this.page.id : _this.id, event: 'addMarker', marker: { type: marker.type, id: marker.id, dx: x, dy: y } }); marker.moveTo(x, y); return marker; }; _this.deleteActiveMarker = function () { _this.deleteMarkerWithEvent(_this.activeMarker); }; _this.clearMarkers = function () { _this.markers.slice().forEach(function (marker) { _this.deleteMarkerWithEvent(marker); }); }; _this.deleteMarkerWithEvent = function (marker) { if (marker) { if (_this.onChange) { _this.onChange({ event: 'removeMarker', id: marker.id, target: 'marker', marker: { id: marker.id } }); } _this.deleteMarker(marker); } }; _this.setTargetRect = function () { var targetRect = _this.target.getBoundingClientRect(); var bodyRect = document.body.parentElement.getBoundingClientRect(); _this.targetRect = { left: targetRect.left - bodyRect.left, top: targetRect.top - bodyRect.top }; }; _this.startRender = function (done) { var renderer = new Synthetizer_1.Synthetizer(); renderer.rasterize(_this.target, _this.boardCanvas, done); }; _this.attachEvents = function () { _this.boardCanvas.addEventListener('mousedown', _this.mouseDown); _this.boardCanvas.addEventListener('mousemove', _this.mouseMove); _this.boardCanvas.addEventListener('mouseup', _this.mouseUp); }; _this.mouseDown = function (ev) { if (_this.activeMarker && (ev.buttons & 1) > 0) { _this.activeMarker.deselect(); _this.activeMarker = null; } }; _this.mouseMove = function (ev) { if (_this.activeMarker && (ev.buttons & 1) > 0) { _this.activeMarker.manipulate(ev); } }; _this.mouseUp = function (ev) { if (_this.activeMarker) { _this.activeMarker.endManipulation(); } }; _this.onKeyboard = function (e, _a) { var hotkey = _a.hotkey; switch (hotkey) { case 'Shift+R': _this.addMarker(index_2.RectMarker); return; case 'Shift+H': _this.addMarker(index_3.HighlightMarker); return; case 'Shift+C': _this.addMarker(index_4.CoverMarker); return; case 'Shift+L': _this.addMarker(index_5.LineMarker); return; case 'Shift+A': _this.addMarker(index_6.ArrowMarker); return; case 'Shift+T': _this.addMarker(index_7.TextMarker); return; case 'ESC': _this.page.whiteboard.rollbackSnap(); return; default: break; } if (!_this.activeMarker) { return; } switch (hotkey) { case 'UP': _this.activeMarker.move(0, -10); return; case 'LEFT': _this.activeMarker.move(-10, 0); return; case 'RIGHT': _this.activeMarker.move(10, 0); return; case 'DOWN': _this.activeMarker.move(0, 10); return; case 'BACKSPACE': _this.deleteActiveMarker(); return; default: return; } }; _this.adjustUI = function (ev) { _this.adjustSize(); _this.positionUI(); }; _this.adjustSize = function () { _this.width = _this.target.clientWidth; _this.height = _this.target.clientHeight; var scale = _this.target.clientWidth / _this.boardHolder.clientWidth; if (scale !== 1.0) { _this.scale *= scale; _this.boardHolder.style.width = _this.width + "px"; _this.boardHolder.style.height = _this.height + "px"; _this.boardHolder.style.transform = "scale(" + _this.scale + ")"; } }; _this.positionUI = function () { _this.setTargetRect(); _this.positionBoard(); _this.positionToolbar(); }; _this.positionToolbar = function () { if (_this.toolbarUI && _this.targetRect) { _this.toolbarUI.style.left = _this.targetRect.left + _this.target.offsetWidth - _this.toolbarUI.clientWidth + "px"; _this.toolbarUI.style.top = _this.targetRect.top - _this.toolbarUI.clientHeight + "px"; } }; _this.showUI = function () { _this.toolbar = new Toolbar_1.Toolbar(_this.toolbarItems, _this.toolbarClick); _this.toolbar.zIndex = _this.zIndex + 1; _this.toolbarUI = _this.toolbar.getUI(_this); _this.boardHolder.appendChild(_this.toolbarUI); _this.toolbarUI.style.position = 'absolute'; _this.positionToolbar(); _this.toolbar.show(); _this.toolbar.toolbarButtons.forEach(function (button) { if (button.toolbarItem.draggable) { button.container.draggable = true; button.container.ondragstart = function (ev) { if (ev) { ev.dataTransfer.setData('id', button.id); } }; } }); _this.boardCanvas.ondragover = function (ev) { ev.preventDefault(); }; _this.boardCanvas.ondrop = function (ev) { var markerX = ev.x; var markerY = ev.y; var rect = _this.boardHolder.getBoundingClientRect(); if (layout_1.rectContains(rect, { x: markerX, y: markerY })) { var buttonId = ev.dataTransfer.getData('id'); var button = _this.toolbar.toolbarButtonMap[buttonId]; if (button.toolbarItem && button.toolbarItem.markerType) { _this.addMarker(button.toolbarItem.markerType, { originX: markerX - rect.left, originY: markerY - rect.top }); } } }; }; _this.setStyles = function () { var editorStyleSheet = document.createElementNS('http://www.w3.org/2000/svg', 'style'); editorStyleSheet.innerHTML = "\n .rect-marker .render-visual {\n stroke: #ff0000;\n stroke-width: 3;\n fill: transparent;\n }\n .cover-marker .render-visual {\n stroke-width: 0;\n fill: #000000;\n }\n .highlight-marker .render-visual {\n stroke: transparent;\n stroke-width: 0;\n fill: #ffff00;\n fill-opacity: 0.4;\n }\n .line-marker .render-visual {\n stroke: #ff0000;\n stroke-width: 3;\n fill: transparent;\n }\n .arrow-marker .render-visual {\n stroke: #ff0000;\n stroke-width: 3;\n fill: transparent;\n }\n .arrow-marker-tip {\n stroke-width: 0;\n fill: #ff0000;\n }\n .text-marker text {\n fill: #ff0000;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\",\n Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\",\n \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n }\n .fc-whiteboard-rect-control-box .fc-whiteboard-rect-control-rect {\n stroke: black;\n stroke-width: 1;\n stroke-opacity: 0.5;\n stroke-dasharray: 3, 2;\n fill: transparent;\n }\n .fc-whiteboard-control-grip {\n fill: #cccccc;\n stroke: #333333;\n stroke-width: 2;\n }\n "; _this.boardCanvas.appendChild(editorStyleSheet); }; _this.toolbarClick = function (ev, toolbarItem) { if (toolbarItem.onClick) { toolbarItem.onClick(); } else if (toolbarItem.markerType) { _this.addMarker(toolbarItem.markerType); } else { switch (toolbarItem.name) { case 'delete': { _this.deleteActiveMarker(); break; } case 'pointer': { if (_this.activeMarker) { _this.selectMarker(null); } break; } case 'close': { _this.cancel(); break; } case 'ok': { _this.complete(); break; } default: break; } } }; _this.selectMarker = function (marker) { if (_this.activeMarker && _this.activeMarker !== marker) { _this.activeMarker.deselect(); } _this.activeMarker = marker; }; _this.deleteMarker = function (marker) { _this.boardCanvas.removeChild(marker.visual); if (_this.activeMarker === marker) { _this.activeMarker = null; } _this.markers.splice(_this.markers.indexOf(marker), 1); }; _this.complete = function () { _this.selectMarker(null); _this.startRender(_this.renderFinishedClose); }; _this.cancel = function () { _this.destroy(); if (_this.onCancel) { _this.onCancel(); } }; _this.renderFinished = function (dataUrl) { _this.onComplete(dataUrl); }; _this.renderFinishedClose = function (dataUrl) { _this.destroy(); _this.onComplete(dataUrl); }; if (page) { _this.page = page; } if (zIndex) { _this.zIndex = zIndex; } _this.allowKeyboard = allowKeyboard; _this.markers = []; _this.activeMarker = null; var toolbarItems = toolbar_items_1.getToolbars(page); if (extraToolbarItems) { toolbarItems.push.apply(toolbarItems, extraToolbarItems); } _this.toolbarItems = toolbarItems; if (onChange) { _this.onChange = onChange; } if (allowKeyboard && _this.page && _this.page.mode === 'master') { _this.listener = new fc_hotkeys_1.HotkeysListener(); _this.listener.on(fc_hotkeys_1.KEY_ALL, debounce(_this.onKeyboard, 150)); } if (mountContainer) { _this.mountContainer = mountContainer; } return _this; } Object.defineProperty(Drawboard.prototype, "markerMap", { get: function () { var map = {}; this.markers.forEach(function (marker) { map[marker.id] = marker; }); return map; }, enumerable: true, configurable: true }); return Drawboard; }(index_1.Baseboard); exports.Drawboard = Drawboard; /***/ }), /***/ "./src/event/EventHub.ts": /*!*******************************!*\ !*** ./src/event/EventHub.ts ***! \*******************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var EventEmitter = __webpack_require__(/*! eventemitter3 */ "./node_modules/eventemitter3/index.js"); var EventHub = function (_super) { __extends(EventHub, _super); function EventHub() { return _super !== null && _super.apply(this, arguments) || this; } return EventHub; }(EventEmitter); exports.EventHub = EventHub; /***/ }), /***/ "./src/index.ts": /*!**********************!*\ !*** ./src/index.ts ***! \**********************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var Drawboard_1 = __webpack_require__(/*! ./drawboard/Drawboard */ "./src/drawboard/Drawboard/index.ts"); exports.Drawboard = Drawboard_1.Drawboard; var toolbar_items_1 = __webpack_require__(/*! ./toolbar/toolbar-items */ "./src/toolbar/toolbar-items.ts"); exports.separatorToolbarItem = toolbar_items_1.separatorToolbarItem; exports.closeToolbarItem = toolbar_items_1.closeToolbarItem; var EventHub_1 = __webpack_require__(/*! ./event/EventHub */ "./src/event/EventHub.ts"); exports.EventHub = EventHub_1.EventHub; var Whiteboard_1 = __webpack_require__(/*! ./whiteboard/Whiteboard */ "./src/whiteboard/Whiteboard/index.ts"); exports.Whiteboard = Whiteboard_1.Whiteboard; var MirrorWhiteboard_1 = __webpack_require__(/*! ./whiteboard/MirrorWhiteboard */ "./src/whiteboard/MirrorWhiteboard/index.ts"); exports.MirrorWhiteboard = MirrorWhiteboard_1.MirrorWhiteboard; var ReplayWhiteboard_1 = __webpack_require__(/*! ./whiteboard/ReplayWhiteboard */ "./src/whiteboard/ReplayWhiteboard/index.ts"); exports.ReplayWhiteboard = ReplayWhiteboard_1.ReplayWhiteboard; /***/ }), /***/ "./src/markers/ArrowMarker/index.ts": /*!******************************************!*\ !*** ./src/markers/ArrowMarker/index.ts ***! \******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var LinearMarker_1 = __webpack_require__(/*! ../LinearMarker */ "./src/markers/LinearMarker/index.ts"); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var ArrowMarker = function (_super) { __extends(ArrowMarker, _super); function ArrowMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.type = 'arrow'; _this.ARROW_SIZE = 6; return _this; } ArrowMarker.prototype.init = function () { _super.prototype.init.call(this); SvgHelper_1.SvgHelper.setAttributes(this.visual, [['class', 'arrow-marker']]); var tip = SvgHelper_1.SvgHelper.createPolygon("0,0 " + this.ARROW_SIZE + "," + this.ARROW_SIZE / 2 + " 0," + this.ARROW_SIZE, [['class', 'arrow-marker-tip']]); this.defs.push(SvgHelper_1.SvgHelper.createMarker('arrow-marker-head', 'auto', this.ARROW_SIZE, this.ARROW_SIZE, this.ARROW_SIZE - 1, this.ARROW_SIZE / 2, tip)); this.markerLine.setAttribute('marker-end', 'url(#arrow-marker-head'); }; ArrowMarker.createMarker = function (page) { var marker = new ArrowMarker(); marker.page = page; marker.init(); return marker; }; return ArrowMarker; }(LinearMarker_1.LinearMarker); exports.ArrowMarker = ArrowMarker; /***/ }), /***/ "./src/markers/BaseMarker/ResizeGrip.ts": /*!**********************************************!*\ !*** ./src/markers/BaseMarker/ResizeGrip.ts ***! \**********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var ResizeGrip = function () { function ResizeGrip() { this.GRIP_SIZE = 10; this.visual = SvgHelper_1.SvgHelper.createCircle(this.GRIP_SIZE, [['class', 'fc-whiteboard-control-grip']]); } return ResizeGrip; }(); exports.ResizeGrip = ResizeGrip; /***/ }), /***/ "./src/markers/BaseMarker/index.ts": /*!*****************************************!*\ !*** ./src/markers/BaseMarker/index.ts ***! \*****************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var uuid = __webpack_require__(/*! uuid/v1 */ "./node_modules/uuid/v1.js"); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var index_1 = __webpack_require__(/*! ../../renderer/DomEventAware/index */ "./src/renderer/DomEventAware/index.ts"); var types_1 = __webpack_require__(/*! ../../utils/types */ "./src/utils/types.ts"); var BaseMarker = function (_super) { __extends(BaseMarker, _super); function BaseMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.id = uuid(); _this.type = 'base'; _this.onChange = function () {}; _this.defs = []; _this.width = 200; _this.height = 50; _this.isActive = true; _this.isDragging = false; _this.isResizing = false; _this.manipulate = function (ev) { var scale = _this.visual.getScreenCTM().a; var dx = (ev.screenX - _this.previousMouseX) / scale; var dy = (ev.screenY - _this.previousMouseY) / scale; if (_this.isDragging) { _this.move(dx, dy); } if (_this.isResizing) { _this.resize(dx, dy, function (pos) { _this.onChange({ target: 'marker', id: _this.id, event: 'resizeMarker', marker: { dx: dx, dy: dy, pos: pos } }); }); } _this.previousMouseX = ev.screenX; _this.previousMouseY = ev.screenY; }; _this.move = function (dx, dy) { var translate = _this.visual.transform.baseVal.getItem(0); translate.setMatrix(translate.matrix.translate(dx, dy)); _this.visual.transform.baseVal.replaceItem(translate, 0); _this.x += dx; _this.y += dy; _this.onChange({ target: 'marker', id: _this.id, event: 'moveMarker', marker: { dx: dx, dy: dy } }); }; _this.moveTo = function (x, y) { var translate = _this.visual.transform.baseVal.getItem(0); translate.setMatrix(translate.matrix.translate(x - _this.x, y - _this.y)); _this.visual.transform.baseVal.replaceItem(translate, 0); _this.x = x; _this.y = y; }; _this.addToVisual = function (el) { _this.visual.appendChild(el); }; _this.addToRenderVisual = function (el) { _this.renderVisual.appendChild(el); }; _this.onMouseDown = function (ev) { ev.stopPropagation(); if (_this.page && _this.page.mode === 'mirror') { return; } _this.select(); _this.isDragging = true; _this.previousMouseX = ev.screenX; _this.previousMouseY = ev.screenY; }; _this.onMouseUp = function (ev) { ev.stopPropagation(); _this.endManipulation(); }; _this.onMouseMove = function (ev) { ev.stopPropagation(); _this.manipulate(ev); }; return _this; } BaseMarker.prototype.reactToManipulation = function (type, _a) { var _b = _a === void 0 ? {} : _a, dx = _b.dx, dy = _b.dy, pos = _b.pos; if (type === 'moveMarker') { if (types_1.isNil(dx) || types_1.isNil(dy)) { return; } this.move(dx, dy); } if (type === 'resizeMarker') { if (types_1.isNil(dx) || types_1.isNil(dy)) { return; } this.resizeByEvent(dx, dy, pos); } }; BaseMarker.prototype.endManipulation = function () { this.isDragging = false; this.isResizing = false; }; BaseMarker.prototype.select = function () { this.isActive = true; if (this.onSelected) { this.onSelected(this); } return; }; BaseMarker.prototype.deselect = function () { this.isActive = false; this.endManipulation(); return; }; BaseMarker.prototype.captureSnap = function () { return { id: this.id, type: this.type, isActive: this.isActive, x: this.x, y: this.y }; }; BaseMarker.prototype.applySnap = function (snap) { this.id = snap.id; this.type = snap.type; if (snap.x && snap.y) { this.moveTo(snap.x, snap.y); } if (this.isActive) { this.select(); } }; BaseMarker.prototype.destroy = function () { this.visual.style.display = 'none'; }; BaseMarker.prototype.resize = function (x, y, cb) { return; }; BaseMarker.prototype.resizeByEvent = function (x, y, pos) { return; }; BaseMarker.prototype.init = function () { this.visual = SvgHelper_1.SvgHelper.createGroup(); this.visual.transform.baseVal.appendItem(SvgHelper_1.SvgHelper.createTransform()); _super.prototype.init.call(this, this.visual); this.renderVisual = SvgHelper_1.SvgHelper.createGroup([['class', 'render-visual']]); this.visual.appendChild(this.renderVisual); }; BaseMarker.createMarker = function (page) { var marker = new BaseMarker(); marker.page = page; marker.init(); return marker; }; return BaseMarker; }(index_1.DomEventAware); exports.BaseMarker = BaseMarker; /***/ }), /***/ "./src/markers/CoverMarker/index.ts": /*!******************************************!*\ !*** ./src/markers/CoverMarker/index.ts ***! \******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var RectBaseMarker_1 = __webpack_require__(/*! ../RectMarker/RectBaseMarker */ "./src/markers/RectMarker/RectBaseMarker.ts"); var CoverMarker = function (_super) { __extends(CoverMarker, _super); function CoverMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.type = 'cover'; return _this; } CoverMarker.prototype.init = function () { _super.prototype.init.call(this); SvgHelper_1.SvgHelper.setAttributes(this.visual, [['class', 'cover-marker']]); }; CoverMarker.createMarker = function (page) { var marker = new CoverMarker(); marker.page = page; marker.init(); return marker; }; return CoverMarker; }(RectBaseMarker_1.RectBaseMarker); exports.CoverMarker = CoverMarker; /***/ }), /***/ "./src/markers/HighlightMarker/index.ts": /*!**********************************************!*\ !*** ./src/markers/HighlightMarker/index.ts ***! \**********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var RectBaseMarker_1 = __webpack_require__(/*! ../RectMarker/RectBaseMarker */ "./src/markers/RectMarker/RectBaseMarker.ts"); var HighlightMarker = function (_super) { __extends(HighlightMarker, _super); function HighlightMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.type = 'highlight'; return _this; } HighlightMarker.prototype.init = function () { _super.prototype.init.call(this); SvgHelper_1.SvgHelper.setAttributes(this.visual, [['class', 'highlight-marker']]); }; HighlightMarker.createMarker = function (page) { var marker = new HighlightMarker(); marker.page = page; marker.init(); return marker; }; return HighlightMarker; }(RectBaseMarker_1.RectBaseMarker); exports.HighlightMarker = HighlightMarker; /***/ }), /***/ "./src/markers/LineMarker/index.ts": /*!*****************************************!*\ !*** ./src/markers/LineMarker/index.ts ***! \*****************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var LinearMarker_1 = __webpack_require__(/*! ../LinearMarker */ "./src/markers/LinearMarker/index.ts"); var index_1 = __webpack_require__(/*! ./../../renderer/SvgHelper/index */ "./src/renderer/SvgHelper/index.ts"); var LineMarker = function (_super) { __extends(LineMarker, _super); function LineMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.type = 'line'; return _this; } LineMarker.prototype.init = function () { _super.prototype.init.call(this); index_1.SvgHelper.setAttributes(this.visual, [['class', 'line-marker']]); }; LineMarker.createMarker = function (page) { var marker = new LineMarker(); marker.page = page; marker.init(); return marker; }; return LineMarker; }(LinearMarker_1.LinearMarker); exports.LineMarker = LineMarker; /***/ }), /***/ "./src/markers/LinearMarker/index.ts": /*!*******************************************!*\ !*** ./src/markers/LinearMarker/index.ts ***! \*******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var BaseMarker_1 = __webpack_require__(/*! ../BaseMarker */ "./src/markers/BaseMarker/index.ts"); var ResizeGrip_1 = __webpack_require__(/*! ../BaseMarker/ResizeGrip */ "./src/markers/BaseMarker/ResizeGrip.ts"); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var LinearMarker = function (_super) { __extends(LinearMarker, _super); function LinearMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.MIN_LENGTH = 20; _this.x1 = 0; _this.y1 = 0; _this.x2 = _this.width; _this.y2 = 0; _this.getLineLength = function (x1, y1, x2, y2) { var dx = Math.abs(x1 - x2); var dy = Math.abs(y1 - y2); return Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2)); }; _this.addControlBox = function () { _this.controlBox = SvgHelper_1.SvgHelper.createGroup([['class', 'fc-whiteboard-line-control-box']]); _this.addToVisual(_this.controlBox); _this.addControlGrips(); }; _this.adjustControlBox = function () { _this.positionGrips(); }; _this.addControlGrips = function () { _this.controlGrips = { left: _this.createGrip(), right: _this.createGrip() }; _this.positionGrips(); }; _this.createGrip = function () { var grip = new ResizeGrip_1.ResizeGrip(); grip.visual.transform.baseVal.appendItem(SvgHelper_1.SvgHelper.createTransform()); _this.controlBox.appendChild(grip.visual); grip.visual.addEventListener('mousedown', _this.gripMouseDown); grip.visual.addEventListener('mousemove', _this.gripMouseMove); grip.visual.addEventListener('mouseup', _this.gripMouseUp); grip.visual.addEventListener('touchstart', _this.onTouch, { passive: false }); grip.visual.addEventListener('touchend', _this.onTouch, { passive: false }); grip.visual.addEventListener('touchmove', _this.onTouch, { passive: false }); if (_this.page && _this.page.mode === 'mirror') { grip.visual.style.visibility = 'hidden'; } return grip; }; _this.gripMouseDown = function (ev) { _this.isResizing = true; _this.activeGrip = ev.target === _this.controlGrips.left.visual ? _this.controlGrips.left : _this.controlGrips.right; _this.previousMouseX = ev.screenX; _this.previousMouseY = ev.screenY; ev.stopPropagation(); }; _this.gripMouseUp = function (ev) { _this.isResizing = false; _this.activeGrip = null; ev.stopPropagation(); }; _this.gripMouseMove = function (ev) { if (_this.isResizing) { _this.resize(ev.movementX, ev.movementY); } }; _this.positionLine = function (bound) { _this.x1 = bound.x1; _this.y1 = bound.y1; _this.x2 = bound.x2; _this.y2 = bound.y2; _this.markerBgLine.setAttribute('x1', _this.x1.toString()); _this.markerBgLine.setAttribute('y1', _this.y1.toString()); _this.markerLine.setAttribute('x2', _this.x2.toString()); _this.markerLine.setAttribute('y2', _this.y2.toString()); }; _this.positionGrips = function () { var gripSize = _this.controlGrips.left.GRIP_SIZE; var x1 = _this.x1 - gripSize / 2; var y1 = _this.y1 - gripSize / 2; var x2 = _this.x2 - gripSize / 2; var y2 = _this.y2 - gripSize / 2; _this.positionGrip(_this.controlGrips.left.visual, x1, y1); _this.positionGrip(_this.controlGrips.right.visual, x2, y2); }; _this.positionGrip = function (grip, x, y) { var translate = grip.transform.baseVal.getItem(0); translate.setTranslate(x, y); grip.transform.baseVal.replaceItem(translate, 0); }; return _this; } LinearMarker.prototype.captureSnap = function () { var baseSnap = _super.prototype.captureSnap.call(this); baseSnap.linearSnap = { x1: this.x1, y1: this.y1, x2: this.x2, y2: this.y2 }; return baseSnap; }; LinearMarker.prototype.applySnap = function (snap) { _super.prototype.applySnap.call(this, snap); if (snap.linearSnap) { this.positionLine(snap.linearSnap); } }; LinearMarker.prototype.endManipulation = function () { _super.prototype.endManipulation.call(this); this.isResizing = false; this.activeGrip = null; }; LinearMarker.prototype.select = function () { _super.prototype.select.call(this); this.controlBox.style.display = ''; }; LinearMarker.prototype.deselect = function () { _super.prototype.deselect.call(this); this.controlBox.style.display = 'none'; }; LinearMarker.prototype.init = function () { _super.prototype.init.call(this); this.markerBgLine = SvgHelper_1.SvgHelper.createLine(0, 0, this.x2, 0, [['stroke', 'transparent'], ['stroke-width', '30']]); this.addToRenderVisual(this.markerBgLine); this.markerLine = SvgHelper_1.SvgHelper.createLine(0, 0, this.x2, 0); this.addToRenderVisual(this.markerLine); this.addControlBox(); if (this.page && this.page.mode === 'mirror') { this.controlBox.style.display = 'none'; } }; LinearMarker.prototype.resize = function (x, y, onPosition) { if (this.activeGrip) { if (this.activeGrip === this.controlGrips.left && this.getLineLength(this.x1 + x, this.y1 + 1, this.x2, this.y2) >= this.MIN_LENGTH) { this.x1 += x; this.y1 += y; this.markerBgLine.setAttribute('x1', this.x1.toString()); this.markerBgLine.setAttribute('y1', this.y1.toString()); this.markerLine.setAttribute('x1', this.x1.toString()); this.markerLine.setAttribute('y1', this.y1.toString()); if (onPosition) { onPosition('left'); } } else if (this.activeGrip === this.controlGrips.right && this.getLineLength(this.x1, this.y1, this.x2 + x, this.y2 + y) >= this.MIN_LENGTH) { this.x2 += x; this.y2 += y; this.markerBgLine.setAttribute('x2', this.x2.toString()); this.markerBgLine.setAttribute('y2', this.y2.toString()); this.markerLine.setAttribute('x2', this.x2.toString()); this.markerLine.setAttribute('y2', this.y2.toString()); if (onPosition) { onPosition('right'); } } } this.adjustControlBox(); }; LinearMarker.prototype.resizeByEvent = function (x, y, pos) { if (pos === 'left') { this.activeGrip = this.controlGrips.left; } else { this.activeGrip = this.controlGrips.right; } this.resize(x, y); }; LinearMarker.createMarker = function (page) { var marker = new LinearMarker(); marker.page = page; marker.init(); return marker; }; return LinearMarker; }(BaseMarker_1.BaseMarker); exports.LinearMarker = LinearMarker; /***/ }), /***/ "./src/markers/RectMarker/RectBaseMarker.ts": /*!**************************************************!*\ !*** ./src/markers/RectMarker/RectBaseMarker.ts ***! \**************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var RectangularMarker_1 = __webpack_require__(/*! ../RectangularMarker */ "./src/markers/RectangularMarker/index.ts"); var RectBaseMarker = function (_super) { __extends(RectBaseMarker, _super); function RectBaseMarker() { return _super !== null && _super.apply(this, arguments) || this; } RectBaseMarker.prototype.applySnap = function (snap) { _super.prototype.applySnap.call(this, snap); if (snap.rectSnap) { this.markerRect.setAttribute('width', this.width.toString()); this.markerRect.setAttribute('height', this.height.toString()); } }; RectBaseMarker.prototype.init = function () { _super.prototype.init.call(this); this.markerRect = SvgHelper_1.SvgHelper.createRect(this.width, this.height); this.addToRenderVisual(this.markerRect); }; RectBaseMarker.prototype.resize = function (x, y, onPosition) { _super.prototype.resize.call(this, x, y, onPosition); this.markerRect.setAttribute('width', this.width.toString()); this.markerRect.setAttribute('height', this.height.toString()); }; RectBaseMarker.createMarker = function (page) { var marker = new RectBaseMarker(); marker.page = page; marker.init(); return marker; }; return RectBaseMarker; }(RectangularMarker_1.RectangularMarker); exports.RectBaseMarker = RectBaseMarker; /***/ }), /***/ "./src/markers/RectMarker/index.ts": /*!*****************************************!*\ !*** ./src/markers/RectMarker/index.ts ***! \*****************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var RectBaseMarker_1 = __webpack_require__(/*! ./RectBaseMarker */ "./src/markers/RectMarker/RectBaseMarker.ts"); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var RectMarker = function (_super) { __extends(RectMarker, _super); function RectMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.type = 'rect'; return _this; } RectMarker.prototype.init = function () { _super.prototype.init.call(this); SvgHelper_1.SvgHelper.setAttributes(this.visual, [['class', 'rect-marker']]); }; RectMarker.createMarker = function (page) { var marker = new RectMarker(); marker.page = page; marker.init(); return marker; }; return RectMarker; }(RectBaseMarker_1.RectBaseMarker); exports.RectMarker = RectMarker; /***/ }), /***/ "./src/markers/RectangularMarker/RectangularMarkerGrips.ts": /*!*****************************************************************!*\ !*** ./src/markers/RectangularMarker/RectangularMarkerGrips.ts ***! \*****************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var RectangularMarkerGrips = function () { function RectangularMarkerGrips() { var _this = this; this.findGripByVisual = function (gripVisual) { switch (gripVisual) { case _this.topLeft.visual: return _this.topLeft; case _this.topCenter.visual: return _this.topCenter; case _this.topRight.visual: return _this.topRight; case _this.centerLeft.visual: return _this.centerLeft; case _this.centerRight.visual: return _this.centerRight; case _this.bottomLeft.visual: return _this.bottomLeft; case _this.bottomCenter.visual: return _this.bottomCenter; case _this.bottomRight.visual: return _this.bottomRight; default: return _this.topLeft; } }; } return RectangularMarkerGrips; }(); exports.RectangularMarkerGrips = RectangularMarkerGrips; /***/ }), /***/ "./src/markers/RectangularMarker/index.ts": /*!************************************************!*\ !*** ./src/markers/RectangularMarker/index.ts ***! \************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var RectangularMarkerGrips_1 = __webpack_require__(/*! ./RectangularMarkerGrips */ "./src/markers/RectangularMarker/RectangularMarkerGrips.ts"); var BaseMarker_1 = __webpack_require__(/*! ../BaseMarker */ "./src/markers/BaseMarker/index.ts"); var ResizeGrip_1 = __webpack_require__(/*! ../BaseMarker/ResizeGrip */ "./src/markers/BaseMarker/ResizeGrip.ts"); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var RectangularMarker = function (_super) { __extends(RectangularMarker, _super); function RectangularMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.MIN_SIZE = 5; _this.CB_DISTANCE = 10; _this.addControlBox = function () { _this.controlBox = SvgHelper_1.SvgHelper.createGroup([['class', 'fc-whiteboard-rect-control-box']]); var translate = SvgHelper_1.SvgHelper.createTransform(); translate.setTranslate(-_this.CB_DISTANCE / 2, -_this.CB_DISTANCE / 2); _this.controlBox.transform.baseVal.appendItem(translate); _this.addToVisual(_this.controlBox); _this.controlRect = SvgHelper_1.SvgHelper.createRect(_this.width + _this.CB_DISTANCE, _this.height + _this.CB_DISTANCE, [['class', 'fc-whiteboard-rect-control-rect']]); _this.controlBox.appendChild(_this.controlRect); _this.controlGrips = new RectangularMarkerGrips_1.RectangularMarkerGrips(); _this.addControlGrips(); }; _this.adjustControlBox = function () { _this.controlRect.setAttribute('width', (_this.width + _this.CB_DISTANCE).toString()); _this.controlRect.setAttribute('height', (_this.height + _this.CB_DISTANCE).toString()); _this.positionGrips(); }; _this.addControlGrips = function () { _this.controlGrips.topLeft = _this.createGrip(); _this.controlGrips.topCenter = _this.createGrip(); _this.controlGrips.topRight = _this.createGrip(); _this.controlGrips.centerLeft = _this.createGrip(); _this.controlGrips.centerRight = _this.createGrip(); _this.controlGrips.bottomLeft = _this.createGrip(); _this.controlGrips.bottomCenter = _this.createGrip(); _this.controlGrips.bottomRight = _this.createGrip(); _this.positionGrips(); }; _this.createGrip = function () { var grip = new ResizeGrip_1.ResizeGrip(); grip.visual.transform.baseVal.appendItem(SvgHelper_1.SvgHelper.createTransform()); _this.controlBox.appendChild(grip.visual); grip.visual.addEventListener('mousedown', _this.gripMouseDown); grip.visual.addEventListener('mousemove', _this.gripMouseMove); grip.visual.addEventListener('mouseup', _this.gripMouseUp); grip.visual.addEventListener('touchstart', _this.onTouch, { passive: false }); grip.visual.addEventListener('touchend', _this.onTouch, { passive: false }); grip.visual.addEventListener('touchmove', _this.onTouch, { passive: false }); return grip; }; _this.gripMouseDown = function (ev) { _this.isResizing = true; _this.activeGrip = _this.controlGrips.findGripByVisual(ev.target) || null; _this.previousMouseX = ev.screenX; _this.previousMouseY = ev.screenY; ev.stopPropagation(); }; _this.gripMouseUp = function (ev) { _this.isResizing = false; _this.activeGrip = null; ev.stopPropagation(); }; _this.gripMouseMove = function (ev) { if (_this.isResizing) { _this.manipulate(ev); } }; _this.positionGrips = function () { var gripSize = _this.controlGrips.topLeft.GRIP_SIZE; var left = -gripSize / 2; var top = left; var cx = (_this.width + _this.CB_DISTANCE) / 2 - gripSize / 2; var cy = (_this.height + _this.CB_DISTANCE) / 2 - gripSize / 2; var bottom = _this.height + _this.CB_DISTANCE - gripSize / 2; var right = _this.width + _this.CB_DISTANCE - gripSize / 2; _this.positionGrip(_this.controlGrips.topLeft.visual, left, top); _this.positionGrip(_this.controlGrips.topCenter.visual, cx, top); _this.positionGrip(_this.controlGrips.topRight.visual, right, top); _this.positionGrip(_this.controlGrips.centerLeft.visual, left, cy); _this.positionGrip(_this.controlGrips.centerRight.visual, right, cy); _this.positionGrip(_this.controlGrips.bottomLeft.visual, left, bottom); _this.positionGrip(_this.controlGrips.bottomCenter.visual, cx, bottom); _this.positionGrip(_this.controlGrips.bottomRight.visual, right, bottom); }; _this.positionGrip = function (grip, x, y) { var translate = grip.transform.baseVal.getItem(0); translate.setTranslate(x, y); grip.transform.baseVal.replaceItem(translate, 0); }; return _this; } RectangularMarker.prototype.captureSnap = function () { var snap = _super.prototype.captureSnap.call(this); snap.rectSnap = { width: this.width, height: this.height }; return snap; }; RectangularMarker.prototype.applySnap = function (snap) { _super.prototype.applySnap.call(this, snap); if (snap.rectSnap) { var _a = snap.rectSnap, width = _a.width, height = _a.height; if (width && height) { this.width = width; this.height = height; this.adjustControlBox(); } } }; RectangularMarker.prototype.endManipulation = function () { _super.prototype.endManipulation.call(this); this.isResizing = false; this.activeGrip = null; }; RectangularMarker.prototype.select = function () { _super.prototype.select.call(this); this.controlBox.style.display = ''; }; RectangularMarker.prototype.deselect = function () { _super.prototype.deselect.call(this); this.controlBox.style.display = 'none'; }; RectangularMarker.prototype.init = function () { _super.prototype.init.call(this); this.addControlBox(); if (this.page && this.page.mode === 'mirror') { this.controlBox.style.display = 'none'; } }; RectangularMarker.prototype.resizeByEvent = function (dx, dy, pos) { this.activeGrip = this.controlGrips[pos]; this.resize(dx, dy); }; RectangularMarker.prototype.resize = function (dx, dy, onPosition) { var translateX = 0; var translateY = 0; switch (this.activeGrip) { case this.controlGrips.topLeft: this.width -= dx; this.height -= dy; translateX += dx; translateY += dy; this.x += dx; this.y += dy; if (onPosition) { onPosition('topLeft'); } break; case this.controlGrips.bottomLeft: this.width -= dx; this.height += dy; translateX += dx; this.x += dx; if (onPosition) { onPosition('bottomLeft'); } break; case this.controlGrips.topRight: this.width += dx; this.height -= dy; translateY += dy; this.y += dy; if (onPosition) { onPosition('topRight'); } break; case this.controlGrips.bottomRight: this.width += dx; this.height += dy; if (onPosition) { onPosition('bottomRight'); } break; case this.controlGrips.centerLeft: this.width -= dx; translateX += dx; this.x += dx; if (onPosition) { onPosition('centerLeft'); } break; case this.controlGrips.centerRight: this.width += dx; if (onPosition) { onPosition('centerRight'); } break; case this.controlGrips.topCenter: this.height -= dy; translateY += dy; this.y += dy; if (onPosition) { onPosition('topCenter'); } break; case this.controlGrips.bottomCenter: this.height += dy; if (onPosition) { onPosition('bottomCenter'); } break; default: break; } if (this.width < this.MIN_SIZE) { var offset = this.MIN_SIZE - this.width; this.width = this.MIN_SIZE; if (translateX !== 0) { translateX -= offset; } } if (this.height < this.MIN_SIZE) { var offset = this.MIN_SIZE - this.height; this.height = this.MIN_SIZE; if (translateY !== 0) { translateY -= offset; } } if (translateX !== 0 || translateY !== 0) { var translate = this.visual.transform.baseVal.getItem(0); translate.setMatrix(translate.matrix.translate(translateX, translateY)); this.visual.transform.baseVal.replaceItem(translate, 0); } this.adjustControlBox(); }; RectangularMarker.prototype.onTouch = function (ev) { _super.prototype.onTouch.call(this, ev); }; RectangularMarker.createMarker = function (page) { var marker = new RectangularMarker(); marker.page = page; marker.init(); return marker; }; return RectangularMarker; }(BaseMarker_1.BaseMarker); exports.RectangularMarker = RectangularMarker; /***/ }), /***/ "./src/markers/TextMarker/index.ts": /*!*****************************************!*\ !*** ./src/markers/TextMarker/index.ts ***! \*****************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var RectangularMarker_1 = __webpack_require__(/*! ../RectangularMarker */ "./src/markers/RectangularMarker/index.ts"); var SvgHelper_1 = __webpack_require__(/*! ../../renderer/SvgHelper */ "./src/renderer/SvgHelper/index.ts"); var OkIcon = __webpack_require__(/*! ../../assets/check.svg */ "./src/assets/check.svg"); var CancelIcon = __webpack_require__(/*! ../../assets/times.svg */ "./src/assets/times.svg"); var TextMarker = function (_super) { __extends(TextMarker, _super); function TextMarker() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.type = 'text'; _this.MIN_SIZE = 50; _this.DEFAULT_TEXT = 'Double-click to edit text'; _this.text = _this.DEFAULT_TEXT; _this.inDoubleTap = false; _this.renderText = function () { var LINE_SIZE = '1.2em'; while (_this.textElement.lastChild) { _this.textElement.removeChild(_this.textElement.lastChild); } var lines = _this.text.split(/\r\n|[\n\v\f\r\x85\u2028\u2029]/); for (var _i = 0, lines_1 = lines; _i < lines_1.length; _i++) { var line = lines_1[_i]; if (line.trim() === '') { line = ' '; } _this.textElement.appendChild(SvgHelper_1.SvgHelper.createTSpan(line, [['x', '0'], ['dy', LINE_SIZE]])); } setTimeout(_this.sizeText, 10); }; _this.sizeText = function () { var textSize = _this.textElement.getBBox(); var x = 0; var y = 0; var scale = 1.0; if (textSize.width > 0 && textSize.height > 0) { var xScale = _this.width * 1.0 / textSize.width; var yScale = _this.height * 1.0 / textSize.height; scale = Math.min(xScale, yScale); x = (_this.width - textSize.width * scale) / 2; y = (_this.height - textSize.height * scale) / 2; } _this.textElement.transform.baseVal.getItem(0).setTranslate(x, y); _this.textElement.transform.baseVal.getItem(1).setScale(scale, scale); }; _this.onDblClick = function (ev) { _this.showEditor(); }; _this.onTap = function (ev) { if (_this.inDoubleTap) { _this.inDoubleTap = false; _this.showEditor(); } else { _this.inDoubleTap = true; setTimeout(function () { _this.inDoubleTap = false; }, 300); } }; _this.showEditor = function () { _this.editor = document.createElement('div'); _this.editor.className = 'fc-whiteboard-text-editor'; _this.editorTextArea = document.createElement('textarea'); if (_this.text !== _this.DEFAULT_TEXT) { _this.editorTextArea.value = _this.text; } _this.editorTextArea.addEventListener('keydown', _this.onEditorKeyDown); _this.editor.appendChild(_this.editorTextArea); document.body.appendChild(_this.editor); var buttons = document.createElement('div'); buttons.className = 'fc-whiteboard-text-editor-button-bar'; _this.editor.appendChild(buttons); var okButton = document.createElement('div'); okButton.className = 'fc-whiteboard-text-editor-button'; okButton.innerHTML = OkIcon; okButton.addEventListener('click', _this.onEditorOkClick); buttons.appendChild(okButton); var cancelButton = document.createElement('div'); cancelButton.className = 'fc-whiteboard-text-editor-button'; cancelButton.innerHTML = CancelIcon; cancelButton.addEventListener('click', _this.closeEditor); buttons.appendChild(cancelButton); }; _this.onEditorOkClick = function (ev) { if (_this.editorTextArea.value.trim()) { _this.text = _this.editorTextArea.value; } else { _this.text = _this.DEFAULT_TEXT; } _this.onChange({ target: 'marker', id: _this.id, event: 'inputMarker', marker: { text: _this.text } }); _this.renderText(); _this.closeEditor(); }; _this.closeEditor = function () { document.body.removeChild(_this.editor); }; _this.onEditorKeyDown = function (ev) { if (ev.key === 'Enter' && ev.ctrlKey) { ev.preventDefault(); _this.onEditorOkClick(null); } }; return _this; } TextMarker.prototype.setText = function (text) { this.text = text; this.renderText(); }; TextMarker.prototype.captureSnap = function () { var baseSnap = _super.prototype.captureSnap.call(this); baseSnap.textSnap = { text: this.text }; return baseSnap; }; TextMarker.prototype.applySnap = function (snap) { _super.prototype.applySnap.call(this, snap); if (snap.textSnap && snap.textSnap.text !== this.text) { this.setText(snap.textSnap.text); } }; TextMarker.prototype.init = function () { _super.prototype.init.call(this); this.textElement = SvgHelper_1.SvgHelper.createText(); this.addToRenderVisual(this.textElement); SvgHelper_1.SvgHelper.setAttributes(this.visual, [['class', 'text-marker']]); this.textElement.transform.baseVal.appendItem(SvgHelper_1.SvgHelper.createTransform()); this.textElement.transform.baseVal.appendItem(SvgHelper_1.SvgHelper.createTransform()); this.renderText(); this.visual.addEventListener('dblclick', this.onDblClick); this.visual.addEventListener('touchstart', this.onTap); }; TextMarker.prototype.resize = function (x, y, onPosition) { _super.prototype.resize.call(this, x, y, onPosition); this.sizeText(); }; TextMarker.createMarker = function (page) { var marker = new TextMarker(); marker.page = page; marker.init(); return marker; }; return TextMarker; }(RectangularMarker_1.RectangularMarker); exports.TextMarker = TextMarker; /***/ }), /***/ "./src/markers/types.ts": /*!******************************!*\ !*** ./src/markers/types.ts ***! \******************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var index_1 = __webpack_require__(/*! ./HighlightMarker/index */ "./src/markers/HighlightMarker/index.ts"); var index_2 = __webpack_require__(/*! ./TextMarker/index */ "./src/markers/TextMarker/index.ts"); var index_3 = __webpack_require__(/*! ./ArrowMarker/index */ "./src/markers/ArrowMarker/index.ts"); var index_4 = __webpack_require__(/*! ./BaseMarker/index */ "./src/markers/BaseMarker/index.ts"); var CoverMarker_1 = __webpack_require__(/*! ./CoverMarker */ "./src/markers/CoverMarker/index.ts"); var LineMarker_1 = __webpack_require__(/*! ./LineMarker */ "./src/markers/LineMarker/index.ts"); var RectMarker_1 = __webpack_require__(/*! ./RectMarker */ "./src/markers/RectMarker/index.ts"); function getMarkerByType(type) { switch (type) { case 'arrow': return index_3.ArrowMarker; case 'base': return index_4.BaseMarker; case 'cover': return CoverMarker_1.CoverMarker; case 'highlight': return index_1.HighlightMarker; case 'line': return LineMarker_1.LineMarker; case 'rect': return RectMarker_1.RectMarker; case 'text': return index_2.TextMarker; default: return index_4.BaseMarker; } } exports.getMarkerByType = getMarkerByType; /***/ }), /***/ "./src/renderer/DomEventAware/index.ts": /*!*********************************************!*\ !*** ./src/renderer/DomEventAware/index.ts ***! \*********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var DomEventAware = function () { function DomEventAware() { this.x = 0; this.y = 0; this.previousMouseX = 0; this.previousMouseY = 0; } DomEventAware.prototype.init = function (ele) { ele.addEventListener('mousedown', this.onMouseDown); ele.addEventListener('mouseup', this.onMouseUp); ele.addEventListener('mousemove', this.onMouseMove); ele.addEventListener('touchstart', this.onTouch, { passive: false }); ele.addEventListener('touchend', this.onTouch, { passive: false }); ele.addEventListener('touchmove', this.onTouch, { passive: false }); }; DomEventAware.prototype.onTouch = function (ev) { ev.preventDefault(); var newEvt = document.createEvent('MouseEvents'); var touch = ev.changedTouches[0]; var type = null; switch (ev.type) { case 'touchstart': type = 'mousedown'; break; case 'touchmove': type = 'mousemove'; break; case 'touchend': type = 'mouseup'; break; default: break; } newEvt.initMouseEvent(type, true, true, window, 0, touch.screenX, touch.screenY, touch.clientX, touch.clientY, ev.ctrlKey, ev.altKey, ev.shiftKey, ev.metaKey, 0, null); ev.target.dispatchEvent(newEvt); }; return DomEventAware; }(); exports.DomEventAware = DomEventAware; /***/ }), /***/ "./src/renderer/SvgHelper/index.ts": /*!*****************************************!*\ !*** ./src/renderer/SvgHelper/index.ts ***! \*****************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var SvgHelper = function () { function SvgHelper() {} SvgHelper.createRect = function (width, height, attributes) { var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect'); rect.setAttribute('width', width.toString()); rect.setAttribute('height', height.toString()); if (attributes) { SvgHelper.setAttributes(rect, attributes); } return rect; }; SvgHelper.createLine = function (x1, y1, x2, y2, attributes) { var line = document.createElementNS('http://www.w3.org/2000/svg', 'line'); line.setAttribute('x1', x1.toString()); line.setAttribute('y1', y1.toString()); line.setAttribute('x2', x2.toString()); line.setAttribute('y2', y2.toString()); if (attributes) { SvgHelper.setAttributes(line, attributes); } return line; }; SvgHelper.createPolygon = function (points, attributes) { var polygon = document.createElementNS('http://www.w3.org/2000/svg', 'polygon'); polygon.setAttribute('points', points); if (attributes) { SvgHelper.setAttributes(polygon, attributes); } return polygon; }; SvgHelper.createCircle = function (radius, attributes) { var circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle'); circle.setAttribute('cx', (radius / 2).toString()); circle.setAttribute('cy', (radius / 2).toString()); circle.setAttribute('r', radius.toString()); if (attributes) { SvgHelper.setAttributes(circle, attributes); } return circle; }; SvgHelper.createGroup = function (attributes) { var g = document.createElementNS('http://www.w3.org/2000/svg', 'g'); if (attributes) { SvgHelper.setAttributes(g, attributes); } return g; }; SvgHelper.setAttributes = function (el, attributes) { for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) { var _a = attributes_1[_i], attr = _a[0], value = _a[1]; el.setAttribute(attr, value); } }; SvgHelper.createTransform = function () { var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); return svg.createSVGTransform(); }; SvgHelper.createDefs = function () { var defs = document.createElementNS('http://www.w3.org/2000/svg', 'defs'); return defs; }; SvgHelper.createMarker = function (id, orient, markerWidth, markerHeight, refX, refY, markerElement) { var marker = document.createElementNS('http://www.w3.org/2000/svg', 'marker'); SvgHelper.setAttributes(marker, [['id', id], ['orient', orient], ['markerWidth', markerWidth.toString()], ['markerHeight', markerHeight.toString()], ['refX', refX.toString()], ['refY', refY.toString()]]); marker.appendChild(markerElement); return marker; }; SvgHelper.createText = function (attributes) { var text = document.createElementNS('http://www.w3.org/2000/svg', 'text'); text.setAttribute('x', '0'); text.setAttribute('y', '0'); if (attributes) { SvgHelper.setAttributes(text, attributes); } return text; }; SvgHelper.createTSpan = function (text, attributes) { var tspan = document.createElementNS('http://www.w3.org/2000/svg', 'tspan'); tspan.textContent = text; if (attributes) { SvgHelper.setAttributes(tspan, attributes); } return tspan; }; return SvgHelper; }(); exports.SvgHelper = SvgHelper; /***/ }), /***/ "./src/renderer/Synthetizer/index.ts": /*!*******************************************!*\ !*** ./src/renderer/Synthetizer/index.ts ***! \*******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var validator_1 = __webpack_require__(/*! ../../utils/validator */ "./src/utils/validator.ts"); var Synthetizer = function () { function Synthetizer() {} Synthetizer.prototype.rasterize = function (target, markerImage, done) { if (!validator_1.isHTMLImageElement(target)) { throw new Error('Error: only support export to HTMLImageElement'); } var canvas = document.createElement('canvas'); canvas.width = markerImage.width.baseVal.value; canvas.height = markerImage.height.baseVal.value; var data = markerImage.outerHTML; var ctx = canvas.getContext('2d'); if (!ctx) { throw new Error('Invalid ctx'); } ctx.drawImage(target, 0, 0, canvas.width, canvas.height); var DOMURL = window.URL; var img = new Image(canvas.width, canvas.height); img.setAttribute('crossOrigin', 'anonymous'); var blob = new Blob([data], { type: 'image/svg+xml' }); var url = DOMURL.createObjectURL(blob); img.onload = function () { ctx.drawImage(img, 0, 0); DOMURL.revokeObjectURL(url); done(canvas.toDataURL('image/png')); }; img.src = url; }; return Synthetizer; }(); exports.Synthetizer = Synthetizer; /***/ }), /***/ "./src/toolbar/Toolbar.ts": /*!********************************!*\ !*** ./src/toolbar/Toolbar.ts ***! \********************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var interactjs_1 = __webpack_require__(/*! interactjs */ "./node_modules/interactjs/dist/interact.js"); var ToolbarButton_1 = __webpack_require__(/*! ./ToolbarButton */ "./src/toolbar/ToolbarButton.ts"); var uuid_1 = __webpack_require__(/*! ../utils/uuid */ "./src/utils/uuid.ts"); __webpack_require__(/*! ./index.less */ "./src/toolbar/index.less"); var index_1 = __webpack_require__(/*! ../renderer/DomEventAware/index */ "./src/renderer/DomEventAware/index.ts"); var toolbar_items_1 = __webpack_require__(/*! ./toolbar-items */ "./src/toolbar/toolbar-items.ts"); var Toolbar = function (_super) { __extends(Toolbar, _super); function Toolbar(toolbarItems, clickHandler) { var _this = _super.call(this) || this; _this.id = uuid_1.uuid(); _this.zIndex = 999; _this.toolbarButtons = []; _this.getUI = function (drawboard) { _this.toolbarUI = document.createElement('div'); _this.toolbarUI.id = "fcw-toolbar-" + _this.id; _this.toolbarUI.className = 'fc-whiteboard-toolbar'; for (var _i = 0, _a = _this.toolbarItems; _i < _a.length; _i++) { var toolbarItem = _a[_i]; var toolbarButton = new ToolbarButton_1.ToolbarButton(toolbarItem, _this.clickHandler); toolbarButton.drawboard = drawboard; _this.toolbarUI.appendChild(toolbarButton.getElement()); _this.toolbarButtons.push(toolbarButton); } _super.prototype.init.call(_this, _this.toolbarUI); interactjs_1.default('#drag-handler').draggable({ onmove: _this.onDragMove }); return _this.toolbarUI; }; _this.onMouseDown = function (downEv) {}; _this.onMouseUp = function (ev) {}; _this.onMouseMove = function (ev) {}; _this.onDragMove = function (event) { var target = _this.toolbarUI; var x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx; var y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; target.style.webkitTransform = target.style.transform = 'translate(' + x + 'px, ' + y + 'px)'; target.style.zIndex = "" + _this.zIndex; target.setAttribute('data-x', x); target.setAttribute('data-y', y); }; _this.toolbarItems = [toolbar_items_1.dragToolbarItem].concat(toolbarItems); _this.clickHandler = clickHandler; return _this; } Object.defineProperty(Toolbar.prototype, "toolbarButtonMap", { get: function () { var buttonMap = {}; this.toolbarButtons.forEach(function (b) { buttonMap[b.id] = b; }); return buttonMap; }, enumerable: true, configurable: true }); Toolbar.prototype.hide = function () { this.toolbarUI.style.visibility = 'hidden'; this.toolbarUI.style.zIndex = '-1'; }; Toolbar.prototype.show = function () { this.toolbarUI.style.visibility = 'visible'; this.toolbarUI.style.zIndex = "" + this.zIndex; }; return Toolbar; }(index_1.DomEventAware); exports.Toolbar = Toolbar; /***/ }), /***/ "./src/toolbar/ToolbarButton.ts": /*!**************************************!*\ !*** ./src/toolbar/ToolbarButton.ts ***! \**************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tippy_js_1 = __webpack_require__(/*! tippy.js */ "./node_modules/tippy.js/esm/index.all.js"); var uuid_1 = __webpack_require__(/*! ../utils/uuid */ "./src/utils/uuid.ts"); var ToolbarButton = function () { function ToolbarButton(toolbarItem, clickHandler) { var _this = this; this.id = uuid_1.uuid(); this.getElement = function () { if (_this.toolbarItem.onRender) { _this.container = _this.toolbarItem.onRender().cloneNode(true); return _this.container; } var div = document.createElement('div'); if (_this.toolbarItem.name !== 'separator') { div.className = 'fc-whiteboard-toolbar-button'; if (_this.clickHandler) { div.addEventListener('click', function (ev) { if (_this.clickHandler) { _this.clickHandler(ev, _this.toolbarItem); } }); } if (_this.toolbarItem.icon) { div.title = _this.toolbarItem.tooltipText || ''; div.innerHTML = _this.toolbarItem.icon; } else { div.innerText = _this.toolbarItem.tooltipText || ''; } if (_this.toolbarItem.tooltipText) { tippy_js_1.default(div, { content: _this.toolbarItem.shortcut ? _this.toolbarItem.tooltipText + " " + _this.toolbarItem.shortcut : _this.toolbarItem.tooltipText }); } } else { div.className = 'fc-whiteboard-toolbar-separator'; } div.id = "fc-whiteboard-toolbar-" + _this.toolbarItem.name; _this.container = div; return div; }; this.toolbarItem = toolbarItem; if (clickHandler) { this.clickHandler = clickHandler; } } return ToolbarButton; }(); exports.ToolbarButton = ToolbarButton; /***/ }), /***/ "./src/toolbar/ToolbarItem.ts": /*!************************************!*\ !*** ./src/toolbar/ToolbarItem.ts ***! \************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var ToolbarItem = function () { function ToolbarItem(_a) { var name = _a.name, tooltipText = _a.tooltipText, shortcut = _a.shortcut, icon = _a.icon, draggable = _a.draggable, markerType = _a.markerType, onRender = _a.onRender, onClick = _a.onClick; if (!name) { throw new Error('Invalid params'); } this.name = name; this.tooltipText = tooltipText; this.shortcut = shortcut; this.icon = icon; this.markerType = markerType; this.draggable = draggable; this.onClick = onClick; this.onRender = onRender; } return ToolbarItem; }(); exports.ToolbarItem = ToolbarItem; /***/ }), /***/ "./src/toolbar/index.less": /*!********************************!*\ !*** ./src/toolbar/index.less ***! \********************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { var content = __webpack_require__(/*! !../../node_modules/css-loader/dist/cjs.js??ref--11-1!../../node_modules/postcss-loader/src!../../node_modules/less-loader/dist/cjs.js??ref--11-3!./index.less */ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/toolbar/index.less"); if(typeof content === 'string') content = [[module.i, content, '']]; var transform; var insertInto; var options = {"hmr":true} options.transform = transform options.insertInto = undefined; var update = __webpack_require__(/*! ../../node_modules/style-loader/lib/addStyles.js */ "./node_modules/style-loader/lib/addStyles.js")(content, options); if(content.locals) module.exports = content.locals; if(false) {} /***/ }), /***/ "./src/toolbar/toolbar-items.ts": /*!**************************************!*\ !*** ./src/toolbar/toolbar-items.ts ***! \**************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var index_1 = __webpack_require__(/*! ./../markers/RectMarker/index */ "./src/markers/RectMarker/index.ts"); var index_2 = __webpack_require__(/*! ./../markers/CoverMarker/index */ "./src/markers/CoverMarker/index.ts"); var index_3 = __webpack_require__(/*! ./../markers/TextMarker/index */ "./src/markers/TextMarker/index.ts"); var index_4 = __webpack_require__(/*! ./../markers/ArrowMarker/index */ "./src/markers/ArrowMarker/index.ts"); var index_5 = __webpack_require__(/*! ./../markers/HighlightMarker/index */ "./src/markers/HighlightMarker/index.ts"); var ToolbarItem_1 = __webpack_require__(/*! ./ToolbarItem */ "./src/toolbar/ToolbarItem.ts"); var LineMarker_1 = __webpack_require__(/*! ../markers/LineMarker */ "./src/markers/LineMarker/index.ts"); var OkIcon = __webpack_require__(/*! ../assets/check.svg */ "./src/assets/check.svg"); var DeleteIcon = __webpack_require__(/*! ../assets/eraser.svg */ "./src/assets/eraser.svg"); var CloseIcon = __webpack_require__(/*! ../assets/times.svg */ "./src/assets/times.svg"); exports.dragToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'drag', tooltipText: 'Drag', icon: __webpack_require__(/*! ../assets/drag.svg */ "./src/assets/drag.svg") }); exports.highlightMarkerToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'cover-marker', tooltipText: 'Hightlight', shortcut: 'Shift+H', icon: __webpack_require__(/*! ../assets/highlight.svg */ "./src/assets/highlight.svg"), markerType: index_5.HighlightMarker, draggable: true }); exports.arrowMarkerToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'arrow-marker', tooltipText: 'Arrow', shortcut: 'Shift+A', icon: __webpack_require__(/*! ../assets/arrow.svg */ "./src/assets/arrow.svg"), markerType: index_4.ArrowMarker, draggable: true }); exports.textMarkerToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'text-marker', tooltipText: 'Text', shortcut: 'Shift+T', icon: __webpack_require__(/*! ../assets/text.svg */ "./src/assets/text.svg"), markerType: index_3.TextMarker, draggable: true }); exports.coverMarkerToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'cover-marker', tooltipText: 'Cover', shortcut: 'Shift+C', icon: __webpack_require__(/*! ../assets/cover.svg */ "./src/assets/cover.svg"), markerType: index_2.CoverMarker, draggable: true }); exports.rectMarkerToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'rect-marker', tooltipText: 'Rectangle', shortcut: 'Shift+R', icon: __webpack_require__(/*! ../assets/rect.svg */ "./src/assets/rect.svg"), markerType: index_1.RectMarker, draggable: true }); exports.lineMarkerToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'line-marker', tooltipText: 'Line', shortcut: 'Shift+L', icon: __webpack_require__(/*! ../assets/line.svg */ "./src/assets/line.svg"), markerType: LineMarker_1.LineMarker, draggable: true }); exports.closeToolbarItem = new ToolbarItem_1.ToolbarItem({ icon: CloseIcon, name: 'close', tooltipText: 'Close' }); exports.separatorToolbarItem = new ToolbarItem_1.ToolbarItem({ name: 'separator', tooltipText: '' }); function getToolbars(page) { var toolbars = [{ icon: DeleteIcon, name: 'delete', tooltipText: 'Delete' }, exports.rectMarkerToolbarItem, exports.coverMarkerToolbarItem, exports.highlightMarkerToolbarItem, exports.lineMarkerToolbarItem, exports.arrowMarkerToolbarItem, exports.textMarkerToolbarItem]; if (!page) { toolbars.push.apply(toolbars, [{ icon: OkIcon, name: 'ok', tooltipText: 'OK' }]); } return toolbars; } exports.getToolbars = getToolbars; /***/ }), /***/ "./src/utils/dom.ts": /*!**************************!*\ !*** ./src/utils/dom.ts ***! \**************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); function createDivWithClassName(className, parent) { var ele = document.createElement('div'); if (parent) { parent.appendChild(ele); } if (className) { addClassName(ele, className); } return ele; } exports.createDivWithClassName = createDivWithClassName; function addClassName(ele, className) { if (!ele) { return; } ele.className = ((ele.className || '') + " " + className).trim(); } exports.addClassName = addClassName; /***/ }), /***/ "./src/utils/layout.ts": /*!*****************************!*\ !*** ./src/utils/layout.ts ***! \*****************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); function rectContains(rect, _a) { var x = _a.x, y = _a.y; if (x < rect.left || x > rect.left + rect.width || y < rect.top || y > rect.top + rect.height) { return false; } return true; } exports.rectContains = rectContains; /***/ }), /***/ "./src/utils/types.ts": /*!****************************!*\ !*** ./src/utils/types.ts ***! \****************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); function isNil(mayBeNil) { return mayBeNil === null || mayBeNil === undefined; } exports.isNil = isNil; /***/ }), /***/ "./src/utils/uuid.ts": /*!***************************!*\ !*** ./src/utils/uuid.ts ***! \***************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var uuidV1 = __webpack_require__(/*! uuid/v1 */ "./node_modules/uuid/v1.js"); exports.uuid = uuidV1; /***/ }), /***/ "./src/utils/validator.ts": /*!********************************!*\ !*** ./src/utils/validator.ts ***! \********************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); function isHTMLImageElement(ele) { if (typeof ele === 'object' && ele instanceof HTMLImageElement) { return true; } return false; } exports.isHTMLImageElement = isHTMLImageElement; /***/ }), /***/ "./src/whiteboard/AbstractWhiteboard/index.less": /*!******************************************************!*\ !*** ./src/whiteboard/AbstractWhiteboard/index.less ***! \******************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { var content = __webpack_require__(/*! !../../../node_modules/css-loader/dist/cjs.js??ref--11-1!../../../node_modules/postcss-loader/src!../../../node_modules/less-loader/dist/cjs.js??ref--11-3!./index.less */ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/whiteboard/AbstractWhiteboard/index.less"); if(typeof content === 'string') content = [[module.i, content, '']]; var transform; var insertInto; var options = {"hmr":true} options.transform = transform options.insertInto = undefined; var update = __webpack_require__(/*! ../../../node_modules/style-loader/lib/addStyles.js */ "./node_modules/style-loader/lib/addStyles.js")(content, options); if(content.locals) module.exports = content.locals; if(false) {} /***/ }), /***/ "./src/whiteboard/AbstractWhiteboard/index.ts": /*!****************************************************!*\ !*** ./src/whiteboard/AbstractWhiteboard/index.ts ***! \****************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var index_1 = __webpack_require__(/*! ../WhitePage/index */ "./src/whiteboard/WhitePage/index.ts"); var uuid_1 = __webpack_require__(/*! ../../utils/uuid */ "./src/utils/uuid.ts"); var dom_1 = __webpack_require__(/*! ../../utils/dom */ "./src/utils/dom.ts"); __webpack_require__(/*! ./index.less */ "./src/whiteboard/AbstractWhiteboard/index.less"); var Siema = __webpack_require__(/*! siema */ "./node_modules/siema/dist/siema.min.js"); var prefix = 'fcw-board'; var AbstractWhiteboard = function () { function AbstractWhiteboard(target, _a) { var _b = _a === void 0 ? {} : _a, sources = _b.sources, eventHub = _b.eventHub, visiblePageIndex = _b.visiblePageIndex, allowRollback = _b.allowRollback, onlyEmitSnap = _b.onlyEmitSnap; this.id = uuid_1.uuid(); this.sources = []; this.imgEles = []; this.allowRollback = false; this.onlyEmitSnap = false; this.snapInterval = 15 * 1000; this.mode = 'master'; this.isFullscreen = false; this.pages = []; this.snapHistory = []; this.isInitialized = false; this.isSyncing = false; this.visiblePageIndex = 0; if (target) { this.target = target; } else { this.target = document.createElement('div'); document.body.appendChild(this.target); } if (!this.target.id) { this.target.id = this.id; } dom_1.addClassName(this.target, prefix); if (sources) { this.sources = sources; } this.eventHub = eventHub; if (typeof visiblePageIndex !== 'undefined') { this.visiblePageIndex = visiblePageIndex; } this.onlyEmitSnap = !!onlyEmitSnap; if (typeof allowRollback !== 'undefined') { this.allowRollback = !!allowRollback; } this.init(); } Object.defineProperty(AbstractWhiteboard.prototype, "activePage", { get: function () { return this.pages[this.visiblePageIndex]; }, enumerable: true, configurable: true }); Object.defineProperty(AbstractWhiteboard.prototype, "pageMap", { get: function () { var map = {}; this.pages.forEach(function (p) { return map[p.id] = p; }); return map; }, enumerable: true, configurable: true }); AbstractWhiteboard.prototype.open = function () { var _this = this; this.pages.forEach(function (page, i) { page.open(); if (i !== _this.visiblePageIndex) { page.hide(); } }); }; AbstractWhiteboard.prototype.close = function () { if (this.emitInterval) { clearInterval(this.emitInterval); } }; AbstractWhiteboard.prototype.show = function () { if (this.activePage) { this.activePage.show(); } }; AbstractWhiteboard.prototype.hide = function () { if (this.activePage) { this.activePage.hide(); } }; AbstractWhiteboard.prototype.emit = function (borderEvent) { if (this.mode !== 'master' || !this.eventHub) { return; } if (this.onlyEmitSnap) { if (borderEvent.event !== 'borderSnap') { return; } } if (this.allowRollback && (borderEvent.event === 'addMarker' || borderEvent.event === 'removeMarker')) { if (this.snapHistory.length > 20) { this.snapHistory.shift(); } this.snapHistory.push(this.captureSnap(false)); } borderEvent.timestamp = Math.floor(Date.now() / 1000); this.eventHub.emit('sync', borderEvent); }; AbstractWhiteboard.prototype.captureSnap = function (shadow) { if (shadow === void 0) { shadow = true; } if (shadow) { return { id: this.id, sources: this.sources, pageIds: this.pages.map(function (page) { return page.id; }), visiblePageIndex: this.visiblePageIndex }; } return { id: this.id, sources: this.sources, pageIds: this.pages.map(function (page) { return page.id; }), visiblePageIndex: this.visiblePageIndex, pages: this.pages.map(function (p) { return p.captureSnap(); }) }; }; AbstractWhiteboard.prototype.rollbackSnap = function () { if (this.snapHistory.length === 0) { return; } this.snapHistory.pop(); var snap = this.snapHistory[this.snapHistory.length - 1]; if (snap) { this.applySnap(snap); } }; AbstractWhiteboard.prototype.destroy = function () { if (this.emitInterval) { clearInterval(this.emitInterval); } if (this.eventHub) { this.eventHub.removeAllListeners(); } if (this.siema) { this.siema.destroy(); } this.imgsContainer.remove(); this.pagesContainer.remove(); this.pages.forEach(function (page) { page.destroy(); }); }; AbstractWhiteboard.prototype.initSiema = function () { var _this = this; this.sources.forEach(function (source) { var imgEle = document.createElement('div'); dom_1.addClassName(imgEle, prefix + "-img-wrapper"); imgEle.style.backgroundImage = "url(" + source + ")"; _this.imgEles.push(imgEle); _this.imgsContainer.appendChild(imgEle); }); this.siema = new Siema({ selector: this.imgsContainer, duration: 200, easing: 'ease-out', perPage: 1, startIndex: 0, draggable: false, multipleDrag: true, threshold: 20, loop: false, rtl: false }); }; AbstractWhiteboard.prototype.applySnap = function (snap) { var _this = this; var id = snap.id, sources = snap.sources, pageIds = snap.pageIds; if (!this.isInitialized && !this.isSyncing) { this.id = id; this.sources = sources; this.isSyncing = true; this.sources.forEach(function (source, i) { var page = new index_1.WhitePage({ imgSrc: source }, { mode: _this.mode, whiteboard: _this, parentContainer: _this.pagesContainer }); page.id = pageIds[i]; page.container.style.visibility = 'hidden'; _this.pages.push(page); page.open(); }); this.initSiema(); this.isInitialized = true; this.isSyncing = false; } this.onPageChange(snap.visiblePageIndex); (snap.pages || []).forEach(function (pageSnap) { var page = _this.pageMap[pageSnap.id]; if (page) { page.applySnap(pageSnap); } }); }; return AbstractWhiteboard; }(); exports.AbstractWhiteboard = AbstractWhiteboard; /***/ }), /***/ "./src/whiteboard/MirrorWhiteboard/index.ts": /*!**************************************************!*\ !*** ./src/whiteboard/MirrorWhiteboard/index.ts ***! \**************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var dom_1 = __webpack_require__(/*! ../../utils/dom */ "./src/utils/dom.ts"); var index_1 = __webpack_require__(/*! ../AbstractWhiteboard/index */ "./src/whiteboard/AbstractWhiteboard/index.ts"); var prefix = 'fcw-board'; var MirrorWhiteboard = function (_super) { __extends(MirrorWhiteboard, _super); function MirrorWhiteboard() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.mode = 'mirror'; return _this; } MirrorWhiteboard.prototype.init = function () { var _this = this; this.imgsContainer = dom_1.createDivWithClassName(prefix + "-imgs", this.target); this.pagesContainer = dom_1.createDivWithClassName(prefix + "-pages", this.target); if (!this.eventHub) { throw new Error('Invalid eventHub'); } this.eventHub.on('sync', function (ev) { if (ev.target !== 'whiteboard' || !ev.border) { return; } if (ev.event === 'borderSnap') { _this.applySnap(ev.border); } if (ev.event === 'borderChangePage' && ev.id === _this.id) { if (_this.isInitialized) { _this.onPageChange(ev.border.visiblePageIndex); } } if (ev.event === 'finish' && ev.id === _this.id) { _this.destroy(); } }); }; MirrorWhiteboard.prototype.destroy = function () { _super.prototype.destroy.call(this); }; MirrorWhiteboard.prototype.onPageChange = function (nextPageIndex) { if (this.visiblePageIndex === nextPageIndex) { return; } this.siema.goTo(nextPageIndex); this.visiblePageIndex = nextPageIndex; this.pages.forEach(function (page, i) { if (nextPageIndex === i) { page.show(); } else { page.hide(); } }); this.emit({ event: 'borderChangePage', id: this.id, target: 'whiteboard', border: this.captureSnap() }); }; return MirrorWhiteboard; }(index_1.AbstractWhiteboard); exports.MirrorWhiteboard = MirrorWhiteboard; /***/ }), /***/ "./src/whiteboard/ReplayWhiteboard/index.ts": /*!**************************************************!*\ !*** ./src/whiteboard/ReplayWhiteboard/index.ts ***! \**************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var MirrorWhiteboard_1 = __webpack_require__(/*! ../MirrorWhiteboard */ "./src/whiteboard/MirrorWhiteboard/index.ts"); var EventHub_1 = __webpack_require__(/*! ../../event/EventHub */ "./src/event/EventHub.ts"); var windowSize = 60 * 1000; var duration = 0.05; var ReplayWhiteboard = function (_super) { __extends(ReplayWhiteboard, _super); function ReplayWhiteboard() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.leftEvents = []; _this.currentRelativeTime = 0; _this.loadedRelativeTime = -1; _this.loadingLock = false; _this.seekingLock = false; _this.seek = function () { if (_this.seekingLock) { return; } _this.seekingLock = true; if (_this.loadedRelativeTime < _this.currentRelativeTime) { _this.loadEvents(); } var waitingEvents = []; var leftEvents = []; _this.leftEvents.forEach(function (e, i) { if (e.timestamp && e.timestamp < _this.currentRelativeTime + _this.recordStartTime) { waitingEvents.push(e); } else { leftEvents.push(e); } }); _this.leftEvents = leftEvents; waitingEvents.forEach(function (e) { _this.perform(e); }); _this.currentRelativeTime += duration; _this.seekingLock = false; }; _this.perform = function (e) { _this.eventHub.emit('sync', e); }; return _this; } ReplayWhiteboard.prototype.setContext = function (recordStartTime, onLoad) { var _this = this; this.recordStartTime = recordStartTime; this.onLoad = onLoad; if (this.interval) { clearInterval(this.interval); } this.interval = setInterval(function () { _this.seek(); }, duration * 1000); }; ReplayWhiteboard.prototype.setCurrentRelativeTime = function (time) { this.currentRelativeTime = time; this.loadedRelativeTime = this.currentRelativeTime - 1; }; ReplayWhiteboard.prototype.close = function () { _super.prototype.close.call(this); if (this.interval) { clearInterval(this.interval); } }; ReplayWhiteboard.prototype.init = function () { this.eventHub = new EventHub_1.EventHub(); _super.prototype.init.call(this); }; ReplayWhiteboard.prototype.loadEvents = function () { var _this = this; if (this.onLoad && !this.loadingLock) { this.loadingLock = true; var startTime = this.recordStartTime + this.currentRelativeTime; var endTime = startTime + windowSize; this.onLoad(startTime, endTime).then(function (events) { var _a; _this.loadedRelativeTime = _this.currentRelativeTime; (_a = _this.leftEvents).push.apply(_a, events || []); }).finally(function () { _this.loadingLock = false; }); } }; return ReplayWhiteboard; }(MirrorWhiteboard_1.MirrorWhiteboard); exports.ReplayWhiteboard = ReplayWhiteboard; /***/ }), /***/ "./src/whiteboard/WhitePage/index.less": /*!*********************************************!*\ !*** ./src/whiteboard/WhitePage/index.less ***! \*********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { var content = __webpack_require__(/*! !../../../node_modules/css-loader/dist/cjs.js??ref--11-1!../../../node_modules/postcss-loader/src!../../../node_modules/less-loader/dist/cjs.js??ref--11-3!./index.less */ "./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js!./node_modules/less-loader/dist/cjs.js?!./src/whiteboard/WhitePage/index.less"); if(typeof content === 'string') content = [[module.i, content, '']]; var transform; var insertInto; var options = {"hmr":true} options.transform = transform options.insertInto = undefined; var update = __webpack_require__(/*! ../../../node_modules/style-loader/lib/addStyles.js */ "./node_modules/style-loader/lib/addStyles.js")(content, options); if(content.locals) module.exports = content.locals; if(false) {} /***/ }), /***/ "./src/whiteboard/WhitePage/index.ts": /*!*******************************************!*\ !*** ./src/whiteboard/WhitePage/index.ts ***! \*******************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var index_1 = __webpack_require__(/*! ./../../drawboard/Drawboard/index */ "./src/drawboard/Drawboard/index.ts"); var uuid_1 = __webpack_require__(/*! ../../utils/uuid */ "./src/utils/uuid.ts"); var types_1 = __webpack_require__(/*! ../../markers/types */ "./src/markers/types.ts"); var dom_1 = __webpack_require__(/*! ../../utils/dom */ "./src/utils/dom.ts"); __webpack_require__(/*! ./index.less */ "./src/whiteboard/WhitePage/index.less"); var prefix = 'fcw-page'; var WhitePage = function () { function WhitePage(source, _a) { var _b = _a === void 0 ? {} : _a, mode = _b.mode, whiteboard = _b.whiteboard, parentContainer = _b.parentContainer, extraToolbarItems = _b.extraToolbarItems; this.id = uuid_1.uuid(); this.mode = 'master'; if (mode) { this.mode = mode; } this.parentContainer = parentContainer; this.whiteboard = whiteboard; this.initSource(source); if (this.mode === 'master') { this.initMaster(extraToolbarItems); } if (this.mode === 'mirror') { this.initMirror(); } } WhitePage.prototype.open = function () { this.drawboard.open(); }; WhitePage.prototype.hide = function () { this.drawboard.hide(); }; WhitePage.prototype.show = function () { this.drawboard.show(); }; WhitePage.prototype.destroy = function () { this.drawboard.destroy(); }; WhitePage.prototype.captureSnap = function () { var markerSnaps = this.drawboard.markers.map(function (m) { return m.captureSnap(); }); return { id: this.id, markers: markerSnaps }; }; WhitePage.prototype.applySnap = function (snap) { var _this = this; var markerIdsSet = new Set(); snap.markers.forEach(function (markerSnap) { var marker = _this.drawboard.markerMap[markerSnap.id]; markerIdsSet.add(markerSnap.id); if (marker) { marker.applySnap(markerSnap); } else { var newMarker = _this.drawboard.addMarker(types_1.getMarkerByType(markerSnap.type), { id: markerSnap.id }); newMarker.applySnap(markerSnap); } }); this.drawboard.markers.forEach(function (marker) { if (!markerIdsSet.has(marker.id)) { _this.drawboard.deleteMarkerWithEvent(marker); } }); }; WhitePage.prototype.initSource = function (source) { if (typeof source.imgSrc === 'string' && !this.parentContainer) { throw new Error('Invalid source, If you set image url, you must also set parentContainer'); } this.source = source; if (source.imgEle) { this.target = source.imgEle; } if (typeof source.imgSrc === 'string') { this.container = dom_1.createDivWithClassName(prefix, this.parentContainer); this.container.id = this.id; this.target = document.createElement('img'); this.target.src = source.imgSrc; this.target.alt = 'Siema image'; this.container.appendChild(this.target); } }; WhitePage.prototype.initMaster = function (extraToolbarItems) { var _this = this; if (this.whiteboard) { this.drawboard = new index_1.Drawboard({ imgEle: this.target }, { extraToolbarItems: extraToolbarItems, mountContainer: this.whiteboard.target, page: this, onChange: function (ev) { return _this.whiteboard.emit(ev); } }); } else { this.drawboard = new index_1.Drawboard({ imgEle: this.target }, { page: this, mountContainer: this.whiteboard.target }); } }; WhitePage.prototype.initMirror = function () { var _this = this; if (!this.whiteboard) { throw new Error('Invalid whiteboard'); } this.drawboard = new index_1.Drawboard({ imgEle: this.target }, { page: this, mountContainer: this.whiteboard.target }); this.whiteboard.eventHub.on('sync', function (ev) { try { if (ev.target === 'page' && ev.id === _this.id) { _this.onPageSync(); } if (ev.target === 'marker') { _this.onMarkerSync(ev); } } catch (e) { console.warn(e); } }); }; WhitePage.prototype.onPageSync = function () {}; WhitePage.prototype.onMarkerSync = function (ev) { if (!ev.marker) { return; } var id = ev.id; if (ev.event === 'addMarker' && ev.parentId === this.id) { var marker = this.drawboard.markerMap[id]; if (!marker) { this.drawboard.addMarker(types_1.getMarkerByType(ev.marker.type), { id: ev.marker.id, originX: ev.marker.dx, originY: ev.marker.dy }); } } if (!id) { return; } if (ev.event === 'removeMarker') { var marker = this.drawboard.markerMap[id]; if (marker) { this.drawboard.deleteMarker(marker); } } if (ev.event === 'moveMarker' || ev.event === 'resizeMarker') { var marker = this.drawboard.markerMap[id]; if (marker) { marker.reactToManipulation(ev.event, ev.marker); } } if (ev.event === 'inputMarker') { var marker = this.drawboard.markerMap[id]; if (marker) { marker.setText(ev.marker.text); } } }; return WhitePage; }(); exports.WhitePage = WhitePage; /***/ }), /***/ "./src/whiteboard/Whiteboard/index.ts": /*!********************************************!*\ !*** ./src/whiteboard/Whiteboard/index.ts ***! \********************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; var __extends = this && this.__extends || function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; } || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; }(); Object.defineProperty(exports, "__esModule", { value: true }); var index_1 = __webpack_require__(/*! ../WhitePage/index */ "./src/whiteboard/WhitePage/index.ts"); var dom_1 = __webpack_require__(/*! ../../utils/dom */ "./src/utils/dom.ts"); var index_2 = __webpack_require__(/*! ../AbstractWhiteboard/index */ "./src/whiteboard/AbstractWhiteboard/index.ts"); var toolbar_items_1 = __webpack_require__(/*! ../../toolbar/toolbar-items */ "./src/toolbar/toolbar-items.ts"); var LeftArrowIcon = __webpack_require__(/*! ../../assets/bx-left-arrow.svg */ "./src/assets/bx-left-arrow.svg"); var RightArrowIcon = __webpack_require__(/*! ../../assets/bx-right-arrow.svg */ "./src/assets/bx-right-arrow.svg"); var FinishIcon = __webpack_require__(/*! ../../assets/finish.svg */ "./src/assets/finish.svg"); var RollbackIcon = __webpack_require__(/*! ../../assets/rollback.svg */ "./src/assets/rollback.svg"); var prefix = 'fcw-board'; var Whiteboard = function (_super) { __extends(Whiteboard, _super); function Whiteboard() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.mode = 'master'; return _this; } Whiteboard.prototype.destroy = function () { _super.prototype.destroy.call(this); }; Whiteboard.prototype.init = function () { this.imgsContainer = dom_1.createDivWithClassName(prefix + "-imgs", this.target); this.pagesContainer = dom_1.createDivWithClassName(prefix + "-pages", this.target); this.initMaster(); this.snapHistory.push(this.captureSnap(false)); this.emitSnapshot(); }; Whiteboard.prototype.initMaster = function () { var _this = this; this.isInitialized = true; var prevToolbarItem = { icon: LeftArrowIcon, name: 'prev-flip-arrow', tooltipText: 'Prev', onClick: function () { var nextPageIndex = _this.visiblePageIndex - 1 < 0 ? _this.pages.length - 1 : _this.visiblePageIndex - 1; document.querySelectorAll('.fc-whiteboard-indicator-current').forEach(function (e) { e.innerHTML = "" + (nextPageIndex + 1); }); _this.onPageChange(nextPageIndex); } }; var indicatorContainer = document.createElement('div'); indicatorContainer.className = 'fc-whiteboard-indicator-container'; var indicatorCurrent = document.createElement('span'); indicatorCurrent.className = 'fc-whiteboard-indicator-current'; indicatorCurrent.innerHTML = "" + (this.visiblePageIndex + 1); indicatorContainer.appendChild(indicatorCurrent); indicatorContainer.appendChild(document.createTextNode("/" + this.sources.length)); var indicatorItem = { name: 'indicator', onRender: function () { return indicatorContainer; } }; var nextToolbarItem = { icon: RightArrowIcon, name: 'next-flip-arrow', tooltipText: 'Next', onClick: function () { var nextPageIndex = _this.visiblePageIndex + 1 > _this.pages.length - 1 ? 0 : _this.visiblePageIndex + 1; document.querySelectorAll('.fc-whiteboard-indicator-current').forEach(function (e) { e.innerHTML = "" + (nextPageIndex + 1); }); _this.onPageChange(nextPageIndex); } }; var finishItem = { icon: FinishIcon, name: 'finish', tooltipText: 'Finish', onClick: function () { _this.emit({ event: 'finish', id: _this.id, target: 'whiteboard' }); } }; var rollbackItem = { icon: RollbackIcon, name: 'rollback', tooltipText: 'Rollback', shortcut: 'ESC', onClick: function () { _this.rollbackSnap(); } }; this.sources.forEach(function (source) { var page = new index_1.WhitePage({ imgSrc: source }, { mode: _this.mode, whiteboard: _this, parentContainer: _this.pagesContainer, extraToolbarItems: [toolbar_items_1.separatorToolbarItem, prevToolbarItem, indicatorItem, nextToolbarItem, toolbar_items_1.separatorToolbarItem, finishItem, rollbackItem] }); page.container.style.visibility = 'hidden'; _this.pages.push(page); }); this.initSiema(); }; Whiteboard.prototype.onPageChange = function (nextPageIndex) { if (this.visiblePageIndex === nextPageIndex) { return; } this.siema.goTo(nextPageIndex); this.visiblePageIndex = nextPageIndex; this.pages.forEach(function (page, i) { if (nextPageIndex === i) { page.show(); } else { page.hide(); } }); this.emit({ event: 'borderChangePage', id: this.id, target: 'whiteboard', border: this.captureSnap() }); }; Whiteboard.prototype.emitSnapshot = function () { var _this = this; var innerFunc = function () { _this.emit({ event: 'borderSnap', id: _this.id, target: 'whiteboard', border: _this.captureSnap(false) }); }; this.emitInterval = setInterval(function () { innerFunc(); }, this.snapInterval); setTimeout(innerFunc, 500); }; return Whiteboard; }(index_2.AbstractWhiteboard); exports.Whiteboard = Whiteboard; /***/ }) /******/ }); }); //# sourceMappingURL=index.js.map