Call out a summary and thumbnail for wiki pages, for the purpose of using in blog posts.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4665 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2023-12-09 18:35:42 +00:00
parent deb3cfb4b6
commit 817838e522
2 changed files with 33 additions and 3 deletions

View File

@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "📝", "emoji": "📝",
"previous": "&kjbXfJac0FNZnkr+TlnKjbJOQ/Ktw5C/TWjXu/i6IWs=.sha256" "previous": "&S0BU5A5u3ltu0+QZn+wANrO/sx+nqi4vQLs2t5Rwm/I=.sha256"
} }

View File

@ -43,6 +43,29 @@ class TfWikiDocElement extends LitElement {
return writer.render(parsed); return writer.render(parsed);
} }
summary(md) {
let lines = (md || '').split('\n');
let result = [];
let have_content = false;
for (let line of lines) {
if (have_content && !line.trim().length) {
return result.join('\n');
}
if (!line.startsWith('#') && line.trim().length) {
have_content = true;
}
result.push(line);
}
return result.join('\n');
}
thumbnail(md) {
//let m = md ? md.match(/\!\[image:[^\]]+]\((\&.{44}\.sha256)\)/) : undefined;
let m = md ? md.match(/.*\((\&.{44}\.sha256)\).*/) : undefined;
console.log('thumb', m);
return m ? m[1] : undefined;
}
async load_blob() { async load_blob() {
let blob = await tfrpc.rpc.get_blob(this.value?.blob); let blob = await tfrpc.rpc.get_blob(this.value?.blob);
if (blob.endsWith('.box')) { if (blob.endsWith('.box')) {
@ -171,6 +194,7 @@ class TfWikiDocElement extends LitElement {
this.load_blob(); this.load_blob();
} }
let self = this; let self = this;
let thumbnail_ref = this.thumbnail(this.blob);
return html` return html`
<div style="display: inline-flex; flex-direction: row"> <div style="display: inline-flex; flex-direction: row">
<button ?disabled=${!this.whoami || this.is_editing} @click=${() => self.is_editing = true}>Edit</button> <button ?disabled=${!this.whoami || this.is_editing} @click=${() => self.is_editing = true}>Edit</button>
@ -187,10 +211,16 @@ class TfWikiDocElement extends LitElement {
@input=${this.on_edit} @input=${this.on_edit}
@paste=${this.paste} @paste=${this.paste}
.value=${this.blob ?? ''}></textarea> .value=${this.blob ?? ''}></textarea>
<div style="flex: 1 1">${unsafeHTML(this.markdown(this.blob))}</div> <div style="flex: 1 1">
<div ?hidden=${!this.is_editing} style="border: 1px solid #fff; border-radius: 1em; padding: 0.5em">
<img ?hidden=${!thumbnail_ref} style="max-width: 128px; max-height: 128px; float: right" src="/${thumbnail_ref}/view">
${unsafeHTML(this.markdown(this.summary(this.blob)))}
</div>
${unsafeHTML(this.markdown(this.blob))}
</div>
</div> </div>
`; `;
} }
} }
customElements.define('tf-wiki-doc', TfWikiDocElement); customElements.define('tf-wiki-doc', TfWikiDocElement);