Added Vodia Identity Switcher for Xinon Users

public/assets/css/thetool.css

@@ -133,6 +133,33 @@ h1, h2, h3, h4, h5, h6 {
   border-bottom: 2px solid #f1556c;
 }*/
 
+#vodia-identities-list .list-group-item:hover {
+  background-color: #dee2e6;
+}
+#vodia-identities-list .list-group-item td.color-block {
+    width: 50px;
+    height: 16px;
+    color: #fff;
+    vertical-align: top;
+    text-align: center;
+    border: 1px solid #fff;
+}
+
+#vodia-identities-list .list-group-item td.color-block-blue {
+  background-color: #4b88e4;
+}
+
+#vodia-identities-list .list-group-item td.color-block-green {
+  background-color: #25b343;
+}
+#vodia-identities-list .list-group-item td.color-block-pink {
+    background-color: #f672a7;
+}
+#vodia-identities-list .list-group-item td.color-block-black {
+  background-color: #000;
+}
+
+
 #topnav {
   box-shadow: 2px 2px 1px #a0a0a0;
 }

public/assets/js/xinon-vodia-identity.js

@@ -0,0 +1,147 @@
+/* Vodia Outbound Identity */
+
+var vodia_identity = null;
+
+getVodiaIdentity();
+
+async function getVodiaIdentity() {
+
+    if(!$("#vodia-identity-switcher .phone-icon").hasClass("fa-spin")) {
+        $("#vodia-identity-switcher .phone-icon").addClass("fa-spin text-warning");
+    }
+
+    var response = await fetch(baseurl + '/User/Api/do=getVodiaIdentity');
+    if (!response.ok) {
+        $("#vodia-identity-switcher a.phone-icon i").removeClass("fa-spin");
+        return false;
+    }
+    var resp_json = await response.json();
+    if(resp_json.status != "OK") {
+        console.error("Error getting Vodia Identity: " + resp_json.message);
+        $("#vodia-identity-switcher a.phone-icon i").removeClass("fa-spin");
+        return false;
+    }
+    vodia_identity = resp_json.result;
+
+    if(!("enabled" in vodia_identity) || !vodia_identity.enabled) {
+        $("#vodia-identity-switcher a.phone-icon i").removeClass("fa-spin");
+        return true;
+    }
+
+
+    var default_ident = vodia_identity.default;
+    var default_ident_number = vodia_identity.default_number;
+
+    var current_ident = vodia_identity.current;
+    var current_ident_number = current_ident.replace(" ", "");
+
+    var identities = vodia_identity.identities;
+
+    $("#vodia-identity-container").show();
+
+    if(default_ident_number == current_ident_number) {
+        $("#vodia-identity-current-text").text("Standard");
+        $("#vodia-identity-current-number").text("(" + default_ident + ")");
+        $("#vodia-identity-switcher").attr("title", "Standard (" + default_ident + ")");
+    } else {
+        ident_found = false;
+        for(const [ident_name, ident] of Object.entries(identities)) {
+            if(ident.number == current_ident_number) {
+                ident_found = true;
+                $("#vodia-identity-current-text").text(ident_name);
+                $("#vodia-identity-current-number").text("(" + ident.display + ")");
+                $("#vodia-identity-switcher").attr("title", ident_name + " (" + ident.display + ")");
+            }
+        }
+        if(!ident_found) {
+            $("#vodia-identity-current-number").text(vodia_identity.current);
+            $("#vodia-identity-switcher").attr("title", vodia_identity.current);
+        }
+    }
+
+
+    $("#vodia-identities-list").empty();
+
+    let item = addVodiaIdentityListItem(
+        default_ident_number,
+        default_ident_number,
+        "Xinon Eigene Durchwahl",
+        "blue"
+    );
+
+    if(default_ident_number == current_ident_number) {
+        $(item).addClass("bg-info text-white");
+        $(item).find(".text-block").addClass("text-white");
+        $(item).removeClass("pointer");
+    } else {
+        $(item).click(function () {
+            setVodiaOutboundIdentity(default_ident_number)
+        });
+    }
+
+
+    for(const [ident_name, ident] of Object.entries(identities)) {
+
+        let item = addVodiaIdentityListItem(
+            ident.number,
+            ident.display,
+            ident_name,
+            ident.color
+        );
+
+        if(ident.number == current_ident_number) {
+            $(item).addClass("bg-info text-white");
+            $(item).find(".text-block").addClass("text-white");
+            $(item).removeClass("pointer");
+        } else {
+            $(item).click(function () {
+                setVodiaOutboundIdentity(ident.number)
+            });
+        }
+    }
+
+    $("#vodia-identity-switcher .phone-icon").removeClass("text-warning fa-spin");
+    $("#vodia-identity-switcher .phone-icon").addClass("fa-bounce");
+    setTimeout(() => { $("#vodia-identity-switcher .phone-icon").removeClass("fa-bounce"); }, 800);
+
+}
+
+function addVodiaIdentityListItem(number, number_display, name, color) {
+    let tpl = $("#vodia-identity-list-item-template")[0].innerHTML;
+    item = $($.parseXML(tpl)).contents();
+
+    $(item).data("number", number);
+
+    $(item).find("td.color-block").addClass("color-block-" + color);
+    $(item).find("span.name").text(name);
+    $(item).find("span.number").text("(" + number_display + ")");
+
+    $("#vodia-identities-list").append(item);
+    return item;
+}
+
+async function setVodiaOutboundIdentity(number) {
+    $("#vodia-identity-switcher .phone-icon").addClass("fa-spin text-warning");
+
+    $("#vodia-identities-list").empty();
+    $("#vodia-identities-list").append("<img src='" + baseurl + "img/ajax-loader.gif' />");
+
+    var response = await fetch(baseurl + '/User/Api/do=setVodiaIdentity',{
+        method: 'POST',
+        body: new URLSearchParams({
+            'number': number
+        })
+    });
+    if (!response.ok) {
+        return false;
+    }
+    var resp_json = await response.json();
+    if(resp_json.status != "OK") {
+        console.error("Error setting Vodia Identity: " + resp_json.message);
+        notify.error("Fehler beim Setzen der Identität!");
+    }
+
+    getVodiaIdentity();
+
+    return true;
+}