AMelonInsideLemon/SpaceNinjaServer
1
0
Fork 0
forked from OpenWF/SpaceNinjaServer
Code Pull Requests Activity

feat(webui): light/dark theme selection (#2343)

Browse Source 
Closes #2093

Reviewed-on: OpenWF/SpaceNinjaServer#2343
Co-authored-by: Sainan <63328889+Sainan@users.noreply.github.com>
Co-committed-by: Sainan <63328889+Sainan@users.noreply.github.com>
This commit is contained in:
Sainan 2025-06-29 09:07:53 -07:00 committed by Sainan
parent 5234cf213e
commit d66f1c58d8
8 changed files with 62 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
static/webui/index.html
View File

@ -13,37 +13,38 @@
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
</button> </button>
<a class="navbar-brand">OpenWF WebUI</a> <a class="navbar-brand">OpenWF WebUI</a>
<ul class="navbar-nav ms-auto mb-0"> <div class="ms-auto nav-item dropdown">
<li class="nav-item dropdown"> <button id="active-lang-name" class="nav-link dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false"></button>
<button id="active-lang-name" class="nav-link dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false"></button> <ul class="dropdown-menu dropdown-menu-end">
<ul class="dropdown-menu dropdown-menu-end"> <li><a class="dropdown-item active" href="#" data-lang="en" onclick="event.preventDefault();setLanguage('en');">English</a></li>
<li><a class="dropdown-item active" href="#" data-lang="en" onclick="event.preventDefault();setLanguage('en');">English</a></li> <li><a class="dropdown-item" href="#" data-lang="de" onclick="event.preventDefault();setLanguage('de');">Deutsch</a></li>
<li><a class="dropdown-item" href="#" data-lang="de" onclick="event.preventDefault();setLanguage('de');">Deutsch</a></li> <li><a class="dropdown-item" href="#" data-lang="es" onclick="event.preventDefault();setLanguage('es');">Español</a></li>
<li><a class="dropdown-item" href="#" data-lang="es" onclick="event.preventDefault();setLanguage('es');">Español</a></li> <li><a class="dropdown-item" href="#" data-lang="fr" onclick="event.preventDefault();setLanguage('fr');">Français</a></li>
<li><a class="dropdown-item" href="#" data-lang="fr" onclick="event.preventDefault();setLanguage('fr');">Français</a></li> <li><a class="dropdown-item" href="#" data-lang="it" onclick="event.preventDefault();setLanguage('it');">Italiano</a></li>
<li><a class="dropdown-item" href="#" data-lang="it" onclick="event.preventDefault();setLanguage('it');">Italiano</a></li> <li><a class="dropdown-item" href="#" data-lang="ja" onclick="event.preventDefault();setLanguage('ja');">日本語</a></li>
<li><a class="dropdown-item" href="#" data-lang="ja" onclick="event.preventDefault();setLanguage('ja');">日本語</a></li> <li><a class="dropdown-item" href="#" data-lang="ko" onclick="event.preventDefault();setLanguage('ko');">한국어</a></li>
<li><a class="dropdown-item" href="#" data-lang="ko" onclick="event.preventDefault();setLanguage('ko');">한국어</a></li> <li><a class="dropdown-item" href="#" data-lang="pl" onclick="event.preventDefault();setLanguage('pl');">Polski</a></li>
<li><a class="dropdown-item" href="#" data-lang="pl" onclick="event.preventDefault();setLanguage('pl');">Polski</a></li> <li><a class="dropdown-item" href="#" data-lang="pt" onclick="event.preventDefault();setLanguage('pt');">Português</a></li>
<li><a class="dropdown-item" href="#" data-lang="pt" onclick="event.preventDefault();setLanguage('pt');">Português</a></li> <li><a class="dropdown-item" href="#" data-lang="ru" onclick="event.preventDefault();setLanguage('ru');">Русский</a></li>
<li><a class="dropdown-item" href="#" data-lang="ru" onclick="event.preventDefault();setLanguage('ru');">Русский</a></li> <li><a class="dropdown-item" href="#" data-lang="tr" onclick="event.preventDefault();setLanguage('tr');">Türkçe</a></li>
<li><a class="dropdown-item" href="#" data-lang="tr" onclick="event.preventDefault();setLanguage('tr');">Türkçe</a></li> <li><a class="dropdown-item" href="#" data-lang="uk" onclick="event.preventDefault();setLanguage('uk');">Українська</a></li>
<li><a class="dropdown-item" href="#" data-lang="uk" onclick="event.preventDefault();setLanguage('uk');">Українська</a></li> <li><a class="dropdown-item" href="#" data-lang="zh" onclick="event.preventDefault();setLanguage('zh');">简体中文</a></li>
<li><a class="dropdown-item" href="#" data-lang="zh" onclick="event.preventDefault();setLanguage('zh');">简体中文</a></li> <li><a class="dropdown-item" href="#" data-lang="tc" onclick="event.preventDefault();setLanguage('tc');">繁體中文</a></li>
<li><a class="dropdown-item" href="#" data-lang="tc" onclick="event.preventDefault();setLanguage('tc');">繁體中文</a></li> <li><a class="dropdown-item" href="#" data-lang="th" onclick="event.preventDefault();setLanguage('th');">แบบไทย</a></li>
<li><a class="dropdown-item" href="#" data-lang="th" onclick="event.preventDefault();setLanguage('th');">แบบไทย</a></li> <li><hr class="dropdown-divider"></li>
</ul> <li><a class="dropdown-item active" href="#" data-loc="theme_dark" data-theme="dark" onclick="event.preventDefault();setTheme('dark');"></a></li>
</li> <li><a class="dropdown-item" href="#" data-loc="theme_light" data-theme="light" onclick="event.preventDefault();setTheme('light');"></a></li>
<li class="nav-item dropdown user-dropdown"> </ul>
<button class="nav-link dropdown-toggle displayname" data-bs-toggle="dropdown" aria-expanded="false"></button> </div>
<ul class="dropdown-menu dropdown-menu-end"> <div class="nav-item dropdown user-dropdown">
<li><a class="dropdown-item" href="/webui/" onclick="doLogout();" data-loc="navbar_logout"></a></li> <button class="nav-link dropdown-toggle displayname" data-bs-toggle="dropdown" aria-expanded="false"></button>
<li><hr class="dropdown-divider"></li> <ul class="dropdown-menu dropdown-menu-end">
<li><a class="dropdown-item" href="#" onclick="event.preventDefault();renameAccount();" data-loc="navbar_renameAccount"></a></li> <li><a class="dropdown-item" href="/webui/" onclick="doLogout();" data-loc="navbar_logout"></a></li>
<li><a class="dropdown-item" href="#" onclick="event.preventDefault();deleteAccount();" data-loc="navbar_deleteAccount"></a></li> <li><hr class="dropdown-divider"></li>
</ul> <li><a class="dropdown-item" href="#" onclick="event.preventDefault();renameAccount();" data-loc="navbar_renameAccount"></a></li>
</li> <li><a class="dropdown-item" href="#" onclick="event.preventDefault();deleteAccount();" data-loc="navbar_deleteAccount"></a></li>
</ul> </ul>
</div>
</div> </div>
</nav> </nav>
<div class="container pt-3 pb-3" id="main-view"> <div class="container pt-3 pb-3" id="main-view">

12
static/webui/script.js
View File

@ -230,6 +230,18 @@ function setLanguage(lang) {
} }
} }
function setActiveTheme(theme) {
document.documentElement.setAttribute("data-bs-theme", theme);
document.querySelector("[data-theme].active").classList.remove("active");
document.querySelector("[data-theme=" + theme + "]").classList.add("active");
}
setActiveTheme(localStorage.getItem("theme") ?? "dark");
function setTheme(theme) {
setActiveTheme(theme);
localStorage.setItem("theme", theme);
}
const webUiModularWeapons = [ const webUiModularWeapons = [
"/Lotus/Weapons/Sentients/OperatorAmplifiers/OperatorAmpWeapon", "/Lotus/Weapons/Sentients/OperatorAmplifiers/OperatorAmpWeapon",
"/Lotus/Weapons/Ostron/Melee/LotusModularWeapon", "/Lotus/Weapons/Ostron/Melee/LotusModularWeapon",

3
static/webui/translations/de.js
View File

@ -291,5 +291,8 @@ dict = {
upgrade_SwiftExecute: `[UNTRANSLATED] Speed of Mercy Kills increased by 50%`, upgrade_SwiftExecute: `[UNTRANSLATED] Speed of Mercy Kills increased by 50%`,
upgrade_OnHackInvis: `[UNTRANSLATED] Invisible for 15 seconds after hacking`, upgrade_OnHackInvis: `[UNTRANSLATED] Invisible for 15 seconds after hacking`,
theme_dark: `[UNTRANSLATED] Dark Theme`,
theme_light: `[UNTRANSLATED] Light Theme`,
prettier_sucks_ass: `` prettier_sucks_ass: ``
}; };

3
static/webui/translations/en.js
View File

@ -290,5 +290,8 @@ dict = {
upgrade_SwiftExecute: `Speed of Mercy Kills increased by 50%`, upgrade_SwiftExecute: `Speed of Mercy Kills increased by 50%`,
upgrade_OnHackInvis: `Invisible for 15 seconds after hacking`, upgrade_OnHackInvis: `Invisible for 15 seconds after hacking`,
theme_dark: `Dark Theme`,
theme_light: `Light Theme`,
prettier_sucks_ass: `` prettier_sucks_ass: ``
}; };

3
static/webui/translations/es.js
View File

@ -291,5 +291,8 @@ dict = {
upgrade_SwiftExecute: `Velocidad de ejecuciones aumentada en un 50%`, upgrade_SwiftExecute: `Velocidad de ejecuciones aumentada en un 50%`,
upgrade_OnHackInvis: `Invisible durante 15 segundos después de hackear`, upgrade_OnHackInvis: `Invisible durante 15 segundos después de hackear`,
theme_dark: `[UNTRANSLATED] Dark Theme`,
theme_light: `[UNTRANSLATED] Light Theme`,
prettier_sucks_ass: `` prettier_sucks_ass: ``
}; };

3
static/webui/translations/fr.js
View File

@ -291,5 +291,8 @@ dict = {
upgrade_SwiftExecute: `Vitesse des miséricordes augmentée de 50%`, upgrade_SwiftExecute: `Vitesse des miséricordes augmentée de 50%`,
upgrade_OnHackInvis: `Invisible pendant 15 secondes après un piratage`, upgrade_OnHackInvis: `Invisible pendant 15 secondes après un piratage`,
theme_dark: `[UNTRANSLATED] Dark Theme`,
theme_light: `[UNTRANSLATED] Light Theme`,
prettier_sucks_ass: `` prettier_sucks_ass: ``
}; };

3
static/webui/translations/ru.js
View File

@ -291,5 +291,8 @@ dict = {
upgrade_SwiftExecute: `[UNTRANSLATED] Speed of Mercy Kills increased by 50%`, upgrade_SwiftExecute: `[UNTRANSLATED] Speed of Mercy Kills increased by 50%`,
upgrade_OnHackInvis: `[UNTRANSLATED] Invisible for 15 seconds after hacking`, upgrade_OnHackInvis: `[UNTRANSLATED] Invisible for 15 seconds after hacking`,
theme_dark: `[UNTRANSLATED] Dark Theme`,
theme_light: `[UNTRANSLATED] Light Theme`,
prettier_sucks_ass: `` prettier_sucks_ass: ``
}; };

3
static/webui/translations/zh.js
View File

@ -291,5 +291,8 @@ dict = {
upgrade_SwiftExecute: `怜悯之击速度提升50%`, upgrade_SwiftExecute: `怜悯之击速度提升50%`,
upgrade_OnHackInvis: `入侵后隐身15秒`, upgrade_OnHackInvis: `入侵后隐身15秒`,
theme_dark: `[UNTRANSLATED] Dark Theme`,
theme_light: `[UNTRANSLATED] Light Theme`,
prettier_sucks_ass: `` prettier_sucks_ass: ``
}; };