balki/collage-maker
1
0
Fork 0
Code Issues 10 Pull Requests Packages Projects Releases Wiki Activity

frontend for get-albums

Browse Source
This commit is contained in:
Balakrishnan Balasubramanian 2024-08-03 00:38:54 -04:00
parent fa1c8e6963
commit bf6bdf9b72
2 changed files with 64 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
web/choose.html Normal file
View File

@ -0,0 +1,19 @@
<!doctype html>
<html>
<head>
<link rel="icon" href="data:;base64,iVBORw0KGgo=" />
<!-- DEVONLY --> <script src="http://localhost:35729/livereload.js"></script>
<script src="choose.js" defer></script>
</head>
<body>
<label>
<span>Select Album</span>
<select id="album_selector" size="8">
</select>
</label>
<button id="load_albums_button">Load Albums</button>
<button id="load_photos_button">Load Photos</button>
<div id="selected_photos"></div>
<div id="album_photos"></div>
</body>
</html>

45
web/choose.js Normal file
View File

@ -0,0 +1,45 @@
"use strict";
// elements
/** @type {HTMLButtonElement} */
let loadAlbumsBtn
/** @type {HTMLButtonElement} */
let loadPhotosBtn
/** @type {HTMLSelectElement} */
let albumSelect
function main() {
albumSelect = document.getElementById("album_selector")
loadAlbumsBtn = document.getElementById("load_albums_button")
loadPhotosBtn = document.getElementById("load_photos_button")
loadAlbumsBtn.onclick = () => loadAlbums()
loadPhotosBtn.onclick = () => loadPhotos()
}
function loadAlbums() {
(async () => {
const resp = await fetch("get-albums")
const albums = await resp.json()
albumSelect.replaceChildren() // This empties existing options
for(const album of albums) {
albumSelect.add(new Option(album.Title, album.UID))
}
})();
}
function loadPhotos() {
const selected = albumSelect.selectedOptions
if(selected.length != 1) {
return
}
const [elem] = selected
console.log(elem)
console.log(elem.text)
console.log(elem.value)
}
main()