got rid of message tables and fixed pre reply bug

This commit is contained in:
MathMan05
2024-07-04 17:28:22 -05:00
parent cd82bd6c26
commit 78fd7f4622
7 changed files with 170 additions and 43 deletions

View File

@@ -425,7 +425,7 @@ class Localuser {
content.textContent = "Loading..."; content.textContent = "Loading...";
const full = new Fullscreen(["html", content]); const full = new Fullscreen(["html", content]);
full.show(); full.show();
const res = await fetch(this.info.api.toString() + "/v9/discoverable-guilds?limit=16", { const res = await fetch(this.info.api.toString() + "/v9/discoverable-guilds?limit=50", {
headers: this.headers headers: this.headers
}); });
const json = await res.json(); const json = await res.json();

View File

@@ -120,6 +120,11 @@ function markdown(text, { keep = false, stdsize = false } = {}) {
build += txt[j]; build += txt[j];
} }
} }
if (stdsize) {
console.log(build);
build = build.replaceAll("\n", "");
console.log(build, JSON.stringify(build));
}
if (find === count) { if (find === count) {
appendcurrent(); appendcurrent();
i = j; i = j;
@@ -350,6 +355,50 @@ function markdown(text, { keep = false, stdsize = false } = {}) {
continue; continue;
} }
} }
if (txt[i] === "<" && txt[i + 1] === "t" && txt[i + 2] === ":") {
let found = false;
const build = ["<", "t", ":"];
let j = i + 3;
for (; txt[j] !== void 0; j++) {
build.push(txt[j]);
if (txt[j] === ">") {
found = true;
break;
}
}
if (found) {
appendcurrent();
i = j;
const parts = build.join("").match(/^<t:([0-9]{1,16})(:([tTdDfFR]))?>$/);
const dateInput = new Date(Number.parseInt(parts[1]) * 1000);
let time = "";
if (Number.isNaN(dateInput.getTime()))
time = build.join("");
else {
if (parts[3] === "d")
time = dateInput.toLocaleString(void 0, { day: "2-digit", month: "2-digit", year: "numeric" });
else if (parts[3] === "D")
time = dateInput.toLocaleString(void 0, { day: "numeric", month: "long", year: "numeric" });
else if (!parts[3] || parts[3] === "f")
time = dateInput.toLocaleString(void 0, { day: "numeric", month: "long", year: "numeric" }) + " " +
dateInput.toLocaleString(void 0, { hour: "2-digit", minute: "2-digit" });
else if (parts[3] === "F")
time = dateInput.toLocaleString(void 0, { day: "numeric", month: "long", year: "numeric", weekday: "long" }) + " " +
dateInput.toLocaleString(void 0, { hour: "2-digit", minute: "2-digit" });
else if (parts[3] === "t")
time = dateInput.toLocaleString(void 0, { hour: "2-digit", minute: "2-digit" });
else if (parts[3] === "T")
time = dateInput.toLocaleString(void 0, { hour: "2-digit", minute: "2-digit", second: "2-digit" });
else if (parts[3] === "R")
time = Math.round((Date.now() - (Number.parseInt(parts[1]) * 1000)) / 1000 / 60) + " minutes ago";
}
const timeElem = document.createElement("span");
timeElem.classList.add("markdown-timestamp");
timeElem.textContent = time;
span.appendChild(timeElem);
continue;
}
}
current.textContent += txt[i]; current.textContent += txt[i];
} }
appendcurrent(); appendcurrent();

View File

@@ -153,7 +153,8 @@ class Message {
div.classList.add("replying"); div.classList.add("replying");
} }
div.innerHTML = ""; div.innerHTML = "";
const build = document.createElement('table'); const build = document.createElement('div');
build.classList.add("flexltr");
if (this.message_reference) { if (this.message_reference) {
const replyline = document.createElement("div"); const replyline = document.createElement("div");
const line = document.createElement("hr"); const line = document.createElement("hr");
@@ -206,7 +207,8 @@ class Message {
build.classList.add("message"); build.classList.add("message");
div.appendChild(build); div.appendChild(build);
if ({ 0: true, 19: true }[this.type] || this.attachments.length !== 0) { if ({ 0: true, 19: true }[this.type] || this.attachments.length !== 0) {
const pfpRow = document.createElement('th'); const pfpRow = document.createElement('div');
pfpRow.classList.add("flexltr");
let pfpparent, current; let pfpparent, current;
if (premessage != null) { if (premessage != null) {
pfpparent ??= premessage; pfpparent ??= premessage;
@@ -227,16 +229,19 @@ class Message {
} }
pfpRow.classList.add("pfprow"); pfpRow.classList.add("pfprow");
build.appendChild(pfpRow); build.appendChild(pfpRow);
const text = document.createElement("th"); const text = document.createElement("div");
const texttxt = document.createElement("table"); text.classList.add("flexttb");
texttxt.classList.add("commentrow"); const texttxt = document.createElement("div");
texttxt.classList.add("commentrow", "flexttb");
text.appendChild(texttxt); text.appendChild(texttxt);
if (combine) { if (combine) {
const username = document.createElement("span"); const username = document.createElement("span");
username.classList.add("username"); username.classList.add("username");
this.author.bind(username, this.guild); this.author.bind(username, this.guild);
div.classList.add("topMessage");
username.textContent = this.author.username; username.textContent = this.author.username;
const userwrap = document.createElement("tr"); const userwrap = document.createElement("div");
userwrap.classList.add("flexltr");
userwrap.appendChild(username); userwrap.appendChild(username);
if (this.author.bot) { if (this.author.bot) {
const username = document.createElement("span"); const username = document.createElement("span");
@@ -250,22 +255,28 @@ class Message {
userwrap.appendChild(time); userwrap.appendChild(time);
texttxt.appendChild(userwrap); texttxt.appendChild(userwrap);
} }
else {
div.classList.remove("topMessage");
}
const messaged = markdown(this.content); const messaged = markdown(this.content);
div["txt"] = messaged; div["txt"] = messaged;
const messagedwrap = document.createElement("tr"); const messagedwrap = document.createElement("div");
messagedwrap.classList.add("flexttb");
messagedwrap.appendChild(messaged); messagedwrap.appendChild(messaged);
texttxt.appendChild(messagedwrap); texttxt.appendChild(messagedwrap);
build.appendChild(text); build.appendChild(text);
if (this.attachments.length) { if (this.attachments.length) {
console.log(this.attachments); console.log(this.attachments);
const attach = document.createElement("tr"); const attach = document.createElement("div");
attach.classList.add("flexltr");
for (const thing of this.attachments) { for (const thing of this.attachments) {
attach.appendChild(thing.getHTML()); attach.appendChild(thing.getHTML());
} }
messagedwrap.appendChild(attach); messagedwrap.appendChild(attach);
} }
if (this.embeds.length) { if (this.embeds.length) {
const embeds = document.createElement("tr"); const embeds = document.createElement("div");
embeds.classList.add("flexltr");
for (const thing of this.embeds) { for (const thing of this.embeds) {
embeds.appendChild(thing.generateHTML()); embeds.appendChild(thing.generateHTML());
} }
@@ -274,20 +285,21 @@ class Message {
// //
} }
else if (this.type === 7) { else if (this.type === 7) {
const text = document.createElement("th"); const text = document.createElement("div");
const texttxt = document.createElement("table"); text.classList.add("flexttb");
const texttxt = document.createElement("div");
text.appendChild(texttxt); text.appendChild(texttxt);
build.appendChild(text); build.appendChild(text);
texttxt.classList.add("flexltr");
const messaged = document.createElement("p"); const messaged = document.createElement("p");
div["txt"] = messaged; div["txt"] = messaged;
messaged.textContent = "welcome: " + this.author.username; messaged.textContent = "welcome: " + this.author.username;
const messagedwrap = document.createElement("tr"); texttxt.appendChild(messaged);
messagedwrap.appendChild(messaged);
const time = document.createElement("span"); const time = document.createElement("span");
time.textContent = " " + formatTime(new Date(this.timestamp)); time.textContent = " " + formatTime(new Date(this.timestamp));
time.classList.add("timestamp"); time.classList.add("timestamp");
messagedwrap.append(time); texttxt.append(time);
texttxt.appendChild(messagedwrap); div.classList.add("topMessage");
} }
div["all"] = this; div["all"] = this;
return (div); return (div);

View File

@@ -445,7 +445,7 @@ class Localuser{
const full=new Fullscreen(["html", content]); const full=new Fullscreen(["html", content]);
full.show(); full.show();
const res=await fetch(this.info.api.toString()+"/v9/discoverable-guilds?limit=16", { const res=await fetch(this.info.api.toString()+"/v9/discoverable-guilds?limit=50", {
headers: this.headers headers: this.headers
}); });
const json=await res.json(); const json=await res.json();

View File

@@ -118,6 +118,11 @@ function markdown(text : string|string[],{keep=false,stdsize=false} = {}){
build+=txt[j]; build+=txt[j];
} }
} }
if(stdsize){
console.log(build);
build=build.replaceAll("\n","");
console.log(build,JSON.stringify(build));
}
if(find===count){ if(find===count){
appendcurrent(); appendcurrent();
i=j; i=j;

View File

@@ -157,7 +157,8 @@ class Message{
div.classList.add("replying"); div.classList.add("replying");
} }
div.innerHTML=""; div.innerHTML="";
const build = document.createElement('table'); const build = document.createElement('div');
build.classList.add("flexltr");
if(this.message_reference){ if(this.message_reference){
const replyline=document.createElement("div"); const replyline=document.createElement("div");
const line=document.createElement("hr"); const line=document.createElement("hr");
@@ -213,8 +214,8 @@ class Message{
build.classList.add("message"); build.classList.add("message");
div.appendChild(build); div.appendChild(build);
if({0:true,19:true}[this.type]||this.attachments.length!==0){ if({0:true,19:true}[this.type]||this.attachments.length!==0){
const pfpRow = document.createElement('th'); const pfpRow = document.createElement('div');
pfpRow.classList.add("flexltr");
let pfpparent, current let pfpparent, current
if(premessage!=null){ if(premessage!=null){
pfpparent??=premessage; pfpparent??=premessage;
@@ -234,18 +235,19 @@ class Message{
} }
pfpRow.classList.add("pfprow") pfpRow.classList.add("pfprow")
build.appendChild(pfpRow); build.appendChild(pfpRow);
const text=document.createElement("th"); const text=document.createElement("div");
text.classList.add("flexttb")
const texttxt=document.createElement("table"); const texttxt=document.createElement("div");
texttxt.classList.add("commentrow") texttxt.classList.add("commentrow","flexttb");
text.appendChild(texttxt); text.appendChild(texttxt);
if(combine){ if(combine){
const username=document.createElement("span"); const username=document.createElement("span");
username.classList.add("username") username.classList.add("username")
this.author.bind(username,this.guild); this.author.bind(username,this.guild);
div.classList.add("topMessage");
username.textContent=this.author.username; username.textContent=this.author.username;
const userwrap=document.createElement("tr") const userwrap=document.createElement("div");
userwrap.classList.add("flexltr");
userwrap.appendChild(username) userwrap.appendChild(username)
if(this.author.bot){ if(this.author.bot){
const username=document.createElement("span"); const username=document.createElement("span");
@@ -259,24 +261,29 @@ class Message{
userwrap.appendChild(time); userwrap.appendChild(time);
texttxt.appendChild(userwrap) texttxt.appendChild(userwrap)
}else{
div.classList.remove("topMessage");
} }
const messaged=markdown(this.content); const messaged=markdown(this.content);
div["txt"]=messaged; div["txt"]=messaged;
const messagedwrap=document.createElement("tr") const messagedwrap=document.createElement("div");
messagedwrap.classList.add("flexttb")
messagedwrap.appendChild(messaged) messagedwrap.appendChild(messaged)
texttxt.appendChild(messagedwrap) texttxt.appendChild(messagedwrap)
build.appendChild(text) build.appendChild(text)
if(this.attachments.length){ if(this.attachments.length){
console.log(this.attachments) console.log(this.attachments)
const attach = document.createElement("tr") const attach = document.createElement("div");
attach.classList.add("flexltr");
for(const thing of this.attachments){ for(const thing of this.attachments){
attach.appendChild(thing.getHTML()) attach.appendChild(thing.getHTML())
} }
messagedwrap.appendChild(attach) messagedwrap.appendChild(attach)
} }
if(this.embeds.length){ if(this.embeds.length){
const embeds = document.createElement("tr") const embeds = document.createElement("div")
embeds.classList.add("flexltr");
for(const thing of this.embeds){ for(const thing of this.embeds){
embeds.appendChild(thing.generateHTML()); embeds.appendChild(thing.generateHTML());
} }
@@ -285,24 +292,23 @@ class Message{
// //
}else if(this.type===7){ }else if(this.type===7){
const text=document.createElement("th"); const text=document.createElement("div");
text.classList.add("flexttb")
const texttxt=document.createElement("table"); const texttxt=document.createElement("div");
text.appendChild(texttxt); text.appendChild(texttxt);
build.appendChild(text) build.appendChild(text);
texttxt.classList.add("flexltr");
const messaged=document.createElement("p"); const messaged=document.createElement("p");
div["txt"]=messaged; div["txt"]=messaged;
messaged.textContent="welcome: "+this.author.username; messaged.textContent="welcome: "+this.author.username;
const messagedwrap=document.createElement("tr") texttxt.appendChild(messaged);
messagedwrap.appendChild(messaged);
const time=document.createElement("span"); const time=document.createElement("span");
time.textContent=" "+formatTime(new Date(this.timestamp)); time.textContent=" "+formatTime(new Date(this.timestamp));
time.classList.add("timestamp"); time.classList.add("timestamp");
messagedwrap.append(time); texttxt.append(time);
div.classList.add("topMessage")
texttxt.appendChild(messagedwrap)
} }
div["all"]=this; div["all"]=this;
return(div) return(div)

View File

@@ -70,6 +70,10 @@ th {
max-width:100%; max-width:100%;
/* width: 9%; */ /* width: 9%; */
/* display: inline-block; */ /* display: inline-block; */
display: flex;
flex-wrap: nowrap;
flex-direction: column;
max-height: 20in;
} }
pre { pre {
background-color: var(--code-bg); background-color: var(--code-bg);
@@ -222,33 +226,38 @@ img {
.message { .message {
width: 100%; width: 100%;
flex-wrap: nowrap !important;
overflow: auto !important;
} }
.pfprow { .pfprow {
width: .5in; width: .5in;
flex-shrink: 0;
} }
.commentrow { .commentrow {
width: 100%; width: 100%;
height: 100%; height: 100%;
vertical-align: top; vertical-align: top;
word-wrap: break-word; word-wrap: break-word;
text-align: left; text-align: left;
font-weight: normal; font-weight: normal;
} }
#messagecontainer { #messagecontainer {
overflow: auto; overflow-y: auto;
display: flex; display: flex;
max-width: 100%; max-width: 100%;
flex-shrink: 1; flex-shrink: 1;
width: 100%; width: 100%;
/* flex-grow: 1; */ /* flex-grow: 1; */
overflow-x: clip;
} }
#messages { #messages {
max-width: 100%; max-width: 100%;
/* height: 100%; */ /* height: 100%; */
width: 100%;
} }
p { p {
@@ -331,7 +340,7 @@ div {
p { p {
transition: background .1s ease-in-out, color .1s ease-in-out; transition: background .1s ease-in-out, color .1s ease-in-out;
width: 100%; /* width: 100%; */
} }
.username { .username {
@@ -385,6 +394,7 @@ p {
#typediv { #typediv {
position: relative; position: relative;
/* display: flex; */ /* display: flex; */
width: 99%;
} }
.loading-indicator { .loading-indicator {
@@ -480,6 +490,7 @@ p {
.timestamp { .timestamp {
color: var(--timestamp-color); color: var(--timestamp-color);
font-size: .14in; font-size: .14in;
padding-left: .05in;
} }
.replyflex { .replyflex {
@@ -537,7 +548,22 @@ p {
width: 25vw; width: 25vw;
grid-column: 2; grid-column: 2;
} }
.replytext pre {
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 { ::-webkit-scrollbar {
width: .1in; width: .1in;
height: .1in; height: .1in;
@@ -1143,6 +1169,7 @@ span {
overflow: auto; overflow: auto;
/* margin-bottom: 1in; */ /* margin-bottom: 1in; */
/* padding-bottom: .1in; */ /* padding-bottom: .1in; */
align-items: flex-start;
} }
.settingbuttons{ .settingbuttons{
padding-top:.075in; padding-top:.075in;
@@ -1297,3 +1324,31 @@ span {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.flex{
display:flex;
h3{
width: fit-content;
}
;
}
.pfprow .pfp{
width:.4in;
height:.4in;
}
.topMessage{
padding-top:.1in
}
.messagediv .flexltr{
display:flex;
flex-wrap:wrap;
overflow:hidden !important;
max-height:100in;
}
.messagediv .flexttb{
display:flex;
overflow: hidden;
flex-wrap: wrap;
width: 100%;
flex-direction: row;
max-height:100in;
}