Reaction support

.dist/message.js

@@ -5,6 +5,8 @@ import { MarkDown } from "./markdown.js";
 import { Embed } from "./embed.js";
 import { File } from "./file.js";
 import { SnowFlake } from "./snowflake.js";
+import { Emoji } from "./emoji.js";
+new Emoji();
 class Message {
     static contextmenu = new Contextmenu("message menu");
     owner;
@@ -23,6 +25,7 @@ class Message {
     static resolve;
     div;
     member;
+    reactions;
     get id() {
         return this.snowflake.id;
     }
@@ -46,6 +49,12 @@ class Message {
         Message.contextmenu.addbutton("Copy message id", function () {
             navigator.clipboard.writeText(this.id);
         });
+        Message.contextmenu.addsubmenu("Add reaction", function (e) {
+            Emoji.emojiPicker(e.x, e.y).then(_ => {
+                console.log(_, ":3");
+                this.reactionToggle(_);
+            });
+        });
         Message.contextmenu.addbutton("Edit", function () {
             this.channel.editing = this;
             const markdown = (document.getElementById("typebox"))["markdown"];
@@ -61,6 +70,24 @@ class Message {
         this.headers = this.owner.headers;
         this.giveData(messagejson);
     }
+    reactionToggle(emoji) {
+        if (typeof emoji === "string") {
+            let remove = false;
+            for (const thing of this.reactions) {
+                if (thing.emoji.name === emoji) {
+                    remove = thing.me;
+                    break;
+                }
+            }
+            fetch(this.info.api.toString() + "/channels/" + this.channel.id + "/messages/" + this.id + "/reactions/" + encodeURIComponent(emoji) + "/@me", {
+                method: remove ? "DELETE" : "PUT",
+                headers: this.headers,
+            });
+        }
+        else {
+            emoji;
+        }
+    }
     giveData(messagejson) {
         for (const thing of Object.keys(messagejson)) {
             if (thing === "attachments") {
@@ -92,6 +119,9 @@ class Message {
             }
             this[thing] = messagejson[thing];
         }
+        if (messagejson.reactions?.length) {
+            console.log(messagejson.reactions, ":3");
+        }
         this.author = new User(messagejson.author, this.localuser);
         for (const thing in messagejson.mentions) {
             this.mentions[thing] = new User(messagejson.mentions[thing], this.localuser);
@@ -184,6 +214,7 @@ class Message {
             this.channel.lastmessage = prev.getObject();
         }
     }
+    reactdiv;
     generateMessage(premessage = null) {
         if (!premessage) {
             premessage = this.channel.idToPrev.get(this.snowflake)?.getObject();
@@ -207,25 +238,6 @@ class Message {
             const reply = document.createElement("div");
             username.classList.add("username");
             this.author.bind(username, this.guild);
-            /*
-            Member.resolve(this.author,this.guild).then(_=>{
-                if(!_) {return};
-                console.log(_.error);
-                if(_.error){
-                    username.textContent+="Error";
-                    alert("Should've gotten here")
-                    const error=document.createElement("span");
-                    error.textContent="!";
-                    error.classList.add("membererror");
-                    username.after(error);
-
-                    return;
-                }
-                username.style.color=_.getColor();
-            }).catch(_=>{
-                console.log(_)
-            });
-            */
             reply.classList.add("replytext");
             replyline.appendChild(reply);
             const line2 = document.createElement("hr");
@@ -352,8 +364,76 @@ class Message {
             div.classList.add("topMessage");
         }
         div["all"] = this;
+        const reactions = document.createElement("div");
+        reactions.classList.add("flexltr", "reactiondiv");
+        this.reactdiv = new WeakRef(reactions);
+        this.updateReactions();
+        div.append(reactions);
         return (div);
     }
+    updateReactions() {
+        const reactdiv = this.reactdiv.deref();
+        if (!reactdiv)
+            return;
+        reactdiv.innerHTML = "";
+        for (const thing of this.reactions) {
+            console.log(thing, ":3");
+            const reaction = document.createElement("div");
+            reaction.classList.add("reaction");
+            if (thing.me) {
+                reaction.classList.add("meReacted");
+            }
+            const emoji = document.createElement("p");
+            emoji.textContent = thing.emoji.name;
+            reaction.append(emoji);
+            const count = document.createElement("p");
+            count.textContent = "" + thing.count;
+            count.classList.add("reactionCount");
+            reaction.append(count);
+            reactdiv.append(reaction);
+            reaction.onclick = _ => {
+                this.reactionToggle(thing.emoji.name);
+            };
+        }
+    }
+    giveReaction(data, member) {
+        for (const thing of this.reactions) {
+            if (thing.emoji.name === data.name) {
+                thing.count++;
+                if (member.id === this.localuser.user.id) {
+                    thing.me = true;
+                    this.updateReactions();
+                    return;
+                }
+            }
+        }
+        this.reactions.push({
+            count: 1,
+            emoji: data,
+            me: member.id === this.localuser.user.id
+        });
+        this.updateReactions();
+    }
+    takeReaction(data, id) {
+        console.log("test");
+        for (const i in this.reactions) {
+            const thing = this.reactions[i];
+            console.log(thing, data);
+            if (thing.emoji.name === data.name) {
+                thing.count--;
+                if (thing.count === 0) {
+                    this.reactions.splice(+i, 1);
+                    this.updateReactions();
+                    return;
+                }
+                if (id === this.localuser.user.id) {
+                    thing.me = false;
+                    this.updateReactions();
+                    return;
+                }
+            }
+        }
+    }
     buildhtml(premessage, del = Message.del) {
         if (this.div) {
             console.error(`HTML for ${this.snowflake} already exists, aborting`);