ekoetki/public/assets/js/draggable.js

138 lines
3.6 KiB
JavaScript

const draggableCard = document.querySelector('#draggableCard');
const shareMenuLeft = document.querySelector('#shareMenuLeft');
const shareMenuRight = document.querySelector('#shareMenuRight');
const clonicMenuLeft = document.querySelector('#clonicMenuLeft');
const clonicMenuRight = document.querySelector('#clonicMenuRight');
const handleList = document.querySelector('#handleList');
const gridList = document.querySelector('#gridList');
const nestedSortables = $(".nested-sortable");
try {
if (draggableCard) {
new Sortable(draggableCard, {
animation: 150,
ghostClass: 'blue-background-class'
});
} else {
console.warn("draggableCard element not found.");
}
} catch (e) {
console.error("Error initializing draggable card sortable:", e);
}
try {
if (shareMenuLeft && shareMenuRight) {
new Sortable(shareMenuLeft, {
group: 'shared',
animation: 150
});
new Sortable(shareMenuRight, {
group: 'shared',
animation: 150
});
} else {
console.warn("Share menu elements not found.");
}
} catch (e) {
console.error("Error initializing share menu list sortable:", e);
}
try {
if (clonicMenuLeft && clonicMenuRight) {
new Sortable(clonicMenuLeft, {
group: {
name: 'shared1',
pull: 'clone',
put: false
},
animation: 150,
sort: false
});
new Sortable(clonicMenuRight, {
group: {
name: 'shared1',
pull: 'clone'
},
animation: 150
});
} else {
console.warn("Clonic menu elements not found.");
}
} catch (e) {
console.error("Error initializing clonic menu list sortable:", e);
}
// Handle list sortable initialization
try {
if (handleList) {
new Sortable(handleList, {
handle: '.list-handle',
animation: 150
});
} else {
console.warn("Handle list element not found.");
}
} catch (e) {
console.error("Error initializing handle list sortable:", e);
}
// Grid box sortable initialization
try {
if (gridList) {
new Sortable(gridList, {
swap: true,
swapClass: 'highlight',
animation: 150
});
} else {
console.warn("Grid list element not found.");
}
} catch (e) {
console.error("Error initializing grid box sortable:", e);
}
// Nestable list sortable initialization
$(document).ready(function () {
try {
if (nestedSortables.length) {
nestedSortables.each(function (index, element) {
new Sortable(element, {
group: 'nested',
animation: 150,
fallbackOnBody: true,
swapThreshold: 0.65,
});
});
} else {
console.warn("No nested sortable elements found.");
}
} catch (e) {
console.error("Error initializing nested list sortable:", e);
}
});
const someElement = document.querySelector('#someElement');
const eventHandler = function () {
console.log('Event triggered!');
};
try {
if (someElement) {
someElement.addEventListener('click', eventHandler);
} else {
console.warn("someElement not found.");
}
} catch (e) {
console.error("Error attaching event listener:", e);
}
try {
if (someElement) {
someElement.removeEventListener('click', eventHandler);
}
} catch (e) {
console.error("Error detaching event listener:", e);
}