/**
 * vnc page HTML template for wssshd
 *
 * Copyright (C) 2024 Stefy Lanza <stefy@nexlab.net> and SexHack.me
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */

#ifndef VNC_PAGE_H
#define VNC_PAGE_H

// vnc page HTML template
static const char *vnc_page_html __attribute__((used)) =
"<!DOCTYPE html>\n"
"<html lang=\"en\">\n"
"<head>\n"
"    <meta charset=\"UTF-8\">\n"
"    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n"
"    <title>VNC - %s</title>\n"
"    <link rel=\"icon\" href=\"/favicon.ico\" type=\"image/x-icon\">\n"
"    <link href=\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css\" rel=\"stylesheet\">\n"
"    <link href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css\" rel=\"stylesheet\">\n"
"    <link rel=\"stylesheet\" href=\"/novnc.css\">\n"
"    <script src=\"/novnc/util/strings.js\"></script>\n"
"    <script src=\"/novnc/util/logging.js\"></script>\n"
"    <script src=\"/novnc/util/browser.js\"></script>\n"
"    <script src=\"/novnc/util/element.js\"></script>\n"
"    <script src=\"/novnc/util/events.js\"></script>\n"
"    <script src=\"/novnc/util/eventtarget.js\"></script>\n"
"    <script src=\"/novnc/util/int.js\"></script>\n"
"    <script src=\"/novnc/util/cursor.js\"></script>\n"
"    <script src=\"/novnc/util/md5.js\"></script>\n"
"    <script src=\"/novnc/websock.js\"></script>\n"
"    <script src=\"/novnc/des.js\"></script>\n"
"    <script src=\"/novnc/input/keysym.js\"></script>\n"
"    <script src=\"/novnc/input/keysymdef.js\"></script>\n"
"    <script src=\"/novnc/input/xtscancodes.js\"></script>\n"
"    <script src=\"/novnc/input/util.js\"></script>\n"
"    <script src=\"/novnc/input/keyboard.js\"></script>\n"
"    <script src=\"/novnc/input/gesturehandler.js\"></script>\n"
"    <script src=\"/novnc/display.js\"></script>\n"
"    <script src=\"/novnc/inflator.js\"></script>\n"
"    <script src=\"/novnc/deflator.js\"></script>\n"
"    <script src=\"/novnc/encodings.js\"></script>\n"
"    <script src=\"/novnc/ra2.js\"></script>\n"
"    <script src=\"/novnc/decoders/raw.js\"></script>\n"
"    <script src=\"/novnc/decoders/copyrect.js\"></script>\n"
"    <script src=\"/novnc/decoders/rre.js\"></script>\n"
"    <script src=\"/novnc/decoders/hextile.js\"></script>\n"
"    <script src=\"/novnc/decoders/tight.js\"></script>\n"
"    <script src=\"/novnc/decoders/tightpng.js\"></script>\n"
"    <script src=\"/novnc/decoders/zrle.js\"></script>\n"
"    <script src=\"/novnc/decoders/jpeg.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/adler32.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/constants.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/crc32.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/deflate.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/inffast.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/inflate.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/inftrees.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/messages.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/trees.js\"></script>\n"
"    <script src=\"/novnc/vendor/pako/lib/zlib/zstream.js\"></script>\n"
"    <script src=\"/novnc/rfb.js\"></script>\n"
"    <style>\n"
"        .navbar-brand {\n"
"            font-weight: bold;\n"
"        }\n"
"        .vnc-container {\n"
"            background-color: #1e1e1e;\n"
"            color: #f8f8f2;\n"
"            border-radius: 8px;\n"
"            height: calc(100vh - 200px);\n"
"            min-height: 400px;\n"
"            overflow: hidden;\n"
"            position: relative;\n"
"        }\n"
"        /* GNOME-like window decorations */\n"
"        .vnc-window {\n"
"            border: 1px solid #ccc;\n"
"            border-radius: 8px;\n"
"            overflow: hidden;\n"
"            box-shadow: 0 2px 10px rgba(0,0,0,0.2);\n"
"        }\n"
"        .window-titlebar {\n"
"            background: linear-gradient(to bottom, #f0f0f0, #e0e0e0);\n"
"            border-bottom: 1px solid #ccc;\n"
"            padding: 4px 8px;\n"
"            display: flex;\n"
"            justify-content: space-between;\n"
"            align-items: center;\n"
"            height: 32px;\n"
"        }\n"
"        .window-title {\n"
"            font-weight: bold;\n"
"            color: #333;\n"
"            font-size: 14px;\n"
"        }\n"
"        .window-controls {\n"
"            display: flex;\n"
"            align-items: center;\n"
"            gap: 4px;\n"
"        }\n"
"        .window-btn {\n"
"            width: 24px;\n"
"            height: 24px;\n"
"            border: none;\n"
"            border-radius: 50%;\n"
"            display: flex;\n"
"            align-items: center;\n"
"            justify-content: center;\n"
"            font-size: 14px;\n"
"            font-weight: bold;\n"
"            cursor: pointer;\n"
"            transition: all 0.2s;\n"
"        }\n"
"        .window-btn:hover {\n"
"            transform: scale(1.1);\n"
"        }\n"
"        .close-btn {\n"
"            background: #ff605c;\n"
"            color: white;\n"
"        }\n"
"        .close-btn:hover {\n"
"            background: #ff403c;\n"
"        }\n"
"        .maximize-btn {\n"
"            background: #28ca42;\n"
"            color: white;\n"
"        }\n"
"        .maximize-btn:hover {\n"
"            background: #24b83a;\n"
"        }\n"
"        .minimize-btn {\n"
"            background: #ffbd44;\n"
"            color: white;\n"
"            display: none; /* Hidden by default, shown in fullscreen */\n"
"        }\n"
"        .minimize-btn:hover {\n"
"            background: #ffad2c;\n"
"        }\n"
"        .window-content {\n"
"            background: #1e1e1e;\n"
"            padding: 8px;\n"
"        }\n"
"        /* Fullscreen styles */\n"
"        .vnc-window.fullscreen {\n"
"            position: fixed;\n"
"            top: 0;\n"
"            left: 0;\n"
"            width: 100vw;\n"
"            height: 100vh;\n"
"            border: none;\n"
"            border-radius: 0;\n"
"            z-index: 9999;\n"
"        }\n"
"        .vnc-window.fullscreen .vnc-container {\n"
"            height: calc(100vh - 40px) !important;\n"
"            min-height: calc(100vh - 40px) !important;\n"
"        }\n"
"        .vnc-window.fullscreen .minimize-btn {\n"
"            display: flex;\n"
"        }\n"
"        #noVNC_screen {\n"
"            width: 100%;\n"
"            height: 100%;\n"
"        }\n"
"    </style>\n"
"</head>\n"
"<body>\n"
"<nav class=\"navbar navbar-expand-lg navbar-dark bg-primary\">\n"
"<div class=\"container\">\n"
"<a class=\"navbar-brand\" href=\"/\">\n"
"<i class=\"fas fa-desktop\"></i> WSSSHD control panel</a>\n"
"<div class=\"navbar-nav ms-auto\">\n"
"<span class=\"navbar-text me-3\">VNC Session - %s</span>\n"
"<a class=\"nav-link\" href=\"/logout\">Logout</a>\n"
"</div></div></nav>\n"
"<div id=\"notification-area\" class=\"position-fixed top-0 end-0 p-3\" style=\"z-index: 1050;\"></div>\n"
"<div class=\"container mt-4\">\n"
"<div class=\"row\">\n"
"    <div class=\"col-12\">\n"
"        <div class=\"vnc-window\">\n"
"            <div class=\"window-titlebar\">\n"
"                <div class=\"window-title\">\n"
"                    <i class=\"fas fa-desktop\"></i> VNC Session - %s\n"
"                </div>\n"
"                <div class=\"window-controls\">\n"
"                    <button id=\"connectBtn\" class=\"btn btn-success btn-sm me-1\" style=\"height: 24px; font-size: 12px; padding: 0 8px;\">\n"
"                        <i class=\"fas fa-play\"></i> Connect\n"
"                    </button>\n"
"                    <button id=\"disconnectBtn\" class=\"btn btn-danger btn-sm me-1\" disabled style=\"height: 24px; font-size: 12px; padding: 0 8px;\">\n"
"                        <i class=\"fas fa-stop\"></i> Disconnect\n"
"                    </button>\n"
"                    <button class=\"window-btn minimize-btn\" title=\"Exit Fullscreen\">_</button>\n"
"                    <button class=\"window-btn maximize-btn\" title=\"Fullscreen\"><span class=\"maximize-icon\">□</span></button>\n"
"                    <button class=\"window-btn close-btn\" title=\"Disconnect\">×</button>\n"
"                </div>\n"
"            </div>\n"
"            <div class=\"window-content\">\n"
"                <div id=\"vnc\" class=\"vnc-container w-100\">\n"
"                    <div id=\"noVNC_screen\">\n"
"                        <div id=\"noVNC_status\">Click Connect to start VNC session</div>\n"
"                    </div>\n"
"                </div>\n"
"            </div>\n"
"        </div>\n"
"    </div>\n"
"</div>\n"
"</div>\n"
"\n"
"<script src=\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js\"></script>\n"
"<script>\n"
"console.log('VNC page loaded');\n"
"\n"
"let rfb = null;\n"
"let connected = false;\n"
"\n"
"document.getElementById('connectBtn').addEventListener('click', connect);\n"
"document.getElementById('disconnectBtn').addEventListener('click', disconnect);\n"
"\n"
"// Window control buttons\n"
"document.querySelector('.close-btn').addEventListener('click', disconnect);\n"
"document.querySelector('.maximize-btn').addEventListener('click', toggleFullscreen);\n"
"document.querySelector('.minimize-btn').addEventListener('click', toggleFullscreen);\n"
"\n"
"function showNotification(message, type = 'info') {\n"
"    const notificationArea = document.getElementById('notification-area');\n"
"    const notification = document.createElement('div');\n"
"    notification.className = `alert alert-${type} alert-dismissible fade show`;\n"
"    notification.innerHTML = `${message}<button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\"></button>`;\n"
"    notificationArea.appendChild(notification);\n"
"    setTimeout(() => {\n"
"        if (notification.parentNode) {\n"
"            notification.remove();\n"
"        }\n"
"    }, 5000);\n"
"}\n"
"\n"
"function toggleFullscreen() {\n"
"    const vncWindow = document.querySelector('.vnc-window');\n"
"    const maximizeBtn = document.querySelector('.maximize-btn');\n"
"    const maximizeIcon = maximizeBtn.querySelector('.maximize-icon');\n"
"\n"
"    if (vncWindow.classList.contains('fullscreen')) {\n"
"        // Exit fullscreen\n"
"        vncWindow.classList.remove('fullscreen');\n"
"        maximizeIcon.textContent = '□';\n"
"        maximizeBtn.title = 'Fullscreen';\n"
"    } else {\n"
"        // Enter fullscreen\n"
"        vncWindow.classList.add('fullscreen');\n"
"        maximizeIcon.textContent = '▭'; // Restore icon\n"
"        maximizeBtn.title = 'Exit Fullscreen';\n"
"    }\n"
"}\n"
"\n"
"function connect() {\n"
"    console.log('Connect button clicked');\n"
"    if (connected) return;\n"
"\n"
"    const wsProtocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';\n"
"    const wsUrl = wsProtocol + '//' + window.location.host + '/vnc/%s/ws';\n"
"    console.log('Connecting VNC to:', wsUrl);\n"
"\n"
"    try {\n"
"        rfb = new RFB(document.getElementById('noVNC_screen'), wsUrl, {\n"
"            credentials: {},\n"
"            shared: true,\n"
"            repeaterID: '',\n"
"            wsProtocols: ['binary']\n"
"        });\n"
"\n"
"        rfb.addEventListener('connect', () => {\n"
"            console.log('[VNC-DEBUG] VNC connected event fired');\n"
"            console.log('[VNC-DEBUG] Connection state:', rfb._rfbConnectionState);\n"
"            console.log('[VNC-DEBUG] Init state:', rfb._rfbInitState);\n"
"            connected = true;\n"
"            document.getElementById('connectBtn').disabled = true;\n"
"            document.getElementById('disconnectBtn').disabled = false;\n"
"            showNotification('VNC session connected', 'success');\n"
"        });\n"
"\n"
"        rfb.addEventListener('disconnect', () => {\n"
"            console.log('[VNC-DEBUG] VNC disconnected event fired');\n"
"            console.log('[VNC-DEBUG] Connection state:', rfb._rfbConnectionState);\n"
"            console.log('[VNC-DEBUG] Init state:', rfb._rfbInitState);\n"
"            connected = false;\n"
"            document.getElementById('connectBtn').disabled = false;\n"
"            document.getElementById('disconnectBtn').disabled = true;\n"
"            showNotification('VNC session disconnected', 'info');\n"
"        });\n"
"\n"
"        rfb.addEventListener('credentialsrequired', (e) => {\n"
"            console.log('VNC credentials required');\n"
"            // For now, assume no credentials needed\n"
"        });\n"
"\n"
"        rfb.addEventListener('securityfailure', (e) => {\n"
"            console.error('VNC security failure:', e.detail);\n"
"            showNotification('VNC security failure: ' + e.detail.reason, 'danger');\n"
"        });\n"
"\n"
"        rfb.addEventListener('clipboard', (e) => {\n"
"            console.log('VNC clipboard:', e.detail.text);\n"
"        });\n"
"\n"
"    } catch (e) {\n"
"        console.error('Failed to create RFB:', e);\n"
"        showNotification('Failed to connect VNC: ' + e.message, 'danger');\n"
"    }\n"
"}\n"
"\n"
"function disconnect() {\n"
"    if (rfb) {\n"
"        rfb.disconnect();\n"
"        rfb = null;\n"
"    }\n"
"    connected = false;\n"
"    document.getElementById('connectBtn').disabled = false;\n"
"    document.getElementById('disconnectBtn').disabled = true;\n"
"    setTimeout(() => {\n"
"        location.reload();\n"
"    }, 3000);\n"
"}\n"
"</script>\n"
"</body>\n"
"</html>\n"
;

#endif /* VNC_PAGE_H */
