Andromeda/jank-client-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Adds a more proper infinate scroller

Browse source 
It probally does more, but I can't remember what lol
This commit is contained in:
MathMan05 2024-07-20 14:36:19 -05:00
parent d28ccb68be
commit ec6ab101c0
22 changed files with 572 additions and 430 deletions
Download patch file Download diff file Expand all files Collapse all files

128
webpage/channel.ts
View file

@ -9,6 +9,7 @@ import { Localuser } from "./localuser.js";
import { Permissions } from "./permissions.js";
import { Settings, RoleList } from "./settings.js";
import { Role } from "./role.js";
import {InfiniteScroller} from "./infiniteScroller.js"
Settings;
declare global {
interface NotificationOptions {
@ -20,7 +21,6 @@ class Channel{
type:number;
owner:Guild;
headers:Localuser["headers"];
messages:Message[];
name:string;
id:string;
parent_id:string;
@ -43,6 +43,9 @@ class Channel{
allthewayup:boolean;
static contextmenu=new Contextmenu("channel menu");
replyingto:Message;
infinate:InfiniteScroller;
idToPrev:{[key:string]:string}={};
idToNext:{[key:string]:string}={};
static setupcontextmenu(){
this.contextmenu.addbutton("Copy channel id",function(){
console.log(this)
@ -82,16 +85,45 @@ class Channel{
return order;
})
}
setUpInfinateScroller(){
const ids:{[key:string]:Function}={};
this.infinate=new InfiniteScroller(async function(id:string,offset:number){
if(offset===1){
if(this.idToPrev[id]){
return this.idToPrev[id];
}else{
await this.grabmoremessages(id);
return this.idToPrev[id];
}
}else{
return this.idToNext[id];
}
}.bind(this),
function(this:Channel,id:string){
let res:Function;
const promise=new Promise(_=>{res=_;}) as Promise<void>;
const html=this.messageids[id].buildhtml(this.messageids[this.idToPrev[id]],promise);
ids[id]=res;
return html;
}.bind(this),
async function(id:string){
ids[id]();
delete ids[id];
return true;
}.bind(this),
this.readbottom.bind(this)
);
}
constructor(JSON,owner:Guild){
if(JSON===-1){
return;
}
this.editing;
this.type=JSON.type;
this.owner=owner;
this.headers=this.owner.headers;
this.messages=[];
this.name=JSON.name;
this.id=JSON.id;
this.parent_id=JSON.parent_id;
@ -113,6 +145,7 @@ class Channel{
this.position=JSON.position;
this.lastreadmessageid=null;
this.lastmessageid=JSON.last_message_id;
this.setUpInfinateScroller();
}
isAdmin(){
return this.guild.isAdmin();
@ -495,7 +528,7 @@ class Channel{
this.myhtml.classList.add("viewChannel")
this.guild.prevchannel=this;
this.localuser.channelfocus=this;
const prom=Message.wipeChanel();
const prom=this.infinate.delete();
await this.putmessages();
await prom;
if(id!==Channel.genid){
@ -509,7 +542,7 @@ class Channel{
(document.getElementById("typebox") as HTMLInputElement).disabled=!this.canMessage;
}
async putmessages(){
if(this.messages.length>=100||this.allthewayup){return};
if(this.allthewayup){return};
const j=await fetch(this.info.api.toString()+"/channels/"+this.id+"/messages?limit=100",{
headers: this.headers,
})
@ -517,11 +550,16 @@ class Channel{
if(response.length!==100){
this.allthewayup=true;
}
let prev=undefined;
for(const thing of response){
const messager=new Message(thing,this)
if(this.messageids[messager.id]===undefined){
this.messageids[messager.id]=messager;
this.messages.push(messager);
const message=new Message(thing,this);
if(prev){
this.idToNext[message.id]=prev.id;
this.idToPrev[prev.id]=message.id;
}
prev=message;
if(this.messageids[message.id]===undefined){
this.messageids[message.id]=message;
}
}
}
@ -534,25 +572,23 @@ class Channel{
}
this.children=build;
}
async grabmoremessages(){
if(this.messages.length===0||this.allthewayup){
async grabmoremessages(id:string){
if(this.allthewayup){
return;
}
const out=this;
await fetch(this.info.api.toString()+"/channels/"+this.id+"/messages?before="+this.messages[this.messages.length-1].id+"&limit=100",{
await fetch(this.info.api.toString()+"/channels/"+this.id+"/messages?before="+id+"&limit=100",{
headers:this.headers
}).then((j)=>{return j.json()}).then(response=>{
//messages.innerHTML = '';
//response.reverse()
let next:Message;
if(response.length===0){
out.allthewayup=true;
this.allthewayup=true;
}
let previd=id;
for(const i in response){
let messager:Message;
if(!next){
messager=new Message(response[i],this)
messager=new Message(response[i],this);
}else{
messager=next;
}
@ -560,12 +596,13 @@ class Channel{
next=new Message(response[+i+1],this);
}else{
next=undefined;
console.log("ohno",+i+1)
console.log("ohno",+i+1);
}
if(out.messageids[messager.id]==undefined){
out.messageids[messager.id]=messager;
out.buildmessage(messager,next);
out.messages.push(messager);
if(this.messageids[messager.id]===undefined){
this.idToNext[messager.id]=previd;
this.idToPrev[previd]=messager.id;
previd=messager.id;
this.messageids[messager.id]=messager;
}else{
console.log("How???")
}
@ -579,37 +616,9 @@ class Channel{
document.getElementById("messages").prepend(built);
}
buildmessages(){
for(const i in this.messages){
const prev=this.messages[(+i)+1];
const built=this.messages[i].buildhtml(prev);
document.getElementById("messages").prepend(built);
if (prev) {
const prevDate=new Date(prev.timestamp);
const currentDate=new Date(this.messages[i].timestamp);
if (prevDate.toLocaleDateString() != currentDate.toLocaleDateString()) {
const dateContainer=document.createElement("div");
dateContainer.classList.add("replyflex");
const line=document.createElement("hr");
line.classList.add("reply");
dateContainer.appendChild(line);
const date=document.createElement("span");
date.textContent=currentDate.toLocaleDateString(undefined, { weekday: "long", year: "numeric", month: "long", day: "numeric" });
dateContainer.appendChild(date);
const line2=document.createElement("hr");
line2.classList.add("reply");
dateContainer.appendChild(line2);
document.getElementById("messages").prepend(dateContainer);
}
}
}
document.getElementById("messagecontainer").scrollTop = document.getElementById("messagecontainer").scrollHeight;
const messages=document.getElementById("channelw");
messages.innerHTML="";
messages.append(this.infinate.getDiv(this.lastmessageid));
}
updateChannel(JSON){
this.type=JSON.type;
@ -698,7 +707,10 @@ class Channel{
messageCreate(messagep:any):void{
if(!this.hasPermission("VIEW_CHANNEL")){return}
const messagez=new Message(messagep.d,this);
this.idToNext[this.lastmessageid]=messagez.id;
this.idToPrev[messagez.id]=this.lastmessageid;
this.lastmessageid=messagez.id;
this.messageids[messagez.id]=messagez;
if(messagez.author===this.localuser.user){
this.lastreadmessageid=messagez.id;
if(this.myhtml){
@ -710,16 +722,7 @@ class Channel{
}
}
this.guild.unreads();
this.messages.unshift(messagez);
const scrolly=document.getElementById("messagecontainer");
this.messageids[messagez.id]=messagez;
if(this.localuser.lookingguild.prevchannel===this){
var shouldScroll=scrolly.scrollTop+scrolly.clientHeight>scrolly.scrollHeight-20;
document.getElementById("messages").appendChild(messagez.buildhtml(this.messages[1]));
}
if(shouldScroll){
scrolly.scrollTop = scrolly.scrollHeight;
}
this.infinate.addedBottom();
if(messagez.author===this.localuser.user){
return;
}
@ -731,6 +734,7 @@ class Channel{
}else if(this.notification==="mentions"&&messagez.mentionsuser(this.localuser.user)){
this.notify(messagez);
}
}
notititle(message:Message):string{
return message.author.username+" > "+this.guild.properties.name+" > "+this.name;