tasiaiso/tildefriends
1
0
Fork 0
forked from cory/tildefriends
Code Issues Pull Requests Releases Wiki Activity

Update mentions whenever attaching images or updating markdown. Also show them.

Browse Source 
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4011 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams
2022-10-16 19:05:22 +00:00
parent 3bbeec8ece
commit a37ad69c8b
2 changed files with 73 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
apps/cory/ssblit/tf-compose.js
View File

@ -11,6 +11,7 @@ class TfComposeElement extends LitElement {
users: {type: Object},
root: {type: String},
branch: {type: String},
mentions: {type: Object},
}
}
@ -21,12 +22,62 @@ class TfComposeElement extends LitElement {
this.users = {};
this.root = undefined;
this.branch = undefined;
this.mentions = {};
}
changed(event) {
let edit = this.renderRoot.getElementById('edit');
let preview = this.renderRoot.getElementById('preview');
preview.innerHTML = tfutils.markdown(edit.value);
let text = edit.value;
/* Update mentions. */
for (let match of text.matchAll(/\[([^\[]+)]\(([@&%][^\)]+)/g)) {
let name = match[1];
let link = match[2];
let balance = 0;
let bracket_end = match.index + match[1].length + '[]'.length - 1;
for (let i = bracket_end; i >= 0; i--) {
if (text.charAt(i) == ']') {
balance++;
} else if (text.charAt(i) == '[') {
balance--;
}
if (balance <= 0) {
name = text.substring(i + 1, bracket_end);
break;
}
}
if (!this.mentions[link]) {
this.mentions[link] = {
link: link,
}
}
this.mentions[link].name = name.startsWith('@') ? name.substring(1) : name;
this.mentions = Object.assign({}, this.mentions);
}
preview.innerHTML = tfutils.markdown(text);
}
add_file(file) {
let self = this;
file.arrayBuffer().then(function(buffer) {
let bin = Array.from(new Uint8Array(buffer));
return Promise.all([tfrpc.rpc.store_blob(bin), bin]);
}).then(function([id, bin]) {
self.mentions[id] = {
link: id,
name: file.name,
type: file.type,
size: bin.length,
};
self.mentions = Object.assign({}, self.mentions);
let edit = self.renderRoot.getElementById('edit');
edit.value += `\n![${file.name}](${id})`;
self.changed();
}).catch(function(e) {
alert(e.message);
});
}
paste(event) {
@ -37,16 +88,7 @@ class TfComposeElement extends LitElement {
if (!file) {
continue;
}
file.arrayBuffer().then(function(buffer) {
let bin = Array.from(new Uint8Array(buffer));
return tfrpc.rpc.store_blob(bin);
}).then(function(id) {
let edit = self.renderRoot.getElementById('edit');
edit.value += `\n![${file.name}](${id})`;
self.changed();
}).catch(function(e) {
alert(e.message);
});
self.add_file(file);
break;
}
}
@ -63,28 +105,8 @@ class TfComposeElement extends LitElement {
message.root = this.root;
message.branch = this.branch;
}
for (let match of message.text.matchAll(/\[([^\[]+)]\((@[^\)]+)/g)) {
if (!message.mentions) {
message.mentions = [];
}
let name = match[1].length;
let balance = 0;
let bracket_end = match.index + match[1].length + '[]'.length - 1;
for (let i = bracket_end; i >= 0; i--) {
if (message.text.charAt(i) == ']') {
balance++;
} else if (message.text.charAt(i) == '[') {
balance--;
}
if (balance <= 0) {
name = message.text.substring(i + 1, bracket_end - i);
break;
}
}
message.mentions.push({
link: match[2],
name: name.charAt(0) == '@' ? name.substring(1) : name,
});
if (Object.values(this.mentions).length) {
message.mentions = Object.values(this.mentions);
}
console.log('Would post:', message);
tfrpc.rpc.appendMessage(this.whoami, message).then(function() {
@ -109,15 +131,7 @@ class TfComposeElement extends LitElement {
input.type = 'file';
input.onchange = function(event) {
let file = event.target.files[0];
file.arrayBuffer().then(function(buffer) {
let bin = Array.from(new Uint8Array(buffer));
return tfrpc.rpc.store_blob(bin);
}).then(function(id) {
edit.value += `\n![${file.name}](${id})`;
self.changed();
}).catch(function(e) {
alert(e.message);
});
self.add_file(file);
};
input.click();
}
@ -132,12 +146,28 @@ class TfComposeElement extends LitElement {
tribute.attach(this.renderRoot.getElementById('edit'));
}
remove_mention(id) {
delete this.mentions[id];
this.mentions = Object.assign({}, this.mentions);
}
render_mention(mention) {
let self = this;
return html`
<div>
<pre style="white-space: pre-wrap">${JSON.stringify(mention, null, 2)}</pre>
<input type="button" value="x" @click=${() => self.remove_mention(mention.link)}></input>
</div>`;
}
render() {
let self = this;
let result = html`
<div style="display: flex; flex-direction: row; width: 100%">
<textarea id="edit" @input=${this.changed} @paste=${this.paste} style="flex: 1 0 50%"></textarea>
<div id="preview" style="flex: 1 0 50%"></div>
</div>
${Object.values(this.mentions).map(x => self.render_mention(x))}
<input type="button" value="Submit" @click=${this.submit}></input>
<input type="button" value="Attach" @click=${this.attach}></input>
<input type="button" value="Discard" @click=${this.discard}></input>