redo emoji

.woodpecker/base.yaml

@@ -25,7 +25,7 @@ steps:
   build-npm:
     image: *node_image
     commands:
-      - bash ./scripts/build.sh web dev
+      - bash ./scripts/build.sh web rel
 
   build-docker-next:
     image: *buildx_image

client-api/.gitignore

@@ -0,0 +1,2 @@
+#My local environment to deploy the files directly
+environment/

client-api/api.php

@@ -0,0 +1,314 @@
+<?php
+    /**
+     * Created by PhpStorm.
+     * User: WolverinDEV
+     * Date: 04.10.18
+     * Time: 16:42
+     */
+
+    $UI_BASE_PATH = "ui-files/";
+    $CLIENT_BASE_PATH = "files/";
+
+    function errorExit($message) {
+        http_response_code(400);
+        die(json_encode([
+            "success" => false,
+            "msg" => $message
+        ]));
+    }
+
+    function verifyPostSecret() {
+        if(!isset($_POST["secret"])) {
+            errorExit("Missing required information!");
+        }
+
+        $require_secret = file_get_contents(".deploy_secret");
+        if($require_secret === false || strlen($require_secret) == 0) {
+            errorExit("Server missing secret!");
+        }
+
+        if(!is_string($_POST["secret"])) {
+            errorExit("Invalid secret!");
+        }
+
+        if(strcmp(trim($require_secret), trim($_POST["secret"])) !== 0) {
+            errorExit("Secret does not match!");
+        }
+    }
+
+    function handleRequest() {
+        if(isset($_GET) && isset($_GET["type"])) {
+            if ($_GET["type"] == "update-info") {
+                global $CLIENT_BASE_PATH;
+                $raw_versions = file_get_contents($CLIENT_BASE_PATH . "/version.json");
+                if($raw_versions === false) {
+                    errorExit("Missing file!");
+                }
+
+                $versions = json_decode($raw_versions, true);
+                $versions["success"] = true;
+
+                die(json_encode($versions));
+            }
+            else if ($_GET["type"] == "update-download") {
+                global $CLIENT_BASE_PATH;
+
+                $path = $CLIENT_BASE_PATH . $_GET["channel"] . DIRECTORY_SEPARATOR . $_GET["version"] . DIRECTORY_SEPARATOR;
+                $raw_release_info = file_get_contents($path . "info.json");
+                if($raw_release_info === false) {
+                    errorExit("missing info file (version and/or channel missing. Path was " . $path . ")");
+                }
+                $release_info = json_decode($raw_release_info);
+
+                foreach($release_info as $platform) {
+                    if($platform->platform != $_GET["platform"]) continue;
+                    if($platform->arch != $_GET["arch"]) continue;
+
+                    http_response_code(200);
+                    header("Cache-Control: public"); // needed for internet explorer
+                    header("Content-Type: application/binary");
+                    header("Content-Transfer-Encoding: Binary");
+                    header("Content-Length:".filesize($path . $platform->update));
+                    header("Content-Disposition: attachment; filename=update.tar.gz");
+                    header("info-version: 1");
+                    readfile($path . $platform->update);
+                    die();
+                }
+                errorExit("Missing platform, arch or file");
+            }
+            else if ($_GET["type"] == "ui-info") {
+                global $UI_BASE_PATH;
+
+                $version_info = file_get_contents($UI_BASE_PATH . "info.json");
+                if($version_info === false) $version_info = array();
+                else $version_info = json_decode($version_info, true);
+
+                $info = array();
+                $info["success"] = true;
+                $info["versions"] = array();
+
+                foreach($version_info as $channel => $data) {
+                    if(!isset($data["latest"])) continue;
+
+                    $channel_info = [
+                        "timestamp" => $data["latest"]["timestamp"],
+                        "version" => $data["latest"]["version"],
+                        "git-ref" => $data["latest"]["git-ref"],
+                        "channel" => $channel,
+                        "required_client" => $data["latest"]["required_client"]
+                    ];
+                    array_push($info["versions"], $channel_info);
+                }
+                
+                die(json_encode($info));
+            } else if ($_GET["type"] == "ui-download") {
+                global $UI_BASE_PATH;
+
+                if(!isset($_GET["channel"]) || !isset($_GET["version"]))
+                    errorExit("missing required parameters");
+
+                if($_GET["version"] !== "latest" && !isset($_GET["git-ref"]))
+                    errorExit("missing required parameters");
+
+                $version_info = file_get_contents($UI_BASE_PATH . "info.json");
+                if($version_info === false) $version_info = array();
+                else $version_info = json_decode($version_info, true);
+
+                $channel_data = $version_info[$_GET["channel"]];
+                if(!isset($channel_data))
+                    errorExit("channel unknown");
+
+                $ui_pack = false;
+                if($_GET["version"] === "latest") {
+                    $ui_pack = $channel_data["latest"];
+                } else {
+                    foreach ($channel_data["history"] as $entry) {
+                        if($entry["version"] == $_GET["version"] && $entry["git-ref"] == $_GET["git-ref"]) {
+                            $ui_pack = $entry;
+                            break;
+                        }
+                    }
+                }
+                if($ui_pack === false)
+                    errorExit("missing version");
+
+
+                header("Cache-Control: public"); // needed for internet explorer
+                header("Content-Type: application/binary");
+                header("Content-Transfer-Encoding: Binary");
+                header("Content-Disposition: attachment; filename=ui.tar.gz");
+                header("info-version: 1");
+
+                header("x-ui-timestamp: " . $ui_pack["timestamp"]);
+                header("x-ui-version: " . $ui_pack["version"]);
+                header("x-ui-git-ref: " . $ui_pack["git-ref"]);
+                header("x-ui-required_client: " . $ui_pack["required_client"]);
+
+                $read = readfile($ui_pack["file"]);
+                header("Content-Length:" . $read);
+
+                if($read === false) errorExit("internal error: Failed to read file!");
+                die();
+            }
+        }
+        else if($_POST["type"] == "deploy-build") {
+            global $CLIENT_BASE_PATH;
+
+            if(!isset($_POST["version"]) || !isset($_POST["platform"]) || !isset($_POST["arch"]) || !isset($_POST["update_suffix"]) || !isset($_POST["installer_suffix"])) {
+                errorExit("Missing required information!");
+            }
+
+            verifyPostSecret();
+
+            if(!isset($_FILES["update"])) {
+                errorExit("Missing update file");
+            }
+
+            if($_FILES["update"]["error"] !== UPLOAD_ERR_OK) {
+                errorExit("Upload for update failed!");
+            }
+
+            if(!isset($_FILES["installer"])) {
+                errorExit("Missing installer file");
+            }
+
+            if($_FILES["installer"]["error"] !== UPLOAD_ERR_OK) {
+                errorExit("Upload for installer failed!");
+            }
+
+            $json_version = json_decode($_POST["version"], true);
+            $version = $json_version["major"] . "." . $json_version["minor"] . "." . $json_version["patch"] . ($json_version["build"] > 0 ? "-" . $json_version["build"] : "");
+            $path = $CLIENT_BASE_PATH . DIRECTORY_SEPARATOR . $_POST["channel"] . DIRECTORY_SEPARATOR . $version . DIRECTORY_SEPARATOR;
+            exec("mkdir -p " . $path);
+            //mkdir($path, 777, true);
+
+
+            $filename_update = "TeaClient-" . $_POST["platform"] . "_" . $_POST["arch"] . "." . $_POST["update_suffix"];
+            $filename_install = "TeaClient-" . $_POST["platform"] . "_" . $_POST["arch"] . "." . $_POST["installer_suffix"];
+
+            {
+                $version_info = file_get_contents($path . "info.json");
+                if($version_info === false) {
+                    $version_info = array();
+                } else {
+                    $version_info = json_decode($version_info, true);
+                    if($version_info === false) {
+                        errorExit("Failed to decode old versions info file");
+                    }
+                }
+
+                for($index = 0; $index < count($version_info); $index++) {
+                    if($version_info[$index]["platform"] == $_POST["platform"] && $version_info[$index]["arch"] == $_POST["arch"]) {
+                        array_splice($version_info, $index, 1);
+                        break;
+                    }
+                }
+
+                $info = array();
+                $info["platform"] = $_POST["platform"];
+                $info["arch"] = $_POST["arch"];
+                $info["update"] = $filename_update;
+                $info["install"] = $filename_install;
+                array_push($version_info, $info);
+                file_put_contents($path . "info.json", json_encode($version_info));
+            }
+
+            {
+                $filename = $CLIENT_BASE_PATH . DIRECTORY_SEPARATOR . "version.json";
+                $indexes = file_get_contents($filename);
+                if($indexes === false) {
+                    $indexes = array();
+                } else {
+                    $indexes = json_decode($indexes, true);
+                    if($indexes === false) {
+                        errorExit("Failed to decode old latest versions info file");
+                    }
+                }
+
+                $index = &$indexes[$_POST["channel"]];
+                if(!isset($index)) {
+                    $index = array();
+                }
+
+                for($idx = 0; $idx < count($index); $idx++) {
+                    if($index[$idx]["platform"] == $_POST["platform"] && $index[$idx]["arch"] == $_POST["arch"]) {
+                        array_splice($index, $idx, 1);
+                        break;
+                    }
+                }
+
+                $info = array();
+                $info["platform"] = $_POST["platform"];
+                $info["arch"] = $_POST["arch"];
+                $info["version"] = $json_version;
+                array_push($index, $info);
+
+                file_put_contents($filename, json_encode($indexes));
+            }
+
+            move_uploaded_file($_FILES["installer"]["tmp_name"],$path . $filename_install);
+            move_uploaded_file($_FILES["update"]["tmp_name"],$path . $filename_update);
+
+            die(json_encode([
+                "success" => true
+            ]));
+        }
+        else if($_POST["type"] == "deploy-ui-build") {
+            global $UI_BASE_PATH;
+
+            if(!isset($_POST["channel"]) || !isset($_POST["version"]) || !isset($_POST["git_ref"]) || !isset($_POST["required_client"])) {
+                errorExit("Missing required information!");
+            }
+
+            verifyPostSecret();
+
+            $path = $UI_BASE_PATH . DIRECTORY_SEPARATOR;
+            $channeled_path = $UI_BASE_PATH . DIRECTORY_SEPARATOR . $_POST["channel"];
+            $filename = "TeaClientUI-" . $_POST["version"] . "_" . $_POST["git_ref"] . ".tar.gz";
+            exec("mkdir -p " . $path);
+            exec("mkdir -p " . $channeled_path);
+
+            {
+                $info = file_get_contents($path . "info.json");
+                if($info === false) {
+                    $info = array();
+                } else {
+                    $info = json_decode($info, true);
+                    if($info === false) {
+                        errorExit("failed to decode old info file");
+                    }
+                }
+
+                $channel_info = &$info[$_POST["channel"]];
+                if(!$channel_info) {
+                    $channel_info = array();
+                }
+
+                $entry = [
+                    "timestamp" => time(),
+                    "file" => $channeled_path . DIRECTORY_SEPARATOR . $filename,
+                    "version" => $_POST["version"],
+                    "git-ref" => $_POST["git_ref"],
+                    "required_client" => $_POST["required_client"]
+                ];
+
+                $channel_info["latest"] = $entry;
+                if(!$channel_info["history"]) $channel_info["history"] = array();
+                array_push($channel_info["history"], $entry);
+
+                file_put_contents($path . "info.json", json_encode($info));
+            }
+
+
+            move_uploaded_file($_FILES["file"]["tmp_name"],$channeled_path . DIRECTORY_SEPARATOR . $filename);
+            die(json_encode([
+                "success" => true
+            ]));
+        }
+        else die(json_encode([
+            "success" => false,
+            "error" => "invalid action!"
+        ]));
+    }
+
+    handleRequest();

client/.gitignore

@@ -0,0 +1,8 @@
+app/**/*.css
+app/**/*.css.map
+
+app/**/*.js
+app/**/*.js.map
+
+declarations/
+generated/

client/app/AppMain.scss

@@ -0,0 +1,31 @@
+:global {
+	html, body {
+		border: 0;
+		margin: 0;
+	}
+
+	.app-container {
+		right: 0;
+		left: 0;
+		top: 0;
+		bottom: 0;
+
+		width: 100%;
+		height: 100%;
+		position: absolute;
+		display: flex;
+		justify-content: stretch;
+
+		.app {
+			width: 100%;
+			height: 100%;
+			margin: 0;
+
+			display: flex; flex-direction: column; resize: both;
+		}
+	}
+
+	footer {
+		display: none!important;
+	}
+}

client/app/entry-points/AppMain.ts

@@ -0,0 +1,4 @@
+window.__native_client_init_shared(__webpack_require__);
+
+import "../AppMain.scss";
+import "tc-shared/entry-points/MainApp";

client/app/entry-points/ModalWindow.ts

@@ -0,0 +1,2 @@
+window.__native_client_init_shared(__webpack_require__);
+import "tc-shared/entry-points/ModalWindow";

client/app/external.d.ts

@@ -0,0 +1,7 @@
+interface Window {
+    __native_client_init_hook: () => void;
+    __native_client_init_shared: (webpackRequire: any) => void;
+}
+
+declare const __teaclient_preview_notice: any;
+declare const __teaclient_preview_error: any;

client/css/static/main.css

@@ -0,0 +1,30 @@
+html, body {
+  border: 0;
+  margin: 0;
+}
+
+.app-container {
+  right: 0;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  display: flex;
+  justify-content: stretch;
+}
+.app-container .app {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  resize: both;
+}
+
+footer {
+  display: none !important;
+}
+
+/*# sourceMappingURL=main.css.map */

client/css/static/main.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["main.scss"],"names":[],"mappings":"AAAA;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EAEA;EAAe;EAAwB;;;AAIzC;EACC","file":"main.css"}

client/generate_packed.sh

@@ -0,0 +1,23 @@
+#!/usr/bin/env bash
+
+BASEDIR=$(dirname "$0")
+cd "$BASEDIR"
+source ../scripts/resolve_commands.sh
+
+if [[ ! -e declarations/imports_shared.d.ts ]]; then
+    echo "generate the declarations first!"
+    echo "Execute: /scripts/build_declarations.sh"
+    exit 1
+fi
+
+if [[ ! -e ../shared/generated/shared.js ]]; then
+    echo "generate the shared packed file first!"
+    echo "Execute: /shared/generate_packed.sh"
+    exit 1
+fi
+
+execute_tsc -p tsconfig/tsconfig_packed.json
+if [[ $? -ne 0 ]]; then
+    echo "Failed to build file"
+    exit 1
+fi

client/tsconfig/dtsconfig.json

@@ -0,0 +1,6 @@
+{
+  "source_files": [
+    "../js/**/*.ts"
+  ],
+  "target_file": "../declarations/exports.d.ts"
+}

client/tsconfig/tsconfig.json

@@ -0,0 +1,12 @@
+/* general web project config */
+{
+  "compilerOptions": {
+    "target": "es6",
+    "module": "commonjs",
+    "sourceMap": true
+  },
+  "include": [
+    "../declarations/imports_*.d.ts",
+    "../js/**/*.ts"
+  ]
+}

client/tsconfig/tsconfig_packed.json

@@ -0,0 +1,14 @@
+/* packed web project config */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "none",
+    "outFile": "../generated/client.js",
+    "allowJs": true
+  },
+  "include": [
+    "../declarations/imports_*.d.ts",
+    "../js/**/*.ts",
+    "../../shared/generated/shared.js"
+  ]
+}

docker/Dockerfile.ci

@@ -1,2 +1,19 @@
-FROM reg.c1.datenclown.at/teaspeak/web-base:latest
+FROM nginx:mainline-alpine
+
+COPY ./docker/default.conf /etc/nginx/conf.d/default.conf
+COPY ./docker/nginx.conf /etc/nginx/nginx.conf
+COPY ./docker/entrypoint.sh /
+
+RUN apk update --no-cache && apk upgrade --no-cache \
+    && apk add --no-cache openssl tzdata \
+    && mkdir -p /var/www/TeaWeb /etc/ssl/certs \
+    && chmod +x /entrypoint.sh
+
+ENV TZ="Europe/Berlin"
+
+EXPOSE 80 443
+
+ENTRYPOINT ["/entrypoint.sh"]
+CMD ["nginx", "-g", "daemon off;"]
+
 COPY ./dist/ /var/www/TeaWeb/

loader/app/targets/app.ts

@@ -51,6 +51,18 @@ loader.register_task(loader.Stage.SETUP, {
     priority: 10
 });
 
+/* test if we're getting loaded within a TeaClient preview window */
+loader.register_task(loader.Stage.SETUP, {
+    name: "TeaClient tester",
+    function: async () => {
+        if(typeof __teaclient_preview_notice !== "undefined" && typeof __teaclient_preview_error !== "undefined") {
+            loader.critical_error("Why you're opening TeaWeb within the TeaSpeak client?!");
+            throw "we're already a TeaClient!";
+        }
+    },
+    priority: 100
+});
+
 export default class implements ApplicationLoader {
     execute() {
         loader.execute_managed(true);

loader/app/targets/shared.ts

@@ -2,6 +2,27 @@ import * as loader from "../loader/loader";
 import {Stage} from "../loader/loader";
 import {detect as detectBrowser} from "detect-browser";
 
+loader.register_task(Stage.SETUP, {
+    name: "app init",
+    function: async () => {
+        /* TeaClient */
+        if(window.require || window.__native_client_init_hook) {
+            if(__build.target !== "client") {
+                loader.critical_error("App seems not to be compiled for the client.", "This app has been compiled for " + __build.target);
+                return;
+            }
+
+            window.__native_client_init_hook();
+        } else {
+            if(__build.target !== "web") {
+                loader.critical_error("App seems not to be compiled for the web.", "This app has been compiled for " + __build.target);
+                return;
+            }
+        }
+    },
+    priority: 1000
+});
+
 loader.register_task(Stage.SETUP, {
     name: __build.target === "web" ? "outdated browser checker" : "outdated renderer tester",
     function: async () => {

loader/index.ejs

@@ -9,6 +9,7 @@
 
         <meta name="og:description" content="The TeaSpeak Web client is a in the browser running client for the VoIP communication software TeaSpeak." />
         <meta name="og:url" content="https://web.teaspeak.de/">
+        <% /* TODO: Put in an appropriate image <meta name="og:image" content="https://www.whatsapp.com/img/whatsapp-promo.png"> */ %>
 
         <% /* Using an absolute path here since the manifest.json works only with such. */ %>
         <% /* <link rel="manifest" href="/manifest.json"> */ %>
@@ -26,6 +27,19 @@
         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
         <meta name="format-detection" content="telephone=no">
 
+        <!-- Global site tag (gtag.js) - Google Analytics -->
+        <script defer async src="https://www.googletagmanager.com/gtag/js?id=UA-113151733-4"></script>
+        <script>
+            window.dataLayer = window.dataLayer || [];
+
+            function gtag() {
+                dataLayer.push(arguments);
+            }
+
+            gtag('js', new Date());
+            gtag('config', 'UA-113151733-4');
+        </script>
+
         <link rel="preload" as="image" href="<%= require("./images/initial-sequence.gif") %>">
         <link rel="preload" as="image" href="<%= require("./images/bowl.png") %>">
         <% /* We don't preload the bowl since it's only a div background */ %>

scripts/build_in_docker.sh

@@ -11,17 +11,20 @@ if [[ ! -d "${NPM_DIR}" ]]; then
 fi
 
 if [[ "${BUILDINDOCKER:-}" != "yes" ]]; then
-    if docker -v | grep -qi "podman"; then
+    docker run --rm --workdir "/work" -v "${NPM_DIR}:/home/" -v "${BASEPATH}:/work" -e BUILDINDOCKER=yes node:14-bullseye /bin/bash -c 'chmod +x /work/scripts/build_in_docker.sh && /work/scripts/build_in_docker.sh'
-        is_podman='yes'
-    fi
-    docker run --rm --workdir "/work" -v "${BASEPATH}:/work" -e is_podman="${is_podman:-no}" -e BUILDINDOCKER=yes -e npm_config_cache=/work/.npm node:14-bullseye /bin/bash -c 'chmod +x /work/scripts/build_in_docker.sh && /work/scripts/build_in_docker.sh'
     exit
 fi
 
 ## in docker
 
+echo "adding npmrc"
+cat >>"${HOME}/.npmrc" <<'EOF'
+cache=/work/.npm
+fund=false
+EOF
+
 echo "adding secure git dir"
-git config --global --add safe.directory '*'
+git config --global --add safe.directory /work
 
 echo "running chmods"
 find "${BASEPATH}" -iname "*.sh" -exec chmod +x {} +
@@ -38,9 +41,5 @@ npx browserslist@latest --update-db || exit 1
 echo "running build"
 "${BASEPATH}/scripts/build.sh" web rel
 
-if [[ "${is_podman}" != 'yes' ]]; then
+echo "fixing perms"
-    echo "fixing perms"
+chown -R 1000:1000 /work
-    chown -R 1000:1000 /work
-else
-    echo "in podman, not fixing perms"
-fi

scripts/deploy_ui_files.sh

@@ -0,0 +1,73 @@
+#!/usr/bin/env bash
+
+# Example usage: ./scripts/deploy_ui_files.sh http://dev.clientapi.teaspeak.de/api.php test 1.1.0
+
+cd "$(dirname "$0")" || { echo "failed to enter base directory"; exit 1; }
+source "./helper.sh"
+
+if [[ "$#" -ne 3 ]]; then
+    echo "Illegal number of parameters (url | channel | required version)"
+    exit 1
+fi
+
+# shellcheck disable=SC2154
+if [[ "${teaclient_deploy_secret}" == "" ]]; then
+    echo "Missing deploy secret!"
+    exit 1
+fi
+
+package_file=$(find_release_package "client" "release")
+if [[ $? -ne 0 ]]; then
+  echo "$package_file"
+  exit 1
+fi
+
+# We require a .tar.gz file and not a zip file.
+# So we're extracting the contents and tar.gz ing them
+temp_dir=$(mktemp -d)
+unzip "$package_file" -d "$temp_dir/raw/"
+if [[ $? -ne 0 ]]; then
+    rm -r "$temp_dir" &>/dev/null
+    echo "Failed to unpack package."
+    exit 1
+fi
+
+echo "Generating .tar.gz file from $package_file"
+package_file="$temp_dir/$(basename -s ".zip" "$package_file").tar.gz"
+tar --use-compress-program="gzip -9" -C "$temp_dir/raw/" -c . -cf "$package_file";
+if [[ $? -ne 0 ]]; then
+    rm -r "$temp_dir"
+    echo "Failed to package package."
+    exit 1
+fi
+
+git_hash=$(git_version "short-tag")
+application_version=$(project_version)
+echo "Deploying $package_file."
+echo "Hash: ${git_hash}, Version: ${application_version}, Target channel: $2."
+
+upload_result=$(curl \
+  -k \
+  -X POST \
+  -F "required_client=$3" \
+  -F "type=deploy-ui-build" \
+  -F "channel=$2" \
+  -F "version=$application_version" \
+  -F "git_ref=$git_hash" \
+  -F "secret=${teaclient_deploy_secret}" \
+  -F "file=@$package_file" \
+   "$1"
+)
+
+rm -r "$temp_dir"
+echo "Server upload result: $upload_result"
+success=$(echo "${upload_result}" | python -c "import sys, json; print(json.load(sys.stdin)['success'])")
+
+if [[ ! "${success}" == "True" ]]; then
+    error_message=$(echo "${upload_result}" | python -c "import sys, json; print(json.load(sys.stdin)['msg'])" 2>/dev/null);
+    echo "Failed to deploy build: ${error_message}"
+    exit 1
+else
+  echo "Build successfully deployed!"
+  exit 0
+fi

scripts/in_docker_prep.sh

@@ -1,11 +0,0 @@
-#!/bin/bash
-
-SCRIPT=$(realpath "$0")
-SCRIPTPATH=$(dirname "$SCRIPT")
-BASEPATH="$(realpath "${SCRIPTPATH}/../")"
-
-echo "adding secure git dir"
-git config --global --add safe.directory '*'
-
-echo "running chmods"
-find "${BASEPATH}" -iname "*.sh" -exec chmod +x {} +

scripts/install_dependencies.sh

@@ -0,0 +1,38 @@
+#!/usr/bin/env bash
+
+install_sys_deps() {
+    # shellcheck disable=SC2207
+    curl_version=($(curl --version 2>/dev/null))
+
+    # shellcheck disable=SC2181
+    if [[ $? -ne 0 ]]; then
+        echo "> Missing curl. Please install it."
+        exit 1
+    fi
+    echo "> Found curl ${curl_version[1]}"
+}
+
+install_node() {
+    node_version=$(node --version 2>/dev/null)
+    # shellcheck disable=SC2181
+    if [[ $? -ne 0 ]]; then
+        echo "> Missing node. We can't currently install it automatically."
+        echo "> Please download the latest version here: https://nodejs.org/en/download/"
+        exit 1
+    else
+        echo "> Found node $node_version"
+    fi
+
+    npm_version=$(npm --version 2>/dev/null)
+    # shellcheck disable=SC2181
+    if [[ $? -ne 0 ]]; then
+        echo "> Missing npm. Please ensure you've correctly installed node."
+        echo "> You may need to add npm manually to your PATH variable."
+        exit 1
+    else
+        echo "> Found npm $npm_version"
+    fi
+}
+
+install_sys_deps
+install_node

scripts/run_node_docker.sh

@@ -1,28 +0,0 @@
-#!/bin/bash
-
-SCRIPT=$(realpath "$0")
-SCRIPTPATH=$(dirname "$SCRIPT")
-BASEPATH="$(realpath "${SCRIPTPATH}/../")"
-
-NPM_DIR="${BASEPATH}/.npm"
-
-if [[ ! -d "${NPM_DIR}" ]]; then
-    mkdir "${NPM_DIR}" || exit 1
-fi
-
-if docker -v | grep -qi "podman"; then
-    is_podman='yes'
-fi
-
-function run() {
-    docker run --rm --workdir "/work" -v "${BASEPATH}:/work" -e is_podman="${is_podman:-no}" -e BUILDINDOCKER=yes -e npm_config_cache=/work/.npm ${opts:-} node:14-bullseye ${@}
-}
-
-opts="-it" run /bin/bash -c 'bash /work/scripts/in_docker_prep.sh && bash'
-
-if [[ "${is_podman}" != 'yes' ]]; then
-    echo "fixing perms"
-    run /bin/bash -c 'chown -R 1000:1000 /work'
-else
-    echo "in podman, not fixing perms"
-fi

scripts/travis/build.sh

@@ -0,0 +1,177 @@
+#!/bin/bash
+
+cd "$(dirname "$0")/../../" || { echo "Failed to enter base dir"; exit 1; }
+source ./scripts/travis/properties.sh
+
+build_verbose=0
+build_release=1
+build_debug=0
+
+function print_help() {
+    echo "Possible arguments:"
+    echo "  --verbose=[yes|no]          | Enable verbose build output (Default: $build_verbose)"
+    echo "  --enable-release=[yes|no]   | Enable release build (Default: $build_release)"
+    echo "  --enable-debug=[yes|no]     | Enable debug build (Default: $build_debug)"
+}
+
+function parse_arguments() {
+    # Preprocess the help parameter
+    for argument in "$@"; do
+        if [[ "$argument" = "--help" ]] || [[ "$argument" = "-h" ]]; then
+            print_help
+            exit 1
+        fi
+    done
+
+    shopt -s nocasematch
+    for argument in "$@"; do
+        echo "Argument: $argument"
+        if [[ "$argument" =~ ^--verbose(=(y|1)?[[:alnum:]]*$)?$ ]]; then
+            build_verbose=0
+            if [[ -z "${BASH_REMATCH[1]}" ]] || [[ -n "${BASH_REMATCH[2]}" ]]; then
+                build_verbose=1
+            fi
+
+            if [[ ${build_verbose} ]]; then
+                echo "Enabled verbose output"
+            fi
+        elif [[ "$argument" =~ ^--enable-release(=(y|1)?[[:alnum:]]*$)?$ ]]; then
+            build_release=0
+            if [[ -z "${BASH_REMATCH[1]}" ]] || [[ -n "${BASH_REMATCH[2]}" ]]; then
+                build_release=1
+            fi
+
+            if [[ ${build_release} ]]; then
+                echo "Enabled release build!"
+            fi
+        elif [[ "$argument" =~ ^--enable-debug(=(y|1)?[[:alnum:]]*$)?$ ]]; then
+            build_debug=0
+            if [[ -z "${BASH_REMATCH[1]}" ]] || [[ -n "${BASH_REMATCH[2]}" ]]; then
+                build_debug=1
+            fi
+
+            if [[ ${build_debug} ]]; then
+                echo "Enabled debug build!"
+            fi
+        fi
+    done
+}
+
+function execute() {
+    time_begin=$(date +%s%N)
+
+    echo "> Executing step: $1" >> "${LOG_FILE}"
+    echo -e "\e[32m> Executing step: $1\e[0m"
+    #Execute the command
+    for command in "${@:3}"; do
+        echo "$> $command" >> "${LOG_FILE}"
+        if [[ ${build_verbose} -gt 0 ]]; then
+            echo "$> $command"
+        fi
+
+        error=""
+        if [[ ${build_verbose} -gt 0 ]]; then
+            if [[ -f ${LOG_FILE}.tmp ]]; then
+                rm "${LOG_FILE}.tmp"
+            fi
+            ${command} |& tee "${LOG_FILE}.tmp" | grep -E '^[^(/\S*/libstdc++.so\S*: no version information available)].*'
+
+            error_code=${PIPESTATUS[0]}
+            error=$(cat "${LOG_FILE}.tmp")
+            cat "${LOG_FILE}.tmp" >> "${LOG_FILE}"
+            rm "${LOG_FILE}.tmp"
+        else
+            error=$(${command} 2>&1)
+            error_code=$?
+            echo "$error" >> "${LOG_FILE}"
+        fi
+
+
+        if [[ ${error_code} -ne 0 ]]; then
+            break
+        fi
+    done
+
+    #Log the result
+    time_end=$(date +%s%N)
+    time_needed=$((time_end - time_begin))
+    time_needed_ms=$((time_needed / 1000000))
+    step_color="\e[32m"
+    [[ ${error_code} -ne 0 ]] && step_color="\e[31m"
+    echo "$step_color> Step took ${time_needed_ms}ms" >> ${LOG_FILE}
+    echo -e "$step_color> Step took ${time_needed_ms}ms\e[0m"
+
+    if [[ ${error_code} -ne 0 ]]; then
+        handle_failure ${error_code} "$2"
+    fi
+
+    error=""
+}
+
+function handle_failure() {
+    # We cut of the nasty "node: /usr/lib/libstdc++.so.6: no version information available (required by node)" message
+    echo "--------------------------- [ERROR] ---------------------------"
+    echo "We've encountered an fatal error, which isn't recoverable!"
+    echo "                    Aborting build process!"
+    echo ""
+    echo "Exit code    : $1"
+    echo "Error message: ${*:2}"
+    if [[ ${build_verbose} -eq 0 ]] && [[ "$error" != "" ]]; then
+        echo "Command log  : (lookup \"${LOG_FILE}\" for detailed output!)"
+        echo "$error"
+    fi
+    echo "--------------------------- [ERROR] ---------------------------"
+    exit 1
+}
+
+cd "$(dirname "$0")/../../" || { echo "Failed to enter base dir"; exit 1; }
+error=""
+
+LOG_FILE="$(pwd)/$LOG_FILE"
+if [[ ! -d $(dirname "${LOG_FILE}") ]]; then
+    mkdir -p "$(dirname "${LOG_FILE}")"
+fi
+
+if [[ $# -eq 0 ]]; then
+    echo "Executing build scripts with no arguments"
+else
+    echo "Executing build scripts with arguments: $* ($#)"
+fi
+if [[ "$1" == "bash" ]]; then
+    bash
+    exit 0
+fi
+
+parse_arguments "${@:1}"
+
+if [[ -e "$LOG_FILE" ]]; then
+    rm "$LOG_FILE"
+fi
+
+echo "----------     Setup       ----------"
+chmod +x ./scripts/install_dependencies.sh
+source ./scripts/install_dependencies.sh
+
+echo "----------   Web client    ----------"
+
+function execute_build_release() {
+    execute \
+        "Building release package" \
+        "Failed to build release" \
+        "./scripts/build.sh web release"
+}
+function execute_build_debug() {
+    execute \
+        "Building debug package" \
+        "Failed to build debug" \
+        "./scripts/build.sh web dev"
+}
+
+chmod +x ./scripts/build.sh
+if [[ ${build_release} ]]; then
+    execute_build_release
+fi
+if [[ ${build_debug} ]]; then
+    execute_build_debug
+fi
+exit 0

scripts/travis/deploy_docker.sh

@@ -0,0 +1,61 @@
+#!/usr/bin/env bash
+
+cd "$(dirname "$0")/../../" || { echo "Failed to enter base dir"; exit 1; }
+source ./scripts/travis/properties.sh
+source ./scripts/helper.sh
+
+git_rev=$(git_version "short-tag")
+if [[ "$1" == "release" ]]; then
+    echo "Releasing $git_rev as release"
+    rolling_tag="latest"
+elif [[ "$1" == "development" ]]; then
+    echo "Releasing $git_rev as beta release"
+    rolling_tag="beta"
+else
+    echo "Invalid release mode"
+    exit 1
+fi
+
+# FIXME: This dosn't work anymore
+zip_file=$(find "$PACKAGES_DIRECTORY" -maxdepth 1 -name "TeaWeb-release*.zip" -print)
+[[ $(echo "$zip_file" | wc -l) -ne 1 ]] && {
+    echo "Invalid .zip file count (Expected 1 but got $(echo "$zip_file" | wc -l)): ${zip_file[*]}"
+    exit 1
+}
+[[ ! -e "$zip_file" ]] && {
+    echo "File ($zip_file) does not exists"
+    exit 1
+}
+
+git clone https://github.com/TeaSpeak/TeaDocker.git auto-build/teadocker || {
+    echo "Failed to clone the TeaDocker project"
+    exit 1
+}
+
+cp "$zip_file" auto-build/teadocker/web/TeaWeb-release.zip || {
+    echo "Failed to copy Docker webclient files to the docker files build context"
+    exit 1
+}
+
+docker build -f auto-build/teadocker/web/travis.Dockerfile --build-arg WEB_VERSION="$git_rev" --build-arg WEB_ZIP=TeaWeb-release.zip  -t teaspeak/web:"$rolling_tag" auto-build/teadocker/web || {
+    echo "Failed to build dockerfile"
+    exit 1
+}
+
+docker tag teaspeak/web:"$rolling_tag" teaspeak/web:"$git_rev" || {
+    echo "Failed to tag docker release"
+    exit 1
+}
+
+docker login -u "$DOCKERHUB_USER" -p "$DOCKERHUB_TOKEN" || {
+    echo "Failed to login to docker hub"
+    exit 1
+}
+
+docker push teaspeak/web || {
+    echo "Failed to push new teaspeak/web tags"
+    exit 1
+}
+docker logout # &> /dev/null
+
+exit 0

scripts/travis/deploy_github.sh

@@ -0,0 +1,92 @@
+#!/usr/bin/env bash
+
+cd "$(dirname "$0")/../../" || {
+  echo "Failed to enter base dir"
+  exit 1
+}
+source ./scripts/travis/properties.sh
+source ./scripts/helper.sh
+
+if [[ -z "${GIT_AUTHTOKEN}" ]]; then
+  echo "GIT_AUTHTOKEN isn't set. Don't deploying build!"
+  exit 0
+fi
+
+git_release_executable="/tmp/git-release"
+install_git_release() {
+  if [[ -x "${git_release_executable}" ]]; then
+    # File already available. No need to install it.
+    return 0
+  fi
+
+  if [[ ! -f ${git_release_executable} ]]; then
+    echo "Downloading github-release-linux (1.2.4)"
+
+    if [[ -f /tmp/git-release.gz ]]; then
+      rm /tmp/git-release.gz
+    fi
+    wget https://github.com/tfausak/github-release/releases/download/1.2.4/github-release-linux.gz -O /tmp/git-release.gz -q
+    [[ $? -eq 0 ]] || {
+      echo "Failed to download github-release-linux"
+      exit 1
+    }
+
+    gunzip /tmp/git-release.gz
+    _exit_code=$?
+    [[ $_exit_code -eq 0 ]] || {
+      echo "Failed to unzip github-release-linux"
+      exit 1
+    }
+    chmod +x /tmp/git-release
+
+    echo "Download of github-release-linux (1.2.4) finished"
+  else
+    chmod +x ${git_release_executable}
+  fi
+
+  if [[ ! -x ${git_release_executable} ]]; then
+    echo "git-release isn't executable"
+    exit 1
+  fi
+}
+install_git_release
+
+git_versions_tag=$(git_version "short-tag")
+echo "Deploying $git_versions_tag ($(git_version "long-tag")) to GitHub."
+
+echo "Generating release tag"
+${git_release_executable} release \
+    --repo "TeaWeb" \
+    --owner "TeaSpeak" \
+    --token "${GIT_AUTHTOKEN}" \
+    --title "Travis auto build $git_versions_tag" \
+    --tag "$git_versions_tag" \
+    --description "This is a auto build release from travis"
+
+[[ $? -eq 0 ]] || {
+  echo "Failed to generate git release"
+  exit 1
+}
+
+upload_package() {
+  local package_file
+  package_file=$(find_release_package "web" "$1")
+  if [[ $? -eq 0 ]]; then
+    echo "Uploading $1 package ($package_file)"
+    ${git_release_executable} upload \
+        --repo "TeaWeb" \
+        --owner "TeaSpeak" \
+        --token "${GIT_AUTHTOKEN}" \
+        --tag "$git_versions_tag" \
+        --file "$package_file" \
+        --name "$(basename "$package_file")"
+
+    echo "Successfully uploaded $1 package"
+  else
+    echo "Skipping $1 package upload: $package_file"
+  fi
+}
+
+upload_package "development"
+upload_package "release"
+exit 0

scripts/travis/deploy_server.sh

@@ -0,0 +1,51 @@
+#!/usr/bin/env bash
+
+if [[ -z "$1" ]]; then
+    echo "Missing deploy channel"
+    exit 1
+fi
+
+cd "$(dirname "$0")/../../" || {
+  echo "Failed to enter base dir"
+  exit 1
+}
+source ./scripts/travis/properties.sh
+source ./scripts/helper.sh
+
+if [[ -z "${SSH_KEY}" ]]; then
+    echo "Missing environment variable SSH_KEY. Please set it before using this script!"
+    exit 1
+fi
+echo "${SSH_KEY}" | base64 --decode > /tmp/sftp_key
+chmod 600 /tmp/sftp_key
+
+[[ $? -ne 0 ]] && {
+    echo "Failed to write SSH key"
+    exit 1
+}
+
+
+package_file=$(find_release_package "web" "release")
+if [[ $? -ne 0 ]]; then
+    echo "$package_file"
+    exit 1
+fi
+
+upload_name=$(basename "$package_file")
+ssh -oStrictHostKeyChecking=no -oIdentitiesOnly=yes -i /tmp/sftp_key TeaSpeak-Travis-Web@web.teaspeak.dev rm "tmp-upload/*.zip" # Cleanup the old files
+_exit_code=$?
+[[ $_exit_code -ne 0 ]] && {
+    echo "Failed to delete the old .zip files ($_exit_code)"
+}
+
+sftp -oStrictHostKeyChecking=no -oIdentitiesOnly=yes -i /tmp/sftp_key TeaSpeak-Travis-Web@web.teaspeak.dev << EOF
+    put $package_file tmp-upload/$upload_name
+EOF
+_exit_code=$?
+[[ $_exit_code -ne 0 ]] && {
+    echo "Failed to upload the .zip file ($_exit_code)"
+    exit 1
+}
+
+ssh -oStrictHostKeyChecking=no -oIdentitiesOnly=yes -i /tmp/sftp_key TeaSpeak-Travis-Web@web.teaspeak.dev "./unpack.sh $1 tmp-upload/$upload_name"
+exit $?

scripts/travis/properties.sh

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+
+LOG_FILE="auto-build/logs/build.log"
+PACKAGES_DIRECTORY="auto-build/packages/"

shared/css/static/modal-settings.scss

@@ -3,14 +3,15 @@
 
 :global {
 	.modal-body.modal-settings {
-		padding: 0!important;
+		padding: 0 !important;
 
-		display: flex!important;
+		display: flex !important;
-		flex-direction: column!important;
+		flex-direction: column !important;
-		justify-content: stretch!important;
+		justify-content: stretch !important;
 
 		@include user-select(none);
-		width: 10000em; /* allocate some space */
+		width: 10000em;
+		/* allocate some space */
 
 		.inner-container {
 			flex-grow: 1;
@@ -23,7 +24,8 @@
 			flex-direction: row !important;
 			justify-content: stretch;
 
-			> .left, > .right {
+			>.left,
+			>.right {
 				display: flex;
 				flex-direction: column;
 				justify-content: stretch;
@@ -38,10 +40,10 @@
 
 			.container-seperator {
 				height: unset !important;
-				background-color: #222224!important;
+				background-color: #222224 !important;
 			}
 
-			> .left {
+			>.left {
 				width: 25%;
 				min-width: 10em;
 
@@ -86,7 +88,7 @@
 				}
 			}
 
-			> .right {
+			>.right {
 				width: 75%;
 				min-width: 12em;
 
@@ -94,7 +96,7 @@
 
 				background-color: #2f2f35;
 
-				> .container {
+				>.container {
 					position: absolute;
 					top: 0;
 					bottom: 0;
@@ -113,13 +115,15 @@
 
 					@include chat-scrollbar-horizontal();
 
-					&.general-chat, &.general-application, &.audio-sounds {
+					&.general-chat,
+					&.general-application,
+					&.audio-sounds {
 						label {
 							display: flex;
 							flex-direction: row;
 							justify-content: flex-start;
 
-							> * {
+							>* {
 								align-self: center;
 							}
 
@@ -130,11 +134,11 @@
 					}
 
 					&.general-application {
-						> div {
+						>div {
 							margin-top: .25em;
 						}
 
-						> label:not(:first-child) {
+						>label:not(:first-child) {
 							margin-top: 0.25em;
 						}
 
@@ -168,7 +172,8 @@
 							flex-direction: row;
 							justify-content: flex-start;
 
-							a, div {
+							a,
+							div {
 								text-overflow: ellipsis;
 								white-space: nowrap;
 								overflow: hidden;
@@ -184,7 +189,7 @@
 								flex-direction: row;
 								justify-content: flex-start;
 
-								> .country {
+								>.country {
 									align-self: center;
 									margin-right: .3em;
 								}
@@ -274,7 +279,7 @@
 
 										border-radius: $border_radius_middle;
 
-										> div {
+										>div {
 											align-self: center;
 										}
 
@@ -282,7 +287,7 @@
 											background-color: #3c3d40;
 										}
 
-										> *:not(.spacer) {
+										>*:not(.spacer) {
 											flex-grow: 0;
 											flex-shrink: 1;
 										}
@@ -333,15 +338,21 @@
 						}
 					}
 
-					&.audio-speaker, &.audio-sounds, &.identity-forum {
+					&.audio-speaker,
+					&.audio-sounds,
+					&.identity-forum {
 						flex-direction: row;
 						justify-content: stretch;
 
-						.left, .right, .fill {
+						.left,
+						.right,
+						.fill {
 							flex-grow: 1;
 							flex-shrink: 1;
 
-							width: calc(50% - .5em); /* the .5em for the padding/margin */
+							width: calc(50% - .5em);
+
+							/* the .5em for the padding/margin */
 							&.fill {
 								width: calc(100% - 1em);
 							}
@@ -410,7 +421,8 @@
 
 								background-color: $color_list_background;
 
-								&.container-devices, .container-devices {
+								&.container-devices,
+								.container-devices {
 									flex-grow: 1;
 									flex-shrink: 1;
 
@@ -451,7 +463,7 @@
 											border: none;
 											border-right: 1px solid #242527;
 
-											> .icon_em {
+											>.icon_em {
 												font-size: 2em;
 												opacity: 0;
 											}
@@ -530,7 +542,7 @@
 
 										&.selected {
 											.container-selected {
-												> .icon_em {
+												>.icon_em {
 													opacity: 1;
 												}
 
@@ -540,7 +552,9 @@
 												border-bottom: 1px solid #242527;
 												border-top: 1px solid #242527;
 											}
-											.container-name, .container-activity {
+
+											.container-name,
+											.container-activity {
 												margin-top: 0;
 												margin-bottom: 0;
 
@@ -588,8 +602,10 @@
 							}
 						}
 
-						.right, .fill {
+						.right,
-							padding-right: .5em; /* for the sliders etc*/
+						.fill {
+							padding-right: .5em;
+							/* for the sliders etc*/
 							justify-content: flex-start;
 
 							.body {
@@ -628,14 +644,14 @@
 										flex-direction: column;
 										justify-content: stretch;
 
-										> .container {
+										>.container {
 											padding: 0;
 
 											display: flex;
 											flex-direction: row;
 											justify-content: space-between;
 
-											> label {
+											>label {
 												flex-shrink: 0;
 												min-width: 5em;
 
@@ -706,13 +722,14 @@
 
 										.container-activity-bar {
 											.bar-hider {
-												width: 100%!important;
+												width: 100% !important;
 											}
 
 											.thumb {
-												background-color: #4d4d4d!important;
+												background-color: #4d4d4d !important;
+
 												.tooltip {
-													opacity: 0!important;
+													opacity: 0 !important;
 												}
 											}
 										}
@@ -785,9 +802,9 @@
 
 												background-color: transparent;
 
-												-webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+												-webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
-												-moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+												-moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
-												box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+												box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
 
 												&::-webkit-inner-spin-button,
 												&::-webkit-outer-spin-button {
@@ -1082,11 +1099,13 @@
 
 		position: relative;
 
-		.left, .right {
+		.left,
+		.right {
 			flex-grow: 1;
 			flex-shrink: 1;
 
-			width: calc(50% - .5em); /* the .5em for the padding/margin */
+			width: calc(50% - .5em);
+			/* the .5em for the padding/margin */
 
 			display: flex;
 			flex-direction: column;
@@ -1158,16 +1177,17 @@
 
 				background-color: #242527;
 
-				-webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.75);
+				-webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.75);
-				-moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.75);
+				-moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.75);
-				box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.75);
+				box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.75);
 
 				border-bottom-right-radius: $border_radius_large;
 				border-top-right-radius: $border_radius_large;
 			}
 
 			&[value] {
-				overflow: visible; /* for the thumb */
+				overflow: visible;
+				/* for the thumb */
 
 				border-bottom-left-radius: $border_radius_large;
 				border-top-left-radius: $border_radius_large;
@@ -1212,16 +1232,21 @@
 				}
 			}
 
-			-webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+			-webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
-			-moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+			-moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
-			box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+			box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
 
 			/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#70407e+0,45407e+100 */
-			background: rgb(112,64,126); /* Old browsers */
+			background: rgb(112, 64, 126);
-			background: -moz-linear-gradient(left,  rgba(112,64,126,1) 0%, rgba(69,64,126,1) 100%); /* FF3.6-15 */
+			/* Old browsers */
-			background: -webkit-linear-gradient(left,  rgba(112,64,126,1) 0%,rgba(69,64,126,1) 100%); /* Chrome10-25,Safari5.1-6 */
+			background: -moz-linear-gradient(left, rgba(112, 64, 126, 1) 0%, rgba(69, 64, 126, 1) 100%);
-			background: linear-gradient(to right,  rgba(112,64,126,1) 0%,rgba(69,64,126,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+			/* FF3.6-15 */
-			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#70407e', endColorstr='#45407e',GradientType=1 ); /* IE6-9 */
+			background: -webkit-linear-gradient(left, rgba(112, 64, 126, 1) 0%, rgba(69, 64, 126, 1) 100%);
+			/* Chrome10-25,Safari5.1-6 */
+			background: linear-gradient(to right, rgba(112, 64, 126, 1) 0%, rgba(69, 64, 126, 1) 100%);
+			/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#70407e', endColorstr='#45407e', GradientType=1);
+			/* IE6-9 */
 		}
 
 		.left {
@@ -1245,7 +1270,8 @@
 
 				background-color: $color_list_background;
 
-				&.container-devices, .container-devices {
+				&.container-devices,
+				.container-devices {
 					flex-grow: 1;
 					flex-shrink: 1;
 
@@ -1288,7 +1314,7 @@
 							border: none;
 							border-right: 1px solid #242527;
 
-							> * {
+							>* {
 								padding: .5em;
 								position: absolute;
 
@@ -1300,21 +1326,21 @@
 								margin: auto;
 							}
 
-							> .icon_em {
+							>.icon_em {
 								font-size: 2em;
 								opacity: 0;
 							}
 
-							> .icon-loading {
+							>.icon-loading {
 								opacity: 0;
 
 								img {
 									max-height: 100%;
 									max-width: 100%;
 
-									-webkit-animation:spin 4s linear infinite;
+									-webkit-animation: spin 4s linear infinite;
-									-moz-animation:spin 4s linear infinite;
+									-moz-animation: spin 4s linear infinite;
-									animation:spin 4s linear infinite;
+									animation: spin 4s linear infinite;
 								}
 							}
 						}
@@ -1392,7 +1418,7 @@
 
 						&.selected {
 							.container-selected {
-								> .icon_em {
+								>.icon_em {
 									opacity: 1;
 								}
 
@@ -1402,7 +1428,9 @@
 								border-bottom: 1px solid #242527;
 								border-top: 1px solid #242527;
 							}
-							.container-name, .container-activity {
+
+							.container-name,
+							.container-activity {
 								margin-top: 0;
 								margin-bottom: 0;
 
@@ -1480,7 +1508,8 @@
 		}
 
 		.right {
-			padding-right: .5em; /* for the sliders etc*/
+			padding-right: .5em;
+			/* for the sliders etc*/
 			justify-content: flex-start;
 
 			.body {
@@ -1519,14 +1548,14 @@
 						flex-direction: column;
 						justify-content: stretch;
 
-						> .container {
+						>.container {
 							padding: 0;
 
 							display: flex;
 							flex-direction: row;
 							justify-content: space-between;
 
-							> label {
+							>label {
 								flex-shrink: 0;
 								min-width: 5em;
 
@@ -1597,13 +1626,14 @@
 
 						.container-activity-bar {
 							.bar-hider {
-								width: 100%!important;
+								width: 100% !important;
 							}
 
 							.thumb {
-								background-color: #4d4d4d!important;
+								background-color: #4d4d4d !important;
+
 								.tooltip {
-									opacity: 0!important;
+									opacity: 0 !important;
 								}
 							}
 						}
@@ -1676,9 +1706,9 @@
 
 								background-color: transparent;
 
-								-webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+								-webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
-								-moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+								-moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
-								box-shadow: inset 0 0 2px 0 rgba(0,0,0,0.25);
+								box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.25);
 
 								&::-webkit-inner-spin-button,
 								&::-webkit-outer-spin-button {
@@ -1731,7 +1761,8 @@
 
 		position: relative;
 
-		.left, .right {
+		.left,
+		.right {
 			flex-grow: 1;
 			flex-shrink: 1;
 
@@ -1902,11 +1933,13 @@
 								text-overflow: ellipsis;
 								white-space: nowrap;
 
-								> *:not(:first-of-type) {
+								>*:not(:first-of-type) {
 									margin-left: .25em;
 								}
+
 								.icon-status {
-									margin-bottom: .2em; /* push it a bit higher than the center */
+									margin-bottom: .2em;
+									/* push it a bit higher than the center */
 								}
 
 								div {
@@ -1934,7 +1967,8 @@
 					}
 				}
 
-				.buttons, .buttons-small {
+				.buttons,
+				.buttons-small {
 					flex-grow: 0;
 					flex-shrink: 0;
 
@@ -1977,7 +2011,8 @@
 		}
 
 		.right {
-			padding-right: .5em; /* for the sliders etc*/
+			padding-right: .5em;
+			/* for the sliders etc*/
 			justify-content: flex-start;
 
 			.body {
@@ -1988,7 +2023,7 @@
 				flex-direction: column;
 				justify-content: stretch;
 
-				> div {
+				>div {
 					flex-shrink: 0;
 				}
 
@@ -1997,6 +2032,7 @@
 						padding: 1em;
 						text-align: center;
 					}
+
 					.container-valid {
 						.container-level {
 							display: flex;
@@ -2023,7 +2059,7 @@
 						flex-direction: row;
 						justify-content: space-between;
 
-						> div {
+						>div {
 							text-align: right;
 
 							width: max-content;
@@ -2042,17 +2078,6 @@
 					}
 				}
 
-				.container-teaforo {
-					.container-valid, .container-invalid {
-						padding: 1em;
-						text-align: center;
-
-						button {
-							margin-top: .5em;
-						}
-					}
-				}
-
 				.container-highlight-dummy {
 					margin-top: 1em;
 					margin-bottom: .5em;
@@ -2065,9 +2090,11 @@
 	}
 
 	/* the highlight stuff for the newcommer modal */
-	.container-settings-identity-profile, .container-settings-audio-microphone {
+	.container-settings-identity-profile,
+	.container-settings-audio-microphone {
 		$highlight-time: .5s;
 		$backdrop-color: rgba(0, 0, 0, .9);
+
 		.help-background {
 			position: absolute;
 
@@ -2164,12 +2191,13 @@
 				}
 			}
 
-			.container-teamspeak, .container-teaforo, .container-nickname {
+			.container-teamspeak,
+			.container-nickname {
 				display: none;
 			}
 
 			.container-highlight-dummy {
-				display: flex!important;
+				display: flex !important;
 			}
 
 			&.hide-help {
@@ -2195,17 +2223,32 @@
 	:global {
 		.container-settings-identity-profile {
 			.buttons {
-				display: flex!important;
+				display: flex !important;
 			}
 
 			.buttons-small {
-				display: none!important;
+				display: none !important;
 			}
 		}
 	}
 }
 
 
-@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
+@-moz-keyframes spin {
-@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
+	100% {
-@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
+		-moz-transform: rotate(360deg);
+	}
+}
+
+@-webkit-keyframes spin {
+	100% {
+		-webkit-transform: rotate(360deg);
+	}
+}
+
+@keyframes spin {
+	100% {
+		-webkit-transform: rotate(360deg);
+		transform: rotate(360deg);
+	}
+}

shared/html/templates.html

@@ -1,12 +1,14 @@
 <!DOCTYPE html>
 <html lang="en">
-    <head>
+
-        <meta charset="UTF-8">
+<head>
-        <title>TeaSpeak-Web client templates</title>
+    <meta charset="UTF-8">
-    </head>
+    <title>TeaSpeak-Web client templates</title>
-    <body>
+</head>
-        <div class="template-group-modals">
+
-            <script class="jsrender-template" id="tmpl_modal" type="text/html">
+<body>
+    <div class="template-group-modals">
+        <script class="jsrender-template" id="tmpl_modal" type="text/html">
                 <div class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
                     <div class="modal-dialog modal-dialog-centered" role="document">
                         <div class="modal-content" style="{{if full_size}}flex-grow: 1{{/if}}">
@@ -32,7 +34,7 @@
                 </div>
             </script>
 
-            <script class="jsrender-template" id="tmpl_modal_input" type="text/html">
+        <script class="jsrender-template" id="tmpl_modal_input" type="text/html">
                 <div class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
                     <div class="modal-dialog modal-dialog-centered" role="document">
                         <div class="modal-content">
@@ -82,10 +84,10 @@
                     </div>
                 </div>
             </script>
-        </div>
+    </div>
 
-        <!-- Template for the settings -->
+    <!-- Template for the settings -->
-        <script class="jsrender-template" id="tmpl_settings" type="text/html">
+    <script class="jsrender-template" id="tmpl_settings" type="text/html">
             <div class="inner-container">
                 <div class="left">
                     <div class="entry group">{{tr "General Settings" /}}</div>
@@ -103,7 +105,6 @@
 
                     <div class="entry group">{{tr "Identity" /}}</div>
                     <div class="entry" container="identity-profiles">{{tr "Profiles" /}}</div>
-                    <div class="entry" container="identity-forum">{{tr "TeaForo connection" /}}</div>
                 </div>
                 <div class="container-seperator vertical" seperator-id="seperator-settings"></div>
                 <div class="right">
@@ -360,7 +361,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_settings-profiles" type="text/html">
+    <script class="jsrender-template" id="tmpl_settings-profiles" type="text/html">
             <div class="container-settings-identity-profile">
                 <div class="left highlight-profile-list highlightable">
                     <div class="header">
@@ -417,7 +418,6 @@
                                 <select class="form-control profile-identity-type">
                                     <option value="error" style="display: none">error: error</option>
                                     <option value="unset" style="display: none">{{tr "Unset" /}}</option>
-                                    <option value="teaforo">{{tr "Forum Account" /}}</option>
                                     <option value="teamspeak">{{tr "TeamSpeak Identity" /}}</option>
                                     <option value="nickname">{{tr "Nickname (Debug only!)" /}}</option>
                                 </select>
@@ -453,16 +453,6 @@
                                 </div>
                             </div>
                         </div>
-                        <div class="container-teaforo">
-                            <div class="container-valid">
-                                {{tr "You're using your forum account as identification" /}}
-                            </div>
-                            <div class="container-invalid">
-                                <a>{{tr "You cant use your TeaSpeak forum account. You're not connected with your forum Account!" /}}</a>
-                                <button class="btn btn-success button-setup">{{tr "Setup your connection" /}}
-                                </button>
-                            </div>
-                        </div>
                         <div class="container-nickname">
                             <div class="form-group">
                                 <label>{{tr "Nickname" /}}</label>
@@ -482,7 +472,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_settings-sound_entry" type="text/html">
+    <script class="jsrender-template" id="tmpl_settings-sound_entry" type="text/html">
             <div class="entry">
                 <div class="column sound-name">
                     <div class="icon client-play button-playback"></div>
@@ -498,7 +488,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_settings-teamspeak_import" type="text/html">
+    <script class="jsrender-template" id="tmpl_settings-teamspeak_import" type="text/html">
             <div>
                 <div class="container-status"><a></a></div>
                 <fieldset class="">
@@ -534,7 +524,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_settings-teamspeak_improve" type="text/html">
+    <script class="jsrender-template" id="tmpl_settings-teamspeak_improve" type="text/html">
             <div>
                 <div class="options">
                     <div class="title">{{tr "Identity: "/}} {{>identity_name}}</div>
@@ -597,7 +587,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="settings-profile-list-entry" type="text/html">
+    <script class="jsrender-template" id="settings-profile-list-entry" type="text/html">
             <div class="entry profile {{if id == 'default'}}default{{/if}}">
                 <div class="name">{{>profile_name}}</div>
                 <!-- <div class="button button-delete"><div class="icon client-delete"></div></div> -->
@@ -606,7 +596,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="settings-translations-list-entry" type="text/html">
+    <script class="jsrender-template" id="settings-translations-list-entry" type="text/html">
             {{if type == "repository" }}
             <div class="entry repository" repository="{{:id}}">
                 <div class="name">{{> name}}</div>
@@ -634,7 +624,7 @@
             {{/if}}
         </script>
 
-        <script class="jsrender-template" id="settings-translations-list-entry-info" type="text/html">
+    <script class="jsrender-template" id="settings-translations-list-entry-info" type="text/html">
             <div class="entry-info-container">
                 {{if type == "repository" }}
                 <!--
@@ -713,7 +703,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_change_latency" type="text/html">
+    <script class="jsrender-template" id="tmpl_change_latency" type="text/html">
             <div> <!-- for the renderer -->
                 <div class="info">
                     <div>{{tr "Change latency for client "/}} <node key="client"></node></div>
@@ -758,7 +748,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_server_edit" type="text/html">
+    <script class="jsrender-template" id="tmpl_server_edit" type="text/html">
             <div> <!-- Only for rendering -->
                 <div class="container-general">
                     <div class="container-name-icon">
@@ -1354,8 +1344,8 @@
             </div>
         </script>
 
-        <!-- General management templates -->
+    <!-- General management templates -->
-        <script class="jsrender-template" id="tmpl_ban_list" type="text/html">
+    <script class="jsrender-template" id="tmpl_ban_list" type="text/html">
         <div> <!-- required for jquery -->
             <div class="left">
                 <div class="head">
@@ -1641,7 +1631,7 @@
         </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_client_ban" type="text/html">
+    <script class="jsrender-template" id="tmpl_client_ban" type="text/html">
             <div> <!-- for the renderer -->
                 <div class="container-info">
                     <div class="container container-name">
@@ -1724,7 +1714,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_query_create" type="text/html">
+    <script class="jsrender-template" id="tmpl_query_create" type="text/html">
             <div class="query-create">
                 <a>{{tr "Set the login name for your Server Query account." /}}</a>
                 <a>{{tr "You'll receive your password within the next step." /}}</a>
@@ -1738,7 +1728,7 @@
                 </div>
             </div>
         </script>
-        <script class="jsrender-template" id="tmpl_query_created" type="text/html">
+    <script class="jsrender-template" id="tmpl_query_created" type="text/html">
             <div class="query-created">
                 <a>{{tr "Your server query credentials:" /}}</a>
                 <div class="form-row">
@@ -1763,7 +1753,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_query_manager" type="text/html">
+    <script class="jsrender-template" id="tmpl_query_manager" type="text/html">
             <div class="container"> <!-- required for the seperator -->
                 <div class="left">
                     <div class="title">
@@ -1823,7 +1813,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_avatar_list" type="text/html">
+    <script class="jsrender-template" id="tmpl_avatar_list" type="text/html">
             <div class="modal-avatar-list">
                 <div class="container-list">
                     <div class="list-header">
@@ -1885,7 +1875,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_avatar_list-list_entry" type="text/html">
+    <script class="jsrender-template" id="tmpl_avatar_list-list_entry" type="text/html">
             <div class="entry">
                 <div class="column column-username">{{>username}}</div>
                 <div class="column column-unique-id">{{>unique_id}}</div>
@@ -1894,7 +1884,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_key_select" type="text/html">
+    <script class="jsrender-template" id="tmpl_key_select" type="text/html">
             <div> <!-- required for the renderer-->
                 <div class="body">
                     <a>{{tr "Press any key which you want to use." /}}</a>
@@ -1912,7 +1902,7 @@
             </div>
         </script>
 
-        <script class="jsrender-template" id="tmpl_client_info" type="text/html">
+    <script class="jsrender-template" id="tmpl_client_info" type="text/html">
             <div> <!-- Important for the renderer -->
                 <div class="head">
                     <div class="status-row">
@@ -1970,14 +1960,6 @@
                                             </div>
                                         </div>
                                     </div>
-                                    <div class="property property-teaforo">
-                                        <div class="title">
-                                            <a>{{tr "TeaForo Connection" /}}</a>
-                                        </div>
-                                        <div class="value">
-                                            <a>This will be a really long string...</a>
-                                        </div>
-                                    </div>
                                     <div class="property property-version">
                                         <div class="title">
                                             <a>{{tr "Version" /}}</a>
@@ -2169,5 +2151,6 @@
                 </div>
             </div>
         </script>
-    </body>
+</body>
+
 </html>

shared/js/Bookmarks.ts

@@ -1,14 +1,14 @@
 import * as loader from "tc-loader";
-import { Stage } from "tc-loader";
+import {Stage} from "tc-loader";
-import { ignorePromise, WritableKeys } from "tc-shared/proto";
+import {ignorePromise, WritableKeys} from "tc-shared/proto";
-import { LogCategory, logDebug, logError, logInfo, logTrace, logWarn } from "tc-shared/log";
+import {LogCategory, logDebug, logError, logInfo, logTrace, logWarn} from "tc-shared/log";
-import { guid } from "tc-shared/crypto/uid";
+import {guid} from "tc-shared/crypto/uid";
-import { Registry } from "tc-events";
+import {Registry} from "tc-events";
-import { server_connections } from "tc-shared/ConnectionManager";
+import {server_connections} from "tc-shared/ConnectionManager";
-import { defaultConnectProfile, findConnectProfile } from "tc-shared/profiles/ConnectionProfile";
+import {defaultConnectProfile, findConnectProfile} from "tc-shared/profiles/ConnectionProfile";
-import { ConnectionState } from "tc-shared/ConnectionHandler";
+import {ConnectionState} from "tc-shared/ConnectionHandler";
 import * as _ from "lodash";
-import { getStorageAdapter } from "tc-shared/StorageAdapter";
+import {getStorageAdapter} from "tc-shared/StorageAdapter";
 
 type BookmarkBase = {
     readonly uniqueId: string,
@@ -64,9 +64,9 @@ export class BookmarkManager {
 
     async loadBookmarks() {
         const bookmarksJson = await getStorageAdapter().get(kStorageKey);
-        if (typeof bookmarksJson !== "string") {
+        if(typeof bookmarksJson !== "string") {
             const oldBookmarksJson = await getStorageAdapter().get("bookmarks");
-            if (typeof oldBookmarksJson === "string") {
+            if(typeof oldBookmarksJson === "string") {
                 logDebug(LogCategory.BOOKMARKS, tr("Found no new bookmarks but found old bookmarks. Trying to import."));
                 try {
                     this.importOldBookmarks(oldBookmarksJson);
@@ -83,7 +83,7 @@ export class BookmarkManager {
         } else {
             try {
                 const storageData = JSON.parse(bookmarksJson);
-                if (storageData.version !== 2) {
+                if(storageData.version !== 2) {
                     throw tr("bookmark storage has an invalid version");
                 }
 
@@ -99,7 +99,7 @@ export class BookmarkManager {
             }
         }
 
-        if (!this.defaultBookmarkCreated && this.registeredBookmarks.length === 0) {
+        if(!this.defaultBookmarkCreated && this.registeredBookmarks.length === 0) {
             this.defaultBookmarkCreated = true;
 
             logDebug(LogCategory.BOOKMARKS, tr("No bookmarks found. Registering default bookmark."));
@@ -107,12 +107,12 @@ export class BookmarkManager {
                 connectOnStartup: false,
                 connectProfile: "default",
 
-                displayName: "Our LanPart<",
+                displayName: "Official TeaSpeak - Test server",
 
                 parentEntry: undefined,
                 previousEntry: undefined,
 
-                serverAddress: "tea.lp.kle.li",
+                serverAddress: "ts.teaspeak.de",
                 serverPasswordHash: undefined,
 
                 defaultChannel: undefined,
@@ -123,21 +123,21 @@ export class BookmarkManager {
 
     private importOldBookmarks(jsonData: string) {
         const data = JSON.parse(jsonData);
-        if (typeof data?.root_bookmark !== "object") {
+        if(typeof data?.root_bookmark !== "object") {
             throw tr("missing root bookmark");
         }
 
-        if (!Array.isArray(data?.root_bookmark?.content)) {
+        if(!Array.isArray(data?.root_bookmark?.content)) {
             throw tr("Missing root bookmarks content");
         }
 
-        const registerBookmarks = (parentEntry: string, previousEntry: string, entry: any): string | undefined => {
+        const registerBookmarks = (parentEntry: string, previousEntry: string, entry: any) : string | undefined => {
-            if (typeof entry.display_name !== "string") {
+            if(typeof entry.display_name !== "string") {
                 logWarn(LogCategory.BOOKMARKS, tr("Missing display_name in old bookmark entry. Skipping entry."));
                 return undefined;
             }
 
-            if ("content" in entry) {
+            if("content" in entry) {
                 /* it was a directory */
                 const directory = this.createDirectory({
                     previousEntry,
@@ -152,23 +152,23 @@ export class BookmarkManager {
                 });
             } else {
                 /* it was a normal entry */
-                if (typeof entry.connect_profile !== "string") {
+                if(typeof entry.connect_profile !== "string") {
                     logWarn(LogCategory.BOOKMARKS, tr("Missing connect_profile in old bookmark entry. Skipping entry."));
                     return undefined;
                 }
 
-                if (typeof entry.server_properties?.server_address !== "string") {
+                if(typeof entry.server_properties?.server_address !== "string") {
                     logWarn(LogCategory.BOOKMARKS, tr("Missing server_address in old bookmark entry. Skipping entry."));
                     return undefined;
                 }
 
-                if (typeof entry.server_properties?.server_port !== "number") {
+                if(typeof entry.server_properties?.server_port !== "number") {
                     logWarn(LogCategory.BOOKMARKS, tr("Missing server_port in old bookmark entry. Skipping entry."));
                     return undefined;
                 }
 
                 let serverAddress;
-                if (entry.server_properties.server_address.indexOf(":") !== -1) {
+                if(entry.server_properties.server_address.indexOf(":") !== -1) {
                     serverAddress = `[${entry.server_properties.server_address}]`;
                 } else {
                     serverAddress = entry.server_properties.server_address;
@@ -209,23 +209,23 @@ export class BookmarkManager {
         }));
     }
 
-    getRegisteredBookmarks(): BookmarkEntry[] {
+    getRegisteredBookmarks() : BookmarkEntry[] {
         return this.registeredBookmarks;
     }
 
-    getOrderedRegisteredBookmarks(): OrderedBookmarkEntry[] {
+    getOrderedRegisteredBookmarks() : OrderedBookmarkEntry[] {
         const unorderedBookmarks = this.registeredBookmarks.slice(0);
         const orderedBookmarks: OrderedBookmarkEntry[] = [];
 
         const orderTreeLayer = (entries: BookmarkEntry[]): BookmarkEntry[] => {
-            if (entries.length === 0) {
+            if(entries.length === 0) {
                 return [];
             }
 
             const result = [];
-            while (entries.length > 0) {
+            while(entries.length > 0) {
                 let head = entries.find(entry => !entry.previousEntry) || entries[0];
-                while (head) {
+                while(head) {
                     result.push(head);
                     entries.remove(head);
                     head = entries.find(entry => entry.previousEntry === head.uniqueId);
@@ -240,7 +240,7 @@ export class BookmarkManager {
             children.forEach(child => unorderedBookmarks.remove(child));
 
             const childCount = children.length;
-            for (const entry of orderTreeLayer(children)) {
+            for(const entry of orderTreeLayer(children)) {
                 let orderedEntry: OrderedBookmarkEntry = {
                     entry: entry,
                     depth: depth,
@@ -264,11 +264,11 @@ export class BookmarkManager {
         return orderedBookmarks;
     }
 
-    findBookmark(uniqueId: string): BookmarkEntry | undefined {
+    findBookmark(uniqueId: string) : BookmarkEntry | undefined {
         return this.registeredBookmarks.find(entry => entry.uniqueId === uniqueId);
     }
 
-    createBookmark(properties: Pick<BookmarkInfo, WritableKeys<BookmarkInfo>>): BookmarkInfo {
+    createBookmark(properties: Pick<BookmarkInfo, WritableKeys<BookmarkInfo>>) : BookmarkInfo {
         this.validateHangInPoint(properties);
         const bookmark = Object.assign(properties, {
             uniqueId: guid(),
@@ -284,7 +284,7 @@ export class BookmarkManager {
         this.doEditBookmark(uniqueId, newValues);
     }
 
-    createDirectory(properties: Pick<BookmarkInfo, WritableKeys<BookmarkDirectory>>): BookmarkDirectory {
+    createDirectory(properties: Pick<BookmarkInfo, WritableKeys<BookmarkDirectory>>) : BookmarkDirectory {
         this.validateHangInPoint(properties);
         const bookmark = Object.assign(properties, {
             uniqueId: guid(),
@@ -300,20 +300,20 @@ export class BookmarkManager {
         this.doEditBookmark(uniqueId, newValues);
     }
 
-    directoryContents(uniqueId: string): BookmarkEntry[] {
+    directoryContents(uniqueId: string) : BookmarkEntry[] {
         return this.registeredBookmarks.filter(bookmark => bookmark.parentEntry === uniqueId);
     }
 
     deleteEntry(uniqueId: string) {
         const index = this.registeredBookmarks.findIndex(entry => entry.uniqueId === uniqueId);
-        if (index === -1) {
+        if(index === -1) {
             return;
         }
 
-        const [entry] = this.registeredBookmarks.splice(index, 1);
+        const [ entry ] = this.registeredBookmarks.splice(index, 1);
-        const children = [], pendingChildren = [entry];
+        const children = [], pendingChildren = [ entry ];
 
-        while (pendingChildren[0]) {
+        while(pendingChildren[0]) {
             const child = pendingChildren.pop_front();
             children.push(child);
 
@@ -329,12 +329,12 @@ export class BookmarkManager {
 
     executeConnect(uniqueId: string, newTab: boolean) {
         const bookmark = this.findBookmark(uniqueId);
-        if (!bookmark || bookmark.type !== "entry") {
+        if(!bookmark || bookmark.type !== "entry") {
             return;
         }
 
         const connection = newTab ? server_connections.spawnConnectionHandler() : server_connections.getActiveConnectionHandler();
-        if (!connection) {
+        if(!connection) {
             return;
         }
 
@@ -360,12 +360,12 @@ export class BookmarkManager {
 
     executeAutoConnect() {
         let newTab = server_connections.getActiveConnectionHandler().connection_state !== ConnectionState.UNCONNECTED;
-        for (const entry of this.getOrderedRegisteredBookmarks()) {
+        for(const entry of this.getOrderedRegisteredBookmarks()) {
-            if (entry.entry.type !== "entry") {
+            if(entry.entry.type !== "entry") {
                 continue;
             }
 
-            if (!entry.entry.connectOnStartup) {
+            if(!entry.entry.connectOnStartup) {
                 continue;
             }
 
@@ -374,14 +374,14 @@ export class BookmarkManager {
         }
     }
 
-    exportBookmarks(): string {
+    exportBookmarks() : string {
         return JSON.stringify({
             version: 1,
             bookmarks: this.registeredBookmarks
         });
     }
 
-    importBookmarks(filePayload: string): number {
+    importBookmarks(filePayload: string) : number {
         let data;
         try {
             data = JSON.parse(filePayload)
@@ -389,26 +389,26 @@ export class BookmarkManager {
             throw tr("failed to parse bookmarks");
         }
 
-        if (data?.version !== 1) {
+        if(data?.version !== 1) {
             throw tr("supplied data contains invalid version");
         }
 
         const newBookmarks = data.bookmarks as BookmarkEntry[];
-        if (!Array.isArray(newBookmarks)) {
+        if(!Array.isArray(newBookmarks)) {
             throw tr("missing bookmarks");
         }
 
         /* TODO: Validate integrity? */
-        for (const knownBookmark of this.registeredBookmarks) {
+        for(const knownBookmark of this.registeredBookmarks) {
             const index = newBookmarks.findIndex(entry => entry.uniqueId === knownBookmark.uniqueId);
-            if (index === -1) {
+            if(index === -1) {
                 continue;
             }
 
             newBookmarks.splice(index, 1);
         }
 
-        if (newBookmarks.length === 0) {
+        if(newBookmarks.length === 0) {
             return;
         }
 
@@ -420,26 +420,26 @@ export class BookmarkManager {
 
     private doEditBookmark(uniqueId: string, newValues: any) {
         const bookmarkInfo = this.findBookmark(uniqueId);
-        if (!bookmarkInfo) {
+        if(!bookmarkInfo) {
             return;
         }
 
         const originalProperties = _.cloneDeep(bookmarkInfo);
-        for (const key of Object.keys(newValues)) {
+        for(const key of Object.keys(newValues)) {
             bookmarkInfo[key] = newValues[key];
         }
         this.validateHangInPoint(bookmarkInfo);
 
         const editedKeys = [];
-        for (const key of Object.keys(newValues)) {
+        for(const key of Object.keys(newValues)) {
-            if (_.isEqual(bookmarkInfo[key], originalProperties[key])) {
+            if(_.isEqual(bookmarkInfo[key], originalProperties[key])) {
                 continue;
             }
 
             editedKeys.push(key);
         }
 
-        if (editedKeys.length === 0) {
+        if(editedKeys.length === 0) {
             return;
         }
 
@@ -448,12 +448,12 @@ export class BookmarkManager {
     }
 
     private validateHangInPoint(entry: Partial<BookmarkBase>) {
-        if (entry.previousEntry) {
+        if(entry.previousEntry) {
             const previousEntry = this.findBookmark(entry.previousEntry);
-            if (!previousEntry) {
+            if(!previousEntry) {
                 logError(LogCategory.BOOKMARKS, tr("New bookmark previous entry does not exists. Clearing it."));
                 entry.previousEntry = undefined;
-            } else if (previousEntry.parentEntry !== entry.parentEntry) {
+            } else if(previousEntry.parentEntry !== entry.parentEntry) {
                 logWarn(LogCategory.BOOKMARKS, tr("Previous entries parent does not match our entries parent. Updating our parent from %s to %s"), entry.parentEntry, previousEntry.parentEntry);
                 entry.parentEntry = previousEntry.parentEntry;
             }
@@ -461,13 +461,13 @@ export class BookmarkManager {
 
             const openList = this.registeredBookmarks.filter(e1 => e1.parentEntry === entry.parentEntry);
             let currentEntry = entry;
-            while (true) {
+            while(true) {
-                if (!currentEntry.previousEntry) {
+                if(!currentEntry.previousEntry) {
                     break;
                 }
 
                 const previousEntry = openList.find(entry => entry.uniqueId === currentEntry.previousEntry);
-                if (!previousEntry) {
+                if(!previousEntry) {
                     logError(LogCategory.BOOKMARKS, tr("Found circular dependency within the previous entry or one of the previous entries does not exists. Clearing out previous entry."));
                     entry.previousEntry = undefined;
                     break;
@@ -478,22 +478,22 @@ export class BookmarkManager {
             }
         }
 
-        if (entry.parentEntry) {
+        if(entry.parentEntry) {
             const parentEntry = this.findBookmark(entry.parentEntry);
-            if (!parentEntry) {
+            if(!parentEntry) {
                 logError(LogCategory.BOOKMARKS, tr("Missing parent entry %s. Clearing it."), entry.parentEntry);
                 entry.parentEntry = undefined;
             }
 
             const openList = this.registeredBookmarks.slice();
             let currentEntry = entry;
-            while (true) {
+            while(true) {
-                if (!currentEntry.parentEntry) {
+                if(!currentEntry.parentEntry) {
                     break;
                 }
 
                 const parentEntry = openList.find(entry => entry.uniqueId === currentEntry.parentEntry);
-                if (!parentEntry) {
+                if(!parentEntry) {
                     logError(LogCategory.BOOKMARKS, tr("Found circular dependency within a parent or one of the parents does not exists. Clearing out parent."));
                     entry.parentEntry = undefined;
                     break;
@@ -504,9 +504,9 @@ export class BookmarkManager {
             }
         }
 
-        if (entry.previousEntry) {
+        if(entry.previousEntry) {
             this.registeredBookmarks.forEach(bookmark => {
-                if (bookmark.previousEntry === entry.previousEntry && bookmark !== entry) {
+                if(bookmark.previousEntry === entry.previousEntry && bookmark !== entry) {
                     bookmark.previousEntry = bookmark.uniqueId;
                 }
             });

shared/js/SelectedClientInfo.ts

@@ -1,12 +1,12 @@
-import {ConnectionHandler, ConnectionState} from "tc-shared/ConnectionHandler";
+import { ConnectionHandler, ConnectionState } from "tc-shared/ConnectionHandler";
 import {
     ClientForumInfo,
     ClientInfoType,
     ClientStatusInfo,
     ClientVersionInfo
 } from "tc-shared/ui/frames/side/ClientInfoDefinitions";
-import {ClientEntry, ClientType, LocalClientEntry} from "tc-shared/tree/Client";
+import { ClientEntry, ClientType, LocalClientEntry } from "tc-shared/tree/Client";
-import {Registry} from "tc-shared/events";
+import { Registry } from "tc-shared/events";
 import * as i18nc from "./i18n/CountryFlag";
 
 export type CachedClientInfoCategory = "name" | "description" | "online-state" | "country" | "volume" | "status" | "forum-account" | "group-channel" | "groups-server" | "version";
@@ -55,7 +55,7 @@ export class SelectedClientInfo {
         this.listenerClient = [];
         this.listenerConnection = [];
         this.listenerConnection.push(connection.channelTree.events.on("notify_client_leave_view", event => {
-            if(event.client !== this.currentClient) {
+            if (event.client !== this.currentClient) {
                 return;
             }
 
@@ -67,7 +67,7 @@ export class SelectedClientInfo {
         }));
 
         this.listenerConnection.push(connection.events().on("notify_connection_state_changed", event => {
-            if(event.newState !== ConnectionState.CONNECTED && this.currentClientStatus) {
+            if (event.newState !== ConnectionState.CONNECTED && this.currentClientStatus) {
                 this.currentClient = undefined;
                 this.currentClientStatus.leaveTimestamp = Date.now() / 1000;
                 this.events.fire("notify_cache_changed", { category: "online-state" });
@@ -82,23 +82,23 @@ export class SelectedClientInfo {
         this.unregisterClientEvents();
     }
 
-    getInfo() : CachedClientInfo {
+    getInfo(): CachedClientInfo {
         return this.currentClientStatus;
     }
 
     setClient(client: ClientEntry | undefined) {
-        if(this.currentClient === client) {
+        if (this.currentClient === client) {
             return;
         }
 
-        if(client.channelTree.client !== this.connection) {
+        if (client.channelTree.client !== this.connection) {
             throw tr("client does not belong to current connection handler");
         }
 
         this.unregisterClientEvents();
         this.currentClient = client;
         this.currentClientStatus = undefined;
-        if(this.currentClient) {
+        if (this.currentClient) {
             this.currentClient.updateClientVariables().then(undefined);
             this.registerClientEvents(this.currentClient);
             this.initializeClientInfo(this.currentClient);
@@ -107,7 +107,7 @@ export class SelectedClientInfo {
         this.events.fire("notify_client_changed", { newClient: client });
     }
 
-    getClient() : ClientEntry | undefined {
+    getClient(): ClientEntry | undefined {
         return this.currentClient;
     }
 
@@ -120,57 +120,52 @@ export class SelectedClientInfo {
         const events = this.listenerClient;
 
         events.push(client.events.on("notify_properties_updated", event => {
-            if('client_nickname' in event.updated_properties) {
+            if ('client_nickname' in event.updated_properties) {
                 this.currentClientStatus.name = event.client_properties.client_nickname;
                 this.events.fire("notify_cache_changed", { category: "name" });
             }
 
-            if('client_description' in event.updated_properties) {
+            if ('client_description' in event.updated_properties) {
                 this.currentClientStatus.description = event.client_properties.client_description;
                 this.events.fire("notify_cache_changed", { category: "description" });
             }
 
-            if('client_channel_group_id' in event.updated_properties || 'client_channel_group_inherited_channel_id' in event.updated_properties) {
+            if ('client_channel_group_id' in event.updated_properties || 'client_channel_group_inherited_channel_id' in event.updated_properties) {
                 this.updateChannelGroup(client);
                 this.events.fire("notify_cache_changed", { category: "group-channel" });
             }
 
-            if('client_servergroups' in event.updated_properties) {
+            if ('client_servergroups' in event.updated_properties) {
                 this.currentClientStatus.serverGroups = client.assignedServerGroupIds();
                 this.events.fire("notify_cache_changed", { category: "groups-server" });
             }
 
             /* Can happen since that variable isn't in view on client appearance */
-            if('client_lastconnected' in event.updated_properties) {
+            if ('client_lastconnected' in event.updated_properties) {
                 this.currentClientStatus.joinTimestamp = event.client_properties.client_lastconnected;
                 this.events.fire("notify_cache_changed", { category: "online-state" });
             }
 
-            if('client_country' in event.updated_properties) {
+            if ('client_country' in event.updated_properties) {
                 this.updateCachedCountry(client);
                 this.events.fire("notify_cache_changed", { category: "country" });
             }
 
-            for(const key of ["client_away", "client_away_message", "client_input_muted", "client_input_hardware", "client_output_muted", "client_output_hardware"]) {
+            for (const key of ["client_away", "client_away_message", "client_input_muted", "client_input_hardware", "client_output_muted", "client_output_hardware"]) {
-                if(key in event.updated_properties) {
+                if (key in event.updated_properties) {
                     this.updateCachedClientStatus(client);
                     this.events.fire("notify_cache_changed", { category: "status" });
                     break;
                 }
             }
 
-            if('client_platform' in event.updated_properties || 'client_version' in event.updated_properties) {
+            if ('client_platform' in event.updated_properties || 'client_version' in event.updated_properties) {
                 this.currentClientStatus.version = {
                     platform: client.properties.client_platform,
                     version: client.properties.client_version
                 };
                 this.events.fire("notify_cache_changed", { category: "version" });
             }
-
-            if('client_teaforo_flags' in event.updated_properties || 'client_teaforo_name' in event.updated_properties || 'client_teaforo_id' in event.updated_properties) {
-                this.updateForumAccount(client);
-                this.events.fire("notify_cache_changed", { category: "forum-account" });
-            }
         }));
 
         events.push(client.events.on("notify_audio_level_changed", () => {
@@ -209,22 +204,11 @@ export class SelectedClientInfo {
         }
     }
 
-    private updateForumAccount(client: ClientEntry) {
-        if(client.properties.client_teaforo_id) {
-            this.currentClientStatus.forumAccount = {
-                flags: client.properties.client_teaforo_flags,
-                nickname: client.properties.client_teaforo_name,
-                userId: client.properties.client_teaforo_id
-            };
-        } else {
-            this.currentClientStatus.forumAccount = undefined;
-        }
-    }
 
     private updateChannelGroup(client: ClientEntry) {
         this.currentClientStatus.channelGroup = client.properties.client_channel_group_id;
         this.currentClientStatus.channelGroupInheritedChannel = client.properties.client_channel_group_inherited_channel_id;
-        if(this.currentClientStatus.channelGroupInheritedChannel === client.currentChannel().channelId) {
+        if (this.currentClientStatus.channelGroupInheritedChannel === client.currentChannel().channelId) {
             this.currentClientStatus.channelGroupInheritedChannel = 0;
         }
     }
@@ -259,6 +243,5 @@ export class SelectedClientInfo {
         this.updateCachedClientStatus(client);
         this.updateCachedCountry(client);
         this.updateCachedVolume(client);
-        this.updateForumAccount(client);
     }
 }

shared/js/connection/rtc/Connection.ts

@@ -895,7 +895,7 @@ export class RTCConnection {
         this.peer = new RTCPeerConnection({
             bundlePolicy: "max-bundle",
             rtcpMuxPolicy: "require",
-            iceServers: [{ urls: ["stun:turn.lp.kle.li:3478"] }]
+            iceServers: [{ urls: ["stun:turn.lp.kle.li:3478", "stuns:turn.kle.li:5349"] }]
         });
 
         if (this.audioSupport) {

shared/js/main.tsx

@@ -1,31 +1,30 @@
 import * as loader from "tc-loader";
-import {initializeI18N, tra} from "./i18n/localize";
+import { initializeI18N, tra } from "./i18n/localize";
-import * as fidentity from "./profiles/identities/TeaForumIdentity";
 import * as global_ev_handler from "./events/ClientGlobalControlHandler";
-import {AppParameters, settings, Settings, UrlParameterBuilder, UrlParameterParser} from "tc-shared/settings";
+import { AppParameters, settings, Settings, UrlParameterBuilder, UrlParameterParser } from "tc-shared/settings";
-import {LogCategory, logDebug, logError, logInfo, logWarn} from "tc-shared/log";
+import { LogCategory, logDebug, logError, logInfo, logWarn } from "tc-shared/log";
-import {ConnectionHandler} from "tc-shared/ConnectionHandler";
+import { ConnectionHandler } from "tc-shared/ConnectionHandler";
-import {createErrorModal, createInfoModal} from "tc-shared/ui/elements/Modal";
+import { createErrorModal, createInfoModal } from "tc-shared/ui/elements/Modal";
-import {RecorderProfile, setDefaultRecorder} from "tc-shared/voice/RecorderProfile";
+import { RecorderProfile, setDefaultRecorder } from "tc-shared/voice/RecorderProfile";
-import {formatMessage} from "tc-shared/ui/frames/chat";
+import { formatMessage } from "tc-shared/ui/frames/chat";
-import {openModalNewcomer} from "tc-shared/ui/modal/ModalNewcomer";
+import { openModalNewcomer } from "tc-shared/ui/modal/ModalNewcomer";
-import {global_client_actions} from "tc-shared/events/GlobalEvents";
+import { global_client_actions } from "tc-shared/events/GlobalEvents";
-import {MenuEntryType, spawn_context_menu} from "tc-shared/ui/elements/ContextMenu";
+import { MenuEntryType, spawn_context_menu } from "tc-shared/ui/elements/ContextMenu";
-import {copyToClipboard} from "tc-shared/utils/helpers";
+import { copyToClipboard } from "tc-shared/utils/helpers";
-import {checkForUpdatedApp} from "tc-shared/update";
+import { checkForUpdatedApp } from "tc-shared/update";
-import {setupJSRender} from "tc-shared/ui/jsrender";
+import { setupJSRender } from "tc-shared/ui/jsrender";
-import {ConnectRequestData} from "tc-shared/ipc/ConnectHandler";
+import { ConnectRequestData } from "tc-shared/ipc/ConnectHandler";
-import {defaultConnectProfile, findConnectProfile} from "tc-shared/profiles/ConnectionProfile";
+import { defaultConnectProfile, findConnectProfile } from "tc-shared/profiles/ConnectionProfile";
-import {server_connections} from "tc-shared/ConnectionManager";
+import { server_connections } from "tc-shared/ConnectionManager";
-import {spawnConnectModalNew} from "tc-shared/ui/modal/connect/Controller";
+import { spawnConnectModalNew } from "tc-shared/ui/modal/connect/Controller";
-import {initializeKeyControl} from "./KeyControl";
+import { initializeKeyControl } from "./KeyControl";
-import {assertMainApplication} from "tc-shared/ui/utils";
+import { assertMainApplication } from "tc-shared/ui/utils";
-import {clientServiceInvite} from "tc-shared/clientservice";
+import { clientServiceInvite } from "tc-shared/clientservice";
-import {ActionResult} from "tc-services";
+import { ActionResult } from "tc-services";
-import {CommandResult} from "tc-shared/connection/ServerConnectionDeclaration";
+import { CommandResult } from "tc-shared/connection/ServerConnectionDeclaration";
-import {ErrorCode} from "tc-shared/connection/ErrorCode";
+import { ErrorCode } from "tc-shared/connection/ErrorCode";
-import {bookmarks} from "tc-shared/Bookmarks";
+import { bookmarks } from "tc-shared/Bookmarks";
-import {getAudioBackend, OutputDevice} from "tc-shared/audio/Player";
+import { getAudioBackend, OutputDevice } from "tc-shared/audio/Player";
 
 /* required import for init */
 import "svg-sprites/client-icons";
@@ -50,9 +49,9 @@ import "./ui/elements/Tab";
 import "./clientservice";
 import "./text/bbcode/InviteController";
 import "./text/bbcode/YoutubeController";
-import {initializeSounds, setSoundMasterVolume} from "./audio/Sounds";
+import { initializeSounds, setSoundMasterVolume } from "./audio/Sounds";
-import {getInstanceConnectHandler, setupIpcHandler} from "./ipc/BrowserIPC";
+import { getInstanceConnectHandler, setupIpcHandler } from "./ipc/BrowserIPC";
-import {promptYesNo} from "tc-shared/ui/modal/yes-no/Controller";
+import { promptYesNo } from "tc-shared/ui/modal/yes-no/Controller";
 
 assertMainApplication();
 
@@ -60,7 +59,7 @@ let preventWelcomeUI = false;
 async function initialize() {
     try {
         await initializeI18N();
-    } catch(error) {
+    } catch (error) {
         console.error(tr("Failed to initialized the translation system!\nError: %o"), error);
         loader.critical_error("Failed to setup the translation system");
         return;
@@ -75,13 +74,13 @@ async function initializeApp() {
     getAudioBackend().executeWhenInitialized(() => {
         const defaultDeviceId = getAudioBackend().getDefaultDeviceId();
         let targetDeviceId = settings.getValue(Settings.KEY_SPEAKER_DEVICE_ID, OutputDevice.DefaultDeviceId);
-        if(targetDeviceId === OutputDevice.DefaultDeviceId) {
+        if (targetDeviceId === OutputDevice.DefaultDeviceId) {
             targetDeviceId = defaultDeviceId;
         }
 
         getAudioBackend().setCurrentDevice(targetDeviceId).catch(error => {
             logWarn(LogCategory.AUDIO, tr("Failed to set last used output speaker device: %o"), error);
-            if(targetDeviceId !== defaultDeviceId) {
+            if (targetDeviceId !== defaultDeviceId) {
                 getAudioBackend().setCurrentDevice(defaultDeviceId).catch(error => {
                     logError(LogCategory.AUDIO, tr("Failed to set output device to default device: %o"), error);
                     createErrorModal(tr("Failed to initialize output device"), tr("Failed to initialize output device.")).open();
@@ -108,10 +107,10 @@ async function initializeApp() {
 /* The native client has received a connect request. */
 export function handleNativeConnectRequest(url: URL) {
     let serverAddress = url.host;
-    if(url.searchParams.has("port")) {
+    if (url.searchParams.has("port")) {
-        if(serverAddress.indexOf(':') !== -1) {
+        if (serverAddress.indexOf(':') !== -1) {
             logWarn(LogCategory.GENERAL, tr("Received connect request which specified the port twice (via parameter and host). Using host port."));
-        } else if(serverAddress.indexOf(":") === -1) {
+        } else if (serverAddress.indexOf(":") === -1) {
             serverAddress += ":" + url.searchParams.get("port");
         } else {
             serverAddress = `[${serverAddress}]:${url.searchParams.get("port")}`;
@@ -125,16 +124,16 @@ export async function handleConnectRequest(serverAddress: string, serverUniqueId
     const inviteLinkId = parameters.getValue(AppParameters.KEY_CONNECT_INVITE_REFERENCE, undefined);
     logDebug(LogCategory.STATISTICS, tr("Executing connect request with invite key reference: %o"), inviteLinkId);
 
-    if(inviteLinkId) {
+    if (inviteLinkId) {
         clientServiceInvite.logAction(inviteLinkId, "ConnectAttempt").then(result => {
-            if(result.status !== "success") {
+            if (result.status !== "success") {
                 logWarn(LogCategory.STATISTICS, tr("Failed to register connect attempt: %o"), result.result);
             }
         });
     }
 
     const result = await doHandleConnectRequest(serverAddress, serverUniqueId, parameters);
-    if(inviteLinkId) {
+    if (inviteLinkId) {
         let promise: Promise<ActionResult<void>>;
         switch (result.status) {
             case "success":
@@ -152,7 +151,7 @@ export async function handleConnectRequest(serverAddress: string, serverUniqueId
         }
 
         promise.then(result => {
-            if(result.status !== "success") {
+            if (result.status !== "success") {
                 logWarn(LogCategory.STATISTICS, tr("Failed to register connect result: %o"), result.result);
             }
         });
@@ -161,14 +160,14 @@ export async function handleConnectRequest(serverAddress: string, serverUniqueId
 
 type ConnectRequestResult = {
     status:
-        "success" |
+    "success" |
-        "profile-invalid" |
+    "profile-invalid" |
-        "client-aborted" |
+    "client-aborted" |
-        "server-join-failed" |
+    "server-join-failed" |
-        "server-already-joined" |
+    "server-already-joined" |
-        "channel-already-joined" |
+    "channel-already-joined" |
-        "channel-not-visible" |
+    "channel-not-visible" |
-        "channel-join-failed"
+    "channel-join-failed"
 }
 
 /**
@@ -176,12 +175,12 @@ type ConnectRequestResult = {
  * @param serverUniqueId If given a server unique id. If any of our current connections matches it, such connection will be used
  * @param parameters General connect parameters from the connect URL
  */
-async function doHandleConnectRequest(serverAddress: string, serverUniqueId: string | undefined, parameters: UrlParameterParser) : Promise<ConnectRequestResult> {
+async function doHandleConnectRequest(serverAddress: string, serverUniqueId: string | undefined, parameters: UrlParameterParser): Promise<ConnectRequestResult> {
     let targetServerConnection: ConnectionHandler;
     let isCurrentServerConnection: boolean;
 
-    if(serverUniqueId) {
+    if (serverUniqueId) {
-        if(server_connections.getActiveConnectionHandler()?.getCurrentServerUniqueId() === serverUniqueId) {
+        if (server_connections.getActiveConnectionHandler()?.getCurrentServerUniqueId() === serverUniqueId) {
             targetServerConnection = server_connections.getActiveConnectionHandler();
             isCurrentServerConnection = true;
         } else {
@@ -193,7 +192,7 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
     const profileId = parameters.getValue(AppParameters.KEY_CONNECT_PROFILE, undefined);
     const profile = findConnectProfile(profileId) || targetServerConnection?.serverConnection.handshake_handler()?.parameters.profile || defaultConnectProfile();
 
-    if(!profile || !profile.valid()) {
+    if (!profile || !profile.valid()) {
         spawnConnectModalNew({
             selectedAddress: serverAddress,
             selectedProfile: profile
@@ -201,14 +200,14 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
         return { status: "profile-invalid" };
     }
 
-    if(!getAudioBackend().isInitialized()) {
+    if (!getAudioBackend().isInitialized()) {
         /* Trick the client into clicking somewhere on the site to initialize audio */
         const result = await promptYesNo({
             title: tra("Connect to {}", serverAddress),
             question: tra("Would you like to connect to {}?", serverAddress)
         });
 
-        if(!result) {
+        if (!result) {
             /* Well... the client don't want to... */
             return { status: "client-aborted" };
         }
@@ -226,30 +225,30 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
 
     const connectToken = parameters.getValue(AppParameters.KEY_CONNECT_TOKEN, undefined);
 
-    if(!targetServerConnection) {
+    if (!targetServerConnection) {
         targetServerConnection = server_connections.getActiveConnectionHandler();
-        if(targetServerConnection.connected) {
+        if (targetServerConnection.connected) {
             targetServerConnection = server_connections.spawnConnectionHandler();
         }
     }
 
     server_connections.setActiveConnectionHandler(targetServerConnection);
-    if(targetServerConnection.getCurrentServerUniqueId() === serverUniqueId) {
+    if (targetServerConnection.getCurrentServerUniqueId() === serverUniqueId) {
         /* Just join the new channel and may use the token (before) */
 
-        if(connectToken) {
+        if (connectToken) {
             try {
                 await targetServerConnection.serverConnection.send_command("tokenuse", { token: connectToken }, { process_result: false });
             } catch (error) {
-                if(error instanceof CommandResult) {
+                if (error instanceof CommandResult) {
-                    if(error.id === ErrorCode.TOKEN_INVALID_ID) {
+                    if (error.id === ErrorCode.TOKEN_INVALID_ID) {
-                        targetServerConnection.log.log("error.custom", { message: tr("Try to use invite key token but the token is invalid.")});
+                        targetServerConnection.log.log("error.custom", { message: tr("Try to use invite key token but the token is invalid.") });
-                    } else if(error.id == ErrorCode.TOKEN_EXPIRED) {
+                    } else if (error.id == ErrorCode.TOKEN_EXPIRED) {
-                        targetServerConnection.log.log("error.custom", { message: tr("Try to use invite key token but the token is expired.")});
+                        targetServerConnection.log.log("error.custom", { message: tr("Try to use invite key token but the token is expired.") });
-                    } else if(error.id === ErrorCode.TOKEN_USE_LIMIT_EXCEEDED) {
+                    } else if (error.id === ErrorCode.TOKEN_USE_LIMIT_EXCEEDED) {
-                        targetServerConnection.log.log("error.custom", { message: tr("Try to use invite key token but the token has been used too many times.")});
+                        targetServerConnection.log.log("error.custom", { message: tr("Try to use invite key token but the token has been used too many times.") });
                     } else {
-                        targetServerConnection.log.log("error.custom", { message: tra("Try to use invite key token but an error occurred: {}", error.formattedMessage())});
+                        targetServerConnection.log.log("error.custom", { message: tra("Try to use invite key token but an error occurred: {}", error.formattedMessage()) });
                     }
                 } else {
                     logError(LogCategory.GENERAL, tr("Failed to use token: {}"), error);
@@ -257,9 +256,9 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
             }
         }
 
-        if(!channel) {
+        if (!channel) {
             /* No need to join any channel */
-            if(!connectToken) {
+            if (!connectToken) {
                 createInfoModal(tr("Already connected"), tr("You're already connected to the target server.")).open();
             } else {
                 /* Don't show a message since a token has been used */
@@ -269,19 +268,19 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
         }
 
         const targetChannel = targetServerConnection.channelTree.resolveChannelPath(channel);
-        if(!targetChannel) {
+        if (!targetChannel) {
             createErrorModal(tr("Missing target channel"), tr("Failed to join channel since it is not visible.")).open();
             return { status: "channel-not-visible" };
         }
 
-        if(targetServerConnection.getClient().currentChannel() === targetChannel) {
+        if (targetServerConnection.getClient().currentChannel() === targetChannel) {
             createErrorModal(tr("Channel already joined"), tr("You already joined the channel.")).open();
             return { status: "channel-already-joined" };
         }
 
-        if(targetChannel.getCachedPasswordHash()) {
+        if (targetChannel.getCachedPasswordHash()) {
             const succeeded = await targetChannel.joinChannel();
-            if(succeeded) {
+            if (succeeded) {
                 /* Successfully joined channel with a password we already knew */
                 return { status: "success" };
             }
@@ -289,7 +288,7 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
 
         targetChannel.setCachedHashedPassword(channelPassword);
         /* Force join the channel. Either we have the password, can ignore the password or we don't want to join. */
-        if(await targetChannel.joinChannel(true)) {
+        if (await targetChannel.joinChannel(true)) {
             return { status: "success" };
         } else {
             /* TODO: More detail? */
@@ -313,7 +312,7 @@ async function doHandleConnectRequest(serverAddress: string, serverUniqueId: str
             defaultChannelPasswordHashed: passwordsHashed
         }, false);
 
-        if(targetServerConnection.connected) {
+        if (targetServerConnection.connected) {
             return { status: "success" };
         } else {
             /* TODO: More detail? */
@@ -348,13 +347,13 @@ function main() {
 
     /* context menu prevent */
     document.addEventListener("contextmenu", event => {
-        if(event.defaultPrevented) {
+        if (event.defaultPrevented) {
             return;
         }
 
-        if(event.target instanceof HTMLInputElement) {
+        if (event.target instanceof HTMLInputElement) {
             const target = event.target;
-            if((!!event.target.value || __build.target === "client") && !event.target.disabled && !event.target.readOnly && event.target.type !== "number") {
+            if ((!!event.target.value || __build.target === "client") && !event.target.disabled && !event.target.readOnly && event.target.type !== "number") {
                 spawn_context_menu(event.pageX, event.pageY, {
                     type: MenuEntryType.ENTRY,
                     name: tr("Copy"),
@@ -377,7 +376,7 @@ function main() {
             return;
         }
 
-        if(settings.getValue(Settings.KEY_DISABLE_GLOBAL_CONTEXT_MENU)) {
+        if (settings.getValue(Settings.KEY_DISABLE_GLOBAL_CONTEXT_MENU)) {
             event.preventDefault();
         }
     });
@@ -385,15 +384,13 @@ function main() {
 
     const initialHandler = server_connections.spawnConnectionHandler();
     server_connections.setActiveConnectionHandler(initialHandler);
-    initialHandler.acquireInputHardware().then(() => {});
+    initialHandler.acquireInputHardware().then(() => { });
 
-    /** Setup the XF forum identity **/
-    fidentity.update_forum();
     initializeKeyControl();
 
     checkForUpdatedApp();
 
-    if(settings.getValue(Settings.KEY_USER_IS_NEW) && !preventWelcomeUI) {
+    if (settings.getValue(Settings.KEY_USER_IS_NEW) && !preventWelcomeUI) {
         const modal = openModalNewcomer();
         modal.close_listener.push(() => settings.setValue(Settings.KEY_USER_IS_NEW, false));
     }
@@ -408,7 +405,7 @@ const task_teaweb_starter: loader.Task = {
             loader.config.abortAnimationOnFinish = settings.getValue(Settings.KEY_LOADER_ANIMATION_ABORT);
         } catch (ex) {
             console.error(ex.stack);
-            if(ex instanceof ReferenceError || ex instanceof TypeError) {
+            if (ex instanceof ReferenceError || ex instanceof TypeError) {
                 ex = ex.name + ": " + ex.message;
             }
             loader.critical_error("Failed to invoke main function:<br>" + ex);
@@ -421,7 +418,7 @@ const task_connect_handler: loader.Task = {
     name: "Connect handler",
     function: async () => {
         const address = AppParameters.getValue(AppParameters.KEY_CONNECT_ADDRESS, undefined);
-        if(typeof address === "undefined") {
+        if (typeof address === "undefined") {
             loader.register_task(loader.Stage.LOADED, task_teaweb_starter);
             return;
         }
@@ -440,7 +437,7 @@ const task_connect_handler: loader.Task = {
         };
 
         const chandler = getInstanceConnectHandler();
-        if(chandler && AppParameters.getValue(AppParameters.KEY_CONNECT_NO_SINGLE_INSTANCE)) {
+        if (chandler && AppParameters.getValue(AppParameters.KEY_CONNECT_NO_SINGLE_INSTANCE)) {
             try {
                 await chandler.post_connect_request(connectData, async () => {
                     return await promptYesNo({
@@ -459,11 +456,11 @@ const task_connect_handler: loader.Task = {
                     }
                 ).open();
                 return;
-            } catch(error) {
+            } catch (error) {
                 logInfo(LogCategory.CLIENT, tr("Failed to execute connect within other TeaWeb instance. Using this one. Error: %o"), error);
             }
 
-            if(chandler) {
+            if (chandler) {
                 /* no instance avail, so lets make us avail */
                 chandler.callback_available = () => {
                     return !settings.getValue(Settings.KEY_DISABLE_MULTI_SESSION);
@@ -497,7 +494,7 @@ loader.register_task(loader.Stage.JAVASCRIPT_INITIALIZING, {
     name: "jrendere initialize",
     function: async () => {
         try {
-            if(!setupJSRender())
+            if (!setupJSRender())
                 throw "invalid load";
         } catch (error) {
             loader.critical_error(tr("Failed to setup jsrender"));
@@ -514,17 +511,17 @@ loader.register_task(loader.Stage.JAVASCRIPT_INITIALIZING, {
         try {
             await initialize();
 
-            if(__build.target == "web") {
+            if (__build.target == "web") {
                 loader.register_task(loader.Stage.LOADED, task_connect_handler);
             } else {
                 loader.register_task(loader.Stage.LOADED, task_teaweb_starter);
             }
         } catch (ex) {
-            if(ex instanceof Error || typeof(ex.stack) !== "undefined") {
+            if (ex instanceof Error || typeof (ex.stack) !== "undefined") {
                 console.error((tr || (msg => msg))("Critical error stack trace: %o"), ex.stack);
             }
 
-            if(ex instanceof ReferenceError || ex instanceof TypeError) {
+            if (ex instanceof ReferenceError || ex instanceof TypeError) {
                 ex = ex.name + ": " + ex.message;
             }
 
@@ -537,7 +534,7 @@ loader.register_task(loader.Stage.JAVASCRIPT_INITIALIZING, {
 loader.register_task(loader.Stage.LOADED, {
     name: "error task",
     function: async () => {
-        if(AppParameters.getValue(AppParameters.KEY_LOAD_DUMMY_ERROR)) {
+        if (AppParameters.getValue(AppParameters.KEY_LOAD_DUMMY_ERROR)) {
             loader.critical_error("The tea is cold!", "Argh, this is evil! Cold tea does not taste good.");
             throw "The tea is cold!";
         }
@@ -549,7 +546,7 @@ let preventExecuteAutoConnect = false;
 loader.register_task(loader.Stage.LOADED, {
     priority: 0,
     function: async () => {
-        if(preventExecuteAutoConnect) {
+        if (preventExecuteAutoConnect) {
             return;
         }
 

shared/js/profiles/ConnectionProfile.ts

@@ -1,18 +1,17 @@
-import {decode_identity, IdentitifyType, Identity} from "../profiles/Identity";
+import { decode_identity, IdentitifyType, Identity } from "../profiles/Identity";
-import {guid} from "../crypto/uid";
+import { guid } from "../crypto/uid";
-import {TeaForumIdentity} from "../profiles/identities/TeaForumIdentity";
+import { TeaSpeakIdentity } from "../profiles/identities/TeamSpeakIdentity";
-import {TeaSpeakIdentity} from "../profiles/identities/TeamSpeakIdentity";
+import { AbstractServerConnection } from "../connection/ConnectionBase";
-import {AbstractServerConnection} from "../connection/ConnectionBase";
+import { HandshakeIdentityHandler } from "../connection/HandshakeHandler";
-import {HandshakeIdentityHandler} from "../connection/HandshakeHandler";
+import { createErrorModal } from "../ui/elements/Modal";
-import {createErrorModal} from "../ui/elements/Modal";
+import { formatMessage } from "../ui/frames/chat";
-import {formatMessage} from "../ui/frames/chat";
 import * as loader from "tc-loader";
-import {Stage} from "tc-loader";
+import { Stage } from "tc-loader";
-import {LogCategory, logDebug, logError} from "tc-shared/log";
+import { LogCategory, logDebug, logError } from "tc-shared/log";
-import {tr} from "tc-shared/i18n/localize";
+import { tr } from "tc-shared/i18n/localize";
-import {getStorageAdapter} from "tc-shared/StorageAdapter";
+import { getStorageAdapter } from "tc-shared/StorageAdapter";
-import {ignorePromise} from "tc-shared/proto";
+import { ignorePromise } from "tc-shared/proto";
-import {assertMainApplication} from "tc-shared/ui/utils";
+import { assertMainApplication } from "tc-shared/ui/utils";
 
 /*
  * We're loading & saving profiles with the StorageAdapter.
@@ -52,9 +51,7 @@ export class ConnectionProfile {
         if (current_type === undefined)
             return undefined;
 
-        if (current_type == IdentitifyType.TEAFORO) {
+        if (current_type == IdentitifyType.TEAMSPEAK || current_type == IdentitifyType.NICKNAME) {
-            return TeaForumIdentity.identity();
-        } else if (current_type == IdentitifyType.TEAMSPEAK || current_type == IdentitifyType.NICKNAME) {
             return this.identities[IdentitifyType[current_type].toLowerCase()];
         }
 
@@ -144,7 +141,7 @@ async function loadConnectProfiles() {
     const profiles_json = await getStorageAdapter().get("profiles");
     let profiles_data: ProfilesData = (() => {
         try {
-            return profiles_json ? JSON.parse(profiles_json) : {version: 0} as any;
+            return profiles_json ? JSON.parse(profiles_json) : { version: 0 } as any;
         } catch (error) {
             logError(LogCategory.IDENTITIES, tr("Invalid profile json! Resetting profiles :( (%o)"), profiles_json);
             createErrorModal(tr("Profile data invalid"), formatMessage(tr("The profile data is invalid.{:br:}This might cause data loss."))).open();
@@ -170,7 +167,7 @@ async function loadConnectProfiles() {
     }
 
     const defaultProfile = findConnectProfile("default");
-    if (!defaultProfile) { //Create a default profile and teaforo profile
+    if (!defaultProfile) { //Create a default profile
         {
             const profile = createConnectProfile(tr("Default Profile"), "default");
             profile.defaultPassword = "";
@@ -194,15 +191,6 @@ async function loadConnectProfiles() {
             }
         }
 
-        { /* forum identity (works only when connected to the forum) */
-            const profile = createConnectProfile(tr("TeaSpeak Forum Profile"), "teaforo");
-            profile.defaultPassword = "";
-            profile.defaultUsername = "";
-
-            profile.setIdentity(IdentitifyType.TEAFORO, TeaForumIdentity.identity());
-            profile.selectedIdentityType = IdentitifyType[IdentitifyType.TEAFORO];
-        }
-
         save();
     }
 }
@@ -280,7 +268,7 @@ export function delete_profile(profile: ConnectionProfile) {
 }
 
 window.addEventListener("beforeunload", event => {
-    if(requires_save()) {
+    if (requires_save()) {
         save();
     }
 });

shared/js/profiles/Identity.ts

@@ -1,51 +1,46 @@
-import {AbstractServerConnection, ServerCommand} from "../connection/ConnectionBase";
+import { AbstractServerConnection, ServerCommand } from "../connection/ConnectionBase";
-import {HandshakeIdentityHandler} from "../connection/HandshakeHandler";
+import { HandshakeIdentityHandler } from "../connection/HandshakeHandler";
-import {AbstractCommandHandler} from "../connection/AbstractCommandHandler";
+import { AbstractCommandHandler } from "../connection/AbstractCommandHandler";
-import {LogCategory, logError, logWarn} from "tc-shared/log";
+import { LogCategory, logError, logWarn } from "tc-shared/log";
-import {tr} from "tc-shared/i18n/localize";
+import { tr } from "tc-shared/i18n/localize";
 
 export enum IdentitifyType {
-    TEAFORO,
     TEAMSPEAK,
     NICKNAME
 }
 
 export interface Identity {
-    fallback_name(): string | undefined ;
+    fallback_name(): string | undefined;
-    uid() : string;
+    uid(): string;
-    type() : IdentitifyType;
+    type(): IdentitifyType;
 
-    valid() : boolean;
+    valid(): boolean;
 
-    encode?() : string;
+    encode?(): string;
-    decode(data: string) : Promise<void>;
+    decode(data: string): Promise<void>;
 
-    spawn_identity_handshake_handler(connection: AbstractServerConnection) : HandshakeIdentityHandler;
+    spawn_identity_handshake_handler(connection: AbstractServerConnection): HandshakeIdentityHandler;
 }
 
 /* avoid circular dependencies here */
-export async function decode_identity(type: IdentitifyType, data: string) : Promise<Identity> {
+export async function decode_identity(type: IdentitifyType, data: string): Promise<Identity> {
     let identity: Identity;
     switch (type) {
         case IdentitifyType.NICKNAME:
             const nidentity = require("tc-shared/profiles/identities/NameIdentity");
             identity = new nidentity.NameIdentity();
             break;
-        case IdentitifyType.TEAFORO:
-            const fidentity = require("tc-shared/profiles/identities/TeaForumIdentity");
-            identity = new fidentity.TeaForumIdentity(undefined);
-            break;
         case IdentitifyType.TEAMSPEAK:
             const tidentity = require("tc-shared/profiles/identities/TeamSpeakIdentity");
             identity = new tidentity.TeaSpeakIdentity(undefined, undefined);
             break;
     }
-    if(!identity)
+    if (!identity)
         return undefined;
 
     try {
         await identity.decode(data)
-    } catch(error) {
+    } catch (error) {
         logError(LogCategory.IDENTITIES, tr("Failed to decode identity: %o"), error);
         return undefined;
     }
@@ -60,10 +55,6 @@ export function create_identity(type: IdentitifyType) {
             const nidentity = require("tc-shared/profiles/identities/NameIdentity");
             identity = new nidentity.NameIdentity();
             break;
-        case IdentitifyType.TEAFORO:
-            const fidentity = require("tc-shared/profiles/identities/TeaForumIdentity");
-            identity = new fidentity.TeaForumIdentity(undefined);
-            break;
         case IdentitifyType.TEAMSPEAK:
             const tidentity = require("tc-shared/profiles/identities/TeamSpeakIdentity");
             identity = new tidentity.TeaSpeakIdentity(undefined, undefined);
@@ -82,9 +73,9 @@ export class HandshakeCommandHandler<T extends AbstractHandshakeIdentityHandler>
 
 
     handle_command(command: ServerCommand): boolean {
-        if(typeof this[command.command] === "function") {
+        if (typeof this[command.command] === "function") {
             this[command.command](command.arguments);
-        } else if(command.command == "error") {
+        } else if (command.command == "error") {
             return false;
         } else {
             logWarn(LogCategory.IDENTITIES, tr("Received unknown command while handshaking (%o)"), command);
@@ -111,12 +102,12 @@ export abstract class AbstractHandshakeIdentityHandler implements HandshakeIdent
     abstract executeHandshake();
 
     protected trigger_success() {
-        for(const callback of this.callbacks)
+        for (const callback of this.callbacks)
             callback(true);
     }
 
     protected trigger_fail(message: string) {
-        for(const callback of this.callbacks)
+        for (const callback of this.callbacks)
             callback(false, message);
     }
 }

shared/js/profiles/identities/TeaForumIdentity.ts

@@ -1,135 +0,0 @@
-import {
-    AbstractHandshakeIdentityHandler,
-    HandshakeCommandHandler,
-    IdentitifyType,
-    Identity
-} from "../../profiles/Identity";
-import {LogCategory, logError} from "../../log";
-import {CommandResult} from "../../connection/ServerConnectionDeclaration";
-import {AbstractServerConnection} from "../../connection/ConnectionBase";
-import {HandshakeIdentityHandler} from "../../connection/HandshakeHandler";
-import * as forum from "./teaspeak-forum";
-import { tr } from "tc-shared/i18n/localize";
-
-class TeaForumHandshakeHandler extends AbstractHandshakeIdentityHandler {
-    readonly identity: TeaForumIdentity;
-    handler: HandshakeCommandHandler<TeaForumHandshakeHandler>;
-
-    constructor(connection: AbstractServerConnection, identity: TeaForumIdentity) {
-        super(connection);
-        this.identity = identity;
-        this.handler = new HandshakeCommandHandler(connection, this);
-        this.handler["handshakeidentityproof"] = this.handle_proof.bind(this);
-    }
-
-    executeHandshake() {
-        this.connection.getCommandHandler().registerHandler(this.handler);
-        this.connection.send_command("handshakebegin", {
-            intention: 0,
-            authentication_method: this.identity.type(),
-            data: this.identity.data().data_json()
-        }).catch(error => {
-            logError(LogCategory.IDENTITIES, tr("Failed to initialize TeaForum based handshake. Error: %o"), error);
-
-            if(error instanceof CommandResult)
-                error = error.extra_message || error.message;
-            this.trigger_fail("failed to execute begin (" + error + ")");
-        });
-    }
-
-
-    private handle_proof(json) {
-        this.connection.send_command("handshakeindentityproof", {
-            proof: this.identity.data().data_sign()
-        }).catch(error => {
-            logError(LogCategory.IDENTITIES, tr("Failed to proof the identity. Error: %o"), error);
-
-            if(error instanceof CommandResult)
-                error = error.extra_message || error.message;
-            this.trigger_fail("failed to execute proof (" + error + ")");
-        }).then(() => this.trigger_success());
-    }
-
-    protected trigger_fail(message: string) {
-        this.connection.getCommandHandler().unregisterHandler(this.handler);
-        super.trigger_fail(message);
-    }
-
-    protected trigger_success() {
-        this.connection.getCommandHandler().unregisterHandler(this.handler);
-        super.trigger_success();
-    }
-}
-
-export class TeaForumIdentity implements Identity {
-    private readonly identity_data: forum.Data;
-
-    valid() : boolean {
-        return !!this.identity_data && !this.identity_data.is_expired();
-    }
-
-    constructor(data: forum.Data) {
-        this.identity_data = data;
-    }
-
-    data() {
-        return this.identity_data;
-    }
-
-    decode(data) : Promise<void> {
-        data = JSON.parse(data);
-        if(data.version !== 1)
-            throw "invalid version";
-
-        return;
-    }
-
-    encode() : string {
-        return JSON.stringify({
-            version: 1
-        });
-    }
-
-    spawn_identity_handshake_handler(connection: AbstractServerConnection) : HandshakeIdentityHandler {
-        return new TeaForumHandshakeHandler(connection, this);
-    }
-
-    fallback_name(): string | undefined {
-        return this.identity_data ? this.identity_data.name() : undefined;
-    }
-
-    type(): IdentitifyType {
-        return IdentitifyType.TEAFORO;
-    }
-
-    uid(): string {
-        //FIXME: Real UID!
-        return "TeaForo#" + ((this.identity_data ? this.identity_data.name() : "Another TeaSpeak user"));
-    }
-
-    public static identity() {
-        return static_identity;
-    }
-}
-
-let static_identity: TeaForumIdentity;
-
-export function set_static_identity(identity: TeaForumIdentity) {
-    static_identity = identity;
-}
-
-export function update_forum() {
-    if(forum.logged_in() && (!static_identity || static_identity.data() !== forum.data())) {
-        static_identity = new TeaForumIdentity(forum.data());
-    } else {
-        static_identity = undefined;
-    }
-}
-
-export function valid_static_forum_identity() : boolean {
-    return static_identity && static_identity.valid();
-}
-
-export function static_forum_identity() : TeaForumIdentity | undefined {
-    return static_identity;
-}

shared/js/profiles/identities/teaspeak-forum.ts

@@ -1,399 +0,0 @@
-import {settings, Settings} from "../../settings";
-import * as loader from "tc-loader";
-import * as fidentity from "./TeaForumIdentity";
-import {LogCategory, logDebug, logError, logInfo, logWarn} from "../../log";
-import {tr} from "tc-shared/i18n/localize";
-import {getStorageAdapter} from "tc-shared/StorageAdapter";
-
-/* TODO: Properly redesign this whole system! */
-
-declare global {
-    interface Window {
-        grecaptcha: GReCaptcha;
-    }
-}
-
-interface GReCaptcha {
-    render(container: string | HTMLElement, parameters: {
-        sitekey: string;
-        theme?: "dark" | "light";
-        size?: "compact" | "normal";
-
-        tabindex?: number;
-
-        callback?: (token: string) => any;
-        "expired-callback"?: () => any;
-        "error-callback"?: (error: any) => any;
-    }) : string; /* widget_id */
-
-    reset(widget_id?: string);
-}
-
-export namespace gcaptcha {
-    export async function initialize() {
-        if(typeof(window.grecaptcha) === "undefined") {
-            let script = document.createElement("script");
-            script.async = true;
-
-            let timeout;
-            const callback_name = "captcha_callback_" + Math.random().toString().replace(".", "");
-            try {
-                await new Promise((resolve, reject) => {
-                    script.onerror = reject;
-                    window[callback_name] = resolve;
-                    script.src = "https://www.google.com/recaptcha/api.js?onload=" + encodeURIComponent(callback_name) + "&render=explicit";
-
-                    document.body.append(script);
-                    timeout = setTimeout(() => reject("timeout"), 15000);
-                });
-            } catch(error) {
-                script.remove();
-                script = undefined;
-
-                logError(LogCategory.GENERAL, tr("Failed to fetch recaptcha javascript source: %o"), error);
-                throw tr("failed to download source");
-            } finally {
-                if(script)
-                    script.onerror = undefined;
-                delete window[callback_name];
-                timeout && clearTimeout(timeout);
-            }
-        }
-
-        if(typeof(window.grecaptcha) === "undefined") {
-            throw tr("failed to load recaptcha");
-        }
-    }
-
-    export async function spawn(container: JQuery, key: string, callback_data: (token: string) => any) {
-        try {
-            await initialize();
-        } catch(error) {
-            logError(LogCategory.GENERAL, tr("Failed to initialize G-Recaptcha. Error: %o"), error);
-            throw tr("initialisation failed");
-        }
-        if(container.attr("captcha-uuid"))
-            window.grecaptcha.reset(container.attr("captcha-uuid"));
-        else {
-            container.attr("captcha-uuid", window.grecaptcha.render(container[0], {
-                "sitekey": key,
-                callback: callback_data
-            }));
-        }
-    }
-}
-
-function getForumApiURL() {
-    return settings.getValue(Settings.KEY_TEAFORO_URL);
-}
-
-export class Data {
-    readonly auth_key: string;
-    readonly raw: string;
-    readonly sign: string;
-
-    parsed: {
-        user_id: number;
-        user_name: string;
-
-        data_age: number;
-
-        user_group_id: number;
-
-        is_staff: boolean;
-        user_groups: number[];
-    };
-
-    constructor(auth: string, raw: string, sign: string) {
-        this.auth_key = auth;
-        this.raw = raw;
-        this.sign = sign;
-
-        this.parsed = JSON.parse(raw);
-    }
-
-
-    data_json() : string { return this.raw; }
-    data_sign() : string { return this.sign; }
-
-    name() : string { return this.parsed.user_name; }
-
-    user_id() { return this.parsed.user_id; }
-    user_group() { return this.parsed.user_group_id; }
-
-    is_stuff() : boolean { return this.parsed.is_staff; }
-    is_premium() : boolean { return this.parsed.user_groups.indexOf(5) != -1; }
-
-    data_age() : Date { return new Date(this.parsed.data_age); }
-
-    is_expired() : boolean { return this.parsed.data_age + 48 * 60 * 60 * 1000 < Date.now(); }
-    should_renew() : boolean { return this.parsed.data_age + 24 * 60 * 60 * 1000 < Date.now(); } /* renew data all 24hrs */
-}
-let forumData: Data | undefined;
-
-export function logged_in() : boolean {
-    return !!forumData && !forumData.is_expired();
-}
-
-export function data() : Data { return forumData; }
-
-export interface LoginResult {
-    status: "success" | "captcha" | "error";
-
-    error_message?: string;
-    captcha?: {
-        type: "gre-captcha" | "unknown";
-        data: any; /* in case of gre-captcha it would be the side key */
-    };
-}
-
-export async function login(username: string, password: string, captcha?: any) : Promise<LoginResult> {
-    let response;
-    try {
-        response = await new Promise<any>((resolve, reject) => {
-            $.ajax({
-                url: getForumApiURL() + "?web-api/v1/login",
-                type: "POST",
-                cache: false,
-                data: {
-                    username: username,
-                    password: password,
-                    remember: true,
-                    "g-recaptcha-response": captcha
-                },
-
-                crossDomain: true,
-
-                success: resolve,
-                error: (xhr, status, error) => {
-                    logDebug(LogCategory.GENERAL, tr("Login request failed %o: %o"), status, error);
-                    reject(tr("request failed"));
-                }
-            })
-        });
-    } catch(error) {
-        return {
-            status: "error",
-            error_message: tr("failed to send login request")
-        };
-    }
-
-    if(response["status"] !== "ok") {
-        logError(LogCategory.GENERAL, tr("Response status not okey. Error happend: %o"), response);
-        return {
-            status: "error",
-            error_message: (response["errors"] || [])[0] || tr("Unknown error")
-        };
-    }
-
-    if(!response["success"]) {
-        logError(LogCategory.GENERAL, tr("Login failed. Response %o"), response);
-
-        let message = tr("failed to login");
-        let captcha;
-        /* user/password wrong | and maybe captcha required */
-        if(response["code"] == 1 || response["code"] == 3)
-            message = tr("Invalid username or password");
-        if(response["code"] == 2 || response["code"] == 3) {
-            captcha = {
-                type: response["captcha"]["type"],
-                data: response["captcha"]["siteKey"] //TODO: Why so static here?
-            };
-            if(response["code"] == 2)
-                message = tr("captcha required");
-        }
-
-        return {
-            status: typeof(captcha) !== "undefined" ? "captcha" : "error",
-            error_message: message,
-            captcha: captcha
-        };
-    }
-    //document.cookie = "user_data=" + response["data"] + ";path=/";
-    //document.cookie = "user_sign=" + response["sign"] + ";path=/";
-
-    try {
-        forumData = new Data(response["auth-key"], response["data"], response["sign"]);
-        const adapter = getStorageAdapter();
-        await adapter.set("teaspeak-forum-data", response["data"]);
-        await adapter.set("teaspeak-forum-sign", response["sign"]);
-        await adapter.set("teaspeak-forum-auth", response["auth-key"]);
-        fidentity.update_forum();
-    } catch(error) {
-        logError(LogCategory.GENERAL, tr("Failed to parse forum given data: %o"), error);
-        return {
-            status: "error",
-            error_message: tr("Failed to parse response data")
-        }
-    }
-
-    return {
-        status: "success"
-    };
-}
-
-async function resetForumLocalData() {
-    const adapter = getStorageAdapter();
-    await adapter.delete("teaspeak-forum-data");
-    await adapter.delete("teaspeak-forum-sign");
-    await adapter.delete("teaspeak-forum-auth");
-}
-
-export async function renew_data() : Promise<"success" | "login-required"> {
-    let response;
-    try {
-        response = await new Promise<any>((resolve, reject) => {
-            $.ajax({
-                url: getForumApiURL() + "?web-api/v1/renew-data",
-                type: "GET",
-                cache: false,
-
-                crossDomain: true,
-
-                data: {
-                    "auth-key": forumData.auth_key
-                },
-
-                success: resolve,
-                error: (xhr, status, error) => {
-                    logError(LogCategory.GENERAL, tr("Renew request failed %o: %o"), status, error);
-                    reject(tr("request failed"));
-                }
-            })
-        });
-    } catch(error) {
-        throw tr("failed to send renew request");
-    }
-
-    if(response["status"] !== "ok") {
-        logError(LogCategory.GENERAL, tr("Response status not okey. Error happend: %o"), response);
-        throw (response["errors"] || [])[0] || tr("Unknown error");
-    }
-
-    if(!response["success"]) {
-        if(response["code"] == 1) {
-            return "login-required";
-        }
-        throw "invalid error code (" + response["code"] + ")";
-    }
-    if(!response["data"] || !response["sign"])
-        throw tr("response missing data");
-
-    logDebug(LogCategory.GENERAL, tr("Renew succeeded. Parsing data."));
-
-    try {
-        forumData = new Data(forumData.auth_key, response["data"], response["sign"]);
-        await getStorageAdapter().set("teaspeak-forum-data", response["data"]);
-        await getStorageAdapter().set("teaspeak-forum-sign", response["sign"]);
-        fidentity.update_forum();
-    } catch(error) {
-        logError(LogCategory.GENERAL, tr("Failed to parse forum given data: %o"), error);
-        throw tr("failed to parse data");
-    }
-
-    return "success";
-}
-
-export async function logout() : Promise<void> {
-    if(!logged_in()) {
-        return;
-    }
-
-    let response;
-    try {
-        response = await new Promise<any>((resolve, reject) => {
-            $.ajax({
-                url: getForumApiURL() + "?web-api/v1/logout",
-                type: "GET",
-                cache: false,
-
-                crossDomain: true,
-
-                data: {
-                    "auth-key": forumData.auth_key
-                },
-
-                success: resolve,
-                error: (xhr, status, error) => {
-                    logInfo(LogCategory.GENERAL, tr("Logout request failed %o: %o"), status, error);
-                    reject(tr("request failed"));
-                }
-            })
-        });
-    } catch(error) {
-        throw tr("failed to send logout request");
-    }
-
-    if(response["status"] !== "ok") {
-        logError(LogCategory.GENERAL, tr("Response status not ok. Error happened: %o"), response);
-        throw (response["errors"] || [])[0] || tr("Unknown error");
-    }
-
-    if(!response["success"]) {
-        /* code 1 means not logged in, its an success */
-        if(response["code"] != 1) {
-            throw "invalid error code (" + response["code"] + ")";
-        }
-    }
-
-    forumData = undefined;
-    await resetForumLocalData();
-    fidentity.update_forum();
-}
-
-loader.register_task(loader.Stage.JAVASCRIPT_INITIALIZING, {
-    name: "TeaForo initialize",
-    priority: 10,
-    function: async () => {
-        const rawData = await getStorageAdapter().get("teaspeak-forum-data");
-        const rawSign = await getStorageAdapter().get("teaspeak-forum-sign");
-        const rawForumAuth = await getStorageAdapter().get("teaspeak-forum-auth");
-        if(!rawData || !rawSign || !rawForumAuth) {
-            logInfo(LogCategory.GENERAL, tr("No TeaForo authentication found. TeaForo connection status: unconnected"));
-            return;
-        }
-
-        try {
-            forumData = new Data(rawForumAuth, rawData, rawSign);
-        } catch(error) {
-            logError(LogCategory.GENERAL, tr("Failed to initialize TeaForo connection from local data. Error: %o"), error);
-            return;
-        }
-        if(forumData.should_renew()) {
-            logInfo(LogCategory.GENERAL, tr("TeaForo data should be renewed. Executing renew."));
-            renew_data().then(async status => {
-                if(status === "success") {
-                    logInfo(LogCategory.GENERAL, tr("TeaForo data has been successfully renewed."));
-                } else {
-                    logWarn(LogCategory.GENERAL, tr("Failed to renew TeaForo data. New login required."));
-                    await resetForumLocalData();
-                }
-            }).catch(error => {
-                logWarn(LogCategory.GENERAL, tr("Failed to renew TeaForo data. An error occurred: %o"), error);
-            });
-            return;
-        }
-
-        if(forumData && forumData.is_expired()) {
-            logError(LogCategory.GENERAL, tr("TeaForo data is expired. TeaForo connection isn't available!"));
-        }
-
-
-        setInterval(() => {
-            /* if we don't have any _data object set we could not renew anything */
-            if(forumData) {
-                logInfo(LogCategory.IDENTITIES, tr("Renewing TeaForo data."));
-                renew_data().then(async status => {
-                    if(status === "success") {
-                        logInfo(LogCategory.IDENTITIES,tr("TeaForo data has been successfully renewed."));
-                    } else {
-                        logWarn(LogCategory.IDENTITIES,tr("Failed to renew TeaForo data. New login required."));
-                        await resetForumLocalData();
-                    }
-                }).catch(error => {
-                    logWarn(LogCategory.GENERAL, tr("Failed to renew TeaForo data. An error occurred: %o"), error);
-                });
-            }
-        }, 24 * 60 * 60 * 1000);
-    }
-});

shared/js/settings.ts

@@ -364,7 +364,7 @@ export class Settings {
     static readonly KEY_I18N_DEFAULT_REPOSITORY: ValuedRegistryKey<string> = {
         key: "i18n.default_repository",
         valueType: "string",
-        defaultValue: "i18n/"
+        defaultValue: "https://web.teaspeak.de/i18n/"
     };
 
     /* Default client states */
@@ -572,12 +572,6 @@ export class Settings {
         valueType: "boolean",
     };
 
-    static readonly KEY_TEAFORO_URL: ValuedRegistryKey<string> = {
-        key: "teaforo_url",
-        defaultValue: "https://forum.teaspeak.de/",
-        valueType: "string",
-    };
-
     static readonly KEY_FONT_SIZE: ValuedRegistryKey<number> = {
         key: "font_size",
         valueType: "number",

shared/js/tree/Client.ts

@@ -74,10 +74,6 @@ export class ClientProperties {
     client_output_muted: boolean = false;
     client_is_channel_commander: boolean = false;
 
-    client_teaforo_id: number = 0;
-    client_teaforo_name: string = "";
-    client_teaforo_flags: number = 0; /* 0x01 := Banned | 0x02 := Stuff | 0x04 := Premium */
-
 
     /* not updated in view! */
     client_month_bytes_uploaded: number = 0;

shared/js/ui/frames/side/ClientInfoRenderer.scss

@@ -83,9 +83,11 @@ $bot_thumbnail_height: 9em;
         &:hover {
             opacity: 1;
         }
+
         @include transition(opacity $button_hover_animation_time ease-in-out);
 
-        &:before, &:after {
+        &:before,
+        &:after {
             position: absolute;
             left: .25em;
             content: ' ';
@@ -126,6 +128,7 @@ $bot_thumbnail_height: 9em;
         &:hover {
             background-color: #393939;
         }
+
         @include transition($button_hover_animation_time ease-in-out);
     }
 }
@@ -208,8 +211,8 @@ $bot_thumbnail_height: 9em;
         }
 
         &.disabled {
-            opacity: 0!important;
+            opacity: 0 !important;
-            pointer-events: none!important;
+            pointer-events: none !important;
         }
     }
 
@@ -282,7 +285,7 @@ $bot_thumbnail_height: 9em;
     flex-direction: row;
     justify-content: stretch;
 
-    > .icon {
+    >.icon {
         margin-bottom: .1em;
 
         font-size: 2em;
@@ -300,8 +303,9 @@ $bot_thumbnail_height: 9em;
     }
 
     &.list {
-        > .icon_em {
+        >.icon_em {
-            margin-top: 0; /* for lists the .1em patting on the top looks odd */
+            margin-top: 0;
+            /* for lists the .1em patting on the top looks odd */
         }
     }
 
@@ -311,13 +315,15 @@ $bot_thumbnail_height: 9em;
         flex-shrink: 1;
         flex-grow: 1;
 
-        min-width: 4em; /* 2em for the icon the last 4 for the text */
+        min-width: 4em;
+        /* 2em for the icon the last 4 for the text */
 
         display: flex;
         flex-direction: column;
         justify-content: flex-start;
 
-        .title, .value {
+        .title,
+        .value {
             white-space: nowrap;
             text-overflow: ellipsis;
             overflow: hidden;
@@ -340,10 +346,12 @@ $bot_thumbnail_height: 9em;
                 align-self: center;
             }
 
-            &.status, &.groups {
+            &.status,
+            &.groups {
                 flex-direction: column;
 
-                .statusEntry, .groupEntry {
+                .statusEntry,
+                .groupEntry {
                     .icon {
                         vertical-align: text-top;
                     }
@@ -366,12 +374,6 @@ $bot_thumbnail_height: 9em;
                     justify-content: flex-end;
                 }
             }
-
-            &.clientTeaforoAccount {
-                a, a:visited {
-                    color: #d9d9d9;
-                }
-            }
         }
     }
 

shared/js/ui/frames/side/ClientInfoRenderer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import {useContext, useEffect, useRef, useState} from "react";
+import { useContext, useEffect, useRef, useState } from "react";
 import {
     ClientCountryInfo,
     ClientForumInfo,
@@ -11,22 +11,22 @@ import {
     ClientVolumeInfo, InheritedChannelInfo,
     OptionalClientInfoInfo
 } from "tc-shared/ui/frames/side/ClientInfoDefinitions";
-import {Registry} from "tc-shared/events";
+import { Registry } from "tc-shared/events";
-import {ClientAvatar, getGlobalAvatarManagerFactory} from "tc-shared/file/Avatars";
+import { ClientAvatar, getGlobalAvatarManagerFactory } from "tc-shared/file/Avatars";
-import {AvatarRenderer} from "tc-shared/ui/react-elements/Avatar";
+import { AvatarRenderer } from "tc-shared/ui/react-elements/Avatar";
-import {Translatable} from "tc-shared/ui/react-elements/i18n";
+import { Translatable } from "tc-shared/ui/react-elements/i18n";
-import {LoadingDots} from "tc-shared/ui/react-elements/LoadingDots";
+import { LoadingDots } from "tc-shared/ui/react-elements/LoadingDots";
-import {ClientTag} from "tc-shared/ui/tree/EntryTags";
+import { ClientTag } from "tc-shared/ui/tree/EntryTags";
-import {guid} from "tc-shared/crypto/uid";
+import { guid } from "tc-shared/crypto/uid";
-import {useDependentState} from "tc-shared/ui/react-elements/Helper";
+import { useDependentState } from "tc-shared/ui/react-elements/Helper";
-import {format_online_time} from "tc-shared/utils/TimeUtils";
+import { format_online_time } from "tc-shared/utils/TimeUtils";
-import {ClientIcon} from "svg-sprites/client-icons";
+import { ClientIcon } from "svg-sprites/client-icons";
-import {ClientIconRenderer} from "tc-shared/ui/react-elements/Icons";
+import { ClientIconRenderer } from "tc-shared/ui/react-elements/Icons";
-import {getIconManager} from "tc-shared/file/Icons";
+import { getIconManager } from "tc-shared/file/Icons";
-import {RemoteIconRenderer} from "tc-shared/ui/react-elements/Icon";
+import { RemoteIconRenderer } from "tc-shared/ui/react-elements/Icon";
-import {CountryCode} from "tc-shared/ui/react-elements/CountryCode";
+import { CountryCode } from "tc-shared/ui/react-elements/CountryCode";
-import {getKeyBoard} from "tc-shared/PPTListener";
+import { getKeyBoard } from "tc-shared/PPTListener";
-import {tra} from "tc-shared/i18n/localize";
+import { tra } from "tc-shared/i18n/localize";
 
 const cssStyle = require("./ClientInfoRenderer.scss");
 
@@ -67,7 +67,7 @@ const Avatar = React.memo(() => {
     const client = useContext(ClientContext);
 
     let avatar: "loading" | ClientAvatar;
-    if(client.type === "none") {
+    if (client.type === "none") {
         avatar = "loading";
     } else {
         avatar = getGlobalAvatarManagerFactory().getManager(client.handlerId)
@@ -88,13 +88,13 @@ const ClientName = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
 
-    const [ name, setName ] = useDependentState<string | null>(() => {
+    const [name, setName] = useDependentState<string | null>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_client_name");
         }
 
         return null;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_client_name", event => setName(event.name), undefined, []);
 
@@ -111,13 +111,13 @@ const ClientName = React.memo(() => {
 const ClientDescription = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ description, setDescription ] = useDependentState<string | null | undefined>(() => {
+    const [description, setDescription] = useDependentState<string | null | undefined>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_client_description");
         }
 
         return null;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_client_description", event => {
         setDescription(event.description ? event.description : null);
@@ -150,23 +150,23 @@ const InfoBlock = (props: { imageUrl?: string, clientIcon?: ClientIcon, children
 const ClientOnlineSince = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ onlineInfo, setOnlineInfo ] = useDependentState<ClientInfoOnline>(() => {
+    const [onlineInfo, setOnlineInfo] = useDependentState<ClientInfoOnline>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_online");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
-    const [ revision, setRevision ] = useState(0);
+    const [revision, setRevision] = useState(0);
 
     events.reactUse("notify_online", event => setOnlineInfo(event.status), undefined, []);
 
     let onlineBody;
-    if(client.type === "none" || !onlineInfo) {
+    if (client.type === "none" || !onlineInfo) {
         onlineBody = <React.Fragment key={"loading"}><Translatable>loading</Translatable> <LoadingDots /></React.Fragment>;
-    } else if(onlineInfo.joinTimestamp === 0) {
+    } else if (onlineInfo.joinTimestamp === 0) {
         onlineBody = <React.Fragment key={"invalid"}><Translatable>Join timestamp not logged</Translatable></React.Fragment>;
-    } else if(onlineInfo.leaveTimestamp === 0) {
+    } else if (onlineInfo.leaveTimestamp === 0) {
         const onlineTime = Date.now() / 1000 - onlineInfo.joinTimestamp;
         onlineBody = <React.Fragment key={"value-live"}>{format_online_time(onlineTime)}</React.Fragment>;
     } else {
@@ -175,7 +175,7 @@ const ClientOnlineSince = React.memo(() => {
     }
 
     useEffect(() => {
-        if(!onlineInfo || onlineInfo.leaveTimestamp !== 0 || onlineInfo.joinTimestamp === 0) {
+        if (!onlineInfo || onlineInfo.leaveTimestamp !== 0 || onlineInfo.joinTimestamp === 0) {
             return;
         }
 
@@ -194,13 +194,13 @@ const ClientOnlineSince = React.memo(() => {
 const ClientCountry = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ country, setCountry ] = useDependentState<ClientCountryInfo>(() => {
+    const [country, setCountry] = useDependentState<ClientCountryInfo>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_country");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_country", event => setCountry(event.country), undefined, []);
 
@@ -215,24 +215,24 @@ const ClientCountry = React.memo(() => {
 const ClientVolume = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ volume, setVolume ] = useDependentState<ClientVolumeInfo>(() => {
+    const [volume, setVolume] = useDependentState<ClientVolumeInfo>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_volume");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_volume", event => setVolume(event.volume), undefined, []);
 
-    if(client.type === "self" || client.type === "none") {
+    if (client.type === "self" || client.type === "none") {
         return null;
     }
 
     let body;
-    if(volume) {
+    if (volume) {
         let text = (volume.volume * 100).toFixed(0) + "%";
-        if(volume.muted) {
+        if (volume.muted) {
             text += " (" + tr("Muted") + ")";
         }
         body = <React.Fragment key={"value"}>{text}</React.Fragment>;
@@ -248,62 +248,24 @@ const ClientVolume = React.memo(() => {
     );
 });
 
-const ClientForumAccount = React.memo(() => {
-    const events = useContext(EventsContext);
-    const client = useContext(ClientContext);
-    const [ forum, setForum ] = useDependentState<ClientForumInfo>(() => {
-        if(client.type !== "none") {
-            events.fire("query_forum");
-        }
-
-        return undefined;
-    }, [ client.contextHash ]);
-
-    events.reactUse("notify_forum", event => setForum(event.forum), undefined, []);
-
-    if(!forum) {
-        return null;
-    }
-
-    let text = forum.nickname;
-    if((forum.flags & 0x01) > 0) {
-        text += " (" + tr("Banned") + ")";
-    }
-
-    if((forum.flags & 0x02) > 0) {
-        text += " (" + tr("Stuff") + ")";
-    }
-
-    if((forum.flags & 0x04) > 0) {
-        text += " (" + tr("Premium") + ")";
-    }
-
-
-    return (
-        <InfoBlock clientIcon={ClientIcon.ClientInfoForumAccount} valueClass={cssStyle.clientTeaforoAccount}>
-            <Translatable>TeaSpeak Forum account</Translatable>
-            <a href={"https://forum.teaspeak.de/index.php?members/" + forum.userId} target={"_blank"}>{text}</a>
-        </InfoBlock>
-    );
-});
 
 const ClientVersion = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ version, setVersion ] = useDependentState<ClientVersionInfo>(() => {
+    const [version, setVersion] = useDependentState<ClientVersionInfo>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_version");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_version", event => setVersion(event.version), undefined, []);
 
     let body;
-    if(version) {
+    if (version) {
         let platform = version.platform;
-        if(platform.indexOf("Win32") != 0 && (version.version.indexOf("Win64") != -1 || version.version.indexOf("WOW64") != -1)) {
+        if (platform.indexOf("Win32") != 0 && (version.version.indexOf("Win64") != -1 || version.version.indexOf("WOW64") != -1)) {
             platform = platform.replace("Win32", "Win64");
         }
 
@@ -330,41 +292,41 @@ const ClientStatusEntry = (props: { icon: ClientIcon, children: React.ReactEleme
 const ClientStatus = React.memo(() => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ status, setStatus ] = useDependentState<ClientStatusInfo>(() => {
+    const [status, setStatus] = useDependentState<ClientStatusInfo>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_status");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_status", event => setStatus(event.status), undefined, []);
 
     let elements = [];
-    if(status) {
+    if (status) {
-        if(status.away) {
+        if (status.away) {
             let message = typeof status.away === "string" ? " (" + status.away + ")" : undefined;
             elements.push(<ClientStatusEntry key={"away"} icon={ClientIcon.Away}><><Translatable>Away</Translatable> {message}</></ClientStatusEntry>);
         }
 
-        if(status.speakerDisabled) {
+        if (status.speakerDisabled) {
             elements.push(<ClientStatusEntry key={"hardwareoutputmuted"} icon={ClientIcon.HardwareOutputMuted}><Translatable>Speakers/Headphones disabled</Translatable></ClientStatusEntry>);
         }
 
-        if(status.microphoneDisabled) {
+        if (status.microphoneDisabled) {
             elements.push(<ClientStatusEntry key={"hardwareinputmuted"} icon={ClientIcon.HardwareInputMuted}><Translatable>Microphone disabled</Translatable></ClientStatusEntry>);
         }
 
-        if(status.speakerMuted) {
+        if (status.speakerMuted) {
             elements.push(<ClientStatusEntry key={"outputmuted"} icon={ClientIcon.OutputMuted}><Translatable>Speakers/Headphones Muted</Translatable></ClientStatusEntry>);
         }
 
-        if(status.microphoneMuted) {
+        if (status.microphoneMuted) {
             elements.push(<ClientStatusEntry key={"inputmuted"} icon={ClientIcon.InputMuted}><Translatable>Microphone Muted</Translatable></ClientStatusEntry>);
         }
     }
 
-    if(elements.length === 0) {
+    if (elements.length === 0) {
         return null;
     }
 
@@ -379,17 +341,17 @@ const ClientStatus = React.memo(() => {
 const FullInfoButton = () => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ onlineInfo, setOnlineInfo ] = useDependentState<ClientInfoOnline>(() => {
+    const [onlineInfo, setOnlineInfo] = useDependentState<ClientInfoOnline>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_online");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_online", event => setOnlineInfo(event.status), undefined, []);
 
-    if(!onlineInfo || onlineInfo.leaveTimestamp !== 0) {
+    if (!onlineInfo || onlineInfo.leaveTimestamp !== 0) {
         return null;
     }
 
@@ -413,15 +375,15 @@ const GroupRenderer = (props: { group: ClientGroupInfo }) => {
 const ChannelGroupRenderer = () => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ channelGroup, setChannelGroup ] = useDependentState<ClientGroupInfo>(() => {
+    const [channelGroup, setChannelGroup] = useDependentState<ClientGroupInfo>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_channel_group");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
-    const [ inheritedChannel, setInheritedChannel ] = useDependentState<InheritedChannelInfo>(() => undefined, [ client.contextHash ]);
+    const [inheritedChannel, setInheritedChannel] = useDependentState<InheritedChannelInfo>(() => undefined, [client.contextHash]);
 
     events.reactUse("notify_channel_group", event => {
         setChannelGroup(event.group);
@@ -429,9 +391,9 @@ const ChannelGroupRenderer = () => {
     }, undefined, []);
 
     let body;
-    if(channelGroup) {
+    if (channelGroup) {
         let groupRendered = <GroupRenderer group={channelGroup} key={"group-" + channelGroup.groupId} />;
-        if(inheritedChannel) {
+        if (inheritedChannel) {
             body = (
                 <React.Fragment key={"inherited"}>
                     {groupRendered}
@@ -459,18 +421,18 @@ const ChannelGroupRenderer = () => {
 const ServerGroupRenderer = () => {
     const events = useContext(EventsContext);
     const client = useContext(ClientContext);
-    const [ serverGroups, setServerGroups ] = useDependentState<ClientGroupInfo[]>(() => {
+    const [serverGroups, setServerGroups] = useDependentState<ClientGroupInfo[]>(() => {
-        if(client.type !== "none") {
+        if (client.type !== "none") {
             events.fire("query_server_groups");
         }
 
         return undefined;
-    }, [ client.contextHash ]);
+    }, [client.contextHash]);
 
     events.reactUse("notify_server_groups", event => setServerGroups(event.groups), undefined, []);
 
     let body;
-    if(serverGroups) {
+    if (serverGroups) {
         body = serverGroups.map(group => <GroupRenderer group={group} key={"group-" + group.groupId} />);
     } else {
         body = <React.Fragment key={"loading"}><Translatable>loading</Translatable> <LoadingDots /></React.Fragment>;
@@ -486,7 +448,7 @@ const ServerGroupRenderer = () => {
 
 const ConnectedClientInfoBlock = () => {
     const client = useContext(ClientContext);
-    if(client.type === "query" || client.type === "none") {
+    if (client.type === "query" || client.type === "none") {
         return null;
     }
 
@@ -494,7 +456,6 @@ const ConnectedClientInfoBlock = () => {
         <React.Fragment key={"info"}>
             <ClientOnlineSince />
             <ClientCountry />
-            <ClientForumAccount />
             <ClientVolume />
             <ClientVersion />
             <ClientStatus />
@@ -505,12 +466,12 @@ const ConnectedClientInfoBlock = () => {
 const ClientInfoProvider = () => {
     const events = useContext(EventsContext);
 
-    const [ client, setClient ] = useState<OptionalClientInfoInfo>(() => {
+    const [client, setClient] = useState<OptionalClientInfoInfo>(() => {
         events.fire("query_client");
         return { type: "none", contextHash: guid() };
     });
     events.reactUse("notify_client", event => {
-        if(event.info) {
+        if (event.info) {
             setClient({
                 contextHash: guid(),
                 type: event.info.type,
@@ -519,7 +480,7 @@ const ClientInfoProvider = () => {
                 clientId: event.info.clientId,
                 clientDatabaseId: event.info.clientDatabaseId
             });
-        } else if(client.type !== "none") {
+        } else if (client.type !== "none") {
             setClient({ type: "none", contextHash: guid() });
         }
     });

shared/js/ui/modal/ModalClientInfo.ts

@@ -1,13 +1,13 @@
-import {ClientConnectionInfo, ClientEntry} from "../../tree/Client";
+import { ClientConnectionInfo, ClientEntry } from "../../tree/Client";
 import PermissionType from "../../permission/PermissionType";
-import {createInfoModal, createModal, Modal} from "../../ui/elements/Modal";
+import { createInfoModal, createModal, Modal } from "../../ui/elements/Modal";
-import {copyToClipboard} from "../../utils/helpers";
+import { copyToClipboard } from "../../utils/helpers";
 import * as i18nc from "../../i18n/CountryFlag";
 import * as tooltip from "../../ui/elements/Tooltip";
 import moment from "moment";
-import {format_number, network} from "../../ui/frames/chat";
+import { format_number, network } from "../../ui/frames/chat";
-import {generateIconJQueryTag, getIconManager} from "tc-shared/file/Icons";
+import { generateIconJQueryTag, getIconManager } from "tc-shared/file/Icons";
-import {tr} from "tc-shared/i18n/localize";
+import { tr } from "tc-shared/i18n/localize";
 
 type InfoUpdateCallback = (info: ClientConnectionInfo) => any;
 
@@ -147,31 +147,6 @@ function apply_basic_info(client: ClientEntry, tag: JQuery, modal: Modal, callba
         });
     }
 
-    /* TeaForo */
-    {
-        const container = tag.find(".property-teaforo .value").empty();
-
-        if (client.properties.client_teaforo_id) {
-            container.children().remove();
-
-            let text = client.properties.client_teaforo_name;
-            if ((client.properties.client_teaforo_flags & 0x01) > 0)
-                text += " (" + tr("Banned") + ")";
-            if ((client.properties.client_teaforo_flags & 0x02) > 0)
-                text += " (" + tr("Stuff") + ")";
-            if ((client.properties.client_teaforo_flags & 0x04) > 0)
-                text += " (" + tr("Premium") + ")";
-
-            $.spawn("a")
-                .attr("href", "https://forum.teaspeak.de/index.php?members/" + client.properties.client_teaforo_id)
-                .attr("target", "_blank")
-                .text(text)
-                .appendTo(container);
-        } else {
-            container.append($.spawn("a").text(tr("Not connected")));
-        }
-    }
-
     /* Version */
     {
         const container = tag.find(".property-version");
@@ -376,7 +351,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
                 if (packets == 0 && info.connection_packets_received_keepalive == -1)
                     node_downstream.innerText = tr("Not calculated");
                 else
-                    node_downstream.innerText = format_number(packets, {unit: "Packets"});
+                    node_downstream.innerText = format_number(packets, { unit: "Packets" });
             });
             node_downstream.innerText = tr("loading...");
         }
@@ -390,7 +365,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
                 if (packets == 0 && info.connection_packets_sent_keepalive == -1)
                     node_upstream.innerText = tr("Not calculated");
                 else
-                    node_upstream.innerText = format_number(packets, {unit: "Packets"});
+                    node_upstream.innerText = format_number(packets, { unit: "Packets" });
             });
             node_upstream.innerText = tr("loading...");
         }
@@ -446,7 +421,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
                 if (bytes == 0 && info.connection_bandwidth_received_last_second_keepalive == -1)
                     node_downstream.innerText = tr("Not calculated");
                 else
-                    node_downstream.innerText = network.format_bytes(bytes, {time: "s"});
+                    node_downstream.innerText = network.format_bytes(bytes, { time: "s" });
             });
             node_downstream.innerText = tr("loading...");
         }
@@ -460,7 +435,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
                 if (bytes == 0 && info.connection_bandwidth_sent_last_second_keepalive == -1)
                     node_upstream.innerText = tr("Not calculated");
                 else
-                    node_upstream.innerText = network.format_bytes(bytes, {time: "s"});
+                    node_upstream.innerText = network.format_bytes(bytes, { time: "s" });
             });
             node_upstream.innerText = tr("loading...");
         }
@@ -481,7 +456,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
                 if (bytes == 0 && info.connection_bandwidth_received_last_minute_keepalive == -1)
                     node_downstream.innerText = tr("Not calculated");
                 else
-                    node_downstream.innerText = network.format_bytes(bytes, {time: "s"});
+                    node_downstream.innerText = network.format_bytes(bytes, { time: "s" });
             });
             node_downstream.innerText = tr("loading...");
         }
@@ -495,7 +470,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
                 if (bytes == 0 && info.connection_bandwidth_sent_last_minute_keepalive == -1)
                     node_upstream.innerText = tr("Not calculated");
                 else
-                    node_upstream.innerText = network.format_bytes(bytes, {time: "s"});
+                    node_upstream.innerText = network.format_bytes(bytes, { time: "s" });
             });
             node_upstream.innerText = tr("loading...");
         }
@@ -510,7 +485,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
         if (node_downstream) {
             client.updateClientVariables().then(info => {
                 //TODO: Test for own client info and if so then show the max quota (needed permission)
-                node_downstream.innerText = network.format_bytes(client.properties.client_month_bytes_downloaded, {exact: false});
+                node_downstream.innerText = network.format_bytes(client.properties.client_month_bytes_downloaded, { exact: false });
             });
             node_downstream.innerText = tr("loading...");
         }
@@ -518,7 +493,7 @@ function apply_packets(client: ClientEntry, tag: JQuery, modal: Modal, callbacks
         if (node_upstream) {
             client.updateClientVariables().then(info => {
                 //TODO: Test for own client info and if so then show the max quota (needed permission)
-                node_upstream.innerText = network.format_bytes(client.properties.client_month_bytes_uploaded, {exact: false});
+                node_upstream.innerText = network.format_bytes(client.properties.client_month_bytes_uploaded, { exact: false });
             });
             node_upstream.innerText = tr("loading...");
         }

shared/js/ui/modal/ModalSettings.tsx

@@ -1,38 +1,36 @@
-import {createErrorModal, createInfoModal, createInputModal, createModal, Modal} from "tc-shared/ui/elements/Modal";
+import { createErrorModal, createInfoModal, createInputModal, createModal, Modal } from "tc-shared/ui/elements/Modal";
-import {sliderfy} from "tc-shared/ui/elements/Slider";
+import { sliderfy } from "tc-shared/ui/elements/Slider";
-import {settings, Settings} from "tc-shared/settings";
+import { settings, Settings } from "tc-shared/settings";
 import * as sound from "tc-shared/audio/Sounds";
-import {manager, setSoundMasterVolume, Sound} from "tc-shared/audio/Sounds";
+import { manager, setSoundMasterVolume, Sound } from "tc-shared/audio/Sounds";
 import * as profiles from "tc-shared/profiles/ConnectionProfile";
-import {ConnectionProfile} from "tc-shared/profiles/ConnectionProfile";
+import { ConnectionProfile } from "tc-shared/profiles/ConnectionProfile";
-import {IdentitifyType} from "tc-shared/profiles/Identity";
+import { IdentitifyType } from "tc-shared/profiles/Identity";
-import {TeaForumIdentity} from "tc-shared/profiles/identities/TeaForumIdentity";
+import { TeaSpeakIdentity } from "tc-shared/profiles/identities/TeamSpeakIdentity";
-import {TeaSpeakIdentity} from "tc-shared/profiles/identities/TeamSpeakIdentity";
+import { NameIdentity } from "tc-shared/profiles/identities/NameIdentity";
-import {NameIdentity} from "tc-shared/profiles/identities/NameIdentity";
+import { LogCategory, logDebug, logError, logTrace, logWarn } from "tc-shared/log";
-import {LogCategory, logDebug, logError, logTrace, logWarn} from "tc-shared/log";
 import * as i18n from "tc-shared/i18n/localize";
-import {RepositoryTranslation, TranslationRepository} from "tc-shared/i18n/localize";
+import { RepositoryTranslation, TranslationRepository } from "tc-shared/i18n/localize";
-import {Registry} from "tc-shared/events";
+import { Registry } from "tc-shared/events";
 import * as i18nc from "../../i18n/CountryFlag";
-import * as forum from "tc-shared/profiles/identities/teaspeak-forum";
+import { formatMessage, set_icon_size } from "tc-shared/ui/frames/chat";
-import {formatMessage, set_icon_size} from "tc-shared/ui/frames/chat";
+import { spawnTeamSpeakIdentityImport, spawnTeamSpeakIdentityImprove } from "tc-shared/ui/modal/ModalIdentity";
-import {spawnTeamSpeakIdentityImport, spawnTeamSpeakIdentityImprove} from "tc-shared/ui/modal/ModalIdentity";
+import { getAudioBackend, OutputDevice } from "tc-shared/audio/Player";
-import {getAudioBackend, OutputDevice} from "tc-shared/audio/Player";
+import { KeyMapSettings } from "tc-shared/ui/modal/settings/Keymap";
-import {KeyMapSettings} from "tc-shared/ui/modal/settings/Keymap";
 import * as React from "react";
 import * as ReactDOM from "react-dom";
-import {NotificationSettings} from "tc-shared/ui/modal/settings/Notifications";
+import { NotificationSettings } from "tc-shared/ui/modal/settings/Notifications";
-import {initialize_audio_microphone_controller} from "tc-shared/ui/modal/settings/Microphone";
+import { initialize_audio_microphone_controller } from "tc-shared/ui/modal/settings/Microphone";
-import {MicrophoneSettings} from "tc-shared/ui/modal/settings/MicrophoneRenderer";
+import { MicrophoneSettings } from "tc-shared/ui/modal/settings/MicrophoneRenderer";
-import {getBackend} from "tc-shared/backend";
+import { getBackend } from "tc-shared/backend";
-import {MicrophoneSettingsEvents} from "tc-shared/ui/modal/settings/MicrophoneDefinitions";
+import { MicrophoneSettingsEvents } from "tc-shared/ui/modal/settings/MicrophoneDefinitions";
-import {promptYesNo} from "tc-shared/ui/modal/yes-no/Controller";
+import { promptYesNo } from "tc-shared/ui/modal/yes-no/Controller";
 
 type ProfileInfoEvent = {
     id: string,
     name: string,
     nickname: string,
-    identity_type: "teaforo" | "teamspeak" | "nickname",
+    identity_type: "teamspeak" | "nickname",
 
     identity_forum?: {
         valid: boolean,
@@ -52,7 +50,7 @@ export interface SettingProfileEvents {
     "reload-profile": { profile_id?: string },
     "select-profile": { profile_id: string },
 
-    "query-profile-list": { },
+    "query-profile-list": {},
     "query-profile-list-result": {
         status: "error" | "success" | "timeout",
 
@@ -71,7 +69,7 @@ export interface SettingProfileEvents {
 
     "select-identity-type": {
         profile_id: string,
-        identity_type: "teamspeak" | "teaforo" | "nickname" | "unset"
+        identity_type: "teamspeak" | "nickname" | "unset"
     },
 
     "query-profile-validity": { profile_id: string },
@@ -232,7 +230,6 @@ export function spawnSettingsModal(default_page?: string): Modal {
     settings_audio_speaker(modal.htmlTag.find(".right .container.audio-speaker"), modal);
     settings_audio_sounds(modal.htmlTag.find(".right .container.audio-sounds"), modal);
     const update_profiles = settings_identity_profiles(modal.htmlTag.find(".right .container.identity-profiles"), modal);
-    settings_identity_forum(modal.htmlTag.find(".right .container.identity-forum"), modal, update_profiles as any);
 
     modal.close_listener.push(() => {
         if (profiles.requires_save())
@@ -500,13 +497,13 @@ function settings_general_language(container: JQuery, modal: Modal) {
 }
 
 function settings_general_keymap(container: JQuery, modal: Modal) {
-    const entry = <KeyMapSettings/>;
+    const entry = <KeyMapSettings />;
     ReactDOM.render(entry, container[0]);
     modal.close_listener.push(() => ReactDOM.unmountComponentAtNode(container[0]));
 }
 
 function settings_general_notifications(container: JQuery, modal: Modal) {
-    const entry = <NotificationSettings/>;
+    const entry = <NotificationSettings />;
     ReactDOM.render(entry, container[0]);
     modal.close_listener.push(() => ReactDOM.unmountComponentAtNode(container[0]));
 }
@@ -599,7 +596,7 @@ function settings_audio_microphone(container: JQuery, modal: Modal) {
     const registry = new Registry<MicrophoneSettingsEvents>();
     initialize_audio_microphone_controller(registry);
 
-    const entry = <MicrophoneSettings events={registry}/>;
+    const entry = <MicrophoneSettings events={registry} />;
     ReactDOM.render(entry, container[0]);
     modal.close_listener.push(() => {
         ReactDOM.unmountComponentAtNode(container[0]);
@@ -876,11 +873,10 @@ export namespace modal_settings {
             }
 
             profiles.delete_profile(profile);
-            event_registry.fire_react("delete-profile-result", {status: "success", profile_id: event.profile_id});
+            event_registry.fire_react("delete-profile-result", { status: "success", profile_id: event.profile_id });
         });
 
         const build_profile_info = (profile: ConnectionProfile) => {
-            const forum_data = profile.selectedIdentity(IdentitifyType.TEAFORO) as TeaForumIdentity;
             const teamspeak_data = profile.selectedIdentity(IdentitifyType.TEAMSPEAK) as TeaSpeakIdentity;
             const nickname_data = profile.selectedIdentity(IdentitifyType.NICKNAME) as NameIdentity;
 
@@ -889,10 +885,6 @@ export namespace modal_settings {
                 name: profile.profileName,
                 nickname: profile.defaultUsername,
                 identity_type: profile.selectedIdentityType as any,
-                identity_forum: !forum_data ? undefined : {
-                    valid: forum_data.valid(),
-                    fallback_name: forum_data.fallback_name()
-                },
                 identity_nickname: !nickname_data ? undefined : {
                     name: nickname_data.name(),
                     fallback_name: nickname_data.fallback_name()
@@ -1041,7 +1033,7 @@ export namespace modal_settings {
         });
 
         event_registry.on("select-identity-type", event => {
-            if(!event.identity_type) {
+            if (!event.identity_type) {
                 /* dummy event for UI init */
                 return;
             }
@@ -1184,11 +1176,11 @@ export namespace modal_settings {
                 );
                 tag_avatar.hide(); /* no avatars yet */
 
-                tag.on('click', event => event_registry.fire("select-profile", {profile_id: profile.id}));
+                tag.on('click', event => event_registry.fire("select-profile", { profile_id: profile.id }));
                 tag.toggleClass("selected", selected);
                 tag_default.toggle(profile.id === "default");
 
-                event_registry.fire("query-profile-validity", {profile_id: profile.id});
+                event_registry.fire("query-profile-validity", { profile_id: profile.id });
                 return tag;
             };
 
@@ -1233,7 +1225,7 @@ export namespace modal_settings {
                 if (event.status !== "success") return;
 
                 event_registry.fire("query-profile-list");
-                event_registry.one("query-profile-list-result", e => event_registry.fire("select-profile", {profile_id: event.profile_id}));
+                event_registry.one("query-profile-list-result", e => event_registry.fire("select-profile", { profile_id: event.profile_id }));
             });
 
             event_registry.on("set-profile-name-result", event => {
@@ -1274,7 +1266,7 @@ export namespace modal_settings {
 
                 /* we need a short delay so everything could apply*/
                 setTimeout(() => {
-                    event_registry.fire("query-profile-validity", {profile_id: event.profile_id});
+                    event_registry.fire("query-profile-validity", { profile_id: event.profile_id });
                 }, 100);
             });
             event_registry.on(["set-default-name-result", "set-profile-name-result", "set-identity-name-name-result", "generate-identity-teamspeak-result"], event => {
@@ -1283,7 +1275,7 @@ export namespace modal_settings {
                     return;
                 }
                 if ((event as any).status !== "success") return;
-                event_registry.fire("query-profile-validity", {profile_id: (event as any).profile_id});
+                event_registry.fire("query-profile-validity", { profile_id: (event as any).profile_id });
             })
         }
 
@@ -1304,7 +1296,7 @@ export namespace modal_settings {
                 const button = container.find(".button-set-default");
                 let current_profile;
 
-                button.on('click', event => event_registry.fire("set-default-profile", {profile_id: current_profile}));
+                button.on('click', event => event_registry.fire("set-default-profile", { profile_id: current_profile }));
                 event_registry.on("select-profile", event => {
                     current_profile = event.profile_id;
                     button.prop("disabled", !event.profile_id || event.profile_id === "default");
@@ -1331,7 +1323,7 @@ export namespace modal_settings {
                         question: tr("Do you really want to delete this profile?"),
                     }).then(result => {
                         if (result)
-                            event_registry.fire("delete-profile", {profile_id: current_profile});
+                            event_registry.fire("delete-profile", { profile_id: current_profile });
                     });
                 });
 
@@ -1354,7 +1346,7 @@ export namespace modal_settings {
                 button.on('click', event => {
                     createInputModal(tr("Please enter a name"), tr("Please enter a name for the new profile:"), text => text.length >= 3 && !profiles.find_profile_by_name(text), value => {
                         if (value)
-                            event_registry.fire("create-profile", {name: value as string});
+                            event_registry.fire("create-profile", { name: value as string });
                     }).open();
                 });
 
@@ -1362,7 +1354,7 @@ export namespace modal_settings {
                 event_registry.on("create-profile-result", event => {
                     button.prop("disabled", false);
                     if (event.status === "success") {
-                        event_registry.fire("select-profile", {profile_id: event.profile_id});
+                        event_registry.fire("select-profile", { profile_id: event.profile_id });
                         return;
                     }
 
@@ -1435,7 +1427,7 @@ export namespace modal_settings {
                         const profile = profiles.find_profile_by_name(text);
                         if (text.length < 3 || (profile && profile.id != current_profile)) return;
 
-                        event_registry.fire("set-profile-name", {profile_id: current_profile, name: text});
+                        event_registry.fire("set-profile-name", { profile_id: current_profile, name: text });
                     });
                 }
 
@@ -1465,7 +1457,6 @@ export namespace modal_settings {
                         if (event.status === "success") {
                             current_identity_type = event.info.identity_type;
                             fallback_names["nickname"] = event.info.identity_nickname ? event.info.identity_nickname.fallback_name : undefined;
-                            fallback_names["teaforo"] = event.info.identity_forum ? event.info.identity_forum.fallback_name : undefined;
                             fallback_names["teamspeak"] = event.info.identity_teamspeak ? event.info.identity_teamspeak.fallback_name : undefined;
 
                             last_name = event.info.nickname;
@@ -1504,7 +1495,7 @@ export namespace modal_settings {
                         const text = input.val() as string;
                         if (text.length != 0 && text.length < 3) return;
 
-                        event_registry.fire("set-default-name", {profile_id: current_profile, name: text});
+                        event_registry.fire("set-default-name", { profile_id: current_profile, name: text });
                     });
                 }
 
@@ -1608,7 +1599,7 @@ export namespace modal_settings {
 
                         input_unique_id.val(unique_id).attr("placeholder", null);
                         if (typeof level !== "number")
-                            event_registry.fire("query-identity-teamspeak", {profile_id: current_profile});
+                            event_registry.fire("query-identity-teamspeak", { profile_id: current_profile });
                         else
                             input_current_level.val(level).attr("placeholder", null);
 
@@ -1656,10 +1647,10 @@ export namespace modal_settings {
                                 title: tr("Are you sure"),
                                 question: tr("Do you really want to generate a new identity and override the old identity?"),
                             }).then(result => {
-                                if (result) event_registry.fire("generate-identity-teamspeak", {profile_id: current_profile});
+                                if (result) event_registry.fire("generate-identity-teamspeak", { profile_id: current_profile });
                             });
                         } else {
-                            event_registry.fire("generate-identity-teamspeak", {profile_id: current_profile});
+                            event_registry.fire("generate-identity-teamspeak", { profile_id: current_profile });
                         }
                     });
 
@@ -1684,10 +1675,10 @@ export namespace modal_settings {
                                 title: tr("Are you sure"),
                                 question: tr("Do you really want to import a new identity and override the old identity?"),
                             }).then(result => {
-                                if (result) event_registry.fire("import-identity-teamspeak", {profile_id: current_profile});
+                                if (result) event_registry.fire("import-identity-teamspeak", { profile_id: current_profile });
                             });
                         } else {
-                            event_registry.fire("import-identity-teamspeak", {profile_id: current_profile});
+                            event_registry.fire("import-identity-teamspeak", { profile_id: current_profile });
                         }
                     });
 
@@ -1700,7 +1691,7 @@ export namespace modal_settings {
                     event_registry.on("import-identity-teamspeak-result", event => {
                         if (event.profile_id !== current_profile) return;
 
-                        event_registry.fire_react("query-profile", {profile_id: event.profile_id}); /* we do it like this so the default nickname changes as well */
+                        event_registry.fire_react("query-profile", { profile_id: event.profile_id }); /* we do it like this so the default nickname changes as well */
                         createInfoModal(tr("Identity imported"), tr("Your identity had been successfully imported generated")).open();
                     });
                 }
@@ -1719,38 +1710,7 @@ export namespace modal_settings {
                 }
 
                 /* the improve button */
-                button_improve.on('click', event => event_registry.fire("improve-identity-teamspeak-level", {profile_id: current_profile}));
+                button_improve.on('click', event => event_registry.fire("improve-identity-teamspeak-level", { profile_id: current_profile }));
-            }
-
-            /* special info TeaSpeak - Forum */
-            {
-                const container_settings = container.find(".container-teaforo");
-                const container_valid = container_settings.find(".container-valid");
-                const container_invalid = container_settings.find(".container-invalid");
-
-                const button_setup = container_settings.find(".button-setup");
-
-                event_registry.on("select-identity-type", event => {
-                    if (event.profile_id !== current_profile) return;
-
-                    container_settings.toggle(event.identity_type === "teaforo");
-                });
-
-                event_registry.on("query-profile", event => {
-                    container_valid.toggle(false);
-                    container_invalid.toggle(false);
-                });
-
-                event_registry.on("query-profile-result", event => {
-                    if (event.profile_id !== current_profile) return;
-
-                    const valid = event.status === "success" && event.info.identity_forum && event.info.identity_forum.valid;
-                    container_valid.toggle(!!valid);
-                    container_invalid.toggle(!valid);
-                });
-
-                button_setup.on('click', event => event_registry.fire_react("setup-forum-connection"));
-                button_setup.toggle(settings.forum_setuppable);
             }
 
             /* special info nickname */
@@ -1811,7 +1771,7 @@ export namespace modal_settings {
                     const profile = profiles.find_profile_by_name(text);
                     if (text.length < 3 || (profile && profile.id != current_profile)) return;
 
-                    event_registry.fire("set-identity-name-name", {profile_id: current_profile, name: text});
+                    event_registry.fire("set-identity-name-name", { profile_id: current_profile, name: text });
                 });
             }
             event_registry.on("select-profile", e => current_profile = e.profile_id);
@@ -1822,7 +1782,7 @@ export namespace modal_settings {
             /* profile list */
             {
                 let timeout;
-                event_registry.on("query-profile-list", event => timeout = setTimeout(() => event_registry.fire("query-profile-list-result", {status: "timeout"}), 5000));
+                event_registry.on("query-profile-list", event => timeout = setTimeout(() => event_registry.fire("query-profile-list-result", { status: "timeout" }), 5000));
                 event_registry.on("query-profile-list-result", event => {
                     clearTimeout(timeout);
                     timeout = undefined;
@@ -1835,7 +1795,7 @@ export namespace modal_settings {
                 event_registry.on("create-profile", event => {
                     clearTimeout(timeouts[event.name]);
                     timeouts[event.name] = setTimeout(() => {
-                        event_registry.fire("create-profile-result", {name: event.name, status: "timeout"});
+                        event_registry.fire("create-profile-result", { name: event.name, status: "timeout" });
                     }, 5000);
                 });
 
@@ -1869,7 +1829,7 @@ export namespace modal_settings {
                 event_registry.on(event, event => {
                     clearTimeout(timeouts[event[key]]);
                     timeouts[event[key]] = setTimeout(() => {
-                        const timeout_event = {status: "timeout"};
+                        const timeout_event = { status: "timeout" };
                         timeout_event[key] = event[key];
                         event_registry.fire(response_event, timeout_event as any);
                     }, 5000);
@@ -1899,21 +1859,21 @@ export namespace modal_settings {
                 if (event.profile_id !== selected_profile) return;
 
                 /* the selected profile has been deleted, so we need to select another one */
-                event_registry.fire("select-profile", {profile_id: "default"});
+                event_registry.fire("select-profile", { profile_id: "default" });
             });
 
             /* reselect the default profile or the new default profile */
             event_registry.on("set-default-profile-result", event => {
                 if (event.status !== "success") return;
                 if (selected_profile === "default")
-                    event_registry.fire("select-profile", {profile_id: event.new_profile_id});
+                    event_registry.fire("select-profile", { profile_id: event.new_profile_id });
                 else if (selected_profile === event.old_profile_id)
-                    event_registry.fire("select-profile", {profile_id: "default"});
+                    event_registry.fire("select-profile", { profile_id: "default" });
             });
 
             event_registry.on("select-profile", event => {
                 selected_profile = event.profile_id;
-                event_registry.fire("query-profile", {profile_id: event.profile_id});
+                event_registry.fire("query-profile", { profile_id: event.profile_id });
             });
 
             event_registry.on("reload-profile", event => {
@@ -1923,121 +1883,7 @@ export namespace modal_settings {
         }
 
         event_registry.fire("query-profile-list");
-        event_registry.fire("select-profile", {profile_id: "default"});
+        event_registry.fire("select-profile", { profile_id: "default" });
-        event_registry.fire("select-identity-type", {profile_id: "default", identity_type: undefined});
+        event_registry.fire("select-identity-type", { profile_id: "default", identity_type: undefined });
     }
 }
-
-function settings_identity_forum(container: JQuery, modal: Modal, update_profiles: () => any) {
-    const containers_connected = container.find(".show-connected");
-    const containers_disconnected = container.find(".show-disconnected");
-
-    const update_state = () => {
-        const logged_in = forum.logged_in();
-        containers_connected.toggle(logged_in);
-        containers_disconnected.toggle(!logged_in);
-
-        if (logged_in) {
-            container.find(".forum-username").text(forum.data().name());
-            container.find(".forum-premium").text(forum.data().is_premium() ? tr("Yes") : tr("No"));
-        }
-    };
-
-    /* login */
-    {
-        const button_login = container.find(".button-login");
-        const input_username = container.find(".input-username");
-        const input_password = container.find(".input-password");
-        const container_error = container.find(".container-login .container-error");
-
-        const container_captcha_g = container.find(".g-recaptcha");
-        let captcha: boolean | string = false;
-
-        const update_button_state = () => {
-            let enabled = true;
-            enabled = enabled && !!input_password.val();
-            enabled = enabled && !!input_username.val();
-            enabled = enabled && (typeof (captcha) === "boolean" ? !captcha : !!captcha);
-            button_login.prop("disabled", !enabled);
-        };
-
-        /* username */
-        input_username.on('change keyup', update_button_state);
-
-        /* password */
-        input_password.on('change keyup', update_button_state);
-
-        button_login.on('click', event => {
-            input_username.prop("disabled", true);
-            input_password.prop("disabled", true);
-            button_login.prop("disabled", true);
-            container_error.removeClass("shown");
-
-            forum.login(input_username.val() as string, input_password.val() as string, typeof (captcha) === "string" ? captcha : undefined).then(state => {
-                captcha = false;
-
-                logTrace(LogCategory.GENERAL, tr("Forum login result: %o"), state);
-                if (state.status === "success") {
-                    update_state();
-                    update_profiles();
-                    return;
-                }
-
-                setTimeout(() => {
-                    if (!!state.error_message) /* clear password if we have an error */
-                        input_password.val("");
-                    input_password.focus();
-                    update_button_state();
-                }, 0);
-                if (state.status === "captcha") {
-                    //TODO Works currently only with localhost!
-                    button_login.hide();
-                    container_error.text(state.error_message || tr("Captcha required")).addClass("shown");
-
-                    captcha = "";
-
-                    logDebug(LogCategory.GENERAL, tr("Showing captcha for site-key: %o"), state.captcha.data);
-                    forum.gcaptcha.spawn(container_captcha_g, state.captcha.data, token => {
-                        captcha = token;
-                        logTrace(LogCategory.GENERAL, tr("Got captcha token: %o"), token);
-                        container_captcha_g.hide();
-                        button_login.show();
-                        update_button_state();
-                    }).catch(error => {
-                        logError(LogCategory.GENERAL, tr("Failed to initialize forum captcha: %o"), error);
-                        container_error.text("Failed to initialize GReCaptcha! No authentication possible.").addClass("shown");
-                        container_captcha_g.hide();
-                        button_login.hide();
-                    });
-                    container_captcha_g.show();
-                } else {
-                    container_error.text(state.error_message || tr("Unknown error")).addClass("shown");
-                }
-            }).catch(error => {
-                logError(LogCategory.GENERAL, tr("Failed to login within the forum. Error: %o"), error);
-                createErrorModal(tr("Forum login failed."), tr("Forum login failed. Lookup the console for more information")).open();
-            }).then(() => {
-                input_username.prop("disabled", false);
-                input_password.prop("disabled", false);
-                update_button_state();
-            });
-        });
-        update_button_state();
-    }
-
-    /* logout */
-    {
-        container.find(".button-logout").on('click', event => {
-            forum.logout().catch(error => {
-                logError(LogCategory.IDENTITIES, tr("Failed to logout from forum: %o"), error);
-                createErrorModal(tr("Forum logout failed"), formatMessage(tr("Failed to logout from forum account.{:br:}Error: {}"), error)).open();
-            }).then(() => {
-                if (modal.shown)
-                    update_state();
-                update_profiles();
-            });
-        });
-    }
-
-    update_state();
-}

shared/js/ui/modal/connect/Controller.ts

@@ -1,25 +1,25 @@
-import { Registry } from "tc-shared/events";
+import {Registry} from "tc-shared/events";
 import {
     ConnectUiEvents,
     ConnectUiVariables,
 } from "tc-shared/ui/modal/connect/Definitions";
-import { LogCategory, logError, logWarn } from "tc-shared/log";
+import {LogCategory, logError, logWarn} from "tc-shared/log";
 import {
     availableConnectProfiles,
     ConnectionProfile,
     defaultConnectProfile,
     findConnectProfile
 } from "tc-shared/profiles/ConnectionProfile";
-import { Settings, settings } from "tc-shared/settings";
+import {Settings, settings} from "tc-shared/settings";
-import { connectionHistory, ConnectionHistoryEntry } from "tc-shared/connectionlog/History";
+import {connectionHistory, ConnectionHistoryEntry} from "tc-shared/connectionlog/History";
-import { createErrorModal } from "tc-shared/ui/elements/Modal";
+import {createErrorModal} from "tc-shared/ui/elements/Modal";
-import { ConnectionHandler } from "tc-shared/ConnectionHandler";
+import {ConnectionHandler} from "tc-shared/ConnectionHandler";
-import { server_connections } from "tc-shared/ConnectionManager";
+import {server_connections} from "tc-shared/ConnectionManager";
-import { parseServerAddress } from "tc-shared/tree/Server";
+import {parseServerAddress} from "tc-shared/tree/Server";
-import { spawnSettingsModal } from "tc-shared/ui/modal/ModalSettings";
+import {spawnSettingsModal} from "tc-shared/ui/modal/ModalSettings";
-import { UiVariableProvider } from "tc-shared/ui/utils/Variable";
+import {UiVariableProvider} from "tc-shared/ui/utils/Variable";
-import { createIpcUiVariableProvider } from "tc-shared/ui/utils/IpcVariable";
+import {createIpcUiVariableProvider} from "tc-shared/ui/utils/IpcVariable";
-import { spawnModal } from "tc-shared/ui/react-elements/modal";
+import {spawnModal} from "tc-shared/ui/react-elements/modal";
 import ipRegex from "ip-regex";
 
 const kRegexDomain = /^(localhost|((([a-zA-Z0-9_-]{0,63}\.){0,253})?[a-zA-Z0-9_-]{0,63}\.[a-zA-Z]{2,64}))$/i;
@@ -61,8 +61,7 @@ class ConnectController {
     private validateNickname: boolean;
     private validateAddress: boolean;
 
-    constructor(uiVariables: UiVariableProvider<ConnectUiVariables>) {
+    constructor(uiVariables: UiVariableProvider<ConnectUiVariables>) {7
-        7
         this.uiEvents = new Registry<ConnectUiEvents>();
         this.uiEvents.enableDebug("modal-connect");
 
@@ -72,7 +71,7 @@ class ConnectController {
         this.validateNickname = false;
         this.validateAddress = false;
 
-        this.defaultAddress = "tea.lp.kle.li";
+        this.defaultAddress = "ts.teaspeak.de";
         this.historyShown = settings.getValue(Settings.KEY_CONNECT_SHOW_HISTORY);
 
         this.currentAddress = settings.getValue(Settings.KEY_CONNECT_ADDRESS);
@@ -110,11 +109,11 @@ class ConnectController {
         }));
 
         this.uiVariables.setVariableProvider("server_address_valid", () => {
-            if (this.validateAddress) {
+            if(this.validateAddress) {
                 const address = this.currentAddress || this.defaultAddress || "";
                 const parsedAddress = parseServerAddress(address);
 
-                if (parsedAddress) {
+                if(parsedAddress) {
                     kRegexDomain.lastIndex = 0;
                     return kRegexDomain.test(parsedAddress.host) || ipRegex({ exact: true }).test(parsedAddress.host);
                 } else {
@@ -126,7 +125,7 @@ class ConnectController {
         });
 
         this.uiVariables.setVariableEditor("server_address", newValue => {
-            if (this.currentAddress === newValue.currentAddress) {
+            if(this.currentAddress === newValue.currentAddress) {
                 return false;
             }
 
@@ -140,7 +139,7 @@ class ConnectController {
         }));
 
         this.uiVariables.setVariableProvider("nickname_valid", () => {
-            if (this.validateNickname) {
+            if(this.validateNickname) {
                 const nickname = this.currentNickname || this.currentProfile?.connectUsername() || "";
                 return nickname.length >= 3 && nickname.length <= 30;
             } else {
@@ -149,7 +148,7 @@ class ConnectController {
         });
 
         this.uiVariables.setVariableEditor("nickname", newValue => {
-            if (this.currentNickname === newValue.currentNickname) {
+            if(this.currentNickname === newValue.currentNickname) {
                 return false;
             }
 
@@ -167,7 +166,7 @@ class ConnectController {
         }));
 
         this.uiVariables.setVariableEditor("password", newValue => {
-            if (this.currentPassword === newValue.password) {
+            if(this.currentPassword === newValue.password) {
                 return false;
             }
 
@@ -180,7 +179,7 @@ class ConnectController {
 
         this.uiVariables.setVariableProvider("historyShown", () => this.historyShown);
         this.uiVariables.setVariableEditor("historyShown", newValue => {
-            if (this.historyShown === newValue) {
+            if(this.historyShown === newValue) {
                 return false;
             }
 
@@ -189,8 +188,8 @@ class ConnectController {
             return true;
         });
 
-        this.uiVariables.setVariableProvider("history", async () => {
+        this.uiVariables.setVariableProvider("history",async () => {
-            if (!this.history) {
+            if(!this.history) {
                 this.history = await connectionHistory.lastConnectedServers(10);
             }
 
@@ -238,7 +237,7 @@ class ConnectController {
 
         this.uiVariables.setVariableEditor("profiles", newValue => {
             const profile = findConnectProfile(newValue.selected);
-            if (!profile) {
+            if(!profile) {
                 createErrorModal(tr("Invalid profile"), tr("Target connect profile is missing.")).open();
                 return false;
             }
@@ -253,16 +252,16 @@ class ConnectController {
         this.uiVariables.destroy();
     }
 
-    generateConnectParameters(): ConnectParameters | undefined {
+    generateConnectParameters() : ConnectParameters | undefined {
-        if (!this.uiVariables.getVariableSync("nickname_valid", undefined, true)) {
+        if(!this.uiVariables.getVariableSync("nickname_valid", undefined, true)) {
             return undefined;
         }
 
-        if (!this.uiVariables.getVariableSync("server_address_valid", undefined, true)) {
+        if(!this.uiVariables.getVariableSync("server_address_valid", undefined, true)) {
             return undefined;
         }
 
-        if (!this.uiVariables.getVariableSync("profile_valid", undefined, true)) {
+        if(!this.uiVariables.getVariableSync("profile_valid", undefined, true)) {
             return undefined;
         }
 
@@ -280,7 +279,7 @@ class ConnectController {
     }
 
     setSelectedHistoryId(id: number | -1) {
-        if (this.selectedHistoryId === id) {
+        if(this.selectedHistoryId === id) {
             return;
         }
 
@@ -288,7 +287,7 @@ class ConnectController {
         this.uiVariables.sendVariable("history");
 
         const historyEntry = this.history?.find(entry => entry.id === id);
-        if (!historyEntry) { return; }
+        if(!historyEntry) { return; }
 
         this.currentAddress = historyEntry.targetAddress;
         this.currentNickname = historyEntry.nickname;
@@ -301,12 +300,12 @@ class ConnectController {
     }
 
     setSelectedAddress(address: string | undefined, validate: boolean, updateUi: boolean) {
-        if (this.currentAddress !== address) {
+        if(this.currentAddress !== address) {
             this.currentAddress = address;
             settings.setValue(Settings.KEY_CONNECT_ADDRESS, address);
             this.setSelectedHistoryId(-1);
 
-            if (updateUi) {
+            if(updateUi) {
                 this.uiVariables.sendVariable("server_address");
             }
         }
@@ -316,7 +315,7 @@ class ConnectController {
     }
 
     setSelectedProfile(profile: ConnectionProfile | undefined) {
-        if (this.currentProfile === profile) {
+        if(this.currentProfile === profile) {
             return;
         }
 
@@ -348,11 +347,11 @@ export function spawnConnectModalNew(options: ConnectModalOptions) {
     const variableProvider = createIpcUiVariableProvider();
     const controller = new ConnectController(variableProvider);
 
-    if (typeof options.selectedAddress === "string") {
+    if(typeof options.selectedAddress === "string") {
         controller.setSelectedAddress(options.selectedAddress, false, true);
     }
 
-    if (typeof options.selectedProfile === "object") {
+    if(typeof options.selectedProfile === "object") {
         controller.setSelectedProfile(options.selectedProfile);
     }
 
@@ -364,7 +363,7 @@ export function spawnConnectModalNew(options: ConnectModalOptions) {
 
     controller.uiEvents.on("action_connect", event => {
         const parameters = controller.generateConnectParameters();
-        if (!parameters) {
+        if(!parameters) {
             /* invalid parameters detected */
             return;
         }
@@ -372,14 +371,14 @@ export function spawnConnectModalNew(options: ConnectModalOptions) {
         modal.destroy();
 
         let connection: ConnectionHandler;
-        if (event.newTab) {
+        if(event.newTab) {
             connection = server_connections.spawnConnectionHandler();
             server_connections.setActiveConnectionHandler(connection);
         } else {
             connection = server_connections.getActiveConnectionHandler();
         }
 
-        if (!connection) {
+        if(!connection) {
             return;
         }
 

shared/js/ui/react-elements/ChatBox.tsx

@@ -2,8 +2,11 @@ import * as React from "react";
 import { useEffect, useRef, useState } from "react";
 import { Registry } from "tc-shared/events";
 
+//import '!style-loader!css-loader!emoji-mart/css/emoji-mart.css'
 import { settings, Settings } from "tc-shared/settings";
 import { Translatable } from "tc-shared/ui/react-elements/i18n";
+import { getTwenmojiHashFromNativeEmoji } from "tc-shared/text/bbcode/EmojiUtil";
+import { useGlobalSetting } from "tc-shared/ui/react-elements/Helper";
 
 import Picker from '@emoji-mart/react'
 import data from '@emoji-mart/data'
@@ -30,7 +33,19 @@ interface ChatBoxEvents {
 }
 
 const LastUsedEmoji = () => {
-    return <img key={"fallback"} alt={""} src={"img/smiley.png"} />;
+    // const settingValue = useGlobalSetting(Settings.KEY_CHAT_LAST_USED_EMOJI);
+
+    // const lastEmoji: BaseEmoji = (emojiIndex.emojis[settingValue] || emojiIndex.emojis["joy"]) as any;
+    // if (!lastEmoji?.native) {
+    //     return <img key={"fallback"} alt={""} src={"img/smiley-smile.svg"} />;
+    // }
+
+    const le: Emoji = new Emoji({ id: 'smiley', set: 'native' })
+    return le.component
+
+    // return (
+    //     <img draggable={false} src={"https://twemoji.maxcdn.com/v/12.1.2/72x72/" + getTwenmojiHashFromNativeEmoji(lastEmoji.native) + ".png"} alt={lastEmoji.native} className={cssStyle.emoji} />
+    // )
 }
 
 const EmojiButton = (props: { events: Registry<ChatBoxEvents> }) => {
@@ -62,6 +77,7 @@ const EmojiButton = (props: { events: Registry<ChatBoxEvents> }) => {
     props.events.reactUse("action_set_enabled", event => setEnabled(event.enabled));
     props.events.reactUse("action_submit_message", () => setShown(false));
 
+
     return (
         <div className={cssStyle.containerEmojis} ref={refContainer}>
             <div className={cssStyle.button} onClick={() => enabled && setShown(true)}>
@@ -69,6 +85,23 @@ const EmojiButton = (props: { events: Registry<ChatBoxEvents> }) => {
             </div>
             <div className={cssStyle.picker} style={{ display: shown ? undefined : "none" }}>
                 {!shown ? undefined :
+                    // <Picker
+                    //     key={"picker"}
+                    //     set={"twitter"}
+                    //     theme={"light"}
+                    //     showPreview={true}
+                    //     title={""}
+                    //     showSkinTones={true}
+                    //     useButton={false}
+                    //     native={false}
+
+                    //     onSelect={(emoji: any) => {
+                    //         if (enabled) {
+                    //             settings.setValue(Settings.KEY_CHAT_LAST_USED_EMOJI, emoji.id as string);
+                    //             props.events.fire("action_insert_text", { text: emoji.native, focus: true });
+                    //         }
+                    //     }}
+                    // />
                     <Picker
                         data={data}
                         key={"picker"}
@@ -80,11 +113,11 @@ const EmojiButton = (props: { events: Registry<ChatBoxEvents> }) => {
 
                         onEmojiSelect={(emoji: any) => {
                             if (enabled) {
+                                //settings.setValue(Settings.KEY_CHAT_LAST_USED_EMOJI, emoji.id as string);
                                 props.events.fire("action_insert_text", { text: emoji.native, focus: true });
                             }
                         }}
                     />
-
                 }
             </div>
         </div>

tsbaseconfig.json

@@ -14,6 +14,7 @@
   },
   "include": [
     "webpack.config.ts",
+    "webpack-client.config.ts",
     "webpack-web.config.ts",
     "webpack/build-definitions.d.ts",
     "webpack/HtmlWebpackInlineSource.ts",

webpack-client.config.ts

@@ -0,0 +1,27 @@
+import * as path from "path";
+import * as config_base from "./webpack.config";
+
+export = env => config_base.config(env, "client").then(config => {
+    Object.assign(config.entry, {
+        "main-app": ["./client/app/entry-points/AppMain.ts"],
+        "modal-external": ["./client/app/entry-points/ModalWindow.ts"]
+    });
+
+    Object.assign(config.resolve.alias, {
+        "tc-shared": path.resolve(__dirname, "shared/js"),
+    });
+
+    if(!Array.isArray(config.externals)) {
+        throw "invalid config";
+    }
+
+    config.externals.push(({ context, request }, callback) => {
+        if (request.startsWith("tc-backend/")) {
+            return callback(null, `window["backend-loader"].require("${request}")`);
+        }
+
+        callback(undefined, undefined);
+    });
+
+    return Promise.resolve(config);
+});