Compare commits
2 Commits
5dca00d772
...
cd4698d73b
Author | SHA1 | Date | |
---|---|---|---|
cd4698d73b | |||
78d8f658e9 |
103
event-helpers.js
103
event-helpers.js
@ -7,7 +7,47 @@
|
|||||||
*/
|
*/
|
||||||
export const EventHelpers = function(superClass) {
|
export const EventHelpers = function(superClass) {
|
||||||
return class extends superClass {
|
return class extends superClass {
|
||||||
listen(node, eventName, cbName) {
|
listen(node, eventName, cbName, options) {
|
||||||
|
const boundListener = this.__registerListener(cbName, node, eventName);
|
||||||
|
|
||||||
|
if (eventName === 'track') {
|
||||||
|
this._track(node, boundListener);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
node.addEventListener(eventName, boundListener, options);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove an event listener bound to the context of the superClass.
|
||||||
|
*
|
||||||
|
* @param {HTMLElement} node Element to attach the event listener to.
|
||||||
|
* @param {String} eventName Name of the event.
|
||||||
|
* @param {String} cbName Name of the handler.
|
||||||
|
*/
|
||||||
|
unlisten(node, eventName, cbName, options) {
|
||||||
|
this.__boundEventListeners = this.__boundEventListeners || new WeakMap();
|
||||||
|
const listeners = this.__boundEventListeners.get(node);
|
||||||
|
const eventKey = `${eventName}_${cbName}`;
|
||||||
|
|
||||||
|
if (listeners && typeof listeners[eventKey]) {
|
||||||
|
node.removeEventListener(eventName, listeners[eventKey], options);
|
||||||
|
listeners[eventKey] = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
once(node, eventName, cbName, options) {
|
||||||
|
const wrappedCbName = `__onceCb__${cbName}`;
|
||||||
|
|
||||||
|
this[wrappedCbName] = (...args) => {
|
||||||
|
this[cbName](...args);
|
||||||
|
this.unlisten(node, eventName, wrappedCbName, options);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.listen(node, eventName, wrappedCbName, options);
|
||||||
|
}
|
||||||
|
|
||||||
|
__registerListener(cbName, node, eventName) {
|
||||||
this.__boundEventListeners = this.__boundEventListeners || new WeakMap();
|
this.__boundEventListeners = this.__boundEventListeners || new WeakMap();
|
||||||
const boundListener = this[cbName].bind(this);
|
const boundListener = this[cbName].bind(this);
|
||||||
const eventKey = `${eventName}_${cbName}`;
|
const eventKey = `${eventName}_${cbName}`;
|
||||||
@ -22,36 +62,49 @@ export const EventHelpers = function(superClass) {
|
|||||||
|
|
||||||
listeners[eventKey] = boundListener;
|
listeners[eventKey] = boundListener;
|
||||||
this.__boundEventListeners.set(node, listeners);
|
this.__boundEventListeners.set(node, listeners);
|
||||||
node.addEventListener(eventName, boundListener);
|
|
||||||
|
return boundListener;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
_track(node, boundListener) {
|
||||||
* Remove an event listener bound to the context of the superClass.
|
this._boundTrackingListener = boundListener;
|
||||||
*
|
this.listen(node, 'mousedown', '_trackMouseDown');
|
||||||
* @param {HTMLElement} node Element to attach the event listener to.
|
|
||||||
* @param {String} eventName Name of the event.
|
|
||||||
* @param {String} cbName Name of the handler.
|
|
||||||
*/
|
|
||||||
unlisten(node, eventName, cbName) {
|
|
||||||
this.__boundEventListeners = this.__boundEventListeners || new WeakMap();
|
|
||||||
const listeners = this.__boundEventListeners.get(node);
|
|
||||||
const eventKey = `${eventName}_${cbName}`;
|
|
||||||
|
|
||||||
if (listeners && typeof listeners[eventKey]) {
|
|
||||||
node.removeEventListener(eventName, listeners[eventKey]);
|
|
||||||
listeners[eventKey] = null;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
once(node, eventName, cbName) {
|
_trackMouseDown(e) {
|
||||||
const wrappedCbName = `__onceCb__${cbName}`;
|
this._trackInfo = {
|
||||||
|
originX: e.clientX,
|
||||||
this[wrappedCbName] = (...args) => {
|
originY: e.clientY,
|
||||||
this[cbName](...args);
|
started: false
|
||||||
this.unlisten(node, eventName, wrappedCbName);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
this.listen(node, eventName, wrappedCbName);
|
this.listen(window, 'mousemove', '_trackMouseMove', true);
|
||||||
|
this.once(window, 'mouseup', '_trackMouseUp');
|
||||||
|
}
|
||||||
|
|
||||||
|
_trackMouseMove(e) {
|
||||||
|
if (!this._trackInfo.started && trackHasMovedEnough(this._trackInfo, e.clientX, e.clientY)) {
|
||||||
|
this._trackInfo.started = true;
|
||||||
|
this._boundTrackingListener(new CustomEvent('track', { detail: { state: 'start', dx: e.clientX - this._trackInfo.originX, dy: e.clientY - this._trackInfo.originY }, bubbles: true, composed: true }));
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this._trackInfo.started) {
|
||||||
|
this._boundTrackingListener(new CustomEvent('track', { detail: { state: 'track', dx: e.clientX - this._trackInfo.originX, dy: e.clientY - this._trackInfo.originY }, bubbles: true, composed: true }));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_trackMouseUp(e) {
|
||||||
|
this._boundTrackingListener(new CustomEvent('track', { detail: { state: 'end', dx: e.clientX - this._trackInfo.originX, dy: e.clientY - this._trackInfo.originY }, bubbles: true, composed: true }));
|
||||||
|
this.unlisten(window, 'mousemove', '_trackMouseMove', true);
|
||||||
|
this._trackInfo = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const TRACK_DISTANCE = 5;
|
||||||
|
|
||||||
|
function trackHasMovedEnough(info, x, y) {
|
||||||
|
let dx = Math.abs(info.originX - x);
|
||||||
|
let dy = Math.abs(info.originY - y);
|
||||||
|
return (dx >= TRACK_DISTANCE || dy >= TRACK_DISTANCE);
|
||||||
|
}
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@tp/helpers",
|
"name": "@tp/helpers",
|
||||||
"version": "2.2.0",
|
"version": "2.3.0",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "closest.js",
|
"main": "closest.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
104
sort.js
Normal file
104
sort.js
Normal file
@ -0,0 +1,104 @@
|
|||||||
|
import { reach } from './reach.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sort collection asc by some field.
|
||||||
|
*
|
||||||
|
* @param {String} field Field to sort by.
|
||||||
|
* @param {Array} collection Collection to sort.
|
||||||
|
* @return {Array} The sorted collection.
|
||||||
|
*/
|
||||||
|
const sortAsc = (field, collection) => {
|
||||||
|
return collection.sort(function(a, b) {
|
||||||
|
let s1 = reach(field, a);
|
||||||
|
let s2 = reach(field, b);
|
||||||
|
|
||||||
|
if (typeof s1 === 'string') {
|
||||||
|
s1 = s1.toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof s2 === 'string') {
|
||||||
|
s2 = s2.toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
return naturalCompare(s1, s2);
|
||||||
|
}.bind(this));
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sort collection desc by some field.
|
||||||
|
*
|
||||||
|
* @param {String} field Field to sort by.
|
||||||
|
* @param {Array} collection Collection to sort.
|
||||||
|
* @return {Array} The sorted collection.
|
||||||
|
*/
|
||||||
|
const sortDesc = (field, collection) => {
|
||||||
|
return collection.sort(function(a, b) {
|
||||||
|
let s1 = reach(field, a);
|
||||||
|
let s2 = reach(field, b);
|
||||||
|
|
||||||
|
if (typeof s1 === 'string') {
|
||||||
|
s1 = s1.toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof s2 === 'string') {
|
||||||
|
s2 = s2.toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
return naturalCompare(s2, s1);
|
||||||
|
}.bind(this));
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sort strings naturally.
|
||||||
|
*
|
||||||
|
* @version 1.4.0
|
||||||
|
* @date 2015-10-26
|
||||||
|
* @stability 3 - Stable
|
||||||
|
* @author Lauri Rooden (https://github.com/litejs/natural-compare-lite)
|
||||||
|
* @license MIT License
|
||||||
|
*
|
||||||
|
* @param {String} a
|
||||||
|
* @param {String} b
|
||||||
|
* @return {Number} -1, 1 or 0.
|
||||||
|
*/
|
||||||
|
const naturalCompare = (a, b) => {
|
||||||
|
let i;
|
||||||
|
let codeA;
|
||||||
|
let codeB = 1;
|
||||||
|
let posA = 0;
|
||||||
|
let posB = 0;
|
||||||
|
const alphabet = String.alphabet;
|
||||||
|
|
||||||
|
function getCode(str, pos, code) {
|
||||||
|
if (code) {
|
||||||
|
for (i = pos; code = getCode(str, i), code < 76 && code > 65;) ++i;
|
||||||
|
return Number(str.slice(pos - 1, i));
|
||||||
|
}
|
||||||
|
code = alphabet && alphabet.indexOf(str.charAt(pos));
|
||||||
|
return code > -1 ? code + 76 : ((code = str.charCodeAt(pos) || 0), code < 45 || code > 127) ? code
|
||||||
|
: code < 46 ? 65 // -
|
||||||
|
: code < 48 ? code - 1
|
||||||
|
: code < 58 ? code + 18 // 0-9
|
||||||
|
: code < 65 ? code - 11
|
||||||
|
: code < 91 ? code + 11 // A-Z
|
||||||
|
: code < 97 ? code - 37
|
||||||
|
: code < 123 ? code + 5 // a-z
|
||||||
|
: code - 63;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ((a += '') != (b += '')) for (;codeB;) {
|
||||||
|
codeA = getCode(a, posA++);
|
||||||
|
codeB = getCode(b, posB++);
|
||||||
|
|
||||||
|
if (codeA < 76 && codeB < 76 && codeA > 66 && codeB > 66) {
|
||||||
|
codeA = getCode(a, posA, posA);
|
||||||
|
codeB = getCode(b, posB, posA = i);
|
||||||
|
posB = i;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (codeA != codeB) return (codeA < codeB) ? -1 : 1;
|
||||||
|
}
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
export { sortAsc, sortDesc, naturalCompare };
|
Loading…
Reference in New Issue
Block a user