You've already forked collage-maker
							
							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()
 | 
				
			||||||
		Reference in New Issue
	
	Block a user