get invite embeds working

webpage/embed.ts

@@ -1,7 +1,9 @@
 import{Dialog}from"./dialog.js";
 import{Message}from"./message.js";
 import{MarkDown}from"./markdown.js";
-import{ embedjson }from"./jsontypes.js";
+import{ embedjson,guildjson, invitejson }from"./jsontypes.js";
+import { getapiurls, getInstances } from "./login.js";
+import { Guild } from "./guild.js";
 
 class Embed{
 	type:string;
@@ -11,8 +13,38 @@ class Embed{
 		this.type=this.getType(json);
 		this.owner=owner;
 		this.json=json;
+		console.log(this);
 	}
 	getType(json:embedjson){
+		const instances=getInstances();
+		if(instances&&json.type==="link"&&json.url&&URL.canParse(json.url)){
+			const Url=new URL(json.url);
+			for(const instance of instances){
+				if(instance.url&&URL.canParse(instance.url)){
+					const IUrl=new URL(instance.url);
+					const params=new URLSearchParams(Url.search);
+					let host:string;
+					if(params.has("instance")){
+						const url=params.get("instance") as string;
+						if(URL.canParse(url)){
+							host=new URL(url).host;
+						}else{
+							host=Url.host;
+						}
+					}else{
+						host=Url.host;
+					}
+					if(IUrl.host===host){
+						const code=Url.pathname.split("/")[Url.pathname.split("/").length-1];
+						json.invite={
+							url:instance.url,
+							code
+						}
+						return "invite";
+					}
+				}
+			}
+		}
 		return json.type||"rich";
 	}
 	generateHTML(){
@@ -21,6 +53,8 @@ class Embed{
 			return this.generateRich();
 		case"image":
 			return this.generateImage();
+		case"invite":
+			return this.generateInvite();
 		case"link":
 			return this.generateLink();
 		case "video":
@@ -192,6 +226,106 @@ class Embed{
 		table.append(bottomtr);
 		return table;
 	}
+	invcache:[invitejson,{cdn:string,api:string}]|undefined;
+	generateInvite(){
+		if(this.invcache&&(!this.json.invite||!this.localuser)){
+			return this.generateLink();
+		}
+		const div=document.createElement("div");
+		div.classList.add("embed","inviteEmbed","flexttb");
+		const json1=this.json.invite;
+		(async ()=>{
+		let json:invitejson;
+		let info:{cdn:string,api:string};
+		if(!this.invcache){
+			if(!json1){
+				div.append(this.generateLink());
+				return;
+			}
+			const tempinfo=await getapiurls(json1.url);;
+
+			if(!tempinfo){
+				div.append(this.generateLink());
+				return;
+			}
+			info=tempinfo;
+			const res=await fetch(info.api+"/invites/"+json1.code)
+			if(!res.ok){
+				div.append(this.generateLink());
+			}
+			json=await res.json() as invitejson;
+			this.invcache=[json,info];
+		}else{
+			[json,info]=this.invcache;
+		}
+		if(!json){
+			div.append(this.generateLink());
+			return;
+		}
+		if(json.guild.banner){
+			const banner=document.createElement("img");
+			banner.src=this.localuser.info.cdn+"/icons/"+json.guild.id+"/"+json.guild.banner+".png?size=256";
+			banner.classList.add("banner");
+			div.append(banner);
+		}
+		const guild:invitejson["guild"] & {info?:{cdn:string}}=json.guild;
+		guild.info=info;
+		const icon=Guild.generateGuildIcon(guild as invitejson["guild"] & {info:{cdn:string}})
+		const iconrow=document.createElement("div");
+		iconrow.classList.add("flexltr","flexstart");
+		iconrow.append(icon);
+		{
+			const guildinfo=document.createElement("div");
+			guildinfo.classList.add("flexttb","invguildinfo");
+			const name=document.createElement("b");
+			name.textContent=guild.name;
+			guildinfo.append(name);
+
+
+			const members=document.createElement("span");
+			members.innerText="#"+json.channel.name+" • Members: "+guild.member_count
+			guildinfo.append(members);
+			members.classList.add("subtext");
+			iconrow.append(guildinfo);
+		}
+
+		div.append(iconrow);
+		const h2=document.createElement("h2");
+		h2.textContent=`You've been invited by ${json.inviter.username}`;
+		div.append(h2);
+		const button=document.createElement("button");
+		button.textContent="Accept";
+		if(this.localuser.info.api.startsWith(info.api)){
+			if(this.localuser.guildids.has(guild.id)){
+				button.textContent="Already joined";
+				button.disabled=true;
+			}
+		}
+		button.classList.add("acceptinvbutton");
+		div.append(button);
+		button.onclick=_=>{
+			if(this.localuser.info.api.startsWith(info.api)){
+				fetch(this.localuser.info.api+"/invites/"+json.code,{
+					method: "POST",
+					headers: this.localuser.headers,
+				}).then(r=>r.json()).then(_=>{
+					if(_.message){
+						alert(_.message);
+					}
+				});
+			}else{
+				if(this.json.invite){
+					const params=new URLSearchParams("");
+					params.set("instance",this.json.invite.url);
+					const encoded=params.toString();
+					const url=`${location.origin}/invite/${this.json.invite.code}?${encoded}`;
+					window.open(url,"_blank");
+				}
+			}
+		}
+		})()
+		return div;
+	}
 	generateArticle(){
 		const colordiv=document.createElement("div");
 		colordiv.style.backgroundColor="#000000";