init stuff
This commit is contained in:
parent
abdd9579ff
commit
54448f3a4a
18 changed files with 3199 additions and 0 deletions
73
index.js
Normal file
73
index.js
Normal file
|
@ -0,0 +1,73 @@
|
|||
const express = require('express');
|
||||
const app = express();
|
||||
|
||||
app.get('/', (req, res) => {
|
||||
res.sendfile("./webpage/index.html")
|
||||
})
|
||||
app.get('/login.json', (req, res) => {
|
||||
res.sendfile("./personaldata.json")
|
||||
})
|
||||
|
||||
app.get('/login.html', (req, res) => {
|
||||
res.sendfile("./webpage/login.html")
|
||||
})
|
||||
app.get('/dirrect.js', (req, res) => {
|
||||
res.sendfile("./webpage/dirrect.js")
|
||||
})
|
||||
app.get('/login.js', (req, res) => {
|
||||
res.sendfile("./webpage/login.js")
|
||||
})
|
||||
app.get('/bitmap.svg', (req, res) => {
|
||||
res.sendfile("./webpage/bitmap.svg")
|
||||
})
|
||||
app.get('/role.js', (req, res) => {
|
||||
res.sendfile("./webpage/role.js")
|
||||
})
|
||||
app.get('/index.js', (req, res) => {
|
||||
res.sendfile("./webpage/index.js")
|
||||
})
|
||||
app.get('/guild.js', (req, res) => {
|
||||
res.sendfile("./webpage/guild.js")
|
||||
})
|
||||
app.get('/localuser.js', (req, res) => {
|
||||
res.sendfile("./webpage/localuser.js")
|
||||
})
|
||||
app.get('/channel.js', (req, res) => {
|
||||
res.sendfile("./webpage/channel.js")
|
||||
})
|
||||
app.get('/user.js', (req, res) => {
|
||||
res.sendfile("./webpage/user.js")
|
||||
})
|
||||
app.get('/message.js', (req, res) => {
|
||||
res.sendfile("./webpage/message.js")
|
||||
})
|
||||
app.get('/member.js', (req, res) => {
|
||||
res.sendfile("./webpage/member.js")
|
||||
})
|
||||
app.get('/markdown.js', (req, res) => {
|
||||
res.sendfile("./webpage/markdown.js")
|
||||
})
|
||||
app.get('/fullscreen.js', (req, res) => {
|
||||
res.sendfile("./webpage/fullscreen.js")
|
||||
})
|
||||
app.get('/style.css', (req, res) => {
|
||||
res.sendfile("./webpage/style.css")
|
||||
})
|
||||
|
||||
app.get('/manifest.json', (req, res) => {
|
||||
res.sendfile("./webpage/manifest.json")
|
||||
})
|
||||
|
||||
app.get('/favicon.ico', (req, res) => {
|
||||
res.send("")
|
||||
})
|
||||
|
||||
app.get('/channels/*', async (req, res) => {
|
||||
res.sendfile("./webpage/index.html")
|
||||
});
|
||||
|
||||
|
||||
const PORT = 8080;
|
||||
app.listen(PORT, () => {});
|
||||
console.log("this ran :P")
|
||||
|
59
webpage/bitmap.svg
Normal file
59
webpage/bitmap.svg
Normal file
|
@ -0,0 +1,59 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="512"
|
||||
height="512"
|
||||
viewBox="0 0 135.46667 135.46667"
|
||||
version="1.1"
|
||||
id="svg1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs1" />
|
||||
<g
|
||||
id="layer1">
|
||||
<path
|
||||
style="fill:#000080;stroke-width:0.282017"
|
||||
d="M 5.306501,0.62230439 101.47237,0.09090777 125.87228,70.356052 24.382575,70.916865 -0.01732713,0.65172298 Z"
|
||||
id="path23" />
|
||||
<path
|
||||
style="fill:#000036;fill-opacity:1;stroke-width:0.282017"
|
||||
d="m 99.495684,0.40566193 1.872866,-0.20023198 24.3999,70.26514405 -7.1967,0.229649 L 94.171856,0.43508093 Z"
|
||||
id="path23-7" />
|
||||
<ellipse
|
||||
style="fill:#000000;fill-opacity:1;stroke-width:0.264583"
|
||||
id="path26-6"
|
||||
cx="74.42955"
|
||||
cy="54.083569"
|
||||
rx="7.3397198"
|
||||
ry="21.623062" />
|
||||
<ellipse
|
||||
style="fill:#000000;fill-opacity:1;stroke-width:0.264583"
|
||||
id="path26"
|
||||
cx="39.869553"
|
||||
cy="54.081467"
|
||||
rx="7.3397198"
|
||||
ry="21.623062" />
|
||||
<path
|
||||
style="fill:#000080;stroke-width:0.282017"
|
||||
d="M 15.457353,65.373696 111.62322,64.8423 136.02313,135.10744 34.533427,135.66826 10.133525,65.403115 Z"
|
||||
id="path23-2" />
|
||||
<path
|
||||
style="fill:#000034;fill-opacity:1;stroke-width:0.282017"
|
||||
d="m 37.992976,130.37618 96.165874,-0.53139 1.74646,5.69168 -101.489707,0.56082 -1.746455,-5.69169 z"
|
||||
id="path23-2-2" />
|
||||
<path
|
||||
style="fill:#000036;fill-opacity:1;stroke-width:0.282017"
|
||||
d="m 111.37573,71.044452 1.87287,-0.200232 22.77044,64.98545 -7.1967,0.22965 -22.77044,-64.985449 z"
|
||||
id="path23-7-6" />
|
||||
<path
|
||||
d="m 33.418603,65.251671 -12.46797,0.06925 a 7.3397198,21.623062 0 0 0 6.22649,10.430888 7.3397198,21.623062 0 0 0 6.24148,-10.500135 z"
|
||||
style="stroke-width:0.264583"
|
||||
id="path27" />
|
||||
<path
|
||||
d="m 55.468943,65.130232 a 7.3397198,21.623062 0 0 0 6.26835,10.623641 7.3397198,21.623062 0 0 0 6.28282,-10.693404 z"
|
||||
style="stroke-width:0.264583"
|
||||
id="path28" />
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 2.1 KiB |
383
webpage/channel.js
Normal file
383
webpage/channel.js
Normal file
|
@ -0,0 +1,383 @@
|
|||
class channel{
|
||||
constructor(JSON,owner){
|
||||
if(JSON===-1){
|
||||
return;
|
||||
}
|
||||
this.type=JSON.type;
|
||||
this.owner=owner;
|
||||
this.messages=[];
|
||||
this.name=JSON.name;
|
||||
this.id=JSON.id;
|
||||
this.parent_id=JSON.parent_id;
|
||||
this.parrent=null;
|
||||
this.children=[];
|
||||
this.guild_id=JSON.guild_id;
|
||||
this.messageids={};
|
||||
this.permission_overwrites=JSON.permission_overwrites;
|
||||
this.topic=JSON.topic;
|
||||
this.nsfw=JSON.nsfw;
|
||||
this.position=JSON.position;
|
||||
}
|
||||
get canMessage(){
|
||||
for(const thing of this.permission_overwrites){
|
||||
if(this.owner.hasRole(thing.id)&&thing.deny&(1<<11)){
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
sortchildren(){
|
||||
this.children.sort((a,b)=>{return a.position-b.position});
|
||||
}
|
||||
resolveparent(guild){
|
||||
this.parrent=guild.channelids[this.parent_id];
|
||||
this.parrent??=null;
|
||||
if(this.parrent!==null){
|
||||
this.parrent.children.push(this);
|
||||
}
|
||||
return this.parrent===null;
|
||||
}
|
||||
calculateReorder(){
|
||||
let position=-1;
|
||||
let build=[];
|
||||
for(const thing of this.children){
|
||||
const thisthing={id:thing.id}
|
||||
if(thing.position<position){
|
||||
thing.position=thisthing.position=position+1;
|
||||
}
|
||||
position=thing.position;
|
||||
if(thing.move_id&&thing.move_id!==thing.parent_id){
|
||||
thing.parent_id=thing.move_id;
|
||||
thisthing.parent_id=thing.parent_id;
|
||||
thing.move_id=undefined;
|
||||
console.log(this.owner.channelids[thisthing.parent_id]);
|
||||
}
|
||||
if(thisthing.position||thisthing.parent_id){
|
||||
build.push(thisthing);
|
||||
}
|
||||
}
|
||||
return build;
|
||||
}
|
||||
static dragged=[];
|
||||
createguildHTML(admin=false){
|
||||
const div=document.createElement("div");
|
||||
div.all=this;
|
||||
div.draggable=admin;
|
||||
div.addEventListener("dragstart",(e)=>{channel.dragged=[this,div];e.stopImmediatePropagation()})
|
||||
div.addEventListener("dragend",()=>{channel.dragged=[]})
|
||||
if(this.type===4){
|
||||
this.sortchildren();
|
||||
const caps=document.createElement("div");
|
||||
|
||||
const decdiv=document.createElement("div");
|
||||
const decoration=document.createElement("b");
|
||||
decoration.innerText="▼"
|
||||
decdiv.appendChild(decoration)
|
||||
|
||||
const myhtml=document.createElement("p2");
|
||||
myhtml.innerText=this.name;
|
||||
decdiv.appendChild(myhtml);
|
||||
caps.appendChild(decdiv);
|
||||
const childrendiv=document.createElement("div");
|
||||
if(admin){
|
||||
const addchannel=document.createElement("span");
|
||||
addchannel.innerText="+";
|
||||
addchannel.classList.add("addchannel");
|
||||
caps.appendChild(addchannel);
|
||||
addchannel.onclick=function(){
|
||||
createchannels(this.createChannel.bind(this));
|
||||
}.bind(this);
|
||||
this.coatDropDiv(decdiv,this,childrendiv);
|
||||
}
|
||||
div.appendChild(caps)
|
||||
caps.classList.add("capsflex")
|
||||
decdiv.classList.add("channeleffects");
|
||||
decdiv.classList.add("Channel");
|
||||
|
||||
lacechannel(decdiv);
|
||||
decdiv.all=this;
|
||||
|
||||
|
||||
for(const channel of this.children){
|
||||
childrendiv.appendChild(channel.createguildHTML(admin));
|
||||
}
|
||||
childrendiv.classList.add("channels");
|
||||
setTimeout(_=>{childrendiv.style.height = childrendiv.scrollHeight + 'px';},100)
|
||||
decdiv.onclick=function(){
|
||||
if(decoration.innerText==="▼"){//
|
||||
decoration.innerText="▲";
|
||||
//childrendiv.classList.add("colapsediv");
|
||||
childrendiv.style.height = '0px';
|
||||
}else{
|
||||
decoration.innerText="▼";
|
||||
//childrendiv.classList.remove("colapsediv")
|
||||
childrendiv.style.height = childrendiv.scrollHeight + 'px';
|
||||
}
|
||||
}
|
||||
div.appendChild(childrendiv);
|
||||
}else{
|
||||
div.classList.add("Channel");
|
||||
lacechannel(div);
|
||||
if(admin){this.coatDropDiv(div,this);}
|
||||
div.all=this;
|
||||
const myhtml=document.createElement("span");
|
||||
myhtml.innerText=this.name;
|
||||
if(this.type===0){
|
||||
const decoration=document.createElement("b");
|
||||
decoration.innerText="#"
|
||||
div.appendChild(decoration)
|
||||
decoration.classList.add("space");
|
||||
}else if(this.type===2){//
|
||||
const decoration=document.createElement("b");
|
||||
decoration.innerText="🕪"
|
||||
div.appendChild(decoration)
|
||||
decoration.classList.add("spacee");
|
||||
}else if(this.type===5){//
|
||||
const decoration=document.createElement("b");
|
||||
decoration.innerText="📣"
|
||||
div.appendChild(decoration)
|
||||
decoration.classList.add("spacee");
|
||||
}else{
|
||||
console.log(this.type)
|
||||
}
|
||||
div.appendChild(myhtml);
|
||||
div.myinfo=this;
|
||||
div.onclick=function(){
|
||||
this.myinfo.getHTML();
|
||||
}
|
||||
}
|
||||
return div;
|
||||
}
|
||||
coatDropDiv(div,that,container=false){
|
||||
div.addEventListener("dragenter", (event) => {
|
||||
console.log("enter")
|
||||
event.preventDefault();
|
||||
});
|
||||
|
||||
div.addEventListener("dragover", (event) => {
|
||||
event.preventDefault();
|
||||
});
|
||||
|
||||
div.addEventListener("drop", (event) => {
|
||||
const that=channel.dragged[0];
|
||||
event.preventDefault();
|
||||
if(container){
|
||||
that.move_id=this.id;
|
||||
if(that.parrent){
|
||||
that.parrent.children.splice(that.parrent.children.indexOf(that),1);
|
||||
}
|
||||
that.parrent=this;
|
||||
container.prepend(channel.dragged[1]);
|
||||
console.log(this,that)
|
||||
this.children.unshift(that);
|
||||
}else{
|
||||
console.log(this,channel.dragged);
|
||||
that.move_id=this.parent_id;
|
||||
if(that.parrent){
|
||||
that.parrent.children.splice(that.parrent.children.indexOf(that),1);
|
||||
}else{
|
||||
this.owner.headchannels.splice(this.owner.headchannels.indexOf(that),1);
|
||||
}
|
||||
that.parrent=this.parrent;
|
||||
if(that.parrent){
|
||||
const build=[];
|
||||
for(let i=0;i<that.parrent.children.length;i++){
|
||||
build.push(that.parrent.children[i])
|
||||
if(that.parrent.children[i]===this){
|
||||
build.push(that);
|
||||
}
|
||||
}
|
||||
that.parrent.children=build;
|
||||
}else{
|
||||
const build=[];
|
||||
for(let i=0;i<this.owner.headchannels.length;i++){
|
||||
build.push(this.owner.headchannels[i])
|
||||
if(this.owner.headchannels[i]===this){
|
||||
build.push(that);
|
||||
}
|
||||
}
|
||||
this.owner.headchannels=build;
|
||||
}
|
||||
div.after(channel.dragged[1]);
|
||||
}
|
||||
this.owner.calculateReorder()
|
||||
});
|
||||
|
||||
return div;
|
||||
}
|
||||
createChannel(name,type){
|
||||
fetch("https://api.old.server.spacebar.chat/api/guilds/"+this.owner.id+"/channels",{
|
||||
method:"Post",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token},
|
||||
body:JSON.stringify({
|
||||
name: name,
|
||||
type: type,
|
||||
parent_id: this.id,
|
||||
permission_overwrites:[],
|
||||
})
|
||||
})
|
||||
}
|
||||
editChannel(){
|
||||
let name=this.name;
|
||||
let topic=this.topic;
|
||||
let nsfw=this.nsfw;
|
||||
const thisid=this.id;
|
||||
const thistype=this.type;
|
||||
const full=new fullscreen(
|
||||
["hdiv",
|
||||
["vdiv",
|
||||
["textbox","Channel name:",this.name,function(){name=this.value}],
|
||||
["mdbox","Channel topic:",this.topic,function(){topic=this.value}],
|
||||
["checkbox","NSFW Channel",this.nsfw,function(){nsfw=this.checked}],
|
||||
["button","","submit",function(){
|
||||
fetch("https://api.old.server.spacebar.chat/api/v9/channels/"+thisid,{
|
||||
method:"PATCH",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token},
|
||||
body:JSON.stringify({
|
||||
"name": name,
|
||||
"type": thistype,
|
||||
"topic": topic,
|
||||
"bitrate": 64000,
|
||||
"user_limit": 0,
|
||||
"nsfw": nsfw,
|
||||
"flags": 0,
|
||||
"rate_limit_per_user": 0
|
||||
})
|
||||
})
|
||||
console.log(full)
|
||||
full.hide();
|
||||
}]
|
||||
]
|
||||
|
||||
]);
|
||||
full.show();
|
||||
console.log(full)
|
||||
}
|
||||
deleteChannel(){
|
||||
fetch("https://api.old.server.spacebar.chat/api/v9/channels/"+this.id,{
|
||||
method:"DELETE",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token}
|
||||
})
|
||||
}
|
||||
getHTML(){
|
||||
this.owner.prevchannel=this;
|
||||
this.owner.owner.channelfocus=this.id;
|
||||
this.putmessages();
|
||||
history.pushState(null, null,"/channels/"+this.guild_id+"/"+this.id);
|
||||
document.getElementById("channelname").innerText="#"+this.name;
|
||||
}
|
||||
putmessages(){
|
||||
const out=this;
|
||||
fetch("https://api.old.server.spacebar.chat/api/channels/"+this.id+"/messages?limit=100",{
|
||||
method: 'GET',
|
||||
headers: {Authorization:token},
|
||||
}).then((j)=>{return j.json()}).then(function(responce){
|
||||
messages.innerHTML = '';
|
||||
//responce.reverse()
|
||||
messagelist=[];
|
||||
for(const thing of responce){
|
||||
const messager=new cmessage(thing)
|
||||
if(out.messageids[messager.id]==undefined){
|
||||
out.messageids[messager.id]=messager;
|
||||
out.messages.push(messager);
|
||||
}
|
||||
}
|
||||
out.buildmessages();
|
||||
})
|
||||
}
|
||||
delChannel(JSON){
|
||||
const build=[];
|
||||
for(const thing of this.children){
|
||||
if(thing.id!==JSON.id){
|
||||
build.push(thing)
|
||||
}
|
||||
}
|
||||
this.children=build;
|
||||
}
|
||||
grabmoremessages(){
|
||||
if(this.messages.length===0){
|
||||
return;
|
||||
}
|
||||
const out=this;
|
||||
fetch("https://api.old.server.spacebar.chat/api/channels/"+this.id+"/messages?before="+this.messages[this.messages.length-1].id+"&limit=100",{
|
||||
method:"GET",
|
||||
headers:{Authorization:token}
|
||||
}).then((j)=>{return j.json()}).then(function(responce){
|
||||
//messages.innerHTML = '';
|
||||
//responce.reverse()
|
||||
let next
|
||||
for(const i in responce){
|
||||
let messager
|
||||
if(!next){
|
||||
messager=new cmessage(responce[i])
|
||||
}else{
|
||||
messager=next;
|
||||
}
|
||||
if(responce[+i+1]!==undefined){
|
||||
next=new cmessage(responce[+i+1]);
|
||||
}else{
|
||||
next=undefined;
|
||||
console.log("ohno",+i+1)
|
||||
}
|
||||
if(out.messageids[messager.id]==undefined){
|
||||
out.messageids[messager.id]=messager;
|
||||
out.buildmessage(messager,next);
|
||||
out.messages.push(messager);
|
||||
}else{
|
||||
console.log("How???")
|
||||
}
|
||||
}
|
||||
//out.buildmessages();
|
||||
})
|
||||
}
|
||||
buildmessage(message,next){
|
||||
const built=message.buildhtml(next);
|
||||
messages.prepend(built);
|
||||
}
|
||||
buildmessages(){
|
||||
for(const i in this.messages){
|
||||
const prev=this.messages[(+i)+1];
|
||||
const built=this.messages[i].buildhtml(prev);
|
||||
messages.prepend(built);
|
||||
}
|
||||
document.getElementById("messagecontainer").scrollTop = document.getElementById("messagecontainer").scrollHeight;
|
||||
|
||||
console.log(typebox.disabled=!this.canMessage);
|
||||
}
|
||||
updateChannel(JSON){
|
||||
this.type=JSON.type;
|
||||
this.name=JSON.name;
|
||||
this.parent_id=JSON.parent_id;
|
||||
this.parrent=null;
|
||||
this.children=[];
|
||||
this.guild_id=JSON.guild_id;
|
||||
this.messageids={};
|
||||
this.permission_overwrites=JSON.permission_overwrites;
|
||||
this.topic=JSON.topic;
|
||||
this.nsfw=JSON.nsfw;
|
||||
}
|
||||
typingstart(){
|
||||
if(this.typing>new Date().getTime()){
|
||||
return;
|
||||
}
|
||||
this.typing=new Date().getTime()+6000;
|
||||
fetch("https://api.old.server.spacebar.chat/api/channels/"+this.id+"/typing",{
|
||||
method:"POST",
|
||||
headers:{Authorization:token}
|
||||
})
|
||||
}
|
||||
messageCreate(messagep,focus){
|
||||
const messagez=new cmessage(messagep.d);
|
||||
this.messages.unshift(messagez);
|
||||
const scrolly=document.getElementById("messagecontainer");
|
||||
this.messageids[messagez.id]=messagez;
|
||||
if(this.owner.owner.lookingguild.prevchannel===this){
|
||||
var shouldScroll=scrolly.scrollTop+scrolly.clientHeight>scrolly.scrollHeight-20;
|
||||
messages.appendChild(messagez.buildhtml(this.messages[1]));
|
||||
}
|
||||
if(shouldScroll){
|
||||
scrolly.scrollTop = scrolly.scrollHeight;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
83
webpage/dirrect.js
Normal file
83
webpage/dirrect.js
Normal file
|
@ -0,0 +1,83 @@
|
|||
class dirrect extends guild{
|
||||
constructor(JSON,owner){
|
||||
super(-1);
|
||||
console.log(JSON);
|
||||
this.owner=owner;
|
||||
this.owner??=thisuser;
|
||||
this.channels=[];
|
||||
this.channelids={};
|
||||
this.id="@me";
|
||||
this.properties={};
|
||||
this.roles=[];
|
||||
this.roleids={};
|
||||
this.prevchannel=undefined;
|
||||
this.properties.name="Dirrect Messages";
|
||||
for(const thing of JSON){
|
||||
const temp=new group(thing,this);
|
||||
this.channels.push(temp);
|
||||
this.channelids[temp.id]=temp;
|
||||
}
|
||||
this.headchannels=this.channels;
|
||||
}
|
||||
createChannelpac(JSON){
|
||||
const thischannel=new group(JSON,owner);
|
||||
this.channelids[JSON.id]=thischannel;
|
||||
this.channels.push(thischannel);
|
||||
this.calculateReorder();
|
||||
this.printServers();
|
||||
}
|
||||
giveMember(member){
|
||||
console.error("not a real guild, can't give member object")
|
||||
}
|
||||
getRole(ID){
|
||||
return null;
|
||||
}
|
||||
hasRole(r){
|
||||
return false;
|
||||
}
|
||||
isAdmin(){
|
||||
return false;
|
||||
}
|
||||
}
|
||||
class group extends channel{
|
||||
constructor(JSON,owner){
|
||||
super(-1);
|
||||
this.owner=owner;
|
||||
this.messages=[];
|
||||
console.log(JSON.recipients,JSON)
|
||||
this.name=JSON.recipients[0]?.username;
|
||||
if(JSON.recipients[0]){
|
||||
this.user=new user(JSON.recipients[0]);
|
||||
}else{
|
||||
this.user=this.owner.owner.user;
|
||||
}
|
||||
this.name??=owner.owner.user.username;
|
||||
this.id=JSON.id;
|
||||
this.parent_id=null;
|
||||
this.parrent=null;
|
||||
this.children=[];
|
||||
this.guild_id="@me";
|
||||
this.messageids={};
|
||||
this.permission_overwrites=[];
|
||||
}
|
||||
createguildHTML(){
|
||||
const div=document.createElement("div")
|
||||
div.classList.add("channeleffects");
|
||||
const myhtml=document.createElement("span");
|
||||
myhtml.innerText=this.name;
|
||||
div.appendChild(this.user.buildpfp());
|
||||
div.appendChild(myhtml);
|
||||
div.myinfo=this;
|
||||
div.onclick=function(){
|
||||
this.myinfo.getHTML();
|
||||
}
|
||||
return div;
|
||||
}
|
||||
getHTML(){
|
||||
this.owner.prevchannel=this;
|
||||
this.owner.owner.channelfocus=this.id;
|
||||
this.putmessages();
|
||||
history.pushState(null, null,"/channels/"+this.guild_id+"/"+this.id);
|
||||
document.getElementById("channelname").innerText="@"+this.name;
|
||||
}
|
||||
}
|
175
webpage/fullscreen.js
Normal file
175
webpage/fullscreen.js
Normal file
|
@ -0,0 +1,175 @@
|
|||
class fullscreen{
|
||||
constructor(layout,onclose=_=>{},onopen=_=>{}){
|
||||
this.layout=layout;
|
||||
this.onclose=onclose;
|
||||
this.onopen=onopen;
|
||||
const div=document.createElement("div");
|
||||
div.appendChild(this.tohtml(layout))
|
||||
this.html=div;
|
||||
this.html.classList.add("centeritem");
|
||||
if(!(layout[0]==="img")){
|
||||
|
||||
this.html.classList.add("nonimagecenter");
|
||||
}
|
||||
}
|
||||
tohtml(array){
|
||||
switch(array[0]){
|
||||
case "img":
|
||||
const img=document.createElement("img");
|
||||
img.src=array[1];
|
||||
if(array[2]!=undefined){
|
||||
if(array[2].length==2){
|
||||
img.width=array[2][0];
|
||||
img.height=array[2][1];
|
||||
}else if(array[2][0]=="fit"){
|
||||
img.classList.add("imgfit")
|
||||
}
|
||||
}
|
||||
return img;
|
||||
case "hdiv":
|
||||
const hdiv=document.createElement("table");
|
||||
const tr=document.createElement("tr");
|
||||
hdiv.appendChild(tr)
|
||||
|
||||
for(const thing of array){
|
||||
if(thing==="hdiv"){continue;}
|
||||
const td=document.createElement("td");
|
||||
td.appendChild(this.tohtml(thing));
|
||||
tr.appendChild(td);
|
||||
}
|
||||
return hdiv;
|
||||
case "vdiv":
|
||||
const vdiv=document.createElement("table");
|
||||
for(const thing of array){
|
||||
if(thing==="vdiv"){continue;}
|
||||
const tr=document.createElement("tr");
|
||||
tr.appendChild(this.tohtml(thing));
|
||||
vdiv.appendChild(tr);
|
||||
}
|
||||
return vdiv;
|
||||
case "checkbox":
|
||||
{
|
||||
const div=document.createElement("div");
|
||||
const checkbox = document.createElement('input');
|
||||
div.appendChild(checkbox)
|
||||
const label=document.createElement("span");
|
||||
checkbox.value=array[2];
|
||||
label.innerText=array[1];
|
||||
div.appendChild(label);
|
||||
checkbox.addEventListener("change",array[3]);
|
||||
checkbox.type = "checkbox";
|
||||
return div;
|
||||
}
|
||||
case "button":
|
||||
{
|
||||
const div=document.createElement("div");
|
||||
const input = document.createElement('button');
|
||||
|
||||
const label=document.createElement("span");
|
||||
input.innerText=array[2];
|
||||
label.innerText=array[1];
|
||||
div.appendChild(label);
|
||||
div.appendChild(input)
|
||||
input.addEventListener("click",array[3]);
|
||||
return div;
|
||||
}
|
||||
case "mdbox":
|
||||
{
|
||||
const div=document.createElement("div");
|
||||
const input=document.createElement("textarea");
|
||||
input.value=array[2];
|
||||
const label=document.createElement("span");
|
||||
label.innerText=array[1];
|
||||
input.addEventListener("input",array[3]);
|
||||
div.appendChild(label);
|
||||
div.appendChild(document.createElement("br"));
|
||||
div.appendChild(input);
|
||||
return div;
|
||||
}
|
||||
case "textbox":
|
||||
{
|
||||
const div=document.createElement("div");
|
||||
const input=document.createElement("input");
|
||||
input.value=array[2];
|
||||
input.type="text";
|
||||
const label=document.createElement("span");
|
||||
label.innerText=array[1];
|
||||
console.log(array[3])
|
||||
input.addEventListener("input",array[3]);
|
||||
div.appendChild(label);
|
||||
div.appendChild(input);
|
||||
return div;
|
||||
}
|
||||
case "fileupload":
|
||||
{
|
||||
const div=document.createElement("div");
|
||||
const input=document.createElement("input");
|
||||
input.type="file";
|
||||
const label=document.createElement("span");
|
||||
label.innerText=array[1];
|
||||
div.appendChild(label);
|
||||
div.appendChild(input);
|
||||
input.addEventListener("change",array[2]);
|
||||
console.log(array)
|
||||
return div;
|
||||
}
|
||||
case "radio":{
|
||||
const div=document.createElement("div");
|
||||
const fieldset=document.createElement("fieldset");
|
||||
fieldset.addEventListener("change",function(){
|
||||
let i=-1;
|
||||
for(const thing of fieldset.children){
|
||||
i++;
|
||||
if(i===0){
|
||||
continue;
|
||||
}
|
||||
if(thing.children[0].children[0].checked){
|
||||
array[3](thing.children[0].children[0].value);
|
||||
}
|
||||
}
|
||||
});
|
||||
const legend=document.createElement("legend");
|
||||
legend.innerText=array[1];
|
||||
fieldset.appendChild(legend);
|
||||
for(const thing of array[2]){
|
||||
const div=document.createElement("div");
|
||||
const input=document.createElement("input");
|
||||
input.classList.add("radio")
|
||||
input.type="radio";
|
||||
input.name=array[1];
|
||||
input.value=thing;
|
||||
|
||||
const label=document.createElement("label");
|
||||
|
||||
label.appendChild(input);
|
||||
const span=document.createElement("span");
|
||||
span.innerText=thing;
|
||||
label.appendChild(span);
|
||||
div.appendChild(label);
|
||||
fieldset.appendChild(div);
|
||||
}
|
||||
div.appendChild(fieldset);
|
||||
return div;
|
||||
}
|
||||
case "html":{
|
||||
return array[1];
|
||||
}
|
||||
default:
|
||||
console.error("can't find element:"+array[0]," full element:"+array)
|
||||
return;
|
||||
}
|
||||
}
|
||||
show(){
|
||||
this.onopen();
|
||||
console.log("fullscreen")
|
||||
this.background=document.createElement("div");
|
||||
this.background.classList.add("background");
|
||||
document.body.appendChild(this.background);
|
||||
document.body.appendChild(this.html);
|
||||
this.background.onclick = function(){this.hide();}.bind(this);
|
||||
}
|
||||
hide(){
|
||||
document.body.removeChild(this.background);
|
||||
document.body.removeChild(this.html);
|
||||
}
|
||||
}
|
198
webpage/guild.js
Normal file
198
webpage/guild.js
Normal file
|
@ -0,0 +1,198 @@
|
|||
class guild{
|
||||
constructor(JSON,owner){
|
||||
if(JSON===-1){
|
||||
return;
|
||||
}
|
||||
console.log(JSON);
|
||||
this.owner=owner;
|
||||
this.owner??=thisuser;
|
||||
this.channels=[];
|
||||
this.channelids={};
|
||||
this.id=JSON.id;
|
||||
this.properties=JSON.properties;
|
||||
this.roles=[];
|
||||
this.roleids={};
|
||||
this.prevchannel=undefined;
|
||||
for(const roley of JSON.roles){
|
||||
const roleh=new role(roley);
|
||||
this.roles.push(roleh)
|
||||
this.roleids[roleh.id]=roleh;
|
||||
}
|
||||
for(const thing of JSON.channels){
|
||||
const temp=new channel(thing,this);
|
||||
this.channels.push(temp);
|
||||
this.channelids[temp.id]=temp;
|
||||
}
|
||||
this.headchannels=[];
|
||||
for(const thing of this.channels){
|
||||
if(thing.resolveparent(this)){
|
||||
this.headchannels.push(thing);
|
||||
}
|
||||
}
|
||||
}
|
||||
printServers(){
|
||||
let build=""
|
||||
for(const thing of this.headchannels){
|
||||
build+=(thing.name+":"+thing.position)+"\n";
|
||||
for(const thingy of thing.children){
|
||||
build+=(" "+thingy.name+":"+thingy.position)+"\n";
|
||||
}
|
||||
}
|
||||
console.log(build);
|
||||
}
|
||||
calculateReorder(){
|
||||
let position=-1;
|
||||
let build=[];
|
||||
for(const thing of this.headchannels){
|
||||
const thisthing={id:thing.id}
|
||||
if(thing.position<=position){
|
||||
thing.position=(thisthing.position=position+1);
|
||||
}
|
||||
position=thing.position;
|
||||
console.log(position);
|
||||
if(thing.move_id&&thing.move_id!==thing.parent_id){
|
||||
thing.parent_id=thing.move_id;
|
||||
thisthing.parent_id=thing.parent_id;
|
||||
thing.move_id=undefined;
|
||||
}
|
||||
if(thisthing.position||thisthing.parent_id){
|
||||
build.push(thisthing);
|
||||
console.log(this.channelids[thisthing.parent_id]);
|
||||
}
|
||||
if(thing.children.length>0){
|
||||
const things=thing.calculateReorder()
|
||||
for(const thing of things){
|
||||
build.push(thing);
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(build)
|
||||
this.printServers();
|
||||
if(build.length===0){return}
|
||||
const serverbug=false;
|
||||
if(serverbug){
|
||||
for(const thing of build){
|
||||
console.log(build,thing)
|
||||
fetch("https://api.old.server.spacebar.chat/api/v9/guilds/"+this.id+"/channels",{
|
||||
method:"PATCH",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token},
|
||||
body:JSON.stringify([thing])
|
||||
});
|
||||
}
|
||||
}else{
|
||||
fetch("https://api.old.server.spacebar.chat/api/v9/guilds/"+this.id+"/channels",{
|
||||
method:"PATCH",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token},
|
||||
body:JSON.stringify(build)
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
loadChannel(id){
|
||||
this.owner.channelfocus=id;
|
||||
this.channelids[id].getHTML();
|
||||
}
|
||||
getHTML(){
|
||||
//this.printServers();
|
||||
this.headchannels.sort((a,b)=>{return a.position-b.position;});
|
||||
this.printServers();
|
||||
console.log("html")
|
||||
const build=document.createElement("div");
|
||||
for(const thing of this.headchannels){
|
||||
build.appendChild(thing.createguildHTML(this.isAdmin()));
|
||||
}
|
||||
return build;
|
||||
}
|
||||
isAdmin(){
|
||||
return this.member.isAdmin()
|
||||
}
|
||||
fillMember(member){
|
||||
member.guild=this;
|
||||
const realroles=[];
|
||||
for(const thing of member.roles){
|
||||
realroles.push(this.getRole(thing));
|
||||
}
|
||||
member.guild=this;
|
||||
member.roles=realroles;
|
||||
return member;
|
||||
}
|
||||
giveMember(member){
|
||||
this.fillMember(member);
|
||||
this.member=member;
|
||||
}
|
||||
getRole(ID){
|
||||
return this.roleids[ID];
|
||||
}
|
||||
hasRole(r){
|
||||
console.log(typeof r,(typeof ""));
|
||||
if((typeof r)!==(typeof "")){
|
||||
r=r.id;
|
||||
}
|
||||
return this.member.hasRole(r);
|
||||
}
|
||||
loadChannel(ID){
|
||||
if(ID){
|
||||
this.channelids[ID].getHTML();
|
||||
return;
|
||||
}
|
||||
if(this.prevchannel){
|
||||
console.log(this.prevchannel)
|
||||
this.prevchannel.getHTML();
|
||||
return;
|
||||
}
|
||||
for(const thing of this.channels){
|
||||
if(thing.children.length===0){
|
||||
thing.getHTML();
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
loadGuild(){
|
||||
this.owner.loadGuild(this.id);
|
||||
}
|
||||
updateChannel(JSON){
|
||||
this.channelids[JSON.id].updateChannel(JSON);
|
||||
this.headchannels=[];
|
||||
for(const thing of this.channels){
|
||||
thing.children=[];
|
||||
}
|
||||
for(const thing of this.channels){
|
||||
if(thing.resolveparent(this)){
|
||||
this.headchannels.push(thing);
|
||||
}
|
||||
}
|
||||
this.printServers();
|
||||
}
|
||||
createChannelpac(JSON){
|
||||
const thischannel=new channel(JSON,this);
|
||||
this.channelids[JSON.id]=thischannel;
|
||||
this.channels.push(thischannel);
|
||||
thischannel.resolveparent(this);
|
||||
if(!thischannel.parrent){
|
||||
this.headchannels.push(thischannel);
|
||||
}
|
||||
this.calculateReorder();
|
||||
this.printServers();
|
||||
}
|
||||
delChannel(JSON){
|
||||
delete this.channelids[JSON.id];
|
||||
const build=[];
|
||||
for(const thing of this.channels){
|
||||
if(thing.id!==JSON.id){
|
||||
build.push(thing)
|
||||
}else{
|
||||
if(thing.parrent){
|
||||
thing.parrent.delChannel(JSON);
|
||||
}
|
||||
}
|
||||
}
|
||||
this.channels=build;
|
||||
}
|
||||
createChannel(name,type){
|
||||
fetch("https://api.old.server.spacebar.chat/api/guilds/"+this.id+"/channels",{
|
||||
method:"Post",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token},
|
||||
body:JSON.stringify({name: name, type: type})
|
||||
})
|
||||
}
|
||||
}
|
81
webpage/index.html
Normal file
81
webpage/index.html
Normal file
|
@ -0,0 +1,81 @@
|
|||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<link href="/style.css" rel="stylesheet" type="text/css" />
|
||||
<link rel="manifest" href="/manifest.json" />
|
||||
</head>
|
||||
<body>
|
||||
<script src="/login.js"></script>
|
||||
<script src="/member.js"></script>
|
||||
<script src="/user.js"></script>
|
||||
<script src="/message.js"></script>
|
||||
<script src="/channel.js"></script>
|
||||
<script src="/role.js"></script>
|
||||
<script src="/guild.js"></script>
|
||||
<script src="/dirrect.js"></script>
|
||||
<script src="/localuser.js"></script>
|
||||
<script src="/markdown.js"></script>
|
||||
<script src="/fullscreen.js"></script>
|
||||
<div id="loading" class="loading"><div id="centerdiv"><img src="/bitmap.svg" width="1in" height="1in"><h1>Jank Client is loading</h1><h2>This shouldn't take long</h2></div></div>
|
||||
<table id="page">
|
||||
<tr>
|
||||
<td rowspan="2" id="neunence">
|
||||
<div id="servers"></div>
|
||||
</td>
|
||||
<td class="servertd" id="servertd">
|
||||
<h2 id="serverName">Server Name</h2>
|
||||
</td>
|
||||
<td colspan="2" class="servertd servernamediv">
|
||||
<h2 id="channelname">Channel</h2>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div id="channels"></div>
|
||||
<table id="userdock">
|
||||
<tr>
|
||||
<td>
|
||||
<table id="userinfo"><tr>
|
||||
<td>
|
||||
<img id="userpfp" class="pfp">
|
||||
</td>
|
||||
<td>
|
||||
<div id="userinfo">
|
||||
<p id="username">USERNAME</p>
|
||||
<p id="status">SATUS</p>
|
||||
</div>
|
||||
</td>
|
||||
</tr></table></td>
|
||||
<td>
|
||||
<h2 id="settings" onclick="userSettings()">⚙</h2>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</td>
|
||||
<td id="channelw">
|
||||
<div id="messagecontainer">
|
||||
<div id="messages">
|
||||
</div>
|
||||
</div>
|
||||
<div id="pasteimage"></div>
|
||||
<div id="typediv">
|
||||
<textarea id="typebox"></textarea>
|
||||
<div id="typing" class="hidden">
|
||||
<p id="typingtext">typing</p>
|
||||
<div class="loading-indicator">
|
||||
<span class="dot">.</span>
|
||||
<span class="dot">.</span>
|
||||
<span class="dot">.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td id="extra">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<script src="/index.js"></script>
|
||||
</body>
|
||||
</html>
|
662
webpage/index.js
Normal file
662
webpage/index.js
Normal file
|
@ -0,0 +1,662 @@
|
|||
function setDynamicHeight() {
|
||||
var servertdHeight = document.getElementById('servertd').offsetHeight+document.getElementById('typebox').offsetHeight+document.getElementById('pasteimage').offsetHeight;
|
||||
document.documentElement.style.setProperty('--servertd-height', servertdHeight + 'px');
|
||||
}
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
setDynamicHeight();
|
||||
});
|
||||
resizeObserver.observe(document.getElementById('servertd'));
|
||||
resizeObserver.observe(document.getElementById('typebox'));
|
||||
resizeObserver.observe(document.getElementById('pasteimage'));
|
||||
setDynamicHeight();
|
||||
|
||||
|
||||
let token=gettoken();
|
||||
let ws
|
||||
initwebsocket();
|
||||
let READY;
|
||||
|
||||
/*
|
||||
fetch("https://old.server.spacebar.chat/api/v9/channels/1243314160814653069/messages/1244097259492795763/ack",{
|
||||
method:"POST",
|
||||
headers:{"Content-type": "application/json; charset=UTF-8",Authorization:token},
|
||||
body:JSON.stringify({})
|
||||
})
|
||||
*/
|
||||
function createbutton(text,img,clickevent=function(){}){
|
||||
const textb=document.createElement("tr");
|
||||
const intext=document.createElement("button")
|
||||
textb.button=intext;
|
||||
intext.classList.add("contextbutton")
|
||||
intext.innerText=text
|
||||
textb.appendChild(intext)
|
||||
intext.onclick=clickevent;
|
||||
return textb
|
||||
|
||||
}
|
||||
|
||||
var currentmenu="";
|
||||
document.addEventListener('click', function(event) {
|
||||
if(currentmenu==""){
|
||||
return;
|
||||
}
|
||||
if (!currentmenu.contains(event.target)) {
|
||||
currentmenu.remove();
|
||||
currentmenu="";
|
||||
}
|
||||
});
|
||||
let replyingto=null;
|
||||
lacechannel(document.getElementById("channels"));
|
||||
function lacechannel(c){
|
||||
c.addEventListener("contextmenu", (event) => {
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
makemenuc.bind(c)(event.currentTarget,event.clientX,event.clientY);
|
||||
});
|
||||
}
|
||||
|
||||
function createchannels(fincall){
|
||||
let name="";
|
||||
let catagory=1;
|
||||
console.log(fincall)
|
||||
channelselect=new fullscreen(
|
||||
["vdiv",
|
||||
["radio","select channel type",
|
||||
["voice","text","announcement"],
|
||||
function(e){
|
||||
console.log(e)
|
||||
catagory={"text":0,"voice":2,"announcement":5,"catagory":4}[e]
|
||||
}
|
||||
],
|
||||
["textbox","Name of channel","",function(){
|
||||
console.log(this)
|
||||
name=this.value
|
||||
}],
|
||||
["button","","submit",function(){
|
||||
console.log(name,catagory)
|
||||
fincall(name,catagory);
|
||||
channelselect.hide();
|
||||
}]
|
||||
]);
|
||||
channelselect.show();
|
||||
}
|
||||
function createcatagory(fincall){
|
||||
let name="";
|
||||
let catagory=4;
|
||||
console.log(fincall)
|
||||
channelselect=new fullscreen(
|
||||
["vdiv",
|
||||
["textbox","Name of catagory","",function(){
|
||||
console.log(this)
|
||||
name=this.value
|
||||
}],
|
||||
["button","","submit",function(){
|
||||
console.log(name,catagory)
|
||||
fincall(name,catagory);
|
||||
channelselect.hide();
|
||||
}]
|
||||
]);
|
||||
channelselect.show();
|
||||
}
|
||||
function editchannelf(channel){channel.editChannel();}
|
||||
function makemenuc(divmessage,x,y){
|
||||
if(currentmenu!=""){
|
||||
currentmenu.remove();
|
||||
}
|
||||
const build = document.createElement('table');
|
||||
if(x!==-1){
|
||||
build.classList.add("contextmenu");
|
||||
}
|
||||
console.log(divmessage,divmessage.classList.contains("Channel"));
|
||||
if(divmessage.classList.contains("Channel")){
|
||||
const channel=this.all;
|
||||
const copyidbutton=createbutton("copy channel id",null,function(){
|
||||
console.log(this)
|
||||
navigator.clipboard.writeText(channel.id);
|
||||
})
|
||||
copyidbutton.button.all=divmessage.all;
|
||||
build.appendChild(copyidbutton);
|
||||
if(thisuser.isAdmin()){
|
||||
const deleteChannel=createbutton("Delete channel",null,function(){
|
||||
console.log(channel)
|
||||
channel.deleteChannel();
|
||||
})
|
||||
deleteChannel.button.all=divmessage.all;
|
||||
build.appendChild(deleteChannel);
|
||||
|
||||
const editchannel=createbutton("edit channel",null,function(){
|
||||
editchannelf(channel);
|
||||
})
|
||||
editchannel.button.all=divmessage.all;
|
||||
build.appendChild(editchannel);
|
||||
}
|
||||
}else{
|
||||
if(thisuser.isAdmin()){
|
||||
const createchannel=createbutton("create channel",null,function(){
|
||||
createchannels(thisuser.lookingguild.createChannel.bind(thisuser.lookingguild));
|
||||
})
|
||||
createchannel.button.all=divmessage.all;
|
||||
build.appendChild(createchannel);
|
||||
|
||||
const createcat=createbutton("create catagory",null,function(){
|
||||
createcatagory(thisuser.lookingguild.createChannel.bind(thisuser.lookingguild));
|
||||
})
|
||||
createcat.button.all=divmessage.all;
|
||||
build.appendChild(createcat);
|
||||
//createcatagory
|
||||
}
|
||||
}
|
||||
|
||||
if(divmessage.userid==READY.d.user.id){
|
||||
const editbut=createbutton("edit",null,function(){
|
||||
console.log(this)
|
||||
editing=this.all.id;
|
||||
document.getElementById("typebox").value=this.all.content;
|
||||
})
|
||||
editbut.button.all=divmessage.all;
|
||||
console.log(editbut)
|
||||
build.appendChild(editbut);
|
||||
}
|
||||
if(x!==-1){
|
||||
build.style.top = y+'px';
|
||||
build.style.left = x+'px';
|
||||
}
|
||||
document.body.appendChild(build)
|
||||
currentmenu=build;
|
||||
}
|
||||
function makemenu(divmessage,x,y){
|
||||
if(currentmenu!=""){
|
||||
currentmenu.remove();
|
||||
}
|
||||
const build = document.createElement('table');
|
||||
if(x!==-1){
|
||||
build.classList.add("contextmenu");
|
||||
}
|
||||
const copybutton=createbutton("copy raw text",null,function(){
|
||||
console.log(this)
|
||||
navigator.clipboard.writeText(this.all.content);
|
||||
})
|
||||
copybutton.button.all=divmessage.all;
|
||||
build.appendChild(copybutton);
|
||||
const replybutton=createbutton("reply",null,function(){
|
||||
console.log(this)
|
||||
if(replyingto){
|
||||
replyingto.classList.remove("replying");
|
||||
}
|
||||
replyingto=divmessage;
|
||||
replyingto.classList.add("replying");
|
||||
})
|
||||
replybutton.button.all=divmessage.all;
|
||||
build.appendChild(replybutton);
|
||||
const copyidbutton=createbutton("copy message id",null,function(){
|
||||
console.log(this)
|
||||
navigator.clipboard.writeText(this.all.id);
|
||||
})
|
||||
copyidbutton.button.all=divmessage.all;
|
||||
build.appendChild(copyidbutton);
|
||||
|
||||
const dmbutton=createbutton("Message user",null,function(){
|
||||
console.log(this)
|
||||
fetch("https://old.server.spacebar.chat/api/v9/users/@me/channels",
|
||||
{method:"POST",
|
||||
body:JSON.stringify({"recipients":[this.all.author.id]}),
|
||||
headers: {"Content-type": "application/json; charset=UTF-8",Authorization:token}
|
||||
});
|
||||
})
|
||||
dmbutton.button.all=divmessage.all;
|
||||
build.appendChild(dmbutton);
|
||||
|
||||
if(divmessage.userid==READY.d.user.id){
|
||||
const editbut=createbutton("edit",null,function(){
|
||||
console.log(this)
|
||||
editing=this.all.id;
|
||||
document.getElementById("typebox").value=this.all.content;
|
||||
})
|
||||
editbut.button.all=divmessage.all;
|
||||
console.log(editbut)
|
||||
build.appendChild(editbut);
|
||||
}
|
||||
if(x!==-1){
|
||||
build.style.top = y+'px';
|
||||
build.style.left = x+'px';
|
||||
}
|
||||
document.body.appendChild(build)
|
||||
currentmenu=build;
|
||||
}
|
||||
let messagelist=[];
|
||||
function buildprofile(x,y,user,type="author"){
|
||||
if(currentmenu!=""){
|
||||
currentmenu.remove();
|
||||
}
|
||||
let nickname, username, discriminator, bio, bot, pronouns, id, avatar
|
||||
if(type=="author"){
|
||||
console.log(user)
|
||||
username=nickname=user.username;
|
||||
bio=user.bio;
|
||||
id=user.id;
|
||||
discriminator=user.discriminator;
|
||||
pronouns=user.pronouns;
|
||||
bot=user.bot;
|
||||
avatar=user.avatar;
|
||||
}
|
||||
|
||||
const div=document.createElement("table");
|
||||
if(x!==-1){
|
||||
div.style.left=x+"px";
|
||||
div.style.top=y+"px";
|
||||
div.classList.add("profile");
|
||||
}else{
|
||||
div.classList.add("hypoprofile");
|
||||
}
|
||||
|
||||
{
|
||||
const pfp=user.buildpfp();
|
||||
const pfprow=document.createElement("tr");
|
||||
div.appendChild(pfprow);
|
||||
pfprow.appendChild(pfp);
|
||||
}
|
||||
{
|
||||
const userbody=document.createElement("tr");
|
||||
userbody.classList.add("infosection");
|
||||
div.appendChild(userbody);
|
||||
const usernamehtml=document.createElement("h2");
|
||||
usernamehtml.innerText=nickname;
|
||||
userbody.appendChild(usernamehtml);
|
||||
|
||||
const discrimatorhtml=document.createElement("h3");
|
||||
discrimatorhtml.classList.add("tag");
|
||||
discrimatorhtml.innerText=username+"#"+discriminator;
|
||||
userbody.appendChild(discrimatorhtml)
|
||||
|
||||
const pronounshtml=document.createElement("p");
|
||||
pronounshtml.innerText=pronouns;
|
||||
pronounshtml.classList.add("pronouns");
|
||||
userbody.appendChild(pronounshtml)
|
||||
|
||||
const rule=document.createElement("hr");
|
||||
userbody.appendChild(rule);
|
||||
const biohtml=markdown(bio);
|
||||
userbody.appendChild(biohtml);
|
||||
}
|
||||
console.log(div);
|
||||
if(x!==-1){
|
||||
currentmenu=div;
|
||||
document.body.appendChild(div)
|
||||
}
|
||||
return div
|
||||
}
|
||||
function profileclick(obj,author){
|
||||
obj.onclick=function(e){
|
||||
console.log(e.clientX,e.clientY,author);
|
||||
buildprofile(e.clientX,e.clientY,author)
|
||||
e.stopPropagation();
|
||||
}
|
||||
}
|
||||
|
||||
var editing=false;
|
||||
document.getElementById("typebox").addEventListener("keyup",enter);
|
||||
console.log(document.getElementById("typebox"))
|
||||
document.getElementById("typebox").onclick=console.log;
|
||||
async function enter(event){
|
||||
thisuser.lookingguild.prevchannel.typingstart();
|
||||
const tis=document.getElementById("typebox");
|
||||
if(event.key === "Enter"&&!event.shiftKey){
|
||||
event.preventDefault();
|
||||
if(editing){
|
||||
fetch("https://api.old.server.spacebar.chat/api/channels/"+window.location.pathname.split("/")[3]+"/messages/"+editing,{
|
||||
method: "PATCH",
|
||||
headers: {
|
||||
"Content-type": "application/json; charset=UTF-8",
|
||||
Authorization:token
|
||||
},
|
||||
body:JSON.stringify({content:tis.value})
|
||||
|
||||
})
|
||||
tis.value="";
|
||||
editing=false;
|
||||
}else{
|
||||
let replyjson=false;
|
||||
if(replyingto){
|
||||
replyjson=
|
||||
{
|
||||
"guild_id":replyingto.all.guild_id,
|
||||
"channel_id": replyingto.all.channel_id,
|
||||
"message_id": replyingto.all.id,
|
||||
};
|
||||
replyingto.classList.remove("replying");
|
||||
}
|
||||
|
||||
replyingto=false;
|
||||
if(images.length==0){
|
||||
|
||||
const body={
|
||||
content:tis.value,
|
||||
nonce:Math.floor(Math.random()*1000000000)
|
||||
};
|
||||
if(replyjson){
|
||||
body.message_reference=replyjson;
|
||||
}
|
||||
console.log(body)
|
||||
fetch("https://api.old.server.spacebar.chat/api/channels/"+window.location.pathname.split("/")[3]+"/messages",{
|
||||
method:"POST",
|
||||
headers:{
|
||||
"Content-type": "application/json; charset=UTF-8",
|
||||
Authorization:token,
|
||||
},
|
||||
body:JSON.stringify(body)
|
||||
}).then(
|
||||
function(out){
|
||||
console.log(out,"here it is")
|
||||
}
|
||||
)
|
||||
tis.value="";
|
||||
}else{
|
||||
let formData = new FormData();
|
||||
const body={
|
||||
content:tis.value,
|
||||
nonce:Math.floor(Math.random()*1000000000),
|
||||
}
|
||||
if(replyjson){
|
||||
body.message_reference=replyjson;
|
||||
}
|
||||
formData.append('payload_json', JSON.stringify(body));
|
||||
for(i in images){
|
||||
console.log(images[i])
|
||||
formData.append("files["+i+"]",images[i]);
|
||||
}
|
||||
const data=formData.entries()
|
||||
console.log(data.next(),data.next(),data.next())
|
||||
console.log((await fetch("https://api.old.server.spacebar.chat/api/channels/"+window.location.pathname.split("/")[3]+"/messages", {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
headers:{
|
||||
"Authorization":token,
|
||||
}
|
||||
})));
|
||||
//fetch("/sendimagemessage",{body:formData,method:"POST"})
|
||||
|
||||
while(images.length!=0){
|
||||
images.pop()
|
||||
pasteimage.removeChild(imageshtml.pop())
|
||||
}
|
||||
tis.value="";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let packets=1;
|
||||
let serverz=0;
|
||||
let serverid=[];
|
||||
let thisuser=null;
|
||||
|
||||
|
||||
function initwebsocket(){
|
||||
ws = new WebSocket('wss://gateway.old.server.spacebar.chat/?v=9&encoding=json');
|
||||
|
||||
ws.addEventListener('open', (event) => {
|
||||
console.log('WebSocket connected');
|
||||
ws.send(JSON.stringify({
|
||||
"op": 2,
|
||||
"d": {
|
||||
"token":token,
|
||||
"capabilities": 16381,
|
||||
"properties": {
|
||||
"browser": "Harmony",
|
||||
"client_build_number": 0,
|
||||
"release_channel": "Custom",
|
||||
"browser_user_agent": navigator.userAgent
|
||||
},
|
||||
"compress": false,
|
||||
"presence": {
|
||||
"status": "online",
|
||||
"since": new Date().getTime(),
|
||||
"activities": [],
|
||||
"afk": false
|
||||
}
|
||||
}
|
||||
}))
|
||||
});
|
||||
|
||||
ws.addEventListener('message', (event) => {
|
||||
|
||||
|
||||
try{
|
||||
const temp=JSON.parse(event.data);
|
||||
console.log(temp)
|
||||
if(temp.op==0){
|
||||
switch(temp.t){
|
||||
case "MESSAGE_CREATE":
|
||||
thisuser.messageCreate(temp);
|
||||
break;
|
||||
case "READY":
|
||||
thisuser=new localuser(temp);
|
||||
console.log(temp.d.read_state.entries)
|
||||
thisuser.loaduser();
|
||||
READY=temp;
|
||||
thisuser.init();
|
||||
genusersettings();
|
||||
document.getElementById("loading").classList.add("doneloading");
|
||||
document.getElementById("loading").classList.remove("loading")
|
||||
break;
|
||||
case "MESSAGE_UPDATE":
|
||||
if(window.location.pathname.split("/")[3]==temp.d.channel_id){
|
||||
const find=temp.d.id;
|
||||
for(const message of messagelist){
|
||||
if(message.all.id===find){
|
||||
message.all.content=temp.d.content;
|
||||
message.txt.innerHTML=markdown(temp.d.content).innerHTML;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
break;
|
||||
case "TYPING_START":
|
||||
thisuser.typeingStart(temp);
|
||||
break;
|
||||
case "USER_UPDATE":
|
||||
const users=user.userids[temp.d.id];
|
||||
console.log(users,temp.d.id)
|
||||
|
||||
if(users){
|
||||
users.userupdate(temp.d);
|
||||
console.log("in here");
|
||||
}
|
||||
break
|
||||
case "CHANNEL_UPDATE":
|
||||
thisuser.updateChannel(temp.d);
|
||||
break;
|
||||
case "CHANNEL_CREATE":
|
||||
thisuser.createChannel(temp.d);
|
||||
break;
|
||||
case "CHANNEL_DELETE":
|
||||
thisuser.delChannel(temp.d);
|
||||
break;
|
||||
}
|
||||
|
||||
}else if(temp.op===10){
|
||||
console.log("heartbeat down")
|
||||
setInterval(function(){
|
||||
ws.send(JSON.stringify({op:1,d:packets}))
|
||||
},temp.d.heartbeat_interval)
|
||||
packets=1;
|
||||
}else if(temp.op!=11){
|
||||
packets++
|
||||
}
|
||||
}catch(error){
|
||||
console.error(error)
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
ws.addEventListener('close', (event) => {
|
||||
console.log('WebSocket closed');
|
||||
});
|
||||
}
|
||||
|
||||
let cchanel=0;
|
||||
|
||||
|
||||
function getguildinfo(){
|
||||
const path=window.location.pathname.split("/");
|
||||
const channel=path[3];
|
||||
ws.send(JSON.stringify({op: 14, d: {guild_id: path[2], channels: {[channel]: [[0, 99]]}}}));
|
||||
}
|
||||
|
||||
|
||||
const images=[];
|
||||
const imageshtml=[];
|
||||
function createunknown(fname,fsize,src){
|
||||
const div=document.createElement("table");
|
||||
div.classList.add("unkownfile");
|
||||
const nametr=document.createElement("tr");
|
||||
div.append(nametr);
|
||||
const fileicon=document.createElement("td");
|
||||
nametr.append(fileicon);
|
||||
fileicon.append("🗎");
|
||||
fileicon.classList.add("fileicon");
|
||||
fileicon.rowSpan="2";
|
||||
const nametd=document.createElement("td");
|
||||
if(src){
|
||||
const a=document.createElement("a");
|
||||
a.href=src;
|
||||
a.innerText=fname;
|
||||
nametd.append(a);
|
||||
}else{
|
||||
nametd.innerText=fname;
|
||||
}
|
||||
|
||||
nametd.classList.add("filename");
|
||||
nametr.append(nametd);
|
||||
const sizetr=document.createElement("tr");
|
||||
const size=document.createElement("td");
|
||||
sizetr.append(size);
|
||||
size.innerText="Size:"+filesizehuman(fsize);
|
||||
size.classList.add("filesize");
|
||||
div.appendChild(sizetr)
|
||||
return div;
|
||||
}
|
||||
function filesizehuman(fsize){
|
||||
var i = fsize == 0 ? 0 : Math.floor(Math.log(fsize) / Math.log(1024));
|
||||
return +((fsize / Math.pow(1024, i)).toFixed(2)) * 1 + ' ' + ['Bytes', 'Kilobytes', 'Megabytes', 'Gigabytes', 'Terabytes'][i];
|
||||
}
|
||||
function createunknownfile(file){
|
||||
return createunknown(file.name,file.size)
|
||||
}
|
||||
function filetohtml(file){
|
||||
if (file.type.startsWith('image/')) {
|
||||
const img = document.createElement('img');
|
||||
const blob = URL.createObjectURL(file);
|
||||
img.src = blob;
|
||||
return img;
|
||||
}else{
|
||||
console.log(file.name);
|
||||
|
||||
return createunknownfile(file);
|
||||
}
|
||||
}
|
||||
document.addEventListener('paste', async (e) => {
|
||||
Array.from(e.clipboardData.files).forEach(async (file) => {
|
||||
e.preventDefault();
|
||||
const html=filetohtml(file);
|
||||
pasteimage.appendChild(html);
|
||||
const blob = URL.createObjectURL(file);
|
||||
images.push(file)
|
||||
imageshtml.push(html);
|
||||
|
||||
console.log(file.type)
|
||||
});
|
||||
});
|
||||
let usersettings
|
||||
function genusersettings(){
|
||||
const hypothetcialprofie=document.createElement("div");
|
||||
let file=null;
|
||||
let newprouns=null;
|
||||
let newbio=null;
|
||||
let hypouser=new user(thisuser.user,true);
|
||||
function regen(){
|
||||
hypothetcialprofie.textContent="";
|
||||
const hypoprofile=buildprofile(-1,-1,hypouser);
|
||||
|
||||
hypothetcialprofie.appendChild(hypoprofile)
|
||||
console.log(hypothetcialprofie,hypoprofile)
|
||||
}
|
||||
regen();
|
||||
usersettings=new fullscreen(
|
||||
["hdiv",
|
||||
["vdiv",
|
||||
["fileupload","upload pfp:",function(e){
|
||||
console.log(this.files[0])
|
||||
file=this.files[0];
|
||||
const blob = URL.createObjectURL(this.files[0]);
|
||||
hypouser.avatar = blob;
|
||||
hypouser.hypotheticalpfp=true;
|
||||
regen();
|
||||
}],
|
||||
["textbox","Pronouns:",thisuser.user.pronouns,function(e){
|
||||
console.log(this.value);
|
||||
hypouser.pronouns=this.value;
|
||||
newprouns=this.value;
|
||||
regen();
|
||||
}],
|
||||
["mdbox","Bio:",thisuser.user.bio,function(e){
|
||||
console.log(this.value);
|
||||
hypouser.bio=this.value;
|
||||
newbio=this.value;
|
||||
regen();
|
||||
}],
|
||||
["button","update user content:","submit",function(){
|
||||
if(file!==null){
|
||||
thisuser.updatepfp(file);
|
||||
}
|
||||
if(newprouns!==null){
|
||||
thisuser.updatepronouns(newprouns);
|
||||
}
|
||||
if(newbio!==null){
|
||||
thisuser.updatebio(newbio);
|
||||
}
|
||||
}]
|
||||
],
|
||||
["vdiv",
|
||||
["html",hypothetcialprofie]
|
||||
]
|
||||
],_=>{},function(){
|
||||
hypouser=new user(thisuser.user);
|
||||
regen();
|
||||
file=null;
|
||||
newprouns=null;
|
||||
newbio=null;
|
||||
})
|
||||
}
|
||||
function userSettings(){
|
||||
usersettings.show();
|
||||
}
|
||||
let triggered=false;
|
||||
document.getElementById("messagecontainer").addEventListener("scroll",(e)=>{
|
||||
if(document.getElementById("messagecontainer").scrollTop<2000){
|
||||
if(!triggered){
|
||||
thisuser.lookingguild.prevchannel.grabmoremessages();
|
||||
}
|
||||
triggered=true;
|
||||
}else{
|
||||
triggered=false;
|
||||
}
|
||||
//
|
||||
})
|
||||
/*
|
||||
{
|
||||
const messages=document.getElementById("messages");
|
||||
let height=messages.clientHeight;
|
||||
//
|
||||
const resizeObserver=new ResizeObserver(()=>{
|
||||
console.log(messages.scrollTop,messages.clientHeight-height-messages.scrollHeight);
|
||||
messages.scrollTop-=height-messages.scrollHeight;
|
||||
console.log(messages.scrollTop)
|
||||
//if(shouldsnap){
|
||||
// document.getElementById("messagecontainer").scrollTop = document.getElementById("messagecontainer").scrollHeight;
|
||||
//}
|
||||
height=messages.scrollHeight;
|
||||
})
|
||||
resizeObserver.observe(messages)
|
||||
}
|
||||
*/
|
227
webpage/localuser.js
Normal file
227
webpage/localuser.js
Normal file
|
@ -0,0 +1,227 @@
|
|||
class localuser{
|
||||
constructor(ready){
|
||||
this.ready=ready;
|
||||
this.guilds=[];
|
||||
this.guildids={};
|
||||
this.user=new user(ready.d.user);
|
||||
this.status=this.ready.d.user_settings.status;
|
||||
this.channelfocus=null;
|
||||
this.lookingguild=null;
|
||||
for(const thing of ready.d.guilds){
|
||||
const temp=new guild(thing,this);
|
||||
this.guilds.push(temp);
|
||||
this.guildids[temp.id]=temp;
|
||||
}
|
||||
{
|
||||
const temp=new dirrect(ready.d.private_channels,this);
|
||||
this.guilds.push(temp);
|
||||
this.guildids[temp.id]=temp;
|
||||
}
|
||||
for(const thing of ready.d.merged_members){
|
||||
const temp=new member(thing[0]);
|
||||
this.guildids[temp.guild_id].giveMember(temp);
|
||||
}
|
||||
this.typing=[];
|
||||
}
|
||||
updateChannel(JSON){
|
||||
this.guildids[JSON.guild_id].updateChannel(JSON);
|
||||
if(JSON.guild_id===this.lookingguild.id){
|
||||
this.loadGuild(JSON.guild_id);
|
||||
}
|
||||
}
|
||||
createChannel(JSON){
|
||||
JSON.guild_id??="@me";
|
||||
this.guildids[JSON.guild_id].createChannelpac(JSON);
|
||||
if(JSON.guild_id===this.lookingguild.id){
|
||||
this.loadGuild(JSON.guild_id);
|
||||
}
|
||||
}
|
||||
delChannel(JSON){
|
||||
JSON.guild_id??="@me";
|
||||
this.guildids[JSON.guild_id].delChannel(JSON);
|
||||
if(JSON.guild_id===this.lookingguild.id){
|
||||
this.loadGuild(JSON.guild_id);
|
||||
}
|
||||
}
|
||||
init(){
|
||||
const location=window.location.href.split("/");
|
||||
if(location[3]==="channels"){
|
||||
const guild=this.loadGuild(location[4]);
|
||||
console.log(guild);
|
||||
guild.loadChannel(location[5]);
|
||||
console.log(location[5])
|
||||
this.channelfocus=location[5];
|
||||
}
|
||||
this.buildservers();
|
||||
}
|
||||
loaduser(){
|
||||
document.getElementById("username").innerText=this.user.username
|
||||
document.getElementById("userpfp").src=this.user.getpfpsrc()
|
||||
document.getElementById("status").innerText=this.status;
|
||||
}
|
||||
isAdmin(){
|
||||
return this.lookingguild.isAdmin();
|
||||
}
|
||||
loadGuild(id){
|
||||
const guild=this.guildids[id];
|
||||
this.lookingguild=guild;
|
||||
document.getElementById("serverName").innerText=guild.properties.name;
|
||||
//console.log(this.guildids,id)
|
||||
document.getElementById("channels").innerHTML="";
|
||||
document.getElementById("channels").appendChild(guild.getHTML());
|
||||
return guild;
|
||||
}
|
||||
buildservers(){
|
||||
const serverlist=document.getElementById("servers");//
|
||||
|
||||
const div=document.createElement("div");
|
||||
div.innerText="⌂";
|
||||
div.classList.add("Home","servericon")
|
||||
div.all=this.guildids["@me"];
|
||||
serverlist.appendChild(div)
|
||||
div.onclick=function(){
|
||||
this.all.loadGuild();
|
||||
this.all.loadChannel();
|
||||
}
|
||||
const br=document.createElement("hr")
|
||||
br.classList.add("lightbr")
|
||||
serverlist.appendChild(br)
|
||||
for(const thing of this.guilds){
|
||||
if(thing instanceof dirrect){
|
||||
continue;
|
||||
}
|
||||
if(thing.properties.icon!=null){
|
||||
const img=document.createElement("img");
|
||||
img.classList.add("pfp","servericon")
|
||||
img.src="https://cdn.old.server.spacebar.chat/icons/"+thing.properties.id+"/"+thing.properties.icon+".png";
|
||||
serverlist.appendChild(img)
|
||||
img.all=thing;
|
||||
img.onclick=function(){
|
||||
console.log(this.all.loadGuild)
|
||||
this.all.loadGuild();
|
||||
this.all.loadChannel();
|
||||
}
|
||||
}else{
|
||||
const div=document.createElement("div");
|
||||
let build="";
|
||||
for(const char of thing.properties.name.split(" ")){
|
||||
build+=char[0];
|
||||
}
|
||||
div.innerText=build;
|
||||
div.classList.add("blankserver","servericon")
|
||||
serverlist.appendChild(div)
|
||||
div.all=thing;
|
||||
div.onclick=function(){
|
||||
this.all.loadGuild();
|
||||
this.all.loadChannel();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
messageCreate(messagep){
|
||||
messagep.d.guild_id??="@me";
|
||||
this.guildids[messagep.d.guild_id].channelids[messagep.d.channel_id].messageCreate(messagep,this.channelfocus===messagep.d.channel_id);
|
||||
}
|
||||
typeingStart(typing){
|
||||
if(this.channelfocus===typing.d.channel_id){
|
||||
const memb=typing.d.member;
|
||||
let name;
|
||||
if(memb.id===this.user.id){
|
||||
console.log("you is typing")
|
||||
return;
|
||||
}
|
||||
console.log("user is typing and you should see it");
|
||||
if(memb.nick){
|
||||
name=memb.nick;
|
||||
}else{
|
||||
name=memb.user.username;
|
||||
}
|
||||
let already=false;
|
||||
for(const thing of this.typing){
|
||||
if(thing[0]===name){
|
||||
thing[1]=new Date().getTime();
|
||||
already=true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if(!already){
|
||||
this.typing.push([name,new Date().getTime()]);
|
||||
}
|
||||
setTimeout(this.rendertyping.bind(this),10000);
|
||||
this.rendertyping();
|
||||
}
|
||||
}
|
||||
updatepfp(file){
|
||||
var reader = new FileReader();
|
||||
reader.readAsDataURL(file);
|
||||
reader.onload = function () {
|
||||
fetch("https://old.server.spacebar.chat/api/v9/users/@me",{
|
||||
method:"PATCH",
|
||||
headers:{
|
||||
"Content-type": "application/json; charset=UTF-8",
|
||||
Authorization:token
|
||||
},
|
||||
body:JSON.stringify({
|
||||
avatar:reader.result,
|
||||
})
|
||||
});
|
||||
console.log(reader.result);
|
||||
};
|
||||
|
||||
}
|
||||
updatepronouns(pronouns){
|
||||
fetch("https://old.server.spacebar.chat/api/v9/users/@me/profile",{
|
||||
method:"PATCH",
|
||||
headers:{
|
||||
"Content-type": "application/json; charset=UTF-8",
|
||||
Authorization:token
|
||||
},
|
||||
body:JSON.stringify({
|
||||
pronouns:pronouns,
|
||||
})
|
||||
});
|
||||
}
|
||||
updatebio(bio){
|
||||
fetch("https://old.server.spacebar.chat/api/v9/users/@me/profile",{
|
||||
method:"PATCH",
|
||||
headers:{
|
||||
"Content-type": "application/json; charset=UTF-8",
|
||||
Authorization:token
|
||||
},
|
||||
body:JSON.stringify({
|
||||
bio:bio,
|
||||
})
|
||||
});
|
||||
}
|
||||
rendertyping(){
|
||||
const typingtext=document.getElementById("typing")
|
||||
let build="";
|
||||
const array2=[];
|
||||
let showing=false;
|
||||
let i=0;
|
||||
for(const thing of this.typing){
|
||||
i++;
|
||||
if(thing[1]>new Date().getTime()-5000){
|
||||
build+=thing[0];
|
||||
array2.push(thing);
|
||||
showing=true;
|
||||
if(i!==this.typing.length){
|
||||
build+=",";
|
||||
}
|
||||
}
|
||||
}
|
||||
if(i>1){
|
||||
build+=" are typing";
|
||||
}else{
|
||||
build+=" is typing";
|
||||
}
|
||||
console.log(typingtext.classList);
|
||||
if(showing){
|
||||
typingtext.classList.remove("hidden");
|
||||
document.getElementById("typingtext").innerText=build;
|
||||
}else{
|
||||
typingtext.classList.add("hidden");
|
||||
}
|
||||
}
|
||||
|
||||
}
|
18
webpage/login.html
Normal file
18
webpage/login.html
Normal file
|
@ -0,0 +1,18 @@
|
|||
<body>
|
||||
<head>
|
||||
<link href="/style.css" rel="stylesheet" type="text/css" />
|
||||
</head>
|
||||
<div id="logindiv">
|
||||
<h1>Login</h1><br>
|
||||
<form id="form" submit="check(e)">
|
||||
<label for="uname"><b>Username:</b></label><br>
|
||||
<input type="text" placeholder="Enter Username" name="uname" required><br><br>
|
||||
|
||||
<label for="psw"><b>Password:</b></label><br>
|
||||
<input type="password" placeholder="Enter Password" name="psw" required><br><br><br><br>
|
||||
<p class="wrongred" id="wrong"></p>
|
||||
<button type="submit">Login</button>
|
||||
</form>
|
||||
</div>
|
||||
<script src="/login.js"></script>
|
||||
</body>
|
50
webpage/login.js
Normal file
50
webpage/login.js
Normal file
|
@ -0,0 +1,50 @@
|
|||
function getCookie(name) {
|
||||
const value = `; ${document.cookie}`;
|
||||
const parts = value.split(`; ${name}=`);
|
||||
if (parts.length === 2) return parts.pop().split(';').shift();
|
||||
}
|
||||
async function login(username, password){
|
||||
const options={
|
||||
method: "POST",
|
||||
body:JSON.stringify({
|
||||
"login": username,
|
||||
"password": password,
|
||||
"undelete":false
|
||||
}),
|
||||
headers: {
|
||||
"Content-type": "application/json; charset=UTF-8",
|
||||
}}
|
||||
try{
|
||||
return await fetch('https://api.old.server.spacebar.chat/api/auth/login',options).then(responce=>responce.json())
|
||||
.then((response) => {
|
||||
console.log(response,response.message)
|
||||
if("Invalid Form Body"===response.message){
|
||||
return response.errors.login._errors[0].message;
|
||||
console.log("test")
|
||||
}
|
||||
document.cookie = "token="+response.token+"; expires="+new Date(Date.now()+(6.048e+8*2));
|
||||
window.location.href = '/channels/@me';
|
||||
return response.token;
|
||||
})
|
||||
}catch(error){
|
||||
console.error('Error:', error);
|
||||
};
|
||||
}
|
||||
function gettoken(){
|
||||
const temp=getCookie("token");
|
||||
if(temp===undefined){
|
||||
window.location.href = '/login.html';
|
||||
}
|
||||
return temp;
|
||||
}
|
||||
|
||||
async function check(e){
|
||||
|
||||
e.preventDefault();
|
||||
let h=await login(e.srcElement[0].value,e.srcElement[1].value);
|
||||
document.getElementById("wrong").innerText=h;
|
||||
console.log(h);
|
||||
}
|
||||
if(document.getElementById("form")){
|
||||
document.getElementById("form").addEventListener("submit", check);
|
||||
}
|
12
webpage/manifest.json
Normal file
12
webpage/manifest.json
Normal file
|
@ -0,0 +1,12 @@
|
|||
{
|
||||
"name": "Jank Client",
|
||||
"icons": [
|
||||
{
|
||||
"src": "/bitmap.svg",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url":"/channels/@me",
|
||||
"display":"standalone",
|
||||
"theme_color":"#05050a"
|
||||
}
|
316
webpage/markdown.js
Normal file
316
webpage/markdown.js
Normal file
|
@ -0,0 +1,316 @@
|
|||
"use strict";
|
||||
function markdown(txt,keep=false){
|
||||
if((typeof txt)===(typeof "")){
|
||||
return markdown(txt.split(""),keep);
|
||||
}
|
||||
const span=document.createElement("span");
|
||||
let current=document.createElement("span");
|
||||
function appendcurrent(){
|
||||
if(current.innerHTML!==""){
|
||||
span.append(current);
|
||||
current=document.createElement("span");
|
||||
}
|
||||
|
||||
}
|
||||
for(let i=0;i<txt.length;i++){
|
||||
if(txt[i]==="\n"||i===0){
|
||||
const first=i===0;
|
||||
if(first){
|
||||
i--;
|
||||
}
|
||||
let element=null;
|
||||
let keepys=false;
|
||||
|
||||
if(txt[i+1]==="#"){
|
||||
console.log("test");
|
||||
if(txt[i+2]==="#"){
|
||||
if(txt[i+3]==="#"&&txt[i+4]===" "){
|
||||
element=document.createElement("h3");
|
||||
keepys="### ";
|
||||
i+=5;
|
||||
}else if(txt[i+3]===" "){
|
||||
element=document.createElement("h2");
|
||||
keepys="## ";
|
||||
i+=4;
|
||||
}
|
||||
}else if(txt[i+2]===" "){
|
||||
element=document.createElement("h1");
|
||||
keepys="# ";
|
||||
i+=3;
|
||||
}
|
||||
}else if(txt[i+1]===">"&&txt[i+2]===" "){
|
||||
element=document.createElement("div");
|
||||
const line=document.createElement("div");
|
||||
line.classList.add("quoteline");
|
||||
console.log(line);
|
||||
element.append(line);
|
||||
element.classList.add("quote");
|
||||
keepys="> ";
|
||||
i+=3;
|
||||
}
|
||||
if(keepys){
|
||||
appendcurrent();
|
||||
if(!first){
|
||||
span.appendChild(document.createElement("br"));
|
||||
}
|
||||
const build=[];
|
||||
for(;txt[i]!=="\n"&&txt[i]!==undefined;i++){
|
||||
build.push(txt[i]);
|
||||
}
|
||||
if(keep){
|
||||
element.append(keepys);
|
||||
}
|
||||
element.appendChild(markdown(build,keep));
|
||||
span.append(element);
|
||||
i--;
|
||||
continue;
|
||||
}
|
||||
if(first){
|
||||
i++;
|
||||
}
|
||||
}
|
||||
if(txt[i]==="\n"){
|
||||
appendcurrent();
|
||||
span.append(document.createElement("br"));
|
||||
continue;
|
||||
}
|
||||
if(txt[i]==="`"){
|
||||
let count=1;
|
||||
if(txt[i+1]==="`"){
|
||||
count++;
|
||||
if(txt[i+2]==="`"){
|
||||
count++;
|
||||
}
|
||||
}
|
||||
let build="";
|
||||
if(keep){
|
||||
build+="`".repeat(count);
|
||||
}
|
||||
let find=0;
|
||||
let j=i+count;
|
||||
let init=true;
|
||||
for(;txt[j]!==undefined&&(txt[j]!=="\n"||count===3)&&find!==count;j++){
|
||||
if(txt[j]==="`"){
|
||||
find++;
|
||||
}else{
|
||||
if(find!==0){
|
||||
build+="`".repeat(find);
|
||||
find=0;
|
||||
}
|
||||
if(init&&count===3){
|
||||
if(txt[j]===" "||txt[j]==="\n"){
|
||||
init=false;
|
||||
}
|
||||
if(keep){
|
||||
build+=txt[j];
|
||||
}
|
||||
continue;
|
||||
}
|
||||
build+=txt[j];
|
||||
}
|
||||
}
|
||||
if(find===count){
|
||||
appendcurrent();
|
||||
i=j;
|
||||
if(keep){
|
||||
build+="`".repeat(find);
|
||||
}
|
||||
if(count!==3){
|
||||
const samp=document.createElement("samp");
|
||||
samp.innerText=build;
|
||||
span.appendChild(samp);
|
||||
}else{
|
||||
const pre=document.createElement("pre");
|
||||
if(build[build.length-1]==="\n"){
|
||||
build=build.substring(0,build.length-1);
|
||||
}
|
||||
if(txt[i]==="\n"){
|
||||
i++
|
||||
}
|
||||
pre.innerText=build;
|
||||
span.appendChild(pre);
|
||||
}
|
||||
i--;
|
||||
continue;
|
||||
}
|
||||
}
|
||||
|
||||
if(txt[i]==="*"){
|
||||
let count=1;
|
||||
if(txt[i+1]==="*"){
|
||||
count++;
|
||||
if(txt[i+2]==="*"){
|
||||
count++;
|
||||
}
|
||||
}
|
||||
let build=[];
|
||||
let find=0;
|
||||
let j=i+count;
|
||||
for(;txt[j]!==undefined&&find!==count;j++){
|
||||
|
||||
if(txt[j]==="*"){
|
||||
find++;
|
||||
}else{
|
||||
build+=txt[j];
|
||||
if(find!==0){
|
||||
build=build.concat(new Array(find).fill("*"));
|
||||
find=0;
|
||||
}
|
||||
}
|
||||
}
|
||||
if(find===count&&(count!=1||txt[i+1]!==" ")){
|
||||
appendcurrent();
|
||||
i=j;
|
||||
|
||||
const stars="*".repeat(count);
|
||||
if(count===1){
|
||||
const i=document.createElement("i");
|
||||
if(keep){i.append(stars)}
|
||||
i.appendChild(markdown(build,keep));
|
||||
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));
|
||||
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));
|
||||
if(keep){b.append(stars)}
|
||||
i.appendChild(b);
|
||||
span.appendChild(i);
|
||||
}
|
||||
i--
|
||||
continue;
|
||||
}
|
||||
}
|
||||
|
||||
if(txt[i]==="_"){
|
||||
let count=1;
|
||||
if(txt[i+1]==="_"){
|
||||
count++;
|
||||
if(txt[i+2]==="_"){
|
||||
count++;
|
||||
}
|
||||
}
|
||||
let build=[];
|
||||
let find=0;
|
||||
let j=i+count;
|
||||
for(;txt[j]!==undefined&&find!==count;j++){
|
||||
|
||||
if(txt[j]==="_"){
|
||||
find++;
|
||||
}else{
|
||||
build+=txt[j];
|
||||
if(find!==0){
|
||||
build=build.concat(new Array(find).fill("_"));
|
||||
find=0;
|
||||
}
|
||||
}
|
||||
}
|
||||
if(find===count&&(count!=1||(txt[j+1]===" "||txt[j+1]==="\n"||txt[j+1]===undefined))){
|
||||
appendcurrent();
|
||||
i=j;
|
||||
const underscores="_".repeat(count);
|
||||
if(count===1){
|
||||
const i=document.createElement("i");
|
||||
if(keep){i.append(underscores)}
|
||||
i.appendChild(markdown(build,keep));
|
||||
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));
|
||||
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));
|
||||
if(keep){i.append(underscores)}
|
||||
u.appendChild(i)
|
||||
span.appendChild(u);
|
||||
}
|
||||
i--;
|
||||
continue;
|
||||
}
|
||||
}
|
||||
|
||||
if(txt[i]==="~"&&txt[i+1]==="~"){
|
||||
let count=2;
|
||||
let build=[];
|
||||
let find=0;
|
||||
let j=i+2;
|
||||
for(;txt[j]!==undefined&&find!==count;j++){
|
||||
if(txt[j]==="~"){
|
||||
find++;
|
||||
}else{
|
||||
build+=txt[j];
|
||||
if(find!==0){
|
||||
build=build.concat(new Array(find).fill("~"));
|
||||
find=0;
|
||||
}
|
||||
}
|
||||
}
|
||||
if(find===count){
|
||||
appendcurrent();
|
||||
i=j;
|
||||
const underscores="~~";
|
||||
if(count===2){
|
||||
const s=document.createElement("s");
|
||||
if(keep){s.append(underscores)}
|
||||
s.appendChild(markdown(build,keep));
|
||||
if(keep){s.append(underscores)}
|
||||
span.appendChild(s);
|
||||
}
|
||||
continue;
|
||||
}
|
||||
}
|
||||
if(txt[i]==="|"&&txt[i+1]==="|"){
|
||||
let count=2;
|
||||
let build=[];
|
||||
let find=0;
|
||||
let j=i+2;
|
||||
for(;txt[j]!==undefined&&find!==count;j++){
|
||||
if(txt[j]==="|"){
|
||||
find++;
|
||||
}else{
|
||||
build+=txt[j];
|
||||
if(find!==0){
|
||||
build=build.concat(new Array(find).fill("~"));
|
||||
find=0;
|
||||
}
|
||||
}
|
||||
}
|
||||
if(find===count){
|
||||
appendcurrent();
|
||||
i=j;
|
||||
const underscores="||";
|
||||
if(count===2){
|
||||
const j=document.createElement("j");
|
||||
if(keep){j.append(underscores)}
|
||||
j.appendChild(markdown(build,keep));
|
||||
j.classList.add("spoiler");
|
||||
j.onclick=markdown.unspoil;
|
||||
if(keep){j.append(underscores)}
|
||||
span.appendChild(j);
|
||||
}
|
||||
continue;
|
||||
}
|
||||
}
|
||||
current.innerText+=txt[i];
|
||||
}
|
||||
appendcurrent();
|
||||
return span;
|
||||
}
|
||||
markdown.unspoil=function(e){
|
||||
//console.log("undone")
|
||||
e.target.classList.remove("spoiler")
|
||||
e.target.classList.add("unspoiled")
|
||||
}
|
22
webpage/member.js
Normal file
22
webpage/member.js
Normal file
|
@ -0,0 +1,22 @@
|
|||
class member{
|
||||
constructor(memberjson){
|
||||
for(const thing of Object.keys(memberjson)){
|
||||
this[thing]=memberjson[thing];
|
||||
}
|
||||
this.user=new user(this.user);
|
||||
}
|
||||
hasRole(ID){
|
||||
for(const thing of this.roles){
|
||||
console.log(this.roles)
|
||||
if(thing.id===ID){
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
isAdmin(){
|
||||
console.log(this);
|
||||
return this.guild.properties.owner_id===this.user.id;
|
||||
|
||||
}
|
||||
}
|
167
webpage/message.js
Normal file
167
webpage/message.js
Normal file
|
@ -0,0 +1,167 @@
|
|||
class cmessage{
|
||||
constructor(messagejson){
|
||||
for(const thing of Object.keys(messagejson)){
|
||||
this[thing]=messagejson[thing];
|
||||
}
|
||||
this.author=new user(this.author);
|
||||
}
|
||||
messageevents(obj){
|
||||
obj.classList.add("messagediv")
|
||||
obj.addEventListener("contextmenu", (event) => {
|
||||
event.preventDefault();
|
||||
makemenu(event.currentTarget,event.clientX,event.clientY)
|
||||
});
|
||||
}
|
||||
buildhtml(premessage){
|
||||
//premessage??=messages.lastChild;
|
||||
const build = document.createElement('table');
|
||||
const div=document.createElement("div");
|
||||
if(this.message_reference){
|
||||
const replyline=document.createElement("div");
|
||||
const line=document.createElement("hr");
|
||||
const minipfp=document.createElement("img")
|
||||
minipfp.classList.add("replypfp");
|
||||
replyline.appendChild(line);
|
||||
replyline.appendChild(minipfp);
|
||||
const username=document.createElement("span");
|
||||
replyline.appendChild(username);
|
||||
const reply=document.createElement("div");
|
||||
username.classList.add("replyusername")
|
||||
reply.classList.add("replytext");
|
||||
replyline.appendChild(reply);
|
||||
const line2=document.createElement("hr");
|
||||
replyline.appendChild(line2);
|
||||
line2.classList.add("reply");
|
||||
line.classList.add("startreply");
|
||||
replyline.classList.add("replyflex")
|
||||
fetch("https://old.server.spacebar.chat/api/v9/channels/"+this.message_reference.channel_id+"/messages?limit=1&around="+this.message_reference.message_id,{headers:{Authorization:token}}).then(responce=>responce.json()).then(responce=>{
|
||||
const author=new user(responce[0].author);
|
||||
|
||||
reply.appendChild(markdown(responce[0].content));
|
||||
|
||||
minipfp.src=author.getpfpsrc()
|
||||
profileclick(minipfp,author)
|
||||
username.innerText=author.username;
|
||||
profileclick(username,author)
|
||||
});
|
||||
div.appendChild(replyline);
|
||||
}
|
||||
|
||||
this.messageevents(div);
|
||||
messagelist.push(div)
|
||||
build.classList.add("message");
|
||||
if(this.content!=""||this.attachments.length!=0){
|
||||
const pfpRow = document.createElement('th');
|
||||
div.appendChild(build)
|
||||
let pfpparent, current
|
||||
if(premessage!=null){
|
||||
pfpparent=premessage.pfpparent;
|
||||
pfpparent??=premessage;
|
||||
let pfpparent2=pfpparent.all;
|
||||
pfpparent2??=pfpparent;
|
||||
const old=(new Date(pfpparent2.timestamp).getTime())/1000;
|
||||
const newt=(new Date(this.timestamp).getTime())/1000;
|
||||
current=(newt-old)>600;
|
||||
}
|
||||
const combine=(premessage?.userid!=this.author.id&premessage?.author?.id!=this.author.id)||(current)||this.message_reference
|
||||
if(combine){
|
||||
const pfp=this.author.buildpfp();
|
||||
profileclick(pfp,this.author);
|
||||
pfpRow.appendChild(pfp);
|
||||
}else{
|
||||
div.pfpparent=pfpparent;
|
||||
}
|
||||
pfpRow.classList.add("pfprow")
|
||||
build.appendChild(pfpRow);
|
||||
const text=document.createElement("th");
|
||||
|
||||
const texttxt=document.createElement("table");
|
||||
texttxt.classList.add("commentrow")
|
||||
text.appendChild(texttxt);
|
||||
if(combine){
|
||||
const username=document.createElement("span");
|
||||
username.classList.add("username")
|
||||
profileclick(username,this.author);
|
||||
username.innerText=this.author.username;
|
||||
const userwrap=document.createElement("tr")
|
||||
userwrap.appendChild(username)
|
||||
|
||||
const time=document.createElement("span");
|
||||
time.innerText=" "+formatTime(new Date(this.timestamp));
|
||||
time.classList.add("timestamp")
|
||||
userwrap.appendChild(time);
|
||||
|
||||
texttxt.appendChild(userwrap)
|
||||
}
|
||||
const messaged=markdown(this.content);
|
||||
div.txt=messaged;
|
||||
const messagedwrap=document.createElement("tr")
|
||||
messagedwrap.appendChild(messaged)
|
||||
texttxt.appendChild(messagedwrap)
|
||||
|
||||
build.appendChild(text)
|
||||
if(this.attachments.length!=0){
|
||||
const attatch = document.createElement("tr")
|
||||
for(const thing of this.attachments){
|
||||
const array=thing.url.split("/");array.shift();array.shift();array.shift();
|
||||
const src="https://cdn.old.server.spacebar.chat/"+array.join("/");
|
||||
if(thing.content_type.startsWith('image/')){
|
||||
const img=document.createElement("img");
|
||||
img.classList.add("messageimg")
|
||||
img.onclick=function(){
|
||||
const full=new fullscreen(["img",img.src,["fit"]]);
|
||||
full.show();
|
||||
}
|
||||
img.src=src;
|
||||
attatch.appendChild(img)
|
||||
}else{
|
||||
attatch.appendChild(createunknown(thing.filename,thing.size,src))
|
||||
}
|
||||
|
||||
}
|
||||
div.appendChild(attatch)
|
||||
}
|
||||
//
|
||||
}else{
|
||||
const text=document.createElement("th");
|
||||
|
||||
const texttxt=document.createElement("table");
|
||||
text.appendChild(texttxt);
|
||||
build.appendChild(text)
|
||||
|
||||
const messaged=document.createElement("p");
|
||||
div.txt=messaged;
|
||||
messaged.innerText="welcome: "+this.author.username;
|
||||
const messagedwrap=document.createElement("tr")
|
||||
messagedwrap.appendChild(messaged)
|
||||
texttxt.appendChild(messagedwrap)
|
||||
|
||||
}
|
||||
div.userid=this.author.id;
|
||||
div.all=this;
|
||||
return(div)
|
||||
}
|
||||
}
|
||||
|
||||
function formatTime(date) {
|
||||
const now = new Date();
|
||||
const sameDay = date.getDate() === now.getDate() &&
|
||||
date.getMonth() === now.getMonth() &&
|
||||
date.getFullYear() === now.getFullYear();
|
||||
|
||||
const yesterday = new Date(now);
|
||||
yesterday.setDate(now.getDate() - 1);
|
||||
const isYesterday = date.getDate() === yesterday.getDate() &&
|
||||
date.getMonth() === yesterday.getMonth() &&
|
||||
date.getFullYear() === yesterday.getFullYear();
|
||||
|
||||
const formatTime = date => date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
|
||||
|
||||
if (sameDay) {
|
||||
return `Today at ${formatTime(date)}`;
|
||||
} else if (isYesterday) {
|
||||
return `Yesterday at ${formatTime(date)}`;
|
||||
} else {
|
||||
return date.toLocaleDateString();
|
||||
}
|
||||
}
|
7
webpage/role.js
Normal file
7
webpage/role.js
Normal file
|
@ -0,0 +1,7 @@
|
|||
class role{
|
||||
constructor(JSON, owner){
|
||||
for(const thing of Object.keys(JSON)){
|
||||
this[thing]=JSON[thing];
|
||||
}
|
||||
}
|
||||
}
|
593
webpage/style.css
Normal file
593
webpage/style.css
Normal file
|
@ -0,0 +1,593 @@
|
|||
.imgfit{
|
||||
max-width: 80vw;
|
||||
max-height: 80vh;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
.centeritem {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background: #33363d;
|
||||
}
|
||||
.nonimagecenter{
|
||||
border-style: solid;
|
||||
border-radius:.1in;
|
||||
border-color: #1c1b31;
|
||||
}
|
||||
.background{
|
||||
position: absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
top:0px;
|
||||
background:#000000bf;
|
||||
}
|
||||
.messagediv:hover{
|
||||
background:rgb(30,30,40);
|
||||
}
|
||||
pre{
|
||||
background:#101014;
|
||||
width:100%;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
samp{
|
||||
background:#101014;
|
||||
}
|
||||
.contextbutton{
|
||||
transition: background 0.1s ease-in-out;
|
||||
background:rgb(30,30,40);
|
||||
color:white;
|
||||
font-weight:bold;
|
||||
width:5cm;
|
||||
height:.8cm;
|
||||
text-align:left;
|
||||
font-size:.5cm;
|
||||
cursor:pointer;
|
||||
}
|
||||
.infosection{
|
||||
display: inline-block;
|
||||
background:#1a1a1e;
|
||||
border-radius: 10%;
|
||||
padding:.3cm;
|
||||
width:calc(100% - .6cm);
|
||||
height:calc(100% - .75in);
|
||||
}
|
||||
.profile{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
background:#2e2d33;
|
||||
border-radius: 10%;
|
||||
padding:.2cm;
|
||||
width:7cm;
|
||||
height:8cm
|
||||
}
|
||||
.hypoprofile{
|
||||
display: inline-block;
|
||||
background:#2e2d33;
|
||||
border-radius: 10%;
|
||||
padding:.2cm;
|
||||
width:7cm;
|
||||
height:8cm
|
||||
}
|
||||
h2,h3{
|
||||
margin:0
|
||||
}
|
||||
h2{
|
||||
font-size:.2in;
|
||||
}
|
||||
.pfp{
|
||||
border-radius: 50%;
|
||||
width:.5in;
|
||||
height:.5in;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.servericon{
|
||||
transition: border-radius .2s;
|
||||
}
|
||||
.servericon:hover{
|
||||
border-radius: 30%;
|
||||
}
|
||||
.contextbutton:hover{
|
||||
background:rgb(40,40,50);
|
||||
}
|
||||
.contextmenu{
|
||||
position: absolute;
|
||||
background:#2e2d33;
|
||||
}
|
||||
#neunence{
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
height: 9vh;
|
||||
}
|
||||
#servers{
|
||||
vertical-align: top;
|
||||
height: 100vh;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#servers::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.blankserver{
|
||||
border-radius: 50%;
|
||||
width:.5in;
|
||||
height:.5in;
|
||||
background:#1b1b1b;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
body{
|
||||
background:rgb(40,40,50);
|
||||
color:white;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
img {
|
||||
vertical-align: middle;
|
||||
max-width: 3in;
|
||||
max-height: 3in;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
table {
|
||||
/* border-collapse: collapse; */
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#page{
|
||||
height:100%;
|
||||
width:100%;
|
||||
/* table-layout: fixed; */
|
||||
}
|
||||
.message{
|
||||
width:100%;
|
||||
}
|
||||
.pfprow{
|
||||
width:.5in;
|
||||
}
|
||||
.commentrow{
|
||||
width:100%;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
#messagecontainer{
|
||||
overflow: auto;
|
||||
height: 100%;
|
||||
width:100%;
|
||||
display: inline-block;
|
||||
}
|
||||
#messages{
|
||||
width:100%;
|
||||
}
|
||||
p{
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
#channels{
|
||||
background:rgb(50,50,60);
|
||||
height: calc(100% - .6in);
|
||||
width: 2.5in;
|
||||
overflow: auto;
|
||||
user-select: none;
|
||||
}
|
||||
#userdock{
|
||||
height: .5in;
|
||||
}
|
||||
#channels p{
|
||||
text-indent:10px;
|
||||
}
|
||||
.space{
|
||||
margin-right:.02in;
|
||||
font-size:.25in;
|
||||
display:inline-block;
|
||||
text-indent:.05in;
|
||||
}
|
||||
.spacee{
|
||||
text-indent:.15in;
|
||||
margin-right:.02in;
|
||||
font-size:.15in;
|
||||
display:inline-block;
|
||||
|
||||
}
|
||||
#channels p2{
|
||||
font-weight:bold;
|
||||
}
|
||||
input{
|
||||
background:rgb(30,30,40);
|
||||
color:white;
|
||||
height: .4in;
|
||||
width:100%;
|
||||
}
|
||||
div{
|
||||
transition: background 0.1s ease-in-out;
|
||||
}
|
||||
#typebox{
|
||||
border-radius: .25cm;
|
||||
width: 100%;
|
||||
height: .5in;
|
||||
z-index: -100;
|
||||
}
|
||||
|
||||
p{
|
||||
transition: background 0.1s ease-in-out;
|
||||
transition: color 0.1s ease-in-out;
|
||||
width: 100%;
|
||||
}
|
||||
.username{
|
||||
width:fit-content;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
.spoiler{
|
||||
background:black;
|
||||
color:black;
|
||||
}
|
||||
.spoiler:hover{
|
||||
background:#111111;
|
||||
color:#111111;
|
||||
}
|
||||
.unspoiled{
|
||||
background:#1e1e1e;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.unspoiled:before {
|
||||
background-color: rgb(0 0 0);
|
||||
background-clip: content-box;
|
||||
}
|
||||
.replying{
|
||||
background:#0b0d20;
|
||||
}
|
||||
#typing{
|
||||
display: flex;
|
||||
position:absolute;
|
||||
top:0px;
|
||||
right:4px;
|
||||
background:#161616;
|
||||
width:fit-content;
|
||||
transform: translateY(-100%);
|
||||
border-radius: 5px 5px 0 0;
|
||||
padding: 4px;
|
||||
transition: transform 0.5s ease, opacity 0.1s ease;
|
||||
opacity: 1;
|
||||
position: absolute;
|
||||
}
|
||||
#typediv{position: relative;}
|
||||
|
||||
.loading-indicator {
|
||||
font-size: 24px;
|
||||
display: flex;
|
||||
gap: 0px;
|
||||
}
|
||||
|
||||
.dot {
|
||||
animation: fade 1s infinite;
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
.dot:nth-child(1) {
|
||||
animation-delay: 0s;
|
||||
}
|
||||
|
||||
.dot:nth-child(2) {
|
||||
animation-delay: 0.333s;
|
||||
}
|
||||
|
||||
.dot:nth-child(3) {
|
||||
animation-delay: .666s;
|
||||
}
|
||||
#typing p {
|
||||
margin: 0;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
#typing.hidden {
|
||||
transform: translateY(0%); /* Move down out of view */
|
||||
opacity: 0; /* Fade out */
|
||||
}
|
||||
@keyframes fade {
|
||||
0%, 100% {
|
||||
opacity: .2;
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.lightbr{
|
||||
border-color: #929292;
|
||||
color:black;
|
||||
background-color:black;
|
||||
width:80%;
|
||||
}
|
||||
.home{
|
||||
border-radius: 50%;
|
||||
width:.5in;
|
||||
height:.5in;
|
||||
background:#1b1b1b;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items:center;
|
||||
font-size:200%;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
:root {
|
||||
--servertd-height: 0px; /* Default value */
|
||||
}
|
||||
#channelw{
|
||||
width:100%;
|
||||
display: inline-block;
|
||||
grid-template-rows: auto 1fr;
|
||||
height: calc(100vh - .1in - var(--servertd-height));
|
||||
}
|
||||
.timestamp{
|
||||
color:#a2a2a2;
|
||||
font-size:.14in;
|
||||
}
|
||||
.replyflex{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.reply{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
flex-grow: 1;
|
||||
border-color:#474b76;
|
||||
}
|
||||
.startreply{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width:.4in;
|
||||
}
|
||||
.replypfp{
|
||||
border-radius: 50%;
|
||||
width:.2in;
|
||||
height:2.in;
|
||||
padding:.05in;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.replytext{
|
||||
padding:.05in;
|
||||
color:#acacac;
|
||||
}
|
||||
::-webkit-scrollbar {width: .1in;height:.1in;}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
|
||||
background: #34313c;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #201f29;
|
||||
box-shadow: 0px 2px 5px #000000;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #16161f;
|
||||
box-shadow: 0px 2px 5px #000000;
|
||||
}
|
||||
.pronouns{
|
||||
color: #797979;
|
||||
font-size:.15in;
|
||||
}
|
||||
textarea{
|
||||
background:#26272c;
|
||||
color:white;
|
||||
width: 3.5in;
|
||||
resize: none;
|
||||
height: 1.5in;
|
||||
}
|
||||
.channels{
|
||||
overflow:auto;
|
||||
transition: height 0.2s ease-in-out;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.channel:hover{
|
||||
background:#1c1b25;
|
||||
}
|
||||
.channel{
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
#serverName{
|
||||
margin-top:.1in;
|
||||
margin-bottom:.1in;
|
||||
}
|
||||
.servertd{
|
||||
background:#252530;
|
||||
border-color:#1b1b24;
|
||||
border-width:.1cm;
|
||||
border-style: solid;
|
||||
height: .2in;
|
||||
}
|
||||
/*
|
||||
#channels div div{
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
#channels div div:hover{
|
||||
background:#1c1b25;
|
||||
}
|
||||
*/
|
||||
.channeleffects{
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
flex-direction: row;
|
||||
align-self: stretch;
|
||||
width: 100%;
|
||||
}
|
||||
.messageimg{
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.channeleffects:hover{
|
||||
background:#1c1b25;
|
||||
}
|
||||
.username:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
.tag{
|
||||
font-size:.13in;
|
||||
color:white;
|
||||
}
|
||||
#userdock{
|
||||
background:#1a1a23;
|
||||
width:100%;
|
||||
}
|
||||
#settings{
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
border-radius:.1in;
|
||||
transition: background 1s;
|
||||
text-align: center;
|
||||
}
|
||||
#settings:hover{
|
||||
background:#0e0d10;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
#userinfo{
|
||||
background:#323039;
|
||||
border-radius:.1in;
|
||||
}
|
||||
.replyusername{
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
word-break: normal;
|
||||
}
|
||||
.replyusername:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
.servernamediv{
|
||||
width:100%;
|
||||
}
|
||||
button{
|
||||
color:white;
|
||||
background:#1b1b28;
|
||||
border-radius:.05in;
|
||||
height:.3in;
|
||||
min-width: 1.3in;
|
||||
font-size:.175in;
|
||||
}
|
||||
input::file-selector-button{
|
||||
color:white;
|
||||
background:#1b1b28;
|
||||
border-radius:.05in;
|
||||
height:.25in;
|
||||
min-width: 1in;
|
||||
}
|
||||
#logindiv{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background: #33363d;
|
||||
min-width:max(min(70%,calc(50% + .5in)),min(3in,100%));
|
||||
min-height:70%;
|
||||
border-radius:.1in;
|
||||
border-style:solid;
|
||||
border-color:#131315;
|
||||
text-align: center;
|
||||
}
|
||||
#logindiv input{
|
||||
width:90%;
|
||||
border-radius:.1in;
|
||||
}
|
||||
.adddiv{
|
||||
display: inline-block;
|
||||
height: 0in;
|
||||
align-self: stretch;
|
||||
}
|
||||
.addchannel{
|
||||
align-self: end;
|
||||
margin-left: auto;
|
||||
width:.2in;
|
||||
text-align: center;
|
||||
transition: background .2s;
|
||||
border-radius:.1in;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
.addchannel:hover{
|
||||
background:#000000;
|
||||
}
|
||||
.capsflex{
|
||||
display:flex;
|
||||
}
|
||||
.radio{
|
||||
width:.15in;
|
||||
height: .15in;
|
||||
}
|
||||
.channels .space{
|
||||
text-indent:.15in;
|
||||
}
|
||||
input[type="checkbox"] {
|
||||
width:.15in;
|
||||
height:.15in;
|
||||
accent-color:black;
|
||||
color:black;
|
||||
}
|
||||
.dragdiv{
|
||||
height:.3in;
|
||||
}
|
||||
.quote{
|
||||
display:inline-block;
|
||||
width:fit-content;
|
||||
}
|
||||
.quoteline{
|
||||
display:inline-block;
|
||||
width:.02in;
|
||||
height:.15in;
|
||||
margin-left:.02in;
|
||||
margin-right:.04in;
|
||||
background:#7a798e;
|
||||
}
|
||||
span{
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
}
|
||||
#loading{
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background:#22232c;
|
||||
z-index:100;
|
||||
text-align: center;
|
||||
transition: transform .2s;
|
||||
vertical-align: middle
|
||||
}
|
||||
#centerdiv{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
#loading.doneloading{
|
||||
transform:translate(0%, -100%)
|
||||
}
|
||||
.unkownfile{
|
||||
background:#141316;
|
||||
border-style:solid;
|
||||
border-radius:.1in;
|
||||
border-color:#474555;
|
||||
border-width:.03in;
|
||||
display:inline-block;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.fileicon{
|
||||
font-size:.4in;
|
||||
user-select: none;
|
||||
}
|
||||
.filename{
|
||||
color:#47bbff;
|
||||
}
|
73
webpage/user.js
Normal file
73
webpage/user.js
Normal file
|
@ -0,0 +1,73 @@
|
|||
const usercache={};
|
||||
class user{
|
||||
static userids={};
|
||||
static checkuser(userjson){
|
||||
if(user.userids[userjson.id]){
|
||||
return user.userids[userjson.id];
|
||||
}else{
|
||||
const tempuser=new user(userjson,true)
|
||||
user.userids[userjson.id]=tempuser;
|
||||
return tempuser;
|
||||
}
|
||||
}
|
||||
constructor(userjson,dontclone=false){
|
||||
if(dontclone){
|
||||
console.log("new user")
|
||||
for(const thing of Object.keys(userjson)){
|
||||
this[thing]=userjson[thing];
|
||||
}
|
||||
this.hypotheticalpfp=false;
|
||||
}else{
|
||||
return user.checkuser(userjson);
|
||||
}
|
||||
}
|
||||
async resolvemember(guild){
|
||||
let str;
|
||||
if(usercache[this.id+"+"+guild.id]){
|
||||
return usercache[this.id+"+"+guild.id];
|
||||
}else{
|
||||
const tempy=new Promise((resolve, reject) => {
|
||||
usercache[this.id+"+"+guild.id]={done:false};
|
||||
fetch("https://old.server.spacebar.chat/api/v9/users/"+this.id+"/profile?with_mutual_guilds=true&with_mutual_friends_count=false&guild_id="+guild.id).then(json).then(str=>{
|
||||
return new member(str);
|
||||
});
|
||||
});
|
||||
usercache[this.id+"+"+guild.id]=tempy;
|
||||
}
|
||||
}
|
||||
buildpfp(){
|
||||
const pfp=document.createElement('img');
|
||||
pfp.src=this.getpfpsrc(this.id,this.avatar);
|
||||
pfp.classList.add("pfp");
|
||||
pfp.classList.add("userid:"+this.id);
|
||||
return pfp;
|
||||
}
|
||||
userupdate(json){
|
||||
if(json.avatar!==this.avatar){
|
||||
console.log
|
||||
this.changepfp(json.avatar);
|
||||
}
|
||||
}
|
||||
changepfp(update){
|
||||
this.avatar=update;
|
||||
this.hypotheticalpfp=false;
|
||||
const src=this.getpfpsrc();
|
||||
console.log(src)
|
||||
for(thing of document.getElementsByClassName("userid:"+this.id)){
|
||||
thing.src=src;
|
||||
}
|
||||
}
|
||||
getpfpsrc(){
|
||||
if(this.hypotheticalpfp){
|
||||
return this.avatar;
|
||||
}
|
||||
if(this.avatar!=null){
|
||||
return "https://cdn.old.server.spacebar.chat/avatars/"+this.id+"/"+this.avatar+".png";
|
||||
}else{
|
||||
return "https://cdn.old.server.spacebar.chat/embed/avatars/3.png";
|
||||
}
|
||||
}
|
||||
createjankpromises(){
|
||||
new Promise(_=>{})
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue