archive-gh-me/draggable
1
0
Fork 0
mirror of https://github.com/Shopify/draggable.git synced 2025-12-08 20:15:56 +00:00
Code Issues Projects Releases Wiki Activity

Rename source to originalSource

Browse Source
This commit is contained in:
Max Hoffmann 2017-10-08 20:08:47 -04:00
parent a7fc70f0f4
commit 07e98f301b
No known key found for this signature in database
GPG Key ID: 1DFA4D13DD27A676
8 changed files with 47 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/Draggable/DragEvent/DragEvent.js
View File

@ -5,8 +5,8 @@ export class DragEvent extends AbstractEvent {
return this.data.source;
}
get movableSource() {
return this.data.movableSource;
get originalSource() {
return this.data.originalSource;
}
get mirror() {

49
src/Draggable/Draggable.js
View File

@ -188,25 +188,25 @@ export default class Draggable {
}
// Find draggable source element
this.source = closest(target, this.options.draggable);
this.originalSource = closest(target, this.options.draggable);
this.sourceContainer = container;
if (!this.source) {
if (!this.originalSource) {
sensorEvent.cancel();
return;
}
this.dragging = true;
this.movableSource = this.source.cloneNode(true);
this.source = this.originalSource.cloneNode(true);
if (!isDragEvent(originalEvent)) {
const appendableContainer = this.getAppendableContainer({source: this.source});
const appendableContainer = this.getAppendableContainer({source: this.originalSource});
this.mirror = this.source.cloneNode(true);
const mirrorCreatedEvent = new MirrorCreatedEvent({
source: this.source,
movableSource: this.movableSource,
originalSource: this.originalSource,
mirror: this.mirror,
sourceContainer: container,
sensorEvent,
@ -214,7 +214,7 @@ export default class Draggable {
const mirrorAttachedEvent = new MirrorAttachedEvent({
source: this.source,
movableSource: this.movableSource,
originalSource: this.originalSource,
mirror: this.mirror,
sourceContainer: container,
sensorEvent,
@ -225,11 +225,10 @@ export default class Draggable {
this.triggerEvent(mirrorAttachedEvent);
}
this.source.parentNode.insertBefore(this.movableSource, this.source);
this.originalSource.parentNode.insertBefore(this.source, this.originalSource);
this.source.style.display = 'none';
this.originalSource.style.display = 'none';
this.source.classList.add(this.getClassNameFor('source:dragging'));
this.movableSource.classList.add(this.getClassNameFor('source:dragging'));
this.sourceContainer.classList.add(this.getClassNameFor('container:dragging'));
document.body.classList.add(this.getClassNameFor('body:dragging'));
@ -237,7 +236,7 @@ export default class Draggable {
const mirrorMoveEvent = new MirrorMoveEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
});
@ -251,7 +250,7 @@ export default class Draggable {
const dragEvent = new DragStartEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
});
@ -267,7 +266,6 @@ export default class Draggable {
}
this.source.classList.remove(this.getClassNameFor('source:dragging'));
this.movableSource.classList.remove(this.getClassNameFor('source:dragging'));
this.sourceContainer.classList.remove(this.getClassNameFor('container:dragging'));
document.body.classList.remove(this.getClassNameFor('body:dragging'));
}
@ -284,7 +282,7 @@ export default class Draggable {
const dragMoveEvent = new DragMoveEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
});
@ -299,7 +297,7 @@ export default class Draggable {
const mirrorMoveEvent = new MirrorMoveEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
});
@ -318,7 +316,7 @@ export default class Draggable {
const dragOutEvent = new DragOutEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
over: this.currentOver,
@ -334,7 +332,7 @@ export default class Draggable {
const dragOutContainerEvent = new DragOutContainerEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
overContainer: this.overContainer,
@ -352,7 +350,7 @@ export default class Draggable {
const dragOverContainerEvent = new DragOverContainerEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
overContainer,
@ -369,7 +367,7 @@ export default class Draggable {
const dragOverEvent = new DragOverEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sourceContainer: container,
sensorEvent,
overContainer,
@ -389,20 +387,19 @@ export default class Draggable {
const dragStopEvent = new DragStopEvent({
source: this.source,
mirror: this.mirror,
movableSource: this.movableSource,
originalSource: this.originalSource,
sensorEvent: event.sensorEvent,
sourceContainer: this.sourceContainer,
});
this.triggerEvent(dragStopEvent);
this.movableSource.parentNode.insertBefore(this.source, this.movableSource);
this.movableSource.parentNode.removeChild(this.movableSource);
this.source.style.display = '';
this.source.parentNode.insertBefore(this.originalSource, this.source);
this.source.parentNode.removeChild(this.source);
this.originalSource.style.display = '';
this.source.classList.remove(this.getClassNameFor('source:dragging'));
this.movableSource.classList.remove(this.getClassNameFor('source:dragging'));
this.source.classList.add(this.getClassNameFor('source:placed'));
this.originalSource.classList.add(this.getClassNameFor('source:placed'));
this.sourceContainer.classList.add(this.getClassNameFor('container:placed'));
this.sourceContainer.classList.remove(this.getClassNameFor('container:dragging'));
document.body.classList.remove(this.getClassNameFor('body:dragging'));
@ -430,7 +427,7 @@ export default class Draggable {
}
}
const lastSource = this.source;
const lastSource = this.originalSource;
const lastSourceContainer = this.sourceContainer;
setTimeout(() => {
@ -445,7 +442,7 @@ export default class Draggable {
this.source = null;
this.mirror = null;
this.movableSource = null;
this.originalSource = null;
this.currentOverContainer = null;
this.currentOver = null;
this.sourceContainer = null;

4
src/Draggable/MirrorEvent/MirrorEvent.js
View File

@ -5,8 +5,8 @@ export class MirrorEvent extends AbstractEvent {
return this.data.source;
}
get movableSource() {
return this.data.movableSource;
get originalSource() {
return this.data.originalSource;
}
get mirror() {

18
src/Draggable/Plugins/Mirror/Mirror.js
View File

@ -20,7 +20,7 @@ export default class Mirror {
.off('mirror:move', this._onMirrorMove);
}
_onMirrorCreated({mirror, movableSource, sensorEvent}) {
_onMirrorCreated({mirror, source, sensorEvent}) {
const mirrorClass = this.draggable.getClassNameFor('mirror');
const setState = (data) => {
@ -28,7 +28,7 @@ export default class Mirror {
return data;
};
Promise.resolve({mirror, movableSource, sensorEvent, mirrorClass})
Promise.resolve({mirror, source, sensorEvent, mirrorClass})
.then(computeMirrorDimensions)
.then(calculateMirrorOffset)
.then(addMirrorClasses)
@ -45,22 +45,22 @@ export default class Mirror {
}
}
function onMirrorCreated({mirror, movableSource}) {
Promise.resolve({mirror, movableSource})
function onMirrorCreated({mirror, source}) {
Promise.resolve({mirror, source})
.then(resetMirror)
.catch();
}
function resetMirror(data) {
return withPromise((resolve) => {
const {mirror, movableSource} = data;
const {mirror, source} = data;
mirror.style.position = 'fixed';
mirror.style.pointerEvents = 'none';
mirror.style.top = 0;
mirror.style.left = 0;
mirror.style.width = `${movableSource.offsetWidth}px`;
mirror.style.height = `${movableSource.offsetHeight}px`;
mirror.style.width = `${source.offsetWidth}px`;
mirror.style.height = `${source.offsetHeight}px`;
resolve(data);
});
@ -68,8 +68,8 @@ function resetMirror(data) {
function computeMirrorDimensions(data) {
return withPromise((resolve) => {
const {movableSource} = data;
const sourceRect = movableSource.getBoundingClientRect();
const {source} = data;
const sourceRect = source.getBoundingClientRect();
resolve({...data, sourceRect});
});
}

4
src/Droppable/Droppable.js
View File

@ -122,7 +122,7 @@ export default class Droppable {
this.lastDroppable.classList.remove(occupiedClass);
}
droppable.appendChild(event.movableSource);
droppable.appendChild(event.source);
droppable.classList.add(occupiedClass);
return true;
@ -140,7 +140,7 @@ export default class Droppable {
return;
}
this.initialDroppable.appendChild(event.movableSource);
this.initialDroppable.appendChild(event.source);
this.lastDroppable.classList.remove(this.getClassNameFor('droppable:occupied'));
}

6
src/Plugins/Snappable/Snappable.js
View File

@ -38,7 +38,7 @@ export default class Snappable {
return;
}
this.firstSource = event.movableSource;
this.firstSource = event.source;
}
_onDragStop() {
@ -50,7 +50,7 @@ export default class Snappable {
return;
}
const source = event.movableSource || event.dragEvent.movableSource;
const source = event.source || event.dragEvent.source;
const mirror = event.mirror || event.dragEvent.mirror;
if (source === this.firstSource) {
@ -86,7 +86,7 @@ export default class Snappable {
}
const mirror = event.mirror || event.dragEvent.mirror;
const source = event.movableSource || event.dragEvent.movableSource;
const source = event.source || event.dragEvent.source;
const snapOutEvent = new SnapOutEvent({
dragEvent: event,

6
src/Sortable/Sortable.js
View File

@ -61,7 +61,7 @@ export default class Sortable {
return;
}
const moves = move(event.movableSource, event.over, event.overContainer);
const moves = move(event.source, event.over, event.overContainer);
if (!moves) {
return;
@ -76,11 +76,11 @@ export default class Sortable {
}
_onDragOver(event) {
if (event.over === event.movableSource || event.over === event.source) {
if (event.over === event.originalSource || event.over === event.source) {
return;
}
const moves = move(event.movableSource, event.over, event.overContainer);
const moves = move(event.source, event.over, event.overContainer);
if (!moves) {
return;

6
src/Swappable/Swappable.js
View File

@ -51,13 +51,13 @@ export default class Swappable {
}
_onDragOver(event) {
if (event.over === event.movableSource || event.over === event.source || event.canceled()) {
if (event.over === event.originalSource || event.over === event.source || event.canceled()) {
return;
}
// swap originally swapped element back
if (this.lastOver && this.lastOver !== event.over) {
swap(this.lastOver, event.movableSource);
swap(this.lastOver, event.source);
}
if (this.lastOver === event.over) {
@ -66,7 +66,7 @@ export default class Swappable {
this.lastOver = event.over;
}
swap(event.movableSource, event.over);
swap(event.source, event.over);
// Let this cancel the actual swap
const swappableSwappedEvent = new SwappableSwappedEvent({