CoolFace
Apppublic

ErftgRftg/linux-kernel-emulator-cli

sourceHugging Faceupdated 4mo agoView on Hugging Face
0likes
index.html107 linesDownload Raw Back to root
1<!DOCTYPE html>2<html lang="en">3<head>4    <meta charset="UTF-8">5    <meta name="viewport" content="width=device-width, initial-scale=1.0">6    <title>Linux CLI Terminal</title>7    <link rel="stylesheet" href="style.css">8    <style>9        /* Extra styling for the simulated Firefox window */10        .browser-window {11            width: 90%;12            height: 400px;13            border: 2px solid #333;14            margin-top: 10px;15            background: #fff;16            display: flex;17            flex-direction: column;18        }19        .browser-bar {20            background: #222;21            color: #fff;22            padding: 5px;23            font-size: 12px;24            font-family: sans-serif;25        }26        .browser-iframe {27            width: 100%;28            height: 100%;29            border: none;30        }31    </style>32</head>33<body>34 35    <div id="terminal">36        <div id="output">37            Welcome to Linux Kernel Emulation CLI<br>38            Type 'help' for a list of available commands.<br><br>39        </div>40 41        <div class="input-line">42            <span class="prompt">user@linux:~$</span>43            <input type="text" id="cmd-input" autofocus autocomplete="off" spellcheck="false">44        </div>45    </div>46 47    <script>48        const input = document.getElementById('cmd-input');49        const output = document.getElementById('output');50        const terminal = document.getElementById('terminal');51 52        window.onload = function() { input.focus(); };53        document.addEventListener('click', function() { input.focus(); });54 55        input.addEventListener('keypress', function(e) {56            if (e.key === 'Enter' || e.keyCode === 13) {57                const command = input.value.trim();58                const lowerCommand = command.toLowerCase();59                60                const historyLine = document.createElement('div');61                historyLine.innerHTML = `<span style="color: #00ff00; font-weight: bold;">user@linux:~$</span> ${command}`;62                output.appendChild(historyLine);63 64                const responseLine = document.createElement('div');65 66                if (lowerCommand === 'help') {67                    responseLine.innerHTML = `68                        Available commands:<br>69                        - <b>help</b>: Show this menu<br>70                        - <b>clear</b>: Clear the terminal screen<br>71                        - <b>whoami</b>: Display current user<br>72                        - <b>ls</b>: List directory contents<br>73                        - <b>firefox</b>: Launch Firefox inside terminal74                    `;75                } else if (lowerCommand === 'clear') {76                    output.innerHTML = '';77                } else if (lowerCommand === 'whoami') {78                    responseLine.innerHTML = "user";79                } else if (lowerCommand === 'ls') {80                    responseLine.innerHTML = "<span style='color: #569cd6;'>Desktop</span> &nbsp;&nbsp; <span style='color: #569cd6;'>Downloads</span>";81                } else if (lowerCommand === 'firefox') {82                    responseLine.innerHTML = "<span style='color: #ffa500;'>Opening Firefox Browser Window...</span>";83                    84                    // Create a simulated browser element instead of opening a new tab85                    const browserContainer = document.createElement('div');86                    browserContainer.className = 'browser-window';87                    browserContainer.innerHTML = `88                        <div class="browser-bar">🦊 Firefox - https://www.bing.com</div>89                        <iframe class="browser-iframe" src="https://www.bing.com"></iframe>90                    `;91                    responseLine.appendChild(browserContainer);92                } else if (command !== '') {93                    responseLine.innerHTML = `bash: ${command}: command not found`;94                }95 96                if (lowerCommand !== 'clear') {97                    output.appendChild(responseLine);98                    output.appendChild(document.createElement('br'));99                }100 101                input.value = '';102                terminal.scrollTop = terminal.scrollHeight;103            }104        });105    </script>106</body>107</html>