JavaServerJavascriptClient/xat.js at main · Arnauec/JavaServerJavascriptClient · GitHub

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
$(document).ready(function() {
        var options = {
            valueNames: [ 'name' ],
            item: '<li><p class="name"></p></li>'
        };

        var values = [
        ];

        var llista = new List('llista', options, values);

        // Adds the message to the main div
        function log(text) {
            var xat = $("#xat").html();
            xat = text + "<br>" + xat;
            $("#xat").html(xat);
        }

        if (!window.WebSocket) {
            alert("FATAL ERROR: WebSockets are not supported.");
        }
        var ws;

        $('#nomUsuari').on("submit", function(event) {
            event.stopPropagation();
            ws = new WebSocket("ws://localhost:50000"); // Initialize of the WebSocket

            // Some dynamism to the page
            $("#xat").css("display", "inline");
            $("#llista").css("display", "inline");
            $("#nomUsuari").css("display", "none");
            $("#connect").css("display", "none");
            $("#enviar").css("display", "inline");
            $("#txtBox").css("display", "inline");
            $("#benvinguda").css("display", "none");
            $("#instruccions").css("display", "inline");

            // Actions performed whenever a connection is opened
            ws.onopen = function() {
                var nomUsuari = $("#nomUsuariBox").val();
                ws.send("/newuser " +  nomUsuari);
                log("Welcome to the room");

            }

            // Actions performed every time a message arrives
            ws.onmessage = function(event) {
                var str = event.data;
                if(str.includes("/newuser ")){
                    var talls = str.split(" ");
                    llista.add({ name : talls[1] });
                    llista.sort('name', { order: "asc" });

                } else if(str.includes("/deleteuser ")) {
                    var talls = str.split(" ");
                    llista.remove("name", talls[1]);
                    llista.sort('name', { order: "asc" });

                }else{
                    log(str);
                }
               }

            // Actions performed when the connection is closed
            ws.onclose = function() {
                log("You have left the room");
                ws = null;
            };
            return false;
            });

            $("#enviarText").on("submit", function() {
                var nomUsuari = $("#nomUsuariBox").val();
                if (ws) {
                    ws.send(nomUsuari + ": " + $('#txtBox').val());
                    $('#txtBox').val("");
                    $('#txtBox').focus();

                }
                return false
            });

        });