Cleanup of old code, moved Node class, many improvements on file handling
This commit is contained in:
parent
65f8cd14a7
commit
16992db6b1
19 changed files with 485 additions and 3281 deletions
|
|
@ -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.
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue