(function () {
    "use strict";
    var input_div = null;
    var clients_list = null;

    function write(msg) {
        common.write(input_div.previousSibling, msg);
    }

    function master_send(hub, client_ids, client_id, obj) {
        obj.client_ids = client_ids;
        obj.client_id = client_id;
        hub.send(JSON.stringify(obj));
    }

    function ClientsList() {
        function Client(clients_list, client_id, name) {
            var client_label;

            this.clients_list = clients_list;
            this.id = client_id;
            this.get_label = function () {
                return "client-" + this.id.toString();
            };
            client_label = this.get_label();
            this.name = name || client_label;

            this.li = common.tag("li")
            this.checkbox = common.tag(
                "input",
                {
                    "type": "checkbox",
                    "id": "checkbox-" + client_label,
                    "checked": "",
                },
            );
            this.li.append(this.checkbox);
            clients_list.ul.append(this.li);
            this.set_name = function (new_name) {
                var old_name = this.name;
                this.name = new_name;
                while (this.checkbox.nextSibling)
                    this.checkbox.nextSibling.remove();
                this.checkbox.parentNode.append(document.createTextNode(new_name));
                return old_name;
            };
            this.set_name(client_label);
        }
        this.clients = {};
        this.ul = common.tag("ul");
        document.body.append(this.ul);

        this.append = function (client_id) {
            var client = new Client(this, client_id);
            this.clients[client_id.toString()] = client;
            return client;
        };
        this.remove = function (client_id) {
            var client = this.clients[client_id];
            if (client) {
                client.li.remove();
                delete this.clients[client_id];
            }
            return client;
        };
        this.all = function () {
            var key;
            var result = [];
            for (key in this.clients) {
                result.push(this.clients[key].id);
            }
            return result;
        };
        this.selected = function () {
            var key;
            var client;
            var result = [];
            for (key in this.clients) {
                client = this.clients[key];
                if (client.checkbox.checked) {
                    result.push(client.id);
                }
            }
            return result;
        };
    }

    function open() {
        var hub = this;
        clients_list = new ClientsList();
        input_div = common.tag("div");
        input_div.append(document.createTextNode("MASTER "));
        input_div.append(
            common.input_with_keydown_event(
                function (event, target, keycode) {
                    if (keycode !== "Enter" && keycode !== "NumpadEnter") {
                        return;
                    }
                    hub.send(JSON.stringify({
                        "client_ids": clients_list.selected(),
                        "name": "MASTER",
                        "data": target.value,
                    }));
                    write("MASTER: " + target.value);
                    target.value = "";
                }
            )
        );

        document.body.append(common.tag("div")); // output
        document.body.append(input_div);
        write("connected to ws_master");
    }

    function close() {
        write("connection lost");
        input_div.remove();
    }

    function join_leave_broadcast(hub, client, action) {
        if (!client) {
            return;
        }
        write("[action]: " + client.name + " " + action + "s");
        master_send(hub, clients_list.all(), client.id, {
            "action": action,
            "name": client.name,
        });
    }

    function message(msg) {
        var obj = JSON.parse(msg.data);
        var client;
        if (obj.action === "join") {
            join_leave_broadcast(this, clients_list.append(obj.client_id), obj.action);
            return;
        } else if (obj.action === "leave") {
            join_leave_broadcast(this, clients_list.remove(obj.client_id), obj.action);
            return;
        }
        client = clients_list.clients[obj.client_id.toString()];

        if (obj.action == "set_name") {
            write(
                "[action]: " +
                client.name +
                " changes name to " +
                obj.name
            );
            master_send(this, clients_list.all(), client.id, {
                "action": "set_name",
                "old_name": client.name,
                "name": obj.name,
            });
            client.set_name(obj.name);
        } else if (obj.hasOwnProperty("data")) {
            write(client.name + " [" + client.id + "]: " + obj.data);
            master_send(this, clients_list.all(), client.id, {
                "name": client.name,
                "data": obj.data,
            });
        }
    }

    common.setup(function () { new common.HubClient(ws_uri, open, close, message); });
})();