Convert images to webp when uploading.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4012 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2022-10-16 20:31:32 +00:00
parent a37ad69c8b
commit 16dbc7617c
2 changed files with 28 additions and 5 deletions

View File

@ -1 +1 @@
{"type":"tildefriends-app","files":{"app.js":"&XCpiJOtpMzQz5Zo+Hu9f3ppQON9PxFdV4XnS2Ae+Ye8=.sha256","lit-all.min.js":"&N4A12AsifdQgwdpII0SFtG513BfoLpmPjdJ9VTDftpg=.sha256","index.html":"&Vpp3ezlQiD5guf1P6yZhpcNMnO0u+uQoil3hNkwiIp4=.sha256","script.js":"&G8puK9Q4MngHy3D4ppcKyT49WKbHD2OCeUcAw2ghTDE=.sha256","lit-all.min.js.map":"&oFY9wO4MnujgfGNGv4VggHc5V5JwX4C8csqKZ6KJYbE=.sha256","tf-id-picker.js":"&9BDffV4HY9FqhL7XI4it+UQJB4cYwbDNsY3S1cxy2vw=.sha256","tf-app.js":"&qqpOZHnkJQevhLGPUEJ7br2S/LNH+nQtC91vz3CrYrE=.sha256","tf-message.js":"&fFCn+5+eRe552tiiESswbXVU2oEfibb+w0gzZKKGWkk=.sha256","tf-user.js":"&bXTedgBudTQLXEBPY9R8OLfQ/ZLpo8YRU9Oq/wuGG3Y=.sha256","tf-utils.js":"&N2yKZwFnb2GbPeipgQtu6xFvezENNOgud9G7EhCQ/K0=.sha256","commonmark.min.js":"&bfBaMLU19d1p/vPBF9hlARqDX002KXG/UOfxOahZhe4=.sha256","tf-compose.js":"&QTKDJcbhLICwXdBQKD1v26NziF9QnSJtcaD1vEKGaag=.sha256","emojis.json":"&h3P4pez+AI4aYdsN0dJ3pbUEFR0276t9AM20caj/W/s=.sha256","emojis.js":"&pqYLDE/13PyEt2ceeFqvnwZ8NqWfPfpDBt4vP8SeHbs=.sha256","tf-styles.js":"&Zw90HptAvGwX/vBnEhRVfNrYjMSssFnnKpp8bzwXQH0=.sha256","tf-profile.js":"&vRKjsnYvOiHCQahzEfznCvP5YDwUPtltlpWf+pxwZ1Y=.sha256","commonmark-linkify.js":"&X+hNNkmSRvKY86khyAun+cXksquXbMakZdINbGbx30g=.sha256","tf-tab-search.js":"&ESt2vMG19sH5j6ungKua/ZuvIGslyuWyb3juXdOCecg=.sha256","tf-tab-news.js":"&6ialbh/M2eBCDH6wFyoOHyDqG9QHbyIrzvRK+CgeyRc=.sha256","tf-tab-connections.js":"&jSnF/5NmgqxRze1XQAEGOW5mPzOV1/8aCyrDRZu34IQ=.sha256","tf-news.js":"&K3azL6eFcgbM9xpLHU3L5oSOApi1fXEvJZrhPkZgDpQ=.sha256","tribute.css":"&9FogMzZHKXCfGb7mlh7z+/wiNZzBsOB/tKoh6MfYJno=.sha256","tribute.esm.js":"&P1wKqCfYULpR/ahSB98JP8xaxfikuZwwtT6I/SAo7/Y=.sha256"}}
{"type":"tildefriends-app","files":{"app.js":"&XCpiJOtpMzQz5Zo+Hu9f3ppQON9PxFdV4XnS2Ae+Ye8=.sha256","lit-all.min.js":"&N4A12AsifdQgwdpII0SFtG513BfoLpmPjdJ9VTDftpg=.sha256","index.html":"&Vpp3ezlQiD5guf1P6yZhpcNMnO0u+uQoil3hNkwiIp4=.sha256","script.js":"&G8puK9Q4MngHy3D4ppcKyT49WKbHD2OCeUcAw2ghTDE=.sha256","lit-all.min.js.map":"&oFY9wO4MnujgfGNGv4VggHc5V5JwX4C8csqKZ6KJYbE=.sha256","tf-id-picker.js":"&9BDffV4HY9FqhL7XI4it+UQJB4cYwbDNsY3S1cxy2vw=.sha256","tf-app.js":"&qqpOZHnkJQevhLGPUEJ7br2S/LNH+nQtC91vz3CrYrE=.sha256","tf-message.js":"&fFCn+5+eRe552tiiESswbXVU2oEfibb+w0gzZKKGWkk=.sha256","tf-user.js":"&bXTedgBudTQLXEBPY9R8OLfQ/ZLpo8YRU9Oq/wuGG3Y=.sha256","tf-utils.js":"&N2yKZwFnb2GbPeipgQtu6xFvezENNOgud9G7EhCQ/K0=.sha256","commonmark.min.js":"&bfBaMLU19d1p/vPBF9hlARqDX002KXG/UOfxOahZhe4=.sha256","tf-compose.js":"&VfFVhkWbMD9MdljdjPbSc5R1YYAj4z9C8W2Gxij65sc=.sha256","emojis.json":"&h3P4pez+AI4aYdsN0dJ3pbUEFR0276t9AM20caj/W/s=.sha256","emojis.js":"&pqYLDE/13PyEt2ceeFqvnwZ8NqWfPfpDBt4vP8SeHbs=.sha256","tf-styles.js":"&Zw90HptAvGwX/vBnEhRVfNrYjMSssFnnKpp8bzwXQH0=.sha256","tf-profile.js":"&vRKjsnYvOiHCQahzEfznCvP5YDwUPtltlpWf+pxwZ1Y=.sha256","commonmark-linkify.js":"&X+hNNkmSRvKY86khyAun+cXksquXbMakZdINbGbx30g=.sha256","tf-tab-search.js":"&ESt2vMG19sH5j6ungKua/ZuvIGslyuWyb3juXdOCecg=.sha256","tf-tab-news.js":"&6ialbh/M2eBCDH6wFyoOHyDqG9QHbyIrzvRK+CgeyRc=.sha256","tf-tab-connections.js":"&jSnF/5NmgqxRze1XQAEGOW5mPzOV1/8aCyrDRZu34IQ=.sha256","tf-news.js":"&K3azL6eFcgbM9xpLHU3L5oSOApi1fXEvJZrhPkZgDpQ=.sha256","tribute.css":"&9FogMzZHKXCfGb7mlh7z+/wiNZzBsOB/tKoh6MfYJno=.sha256","tribute.esm.js":"&P1wKqCfYULpR/ahSB98JP8xaxfikuZwwtT6I/SAo7/Y=.sha256"}}

View File

@ -59,16 +59,39 @@ class TfComposeElement extends LitElement {
preview.innerHTML = tfutils.markdown(text);
}
convert_to_webp(buffer, type) {
return new Promise(function(resolve, reject) {
let img = new Image();
img.onload = function() {
let canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
let context = canvas.getContext('2d');
context.drawImage(img, 0, 0);
let data_url = canvas.toDataURL('image/webp');
let result = atob(data_url.split(',')[1]).split('').map(x => x.charCodeAt(0));
resolve(result);
}
img.onerror = function(event) {
reject(new Error('Failed to load image.'));
};
let raw = Array.from(new Uint8Array(buffer)).map(b => String.fromCharCode(b)).join('');
let original = `data:${type};base64,${btoa(raw)}`;
img.src = original;
});
}
add_file(file) {
let self = this;
file.arrayBuffer().then(function(buffer) {
let bin = Array.from(new Uint8Array(buffer));
return self.convert_to_webp(buffer, file.type);
}).then(function(bin) {
return Promise.all([tfrpc.rpc.store_blob(bin), bin]);
}).then(function([id, bin]) {
self.mentions[id] = {
link: id,
name: file.name,
type: file.type,
type: 'image/webp',
size: bin.length,
};
self.mentions = Object.assign({}, self.mentions);
@ -76,13 +99,13 @@ class TfComposeElement extends LitElement {
edit.value += `\n![${file.name}](${id})`;
self.changed();
}).catch(function(e) {
alert(e.message);
alert(e?.message);
});
}
paste(event) {
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();
if (!file) {