From 3e7fdfb6c8a50c59ac933f701526ad1815dded92 Mon Sep 17 00:00:00 2001 From: Tim Keller Date: Tue, 9 Dec 2025 22:16:48 -0600 Subject: refactor codebase. Reorganize file structure. Replace webpack for vite. Setup setuptools for application. Move closer to distributable app --- src/client/index.html | 138 +++++++++++++++++ src/client/src/albums.js | 87 +++++++++++ src/client/src/connector.js | 92 +++++++++++ src/client/src/icons.js | 19 +++ ...ched_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...mera_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...rcle_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...lect_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...load_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...mage_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ..._new_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...ause_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...lbum_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...rame_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...rrow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + src/client/src/icons/removefill.sh | 6 + ...arch_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg | 1 + ..._all_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...ings_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...hare_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...next_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...ious_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ...show_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg | 1 + ..._off_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg | 1 + src/client/src/index.js | 29 ++++ src/client/src/pages.js | 54 +++++++ src/client/src/settings.js | 16 ++ src/client/src/slides.js | 137 ++++++++++++++++ src/client/src/style.css | 48 ++++++ src/server/__main__.py | 20 +++ src/server/flaskapi.py | 90 +++++++++++ src/server/immich.py | 64 ++++++++ src/server/lazycachelist.py | 170 ++++++++++++++++++++ src/server/manager.py | 127 +++++++++++++++ src/server/renderer.py | 172 +++++++++++++++++++++ src/server/settings.py | 32 ++++ src/server/texture.py | 67 ++++++++ src/server/window.py | 154 ++++++++++++++++++ 38 files changed, 1541 insertions(+) create mode 100644 src/client/index.html create mode 100644 src/client/src/albums.js create mode 100644 src/client/src/connector.js create mode 100644 src/client/src/icons.js create mode 100644 src/client/src/icons/cached_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/camera_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/check_circle_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/deselect_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/download_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/image_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/open_in_new_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/pause_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/photo_album_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/photo_frame_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/play_arrow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100755 src/client/src/icons/removefill.sh create mode 100644 src/client/src/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/select_all_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/settings_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/share_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/skip_next_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/skip_previous_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/slideshow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/icons/visibility_off_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 src/client/src/index.js create mode 100644 src/client/src/pages.js create mode 100644 src/client/src/settings.js create mode 100644 src/client/src/slides.js create mode 100644 src/client/src/style.css create mode 100644 src/server/__main__.py create mode 100644 src/server/flaskapi.py create mode 100644 src/server/immich.py create mode 100644 src/server/lazycachelist.py create mode 100644 src/server/manager.py create mode 100644 src/server/renderer.py create mode 100644 src/server/settings.py create mode 100644 src/server/texture.py create mode 100644 src/server/window.py (limited to 'src') diff --git a/src/client/index.html b/src/client/index.html new file mode 100644 index 0000000..dcecf89 --- /dev/null +++ b/src/client/index.html @@ -0,0 +1,138 @@ + + + + + + + + +
+
+ +
+
+
+ + +
+
+ + +
+ + + +
+
+ +
+
+ + +
+
+ +
+ +
+
+
+

+ + Immich Server +

+
+ +

Complete Immich base url (e.g. http://immich.local)

+
+ +
+ +

Generate an API key in User Settings

+
+ +
+
+

+ + Display +

+
+
+ +

Number of seconds each image will be displayed.

+
+ +
+ +

Number of seconds each image transition will take.
Set as 0 to disable.

+
+ +
+ +

Target display framerate.
Simple transitions look good at 12-15 fps.

+
+ +
+ +

Image size to load on the display.
Large thumbnail size is suitable for FHD.

+
+ +
+ +

Number of assets that can exist at once in RAM.
Each asset will take ~10x the display size in memory.

+
+ +
+
+ +
+
+

Immich Pix Frame

+

© Tim Keller 2025

+

GPL-3.0 License

+

View Source

+
+
+
+
+ + + diff --git a/src/client/src/albums.js b/src/client/src/albums.js new file mode 100644 index 0000000..0ac9195 --- /dev/null +++ b/src/client/src/albums.js @@ -0,0 +1,87 @@ +import apiConnector from "./connector.js" + +class Album { + static albums = [] + static albumTemplate = null + static albumContainer = null + + constructor(data) { + this.data = data + // create clone element + const e = Album.albumTemplate.content.cloneNode(true) + e.firstElementChild.dataset.key = data.id + e.querySelector("a").href = apiConnector.albumSrc(data.id) + e.querySelector("img").src = apiConnector.assetThumbnailSrc(data.albumThumbnailAssetId) + e.querySelector(".album-name").textContent = data.albumName + e.querySelector(".album-assets-count").textContent = data.assetCount.toLocaleString() + if (!data.shared) + e.querySelector(".album-shared").remove() + + Album.albums.push(this) + Album.albumsContainer.appendChild(e) + this.element = Album.albumsContainer.lastElementChild + if (data.selected) + this.element.dataset.selected = "1" + } + + toggleVisibility(visible) { this.element.classList.toggle("hidden!", !visible) } + + static albumSelect(e) { + // find album element + let album = e.target + while (album && !album.classList.contains("album")) + album = album.parentElement + + if (album === null) + return + + if (album.dataset.selected) + delete album.dataset.selected + else + album.dataset.selected = "1" + } + + static albumsFilter(e) { + const q = e.target.value.toLowerCase() + for (const album of Album.albums) { + const match = album.data.albumName.toLowerCase().includes(q) + album.toggleVisibility(match) + } + } + + static getSelected() { + const s = [] + for (const album of Album.albums) + if (album.element.dataset.selected) + s.push(album.data.id) + return s + } + + static submitSelected() { + apiConnector.updateAlbums(Album.getSelected()) + } + + static async initAlbums(albumsPageContainer) { + Album.albumsContainer = albumsPageContainer.querySelector("#albums-container") + Album.albumTemplate = albumsPageContainer.querySelector("#album-template") + const albumSearch = albumsPageContainer.querySelector("#album-search") + const albumsSubmit = albumsPageContainer.querySelector("#albums-submit") + + // create albums + const albumsResponse = await apiConnector.fetchAlbums() + if (!albumsResponse.length) + return false + + for (const res of albumsResponse) + new Album(res) + + // album selection + Album.albumsContainer.addEventListener("click", Album.albumSelect) + albumSearch.addEventListener("input", Album.albumsFilter) + albumsSubmit.addEventListener("click", Album.submitSelected) + + return true + } +} + +export default Album.initAlbums diff --git a/src/client/src/connector.js b/src/client/src/connector.js new file mode 100644 index 0000000..9568dc8 --- /dev/null +++ b/src/client/src/connector.js @@ -0,0 +1,92 @@ +import io from "socket.io-client" + +class APIConnector { + constructor(url) { + this.url = url ?? "" + this.socket = io(url) + + this.assetIndex = 0 + this.movement = 0 + this.assets = null + this.currentAsset = null + this.seekCallbacks = [] + + this.socket.on("seek", e => { + this.assetIndex = e.asset_index + this.movement = e.movement + this.assets = e.assets + this.currentAsset = e.current_asset + for (const cb of this.seekCallbacks) + cb() + }) + + this.downloadAnchor = document.createElement("a") + this.downloadAnchor.classList = "hidden" + document.body.appendChild(this.downloadAnchor) + } + + fetch(endpoint, c) { + return fetch(this.url + "/api" + endpoint, c ?? {}) + .then(response => { + if (!response.ok) + throw new Error(`HTTP error! Status: ${response.status}`) + return response.json() + }) + .then(data => { + return data + }) + .catch(error => { + console.error("Fetch error:", error) + return null + }) + } + + async assetDownload(key) { + const filename = await this.assetFileName(key) + fetch(this.assetFullsizeSrc(key)) + .then(response => { + if (!response.ok) + throw new Error(`HTTP error! Status: ${response.status}`) + return response.blob() + }) + .then(blob => { + const blobUrl = URL.createObjectURL(blob) + this.downloadAnchor.href = blobUrl + this.downloadAnchor.download = filename + + this.downloadAnchor.click() + URL.revokeObjectURL(blobUrl) + }) + .catch(error => { + console.error("Fetch error:", error) + return null + }) + } + + post(endpoint, body) { + return this.fetch(endpoint, { + method: "POST", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify(body), + }) + } + + seek(increment) { + this.socket.emit("seek", increment) + } + + fetchAlbums() { return this.fetch("/albums") } + fetchConfig() { return this.fetch("/config") } + updateAlbums(albums) { return this.post("/albums/update", albums) } + updateConfig(config) { return this.post("/config/update", config) } + + albumSrc(key) { return `${this.url}/api/redirect/albums/${key}` } + + assetPreviewSrc(key) { return `${this.url}/api/asset/${key}` } + assetThumbnailSrc(key) { return `${this.url}/api/asset/${key}/thumbnail` } + assetFullsizeSrc(key) { return `${this.url}/api/asset/${key}/fullsize` } + assetFileName(key) { return this.fetch(`/asset/${key}/filename`).then(d => d.filename) } +} + +const apiConnector = new APIConnector(window.location.origin) +export default apiConnector diff --git a/src/client/src/icons.js b/src/client/src/icons.js new file mode 100644 index 0000000..529d509 --- /dev/null +++ b/src/client/src/icons.js @@ -0,0 +1,19 @@ +import "./icons/cached_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/camera_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/check_circle_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/deselect_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/download_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/image_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/open_in_new_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/pause_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/photo_album_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/photo_frame_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/play_arrow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/select_all_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/settings_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/share_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg" +import "./icons/skip_next_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/skip_previous_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/slideshow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg" +import "./icons/visibility_off_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg" diff --git a/src/client/src/icons/cached_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/cached_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..5e389dc --- /dev/null +++ b/src/client/src/icons/cached_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/camera_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/camera_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..06d30f0 --- /dev/null +++ b/src/client/src/icons/camera_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/check_circle_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/check_circle_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..028526b --- /dev/null +++ b/src/client/src/icons/check_circle_24dp_E3E3E3_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/deselect_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/deselect_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..dd46e14 --- /dev/null +++ b/src/client/src/icons/deselect_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/download_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/download_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..e9ef3c9 --- /dev/null +++ b/src/client/src/icons/download_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/image_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/image_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..1ff79ee --- /dev/null +++ b/src/client/src/icons/image_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/open_in_new_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/open_in_new_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..12e0802 --- /dev/null +++ b/src/client/src/icons/open_in_new_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/pause_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/pause_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..aa7aece --- /dev/null +++ b/src/client/src/icons/pause_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/photo_album_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/photo_album_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..95ead34 --- /dev/null +++ b/src/client/src/icons/photo_album_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/photo_frame_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/photo_frame_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..e26dccc --- /dev/null +++ b/src/client/src/icons/photo_frame_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/play_arrow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/play_arrow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..22dd0af --- /dev/null +++ b/src/client/src/icons/play_arrow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/removefill.sh b/src/client/src/icons/removefill.sh new file mode 100755 index 0000000..399e8e4 --- /dev/null +++ b/src/client/src/icons/removefill.sh @@ -0,0 +1,6 @@ +#!/bin/sh +# Google Material Icons -- complete default settings +sed -Ei 's/ ?fill="#[0-9a-fA-F]{6}"//' *.svg +for svg in *.svg; do + echo "import \"./icons/$svg\"" +done diff --git a/src/client/src/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..1d95298 --- /dev/null +++ b/src/client/src/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/select_all_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/select_all_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..3a6618e --- /dev/null +++ b/src/client/src/icons/select_all_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/settings_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/settings_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..92240e4 --- /dev/null +++ b/src/client/src/icons/settings_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/share_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/share_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..911d24e --- /dev/null +++ b/src/client/src/icons/share_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/skip_next_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/skip_next_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..ba0282f --- /dev/null +++ b/src/client/src/icons/skip_next_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/skip_previous_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/skip_previous_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..ea45ca0 --- /dev/null +++ b/src/client/src/icons/skip_previous_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/slideshow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg b/src/client/src/icons/slideshow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..17fb6dd --- /dev/null +++ b/src/client/src/icons/slideshow_24dp_FFFFFF_FILL1_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/icons/visibility_off_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg b/src/client/src/icons/visibility_off_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..41b5681 --- /dev/null +++ b/src/client/src/icons/visibility_off_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/src/index.js b/src/client/src/index.js new file mode 100644 index 0000000..7d7c9db --- /dev/null +++ b/src/client/src/index.js @@ -0,0 +1,29 @@ +import "@fontsource/overpass" +import "@fontsource/overpass/700.css" +import "@fontsource/overpass/500.css" +import "./style.css" +import Page from "./pages.js" +import "./icons.js" +import initSlides from "./slides.js" +import initAlbums from "./albums.js" +import initSettings from "./settings.js" + +const slideshow = new Page(document.querySelector("#slideshow"), ["", "/slideshow"], initSlides) +const albums = new Page(document.querySelector("#albums"), ["/albums"], initAlbums) +const settings = new Page(document.querySelector("#settings"), ["/settings"], initSettings) + +window.addEventListener("popstate", Page.pathnameCallback) +Page.pathnameCallback() /* run after all pages are registered */ + +/* add event listeners for anchor elements in footer */ +function softRedirect(e) { + e.preventDefault() + let a = e.target + if (a === null) return + while (a !== null && a.tagName !== "A") + a = a.parentElement + if (a === null) return + Page.softRedirect(a.href) +} + +document.querySelector("#menu").addEventListener("click", softRedirect) diff --git a/src/client/src/pages.js b/src/client/src/pages.js new file mode 100644 index 0000000..e2199a4 --- /dev/null +++ b/src/client/src/pages.js @@ -0,0 +1,54 @@ +const menu = document.querySelector("#menu") + +export default class Page { + static pages = {} + static currentPage = null + + static pathnameCallback() { + const path = window.location.pathname.replace(/\/$/, "") + const page = Page.pages[path] + + if (!page) + throw new Error(`Path '${path}' does not exist`) + + if (Page.currentPage) + Page.currentPage.setVisible(false) + + page.setVisible(true) + Page.currentPage = page + } + + static softRedirect(path) { + window.history.pushState({}, "", path) + Page.pathnameCallback() + } + + constructor(pageContainer, endpoints, f_initialize) { + for (const endpoint of endpoints) + Page.pages[endpoint] = this + + this.pageContainer = pageContainer + this.endpoints = endpoints + this.initialize = f_initialize + this.visible = false + this.initialized = false + } + + async setVisible(visible) { + this.pageContainer.classList.toggle("hidden!", !visible) + this.visible = visible + if (this.visible) { + /* initialize page */ + if (!this.initialized && this.initialize) + this.initialized = await this.initialize(this.pageContainer) + + /* set selected attribute on the link */ + for (const a of menu.querySelectorAll("a")) { + if (this.endpoints.includes(a.getAttribute("href"))) + a.dataset.selected = "1" + else + delete a.dataset.selected + } + } + } +} diff --git a/src/client/src/settings.js b/src/client/src/settings.js new file mode 100644 index 0000000..fd8bdad --- /dev/null +++ b/src/client/src/settings.js @@ -0,0 +1,16 @@ +import apiConnector from "./connector.js" + +export default async function initSettings(settingsPageContainer) { + const inputList = Array.from(settingsPageContainer.querySelectorAll("[name]")) + const inputs = Object.fromEntries(inputList.map(e => [e.name, e])) + const currentConfig = await apiConnector.fetchConfig() + + for (const [name, value] of Object.entries(currentConfig)) + if (inputs[name]) + inputs[name].value = value + + settingsPageContainer.querySelector("#settings-submit").addEventListener("click", e => { + e.preventDefault() + apiConnector.updateConfig(Object.fromEntries(inputList.map(el => [el.name, el.type === "number" ? parseFloat(el.value) : el.value]))) + }) +} diff --git a/src/client/src/slides.js b/src/client/src/slides.js new file mode 100644 index 0000000..a0d58ac --- /dev/null +++ b/src/client/src/slides.js @@ -0,0 +1,137 @@ +import Flickity from "flickity" +import "flickity/dist/flickity.min.css" +import apiConnector from "./connector.js" + +class Slides { + constructor(slidesContainer) { + /* previous selected index */ + this.selectedIndex = 0 + this.assetIndex = 0 + + this.slidesContainer = slidesContainer + + /* append 11 cells to carousel */ + const carousel = this.slidesContainer.querySelector("#slideshow-carousel") + const cellTemplate = this.slidesContainer.querySelector("#carousel-cell-template") + this.cells = [] + for (let i = 0; i < 11; i++) + carousel.appendChild(cellTemplate.content.cloneNode(true)) + + /* initialize slides */ + this.flickity = new Flickity(carousel, { + wrapAround: true, + prevNextButtons: false, + pageDots: false, + resize: true, + setGallerySize: false, + }) + + this.flickity.on("scroll", progress => { this.scroll(progress) }) + this.flickity.on("staticClick", (e, pointer, cellElement, cellIndex) => { this.staticClick(e, pointer, cellElement, cellIndex) }) + this.flickity.on("dragEnd", () => { this.seek() }) + this.initImages() + + /* initialize seek buttons */ + const seekPrevButton = this.slidesContainer.querySelector("#prev-slide") + const seekNextButton = this.slidesContainer.querySelector("#next-slide") + + seekPrevButton.addEventListener("click", () => { this.flickity.previous() ; this.seek() }) + seekNextButton.addEventListener("click", () => { this.flickity.next() ; this.seek() }) + + /* initialize seek callback */ + apiConnector.seekCallbacks.push(c => { this.seekCallback() }) + + /* initialize top controls */ + const assetDownloadButton = this.slidesContainer.querySelector("#download") + + assetDownloadButton.addEventListener("click", () => { apiConnector.assetDownload(apiConnector.currentAsset) }) + } + + seek() { + // this is just like calculating movement in lazycachelist.py + // gets the min of the absolute values and returns signed value + const increment = [ + this.flickity.selectedIndex - this.selectedIndex, // no list wrap + this.flickity.selectedIndex - this.flickity.cells.length, // wrap backwards (0 -> -1) + this.flickity.cells.length - this.selectedIndex, // wrap forwards (-1 -> 0) + ].reduce((key, v) => Math.abs(v) < Math.abs(key) ? v : key) + this.selectedIndex = this.flickity.selectedIndex + this.assetIndex += increment + apiConnector.seek(increment) + } + + seekCallback() { + let i + if (this.assetIndex !== apiConnector.assetIndex) { + this.assetIndex = apiConnector.assetIndex + i = apiConnector.movement + + for (; i > 0; i--) this.flickity.next() + for (; i < 0; i++) this.flickity.previous() + this.selectedIndex = this.flickity.selectedIndex + } + + // load new imgs + // TODO need to make the 11 cells a constant somehow + for (i = 0; i < this.flickity.cells.length; i++) { + const x = (i + this.selectedIndex + 6) % this.flickity.cells.length + const e = this.flickity.cells[x].element + const img = e.firstElementChild + img.src = apiConnector.assetPreviewSrc(apiConnector.assets[i]) + } + } + + /* Flickity function for scrolling to ensure next and prev pics are always + * visible and to transition between states */ + scroll(progress) { + const normalizedProgress = progress / (1 / (this.flickity.cells.length-1)) + const liveSelectedIndex = Math.round(normalizedProgress) + const localizedProgress = normalizedProgress - liveSelectedIndex + + const prevSelectedCell = this.flickity.cells.at((liveSelectedIndex-1) % this.flickity.cells.length).element + const liveSelectedCell = this.flickity.cells.at((liveSelectedIndex ) % this.flickity.cells.length).element + const nextSelectedCell = this.flickity.cells.at((liveSelectedIndex+1) % this.flickity.cells.length).element + + const prevSelectedImage = prevSelectedCell.firstElementChild + const liveSelectedImage = liveSelectedCell.firstElementChild + const nextSelectedImage = nextSelectedCell.firstElementChild + + const prevMargin = prevSelectedCell.clientWidth - prevSelectedImage.clientWidth + const liveMargin = liveSelectedCell.clientWidth - liveSelectedImage.clientWidth + const nextMargin = nextSelectedCell.clientWidth - nextSelectedImage.clientWidth + + liveSelectedImage.style.marginLeft = liveMargin / 2 + "px" + nextSelectedImage.style.marginLeft = Math.max(0, Math.min(nextMargin, nextMargin * (localizedProgress))) + "px" + prevSelectedImage.style.marginLeft = prevMargin - Math.max(0, Math.min(prevMargin, prevMargin * localizedProgress * -1)) + "px" // TODO clean this + } + + /* jump to clicked on slide */ + staticClick(e, pointer, cellElement, cellIndex) { + this.flickity.select(cellIndex) + this.seek() + } + + /* make sure images have correct margin when loaded since scroll function + * depends on them being loaded */ + positionImageStatic(img) { + const i = parseInt(img.dataset.index) + if (i == this.flickity.selectedIndex) + img.style.marginLeft = (img.parentElement.clientWidth - img.clientWidth) / 2 + "px" + else if ((i + 1) % this.flickity.cells.length == this.flickity.selectedIndex) + img.style.marginLeft = img.parentElement.clientWidth - img.clientWidth + "px" + } + + imageLoaded(e) { this.positionImageStatic(e.target) } + initImages() { + const imgs = this.slidesContainer.querySelectorAll("#slideshow-carousel img") + for (let i = 0; i < imgs.length; i++) { + const img = imgs[i] + img.dataset.index = i + img.addEventListener("load", e => { this.imageLoaded(e) }) + if (img.complete) + this.positionImageStatic(img) + } + } +} + +export default slidesContainer => { new Slides(slidesContainer); return true } diff --git a/src/client/src/style.css b/src/client/src/style.css new file mode 100644 index 0000000..552b080 --- /dev/null +++ b/src/client/src/style.css @@ -0,0 +1,48 @@ +@import "tailwindcss"; +@source "../index.html"; + +:root { + --font-sans: "Overpass", sans-serif; + @apply scheme-dark +} + +.svg-btn { + @apply bg-none border-0 p-0 cursor-pointer +} + +.nav-btn { + @apply flex items-center justify-center no-underline w-full gap-4 p-3 rounded-full + hover:text-blue-300 hover:fill-blue-300 + data-selected:text-blue-300 data-selected:fill-blue-300 + data-selected:bg-gray-900 +} + +.carousel-cell { + @apply h-full w-[70vw] mx-3 md:w-[80vw] md:mx-6 +} +.carousel-img { + @apply align-middle h-full max-w-full object-contain +} + +.album { + @apply flex relative h-40 gap-6 p-3 cursor-pointer + border-y border-slate-800 + data-selected:bg-slate-950 data-selected:hover:bg-slate-900 + hover:bg-gray-900 +} + +.rounded-fieldset { + @apply border border-gray-500 rounded-2xl p-6 flex flex-col gap-4 +} +.fieldset-header { + @apply font-bold text-blue-300 fill-blue-300 text-xl +} +.settings-label { + @apply font-medium text-blue-200 +} +.rounded-input { + @apply rounded-2xl bg-zinc-800 p-4 +} +.rounded-btn { + @apply rounded-full w-fit bg-blue-300 px-4 py-2 text-black fill-black font-medium cursor-pointer flex gap-1 +} diff --git a/src/server/__main__.py b/src/server/__main__.py new file mode 100644 index 0000000..508a13a --- /dev/null +++ b/src/server/__main__.py @@ -0,0 +1,20 @@ +import argparse + +from .flaskapi import app, socketio +from .settings import Config +from .manager import PixMan + + +def main(): + p = argparse.ArgumentParser(formatter_class=argparse.ArgumentDefaultsHelpFormatter) + p.add_argument("--fullscreen", help="start viewer window in fullscreen", action="store_true") + p.add_argument("--config", type=str, help="set config file path", default="config.json") + p.add_argument("--host", type=str, help="set web interface host", default="0.0.0.0") + p.add_argument("--port", type=int, help="set web interface port", default=8080) + args = p.parse_args() + + PixMan.initialize(args, app, socketio) + + +if __name__ == "__main__": + main() diff --git a/src/server/flaskapi.py b/src/server/flaskapi.py new file mode 100644 index 0000000..6b910fa --- /dev/null +++ b/src/server/flaskapi.py @@ -0,0 +1,90 @@ +from flask import Flask, Blueprint, request, send_from_directory, send_file, abort, redirect, jsonify +from flask_socketio import SocketIO, emit +from flask_cors import CORS +from engineio.async_drivers import threading # For pyinstaller + +from .manager import PixMan +from .settings import Config + + +static_folder=PixMan().static_dir +app = Flask(__name__, static_folder=static_folder, static_url_path="/") +api = Blueprint("api", __name__) +socketio = SocketIO(app, async_mode="threading", cors_allowed_origins="*") # NOTE debug, async_mode for pyinstaller +CORS(api, origins="*") # NOTE debug + + +@app.route("/") +@app.route("/slideshow") +@app.route("/albums") +@app.route("/settings") +def home(): + return send_from_directory(static_folder, "index.html") + + +@socketio.on("seek") +def seek(increment): + if not (display := PixMan().display): + return {} + display.queue.put(lambda: display.seek(increment)) + while not display.queue.empty(): + pass + return { "imageIndex": display.current_texture_index } + + +@api.route("/albums/update", methods=["POST"]) +def albums_update(): + return { "success": PixMan().update_config({ "album_list": request.json }) } + +@api.route("/albums") +def albums_get(): + if not (ic := PixMan().immich_connector): + return {} + keys = [ "albumName", "albumThumbnailAssetId", "id", "startDate", "endDate", "assetCount", "shared", ] + selected_albums = PixMan().config.album_list + return [{ + key: album.get(key, None) for key in keys + } | { "selected": album["id"] in selected_albums } for album in ic.load_all_albums() if album["assetCount"] ] + + +@api.route("/asset//filename") +def get_asset_name(key): + if not (ic := PixMan().immich_connector): + return {} + # TODO ensure getting actual album thumb + name = ic.load_image_filename(key) + if name is None: + abort(400) + return { "filename": name } + + +@api.route("/asset//fullsize", defaults={ "size": "fullsize" }) +@api.route("/asset//thumbnail", defaults={ "size": "thumbnail" }) +@api.route("/asset/", defaults={ "size": "preview" }) +def get_asset(key, size): + if not (ic := PixMan().immich_connector): + return {} + # TODO ensure getting actual album thumb + image_data, mimetype = ic.load_image(key, size=size) + if image_data is None: + abort(400) + return send_file(image_data, mimetype=mimetype) + + +@api.route("/redirect/") +def immich_redirect(path): + if not (ic := PixMan().immich_connector): + return {} + return redirect(f"{ic.server_url}/{path}") + + +@api.route("/config/update", methods=["POST"]) +def config_update(): + return { "success": PixMan().update_config(request.json) } + +@api.route("/config") +def config_get(): + return jsonify(PixMan().config) + + +app.register_blueprint(api, url_prefix="/api") diff --git a/src/server/immich.py b/src/server/immich.py new file mode 100644 index 0000000..d5c5fd1 --- /dev/null +++ b/src/server/immich.py @@ -0,0 +1,64 @@ +import requests +from io import BytesIO +from queue import Queue + +from .texture import ImageTexture +from .manager import PixMan + + +class ImmichConnector: + def __init__(self): + config = PixMan().config + self.server_url = config.immich_url.removesuffix("/") + self.api_key = config.immich_api_key + self.texture_load_queue = Queue() + + def _request(self, endpoint): + if not self.server_url: + return None + return requests.get(f"{self.server_url}/api/{endpoint}", headers={ "x-api-key": self.api_key }) + + def load_all_albums(self): + response = self._request("albums") + if not response or response.status_code != 200: return + + data = response.json() + return data + + def load_album_assets(self, key): + response = self._request(f"albums/{key}") + if not response or response.status_code != 200: return + + data = response.json() + return data["assets"] + + def load_image(self, key, size="preview"): + response = self._request(f"assets/{key}/thumbnail?size={size}") + if not response or response.status_code != 200: return None, None + + image_data = BytesIO(response.content) + mimetype = response.headers.get("Content-Type") + return image_data, mimetype + + def load_image_filename(self, key): + response = self._request(f"assets/{key}") + if not response or response.status_code != 200: return None, None + + data = response.json() + return data["originalFileName"] + + def load_texture_async(self, texture_list, image_texture): + self.texture_load_queue.put((texture_list, image_texture)) + + def idle(self): + size = "preview" # TODO + while True: + texture_list, image_texture = self.texture_load_queue.get() + if not texture_list.index_in_cache_range(image_texture.asset_index) or texture_list.void: + continue # Texture was never loaded so it doesn't need to be free'd + image_data, _ = self.load_image(image_texture.asset_key, size) + image_texture.initialize(image_data) + + def validate_connection(self): + # TODO + return True diff --git a/src/server/lazycachelist.py b/src/server/lazycachelist.py new file mode 100644 index 0000000..c224a8c --- /dev/null +++ b/src/server/lazycachelist.py @@ -0,0 +1,170 @@ +from dataclasses import dataclass, asdict + +from .texture import ImageTextureImmichAsset +from .manager import PixMan + +@dataclass +class Album: + id: str + range_start: int + range_end: int + assets_list: list[str] = None + + @property + def assets_count(self): + return end - start + + +@dataclass +class CallbackStateData: + asset_index: int + movement: int + assets: list[str] + current_asset: str + + @classmethod + def from_lctl(cls, l): + si = (l.asset_index - 5) % l.asset_count + ei = (l.asset_index + 6) % l.asset_count + sa = l.assets[si:ei] if si < ei else l.assets[si:] + l.assets[:ei] + assets = [ a["id"] for a in sa ] + return cls( + asset_index=l.asset_index, + movement=l.last_movement, + assets=assets, + current_asset=assets[5], + ) + + +class LazyCachingTextureList(): + def __init__(self, album_ids, max_cache_items=100, change_callback=None): + self.immich_connector = PixMan().immich_connector + self.void = False + assert max_cache_items >= 20, "Minimum cache items is 20" # Double small radius + + # Ring buffer + self.max_cache_items = max_cache_items + self.radius_small = 10 + self.cache_items_behind = 0 + self.cache_items_ahead = 0 + self.cache_index = 0 + self.asset_index = 0 + self.asset_count = 0 + self.last_movement = 0 + + self.cached_items = 0 + + self.album_keys = album_ids + # TODO simplify album handling, dont need classes, etc. + self.albums = self._get_albums() + self.assets = self._get_album_assets() + + self.change_callback = change_callback + + @property + def max_cache_items(self): + return self.cache_length + + @max_cache_items.setter + def max_cache_items(self, max_cache_items): + self.cache_length = max_cache_items + self.cache = [None] * max_cache_items + self.radius_large = int(max_cache_items / 2) + + def free(self): + self.void = True + + def index_in_cache_range(self, index): + index_range_low = (self.asset_index - self.cache_items_behind) % self.asset_count + index_range_high = (self.asset_index + self.cache_items_ahead ) % self.asset_count + if index_range_low > index_range_high: + return index_range_low <= index or index <= index_range_high + return index_range_low <= index <= index_range_high + + def _get_albums(self): + albums = [] + self.asset_count = i = 0 + albums_info = self.immich_connector.load_all_albums() + for album_info in albums_info: + id = album_info["id"] + if id not in self.album_keys: + continue + asset_count = album_info["assetCount"] + albums.append(Album(id, i, i + asset_count)) + i += asset_count + 1 + self.asset_count += asset_count + return albums + + def _get_album_assets(self): + assets = [] + for album in self.albums: + assets += self.immich_connector.load_album_assets(album.id) + return assets + + def _fill_cache(self, current_radius, final_radius, step): + if current_radius >= final_radius: + return current_radius + + for i in range(current_radius * step, final_radius * step, step): + cache_index = (self.cache_index + i) % self.cache_length + asset_index = (self.asset_index + i) % self.asset_count + if self.cache[cache_index]: + self.cache[cache_index].free() # Since this is a ring buffer, textures outside of range can just get free'd here + asset = self.assets[asset_index] + tex = ImageTextureImmichAsset(asset, asset_index) + self.immich_connector.load_texture_async(self, tex) + self.cache[cache_index] = tex + self.cached_items += 1 + + return max(current_radius, final_radius) + + def _update_cache_get_item(self, asset_index): + prev_asset_index = self.asset_index + self.asset_index = asset_index % self.asset_count + #if prev_asset_index == asset_index: + # return self.cache[self.cache_index] + # Movement is the distance between the previous and current index in the assets list + # Since the list wraps around, fastest method is just to get the abs min of the 3 cases + movement = min( + asset_index - prev_asset_index, # No list wrap + asset_index - self.asset_count, # Wrap backwards (0 -> -1) + self.asset_count - prev_asset_index, # Wrap forwards (-1 -> 0) + key=abs) + self.last_movement = movement + self.cache_index = (self.cache_index + movement) % self.cache_length + + ahead = max(0, self.cache_items_ahead - movement) + behind = max(0, self.cache_items_behind + movement) + + if ahead + behind > self.cache_length: + if movement < 0: + ahead += movement + else: + behind -= movement + + #print("AHEAD/BEHIND/CACHE_I/ASSET_I/MOVEMENT:", ahead, behind, self.cache_index, self.asset_index, movement) + # TODO if ahead is 0 then clear queue + + ahead = self._fill_cache(ahead, self.radius_small, +1) # Fill small radius ahead of cache_index + behind = self._fill_cache(behind, self.radius_small, -1) # Fill small radius behind cache_index + ahead = self._fill_cache(ahead, self.radius_large, +1) # Fill large radius ahead of cache_index + + self.cache_items_ahead = ahead + self.cache_items_behind = behind + + # Perform callback + if prev_asset_index != asset_index and self.change_callback: + self.change_callback(asdict(CallbackStateData.from_lctl(self))) + + return self.cache[self.cache_index] + + def __len__(self): + return self.asset_count + + def __getitem__(self, index): + if not self.asset_count: + raise IndexError("Index out of bounds") + i = index % self.asset_count + if abs(index) > i: + raise IndexError("Index out of bounds") + return self._update_cache_get_item(index) diff --git a/src/server/manager.py b/src/server/manager.py new file mode 100644 index 0000000..02363b2 --- /dev/null +++ b/src/server/manager.py @@ -0,0 +1,127 @@ +import os +import sys +import copy +from threading import Thread +from pathlib import Path + + +class PixMan: + _instance = None + _initialized = False + + def __new__(cls, *args, **kwargs): + if cls._instance is None: + cls._instance = super().__new__(cls) + else: + assert not args and not kwargs, f"Singleton {cls.__name__} cannot be called with arguments more than once" + return cls._instance + + def __init__(self): + pass + + @classmethod + def initialize(cls, args, app, socketio): + assert not cls._initialized, "Already initialized" + if cls._initialized: + return + cls._initialized = True + self = cls() + + self.args = args + self.app = app + self.socketio = socketio + self.immich_connector = None + self.texture_list = None + self.display = None + self.t_flask = None + self.t_idle_download = None + + self.configfile = self.args.config + self.config = Config.load(self.configfile) if os.path.exists(self.configfile) else Config() + + self.init_web(self.args.host, self.args.port) + self.update_config(self.config, replace=True) + + def init_web(self, host, port): + self.t_flask = Thread(target=self.app.run, kwargs={ "host": host, "port": port }) + self.t_flask.start() + + def init_window(self): + # Initialize immich connector + self.immich_connector = ImmichConnector() + if not self.immich_connector.validate_connection(): + self.immich_connector = None + return + + # Initialize texture list + self.update_textures() + + # Begin downloading images + self.t_idle_download = Thread(target=self.immich_connector.idle, daemon=True) + self.t_idle_download.start() + + # Create display + self.display = PixDisplay(self.texture_list) + self.display.main(fullscreen=self.args.fullscreen) + self.die() + + def update_textures(self): + if self.texture_list: + self.texture_list.free() + change_callback = lambda d: self.socketio.emit("seek", d) + self.texture_list = LazyCachingTextureList(self.config.album_list, max_cache_items=self.config.max_cache_assets, change_callback=change_callback) + if self.display: + self.display.update_textures(self.texture_list) + + def update_config(self, config, replace=False): + oldconfig = copy.deepcopy(self.config) + if replace: + self.config = config + else: + self.config.update(**config) + + if self.display: + self.display.update_config() + + if oldconfig.album_list != self.config.album_list: + self.update_textures() + elif self.texture_list: + self.texture_list.max_cache_items = self.config.max_cache_assets + + # If all goes well + self.config.save(self.configfile) + + # Initialize window if immich parameters are valid + if self.config.immich_url and self.config.immich_api_key and not self.display: + self.init_window() + + return True + + def die(self): + # Join threads and exit + self.t_flask.join() + self.t_idle_download.join() + sys.exit(0) + + @property + def frozen(self): + # For pyinstaller + # https://api.arcade.academy/en/latest/tutorials/bundling_with_pyinstaller/index.html#handling-data-files + if getattr(sys, "frozen", False) and hasattr(sys, "_MEIPASS"): + return True + return False + + @property + def static_dir(self): + user_assets = os.environ.get("IMMICH_FRAME_STATIC_WEB_ASSETS") + if user_assets: + return Path(user_assets) + if self.frozen: + return Path(sys._MEIPASS) / "dist" + return Path("../../dist") + + +from .lazycachelist import LazyCachingTextureList +from .window import PixDisplay +from .immich import ImmichConnector +from .settings import Config diff --git a/src/server/renderer.py b/src/server/renderer.py new file mode 100644 index 0000000..52572b1 --- /dev/null +++ b/src/server/renderer.py @@ -0,0 +1,172 @@ +import pygame +import numpy as np +from OpenGL.GL import * +from typing import Protocol + +class ImageRenderer: + def __init__(self): + # Setup shader and quad + self.shader = self._init_shader() + self.vao = self._init_quad() + + # Get uniform locations from the shader + self.uTransform = glGetUniformLocation(self.shader, "uTransform") + self.uAlpha = glGetUniformLocation(self.shader, "uAlpha") + + # Use the shader program and set default texture unit to 0 + glUseProgram(self.shader) + glUniform1i(glGetUniformLocation(self.shader, "uTexture"), 0) + + # Setup transition + self.transition = None + + def set_transition(self, transition_cls): + self.transition = transition_cls(self) + + @staticmethod + def compile_shader(source, shader_type): + shader = glCreateShader(shader_type) # Create a new shader object + glShaderSource(shader, source) # Attach the shader source code + glCompileShader(shader) # Compile the shader + if not glGetShaderiv(shader, GL_COMPILE_STATUS): # Check if compilation succeeded + raise RuntimeError(glGetShaderInfoLog(shader).decode()) # Raise error with log if failed + return shader + + @staticmethod + def _init_shader(): + vertex_src = """ + #version 300 es + precision mediump float; // Precision for float variables (mandatory for ES) + layout (location = 0) in vec2 aPos; // Vertex position + layout (location = 1) in vec2 aTexCoord; // Texture coordinates + uniform mat4 uTransform; // Transformation matrix + out vec2 TexCoord; // Output texture coordinate + + void main() { + gl_Position = uTransform * vec4(aPos, 0.0, 1.0); // Apply transformation + TexCoord = aTexCoord; // Pass tex coord to fragment shader + } + """ + fragment_src = """ + #version 300 es + precision mediump float; // Precision for float variables (mandatory for ES) + in vec2 TexCoord; // Interpolated texture coordinates + out vec4 FragColor; // Final fragment color + uniform sampler2D uTexture; // Texture sampler + uniform float uAlpha; // Global alpha for transparency + + void main() { + vec4 texColor = texture(uTexture, TexCoord); // Sample texture + FragColor = vec4(texColor.rgb, texColor.a * uAlpha); // Apply alpha blending + } + """ + + # Compile and link shaders into a program + vs = ImageRenderer.compile_shader(vertex_src, GL_VERTEX_SHADER) + fs = ImageRenderer.compile_shader(fragment_src, GL_FRAGMENT_SHADER) + prog = glCreateProgram() + glAttachShader(prog, vs) + glAttachShader(prog, fs) + glLinkProgram(prog) + return prog + + @staticmethod + def _init_quad(): + # Define a full-screen quad with positions and texture coordinates + quad = np.array([ + -1, -1, 0, 0, # Bottom-left + 1, -1, 1, 0, # Bottom-right + -1, 1, 0, 1, # Top-left + 1, 1, 1, 1, # Top-right + ], dtype=np.float32) + + # Create and bind a Vertex Array Object + vao = glGenVertexArrays(1) + vbo = glGenBuffers(1) + glBindVertexArray(vao) + glBindBuffer(GL_ARRAY_BUFFER, vbo) + glBufferData(GL_ARRAY_BUFFER, quad.nbytes, quad, GL_STATIC_DRAW) + + # Setup vertex attributes: position (location = 0) + glVertexAttribPointer(0, 2, GL_FLOAT, GL_FALSE, 16, ctypes.c_void_p(0)) + glEnableVertexAttribArray(0) + + # Setup vertex attributes: texture coordinates (location = 1) + glVertexAttribPointer(1, 2, GL_FLOAT, GL_FALSE, 16, ctypes.c_void_p(8)) + glEnableVertexAttribArray(1) + return vao + + def draw_image(self, tex, win_w, win_h, alpha): + if not tex.initialized: + return + glUseProgram(self.shader) + glBindVertexArray(self.vao) + # FIXME check if tex.id is None + glBindTexture(GL_TEXTURE_2D, tex.id) + + # Calculate aspect ratios + img_aspect = tex.width / tex.height + win_aspect = win_w / win_h + + # Calculate scaling factors to preserve image aspect ratio + if img_aspect > win_aspect: + sx = 1.0 + sy = win_aspect / img_aspect + else: + sx = img_aspect / win_aspect + sy = 1.0 + + # Create transformation matrix for aspect-ratio-correct rendering + transform = np.array([ + [sx, 0, 0, 0], + [0, sy, 0, 0], + [0, 0, 1, 0], + [0, 0, 0, 1], + ], dtype=np.float32) + + # Pass transformation and alpha to the shader + glUniformMatrix4fv(self.uTransform, 1, GL_FALSE, transform) + glUniform1f(self.uAlpha, alpha) + + # Draw the textured quad + glDrawArrays(GL_TRIANGLE_STRIP, 0, 4) + + def draw_static(self, tex, win_w, win_h, alpha): + # Set the background color to black + glClearColor(0.0, 0.0, 0.0, 1.0) + glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT) + + self.draw_image(tex, win_w, win_h, alpha) + + pygame.display.flip() + + def draw_transition(self, tex_start, tex_end, win_w, win_h, delta_time, transition_time, transition_duration, reversed): + assert self.transition, "No transition has been set" + + # Set the background color to black + glClearColor(0.0, 0.0, 0.0, 1.0) + glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT) + + self.transition.draw(tex_start, tex_end, win_w, win_h, delta_time, transition_time, transition_duration, reversed) + + pygame.display.flip() + + +class Transition(Protocol): + def __init__(self, renderer): + self.renderer = renderer + + def draw(self, tex_start, tex_end, win_w, win_h, delta_time, transition_time, transition_duration, reversed): + pass + + +class TransitionMix(Transition): + def draw(self, tex_start, tex_end, win_w, win_h, delta_time, transition_time, transition_duration, reversed): + # Update alpha value for fade effect + alpha = transition_time / transition_duration + if alpha > 1.0: + alpha = 1.0 + + # Draw the images on top of one another + self.renderer.draw_image(tex_start, win_w, win_h, 1 - alpha) # TODO instead of decreasing alpha, draw transparent letterboxes + self.renderer.draw_image(tex_end, win_w, win_h, alpha) diff --git a/src/server/settings.py b/src/server/settings.py new file mode 100644 index 0000000..ce76e82 --- /dev/null +++ b/src/server/settings.py @@ -0,0 +1,32 @@ +from dataclasses import dataclass, asdict, field +import json + + +@dataclass +class Config: + # Immich server + immich_url: str = "" + immich_api_key: str = "" + # Display + image_duration: float = 10.0 + transition_duration: float = 0.5 + max_framerate: float = 30.0 + auto_transition: bool = True + display_size: str = "preview" # 'fullsize', 'preview', 'thumbnail' + # Cache + max_cache_assets: int = 100 + # Albums data + album_list: list[str] = field(default_factory=list) + + @classmethod + def load(cls, filepath): + with open(filepath, "r") as fp: + return cls(**json.load(fp)) + + def save(self, filepath): + with open(filepath, "w") as fp: + json.dump(asdict(self), fp, indent=2) + + def update(self, **config): + for key, value in config.items(): + setattr(self, key, value) diff --git a/src/server/texture.py b/src/server/texture.py new file mode 100644 index 0000000..3a56b5f --- /dev/null +++ b/src/server/texture.py @@ -0,0 +1,67 @@ +from OpenGL.GL import * +from OpenGL.GLUT import * +from OpenGL.GLU import * +from PIL import Image, ExifTags + + +class ImageTexture: + def __init__(self, image_source, exif=None): + self.id = None + img = Image.open(image_source) + self.exif = exif or self.get_exif(img) + img = self.handle_orientation(img, self.exif) + img = img.convert("RGBA") # Ensure the image is in RGBA mode + self.width = img.width + self.height = img.height + self._img_data = img.tobytes("raw", "RGBA", 0, -1) # Convert image data to bytes + self.initialized = True + + def gl_init(self): + if self.id: + return + #glPixelStorei(GL_UNPACK_ALIGNMENT, 1) + self.id = glGenTextures(1) + glBindTexture(GL_TEXTURE_2D, self.id) + glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, self.width, self.height, 0, GL_RGBA, GL_UNSIGNED_BYTE, self._img_data) + #glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img.width, img.height, 0, GL_RGB, GL_UNSIGNED_BYTE, img_data) + glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR) + glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR) + del self._img_data # No longer needed, clear mem + + #print(f"Loaded texture {self.id}") + + def free(self): + if self.id is None: + del self._img_data + else: + glBindTexture(GL_TEXTURE_2D, 0) # Unbind + glDeleteTextures([self.id]) + + @staticmethod + def get_exif(img): + return { ExifTags.TAGS[k]: v for k, v in img.getexif().items() if k in ExifTags.TAGS } + + @staticmethod + def handle_orientation(img, exif): + orientation = exif.get("Orientation", 1) if exif is not None else 1 + + if orientation == 3: return img.rotate(180, expand=True) + if orientation == 6: return img.rotate(270, expand=True) + if orientation == 8: return img.rotate( 90, expand=True) + + return img + + +class ImageTextureImmichAsset(ImageTexture): + def __init__(self, asset, asset_index): + self.initialized = False + self.asset_index = asset_index + self.asset_key = asset["id"] + self.exif = asset.get("exif", None) + + # So that free can work + self.id = None + self._img_data = None + + def initialize(self, image_source): + super().__init__(image_source, self.exif) diff --git a/src/server/window.py b/src/server/window.py new file mode 100644 index 0000000..4597c54 --- /dev/null +++ b/src/server/window.py @@ -0,0 +1,154 @@ +import pygame +from pygame.locals import * +from OpenGL.GL import * +from queue import Queue + +from .renderer import ImageRenderer, TransitionMix +from .manager import PixMan + +class PixDisplay: + def __init__(self, textures): + self.screen = None + self.last_time = 0 + self.start_time = 0 + self.image_time = 0 + self.paused = False + self.textures = textures + self.current_texture_index = 0 + self.renderer = None + self.win_w = 0 + self.win_h = 0 + + self.transition_reverse = False + self.text_prev = None + self.tex = None + + self._force_redraw = False + self.queue = Queue() + + self.update_config() + + def update_config(self): + config = PixMan().config + self.max_framerate = config.max_framerate + self.image_duration = config.image_duration + self.transition_duration = config.transition_duration + self.auto_transition = config.auto_transition + + def update_textures(self, textures): + self.textures = textures + self.current_texture_index = 0 + + def increment_texture_index(self, increment): + self.transition_reverse = increment < 0 + + self.tex_prev = self.textures[self.current_texture_index] + self.current_texture_index = (self.current_texture_index + increment) % len(self.textures) + self.tex = self.textures[self.current_texture_index] + + if not self.tex.initialized or not self.tex_prev.initialized: + return + + # Ensure textures are initialized for opengl + self.tex_prev.gl_init() + self.tex.gl_init() + + # Main display function + def display(self): + # Calculate timings + alive_time = pygame.time.get_ticks() / 1000 + delta_time = alive_time - self.last_time + self.last_time = alive_time + + if not self.tex or not self.tex.initialized or not self.tex.id: + if self.textures.asset_count > 0: + self.increment_texture_index(0) + # Draw black window if no textures are available + if not self.tex or not self.tex.id: + glClearColor(0.0, 0.0, 0.0, 1.0) + glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT) + pygame.display.flip() + return + + # Run queue events + while not self.queue.empty(): + f = self.queue.get() # Get the task and its data + f() + + # Progress image time + if not self.paused: + self.image_time += delta_time + + # Get window size + old_win_w, old_win_h = self.win_w, self.win_h + self.win_w, self.win_h = self.screen.get_size() + + # Draw static image except during a transition + if self.image_time < self.image_duration: + # Avoid unforced-redraw unless window size has changed + if self._force_redraw or self.win_w != old_win_w or self.win_h != old_win_h: + self.renderer.draw_static(self.tex, self.win_w, self.win_h, 1.0) + self._force_redraw = False + return + + # Start drawing transition once image_time >= image_duration + if self.auto_transition: + self.increment_texture_index(1) + self.auto_transition = False + + transition_time = self.image_time - self.image_duration + + self.renderer.draw_transition(self.tex_prev, self.tex, self.win_w, self.win_h, delta_time, transition_time, self.transition_duration, self.transition_reverse) + + if transition_time >= self.transition_duration: + self.image_time = 0 + self.auto_transition = True + + def seek(self, increment): + self.auto_transition = False + self.increment_texture_index(increment) + self.image_time = self.image_duration + + # Initialization and main loop + def main(self, fullscreen=False): + # Initialize the window + pygame.init() + self.screen = pygame.display.set_mode((0, 0), DOUBLEBUF | OPENGL | (FULLSCREEN if fullscreen else 0)) + pygame.mouse.set_visible(False) + + # Set up the OpenGL viewport and projection + glEnable(GL_TEXTURE_2D) + glMatrixMode(GL_PROJECTION) + glLoadIdentity() + glOrtho(-1, 1, -1, 1, -1, 1) + glMatrixMode(GL_MODELVIEW) + + # Enable alpha blending + glEnable(GL_BLEND) + glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA) + + # Setup renderer and slide timing + self.renderer = ImageRenderer() + self.renderer.set_transition(TransitionMix) + self.image_time = 0 + self.last_time = 0 + + # Run display + clock = pygame.time.Clock() + while True: + for event in pygame.event.get(): + if event.type == QUIT: + pygame.quit() + return + elif event.type == KEYDOWN: + # Quit with escape or ctrl+q + if event.key == pygame.K_ESCAPE or event.key == pygame.K_q and event.mod & pygame.KMOD_CTRL: + pygame.quit() + return + # Seek with left/right arrow + elif event.key == pygame.K_LEFT: + self.seek(-1) + elif event.key == pygame.K_RIGHT: + self.seek(+1) + self.display() + clock.tick(self.max_framerate) -- cgit v1.2.3