STEMMechanics/Website
1
0
Fork 0
Code Issues 4 Pull Requests 3 Actions Packages Projects Releases 3 Wiki Activity

add double click support to media picker

Browse Source
This commit is contained in:
James Collins
2024-04-23 16:47:08 +10:00
parent b4f3fa6d07
commit 39d5b29ed3
1 changed files with 8 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
resources/js/media-picker.js
View File

@@ -43,6 +43,13 @@ const SMMediaPicker = {
} }
}, },
doubleClick: (name) => {
if (!Alpine.store('media').allow_multiple) {
Alpine.store('media').selected = [name];
Swal.clickConfirm();
}
},
search: () => { search: () => {
SMMediaPicker.query(null, document.querySelector('input[name="search"]').value); SMMediaPicker.query(null, document.querySelector('input[name="search"]').value);
}, },
@@ -120,6 +127,7 @@ const SMMediaPicker = {
class="cursor-pointer flex text-center p-1 flex-items-center flex-col h-40 w-56 border-2 rounded relative" class="cursor-pointer flex text-center p-1 flex-items-center flex-col h-40 w-56 border-2 rounded relative"
:class="{'border-primary-color': $store.media.selected.some(i => i === item.name), 'border-white': !$store.media.selected.some(i => i === item.name)}" :class="{'border-primary-color': $store.media.selected.some(i => i === item.name), 'border-white': !$store.media.selected.some(i => i === item.name)}"
x-on:click="SMMediaPicker.updateSelection(item.name)" x-on:click="SMMediaPicker.updateSelection(item.name)"
x-on:dblclick="SMMediaPicker.doubleClick(item.name)"
> >
<div x-show="$store.media.selected.some(i => i === item.name)" class="absolute -top-1.5 -right-2 w-6 h-6 bg-primary-color text-white flex items-center justify-center text-lg border border-white rounded"><i class="fa-solid fa-check"></i></div> <div x-show="$store.media.selected.some(i => i === item.name)" class="absolute -top-1.5 -right-2 w-6 h-6 bg-primary-color text-white flex items-center justify-center text-lg border border-white rounded"><i class="fa-solid fa-check"></i></div>
<div class="flex-grow flex items-center justify-center pointer-events-none select-none"> <div class="flex-grow flex items-center justify-center pointer-events-none select-none">