From f6bd7423d37458d2821bcc8138c0c760622ed303 Mon Sep 17 00:00:00 2001 From: MathMan05 Date: Fri, 28 Jun 2024 14:47:07 -0500 Subject: [PATCH] fixed replies multi-lined --- .dist/embed.js | 4 ++-- .dist/localuser.js | 2 +- .dist/markdown.js | 37 ++++++++++++++++++++++------------ .dist/message.js | 2 +- webpage/embed.ts | 4 ++-- webpage/localuser.ts | 2 +- webpage/markdown.ts | 36 +++++++++++++++++++++------------ webpage/message.ts | 2 +- webpage/style.css | 47 +++++++++++++++++++++++++++++++++++++++----- 9 files changed, 97 insertions(+), 39 deletions(-) diff --git a/.dist/embed.js b/.dist/embed.js index 67cb7ea..cb0e10e 100644 --- a/.dist/embed.js +++ b/.dist/embed.js @@ -178,14 +178,14 @@ class Embed { const description = document.createElement("p"); description.textContent = this.json.description; div.append(description); - { + if (this.json.thumbnail) { const img = document.createElement("img"); img.classList.add("bigembedimg"); img.onclick = function () { const full = new Fullscreen(["img", img.src, ["fit"]]); full.show(); }; - img.src = this.json.thumbnail.proxy_url; + img.src = this.json.thumbnail.proxy_url || this.json.thumbnail.url; div.append(img); } colordiv.append(div); diff --git a/.dist/localuser.js b/.dist/localuser.js index 1973ac3..5f854cb 100644 --- a/.dist/localuser.js +++ b/.dist/localuser.js @@ -221,7 +221,7 @@ class Localuser { clearInterval(this.wsinterval); console.log('WebSocket closed'); console.warn(event); - if (event.code !== 4000 && this === this) { + if (event.code !== 4000) { this.unload(); document.getElementById("loading").classList.remove("doneloading"); document.getElementById("loading").classList.add("loading"); diff --git a/.dist/markdown.js b/.dist/markdown.js index d756a7e..9cfa553 100644 --- a/.dist/markdown.js +++ b/.dist/markdown.js @@ -1,5 +1,5 @@ export { markdown }; -function markdown(text, keep = false) { +function markdown(text, { keep = false, stdsize = false } = {}) { let txt; if ((typeof txt) === "string") { txt = text.split(""); @@ -55,17 +55,20 @@ function markdown(text, keep = false) { } if (keepys) { appendcurrent(); - if (!first) { + if (!first && !stdsize) { span.appendChild(document.createElement("br")); } const build = []; for (; txt[i] !== "\n" && txt[i] !== undefined; i++) { build.push(txt[i]); } + if (stdsize) { + element = document.createElement("span"); + } if (keep) { element.append(keepys); } - element.appendChild(markdown(build, keep)); + element.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); span.append(element); i--; continue; @@ -76,7 +79,15 @@ function markdown(text, keep = false) { } if (txt[i] === "\n") { appendcurrent(); - span.append(document.createElement("br")); + if (!stdsize) { + span.append(document.createElement("br")); + } + else { + const s = document.createElement("span"); + s.textContent = "..."; + span.append(s); + return span; + } continue; } if (txt[i] === "`") { @@ -121,7 +132,7 @@ function markdown(text, keep = false) { if (keep) { build += "`".repeat(find); } - if (count !== 3) { + if (count !== 3 && !stdsize) { const samp = document.createElement("samp"); samp.textContent = build; span.appendChild(samp); @@ -173,7 +184,7 @@ function markdown(text, keep = false) { if (keep) { i.append(stars); } - i.appendChild(markdown(build, keep)); + i.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { i.append(stars); } @@ -184,7 +195,7 @@ function markdown(text, keep = false) { if (keep) { b.append(stars); } - b.appendChild(markdown(build, keep)); + b.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { b.append(stars); } @@ -196,7 +207,7 @@ function markdown(text, keep = false) { if (keep) { b.append(stars); } - b.appendChild(markdown(build, keep)); + b.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { b.append(stars); } @@ -239,7 +250,7 @@ function markdown(text, keep = false) { if (keep) { i.append(underscores); } - i.appendChild(markdown(build, keep)); + i.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { i.append(underscores); } @@ -250,7 +261,7 @@ function markdown(text, keep = false) { if (keep) { u.append(underscores); } - u.appendChild(markdown(build, keep)); + u.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { u.append(underscores); } @@ -262,7 +273,7 @@ function markdown(text, keep = false) { if (keep) { i.append(underscores); } - i.appendChild(markdown(build, keep)); + i.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { i.append(underscores); } @@ -299,7 +310,7 @@ function markdown(text, keep = false) { if (keep) { s.append(underscores); } - s.appendChild(markdown(build, keep)); + s.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); if (keep) { s.append(underscores); } @@ -334,7 +345,7 @@ function markdown(text, keep = false) { if (keep) { j.append(underscores); } - j.appendChild(markdown(build, keep)); + j.appendChild(markdown(build, { keep: keep, stdsize: stdsize })); j.classList.add("spoiler"); j.onclick = markdown.unspoil; if (keep) { diff --git a/.dist/message.js b/.dist/message.js index f7560d7..73bbe6b 100644 --- a/.dist/message.js +++ b/.dist/message.js @@ -197,7 +197,7 @@ class Message { replyline.classList.add("replyflex"); fetch(this.info.api.toString() + "/v9/channels/" + this.message_reference.channel_id + "/messages?limit=1&around=" + this.message_reference.message_id, { headers: this.headers }).then(responce => responce.json()).then(responce => { const author = new User(responce[0].author, this.localuser); - reply.appendChild(markdown(responce[0].content)); + reply.appendChild(markdown(responce[0].content, { stdsize: true })); minipfp.src = author.getpfpsrc(); author.profileclick(minipfp); username.textContent = author.username; diff --git a/webpage/embed.ts b/webpage/embed.ts index 946a5fe..db6c1ef 100644 --- a/webpage/embed.ts +++ b/webpage/embed.ts @@ -184,14 +184,14 @@ class Embed{ description.textContent=this.json.description; div.append(description); - { + if(this.json.thumbnail){ const img=document.createElement("img"); img.classList.add("bigembedimg"); img.onclick=function(){ const full=new Fullscreen(["img",img.src,["fit"]]); full.show(); } - img.src=this.json.thumbnail.proxy_url; + img.src=this.json.thumbnail.proxy_url||this.json.thumbnail.url; div.append(img); } colordiv.append(div); diff --git a/webpage/localuser.ts b/webpage/localuser.ts index 83983df..cf09acf 100644 --- a/webpage/localuser.ts +++ b/webpage/localuser.ts @@ -229,7 +229,7 @@ class Localuser{ clearInterval(this.wsinterval); console.log('WebSocket closed'); console.warn(event); - if(event.code!==4000&&this===this){ + if(event.code!==4000){ this.unload(); document.getElementById("loading").classList.remove("doneloading"); document.getElementById("loading").classList.add("loading"); diff --git a/webpage/markdown.ts b/webpage/markdown.ts index 82aa167..f03d486 100644 --- a/webpage/markdown.ts +++ b/webpage/markdown.ts @@ -1,5 +1,5 @@ export {markdown}; -function markdown(text : string|string[],keep=false){ +function markdown(text : string|string[],{keep=false,stdsize=false} = {}){ let txt : string[]; if((typeof txt)==="string"){ txt=(text as string).split(""); @@ -53,17 +53,20 @@ function markdown(text : string|string[],keep=false){ } if(keepys){ appendcurrent(); - if(!first){ + if(!first&&!stdsize){ span.appendChild(document.createElement("br")); } const build=[]; for(;txt[i]!=="\n"&&txt[i]!==undefined;i++){ build.push(txt[i]); } + if(stdsize){ + element=document.createElement("span"); + } if(keep){ element.append(keepys); } - element.appendChild(markdown(build,keep)); + element.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); span.append(element); i--; continue; @@ -74,7 +77,14 @@ function markdown(text : string|string[],keep=false){ } if(txt[i]==="\n"){ appendcurrent(); - span.append(document.createElement("br")); + if(!stdsize){ + span.append(document.createElement("br")); + }else{ + const s=document.createElement("span"); + s.textContent="..."; + span.append(s); + return span; + } continue; } if(txt[i]==="`"){ @@ -118,7 +128,7 @@ function markdown(text : string|string[],keep=false){ if(keep){ build+="`".repeat(find); } - if(count!==3){ + if(count!==3&&!stdsize){ const samp=document.createElement("samp"); samp.textContent=build; span.appendChild(samp); @@ -169,20 +179,20 @@ function markdown(text : string|string[],keep=false){ if(count===1){ const i=document.createElement("i"); if(keep){i.append(stars)} - i.appendChild(markdown(build,keep)); + i.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){i.append(stars)} span.appendChild(i); }else if(count===2){ const b=document.createElement("b"); if(keep){b.append(stars)} - b.appendChild(markdown(build,keep)); + b.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){b.append(stars)} span.appendChild(b); }else{ const b=document.createElement("b"); const i=document.createElement("i"); if(keep){b.append(stars)} - b.appendChild(markdown(build,keep)); + b.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){b.append(stars)} i.appendChild(b); span.appendChild(i); @@ -222,20 +232,20 @@ function markdown(text : string|string[],keep=false){ if(count===1){ const i=document.createElement("i"); if(keep){i.append(underscores)} - i.appendChild(markdown(build,keep)); + i.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){i.append(underscores)} span.appendChild(i); }else if(count===2){ const u=document.createElement("u"); if(keep){u.append(underscores)} - u.appendChild(markdown(build,keep)); + u.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){u.append(underscores)} span.appendChild(u); }else{ const u=document.createElement("u"); const i=document.createElement("i"); if(keep){i.append(underscores)} - i.appendChild(markdown(build,keep)); + i.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){i.append(underscores)} u.appendChild(i) span.appendChild(u); @@ -268,7 +278,7 @@ function markdown(text : string|string[],keep=false){ if(count===2){ const s=document.createElement("s"); if(keep){s.append(underscores)} - s.appendChild(markdown(build,keep)); + s.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); if(keep){s.append(underscores)} span.appendChild(s); } @@ -298,7 +308,7 @@ function markdown(text : string|string[],keep=false){ if(count===2){ const j=document.createElement("j"); if(keep){j.append(underscores)} - j.appendChild(markdown(build,keep)); + j.appendChild(markdown(build,{keep:keep,stdsize:stdsize})); j.classList.add("spoiler"); j.onclick=markdown.unspoil; if(keep){j.append(underscores)} diff --git a/webpage/message.ts b/webpage/message.ts index c4aab7b..1df1456 100644 --- a/webpage/message.ts +++ b/webpage/message.ts @@ -202,7 +202,7 @@ class Message{ fetch(this.info.api.toString()+"/v9/channels/"+this.message_reference.channel_id+"/messages?limit=1&around="+this.message_reference.message_id,{headers:this.headers}).then(responce=>responce.json()).then(responce=>{ const author=new User(responce[0].author,this.localuser); - reply.appendChild(markdown(responce[0].content)); + reply.appendChild(markdown(responce[0].content,{stdsize:true})); minipfp.src=author.getpfpsrc() author.profileclick(minipfp) diff --git a/webpage/style.css b/webpage/style.css index 2d64f7b..2f856bb 100644 --- a/webpage/style.css +++ b/webpage/style.css @@ -57,7 +57,12 @@ th { .messagediv:hover { background-color: var(--message-bg-hover); } - +.messagediv{ + overflow: hidden; + max-width:100%; + /* width: 9%; */ + /* display: inline-block; */ +} pre { background-color: var(--code-bg); width: 100%; @@ -225,10 +230,11 @@ img { height: 100%; width: 100%; display: inline-block; + max-width: 100%; } #messages { - width: 100%; + max-width: 100%; } p { @@ -448,15 +454,25 @@ p { } .replyflex { + overflow: hidden; display: flex; align-items: center; + max-width: 100%; + flex-direction: row; + /* width: 00; */ + flex-wrap: nowrap; + justify-content: space-between; } .reply { - display: inline-block; + display: inline; vertical-align: middle; flex-grow: 1; border-color: var(--reply-border); + /* flex: 1; */ + min-width: 0px; + /* max-width: 0px; */ + /* grid-column-end: 1; */ } .startreply { @@ -477,8 +493,20 @@ p { } .replytext { - padding: .05in; + padding: 0 .05in; color: var(--reply-text); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + max-width: fit-content; + /* display: block; */ + /* flex-grow: 1; */ + flex: 1 1 auto; + width: fit-content; + min-width: 0; + /* display: inline-block !important; */ + width: 25vw; + grid-column: 2; } ::-webkit-scrollbar { @@ -765,6 +793,9 @@ input[type="checkbox"] { span { word-wrap: break-word; word-break: break-word; + /* overflow: clip; */ + /* width: 2in; */ + /* max-width: 100%; */ } #loading { @@ -987,4 +1018,10 @@ span { text-align:center; border:solid black .03in; margin-left:.025in; -} \ No newline at end of file +} +.replyflex span{ + /* display: inline-block; */ + text-overflow:ellipsis; + overflow: hidden; + max-width: 100%; +}