1.1.0 • Published 4 years ago
eriko-dragger.js v1.1.0
【eriko-dragger.js】
version: v1.1.0
last updated: 2020.5.26
Availability
npm install --save eriko-dragger.js
Usage
Example 1
Assign dragger by calling set methods.
import { ErikoDragger } from 'eriko-dragger.js';
var ed = new ErikoDragger();
ed.setContainer('#card-collector');
ed.setTarget('#cards');
ed.setStartEvent(this.handleDragStartEvent);
ed.setMoveEvent(this.handleDragMovingEvent);
ed.setEndEvent(this.handleDragEndEvent);
ed.setDebounce(500);
ed.launch();
ed.removeDragger();
Example 2
Assign dragger by passing parameter.
import { ErikoDragger } from 'eriko-dragger.js';
const option = {
startEvent: myStartEvent
moveEvent: myMoveEvent
endEvent: myEndEvent
debounce: 500
}
var ed = new ErikoDragger('#card-collector', '#cards', option);
ed.launch();
ed.removeDragger();
Get Drag Info
Use first default parameter.
function myMoveEvent(event) {
console.log(event);
}
document
container
name | type | optional | default |
---|---|---|---|
containerId | string | no |
target
name | type | optional | default |
---|---|---|---|
targetId | string | no |
option
name | type | optional | default |
---|---|---|---|
startEvent | function | yes | |
moveEvent | function | yes | |
endEvent | function | yes | |
debounce | number | yes | 300 |
event (default parameter)
name | type | description |
---|---|---|
dragStartCoord | object | {x, y} |
dragMovingCoord | object | {x, y} |
dragDirection | string | vertical direction + horizontal directoin |
dragDirectionFromPrev | string | vertical direction + horizontal directoin |
dragDistance | number | Drag distance from start position |
dragDistanceFromPrev | number | Drag distance from previous position |
dragDuration | number | Drag duration |
dragTranslate | string | {x, y, translate} |
sourceEvent | object | Original event |