opt: reduce code

This commit is contained in:
KOWX712
2025-03-02 04:06:17 +08:00
parent 93e2e8c8ba
commit c20e8cde1f
15 changed files with 156 additions and 343 deletions

View File

@@ -144,119 +144,85 @@
</template> </template>
<!-- Help Overlay --> <!-- Help Overlay -->
<div id="help-overlay" class="help-overlay"> <div id="help-overlay" class="help-overlay overlay">
<div class="help-menu"> <div class="help-menu">
<button id="close-help" class="close-help">&#x2715;</button> <button id="close-help" class="close-btn">&#x2715;</button>
<div class="help-content"> <div class="help-content">
<p data-i18n="help.help_instructions"></p> <div class="help-content-header" data-i18n="help.help_instructions"></div>
<ul id="helpList"> <div class="instruction">
<li id="save_and_update_button"> <strong data-i18n="help.save_and_update"></strong>
<strong data-i18n="help.save_and_update"></strong> <p data-i18n="help.save_and_update_description"></p>
<ul> </div>
<li data-i18n="help.save_and_update_description"></li> <div class="instruction">
</ul> <strong data-i18n="help.refresh"></strong>
</li> <p data-i18n="help.refresh_description"></p>
<br> </div>
<li id="refresh"> <div class="instruction">
<strong data-i18n="help.refresh"></strong> <strong data-i18n="help.select_deselect"></strong>
<ul> <p data-i18n="help.select_description"></p>
<li data-i18n="help.refresh_description"></li> </div>
</ul> <div class="instruction">
</li> <strong data-i18n="help.select_denylist"></strong>
<br> <p data-i18n="help.select_denylist_description"></p>
<li id="select_deselect"> </div>
<strong data-i18n="help.select_deselect"></strong> <div class="instruction">
<ul> <strong data-i18n="help.deselect_unnecessary"></strong>
<li data-i18n="help.select_description"></li> <p data-i18n="help.deselect_unnecessary_description"></p>
</ul> </div>
</li> <div class="instruction">
<br> <strong data-i18n="help.add_system_app"></strong>
<li id="select_denylist"> <p data-i18n="help.add_system_app_description"></p>
<strong data-i18n="help.select_denylist"></strong> </div>
<ul> <div class="instruction">
<li data-i18n="help.select_denylist_description"></li> <strong data-i18n="help.set_keybox"></strong>
</ul> <p data-i18n="help.set_keybox_description"></p>
</li> </div>
<br> <div class="instruction">
<li id="deselect_unnecessary"> <strong data-i18n="help.set_custom_keybox"></strong>
<strong data-i18n="help.deselect_unnecessary"></strong> <p data-i18n="help.set_custom_keybox_description"></p>
<ul> </div>
<li data-i18n="help.deselect_unnecessary_description"></li> <div class="instruction">
</ul> <strong data-i18n="help.set_security_patch"></strong>
</li> <p data-i18n="help.set_security_patch_description"></p>
<br> </div>
<li id="add_system_app"> <div class="instruction">
<strong data-i18n="help.add_system_app"></strong> <strong data-i18n="help.set_verified_boot_hash"></strong>
<ul> <p data-i18n="help.set_verified_boot_hash_description"></p>
<li data-i18n="help.add_system_app_description"></li> </div>
</ul>
</li>
<br>
<li id="set_keybox">
<strong data-i18n="help.set_keybox"></strong>
<ul>
<li data-i18n="help.set_keybox_description"></li>
</ul>
</li>
<br>
<li id="set_custom_keybox">
<strong data-i18n="help.set_custom_keybox"></strong>
<ul>
<li data-i18n="help.set_custom_keybox_description"></li>
</ul>
</li>
<br>
<li id="set_security_patch">
<strong data-i18n="help.set_security_patch"></strong>
<ul>
<li data-i18n="help.set_security_patch_description"></li>
</ul>
</li>
<br>
<li id="set_verified_boot_hash">
<strong data-i18n="help.set_verified_boot_hash"></strong>
<ul>
<li data-i18n="help.set_verified_boot_hash_description"></li>
</ul>
</li>
<br>
</ul>
</div> </div>
</div> </div>
</div> </div>
<!-- BootHash Input Overlay --> <!-- BootHash Input Overlay -->
<div id="boot-hash-overlay" class="boot-hash-overlay"></div> <div id="boot-hash-overlay" class="boot-hash-overlay overlay">
<div id="boot-hash-card" class="boot-hash-card"> <div id="boot-hash-card" class="boot-hash-card">
<div class="boot-hash-title" data-i18n="boot_hash.title"></div> <div class="boot-hash-title" data-i18n="boot_hash.title"></div>
<textarea id="boot-hash-input" class="boot-hash-input" placeholder="Paste your verified Boot Hash here" data-i18n="boot_hash.input_placeholder" oninput="window.trimInput(this)"></textarea> <textarea id="boot-hash-input" class="boot-hash-input" placeholder="Paste your verified Boot Hash here" data-i18n="boot_hash.input_placeholder" oninput="window.trimInput(this)"></textarea>
<button id="boot-hash-save-button" class="boot-hash-save-button ripple-element" data-i18n="boot_hash.save_button"></button> <button id="boot-hash-save-button" class="boot-hash-save-button ripple-element" data-i18n="boot_hash.save_button"></button>
</div>
</div> </div>
<!-- About Overlay --> <!-- About Overlay -->
<div id="about-overlay" class="about-overlay"> <div id="about-overlay" class="about-overlay overlay">
<div id="about-menu" class="about-menu"> <div class="about-menu">
<button id="close-about" class="close-about">&#x2715;</button> <button id="close-about" class="close-btn">&#x2715;</button>
<div class="about-content"> <div class="about-title">
<p id="module_name_line1" data-i18n="about.module_name_line1"></p> <p id="module_name_line1" data-i18n="about.module_name_line1"></p>
<p id="module_name_line2" data-i18n="about.module_name_line2"></p> <p id="module_name_line2" data-i18n="about.module_name_line2"></p>
<p><span id="authored" data-i18n="about.by"></span> KOWX712</p> <p><span id="authored" data-i18n="about.by"></span> KOWX712</p>
<br> </div>
<p id="disclaimer" data-i18n="about.disclaimer"></p> <div id="disclaimer" data-i18n="about.disclaimer"></div>
<br> <div class="link">
<p> <i class="link-icon ripple-element" id="telegram" aria-hidden="true">
<div class="link"> <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 496 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M248 8C111 8 0 119 0 256S111 504 248 504 496 393 496 256 385 8 248 8zM363 176.7c-3.7 39.2-19.9 134.4-28.1 178.3-3.5 18.6-10.3 24.8-16.9 25.4-14.4 1.3-25.3-9.5-39.3-18.7-21.8-14.3-34.2-23.2-55.3-37.2-24.5-16.1-8.6-25 5.3-39.5 3.7-3.8 67.1-61.5 68.3-66.7 .2-.7 .3-3.1-1.2-4.4s-3.6-.8-5.1-.5q-3.3 .7-104.6 69.1-14.8 10.2-26.9 9.9c-8.9-.2-25.9-5-38.6-9.1-15.5-5-27.9-7.7-26.8-16.3q.8-6.7 18.5-13.7 108.4-47.2 144.6-62.3c68.9-28.6 83.2-33.6 92.5-33.8 2.1 0 6.6 .5 9.6 2.9a10.5 10.5 0 0 1 3.5 6.7A43.8 43.8 0 0 1 363 176.7z"/></svg>
<i class="link-icon ripple-element" id="telegram" aria-hidden="true"> <span id="link-text" data-i18n="about.telegram_channel"></span>
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 496 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M248 8C111 8 0 119 0 256S111 504 248 504 496 393 496 256 385 8 248 8zM363 176.7c-3.7 39.2-19.9 134.4-28.1 178.3-3.5 18.6-10.3 24.8-16.9 25.4-14.4 1.3-25.3-9.5-39.3-18.7-21.8-14.3-34.2-23.2-55.3-37.2-24.5-16.1-8.6-25 5.3-39.5 3.7-3.8 67.1-61.5 68.3-66.7 .2-.7 .3-3.1-1.2-4.4s-3.6-.8-5.1-.5q-3.3 .7-104.6 69.1-14.8 10.2-26.9 9.9c-8.9-.2-25.9-5-38.6-9.1-15.5-5-27.9-7.7-26.8-16.3q.8-6.7 18.5-13.7 108.4-47.2 144.6-62.3c68.9-28.6 83.2-33.6 92.5-33.8 2.1 0 6.6 .5 9.6 2.9a10.5 10.5 0 0 1 3.5 6.7A43.8 43.8 0 0 1 363 176.7z"/></svg> </i>
<span id="link-text" data-i18n="about.telegram_channel"></span> <i class="link-icon ripple-element" id="github" aria-hidden="true">
</i> <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 496 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg>
<i class="link-icon ripple-element" id="github" aria-hidden="true"> <span id="link-text" data-i18n="about.github"></span>
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 496 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg> </i>
<span id="link-text" data-i18n="about.github"></span> </div>
</i> <div class="acknowledgment">
</div>
</p>
<br>
<p id="acknowledgment" data-i18n="about.acknowledgment"></p> <p id="acknowledgment" data-i18n="about.acknowledgment"></p>
<p>j-hc/zygisk-detach: WebUI template</p> <p>j-hc/zygisk-detach: WebUI template</p>
<p>markedjs/marked: Markdown Support</p> <p>markedjs/marked: Markdown Support</p>
@@ -265,9 +231,9 @@
</div> </div>
<!-- Update Overlay --> <!-- Update Overlay -->
<div class="update-overlay"> <div class="update-overlay overlay">
<div class="update-menu"> <div class="update-menu">
<button class="close-update">&#x2715;</button> <button id="close-update" class="close-btn">&#x2715;</button>
<div class="update-content"> <div class="update-content">
<h1 data-i18n="update.changelog"></h1> <h1 data-i18n="update.changelog"></h1>
<div class="changelog"></div> <div class="changelog"></div>
@@ -280,7 +246,7 @@
</div> </div>
<!-- MMRL Permission Request Overlay --> <!-- MMRL Permission Request Overlay -->
<div id="permission-popup" class="permission-popup hidden"> <div id="permission-popup" class="permission-popup overlay">
<div class="permission-content"> <div class="permission-content">
<h2 id="permission-title">Please allow JavaScript API in MMRL settings</h2> <h2 id="permission-title">Please allow JavaScript API in MMRL settings</h2>
<div class="permission-steps"> <div class="permission-steps">
@@ -294,11 +260,11 @@
</div> </div>
<!-- File Selector Overlay --> <!-- File Selector Overlay -->
<div class="file-selector-overlay"> <div class="file-selector-overlay overlay">
<div class="file-selector"> <div class="file-selector">
<div class="file-selector-header"> <div class="file-selector-header">
<button class="back-button"> <button class="back-button">
<svg xmlns="http://www.w3.org/2000/svg" height="22px" viewBox="40 -1000 900 960" width="22px"><path d="M400-93.85 13.85-480 400-866.15l56.77 56.77L127.38-480l329.39 329.38L400-93.85Z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" height="22px" viewBox="40 -1050 900 960" width="22px"><path d="M400-93.85 13.85-480 400-866.15l56.77 56.77L127.38-480l329.39 329.38L400-93.85Z"/></svg>
</button> </button>
<div class="current-path">/storage/emulated/0/Download</div> <div class="current-path">/storage/emulated/0/Download</div>
<button class="close-selector">&#x2715;</button> <button class="close-selector">&#x2715;</button>
@@ -308,7 +274,7 @@
</div> </div>
<!-- Security Patch Overlay --> <!-- Security Patch Overlay -->
<div id="security-patch-overlay" class="security-patch-overlay"> <div id="security-patch-overlay" class="security-patch-overlay overlay">
<div id="security-patch-card" class="security-patch-card"> <div id="security-patch-card" class="security-patch-card">
<div class="security-patch-header" data-i18n="security_patch.title"></div> <div class="security-patch-header" data-i18n="security_patch.title"></div>
<div class="security-patch-content"> <div class="security-patch-content">
@@ -358,7 +324,7 @@
</div> </div>
<!-- Add System App Overlay --> <!-- Add System App Overlay -->
<div id="add-system-app-overlay" class="add-system-app-overlay"> <div id="add-system-app-overlay" class="add-system-app-overlay overlay">
<div id="add-system-app-card" class="add-system-app-card"> <div id="add-system-app-card" class="add-system-app-card">
<div class="add-system-app-title" data-i18n="add_system_app.title"></div> <div class="add-system-app-title" data-i18n="add_system_app.title"></div>
<div class="add-system-app-content"> <div class="add-system-app-content">

View File

@@ -6,35 +6,27 @@ const githubLink = document.getElementById('github');
// Function to show about overlay // Function to show about overlay
document.getElementById("about").addEventListener("click", () => { document.getElementById("about").addEventListener("click", () => {
const aboutOverlay = document.getElementById('about-overlay'); const aboutOverlay = document.getElementById('about-overlay');
const aboutMenu = document.getElementById('about-menu');
const closeAbout = document.getElementById('close-about'); const closeAbout = document.getElementById('close-about');
const showMenu = () => {
aboutOverlay.style.display = 'flex'; // Show about menu
setTimeout(() => { document.body.classList.add("no-scroll");
aboutOverlay.style.opacity = '1'; aboutOverlay.style.display = 'flex';
aboutMenu.style.opacity = '1'; setTimeout(() => {
}, 10); aboutOverlay.style.opacity = '1';
document.body.style.overflow = 'hidden'; }, 10);
};
const hideMenu = () => { const hideMenu = () => {
document.body.classList.remove("no-scroll");
aboutOverlay.style.opacity = '0'; aboutOverlay.style.opacity = '0';
aboutMenu.style.opacity = '0';
setTimeout(() => { setTimeout(() => {
aboutOverlay.style.display = 'none'; aboutOverlay.style.display = 'none';
document.body.style.overflow = 'auto';
}, 200); }, 200);
}; };
showMenu();
closeAbout.addEventListener('click', (event) => { closeAbout.addEventListener("click", hideMenu);
event.stopPropagation();
hideMenu();
});
aboutOverlay.addEventListener('click', (event) => { aboutOverlay.addEventListener('click', (event) => {
if (!aboutMenu.contains(event.target)) { if (event.target === aboutOverlay) hideMenu();
hideMenu();
}
}); });
menu.addEventListener('click', (event) => event.stopPropagation());
}); });
// Event listener for link redirect // Event listener for link redirect

View File

@@ -1,7 +1,6 @@
import { execCommand, showPrompt } from './main.js'; import { execCommand, showPrompt } from './main.js';
const bootHashOverlay = document.getElementById('boot-hash-overlay'); const bootHashOverlay = document.getElementById('boot-hash-overlay');
const card = document.getElementById('boot-hash-card');
const inputBox = document.getElementById('boot-hash-input'); const inputBox = document.getElementById('boot-hash-input');
const saveButton = document.getElementById('boot-hash-save-button'); const saveButton = document.getElementById('boot-hash-save-button');
@@ -12,25 +11,20 @@ window.trimInput = (input) => {
// Function to handle Verified Boot Hash // Function to handle Verified Boot Hash
document.getElementById("boot-hash").addEventListener("click", async () => { document.getElementById("boot-hash").addEventListener("click", async () => {
const showCard = () => { // Display boot hash menu
bootHashOverlay.style.display = "flex"; document.body.classList.add("no-scroll");
card.style.display = "flex"; bootHashOverlay.style.display = "flex";
requestAnimationFrame(() => { setTimeout(() => {
bootHashOverlay.classList.add("show"); bootHashOverlay.style.opacity = 1;
card.classList.add("show"); }, 10);
});
document.body.style.overflow = "hidden"; const closeBootHashMenu = () => {
}; document.body.classList.remove("no-scroll");
const closeCard = () => { bootHashOverlay.style.opacity = 0;
bootHashOverlay.classList.remove("show");
card.classList.remove("show");
setTimeout(() => { setTimeout(() => {
bootHashOverlay.style.display = "none"; bootHashOverlay.style.display = "none";
card.style.display = "none";
document.body.style.overflow = "auto";
}, 200); }, 200);
}; };
showCard();
try { try {
const bootHashContent = await execCommand("cat /data/adb/boot_hash"); const bootHashContent = await execCommand("cat /data/adb/boot_hash");
const validHash = bootHashContent const validHash = bootHashContent
@@ -50,14 +44,14 @@ document.getElementById("boot-hash").addEventListener("click", async () => {
resetprop -n ro.boot.vbmeta.digest ${inputValue} resetprop -n ro.boot.vbmeta.digest ${inputValue}
`); `);
showPrompt("prompt.boot_hash_set"); showPrompt("prompt.boot_hash_set");
closeCard(); closeBootHashMenu();
} catch (error) { } catch (error) {
console.error("Failed to update boot_hash:", error); console.error("Failed to update boot_hash:", error);
showPrompt("prompt.boot_hash_set_error", false); showPrompt("prompt.boot_hash_set_error", false);
} }
}); });
bootHashOverlay.addEventListener("click", (event) => { bootHashOverlay.addEventListener("click", (event) => {
if (event.target === bootHashOverlay) closeCard(); if (event.target === bootHashOverlay) closeBootHashMenu();
}); });
// Enter to save // Enter to save

View File

@@ -1,21 +1,18 @@
const helpButton = document.getElementById('help-button'); const helpButton = document.getElementById('help-button');
const helpOverlay = document.getElementById('help-overlay'); const helpOverlay = document.getElementById('help-overlay');
const closeHelp = document.getElementById('close-help'); const closeHelp = document.getElementById('close-help');
const helpList = document.getElementById('help-list');
// Open help menu // Open help menu
helpButton.addEventListener("click", () => { helpButton.addEventListener("click", () => {
helpOverlay.classList.remove("hide");
helpOverlay.style.display = "flex";
requestAnimationFrame(() => {
helpOverlay.classList.add("show");
});
document.body.classList.add("no-scroll"); document.body.classList.add("no-scroll");
helpOverlay.style.display = "flex";
setTimeout(() => {
helpOverlay.style.opacity = 1;
}, 10);
}); });
const hideHelpOverlay = () => { const hideHelpOverlay = () => {
helpOverlay.classList.remove("show"); helpOverlay.style.opacity = 0;
helpOverlay.classList.add("hide");
document.body.classList.remove("no-scroll"); document.body.classList.remove("no-scroll");
setTimeout(() => { setTimeout(() => {
helpOverlay.style.display = "none"; helpOverlay.style.display = "none";

View File

@@ -214,7 +214,7 @@ async function checkMMRL() {
MMRL_API = true; MMRL_API = true;
} catch (error) { } catch (error) {
console.error('Permission check failed:', error); console.error('Permission check failed:', error);
permissionPopup.classList.remove('hidden'); permissionPopup.style.display('flex');
MMRL_API = false; MMRL_API = false;
} }
} }

View File

@@ -234,9 +234,11 @@ document.getElementById("validkb").addEventListener("click", async () => {
}); });
}); });
// File selector
const fileSelector = document.querySelector('.file-selector-overlay'); const fileSelector = document.querySelector('.file-selector-overlay');
let currentPath = '/storage/emulated/0/Download'; let currentPath = '/storage/emulated/0/Download';
// Function to display file in current path
function updateCurrentPath() { function updateCurrentPath() {
const currentPathElement = document.querySelector('.current-path'); const currentPathElement = document.querySelector('.current-path');
const segments = currentPath.split('/').filter(Boolean); const segments = currentPath.split('/').filter(Boolean);
@@ -281,17 +283,8 @@ async function listFiles(path, skipAnimation = false) {
<span>..</span> <span>..</span>
`; `;
backItem.addEventListener('click', async () => { backItem.addEventListener('click', async () => {
currentPath = currentPath.split('/').slice(0, -1).join('/'); document.querySelector('.back-button').click();
if (currentPath === '') currentPath = '/storage/emulated/0';
const currentPathElement = document.querySelector('.current-path');
currentPathElement.innerHTML = currentPath.split('/').filter(Boolean).join('<span class="separator"></span>');
currentPathElement.scrollTo({
left: currentPathElement.scrollWidth,
behavior: 'smooth'
});
await listFiles(currentPath);
}); });
fileList.appendChild(backItem); fileList.appendChild(backItem);
} }
items.forEach(item => { items.forEach(item => {

View File

@@ -3,7 +3,7 @@ import { updateCard } from './applist.js';
const updateCardText = document.getElementById('redirect-to-release'); const updateCardText = document.getElementById('redirect-to-release');
const UpdateMenu = document.querySelector('.update-overlay'); const UpdateMenu = document.querySelector('.update-overlay');
const closeUpdate = document.querySelector('.close-update'); const closeUpdate = document.getElementById('close-update');
const releaseNotes = document.querySelector('.changelog'); const releaseNotes = document.querySelector('.changelog');
const installButton = document.querySelector('.install'); const installButton = document.querySelector('.install');
const rebootButton = document.querySelector('.reboot'); const rebootButton = document.querySelector('.reboot');

View File

@@ -1,53 +1,24 @@
.about-overlay { .about-overlay {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1100; z-index: 1100;
display: none;
justify-content: center;
align-items: center; align-items: center;
opacity: 0;
transition: opacity 0.2s ease;
} }
.about-menu { .about-menu {
position: fixed; position: relative;
top: 50%; width: calc(90vw - 60px);
left: 50%;
width: 90vw;
max-width: 800px; max-width: 800px;
transform: translate(-50%, -50%);
background: #fff; background: #fff;
border-radius: 15px; border-radius: 15px;
padding: 30px 0; padding: 30px;
z-index: 1200;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
z-index: 1200;
opacity: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 15px; gap: 15px;
transition: opacity 0.2s ease;
}
.close-about {
position: absolute;
top: 15px;
right: 12px;
background: none;
border: none;
font-size: 18px;
color: #ccc;
user-select: none;
} }
.link, .link,
.about-content p { .about-menu p {
margin: 0; margin: 0;
padding: 0 30px;
font-size: 16px; font-size: 16px;
text-align: left; text-align: left;
} }
@@ -69,11 +40,8 @@
#disclaimer { #disclaimer {
font-family: serif; font-family: serif;
width: calc(100% - 80px); width: calc(100% - 20px);
padding: 8px 10px; padding: 8px 10px;
left: 0;
right: 0;
margin: auto;
border-radius: 10px; border-radius: 10px;
background-color: #F5F5F5; background-color: #F5F5F5;
} }

View File

@@ -43,18 +43,8 @@
} }
.update-overlay { .update-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1800; z-index: 1800;
justify-content: center;
align-items: center; align-items: center;
opacity: 0;
transition: opacity 0.2s ease;
} }
.update-menu { .update-menu {
@@ -65,18 +55,7 @@
padding: 30px; padding: 30px;
border-radius: 15px; border-radius: 15px;
text-align: left; text-align: left;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
transition: opacity 0.2s ease;
}
.close-update {
position: absolute;
top: 15px;
right: 12px;
background: none;
border: none;
font-size: 20px;
color: #ccc;
} }
.update-content h3 { .update-content h3 {

View File

@@ -1,45 +1,20 @@
.boot-hash-overlay { .boot-hash-overlay {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1200; z-index: 1200;
justify-content: center;
align-items: center;
opacity: 0;
visibility: hidden;
transition: opacity 0.2s ease, visibility 0.2s ease;
} }
.boot-hash-card { .boot-hash-card {
position: fixed; position: fixed;
top: 10%; top: 10%;
left: 50%;
transform: translateX(-50%);
width: calc(90% - 60px); width: calc(90% - 60px);
max-width: 300px; max-width: 300px;
height: fit-content;
background-color: #fff; background-color: #fff;
border-radius: 18px; border-radius: 18px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
z-index: 1200;
padding: 30px; padding: 30px;
display: none; display: flex;
flex-direction: column; flex-direction: column;
gap: 15px; gap: 15px;
opacity: 0;
transition: opacity 0.2s ease;
}
.boot-hash-overlay.show {
visibility: visible;
opacity: 1;
}
.boot-hash-card.show {
display: flex;
opacity: 1;
} }
.boot-hash-title { .boot-hash-title {

View File

@@ -21,6 +21,7 @@
border-radius: 15px; border-radius: 15px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
overflow: hidden; overflow: hidden;
} }
@@ -55,7 +56,7 @@
border: none; border: none;
font-size: 20px; font-size: 20px;
color: #ccc; color: #ccc;
padding: 5px; padding: 0 5px;
} }
.file-list { .file-list {
@@ -83,7 +84,7 @@
.file-item svg { .file-item svg {
margin-right: 10px; margin-right: 10px;
fill: #6E6E6E; fill: #ccc;
} }
.file-item span { .file-item span {
@@ -114,8 +115,4 @@
.back-button { .back-button {
fill: #C2C2C2; fill: #C2C2C2;
} }
.file-item svg {
fill: #C2C2C2;
}
} }

View File

@@ -35,6 +35,30 @@ body {
pointer-events: auto; pointer-events: auto;
} }
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.5);
display: none;
justify-content: center;
opacity: 0;
transition: opacity 0.2s ease;
}
.close-btn {
position: absolute;
top: 12px;
right: 12px;
background: none;
border: none;
font-size: 18px;
color: #ccc;
user-select: none;
}
.prompt { .prompt {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
@@ -107,20 +131,8 @@ body {
} }
.permission-popup { .permission-popup {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.85);
display: flex;
justify-content: center;
align-items: center; align-items: center;
z-index: 9999; z-index: 2000;
}
.permission-popup.hidden {
display: none;
} }
.permission-content { .permission-content {

View File

@@ -148,74 +148,39 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
opacity: 0; opacity: 0;
transition: opacity 0.4s ease; transition: opacity 0.2s ease;
}
.help-overlay.show {
display: flex;
opacity: 1;
}
.help-overlay.hide {
opacity: 0;
} }
.help-menu { .help-menu {
position: relative; position: relative;
width: 90vw; width: calc(95vw - 60px);
max-width: 800px; max-width: 800px;
background-color: white; background-color: white;
padding: 10px 0; padding: 30px;
border-radius: 15px; border-radius: 15px;
text-align: left; text-align: left;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
} }
.close-help {
position: absolute;
top: 15px;
right: 12px;
background: none;
border: none;
font-size: 20px;
color: #ccc;
user-select: none;
}
.help-content { .help-content {
max-height: 85vh; display: flex;
padding: 0 30px; flex-direction: column;
gap: 20px;
max-height: calc(85vh - 60px);
overflow-y: auto; overflow-y: auto;
} }
.help-content p { .help-content-header {
font-size: 26px; font-size: 26px;
user-select: none; user-select: none;
} }
.help-content ul { .instruction strong {
padding-left: 0;
list-style-type: none;
}
.help-content ul li {
font-weight: bold;
font-size: 18px; font-size: 18px;
} }
.help-content ul ul li { .instruction p {
font-weight: normal; margin: 0;
font-size: 16px;
}
.help-content ul ul ul li {
color: #777777;
font-weight: normal;
font-size: 14px;
}
.help-content ul ul ul li a {
color: inherit;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {

View File

@@ -1,15 +1,5 @@
.security-patch-overlay { .security-patch-overlay {
display: none;
position: fixed;
justify-content: center;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 2000; z-index: 2000;
transition: opacity 0.2s ease;
opacity: 0;
} }
.security-patch-card { .security-patch-card {
@@ -19,8 +9,7 @@
background-color: white; background-color: white;
padding: 30px; padding: 30px;
border-radius: 15px; border-radius: 15px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
z-index: 2001;
width: calc(90% - 60px); width: calc(90% - 60px);
max-width: 300px; max-width: 300px;
max-height: calc(80% - 60px); max-height: calc(80% - 60px);
@@ -153,10 +142,6 @@
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
.security-patch-overlay {
background-color: rgba(0, 0, 0, 0.8);
}
.security-patch-card { .security-patch-card {
background-color: #343434; background-color: #343434;
color: white; color: white;

View File

@@ -1,15 +1,5 @@
.add-system-app-overlay { .add-system-app-overlay {
display: none;
position: fixed;
justify-content: center;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 2000; z-index: 2000;
transition: opacity 0.2s ease;
opacity: 0;
} }
.add-system-app-card { .add-system-app-card {
@@ -25,7 +15,7 @@
padding: 30px; padding: 30px;
background-color: #fff; background-color: #fff;
border-radius: 15px; border-radius: 15px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
} }
.add-system-app-title { .add-system-app-title {