Vexiro Web UI

Antarmuka web untuk Vexiro Magiks yang memanfaatkan Shizuku untuk eksekusi perintah shell

Apa itu Vexiro Web UI?

Tentang Vexiro Web UI

Vexiro Web UI menggunakan izin dari Shizuku (ADB) untuk menjalankan perintah shell script ataupun kode perintah lainnya. Tanpa memerlukan akses root, cukup menggunakan akses Shizuku saja.

Dengan antarmuka web yang responsif dan modern, Vexiro Web UI memungkinkan Anda untuk mengelola perangkat Android dengan mudah melalui browser.

Struktur Direktori Web UI

Penjelasan lengkap struktur Web UI dan cara menggunakannya

Struktur Direktori

Berikut adalah struktur direktori standar untuk Vexiro Web UI:

webroot/
├── index.html
│ └─ Entry point utama Web UI
├── core-engine.js
│ └─ Engine inti (WAJIB)
│ Mengatur lifecycle, routing, dan eksekusi UI
├── actions/
│ └── gaming.js
│ └─ Script eksekusi fitur / logic module
└── assets/ (Opsional)
├── icon.png
│ └─ Ikon aplikasi / website
├── css/
│ └── style.css
│ └─ Styling utama Web UI
└── js/
└── script.js
└─ JavaScript pendukung / UI interaction
Catatan Penting
  • index.html dan core-engine.js bersifat wajib. Tanpa dua file ini, Web UI tidak dapat berjalan.
  • Folder actions/ digunakan sebagai pusat eksekusi logic modular.
  • Folder assets/ bersifat opsional, namun sangat direkomendasikan untuk menjaga struktur tetap bersih dan scalable.
  • Struktur ini siap dikembangkan ke sistem module, loader, atau framework custom.

Instruksi Penggunaan

Cara menggunakan Vexiro Web UI dengan benar

File Core Engine

File engine-core.js wajib ada karena berfungsi sebagai mesin untuk menjalankan Web UI

engine-core.js 
// ===== VEXIRO CORE ENGINE =====

const Vexiro = {
    isShizukuAvailable: false,
    actionRegistry: {},
    
    init: function() {
        setInterval(() => this.checkShizuku(), 8000);
        
        const saved = localStorage.getItem('vex_command');
        if (saved && document.getElementById('codeEditor')) {
            document.getElementById('codeEditor').value = saved;
        }
        
        const editor = document.getElementById('codeEditor');
        if (editor) {
            editor.addEventListener('input', () => {
                localStorage.setItem('vex_command', editor.value);
            });
        }
        
        this.checkShizuku();
    },
    
    registerAction: function(actionName, commandString) {
        this.actionRegistry[actionName] = commandString;
    },
    
    runAction: function(actionName) {
        if (!this.isShizukuAvailable) {
            return;
        }
        
        if (!this.actionRegistry[actionName]) {
            return;
        }
        
        this.executeCommand(this.actionRegistry[actionName]);
    },
    
    checkShizuku: function() {
        if (typeof shizuku !== 'undefined' && shizuku !== null) {
            this.isShizukuAvailable = true;
            return true;
        } else {
            this.isShizukuAvailable = false;
            return false;
        }
    },
    
    executeCommand: function(command) {
        if (!this.isShizukuAvailable) {
            return;
        }
        
        const callbackId = 'vex_' + Date.now();
        
        window[callbackId] = (errno, stdout, stderr) => {
            delete window[callbackId];
        };
        
        try {
            shizuku.shellExec(command, JSON.stringify({cwd: "/system"}), callbackId);
        } catch (error) {
            // Error handling
        }
    },
    
    runCustomCommand: function() {
        const editor = document.getElementById('codeEditor');
        if (!editor) return;
        
        const command = editor.value.trim();
        if (!command) {
            return;
        }
        
        this.executeCommand(command);
    },
    
    clearEditor: function() {
        const editor = document.getElementById('codeEditor');
        if (!editor) return;
        
        editor.value = '# Masukkan shell commands Anda di sini\n' +
                       '# Format bebas - persis seperti di terminal\n\n' +
                       '# Contoh:\n' +
                       'echo "Hello Vexiro"\n' +
                       'sleep 1\n' +
                       'settings put global window_animation_scale 0.5\n' +
                       '\n' +
                       '# Bisa juga pakai script panjang:\n' +
                       'echo "█▓▒▒░░░ Memulai... ░░░▒▒▓█"\n' +
                       'date\n' +
                       'uname -a';
        
        localStorage.setItem('vex_command', editor.value);
    }
};

Simpan kode di atas sebagai engine-core.js.

Struktur Halaman Web

File index.html berisi kode halaman web UI yang mendukung berbagai pemrograman web (tidak semua jenis pemrograman support).

Kode yang wajib ada di halaman:

Load Core Engine & Action Script 
<!-- Load Core Engine -->
<script src="engine-core.js" defer></script>

<!-- Auto-load Actions -->
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const actions = [
            'gaming.js',
            'turbo.js',
        ];
        
        actions.forEach(file => {
            const script = document.createElement('script');
            script.src = `actions/${file}`;
            script.defer = true;
            document.head.appendChild(script);
            console.log(`📦 Loading: ${file}`);
        });
    });
</script>

Kode ini wajib dan harus ada di web UI Anda. Letakkan di bagian bawah judul web UI dan di atas kode CSS style Anda.

Eksekusi Tombol Action

Berikut contoh kode untuk tombol eksekusi dengan style CSS:

Contoh Tombol Action 
<div class="action-card" onclick="Vexiro.runAction('gaming')">
    <div class="action-icon">🎮</div>
    <div class="action-title">Gaming Mode</div>
    <div class="action-desc">Max performance for gaming</div>
</div>

Penjelasan:

  • Vexiro.runAction('gaming') - Kode wajib agar perintah di file JS action berhasil dieksekusi
  • gaming - Nama file JS yang ada di actions/gaming.js
Struktur File Action

Contoh kode untuk file action gaming.js

actions/gaming.js 
// ===== GAMING MODE =====

Vexiro.registerAction('gaming',
`settings put secure gaming_mode_active 1
settings put global sem_enhanced_cpu_responsiveness 1
settings put global fps_divisor 1
settings put global vsync_enabled 0`);

Penjelasan:

  • Vexiro.registerAction('gaming', ...) - Mendaftarkan file JS action
  • gaming - Nama file JS yang akan didaftarkan ke halaman index.html
  • Masukkan kode eksekusi perintah di dalam backticks `
Inisialisasi Akhir

Kode inisialisasi harus ditempatkan di akhir sebelum tag penutup </body>:

Inisialisasi Vexiro 
<!-- Initialize Vexiro -->
<script>
    document.addEventListener('DOMContentLoaded', () => {
        Vexiro.init();
    });
</script>

Download Template Lengkap

Dapatkan template lengkap Vexiro Web UI untuk memulai pengembangan Anda dengan cepat dan mudah.

Download Template