/* * Konva JavaScript Framework v@@version * http://konvajs.org/ * Licensed under the MIT * Date: @@date * * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS) * Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva) * * @license */ var PI_OVER_180 = Math.PI / 180; /** * @namespace Konva */ function detectBrowser() { return ( typeof window !== 'undefined' && // browser case ({}.toString.call(window) === '[object Window]' || // electron case {}.toString.call(window) === '[object global]') ); } const _detectIE = function(ua) { var msie = ua.indexOf('msie '); if (msie > 0) { // IE 10 or older => return version number return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10); } var trident = ua.indexOf('trident/'); if (trident > 0) { // IE 11 => return version number var rv = ua.indexOf('rv:'); return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10); } var edge = ua.indexOf('edge/'); if (edge > 0) { // Edge (IE 12+) => return version number return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10); } // other browser return false; }; export const _parseUA = function(userAgent) { var ua = userAgent.toLowerCase(), // jQuery UA regex match = /(chrome)[ /]([\w.]+)/.exec(ua) || /(webkit)[ /]([\w.]+)/.exec(ua) || /(opera)(?:.*version|)[ /]([\w.]+)/.exec(ua) || /(msie) ([\w.]+)/.exec(ua) || (ua.indexOf('compatible') < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua)) || [], // adding mobile flag as well mobile = !!userAgent.match( /Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i ), ieMobile = !!userAgent.match(/IEMobile/i); return { browser: match[1] || '', version: match[2] || '0', isIE: _detectIE(ua), // adding mobile flab mobile: mobile, ieMobile: ieMobile // If this is true (i.e., WP8), then Konva touch events are executed instead of equivalent Konva mouse events }; }; declare const WorkerGlobalScope: any; export const glob: any = typeof global !== 'undefined' ? global : typeof window !== 'undefined' ? window : typeof WorkerGlobalScope !== 'undefined' ? self : {}; export const Konva = { _global: glob, version: '@@version', isBrowser: detectBrowser(), isUnminified: /param/.test(function(param) {}.toString()), dblClickWindow: 400, getAngle(angle) { return Konva.angleDeg ? angle * PI_OVER_180 : angle; }, enableTrace: false, _pointerEventsEnabled: false, /** * Should we enable hit detection while dragging? For performance reasons, by default it is false. * But on some rare cases you want to see hit graph and check intersections. Just set it to true. * @property hitOnDragEnabled * @default false * @name hitOnDragEnabled * @memberof Konva * @example * Konva.hitOnDragEnabled = true; */ hitOnDragEnabled: false, /** * Should we capture touch events and bind them to the touchstart target? That is how it works on DOM elements. * The case: we touchstart on div1, then touchmove out of that element into another element div2. * DOM will continue trigger touchmove events on div1 (not div2). Because events are "captured" into initial target. * By default Konva do not do that and will trigger touchmove on another element, while pointer is moving. * @property captureTouchEventsEnabled * @default false * @name captureTouchEventsEnabled * @memberof Konva * @example * Konva.captureTouchEventsEnabled = true; */ captureTouchEventsEnabled: false, // TODO: move that to stage? listenClickTap: false, inDblClickWindow: false, /** * Global pixel ratio configuration. KonvaJS automatically detect pixel ratio of current device. * But you may override such property, if you want to use your value. Set this value before any components initializations. * @property pixelRatio * @default undefined * @name pixelRatio * @memberof Konva * @example * // before any Konva code: * Konva.pixelRatio = 1; */ pixelRatio: undefined, /** * Drag distance property. If you start to drag a node you may want to wait until pointer is moved to some distance from start point, * only then start dragging. Default is 3px. * @property dragDistance * @default 0 * @memberof Konva * @example * Konva.dragDistance = 10; */ dragDistance: 3, /** * Use degree values for angle properties. You may set this property to false if you want to use radian values. * @property angleDeg * @default true * @memberof Konva * @example * node.rotation(45); // 45 degrees * Konva.angleDeg = false; * node.rotation(Math.PI / 2); // PI/2 radian */ angleDeg: true, /** * Show different warnings about errors or wrong API usage * @property showWarnings * @default true * @memberof Konva * @example * Konva.showWarnings = false; */ showWarnings: true, /** * Configure what mouse buttons can be used for drag and drop. * Default value is [0] - only left mouse button. * @property dragButtons * @default true * @memberof Konva * @example * // enable left and right mouse buttons * Konva.dragButtons = [0, 2]; */ dragButtons: [0, 1], /** * returns whether or not drag and drop is currently active * @method * @memberof Konva */ isDragging() { return Konva['DD'].isDragging; }, /** * returns whether or not a drag and drop operation is ready, but may * not necessarily have started * @method * @memberof Konva */ isDragReady() { return !!Konva['DD'].node; }, // user agent UA: _parseUA((glob.navigator && glob.navigator.userAgent) || ''), document: glob.document, // insert Konva into global namespace (window) // it is required for npm packages _injectGlobal(Konva) { glob.Konva = Konva; }, _parseUA }; export const _NODES_REGISTRY = {}; export const _registerNode = NodeClass => { _NODES_REGISTRY[NodeClass.prototype.getClassName()] = NodeClass; Konva[NodeClass.prototype.getClassName()] = NodeClass; };