summaryrefslogtreecommitdiff
path: root/static/public
diff options
context:
space:
mode:
authorTim Keller <tjk@tjkeller.xyz>2025-06-24 19:23:33 -0500
committerTim Keller <tjk@tjkeller.xyz>2025-06-24 19:23:33 -0500
commitffa5ff333eabffe07394fb21bc413d7d238ee651 (patch)
tree007b506aca746fda9040ea4f0ffa8d6578e86f7e /static/public
parent09e9193b6be6e2eae7ffbfbfedd15ac22bab0022 (diff)
downloadimmich-frame-ffa5ff333eabffe07394fb21bc413d7d238ee651.tar.xz
immich-frame-ffa5ff333eabffe07394fb21bc413d7d238ee651.zip
move all files to /static
Diffstat (limited to 'static/public')
l---------static/public/albums1
-rw-r--r--static/public/index.html128
l---------static/public/settings1
l---------static/public/slideshow1
4 files changed, 131 insertions, 0 deletions
diff --git a/static/public/albums b/static/public/albums
new file mode 120000
index 0000000..27f8dec
--- /dev/null
+++ b/static/public/albums
@@ -0,0 +1 @@
+../public \ No newline at end of file
diff --git a/static/public/index.html b/static/public/index.html
new file mode 100644
index 0000000..7ddb58f
--- /dev/null
+++ b/static/public/index.html
@@ -0,0 +1,128 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
+ <script src="/main.js" defer></script>
+</head>
+<body class="bg-black text-white fill-white h-screen max-h-screen flex flex-col m-0 overflow-hidden">
+ <header></header>
+ <main class="my-4 overflow-hidden h-full flex flex-col">
+ <div id="slideshow" class="hidden! overflow-hidden h-full flex flex-col">
+ <div class="flex justify-end pe-[10vw] w-full absolute bg-gradient-to-b from-black/40 z-20">
+ <div id="slideshow-share" class="z-10">
+ <button id="share" class="svg-btn p-3 size-12"><svg alt="Share" class="size-6"><use href="#sprite-share"></use></svg></button>
+ <button id="download" class="svg-btn p-3 size-12"><svg alt="Download" class="size-6"><use href="#sprite-download"></use></svg></button>
+ </div>
+ </div>
+ <div id="slideshow-carousel" class="h-full"></div>
+ <template id="carousel-cell-template">
+ <div class="carousel-cell"><img class="carousel-img" src="" /></div>
+ </template>
+ <div class="grid grid-cols-3 w-full max-w-3xl m-auto justify-items-center py-4">
+ <button id="prev-slide" class="svg-btn size-12"><svg alt="Previous Slide" class="size-full"><use href="#sprite-skip_previous"></use></svg></button>
+ <button id="play-pause" class="svg-btn size-12"><svg alt="Pause" class="size-full"><use href="#sprite-pause"></use></svg></button>
+ <button id="next-slide" class="svg-btn size-12"><svg alt="Next Slide" class="size-full"><use href="#sprite-skip_next"></use></svg></button>
+ </div>
+ </div>
+ <div id="albums" class="hidden! overflow-y-scroll"><div class="px-4 m-auto max-w-3xl">
+ <div class="p-2 sticky top-0 z-20 bg-black">
+ <input class="rounded-input mx-auto mb-4 w-full" id="album-search" placeholder="Search your albums" />
+ <button id="albums-submit" class="rounded-btn">
+ <svg class="size-6"><use href="#sprite-check_circle"></use></svg>
+ Select
+ </button>
+ </div>
+ <div id="albums-container" class="m-auto z-10"></div>
+ <template id="album-template">
+ <div class="album group">
+ <svg class="opacity-0 self-center size-6 group-hover:opacity-50
+ group-data-selected:opacity-100 group-data-selected:fill-blue-300" alt="Select Album">
+ <use href="#sprite-check_circle"></use>
+ </svg>
+ <img class="aspect-square object-cover rounded-2xl group-hover:shadow-md" />
+ <div class="flex justify-between self-center text-lg">
+ <div>
+ <span class="album-name font-bold group-hover:text-blue-300"></span>
+ <div class="album-info">
+ <span><span class="album-assets-count"></span> items</span>
+ <span class="album-shared">&bull; Shared</span>
+ </div>
+ </div>
+ </div>
+ <a target="_blank" class="opacity-0 group-hover:opacity-100 absolute bottom-4 right-4">
+ <svg class="size-6" alt="View album in Immich"><use href="#sprite-open_in_new"></use></svg>
+ </a>
+ </div>
+ </template>
+ </div></div>
+ <div id="settings" class="hidden! overflow-y-scroll">
+ <form class="flex flex-col gap-4 m-auto max-w-3xl mx-auto px-4">
+ <fieldset class="rounded-fieldset">
+ <h2 class="fieldset-header">
+ <svg class="size-6 inline"><use href="#sprite-camera"></use></svg>
+ Immich Server
+ </h2>
+ <div>
+ <label class="settings-label">Immich URL</label>
+ <p>Complete Immich base url (e.g. <span class="font-medium">http://immich.local</span>)</p>
+ </div>
+ <input class="rounded-input" name="immich_url" type="text" />
+ <div>
+ <label class="settings-label">Immich API Key</label>
+ <p>Generate an API key in User Settings</p>
+ </div>
+ <input class="rounded-input" name="immich_api_key" type="text" />
+ </fieldset>
+ <fieldset class="rounded-fieldset">
+ <h2 class="fieldset-header">
+ <svg class="size-6 inline"><use href="#sprite-photo_frame"></use></svg>
+ Display
+ </h2>
+ <div class="grid md:grid-cols-[16fr_9fr] gap-4">
+ <div>
+ <label class="settings-label">Image Duration</label>
+ <p>Number of seconds each image will be displayed.</p>
+ </div>
+ <input class="my-auto rounded-input" name="image_duration" type="number" step="0.1" />
+ <div>
+ <label class="settings-label">Transition Duration</label>
+ <p>Number of seconds each image transition will take.<br>Set as 0 to disable.</p>
+ </div>
+ <input class="my-auto rounded-input" name="transition_duration" type="number" step="0.1" />
+ <div>
+ <label class="settings-label">Max Framerate</label>
+ <p>Target display framerate.<br>Simple transitions look good at 12-15 fps.</p>
+ </div>
+ <input class="my-auto rounded-input" name="max_framerate" type="number" step="0.1" />
+ <div>
+ <label class="settings-label">Display Size</label>
+ <p>Image size to load on the display.<br>Large thumbnail size is suitable for FHD.</p>
+ </div>
+ <select class="my-auto rounded-input" name="display_size">
+ <option value="thumbnail">Small Thumbnail (~15 kB)</option>
+ <option value="preview">Large Thumbnail (~400 kB)</option>
+ <option value="fullsize">Original Image</option>
+ </select>
+ <div>
+ <label class="settings-label">Max Cached Assets</label>
+ <p>Number of assets that can exist at once in RAM.<br>Each asset will take ~10x the display size in memory.</p>
+ </div>
+ <input class="my-auto rounded-input" name="max_cache_assets" type="number" />
+ </div>
+ </fieldset>
+ <input id="settings-submit" class="rounded-btn ml-auto" type="submit" value="Save Settings" />
+ </form>
+ </div>
+ </main>
+ <footer class="w-full">
+ <div class="max-w-5xl m-auto">
+ <div id="menu" class="flex w-full p-2 gap-4 box-border border-t border-gray-500">
+ <a class="nav-btn" href="/slideshow"><svg class="size-6"><use href="#sprite-slideshow" ></use></svg><span class="max-[425px]:hidden">Slideshow</span></a>
+ <a class="nav-btn" href="/albums" ><svg class="size-6"><use href="#sprite-photo_album"></use></svg><span class="max-[425px]:hidden">Albums</span></a>
+ <a class="nav-btn" href="/settings" ><svg class="size-6"><use href="#sprite-settings" ></use></svg><span class="max-[425px]:hidden">Settings</span></a>
+ </div>
+ </div>
+ </footer>
+</body>
+</html>
diff --git a/static/public/settings b/static/public/settings
new file mode 120000
index 0000000..27f8dec
--- /dev/null
+++ b/static/public/settings
@@ -0,0 +1 @@
+../public \ No newline at end of file
diff --git a/static/public/slideshow b/static/public/slideshow
new file mode 120000
index 0000000..27f8dec
--- /dev/null
+++ b/static/public/slideshow
@@ -0,0 +1 @@
+../public \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2026-02-02 20:32:24 +0000