Add Sortable to pools

This commit is contained in:
Bad Manners 2025-04-11 20:58:55 -03:00
parent 2b6b1f30f4
commit 239258e324
5 changed files with 141 additions and 29 deletions

View file

@ -16,6 +16,36 @@
{% if let Some(post) = posts.first() %}
<meta property="og:image" content="/files/{{ post.thumbnail }}" />
<meta property="twitter:image:src" content="/files/{{ post.thumbnail }}" />
{% endif %} {% if can_edit %}
<script>
htmx.onLoad(function (content) {
var sortables = content.querySelectorAll(".sortable");
for (var i = 0; i < sortables.length; i++) {
var sortable = sortables[i];
var sortableInstance = new Sortable(sortable, {
animation: 150,
ghostClass: "blue-background-class",
// Make the `.htmx-indicator` unsortable
filter: ".htmx-indicator",
onMove: function (evt) {
return evt.related.className.indexOf("htmx-indicator") === -1;
},
// Disable sorting on the `end` event
onEnd: function (evt) {
console.log(evt);
this.option("disabled", true);
},
});
// Re-enable sorting on the `htmx:afterSwap` event
sortable.addEventListener("htmx:afterSwap", function () {
sortableInstance.option("disabled", false);
});
}
});
</script>
{% endif %}
</head>
<body>