grain.social is a photo sharing platform built on atproto.
1import htmx from "htmx.org";
2import _hyperscript from "hyperscript.org";
3import Sortable from "sortablejs";
4import { GalleryLayout } from "./gallery_layout.ts";
5import { GalleryPhotosDialog } from "./gallery_photos_dialog.ts";
6import { PhotoDialog } from "./photo_dialog.ts";
7import { ProfileDialog } from "./profile_dialog.ts";
8import { UploadPage } from "./upload_page.ts";
9import * as utils from "./utils.ts";
10
11const galleryLayout = new GalleryLayout({
12 layoutMode: "justified",
13 spacing: 4,
14});
15galleryLayout.init();
16
17htmx.onLoad(function (element) {
18 PhotoDialog.maybeInitForElement(element);
19
20 if (element.id === "gallery-sort-dialog") {
21 const sortables = element.querySelectorAll(".sortable");
22 for (const sortable of Array.from(sortables)) {
23 new Sortable(sortable, {
24 animation: 150,
25 });
26 }
27 }
28});
29
30_hyperscript.browserInit();
31
32type GrainGlobal = typeof globalThis & {
33 htmx: typeof htmx;
34 _hyperscript: typeof _hyperscript;
35 Grain: {
36 uploadPage?: UploadPage;
37 profileDialog?: ProfileDialog;
38 galleryLayout?: GalleryLayout;
39 galleryPhotosDialog?: GalleryPhotosDialog;
40 utils?: typeof utils;
41 };
42};
43
44const g = globalThis as GrainGlobal;
45g.htmx = g.htmx ?? htmx;
46g._hyperscript = g._hyperscript ?? _hyperscript;
47g.Grain = g.Grain ?? {};
48g.Grain.uploadPage = new UploadPage();
49g.Grain.profileDialog = new ProfileDialog();
50g.Grain.galleryPhotosDialog = new GalleryPhotosDialog();
51g.Grain.galleryLayout = galleryLayout;
52g.Grain.utils = utils;