lib/Client/memoryclient.js   B
last analyzed

Complexity

Total Complexity 37
Complexity/F 2.47

Size

Lines of Code 264
Function Count 15

Duplication

Duplicated Lines 0
Ratio 0 %

Importance

Changes 1
Bugs 0 Features 0
Metric Value
c 1
b 0
f 0
nc 8
dl 0
loc 264
rs 8.6
noi 12
cc 0
wmc 37
mnd 6
bc 41
fnc 15
bpm 2.7333
cpm 2.4666

10 Functions

Rating   Name   Duplication   Size   Complexity  
A memoryclient.js ➔ doCheck 0 9 2
B memoryclient.js ➔ renderClientArea 0 24 5
A connect.addEventListener(ꞌclickꞌ) 0 56 1
A sendmessage.addEventListener(ꞌclickꞌ) 0 17 3
A memoryclient.js ➔ addClientMsg 0 15 1
B memoryclient.js ➔ renderGameBoard 0 49 6
A memoryclient.js ➔ setPlayerparams 0 5 1
A startgame.addEventListener(ꞌclickꞌ) 0 14 3
A close.addEventListener(ꞌclickꞌ) 0 13 1
A nextturnbtn.addEventListener(ꞌclickꞌ) 0 14 3
1
(function () {
2
    let websocket;
3
    let connect     = document.getElementById("connect");
4
    let nickname    = document.getElementById('nickname');
5
    let clientlist  = document.getElementById("clientarea");
6
    let output      = document.getElementById("msgarea");
7
    let sendmessage = document.getElementById("messagebtn");
8
    let startgame   = document.getElementById("startgame");
9
    let nextturnbtn = document.getElementById("nextturnbtn");
10
    let clientmessage = document.getElementById("message");
11
    let close       = document.getElementById("disconnectbtn");
12
    var player;
13
14
    player = {
15
        nickname: 'anon',
16
        colorclass: 'blackplayer'
17
    };
18
19
    /**
20
    * Check nickname inputfield. If empty disable connectionbtn.
21
    */
22
    function doCheck() {
23
        var nicknamevalue;
24
25
        if (nicknamevalue === '') {
0 ignored issues
show
Bug introduced by
The variable nicknamevalue seems to be never initialized.
Loading history...
26
            document.getElementById("connect").disabled = true;
27
        } else {
28
            document.getElementById("connect").disabled = false;
29
        }
30
    }
31
32
    // Checking nickname inputfield when keyup or when focusout
33
    $('#nickname').keyup(doCheck).focusout(doCheck);
34
35
    function renderClientArea(jsonmsg) {
36
        var HTMLlist = "";
37
        var yourturn = "";
38
39
        if (jsonmsg.playersturn == undefined) {
40
            yourturn = "";
0 ignored issues
show
Unused Code introduced by
The assignment to variable yourturn seems to be never used. Consider removing it.
Loading history...
41
        }
42
43
        clientlist.innerHTML = "";
44
        for (var i = 0; i < jsonmsg.userarray.length; i++) {
45
            if (jsonmsg.userarray[i] === jsonmsg.playersturn) {
46
                yourturn = "- din tur";
47
            } else {
48
                yourturn = "";
49
            }
50
            if (jsonmsg.userarray[i] === player.nickname) {
51
                HTMLlist += "<p class="+jsonmsg.userscolors[i]+
52
                "><strong>"+jsonmsg.userarray[i]+"</strong> "+yourturn+"</p>";
53
            } else {
54
                HTMLlist += "<p class="+jsonmsg.userscolors[i]+">"+jsonmsg.userarray[i]+" "+yourturn+"</p>";
55
            }
56
        }
57
        clientlist.innerHTML = HTMLlist;
58
    }
59
60
    function renderGameBoard(gameboard) {
61
        var gameboardhtml;
62
        var gameboardrow;
63
        var card;
64
        var cardholder;
65
66
        document.getElementById("gameboard").innerHTML = "";
67
        gameboardhtml = document.createElement("table");
68
        gameboardhtml.setAttribute("class", "gameboardtable");
69
70
        for (let y = 0; y < gameboard.height; y++) {
71
            gameboardrow = document.createElement("tr");
72
            for (let x = 0; x < gameboard.width; x++) {
73
                cardholder = document.createElement("td");
74
                card = document.createElement("button");
75
                card.setAttribute("id", "place_"+x+"_"+y);
76
                card.setAttribute("class", "cardholder");
77
                if (gameboard.position.indexOf(x+""+y) == -1) {
78
                    card.innerHTML = "<img class='cardimage' src='/images/memorycards/cardbackside.png' />";
79
                } else {
80
                    // gameboard.cardvalue[gameboard.position.indexOf(x+""+y)] = kortvärdet alltså bilden
81
                    //
82
                    if (gameboard.pairvalues.indexOf(gameboard.cardvalue[gameboard.position.indexOf(x+""+y)]) != 1) {
83
                        card.setAttribute("class", "cardholder "+gameboard.paircolors[gameboard.pairvalues.indexOf(gameboard.cardvalue[gameboard.position.indexOf(x+""+y)])]);
84
                    }
85
86
                    card.innerHTML = "<img class='cardimage' src='/images/memorycards/"+gameboard.cardvalue[gameboard.position.indexOf(x+""+y)]+"' />";
87
                }
88
                if (gameboard.activeplayer == player.nickname) {
89
                    card.onclick = function() {
90
                        var msg;
91
92
                        msg = {
93
                            type: "clickingcard",
94
                            player: player.nickname,
95
                            colorclass: player.colorclass,
96
                            x: x,
97
                            y: y
98
                        };
99
                        websocket.send(JSON.stringify(msg));
100
                    };
101
                }
102
                cardholder.appendChild(card);
103
                gameboardrow.appendChild(cardholder);
104
            }
105
            gameboardhtml.appendChild(gameboardrow);
106
        }
107
        document.getElementById("gameboard").appendChild(gameboardhtml);
108
    }
109
110
    function addClientMsg(jsonmsg) {
111
        let now = new Date();
112
        let timestamp = now.toLocaleTimeString();
113
        var htmlmsg;
114
        var nick = jsonmsg.nick;
115
        var content = jsonmsg.content;
116
        var chatwindow = document.getElementById('chatwindow');
117
118
        htmlmsg = document.createElement('div');
119
        htmlmsg.className = "well clientmsgwell";
120
        htmlmsg.innerHTML = "<p>"+`${timestamp}`+" [<strong>"+nick+"</strong>]:<br>"+content+"</p>";
121
        chatwindow.appendChild(htmlmsg);
122
        chatwindow.scrollTop = chatwindow.scrollHeight;
123
        // output.appendChild(htmlmsg);
124
    }
125
126
    function setPlayerparams(jsonmsg) {
127
        console.log("Setting uniquenickname to " + jsonmsg.uniquenick);
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
128
        player.nickname = jsonmsg.uniquenick;
129
        player.colorclass = jsonmsg.colorclass;
130
    }
131
132
    /**
133
    * What to do when user clicks Connect
134
    */
135
    connect.addEventListener("click", function() {
136
        console.log("Connecting to ws://localhost:8001/.");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
137
        websocket = new WebSocket('ws://localhost:8001/');
0 ignored issues
show
Bug introduced by
The variable WebSocket seems to be never declared. If this is a global, consider adding a /** global: WebSocket */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
138
        // console.log("Connecting to ws://82.102.5.98:8001/.");
139
        // websocket = new WebSocket('ws://82.102.5.98:8001/');
140
        websocket.onopen = function() {
141
            console.log("The websocket is now open.");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
142
            var msg;
143
144
            msg = {
145
                type: 'newuser',
146
                content: nickname.value
147
            };
148
            websocket.send(JSON.stringify(msg));
149
            $("#connectform").hide();
150
            $("#messageform").show();
151
            $("#startgame").show();
152
            document.getElementById('gameboard').innerHTML = '';
153
            $("#gameboard").show();
154
        };
155
156
        websocket.onmessage = function(event) {
157
            console.log("Receiving message: " + event.data);
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
158
            var jsonmsg;
159
160
            jsonmsg = JSON.parse(event.data);
161
162
            if (jsonmsg.type === 'users') {
163
                renderClientArea(jsonmsg);
164
            } else if (jsonmsg.type === 'uniquename') {
165
                setPlayerparams(jsonmsg);
166
            } else if (jsonmsg.type === 'clientmsg') {
167
                addClientMsg(jsonmsg);
168
            } else if (jsonmsg.type === 'startgame') {
169
                $("#startgame").hide();
170
                // generate gameboard on clientside.
171
                renderGameBoard(jsonmsg.gameboard);
172
                renderClientArea(jsonmsg);
173
            } else if (jsonmsg.type === 'turnbackstageone') {
174
                // när två olika kort lyfts
175
                // jsonmsg.gameboard är inte resettat i detta läge.
176
                renderGameBoard(jsonmsg.gameboard);
177
            } else if (jsonmsg.type === 'nextturnbtn') {
178
                $("#nextturnbtn").show();
179
            }
180
        };
181
182
        websocket.onclose = function() {
183
            console.log("The websocket is now closed.");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
184
            // console.log(websocket);
185
            $("#messageform").hide();
186
            $("#startgame").hide();
187
            $("#gameboard").hide();
188
            $("#connectform").show();
189
        };
190
    }, false);
191
192
    /**
193
     * What to do when user clicks to send a message.
194
     */
195
    sendmessage.addEventListener("click", function(/*event*/) {
196
        let messagetext = clientmessage.value;
197
        var msg;
198
199
        if (!websocket || websocket.readyState === 3) {
200
            console.log("The websocket is not connected to a server.");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
201
        } else {
202
            msg = {
203
                type: "clientmsg",
204
                nick: player.nickname,
205
                content: messagetext
206
            };
207
            websocket.send(JSON.stringify(msg));
208
            console.log("Sending message: " + messagetext);
209
            clientmessage.value = "";
210
        }
211
    });
212
213
    /**
214
     * What to do when starting a game and setting the table
215
     */
216
    startgame.addEventListener("click", function(/*event*/) {
217
        var msg;
218
219
        if (!websocket || websocket.readyState === 3) {
220
            console.log("The websocket is not connected to a server.");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
221
        } else {
222
            msg = {
223
                type: "startgame"
224
            };
225
            websocket.send(JSON.stringify(msg));
226
            console.log("Starting up a new game");
227
            $("#startgame").hide();
228
        }
229
    });
230
231
    nextturnbtn.addEventListener("click", function(/*event*/) {
232
        var msg;
233
234
        if (!websocket || websocket.readyState === 3) {
235
            console.log("The websocket is not connected to a server.");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
236
        } else {
237
            msg = {
238
                type: "flip"
239
            };
240
            websocket.send(JSON.stringify(msg));
241
            console.log("reset gameboard");
242
            $("#nextturnbtn").hide();
243
        }
244
    });
245
246
247
248
    /**
249
     * What to do when user clicks Close connection.
250
     */
251
    close.addEventListener("click", function(/*event*/) {
252
        console.log("Closing websocket for %s.", player.nickname);
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
253
        var msg;
254
255
        msg = {
256
            type: 'deleteuser',
257
            content: player.nickname
258
        };
259
        websocket.send(JSON.stringify(msg));
260
        clientlist.innerHTML = "";
261
        output.innerHTML = "";
262
        websocket.close();
263
    });
264
})();
265