collage-maker/web/choose.js

77 lines
1.7 KiB
JavaScript

"use strict";
// elements
/** @type {HTMLButtonElement} */
let loadAlbumsBtn
/** @type {HTMLButtonElement} */
let loadPhotosBtn
/** @type {HTMLSelectElement} */
let albumSelect
/** @type {HTMLParagraphElement} */
let noticeP
/** @type {HTMLDialogElement} */
let noticeDialog
function main() {
albumSelect = document.getElementById("album_selector")
loadAlbumsBtn = document.getElementById("load_albums_button")
loadPhotosBtn = document.getElementById("load_photos_button")
noticeDialog = document.getElementById("notice_dialog")
noticeP = document.getElementById("notice_p")
loadAlbumsBtn.onclick = () => loadAlbums()
loadPhotosBtn.onclick = () => loadPhotos()
}
function loadAlbums() {
(async () => {
try {
closeNotice()
const resp = await fetch("get-albums")
const albums = await resp.json()
if(albums.length == 0) {
showNotice("No Albums found")
return
}
albumSelect.replaceChildren() // This empties existing options
for(const album of albums) {
albumSelect.add(new Option(album.Title, album.UID))
}
} catch(e) {
console.log(e)
}
})();
}
function closeNotice() {
noticeDialog.close()
}
/**
* @param {string} notice
*/
function showNotice(notice) {
noticeP.textContent = notice
noticeDialog.show()
}
function loadPhotos() {
closeNotice()
const selected = albumSelect.selectedOptions
if(selected.length != 1) {
showNotice("Select an album to load photos")
return
}
const [elem] = selected
console.log(elem)
console.log(elem.text)
console.log(elem.value)
}
main()