From cddc0217724f1a7661014d50e4c940e623a0c2dc Mon Sep 17 00:00:00 2001
From: Mario <mario@mariovavti.com>
Date: Tue, 3 Aug 2021 07:12:35 +0000
Subject: Apps drag and drop feature

---
 library/Sortable/plugins/Swap/README.md | 55 ++++++++++++++++++++
 library/Sortable/plugins/Swap/Swap.js   | 90 +++++++++++++++++++++++++++++++++
 library/Sortable/plugins/Swap/index.js  |  1 +
 3 files changed, 146 insertions(+)
 create mode 100644 library/Sortable/plugins/Swap/README.md
 create mode 100644 library/Sortable/plugins/Swap/Swap.js
 create mode 100644 library/Sortable/plugins/Swap/index.js

(limited to 'library/Sortable/plugins/Swap')

diff --git a/library/Sortable/plugins/Swap/README.md b/library/Sortable/plugins/Swap/README.md
new file mode 100644
index 000000000..7c6e3994a
--- /dev/null
+++ b/library/Sortable/plugins/Swap/README.md
@@ -0,0 +1,55 @@
+## Swap Plugin
+This plugin modifies the behaviour of Sortable to allow for items to be swapped with eachother rather than sorted. Once dragging starts, the user can drag over other items and there will be no change in the elements. However, the item that the user drops on will be swapped with the originally dragged item.
+
+Demo: https://jsbin.com/yejehog/edit?html,js,output
+
+
+---
+
+
+### Mounting
+```js
+import { Sortable, Swap } from 'sortablejs/modular/sortable.core.esm';
+
+Sortable.mount(new Swap());
+```
+
+
+---
+
+
+### Options
+
+```js
+new Sortable(el, {
+	swap: true, // Enable swap mode
+	swapClass: "sortable-swap-highlight" // Class name for swap item (if swap mode is enabled)
+});
+```
+
+
+---
+
+
+#### `swapClass` option
+Class name for the item to be swapped with, if swap mode is enabled. Defaults to `sortable-swap-highlight`.
+
+```css
+.highlighted {
+  background-color: #9AB6F1;
+}
+```
+
+```js
+Sortable.create(list, {
+  swap: true,
+  swapClass: "highlighted"
+});
+```
+
+
+---
+
+
+### Event Properties
+ - swapItem:`HTMLElement|undefined` — The element that the dragged element was swapped with
diff --git a/library/Sortable/plugins/Swap/Swap.js b/library/Sortable/plugins/Swap/Swap.js
new file mode 100644
index 000000000..3f0feb7dc
--- /dev/null
+++ b/library/Sortable/plugins/Swap/Swap.js
@@ -0,0 +1,90 @@
+import {
+	toggleClass,
+	index
+} from '../../src/utils.js';
+
+let lastSwapEl;
+
+
+function SwapPlugin() {
+	function Swap() {
+		this.defaults = {
+			swapClass: 'sortable-swap-highlight'
+		};
+	}
+
+	Swap.prototype = {
+		dragStart({ dragEl }) {
+			lastSwapEl = dragEl;
+		},
+		dragOverValid({ completed, target, onMove, activeSortable, changed, cancel }) {
+			if (!activeSortable.options.swap) return;
+			let el = this.sortable.el,
+				options = this.options;
+			if (target && target !== el) {
+				let prevSwapEl = lastSwapEl;
+				if (onMove(target) !== false) {
+					toggleClass(target, options.swapClass, true);
+					lastSwapEl = target;
+				} else {
+					lastSwapEl = null;
+				}
+
+				if (prevSwapEl && prevSwapEl !== lastSwapEl) {
+					toggleClass(prevSwapEl, options.swapClass, false);
+				}
+			}
+			changed();
+
+			completed(true);
+			cancel();
+		},
+		drop({ activeSortable, putSortable, dragEl }) {
+			let toSortable = (putSortable || this.sortable);
+			let options = this.options;
+			lastSwapEl && toggleClass(lastSwapEl, options.swapClass, false);
+			if (lastSwapEl && (options.swap || putSortable && putSortable.options.swap)) {
+				if (dragEl !== lastSwapEl) {
+					toSortable.captureAnimationState();
+					if (toSortable !== activeSortable) activeSortable.captureAnimationState();
+					swapNodes(dragEl, lastSwapEl);
+
+					toSortable.animateAll();
+					if (toSortable !== activeSortable) activeSortable.animateAll();
+				}
+			}
+		},
+		nulling() {
+			lastSwapEl = null;
+		}
+	};
+
+	return Object.assign(Swap, {
+		pluginName: 'swap',
+		eventProperties() {
+			return {
+				swapItem: lastSwapEl
+			};
+		}
+	});
+}
+
+
+function swapNodes(n1, n2) {
+	let p1 = n1.parentNode,
+		p2 = n2.parentNode,
+		i1, i2;
+
+	if (!p1 || !p2 || p1.isEqualNode(n2) || p2.isEqualNode(n1)) return;
+
+	i1 = index(n1);
+	i2 = index(n2);
+
+	if (p1.isEqualNode(p2) && i1 < i2) {
+		i2++;
+	}
+	p1.insertBefore(n2, p1.children[i1]);
+	p2.insertBefore(n1, p2.children[i2]);
+}
+
+export default SwapPlugin;
diff --git a/library/Sortable/plugins/Swap/index.js b/library/Sortable/plugins/Swap/index.js
new file mode 100644
index 000000000..9799bc72c
--- /dev/null
+++ b/library/Sortable/plugins/Swap/index.js
@@ -0,0 +1 @@
+export { default } from './Swap.js';
-- 
cgit v1.2.3