Cleanup of old code, moved Node class, many improvements on file handling

This commit is contained in:
Magnus Åhall 2026-06-29 10:43:21 +02:00
parent 65f8cd14a7
commit 16992db6b1
19 changed files with 485 additions and 3281 deletions

View file

@ -35,7 +35,7 @@ export class N2File extends CustomHTMLElement {
constructor() {// {{{
super(true)
this.file = null
this.streamLocalFile = false
this.uuid = null
this.addEventListener('click', event => {
@ -54,35 +54,32 @@ export class N2File extends CustomHTMLElement {
this.render()
}// }}}
openInBrowser(event) {
// this.file is only defined when file is stored in IndexedDB.
if (this.file)
openInBrowser(event) {// {{{
if (this.streamLocalFile)
window.open(
URL.createObjectURL(this.file),
`/stream-local?uuid=${this.metadata.UUID}`,
event.ctrlKey ? '_blank' : '_self',
)
else {
const jwt = localStorage.getItem('token')
window.open(
`/file/${this.uuid}?jwt=${jwt}`,
`/file/uuid/${this.uuid}?jwt=${jwt}`,
event.ctrlKey ? '_blank' : '_self',
)
}
}
}// }}}
async downloadToDisk() {// {{{
try {
// this.file is only defined when file is stored in IndexedDB.
// TODO: implement download of remote content.
if (this.file === null)
if (this.streamLocalFile === false)
throw new Error('This file is only available online. Download not implemented yet.')
const handle = await window.showSaveFilePicker({
suggestedName: this.file.name,
suggestedName: this.metadata.name,
})
const writable = await handle.createWritable()
const blobStream = this.file.stream()
const blobStream = await globalThis.nodeStore.fileSegments.getStream(this.uuid)
await blobStream.pipeTo(writable)
} catch (err) {
if (err.name == 'AbortError')
@ -101,18 +98,21 @@ export class N2File extends CustomHTMLElement {
// populateImg makes sure this returned img element exists and then populates it
// with the image from IndexedDB.
const fileUUID = src.slice(5)
this.uuid = fileUUID
const file = await globalThis.nodeStore.files.get(fileUUID)
if (file) {
this.renderLocalFile(file)
this.uuid = fileUUID
const md = await globalThis.nodeStore.filesMetadata.get(fileUUID)
if (md) {
this.metadata = md
this.streamLocalFile = true
this.renderLocalFile(md)
} else {
/* <file> can be undefined when a node is retrieved but files aren't synced.
* Try to show from server.
*
* Metadata is needed to know whether to display an image or the file representation. */
try {
const res = await API.query('GET', `/file/${fileUUID}/metadata`)
const res = await API.query('GET', `/file/uuid/${fileUUID}/metadata`)
this.renderRemoteFile(res.Metadata)
} catch (err) {
console.error(err)
@ -123,27 +123,25 @@ export class N2File extends CustomHTMLElement {
// Probably an external URL.
this.elImage.src = src
}// }}}
async renderLocalFile(file) {// {{{
this.file = file.file
if (file.file.type.startsWith('image/'))
this.elImage.src = URL.createObjectURL(file.file)
async renderLocalFile(fileMetadata) {// {{{
if (fileMetadata.type.startsWith('image/'))
this.elImage.src = `/stream-local?uuid=${fileMetadata.UUID}`
else {
// Check for and use an existing MIME type icon.
// Place them in static/images/file_icons/ and replace the slash with an underscore.
const url = `/images/${_VERSION}/file_icons/${file.file.type.replaceAll('/', '_')}.svg`
const url = `/images/${_VERSION}/file_icons/${fileMetadata.type.replaceAll('/', '_')}.svg`
const res = await fetch(url)
if (res.ok)
this.elImage.src = url
this.elFilename.innerText = file.file.name
this.elFilename.innerText = fileMetadata.name
this.elFilename.style.display = 'block'
}
}// }}}
async renderRemoteFile(md) {// {{{
if (md.Type.startsWith('image/')) {
const jwt = localStorage.getItem('token')
this.elImage.src = `/file/${md.UUID}?jwt=${jwt}`
this.elImage.src = `/file/uuid/${md.UUID}?jwt=${jwt}`
} else {
// Check for and use an existing MIME type icon.
// Place them in static/images/file_icons/ and replace the slash with an underscore.