Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| cf48fce4ff | |||
| 7536ff56a6 | |||
| fc23c2fc56 | |||
| 9386ff06fe | |||
| bbea6e4ae2 | |||
| 6ff819d917 | |||
| 27db37d21d | |||
| 3ca25b3e93 |
@@ -12,11 +12,16 @@ and some dependencies locally
|
||||
|
||||
## Build
|
||||
|
||||
To build the two iwmlib files type
|
||||
To build the iwmlib files type
|
||||
|
||||
`npm run build`
|
||||
|
||||
The files will be generated in the dist folder (iwmlib.js and iwmlib.pixi.js). If you want to watch the files for a continuously build type
|
||||
The files
|
||||
|
||||
- imwlib.js
|
||||
- iwmlib.pixi.js
|
||||
|
||||
will be generated in the dist folder. If you want to build the files continuously type
|
||||
|
||||
`npm run watch`
|
||||
|
||||
|
||||
Vendored
+1
-1
@@ -13758,11 +13758,11 @@
|
||||
if (this.opts.app) {
|
||||
const app = this.opts.app;
|
||||
app.view.addEventListener('mousewheel', event => {
|
||||
event.preventDefault();
|
||||
const bounds = this.mask ? this.mask.getBounds() : this.getBounds();
|
||||
const x = event.clientX - app.view.getBoundingClientRect().left;
|
||||
const y = event.clientY - app.view.getBoundingClientRect().top;
|
||||
if (bounds.contains(x, y)) {
|
||||
event.preventDefault();
|
||||
this.emit('scroll', event);
|
||||
}
|
||||
});
|
||||
|
||||
+6773
File diff suppressed because it is too large
Load Diff
+45086
File diff suppressed because one or more lines are too long
@@ -0,0 +1,112 @@
|
||||
export default (function () {
|
||||
function AwaitValue(value) {
|
||||
this.value = value;
|
||||
}
|
||||
|
||||
function AsyncGenerator(gen) {
|
||||
var front, back;
|
||||
|
||||
function send(key, arg) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
var request = {
|
||||
key: key,
|
||||
arg: arg,
|
||||
resolve: resolve,
|
||||
reject: reject,
|
||||
next: null
|
||||
};
|
||||
|
||||
if (back) {
|
||||
back = back.next = request;
|
||||
} else {
|
||||
front = back = request;
|
||||
resume(key, arg);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function resume(key, arg) {
|
||||
try {
|
||||
var result = gen[key](arg);
|
||||
var value = result.value;
|
||||
|
||||
if (value instanceof AwaitValue) {
|
||||
Promise.resolve(value.value).then(function (arg) {
|
||||
resume("next", arg);
|
||||
}, function (arg) {
|
||||
resume("throw", arg);
|
||||
});
|
||||
} else {
|
||||
settle(result.done ? "return" : "normal", result.value);
|
||||
}
|
||||
} catch (err) {
|
||||
settle("throw", err);
|
||||
}
|
||||
}
|
||||
|
||||
function settle(type, value) {
|
||||
switch (type) {
|
||||
case "return":
|
||||
front.resolve({
|
||||
value: value,
|
||||
done: true
|
||||
});
|
||||
break;
|
||||
|
||||
case "throw":
|
||||
front.reject(value);
|
||||
break;
|
||||
|
||||
default:
|
||||
front.resolve({
|
||||
value: value,
|
||||
done: false
|
||||
});
|
||||
break;
|
||||
}
|
||||
|
||||
front = front.next;
|
||||
|
||||
if (front) {
|
||||
resume(front.key, front.arg);
|
||||
} else {
|
||||
back = null;
|
||||
}
|
||||
}
|
||||
|
||||
this._invoke = send;
|
||||
|
||||
if (typeof gen.return !== "function") {
|
||||
this.return = undefined;
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof Symbol === "function" && Symbol.asyncIterator) {
|
||||
AsyncGenerator.prototype[Symbol.asyncIterator] = function () {
|
||||
return this;
|
||||
};
|
||||
}
|
||||
|
||||
AsyncGenerator.prototype.next = function (arg) {
|
||||
return this._invoke("next", arg);
|
||||
};
|
||||
|
||||
AsyncGenerator.prototype.throw = function (arg) {
|
||||
return this._invoke("throw", arg);
|
||||
};
|
||||
|
||||
AsyncGenerator.prototype.return = function (arg) {
|
||||
return this._invoke("return", arg);
|
||||
};
|
||||
|
||||
return {
|
||||
wrap: function (fn) {
|
||||
return function () {
|
||||
return new AsyncGenerator(fn.apply(this, arguments));
|
||||
};
|
||||
},
|
||||
await: function (value) {
|
||||
return new AwaitValue(value);
|
||||
}
|
||||
};
|
||||
})();
|
||||
@@ -0,0 +1,51 @@
|
||||
export default (function (inner, awaitWrap) {
|
||||
var iter = {},
|
||||
waiting = false;
|
||||
|
||||
function pump(key, value) {
|
||||
waiting = true;
|
||||
value = new Promise(function (resolve) {
|
||||
resolve(inner[key](value));
|
||||
});
|
||||
return {
|
||||
done: false,
|
||||
value: awaitWrap(value)
|
||||
};
|
||||
}
|
||||
|
||||
;
|
||||
|
||||
if (typeof Symbol === "function" && Symbol.iterator) {
|
||||
iter[Symbol.iterator] = function () {
|
||||
return this;
|
||||
};
|
||||
}
|
||||
|
||||
iter.next = function (value) {
|
||||
if (waiting) {
|
||||
waiting = false;
|
||||
return value;
|
||||
}
|
||||
|
||||
return pump("next", value);
|
||||
};
|
||||
|
||||
if (typeof inner.throw === "function") {
|
||||
iter.throw = function (value) {
|
||||
if (waiting) {
|
||||
waiting = false;
|
||||
throw value;
|
||||
}
|
||||
|
||||
return pump("throw", value);
|
||||
};
|
||||
}
|
||||
|
||||
if (typeof inner.return === "function") {
|
||||
iter.return = function (value) {
|
||||
return pump("return", value);
|
||||
};
|
||||
}
|
||||
|
||||
return iter;
|
||||
});
|
||||
@@ -0,0 +1,14 @@
|
||||
export default (function (iterable) {
|
||||
if (typeof Symbol === "function") {
|
||||
if (Symbol.asyncIterator) {
|
||||
var method = iterable[Symbol.asyncIterator];
|
||||
if (method != null) return method.call(iterable);
|
||||
}
|
||||
|
||||
if (Symbol.iterator) {
|
||||
return iterable[Symbol.iterator]();
|
||||
}
|
||||
}
|
||||
|
||||
throw new TypeError("Object is not async iterable");
|
||||
});
|
||||
@@ -0,0 +1,28 @@
|
||||
export default (function (fn) {
|
||||
return function () {
|
||||
var gen = fn.apply(this, arguments);
|
||||
return new Promise(function (resolve, reject) {
|
||||
function step(key, arg) {
|
||||
try {
|
||||
var info = gen[key](arg);
|
||||
var value = info.value;
|
||||
} catch (error) {
|
||||
reject(error);
|
||||
return;
|
||||
}
|
||||
|
||||
if (info.done) {
|
||||
resolve(value);
|
||||
} else {
|
||||
return Promise.resolve(value).then(function (value) {
|
||||
step("next", value);
|
||||
}, function (err) {
|
||||
step("throw", err);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return step("next");
|
||||
});
|
||||
};
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
export default (function (instance, Constructor) {
|
||||
if (!(instance instanceof Constructor)) {
|
||||
throw new TypeError("Cannot call a class as a function");
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,17 @@
|
||||
export default (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;
|
||||
};
|
||||
})();
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
export default (function (obj, defaults) {
|
||||
var keys = Object.getOwnPropertyNames(defaults);
|
||||
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
var value = Object.getOwnPropertyDescriptor(defaults, key);
|
||||
|
||||
if (value && value.configurable && obj[key] === undefined) {
|
||||
Object.defineProperty(obj, key, value);
|
||||
}
|
||||
}
|
||||
|
||||
return obj;
|
||||
});
|
||||
@@ -0,0 +1,10 @@
|
||||
export default (function (obj, descs) {
|
||||
for (var key in descs) {
|
||||
var desc = descs[key];
|
||||
desc.configurable = desc.enumerable = true;
|
||||
if ("value" in desc) desc.writable = true;
|
||||
Object.defineProperty(obj, key, desc);
|
||||
}
|
||||
|
||||
return obj;
|
||||
});
|
||||
@@ -0,0 +1,14 @@
|
||||
export default (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;
|
||||
});
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
export default 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;
|
||||
};
|
||||
+24
@@ -0,0 +1,24 @@
|
||||
export default (function get(object, property, receiver) {
|
||||
if (object === null) object = Function.prototype;
|
||||
var desc = Object.getOwnPropertyDescriptor(object, property);
|
||||
|
||||
if (desc === undefined) {
|
||||
var parent = Object.getPrototypeOf(object);
|
||||
|
||||
if (parent === null) {
|
||||
return undefined;
|
||||
} else {
|
||||
return get(parent, property, receiver);
|
||||
}
|
||||
} else if ("value" in desc) {
|
||||
return desc.value;
|
||||
} else {
|
||||
var getter = desc.get;
|
||||
|
||||
if (getter === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return getter.call(receiver);
|
||||
}
|
||||
});
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
export default (function (subClass, superClass) {
|
||||
if (typeof superClass !== "function" && superClass !== null) {
|
||||
throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
|
||||
}
|
||||
|
||||
subClass.prototype = Object.create(superClass && superClass.prototype, {
|
||||
constructor: {
|
||||
value: subClass,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
configurable: true
|
||||
}
|
||||
});
|
||||
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
export default (function (left, right) {
|
||||
if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
|
||||
return right[Symbol.hasInstance](left);
|
||||
} else {
|
||||
return left instanceof right;
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
export default (function (obj) {
|
||||
return obj && obj.__esModule ? obj : {
|
||||
default: obj
|
||||
};
|
||||
});
|
||||
@@ -0,0 +1,16 @@
|
||||
export default (function (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)) newObj[key] = obj[key];
|
||||
}
|
||||
}
|
||||
|
||||
newObj.default = obj;
|
||||
return newObj;
|
||||
}
|
||||
});
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
export default (function () {
|
||||
var REACT_ELEMENT_TYPE = typeof Symbol === "function" && Symbol.for && Symbol.for("react.element") || 0xeac7;
|
||||
return function createRawReactElement(type, props, key, children) {
|
||||
var defaultProps = type && type.defaultProps;
|
||||
var childrenLength = arguments.length - 3;
|
||||
|
||||
if (!props && childrenLength !== 0) {
|
||||
props = {};
|
||||
}
|
||||
|
||||
if (props && defaultProps) {
|
||||
for (var propName in defaultProps) {
|
||||
if (props[propName] === void 0) {
|
||||
props[propName] = defaultProps[propName];
|
||||
}
|
||||
}
|
||||
} else if (!props) {
|
||||
props = defaultProps || {};
|
||||
}
|
||||
|
||||
if (childrenLength === 1) {
|
||||
props.children = children;
|
||||
} else if (childrenLength > 1) {
|
||||
var childArray = Array(childrenLength);
|
||||
|
||||
for (var i = 0; i < childrenLength; i++) {
|
||||
childArray[i] = arguments[i + 3];
|
||||
}
|
||||
|
||||
props.children = childArray;
|
||||
}
|
||||
|
||||
return {
|
||||
$$typeof: REACT_ELEMENT_TYPE,
|
||||
type: type,
|
||||
key: key === undefined ? null : '' + key,
|
||||
ref: null,
|
||||
props: props,
|
||||
_owner: null
|
||||
};
|
||||
};
|
||||
})();
|
||||
@@ -0,0 +1,5 @@
|
||||
export default (function (innerThis, boundThis) {
|
||||
if (innerThis !== boundThis) {
|
||||
throw new TypeError("Cannot instantiate an arrow function");
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,3 @@
|
||||
export default (function (obj) {
|
||||
if (obj == null) throw new TypeError("Cannot destructure undefined");
|
||||
});
|
||||
@@ -0,0 +1,11 @@
|
||||
export default (function (obj, keys) {
|
||||
var target = {};
|
||||
|
||||
for (var i in obj) {
|
||||
if (keys.indexOf(i) >= 0) continue;
|
||||
if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
|
||||
target[i] = obj[i];
|
||||
}
|
||||
|
||||
return target;
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
export default (function (self, call) {
|
||||
if (!self) {
|
||||
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
||||
}
|
||||
|
||||
return call && (typeof call === "object" || typeof call === "function") ? call : self;
|
||||
});
|
||||
@@ -0,0 +1 @@
|
||||
export default typeof global === "undefined" ? self : global;
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
export default (function set(object, property, value, receiver) {
|
||||
var desc = Object.getOwnPropertyDescriptor(object, property);
|
||||
|
||||
if (desc === undefined) {
|
||||
var parent = Object.getPrototypeOf(object);
|
||||
|
||||
if (parent !== null) {
|
||||
set(parent, property, value, receiver);
|
||||
}
|
||||
} else if ("value" in desc && desc.writable) {
|
||||
desc.value = value;
|
||||
} else {
|
||||
var setter = desc.set;
|
||||
|
||||
if (setter !== undefined) {
|
||||
setter.call(receiver, value);
|
||||
}
|
||||
}
|
||||
|
||||
return value;
|
||||
});
|
||||
@@ -0,0 +1,37 @@
|
||||
export default (function () {
|
||||
function sliceIterator(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"]) _i["return"]();
|
||||
} finally {
|
||||
if (_d) throw _e;
|
||||
}
|
||||
}
|
||||
|
||||
return _arr;
|
||||
}
|
||||
|
||||
return function (arr, i) {
|
||||
if (Array.isArray(arr)) {
|
||||
return arr;
|
||||
} else if (Symbol.iterator in Object(arr)) {
|
||||
return sliceIterator(arr, i);
|
||||
} else {
|
||||
throw new TypeError("Invalid attempt to destructure non-iterable instance");
|
||||
}
|
||||
};
|
||||
})();
|
||||
@@ -0,0 +1,17 @@
|
||||
export default (function (arr, i) {
|
||||
if (Array.isArray(arr)) {
|
||||
return arr;
|
||||
} else if (Symbol.iterator in Object(arr)) {
|
||||
var _arr = [];
|
||||
|
||||
for (var _iterator = arr[Symbol.iterator](), _step; !(_step = _iterator.next()).done;) {
|
||||
_arr.push(_step.value);
|
||||
|
||||
if (i && _arr.length === i) break;
|
||||
}
|
||||
|
||||
return _arr;
|
||||
} else {
|
||||
throw new TypeError("Invalid attempt to destructure non-iterable instance");
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
export default (function (strings, raw) {
|
||||
return Object.freeze(Object.defineProperties(strings, {
|
||||
raw: {
|
||||
value: Object.freeze(raw)
|
||||
}
|
||||
}));
|
||||
});
|
||||
@@ -0,0 +1,4 @@
|
||||
export default (function (strings, raw) {
|
||||
strings.raw = raw;
|
||||
return strings;
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
export default (function (val, name, undef) {
|
||||
if (val === undef) {
|
||||
throw new ReferenceError(name + " is not defined - temporal dead zone");
|
||||
} else {
|
||||
return val;
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1 @@
|
||||
export default {};
|
||||
@@ -0,0 +1,3 @@
|
||||
export default (function (arr) {
|
||||
return Array.isArray(arr) ? arr : Array.from(arr);
|
||||
});
|
||||
@@ -0,0 +1,9 @@
|
||||
export default (function (arr) {
|
||||
if (Array.isArray(arr)) {
|
||||
for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
|
||||
|
||||
return arr2;
|
||||
} else {
|
||||
return Array.from(arr);
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
export default typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
|
||||
return typeof obj;
|
||||
} : function (obj) {
|
||||
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
||||
};
|
||||
+222
@@ -0,0 +1,222 @@
|
||||
var babel = require('systemjs-babel-build').babel;
|
||||
|
||||
// the SystemJS babel build includes standard presets
|
||||
var es2015 = require('systemjs-babel-build').presetES2015;
|
||||
var es2015Register = require('systemjs-babel-build').presetES2015Register;
|
||||
var modulesRegister = require('systemjs-babel-build').modulesRegister;
|
||||
var stage3 = require('systemjs-babel-build').pluginsStage3;
|
||||
var stage2 = require('systemjs-babel-build').pluginsStage2;
|
||||
var stage1 = require('systemjs-babel-build').pluginsStage1;
|
||||
var react = require('systemjs-babel-build').pluginsReact;
|
||||
|
||||
var externalHelpers = require('systemjs-babel-build').externalHelpers;
|
||||
var runtimeTransform = require('systemjs-babel-build').runtimeTransform;
|
||||
|
||||
var babelRuntimePath;
|
||||
var modularHelpersPath = System.decanonicalize('./babel-helpers/', module.id);
|
||||
var externalHelpersPath = System.decanonicalize('./babel-helpers.js', module.id);
|
||||
var regeneratorRuntimePath = System.decanonicalize('./regenerator-runtime.js', module.id);
|
||||
|
||||
if (modularHelpersPath.substr(modularHelpersPath.length - 3, 3) == '.js')
|
||||
modularHelpersPath = modularHelpersPath.substr(0, modularHelpersPath.length - 3);
|
||||
|
||||
// in builds we want to embed canonical names to helpers
|
||||
if (System.getCanonicalName) {
|
||||
modularHelpersPath = System.getCanonicalName(modularHelpersPath);
|
||||
externalHelpersPath = System.getCanonicalName(externalHelpersPath);
|
||||
regeneratorRuntimePath = System.getCanonicalName(regeneratorRuntimePath);
|
||||
}
|
||||
|
||||
// disable SystemJS runtime detection
|
||||
SystemJS._loader.loadedTranspilerRuntime = true;
|
||||
|
||||
function prepend(a, b) {
|
||||
for (var p in b)
|
||||
if (!(p in a))
|
||||
a[p] = b[p];
|
||||
return a;
|
||||
}
|
||||
|
||||
/*
|
||||
* babelOptions:
|
||||
* modularRuntime: true / false (whether to use babel-runtime or babel/external-helpers respectively)
|
||||
* sourceMaps: true / false (defaults to true)
|
||||
* es2015: true / false (defaults to true)
|
||||
* stage3: true / false (defaults to true)
|
||||
* stage2: true / false (defaults to true)
|
||||
* stage1: true / false (defaults to false)
|
||||
* react: true / false (defaults to false)
|
||||
* plugins: array of custom plugins (objects or module name strings)
|
||||
* presets: array of custom presets (objects or module name strings)
|
||||
* compact: as in Babel
|
||||
* comments: as in Babel
|
||||
*
|
||||
* babelOptions can be set at SystemJS.babelOptions OR on the metadata object for a given module
|
||||
*/
|
||||
var defaultBabelOptions = {
|
||||
modularRuntime: true,
|
||||
sourceMaps: true,
|
||||
es2015: true,
|
||||
stage3: true,
|
||||
stage2: true,
|
||||
stage1: false,
|
||||
react: false,
|
||||
compact: false,
|
||||
comments: true
|
||||
};
|
||||
|
||||
exports.translate = function(load, traceOpts) {
|
||||
// we don't transpile anything other than CommonJS or ESM
|
||||
if (load.metadata.format == 'global' || load.metadata.format == 'amd' || load.metadata.format == 'json')
|
||||
throw new TypeError('plugin-babel cannot transpile ' + load.metadata.format + ' modules. Ensure "' + load.name + '" is configured not to use this loader.');
|
||||
|
||||
var loader = this;
|
||||
var pluginLoader = loader.pluginLoader || loader;
|
||||
|
||||
// we only output ES modules when running in the builder
|
||||
var outputESM = traceOpts ? traceOpts.outputESM : loader.builder;
|
||||
|
||||
var babelOptions = {};
|
||||
|
||||
if (load.metadata.babelOptions)
|
||||
prepend(babelOptions, load.metadata.babelOptions);
|
||||
|
||||
if (loader.babelOptions)
|
||||
prepend(babelOptions, loader.babelOptions);
|
||||
|
||||
prepend(babelOptions, defaultBabelOptions);
|
||||
|
||||
// determine any plugins or preset strings which need to be imported as modules
|
||||
var pluginAndPresetModuleLoads = [];
|
||||
|
||||
if (babelOptions.presets)
|
||||
babelOptions.presets.forEach(function(preset) {
|
||||
if (typeof preset == 'string')
|
||||
pluginAndPresetModuleLoads.push(pluginLoader['import'](preset, module.id));
|
||||
});
|
||||
|
||||
if (babelOptions.plugins)
|
||||
babelOptions.plugins.forEach(function(plugin) {
|
||||
plugin = typeof plugin == 'string' ? plugin : Array.isArray(plugin) && typeof plugin[0] == 'string' && plugin[0];
|
||||
if (!plugin)
|
||||
return;
|
||||
pluginAndPresetModuleLoads.push(pluginLoader.import(plugin, module.id).then(function (m) {
|
||||
return m.default || m;
|
||||
}));
|
||||
});
|
||||
|
||||
return Promise.all(pluginAndPresetModuleLoads)
|
||||
.then(function(pluginAndPresetModules) {
|
||||
var curPluginOrPresetModule = 0;
|
||||
|
||||
var presets = [];
|
||||
var plugins = [];
|
||||
|
||||
if (babelOptions.modularRuntime) {
|
||||
if (load.metadata.format == 'cjs')
|
||||
throw new TypeError('plugin-babel does not support modular runtime for CJS module transpilations. Set babelOptions.modularRuntime: false if needed.');
|
||||
presets.push(runtimeTransform);
|
||||
}
|
||||
else {
|
||||
if (load.metadata.format == 'cjs')
|
||||
load.source = 'var babelHelpers = require("' + externalHelpersPath + '");' + load.source;
|
||||
else
|
||||
load.source = 'import babelHelpers from "' + externalHelpersPath + '";' + load.source;
|
||||
presets.push(externalHelpers);
|
||||
}
|
||||
|
||||
if (babelOptions.es2015)
|
||||
presets.push((outputESM || load.metadata.format == 'cjs') ? es2015 : es2015Register);
|
||||
else if (!(outputESM || load.metadata.format == 'cjs'))
|
||||
presets.push(modulesRegister);
|
||||
|
||||
if (babelOptions.stage3)
|
||||
presets.push({
|
||||
plugins: stage3
|
||||
});
|
||||
|
||||
if (babelOptions.stage2)
|
||||
presets.push({
|
||||
plugins: stage2
|
||||
});
|
||||
|
||||
if (babelOptions.stage1)
|
||||
presets.push({
|
||||
plugins: stage1
|
||||
});
|
||||
|
||||
if (babelOptions.react)
|
||||
presets.push({
|
||||
plugins: react
|
||||
});
|
||||
|
||||
if (babelOptions.presets)
|
||||
babelOptions.presets.forEach(function(preset) {
|
||||
if (typeof preset == 'string')
|
||||
presets.push(pluginAndPresetModules[curPluginOrPresetModule++]);
|
||||
else
|
||||
presets.push(preset);
|
||||
});
|
||||
|
||||
if (babelOptions.plugins)
|
||||
babelOptions.plugins.forEach(function(plugin) {
|
||||
if (typeof plugin == 'string')
|
||||
plugins.push(pluginAndPresetModules[curPluginOrPresetModule++]);
|
||||
else if (Array.isArray(plugin) && typeof plugin[0] == 'string')
|
||||
plugins.push([pluginAndPresetModules[curPluginOrPresetModule++], plugin[1]]);
|
||||
else
|
||||
plugins.push(plugin);
|
||||
});
|
||||
|
||||
var output = babel.transform(load.source, {
|
||||
babelrc: false,
|
||||
plugins: plugins,
|
||||
presets: presets,
|
||||
filename: load.address,
|
||||
sourceFileName: load.address,
|
||||
moduleIds: false,
|
||||
sourceMaps: traceOpts && traceOpts.sourceMaps || babelOptions.sourceMaps,
|
||||
inputSourceMap: load.metadata.sourceMap,
|
||||
compact: babelOptions.compact,
|
||||
comments: babelOptions.comments,
|
||||
code: true,
|
||||
ast: true,
|
||||
resolveModuleSource: function(m) {
|
||||
if (m.substr(0, 22) == 'babel-runtime/helpers/') {
|
||||
m = modularHelpersPath + m.substr(22) + '.js';
|
||||
}
|
||||
else if (m == 'babel-runtime/regenerator') {
|
||||
m = regeneratorRuntimePath;
|
||||
}
|
||||
else if (m.substr(0, 14) == 'babel-runtime/') {
|
||||
if (!babelRuntimePath) {
|
||||
babelRuntimePath = System.decanonicalize('babel-runtime/', module.id);
|
||||
if (babelRuntimePath[babelRuntimePath.length - 1] !== '/')
|
||||
babelRuntimePath += '/';
|
||||
if (babelRuntimePath.substr(babelRuntimePath.length - 3, 3) == '.js')
|
||||
babelRuntimePath = babelRuntimePath.substr(0, babelRuntimePath.length - 3);
|
||||
if (loader.getCanonicalName)
|
||||
babelRuntimePath = loader.getCanonicalName(babelRuntimePath);
|
||||
if (babelRuntimePath == 'babel-runtime/')
|
||||
throw new Error('The babel-runtime module must be mapped to support modular helpers and builtins. If using jspm run jspm install npm:babel-runtime.');
|
||||
}
|
||||
m = babelRuntimePath + m.substr(14) + '.js';
|
||||
}
|
||||
return m;
|
||||
}
|
||||
});
|
||||
|
||||
// add babelHelpers as a dependency for non-modular runtime
|
||||
if (!babelOptions.modularRuntime)
|
||||
load.metadata.deps.push(externalHelpersPath);
|
||||
|
||||
// set output module format
|
||||
// (in builder we output modules as esm)
|
||||
if (!load.metadata.format || load.metadata.format == 'detect' || load.metadata.format == 'esm')
|
||||
load.metadata.format = outputESM ? 'esm' : 'register';
|
||||
|
||||
load.metadata.sourceMap = output.map;
|
||||
|
||||
return output.code;
|
||||
});
|
||||
};
|
||||
+23
@@ -0,0 +1,23 @@
|
||||
SystemJS.config({
|
||||
baseURL: '../../',
|
||||
map: {
|
||||
'plugin-babel': 'lib/3rdparty/systemjs/plugin-babel.js',
|
||||
'systemjs-babel-build': 'lib/3rdparty/systemjs/systemjs-babel-browser.js',
|
||||
'3rdparty': 'lib/3rdparty/3rdparty.js',
|
||||
/* Don't know why these should be mapped?!? */
|
||||
'd3-selection': 'lib/3rdparty/d3/d3.js',
|
||||
'd3-transition': 'lib/3rdparty/d3/d3.js',
|
||||
'TweenLite': 'lib/3rdparty/greensock/src/uncompressed/TweenLite.js',
|
||||
'CustomEase': 'lib/3rdparty/greensock/src/uncompressed/easing/CustomEase.js',
|
||||
'CSSPlugin': 'lib/3rdparty/greensock/src/uncompressed/plugins/CSSPlugin.js'
|
||||
},
|
||||
transpiler: 'plugin-babel',
|
||||
meta: {
|
||||
'*.js': {
|
||||
authorization: true,
|
||||
babelOptions: {
|
||||
es2015: true
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
+23
@@ -0,0 +1,23 @@
|
||||
SystemJS.config({
|
||||
baseURL: '../../',
|
||||
map: {
|
||||
"plugin-babel": "lib/3rdparty/systemjs/plugin-babel.js",
|
||||
"systemjs-babel-build": "lib/3rdparty/systemjs/systemjs-babel-browser.js",
|
||||
"3rdparty": "lib/3rdparty/3rdparty.js",
|
||||
/* Don't know why these should be mapped?!? */
|
||||
"d3-selection": "lib/3rdparty/d3/d3.js",
|
||||
"d3-transition": "lib/3rdparty/d3/d3.js",
|
||||
"TweenLite": "lib/3rdparty/greensock/src/uncompressed/TweenLite.js",
|
||||
"CustomEase": "lib/3rdparty/greensock/src/uncompressed/easing/CustomEase.js",
|
||||
"CSSPlugin": "lib/3rdparty/greensock/src/uncompressed/plugins/CSSPlugin.js"
|
||||
},
|
||||
transpiler: "plugin-babel",
|
||||
meta: {
|
||||
"*.js": {
|
||||
authorization: true,
|
||||
babelOptions: {
|
||||
es2015: false
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
Vendored
+6
File diff suppressed because one or more lines are too long
Vendored
+1
File diff suppressed because one or more lines are too long
+26
File diff suppressed because one or more lines are too long
+1
-1
@@ -107,11 +107,11 @@ export default class List extends PIXI.Container {
|
||||
if (this.opts.app) {
|
||||
const app = this.opts.app
|
||||
app.view.addEventListener('mousewheel', event => {
|
||||
event.preventDefault()
|
||||
const bounds = this.mask ? this.mask.getBounds() : this.getBounds()
|
||||
const x = event.clientX - app.view.getBoundingClientRect().left
|
||||
const y = event.clientY - app.view.getBoundingClientRect().top
|
||||
if (bounds.contains(x, y)) {
|
||||
event.preventDefault()
|
||||
this.emit('scroll', event)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -0,0 +1,13 @@
|
||||
|
||||
|
||||
https://mattdesl.svbtle.com/drawing-lines-is-hard
|
||||
http://perfectionkills.com/exploring-canvas-drawing-techniques/
|
||||
|
||||
|
||||
|
||||
https://github.com/mattdesl/polyline-normals
|
||||
|
||||
var path = [ [0, 122], [0, 190], [90, 190] ]
|
||||
|
||||
//get the normals as a closed loop
|
||||
var normals = getNormals(path, true)
|
||||
@@ -0,0 +1,73 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
|
||||
<!-- disable zooming -->
|
||||
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1" />
|
||||
<title>Stylus Functional Tests</title>
|
||||
<style media="screen">
|
||||
|
||||
html, body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
|
||||
height:100%;
|
||||
width: 100%;
|
||||
/* See http://stackoverflow.com/questions/9280258/prevent-body-scrolling-but-allow-overlay-scrolling */
|
||||
position:fixed;
|
||||
overflow: hidden;
|
||||
font-size: 18px;
|
||||
background:gray;
|
||||
font-family:arial,sans-serif;
|
||||
color:#FFF;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-overflow-scrolling: auto;
|
||||
user-select: none;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
.site {
|
||||
display: flex;
|
||||
min-height: 100%;
|
||||
flex-direction: column;
|
||||
}
|
||||
/*
|
||||
|
||||
.interactive {
|
||||
-ms-content-zooming: none;
|
||||
touch-action: none;
|
||||
}
|
||||
*/
|
||||
|
||||
main {
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
position:relative
|
||||
}
|
||||
|
||||
.container {
|
||||
position:absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script src="../../lib/3rdparty/all.js"></script>
|
||||
<script src="../../lib/bootstrap.js"></script>
|
||||
</head>
|
||||
<body class="site" oncontextmenu="return false" >
|
||||
<main id="main" class="container">
|
||||
<canvas id="canvas" width="100%" height="100%" style="position: absolute; z-index:10000; user-select: none;">
|
||||
Get a better browser, bro.
|
||||
</canvas>
|
||||
</main>
|
||||
<script>
|
||||
Bootstrap.import('./main.js')
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,90 @@
|
||||
import PIXIApp from '../../lib/pixi/app.js'
|
||||
import Button from '../../lib/pixi/button.js'
|
||||
import ButtonGroup from '../../lib/pixi/buttongroup.js'
|
||||
import Stylus from './stylus.js'
|
||||
|
||||
class StylusApp extends PIXIApp {
|
||||
|
||||
sceneFactory() {
|
||||
return new Stylus(this.renderer)
|
||||
}
|
||||
|
||||
setup() {
|
||||
let buttonColor = 0x666666
|
||||
super.setup()
|
||||
|
||||
this.tools = new ButtonGroup({
|
||||
type: 'checkbox',
|
||||
margin: 0,
|
||||
x: 16,
|
||||
y: 16,
|
||||
fill: buttonColor,
|
||||
buttons: [{icon: 'edit',
|
||||
iconColorActive: 0xFFFF00,
|
||||
action: (event, button) => this.toggleEditMode() },
|
||||
{icon: 'undo',
|
||||
action: (event, button) => this.undo(button) },
|
||||
{icon: 'redo',
|
||||
action: (event, button) => this.redo(button) },
|
||||
{icon: 'delete',
|
||||
action: (event, button) => this.clear(button) }
|
||||
]
|
||||
})
|
||||
this.scene.addChild(this.tools)
|
||||
|
||||
let defaults = { icon: 'brightness_1',
|
||||
action: (event, button) => this.selectColor(button),
|
||||
fillAlpha: 0,
|
||||
strokeAlpha: 0,
|
||||
fillActiveAlpha: 0,
|
||||
strokeActiveAlpha: 0}
|
||||
|
||||
this.palette = new ButtonGroup( {
|
||||
type: "radio",
|
||||
x: 200,
|
||||
y: 16,
|
||||
margin: 0,
|
||||
strokeAlpha: 0,
|
||||
fill: buttonColor,
|
||||
buttons: [
|
||||
Object.assign({}, defaults, { iconColor: 0x111111,
|
||||
iconColorActive: 0x111111}), // tooltip: "Black",
|
||||
Object.assign({}, defaults, { iconColor: 0xFFFF00,
|
||||
iconColorActive: 0xFFFF00}), // tooltip: "Yellow",
|
||||
Object.assign({}, defaults, { iconColor: 0x00FF00,
|
||||
iconColorActive:0x00FF00}), // tooltip: "Green",
|
||||
Object.assign({}, defaults, { iconColor: 0xFF00FF,
|
||||
iconColorActive:0xFF00FF}) // tooltip: "Violet",
|
||||
]
|
||||
})
|
||||
this.scene.addChild(this.palette)
|
||||
}
|
||||
|
||||
selectColor(button) {
|
||||
this.scene.color = button.opts.iconColor
|
||||
}
|
||||
|
||||
undo(button) {
|
||||
this.scene.undo()
|
||||
setTimeout(() => {
|
||||
button.active = false}, 200)
|
||||
}
|
||||
|
||||
redo(button) {
|
||||
this.scene.redo()
|
||||
setTimeout(() => {
|
||||
button.active = false}, 200)
|
||||
}
|
||||
|
||||
clear(button) {
|
||||
this.scene.clearAll()
|
||||
setTimeout(() => {
|
||||
button.active = false}, 200)
|
||||
}
|
||||
}
|
||||
|
||||
const app = new StylusApp({ view: canvas })
|
||||
window.app = app
|
||||
app.setup()
|
||||
app.run()
|
||||
|
||||
@@ -0,0 +1,398 @@
|
||||
import Events from '../events.js'
|
||||
import { Angle } from '../utils.js'
|
||||
|
||||
class StylusCommand extends Object {
|
||||
|
||||
constructor() {
|
||||
super()
|
||||
}
|
||||
|
||||
do(stylus) {
|
||||
stylus.commandStack.push(this)
|
||||
}
|
||||
|
||||
undo(stylus) {
|
||||
stylus.undoCommandStack.push(this)
|
||||
}
|
||||
|
||||
redo(stylus) {
|
||||
this.do(stylus)
|
||||
}
|
||||
}
|
||||
|
||||
class StrokeCommand extends StylusCommand {
|
||||
|
||||
constructor(stroke) {
|
||||
super()
|
||||
this.stroke = stroke
|
||||
}
|
||||
|
||||
do(stylus) {
|
||||
if (this.stroke.length > 0) {
|
||||
super.do(stylus)
|
||||
stylus.stroke = []
|
||||
stylus.strokes.push(this.stroke)
|
||||
stylus.redraw()
|
||||
stylus.changed()
|
||||
}
|
||||
}
|
||||
|
||||
undo(stylus) {
|
||||
if (this.stroke.length > 0) {
|
||||
super.undo(stylus)
|
||||
stylus.strokes.pop()
|
||||
stylus.redraw()
|
||||
stylus.changed()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class ClearCommand extends StylusCommand {
|
||||
|
||||
do(stylus) {
|
||||
// Clears the command stack
|
||||
stylus.commandStack = []
|
||||
super.do(stylus)
|
||||
this.strokes = stylus.strokes
|
||||
stylus.stroke = []
|
||||
stylus.strokes = []
|
||||
stylus.redraw()
|
||||
stylus.changed()
|
||||
}
|
||||
|
||||
undo(stylus) {
|
||||
//super.undo(stylus) // Clear all is not redoable
|
||||
stylus.stroke = []
|
||||
stylus.strokes = this.strokes
|
||||
stylus.redraw()
|
||||
stylus.changed()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default class Stylus extends PIXI.Graphics {
|
||||
|
||||
constructor({ width = window.innerWidth,
|
||||
height = window.innerHeight,
|
||||
interactive = true,
|
||||
color = 0x000000,
|
||||
tiltX = 0,
|
||||
tiltY = 0,
|
||||
backgroundAlpha = 1,
|
||||
backgroundFill = 0xFFFFFF,
|
||||
colorAlpha = 1,
|
||||
captureEvents = true,
|
||||
acceptMouseEvents = true } = {}) {
|
||||
super()
|
||||
this.wantedWidth = width
|
||||
this.wantedHeight = height
|
||||
this.backgroundAlpha = backgroundAlpha
|
||||
this.backgroundFill = backgroundFill
|
||||
this.colorAlpha = colorAlpha
|
||||
this.color = color
|
||||
this.interactive = interactive
|
||||
this.debug = false
|
||||
this.tiltX = tiltX // degrees -90 ... 90
|
||||
this.tiltY = tiltY // degrees -90 ... 90
|
||||
this.captureEvents = captureEvents
|
||||
this.commandStack = []
|
||||
this.undoCommandStack = []
|
||||
this.strokes = []
|
||||
this.stroke = []
|
||||
if (captureEvents)
|
||||
this.registerEventHandler(acceptMouseEvents)
|
||||
this.drawBackground()
|
||||
}
|
||||
|
||||
drawBackground() {
|
||||
this.clear()
|
||||
this.beginFill(this.backgroundFill, this.backgroundAlpha)
|
||||
this.drawRect(0, 0, this.wantedWidth, this.wantedHeight)
|
||||
this.endFill()
|
||||
}
|
||||
|
||||
touchToPoint(t) {
|
||||
return { x: t.clientX, y: t.clientY }
|
||||
}
|
||||
|
||||
isStylusPointer(event) {
|
||||
let identifier = event.data.identifier
|
||||
if (typeof (event.data.originalEvent.changedTouches) !== 'undefined') {
|
||||
for (let touch of event.data.originalEvent.changedTouches) {
|
||||
if (touch.identifier === identifier && touch.touchType === 'stylus') {
|
||||
this.tiltX = Angle.radian2degree(touch.azimuthAngle)
|
||||
this.tiltY = 90.0 - Angle.radian2degree(touch.altitudeAngle)
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
// UO: Not tested since the Sprot delivered "mouse" events to Chrome
|
||||
if (event.data.originalEvent.pointerType === 'pen') {
|
||||
this.tiltX = event.data.originalEvent.tiltX
|
||||
this.tiltY = event.data.originalEvent.tiltY
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
isStylusTouch(event) {
|
||||
let identifier = event.data.identifier
|
||||
if (typeof (event.data.originalEvent.changedTouches) !== 'undefined') {
|
||||
for (let touch of event.data.originalEvent.changedTouches) {
|
||||
if (touch.identifier === identifier && touch.pointerType === 'touch') {
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
getPointerID(event) {
|
||||
let identifier = event.data.identifier
|
||||
for (let touch of event.data.originalEvent.changedTouches) {
|
||||
if (touch.identifier === identifier) {
|
||||
return touch.pointerId
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
registerEventHandler() {
|
||||
window.addEventListener('keydown', (e) => {
|
||||
switch (e.keyCode) {
|
||||
case 38: // up arrow
|
||||
this.tiltX += 5
|
||||
break
|
||||
case 40: // down arrow
|
||||
this.tiltX -= 5
|
||||
break
|
||||
case 37: // left arrow
|
||||
this.tiltY -= 5
|
||||
break
|
||||
case 39: // right arrow
|
||||
this.tiltY += 5
|
||||
break
|
||||
}
|
||||
if (this.debug) console.log("keydown", e.keyCode, this.tiltX, this.tiltY)
|
||||
})
|
||||
|
||||
this.on('pointerdown', (e) => {
|
||||
if (this.debug) console.log("pointerdown", e)
|
||||
if (this.eventInside(e))
|
||||
this.startStroke(this.toStroke(e))
|
||||
})
|
||||
this.on('pointermove', (e) => {
|
||||
if (Events.isPointerDown(e.data.originalEvent) || this.isStylusPointer(e) || this.isStylusTouch(e)) {
|
||||
if (this.debug) console.log("pointermove", e, this.eventInside(e))
|
||||
if (this.eventInside(e))
|
||||
this.moveStroke(this.toStroke(e))
|
||||
}
|
||||
})
|
||||
this.on('pointerup', (e) => {
|
||||
if (this.debug) console.log("pointerup", e)
|
||||
if (this.eventInside(e))
|
||||
this.endStroke(this.toStroke(e))
|
||||
})
|
||||
this.on('pointerleave', (e) => {
|
||||
this.endStroke(this.toStroke(e))
|
||||
})
|
||||
this.on('pointercancel', (e) => {
|
||||
this.endStroke(this.toStroke(e))
|
||||
})
|
||||
}
|
||||
|
||||
undoable() {
|
||||
return this.commandStack.length > 0
|
||||
}
|
||||
|
||||
redoable() {
|
||||
return this.undoCommandStack.length > 0
|
||||
}
|
||||
|
||||
undo() {
|
||||
if (this.undoable()) {
|
||||
let cmd = this.commandStack.pop()
|
||||
cmd.undo(this)
|
||||
}
|
||||
}
|
||||
|
||||
redo() {
|
||||
if (this.redoable()) {
|
||||
let cmd = this.undoCommandStack.pop()
|
||||
cmd.redo(this)
|
||||
}
|
||||
}
|
||||
|
||||
eventInside(event) {
|
||||
|
||||
let local = this.toLocal(event.data.global)
|
||||
for (let child of this.children) {
|
||||
let r = child.getBounds()
|
||||
if (r.contains(local.x, local.y)) {
|
||||
console.log("Child touched")
|
||||
return false
|
||||
}
|
||||
}
|
||||
if (local.x < 0 || local.x > this.wantedWidth)
|
||||
return false
|
||||
if (local.y < 0 || local.y > this.wantedHeight)
|
||||
return false
|
||||
event.stopPropagation()
|
||||
if (this.debug) console.log("stopPropagation", event)
|
||||
if (event.data.originalEvent.claimedByScatter) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
toLocalPoint(event) {
|
||||
return this.toLocal(event.data.global)
|
||||
}
|
||||
|
||||
toStroke(event) {
|
||||
let local = this.toLocalPoint(event)
|
||||
let x = Math.max(0, Math.min(local.x, this.wantedWidth))
|
||||
let y = Math.max(0, Math.min(local.y, this.wantedHeight))
|
||||
let desc = {
|
||||
x, y,
|
||||
pressure: event.pressure || null,
|
||||
tiltX: this.tiltX, tiltY: this.tiltY,
|
||||
color: this.color
|
||||
}
|
||||
return desc
|
||||
}
|
||||
|
||||
startStroke(info) {
|
||||
this.stroke = [info]
|
||||
this.redraw()
|
||||
}
|
||||
|
||||
moveStroke(info) {
|
||||
this.stroke.push(info)
|
||||
this.redraw()
|
||||
}
|
||||
|
||||
endStroke(info) {
|
||||
if (this.stroke.length > 1) {
|
||||
let cmd = new StrokeCommand(this.stroke)
|
||||
cmd.do(this)
|
||||
}
|
||||
}
|
||||
|
||||
tiltToLineWidth(value) {
|
||||
return Math.round(Math.abs(value / 10) + 1)
|
||||
}
|
||||
|
||||
drawStroke(stroke) {
|
||||
if (stroke.length) {
|
||||
let start = stroke[0]
|
||||
this.beginFill(0, 0)
|
||||
this.moveTo(start.x, start.y)
|
||||
for (let i = 1; i < stroke.length; i++) {
|
||||
let info = stroke[i]
|
||||
this.lineStyle(this.tiltToLineWidth(info.tiltY),
|
||||
info.color, this.colorAlpha)
|
||||
this.lineTo(info.x, info.y)
|
||||
}
|
||||
this.endFill()
|
||||
}
|
||||
}
|
||||
|
||||
drawTouch(point) {
|
||||
this.beginFill(0, 0)
|
||||
this.drawCircle(point.x, point.y, 22)
|
||||
this.endFill()
|
||||
}
|
||||
|
||||
drawStrokes() {
|
||||
this.drawBackground()
|
||||
this.lineStyle(1.0, 0xFF0000, 1)
|
||||
for (let stroke of this.iterStrokes()) {
|
||||
this.drawStroke(stroke)
|
||||
}
|
||||
}
|
||||
|
||||
redraw() {
|
||||
this.drawStrokes()
|
||||
}
|
||||
|
||||
// Can be overwritten if different levels of strokes are necessary
|
||||
*iterStrokes() {
|
||||
for (let stroke of this.strokes) {
|
||||
yield stroke
|
||||
}
|
||||
yield this.stroke
|
||||
}
|
||||
|
||||
changed() {
|
||||
// Can be overwritten
|
||||
}
|
||||
|
||||
clearAll() {
|
||||
let cmd = new ClearCommand()
|
||||
cmd.do(this)
|
||||
}
|
||||
|
||||
normalizeInfo(info) {
|
||||
let { x, y, pressure, tiltX, tiltY, color } = info
|
||||
x /= this.wantedWidth
|
||||
y /= this.wantedHeight
|
||||
return { x, y, pressure, tiltX, tiltY, color }
|
||||
}
|
||||
|
||||
denormalizeInfo(info) {
|
||||
let { x, y, pressure, tiltX, tiltY, color } = info
|
||||
x = x * this.wantedWidth
|
||||
y = y * this.wantedHeight
|
||||
return { x, y, pressure, tiltX, tiltY, color }
|
||||
}
|
||||
|
||||
// Convert strokes into an object that can be stored in an Indexed DB.
|
||||
// Returns normalized strokes
|
||||
toObject() {
|
||||
let result = []
|
||||
for (let stroke of this.strokes) {
|
||||
let normalized = []
|
||||
for (let info of stroke) {
|
||||
normalized.push(this.normalizeInfo(info))
|
||||
}
|
||||
result.push(normalized)
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
// Read normalized strokes from an object from an Indexed DB.
|
||||
fromObject(normalizedStrokes) {
|
||||
this.strokes = []
|
||||
for (let stroke of normalizedStrokes) {
|
||||
let denormalized = []
|
||||
for (let info of stroke) {
|
||||
denormalized.push(this.denormalizeInfo(info))
|
||||
}
|
||||
this.strokes.push(denormalized)
|
||||
}
|
||||
}
|
||||
|
||||
// Convert strokes into a JSON object that can be stored in an Indexed DB
|
||||
toJSON() {
|
||||
return JSON.stringify(this.toObject())
|
||||
}
|
||||
|
||||
// Convert strokes from a JSON
|
||||
fromJSON(json) {
|
||||
this.fromObject(JSON.parse(json))
|
||||
}
|
||||
|
||||
// Returns a set of used colors
|
||||
usedColors() {
|
||||
let used = new Set()
|
||||
for (let info of this.stroke) {
|
||||
used.add(info.color)
|
||||
}
|
||||
for (let stroke of this.strokes) {
|
||||
for (let info of stroke) {
|
||||
used.add(info.color)
|
||||
}
|
||||
}
|
||||
return used.values()
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
+1
-1
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "iwmlib",
|
||||
"version": "1.1.0",
|
||||
"version": "1.2.0",
|
||||
"description": "An Open Source library for multi-touch, WebGL powered applications.",
|
||||
"main": "index.js",
|
||||
"directories": {
|
||||
|
||||
Reference in New Issue
Block a user