scripts/gui/chat.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149

'use strict';

class Chat {
    constructor(e)
    {
        this.chats = [];
        this.root = e;
        e.getElementsByClassName("toggle-chat")[0].onclick = this.toggle.bind(this);
    }

    getChannel (name)
    {
        for(let i in this.chats)
        {
            if (this.chats[i].name == name)
            {
                return this.chats[i];
            }
        }

        return null;
    }

    isActive (name)
    {
        for(let i in this.chats)
        {
            if (this.chats[i].name == name)
            {
                if(this.chats[i].btn.getAttribute("active") == "true")
                    return true;
                return false;
            }
        }

        return false;
    }

    addChannel (name, follow = true)
    {
        if(this.getChannel(name) != null)
            return;

        let d = document.createElement("div");
        let b = document.createElement("button");

        this.root.getElementsByClassName("chat-select")[0].appendChild(b);

        b.setAttribute("active", false);

        b.onclick = this.switchChannel.bind(this, name);

        b.innerText = name[0].toUpperCase() + name.slice(1).toLowerCase();

        d.className = "chat-text";

        this.chats.push({name: name, e: d, btn: b});

        if(follow)
            this.switchChannel(name)
    }

    getActiveChannel ()
    {
        for(let i in this.chats)
        {
            if (this.chats[i].btn.getAttribute("active") == "true")
            {
                return this.chats[i];
            }
        }

        return null;
    }

    switchChannel (name)
    {
        let c = this.getChannel(name);
        
        if(c == null)
            return;

        if(this.getActiveChannel() != null)
            this.getActiveChannel().btn.setAttribute("active", false);

        c.btn.setAttribute("active", true);
        var ct = this.root.getElementsByClassName("chat-text")[0];
        ct.replaceWith(c.e);

        c.e.scroll({
            top: c.e.scrollTopMax
        });
    }

    recieveMessage (channel, msg)
    {
        let c = this.getChannel(channel);
        
        if(c == null)
            return;
        
        let autoscroll = c.e.scrollTop == c.e.scrollTopMax;

        let csp = document.createElement("span");
        csp.style.color = msg.color;
        csp.innerText = msg.user + ": ";
        let tsp = document.createElement("span");
        tsp.innerText = msg.text;
        let d = document.createElement("div");
        d.appendChild(csp);
        d.appendChild(tsp);

        c.e.appendChild(d);

        if(autoscroll)
            c.e.scroll({top: c.e.scrollTopMax});
    }

    clearChannel (name)
    {
        let c = this.getChannel(name);
        if(c == null)
            return;
        
        while(c.e.firstElementChild != null)
            c.e.firstElementChild.remove();
    }

    deleteChannel (name)
    {
        let c = this.getChannel(name);
        if(c == null)
            return;
        
        while(c.e.firstElementChild != null)
            c.e.firstElementChild.remove();
        
        c.btn.remove();

        this.chats.splice(this.chats.indexOf(c), 1);
    }

    toggle () {
        if(this.root.getAttribute("show") != "true")
            this.root.setAttribute("show", "true");
        else
            this.root.setAttribute("show", "false");
    }
}