Init

resources/js/player-server-select.js

@@ -0,0 +1,45 @@
+
+export function serverSelectMenuItem(selectedIndex) {
+    return `
+    <button id="server-select" data-plyr="settings" type="button" class="plyr__control plyr__control--forward" role="menuitem" aria-haspopup="true">
+        <span>Server<span class="plyr__menu__value">CDN` + (selectedIndex + 1) + `</span></span>
+    </button>`;
+}
+
+export function serverSelectSubmenu(selectedIndex, serverCount) {
+    let htmlList = `
+        <div id="server-select-list" hidden>
+        <button type="button" class="plyr__control plyr__control--back" id="server-select-list-back-btn">
+            <span aria-hidden="true">Server</span><span class="plyr__sr-only">Go back to previous menu</span>
+        </button>
+        <div role="menu">
+    `;
+
+    for (let i = 0; i < serverCount; i++) {
+        let checked = selectedIndex == i ? 'true' : 'false';
+        let index = i + 1;
+        htmlList += `
+            <button data-plyr="server" type="button" role="menuitemradio" class="plyr__control change_server" aria-checked="` + checked + `" value="` + i +`">
+                <span>Server ` + index + `<span class="plyr__menu__value"><span class="plyr__badge">CDN` + index + `</span></span></span>
+            </button>
+        `;
+    }
+
+    htmlList += `
+        </div>
+    </div>
+    `;
+
+    return htmlList;
+}
+
+export function serverSelectMenuClickToggle() {
+    if (document.getElementById('server-select-list').hidden) {
+        document.querySelector('div[role="menu"]').hidden = true;
+        document.getElementById('server-select-list').hidden = false;
+        return;
+    }
+
+    document.getElementById('server-select-list').hidden = true;
+    document.querySelector('div[role="menu"]').hidden = false;
+}