diff --git a/index.js b/index.js
index 5bfa988..3b11994 100755
--- a/index.js
+++ b/index.js
@@ -18,6 +18,10 @@ app.get('/register.js', (req, res) => {
app.get('/dirrect.js', (req, res) => {
res.sendFile("./webpage/dirrect.js", {root: __dirname})
})
+app.get('/contextmenu.js', (req, res) => {
+ res.sendFile("./webpage/contextmenu.js", {root: __dirname})
+})
+//
app.get('/login.js', (req, res) => {
res.sendFile("./webpage/login.js", {root: __dirname})
})
diff --git a/webpage/channel.js b/webpage/channel.js
index 91e2772..a6deb29 100644
--- a/webpage/channel.js
+++ b/webpage/channel.js
@@ -1,4 +1,26 @@
+"use strict"
class channel{
+ static contextmenu=new contextmenu("channel menu");
+ static setupcontextmenu(){
+ channel.contextmenu.addbutton("Copy channel id",function(){
+ console.log(this)
+ navigator.clipboard.writeText(this.id);
+ })
+
+ channel.contextmenu.addbutton("Mark as read",function(){
+ console.log(this)
+ this.readbottom();
+ })
+
+ channel.contextmenu.addbutton("Delete channel",function(){
+ console.log(this)
+ this.deleteChannel();
+ },null,_=>{return thisuser.isAdmin()})
+
+ channel.contextmenu.addbutton("Edit channel",function(){
+ editchannelf(this);
+ },null,_=>{return thisuser.isAdmin()})
+ }
constructor(JSON,owner){
if(JSON===-1){
return;
@@ -105,7 +127,7 @@ class channel{
decdiv.classList.add("channeleffects");
decdiv.classList.add("channel");
- lacechannel(decdiv);
+ channel.contextmenu.bind(decdiv,this);
decdiv.all=this;
@@ -131,7 +153,7 @@ class channel{
if(this.hasunreads){
div.classList.add("cunread");
}
- lacechannel(div);
+ channel.contextmenu.bind(div,this);
if(admin){this.coatDropDiv(div,this);}
div.all=this;
const myhtml=document.createElement("span");
@@ -450,3 +472,4 @@ class channel{
}
}
}
+channel.setupcontextmenu();
diff --git a/webpage/contextmenu.js b/webpage/contextmenu.js
new file mode 100644
index 0000000..c5a4433
--- /dev/null
+++ b/webpage/contextmenu.js
@@ -0,0 +1,43 @@
+class contextmenu{
+ constructor(name){
+ this.name=name;
+ this.buttons=[]
+
+ }
+ addbutton(text,onclick,img=null,shown=_=>{return true}){
+ this.buttons.push([text,onclick,img,shown])
+ return {};
+ }
+ makemenu(x,y,addinfo,obj){
+ const div=document.createElement("table");
+ div.classList.add("contextmenu");
+ for(const thing of this.buttons){
+ if(!thing[3](addinfo)){continue;}
+ const textb=document.createElement("tr");
+ const intext=document.createElement("button")
+ textb.button=intext;
+ intext.classList.add("contextbutton")
+ intext.innerText=thing[0]
+ textb.appendChild(intext)
+ console.log(thing)
+ intext.onclick=thing[1].bind(addinfo,obj);
+ div.appendChild(textb);
+ }
+ if(currentmenu!=""){
+ currentmenu.remove();
+ }
+ div.style.top = y+'px';
+ div.style.left = x+'px';
+ document.body.appendChild(div);
+ console.log(div)
+ currentmenu=div;
+ return this.div;
+ }
+ bind(obj,addinfo){
+ obj.addEventListener("contextmenu", (event) => {
+ event.preventDefault();
+ event.stopImmediatePropagation();
+ this.makemenu(event.clientX,event.clientY,addinfo,obj)
+ });
+ }
+}
diff --git a/webpage/index.html b/webpage/index.html
index 8454190..b855ca2 100644
--- a/webpage/index.html
+++ b/webpage/index.html
@@ -10,6 +10,7 @@
+
@@ -20,6 +21,7 @@
+
Jank Client is loading
This shouldn't take long
diff --git a/webpage/index.js b/webpage/index.js
index bfa0b93..a1ed915 100644
--- a/webpage/index.js
+++ b/webpage/index.js
@@ -21,18 +21,6 @@ let ws
initwebsocket();
let READY;
-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==""){
@@ -44,15 +32,19 @@ document.addEventListener('click', function(event) {
}
});
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);
- });
+{
+ const menu=new contextmenu("create backclick");
+ menu.addbutton("Create channel",function(){
+ createchannels(thisuser.lookingguild.createChannel.bind(thisuser.lookingguild));
+ },null,_=>{return thisuser.isAdmin()})
+
+ menu.addbutton("Create category",function(){
+ createcategory(thisuser.lookingguild.createChannel.bind(thisuser.lookingguild));
+ },null,_=>{return thisuser.isAdmin()})
+ menu.bind(document.getElementById("channels"))
}
+
function createchannels(fincall){
let name="";
let category=2;
@@ -98,139 +90,7 @@ function createcategory(fincall){
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);
- const readall=createbutton("Mark as read",null,function(){
- console.log(channel)
- channel.readbottom();
- })
- readall.button.all=divmessage.all;
- build.appendChild(readall);
-
-
- 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 category",null,function(){
- createcategory(thisuser.lookingguild.createChannel.bind(thisuser.lookingguild));
- })
- createcat.button.all=divmessage.all;
- build.appendChild(createcat);
- //createcategory
- }
- }
-
- 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(info.api.toString()+"/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!=""){
@@ -302,12 +162,15 @@ function profileclick(obj,author){
}
var editing=false;
-document.getElementById("typebox").addEventListener("keyup",enter);
-console.log(document.getElementById("typebox"))
-document.getElementById("typebox").onclick=console.log;
+const typebox=document.getElementById("typebox")
+typebox.addEventListener("keyup",enter);
+typebox.addEventListener("keydown",event=>{
+ if(event.key === "Enter"&&!event.shiftKey) event.preventDefault();
+});
+console.log(typebox)
+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){
@@ -317,10 +180,10 @@ async function enter(event){
"Content-type": "application/json; charset=UTF-8",
Authorization:token
},
- body:JSON.stringify({content:tis.value})
+ body:JSON.stringify({content:typebox.value})
})
- tis.value="";
+ typebox.value="";
editing=false;
}else{
let replyjson=false;
@@ -338,7 +201,7 @@ async function enter(event){
if(images.length==0){
const body={
- content:tis.value,
+ content:typebox.value,
nonce:Math.floor(Math.random()*1000000000)
};
if(replyjson){
@@ -357,11 +220,11 @@ async function enter(event){
console.log(out,"here it is")
}
)
- tis.value="";
+ typebox.value="";
}else{
let formData = new FormData();
const body={
- content:tis.value,
+ content:typebox.value,
nonce:Math.floor(Math.random()*1000000000),
}
if(replyjson){
@@ -387,7 +250,7 @@ async function enter(event){
images.pop()
pasteimage.removeChild(imageshtml.pop())
}
- tis.value="";
+ typebox.value="";
}
}
}
diff --git a/webpage/login.js b/webpage/login.js
index 27f048b..8d16335 100644
--- a/webpage/login.js
+++ b/webpage/login.js
@@ -38,12 +38,13 @@ if(instancein){
clearTimeout(timeout);
timeout=setTimeout(checkInstance,1000);
});
+ if(localStorage.getItem("instanceinfo")){
+ instancein.value=JSON.parse(localStorage.getItem("instanceinfo")).wellknown
+ }else{
+ checkInstance("https://spacebar.chat/");
+ }
}
-if(localStorage.getItem("instanceinfo")){
- instancein.value=JSON.parse(localStorage.getItem("instanceinfo")).wellknown
-}else{
- checkInstance("https://spacebar.chat/");
-}
+
async function login(username, password){
const options={
diff --git a/webpage/message.js b/webpage/message.js
index e7cbd8c..eb2cead 100644
--- a/webpage/message.js
+++ b/webpage/message.js
@@ -1,4 +1,37 @@
class cmessage{
+ static contextmenu=new contextmenu("message menu");
+ static setupcmenu(){
+ cmessage.contextmenu.addbutton("Copy raw text",function(){
+ console.log(this)
+ navigator.clipboard.writeText(this.content);
+ })
+ cmessage.contextmenu.addbutton("Reply",function(div){
+ console.log(this)
+ if(replyingto){
+ replyingto.classList.remove("replying");
+ }
+ replyingto=div;
+ console.log(div);
+ replyingto.classList.add("replying");
+ })
+ cmessage.contextmenu.addbutton("Copy message id",function(){
+ console.log(this)
+ navigator.clipboard.writeText(this.id);
+ })
+ cmessage.contextmenu.addbutton("Message user",function(){
+ console.log(this)
+ fetch(info.api.toString()+"/v9/users/@me/channels",
+ {method:"POST",
+ body:JSON.stringify({"recipients":[this.author.id]}),
+ headers: {"Content-type": "application/json; charset=UTF-8",Authorization:token}
+ });
+ })
+ cmessage.contextmenu.addbutton("Edit",function(){
+ console.log(this)
+ editing=this.id;
+ document.getElementById("typebox").value=this.content;
+ },null,_=>{return _.author.id==READY.d.user.id});
+ }
constructor(messagejson){
for(const thing of Object.keys(messagejson)){
this[thing]=messagejson[thing];
@@ -7,11 +40,8 @@ class cmessage{
console.log(this.type)
}
messageevents(obj){
+ cmessage.contextmenu.bind(obj,this)
obj.classList.add("messagediv")
- obj.addEventListener("contextmenu", (event) => {
- event.preventDefault();
- makemenu(event.currentTarget,event.clientX,event.clientY)
- });
}
buildhtml(premessage){
//premessage??=messages.lastChild;
@@ -175,3 +205,4 @@ function formatTime(date) {
return `${date.toLocaleDateString()} at ${formatTime(date)}`;
}
}
+cmessage.setupcmenu();
diff --git a/webpage/style.css b/webpage/style.css
index 11403fc..b57af28 100644
--- a/webpage/style.css
+++ b/webpage/style.css
@@ -64,7 +64,7 @@ samp {
.contextbutton {
transition: background .1s ease-in-out;
- background-color: var(--message-bg-hover);
+ background-color: var(--channels-bg);
color: var(--primary-text);
font-weight: bold;
width: 5cm;
@@ -72,6 +72,8 @@ samp {
text-align: left;
font-size: .5cm;
cursor: pointer;
+ border-width: 0px 0px .03in;
+ margin: .02in .05in;
}
.infosection {
@@ -137,7 +139,8 @@ h2 {
.contextmenu {
position: absolute;
- background-color: var(--profile-bg);
+ background-color: var(--profile-info-bg);
+ border-radius: .05in;
}
#neunence {