add: ReZygisk WebUI (#73)

This commit adds the ReZygisk WebUI to ReZygisk.

Signed-off-by: Emulond Argent <108662981+Emulond@users.noreply.github.com>
Signed-off-by: WinCS <94188592+Meltartica@users.noreply.github.com>
Signed-off-by: Pedro.js <pedroolimpioguerra@gmail.com>
Signed-off-by: unexpected unresolved <minh15052008@gmail.com>
Signed-off-by: SheepChef <50871867+SheepChef@users.noreply.github.com>
Signed-off-by: AJleKcAHgP68 <78802768+AJleKcAHgP68@users.noreply.github.com>
Signed-off-by: Blazzycrafter <39300111+Blazzycrafter@users.noreply.github.com>
Signed-off-by: Igor <sorocean.igor@gmail.com>
Signed-off-by: unexpected unresolved <xeondev@xeondex.onmicrosoft.com>
Signed-off-by: Kirill Kuznetsov <kdevlab@yandex.ru>
Signed-off-by: Lucky Kiddos <95188840+GuitarHeroStyles@users.noreply.github.com>
Signed-off-by: Kitty <73357005+Kittyskj@users.noreply.github.com>
Signed-off-by: GhostFRR <ghost.game.fr@gmail.com>
Signed-off-by: Alice w/🌧️ <rainyxeon@gmail.com>
Signed-off-by: ＺＧＸ０８９ッ <159061718+ZG089@users.noreply.github.com>
Signed-off-by: thasave14 <93542339+thasave14@users.noreply.github.com>
Co-authored-by: ThePedroo <pedroolimpioguerra@gmail.com>
Co-authored-by: ExtremeXT <75576145+ExtremeXT@users.noreply.github.com>
Co-authored-by: Emulond Argent <108662981+Emulond@users.noreply.github.com>
Co-authored-by: RainyXeon <xeondev@xeondex.onmicrosoft.com>
Co-authored-by: Fyphen <fyphensub@gmail.com>
Co-authored-by: WinCS <94188592+Meltartica@users.noreply.github.com>
Co-authored-by: CaptainThrowback <captainthrowback@hotmail.com>
Co-authored-by: Kirill Kuznetsov <kdevlab@yandex.ru>
Co-authored-by: SheepChef <50871867+SheepChef@users.noreply.github.com>
Co-authored-by: AJleKcAHgP68 <78802768+AJleKcAHgP68@users.noreply.github.com>
Co-authored-by: Blazzycrafter <39300111+Blazzycrafter@users.noreply.github.com>
Co-authored-by: Igor <sorocean.igor@gmail.com>
Co-authored-by: Berlian Panca <53902591+bpanca05@users.noreply.github.com>
Co-authored-by: Willow Hayley Lovelace <65596971+dyingwillow@users.noreply.github.com>
Co-authored-by: witch <witch@dyingwillow.dev>
Co-authored-by: Lucky Kiddos <95188840+GuitarHeroStyles@users.noreply.github.com>
Co-authored-by: Kitty <73357005+Kittyskj@users.noreply.github.com>
Co-authored-by: GhostFRR <ghost.game.fr@gmail.com>
Co-authored-by: ＺＧＸ０８９ッ <159061718+ZG089@users.noreply.github.com>
Co-authored-by: thasave14 <93542339+thasave14@users.noreply.github.com>
Co-authored-by: Flopster101 <nahuelgomez329@gmail.com>
Co-authored-by: Lxchoooo <155797099+Lxchoooo@users.noreply.github.com>

webroot/js/smallPage/errorHistory.js

@@ -0,0 +1,47 @@
+import { smallPageDisabler } from '../smallPageDesabler.js'
+const panel = document.getElementById('errorh_panel')
+
+/* INFO: Event setup */
+const navbar_data_tag = document.getElementById('cache-navbar-previous')
+const small_panel_data_tag = document.getElementById('cache-page-small-previous')
+const fallback_open = document.getElementById('cache-fallback-open')
+
+document.getElementById('errorh_page_toggle').addEventListener('click', () => {
+  const previous = !navbar_data_tag.getAttribute('content') ? setData('home', small_panel_data_tag) : navbar_data_tag.getAttribute('content')
+  document.getElementById(`panel_${previous}`).classList.remove('show')
+  document.getElementById('small_panel_errorh').classList.toggle('show')
+  small_panel_data_tag.setAttribute('content', 'errorh')
+})
+
+document.getElementById('backport_errorh').addEventListener('click', () => {
+  const previous = !navbar_data_tag.getAttribute('content') ? setData('home', small_panel_data_tag) : navbar_data_tag.getAttribute('content')
+  document.getElementById(`panel_${previous}`).classList.remove('show')
+  document.getElementById('loading_screen').style.display = 'none'
+  document.getElementById('small_panel_errorh').classList.toggle('show')
+  document.getElementById('errorh_panel').style.bottom = '1em'
+  fallback_open.setAttribute('content', 'opened')
+  small_panel_data_tag.setAttribute('content', 'errorh')
+})
+
+document.getElementById('sp_errorh_close').addEventListener('click', () => {
+  const is_fallback = fallback_open.getAttribute('content')
+  if (is_fallback) {
+    document.getElementById('errorh_panel').style.bottom = '1em'
+    document.getElementById('loading_screen').style.display = 'flex'
+  }
+  smallPageDisabler('errorh', is_fallback ? 'home' : 'settings', is_fallback ? 'home' : null)
+})
+document.getElementById('errorh_copy').addEventListener('click', () => {
+  navigator.clipboard.writeText(panel.innerHTML)
+})
+
+document.getElementById('errorh_clear_all').addEventListener('click', () => {
+  panel.innerHTML = ''
+  localStorage.setItem('/system/error', '')
+})
+
+function setData(mode, tag) {
+  tag.setAttribute('content', mode)
+
+  return mode
+}

webroot/js/smallPage/language.js

@@ -0,0 +1,54 @@
+import { 
+  getTranslations, 
+  setNewLanguage,
+  getAvailableLanguages
+} from '../language.js'
+import { smallPageDisabler } from '../smallPageDesabler.js'
+
+/* INFO: Initial setup */
+let index = 0
+
+async function setAvailableLanguage() {
+  const availableLanguages = await getAvailableLanguages()
+
+  for (index; index < availableLanguages.length; index++) {
+    const langCode = availableLanguages[index]
+    const langData = await getTranslations(langCode)
+
+    document.getElementById('lang_modal_list').innerHTML += `
+    <div lang-data="${langCode}" class="dim card card_animation" style="padding: 25px 15px; cursor: pointer;">
+      <div lang-data="${langCode}" class="dimc" style="font-size: 1.1em;">${langData.langName}</div>
+    </div>
+    `
+  }
+}
+setAvailableLanguage()
+
+/* INFO: Event setup */
+const navbar_data_tag = document.getElementById('cache-navbar-previous')
+const small_panel_data_tag = document.getElementById('cache-page-small-previous')
+
+document.getElementById('lang_page_toggle').addEventListener('click', () => {
+  const previous = !navbar_data_tag.getAttribute('content') ? setData('home', small_panel_data_tag) : navbar_data_tag.getAttribute('content')
+  document.getElementById(`panel_${previous}`).classList.remove('show')
+  document.getElementById('small_panel_language').classList.toggle('show')
+  small_panel_data_tag.setAttribute('content', 'language')
+})
+
+document.getElementById('sp_lang_close').addEventListener('click', () => smallPageDisabler('language', 'settings'))
+
+document.addEventListener('click', async (event) => {
+  const getLangLocate = event.target.getAttribute('lang-data')
+  if (!getLangLocate || typeof getLangLocate !== 'string') return
+
+  smallPageDisabler('language', 'settings')
+  await setNewLanguage(getLangLocate)
+
+  localStorage.setItem('/system/language', getLangLocate)
+}, false)
+
+function setData(data, tag) {
+  tag.setAttribute('content', data)
+
+  return data
+}

webroot/js/smallPage/theme.js

@@ -0,0 +1,75 @@
+import { smallPageDisabler } from '../smallPageDesabler.js'
+import { setAmoled } from '../themes/amoled.js'
+import { setDark } from '../themes/dark.js'
+import { setLight } from '../themes/light.js'
+import { setMonochrome } from '../themes/monochrome.js'
+
+// INFO: requirement variables
+let sys_theme
+const page_toggle = document.getElementById('theme_page_toggle')
+const themeList = {
+  amoled: () => setAmoled(true),
+  dark: () => setDark(true),
+  light: () => setLight(true),
+  monochrome: () => setMonochrome(true),
+  system: (unavaliable) => {
+    const isDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
+    if (isDark && unavaliable) setDark() 
+    else setLight()
+  },
+}
+const setData = (mode) => {
+  localStorage.setItem('/system/theme', mode)
+  return mode
+}
+
+// INFO: Initial open logic
+sys_theme = localStorage.getItem('/system/theme')
+if (!sys_theme) sys_theme = setData('dark')
+themeList[sys_theme](true)
+
+// INFO: Event logic
+const navbar_data_tag = document.getElementById('cache-navbar-previous')
+const small_panel_data_tag = document.getElementById('cache-page-small-previous')
+
+document.getElementById('sp_theme_close').addEventListener('click', () => smallPageDisabler('theme', 'settings'))
+
+document.addEventListener('click', async (event) => {
+  const themeListKey = Object.keys(themeList)
+  const getThemeMode = event.target.getAttribute('theme-data')
+
+  if (!getThemeMode || typeof getThemeMode !== 'string' || !themeListKey.includes(getThemeMode)) return
+
+  themeList[getThemeMode](true)
+
+  smallPageDisabler('theme', 'settings')
+
+  sys_theme = setData(getThemeMode)
+}, false)
+
+page_toggle.addEventListener('click', () => {
+  const previous = !navbar_data_tag.getAttribute('content') ? setTagData('home', small_panel_data_tag) : navbar_data_tag.getAttribute('content')
+  document.getElementById(`panel_${previous}`).classList.remove('show')
+  document.getElementById('small_panel_theme').classList.toggle('show')
+    small_panel_data_tag.setAttribute('content', 'theme')
+})
+
+window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
+  if (sys_theme !== "system") return
+  const newColorScheme = event.matches ? "dark" : "light";
+
+  switch (newColorScheme) {
+    case 'dark':
+      setDark()
+      break
+    case 'light':
+      setLight()
+      break
+  }
+});
+
+function setTagData(data, tag) {
+  tag.setAttribute('content', data)
+
+  return data
+}