Allow pasting non-image files into the wiki editor.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4789 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2024-01-24 02:58:53 +00:00
parent a0df336abe
commit 843e172e56
3 changed files with 23 additions and 12 deletions

View File

@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "📝", "emoji": "📝",
"previous": "&w+d5glrC/yHNrj1b6nihHNn4rpNZG5R4GuThkZ/XT6w=.sha256" "previous": "&qrcrBeaWg89ikgql9hXdr68krkg+5NZkmwTbpodEW4U=.sha256"
} }

View File

@ -292,7 +292,7 @@ class TfCollectionsAppElement extends LitElement {
<div class="toc ${self.wiki?.id === wiki.id ? 'selected' : ''}" style="white-space: nowrap; cursor: pointer" @click=${() => self.on_wiki_changed({detail: {value: wiki}})}>${wiki.name}</div> <div class="toc ${self.wiki?.id === wiki.id ? 'selected' : ''}" style="white-space: nowrap; cursor: pointer" @click=${() => self.on_wiki_changed({detail: {value: wiki}})}>${wiki.name}</div>
<ul> <ul>
${Object.values(self.wiki_docs || {}).filter(doc => doc.parent === wiki?.id).sort((x, y) => x.name.localeCompare(y.name)).map(doc => html` ${Object.values(self.wiki_docs || {}).filter(doc => doc.parent === wiki?.id).sort((x, y) => x.name.localeCompare(y.name)).map(doc => html`
<li class="toc ${self.wiki_doc?.id === doc.id ? 'selected' : ''}" style="white-space: nowrap; cursor: pointer" @click=${() => self.on_wiki_doc_changed({detail: {value: doc}})}>${doc.name}</li> <li class="toc ${self.wiki_doc?.id === doc.id ? 'selected' : ''}" style="white-space: nowrap; cursor: pointer; list-style: none; text-indent: -1rem" @click=${() => self.on_wiki_doc_changed({detail: {value: doc}})}>${doc?.private ? '🔒' : '📄'} ${doc.name}</li>
`)} `)}
</ul> </ul>
`)} `)}

View File

@ -73,7 +73,6 @@ class TfWikiDocElement extends LitElement {
thumbnail(md) { thumbnail(md) {
let m = md ? md.match(/\!\[image:[^\]]+\]\((\&.{44}\.sha256)\).*/) : undefined; let m = md ? md.match(/\!\[image:[^\]]+\]\((\&.{44}\.sha256)\).*/) : undefined;
console.log('thumb', m);
return m ? m[1] : undefined; return m ? m[1] : undefined;
} }
@ -170,11 +169,22 @@ class TfWikiDocElement extends LitElement {
}); });
} }
humanSize(value) {
let units = ['B', 'kB', 'MB', 'GB'];
let i = 0;
while (i < units.length - 1 && value >= 1024) {
value /= 1024;
i++;
}
return `${Math.round(value * 10) / 10} ${units[i]}`;
}
async add_file(editor, file) { async add_file(editor, file) {
try { try {
let self = this; let self = this;
let buffer = await file.arrayBuffer(); let buffer = await file.arrayBuffer();
let type = file.type; let type = file.type;
let insert;
if (type.startsWith('image/')) { if (type.startsWith('image/')) {
let best_buffer; let best_buffer;
let best_type; let best_type;
@ -187,12 +197,16 @@ class TfWikiDocElement extends LitElement {
} }
buffer = best_buffer; buffer = best_buffer;
type = best_type; type = best_type;
} else {
buffer = Array.from(new Uint8Array(buffer));
}
let id = await tfrpc.rpc.store_blob(buffer); let id = await tfrpc.rpc.store_blob(buffer);
let name = type.split('/')[0] + ':' + file.name; let name = type.split('/')[0] + ':' + file.name;
editor.value += `\n![${name}](${id})`; insert = `\n![${name}](${id})`;
} else {
buffer = Array.from(new Uint8Array(buffer));
let id = await tfrpc.rpc.store_blob(buffer);
let name = file.name;
insert = `\n[${name}](${id}) (${this.humanSize(buffer.length)})`;
}
document.execCommand('insertText', false, insert);
self.on_edit({srcElement: editor}); self.on_edit({srcElement: editor});
} catch(e) { } catch(e) {
alert(e?.message); alert(e?.message);
@ -202,13 +216,10 @@ class TfWikiDocElement extends LitElement {
paste(event) { paste(event) {
let self = this; let self = this;
for (let item of event.clipboardData.items) { for (let item of event.clipboardData.items) {
if (item.type?.startsWith('image/')) {
let file = item.getAsFile(); let file = item.getAsFile();
if (!file) { if (file) {
continue;
}
self.add_file(event.srcElement, file); self.add_file(event.srcElement, file);
break; event.preventDefault();
} }
} }
} }