PonyMirrors/philomena
1
0
Fork 0
mirror of https://github.com/philomena-dev/philomena.git synced 2024-11-27 13:47:58 +01:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #282 from philomena-dev/ts-galleries

Browse source 
Convert gallery rearrangement scripts to TypeScript
This commit is contained in:
liamwhite 2024-06-09 22:00:33 -04:00 committed by GitHub
commit cb4a651d18
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 17 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
assets/js/galleries.js → assets/js/galleries.ts
View file

@ -3,6 +3,7 @@
*/ */
import { arraysEqual } from './utils/array'; import { arraysEqual } from './utils/array';
import { assertNotNull, assertNotUndefined } from './utils/assert';
import { $, $$ } from './utils/dom'; import { $, $$ } from './utils/dom';
import { initDraggables } from './utils/draggable'; import { initDraggables } from './utils/draggable';
import { fetchJson } from './utils/requests'; import { fetchJson } from './utils/requests';
@ -10,17 +11,18 @@ import { fetchJson } from './utils/requests';
export function setupGalleryEditing() { export function setupGalleryEditing() {
if (!$('.rearrange-button')) return; if (!$('.rearrange-button')) return;
const [ rearrangeEl, saveEl ] = $$('.rearrange-button'); const [ rearrangeEl, saveEl ] = $$<HTMLElement>('.rearrange-button');
const sortableEl = $('#sortable'); const sortableEl = assertNotNull($<HTMLDivElement>('#sortable'));
const containerEl = $('.js-resizable-media-container'); const containerEl = assertNotNull($<HTMLDivElement>('.js-resizable-media-container'));
// Copy array // Copy array
let oldImages = window.booru.galleryImages.slice(); const galleryImages = assertNotUndefined(window.booru.galleryImages);
let newImages = window.booru.galleryImages.slice(); let oldImages = galleryImages.slice();
let newImages = galleryImages.slice();
initDraggables(); initDraggables();
$$('.media-box', containerEl).forEach(i => i.draggable = true); $$<HTMLDivElement>('.media-box', containerEl).forEach(i => i.draggable = true);
rearrangeEl.addEventListener('click', () => { rearrangeEl.addEventListener('click', () => {
sortableEl.classList.add('editing'); sortableEl.classList.add('editing');
@ -31,12 +33,15 @@ export function setupGalleryEditing() {
sortableEl.classList.remove('editing'); sortableEl.classList.remove('editing');
containerEl.classList.remove('drag-container'); containerEl.classList.remove('drag-container');
newImages = $$('.image-container', containerEl).map(i => parseInt(i.dataset.imageId, 10)); newImages = $$<HTMLDivElement>('.image-container', containerEl)
.map(i => parseInt(assertNotUndefined(i.dataset.imageId), 10));
// If nothing changed, don't bother. // If nothing changed, don't bother.
if (arraysEqual(newImages, oldImages)) return; if (arraysEqual(newImages, oldImages)) return;
fetchJson('PATCH', saveEl.dataset.reorderPath, { const reorderPath = assertNotUndefined(saveEl.dataset.reorderPath);
fetchJson('PATCH', reorderPath, {
image_ids: newImages, image_ids: newImages,
// copy the array again so that we have the newly updated set // copy the array again so that we have the newly updated set

4
assets/types/booru-object.d.ts vendored
View file

@ -69,6 +69,10 @@ interface BooruObject {
* Indicates whether sensitive staff-only info should be hidden or not. * Indicates whether sensitive staff-only info should be hidden or not.
*/ */
hideStaffTools: string; hideStaffTools: string;
/**
* List of image IDs in the current gallery.
*/
galleryImages?: number[];
} }
declare global { declare global {