Implement fetching photos from photoprism #19
19
web/choose.html
Normal file
19
web/choose.html
Normal 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
45
web/choose.js
Normal 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()
|
Loading…
Reference in New Issue
Block a user