many updates

html/js/base_ts.js

@@ -6,6 +6,7 @@ var UNDO = new Object();
 var SERVER_CONNECTION = false;
 var WS_AVAILABLE = false;
 var ACTIVE_MENU_ID = "";
+var LAST_FOCUSED_ELEMENT = null;
 // Menü
 var menuItems = new Array();
 menuItems.push(new MainMenuItem("playlist", "{{.mainMenu.item.playlist}}", "m3u.png", "{{.mainMenu.headline.playlist}}"));
@@ -19,7 +20,7 @@ menuItems.push(new MainMenuItem("log", "{{.mainMenu.item.log}}", "log.png", "{{.
 menuItems.push(new MainMenuItem("logout", "{{.mainMenu.item.logout}}", "logout.png", "{{.mainMenu.headline.logout}}"));
 // Kategorien für die Einstellungen
 var settingsCategory = new Array();
-settingsCategory.push(new SettingsCategoryItem("{{.settings.category.general}}", "xteveAutoUpdate,tuner,epgSource,api"));
+settingsCategory.push(new SettingsCategoryItem("{{.settings.category.general}}", "xteveAutoUpdate,tuner,epgSource,api,use_plexAPI,plex.url,plex.token"));
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.files}}", "update,files.update,temp.path,cache.images,xepg.replace.missing.images"));
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.streaming}}", "buffer,udpxy,buffer.size.kb,buffer.timeout,user.agent,ffmpeg.path,ffmpeg.options,vlc.path,vlc.options"));
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.backup}}", "backup.path,backup.keep"));
@@ -50,6 +51,42 @@ function showElement(elmID, type) {
         return;
     }
     element.className = cssClass;
+    element.setAttribute("aria-hidden", type == true ? "false" : "true");
+    if (elmID == "loading" && document.body != null) {
+        document.body.setAttribute("aria-busy", type == true ? "true" : "false");
+    }
+    if (elmID == "popup") {
+        var popupContent_1 = document.getElementById("popup-custom");
+        if (type == true) {
+            LAST_FOCUSED_ELEMENT = document.activeElement;
+            if (popupContent_1 != null) {
+                setTimeout(function () {
+                    popupContent_1.focus();
+                }, 20);
+            }
+        }
+        else {
+            if (LAST_FOCUSED_ELEMENT != null && LAST_FOCUSED_ELEMENT.focus != undefined) {
+                setTimeout(function () {
+                    LAST_FOCUSED_ELEMENT.focus();
+                }, 20);
+            }
+            LAST_FOCUSED_ELEMENT = null;
+        }
+    }
+}
+function announceToScreenReader(message) {
+    if (message == undefined || message.length == 0) {
+        return;
+    }
+    var region = document.getElementById("sr-announcer");
+    if (region == null) {
+        return;
+    }
+    region.innerText = "";
+    setTimeout(function () {
+        region.innerText = message;
+    }, 20);
 }
 function setConnectionState(state, text) {
     var label = text;
@@ -75,6 +112,8 @@ function setConnectionState(state, text) {
     }
     indicator.className = "status-" + state;
     indicator.innerText = label;
+    indicator.setAttribute("aria-label", "Connection status: " + label);
+    announceToScreenReader("Connection status " + label);
 }
 function changeButtonAction(element, buttonID, attribute) {
     var value = element.options[element.selectedIndex].value;
@@ -190,15 +229,29 @@ function sortTable(column) {
     var table = document.getElementById("content_table");
     var tableHead = table.getElementsByTagName("TR")[0];
     var tableItems = tableHead.getElementsByTagName("TD");
+    for (var h = 0; h < tableItems.length; h++) {
+        if (tableItems[h].getAttribute("role") == "columnheader") {
+            tableItems[h].setAttribute("aria-sort", "none");
+        }
+    }
     var sortObj = new Object();
     var x, xValue;
     var tableHeader;
     var sortByString = false;
     if (column > 0 && COLUMN_TO_SORT > 0) {
-        tableItems[COLUMN_TO_SORT].className = "pointer";
-        tableItems[column].className = "sortThis";
+        tableItems[COLUMN_TO_SORT].classList.remove("sortThis");
+        tableItems[COLUMN_TO_SORT].classList.add("pointer");
+        tableItems[column].classList.remove("pointer");
+        tableItems[column].classList.add("sortThis");
     }
     COLUMN_TO_SORT = column;
+    var mobileSort = document.getElementById("mapping-sort-mobile");
+    if (mobileSort != null && (column == 1 || column == 3 || column == 4 || column == 5)) {
+        mobileSort.value = column.toString();
+    }
+    if (tableItems[column] != undefined && tableItems[column].getAttribute("role") == "columnheader") {
+        tableItems[column].setAttribute("aria-sort", "ascending");
+    }
     var rows = table.rows;
     if (rows[1] != undefined) {
         tableHeader = rows[0];
@@ -258,6 +311,7 @@ function createSearchObj() {
     var channels = getObjKeys(data);
     var channelKeys = ["x-active", "x-channelID", "x-name", "_file.m3u.name", "x-group-title", "x-xmltv-file"];
     channels.forEach(function (id) {
+        SEARCH_MAPPING[id] = "";
         channelKeys.forEach(function (key) {
             if (key == "x-active") {
                 switch (data[id][key]) {
@@ -290,6 +344,9 @@ function searchInMapping() {
     for (var i = 1; i < trs.length; ++i) {
         var id = trs[i].getAttribute("id");
         var element = SEARCH_MAPPING[id];
+        if (element == undefined) {
+            continue;
+        }
         switch (element.toLowerCase().includes(searchValue.toLowerCase())) {
             case true:
                 document.getElementById(id).style.display = "";
@@ -299,6 +356,7 @@ function searchInMapping() {
                 break;
         }
     }
+    announceToScreenReader("Search updated");
     return;
 }
 function calculateWrapperHeight() {