Spaces:

SketchyAI
/

linum

Paused

App Files Files Community

Rémy commited on Oct 19, 2024

Commit

f716e02

1 Parent(s): 3c64ab0

Add Linux Practice Tool files

Browse files

Files changed (10) hide show

Dockerfile +13 -0
app.py +49 -0
backend/Dockerfile +10 -0
backend/app.py +37 -0
backend/requirements.txt +2 -0
frontend/index.html +19 -0
frontend/script.js +70 -0
frontend/styles.css +36 -0
index.html +147 -0
requirements.txt +2 -0

Dockerfile ADDED Viewed

	@@ -0,0 +1,13 @@

+FROM python:3.9
+RUN useradd -m -u 1000 user
+USER user
+ENV PATH="/home/user/.local/bin:$PATH"
+WORKDIR /app
+COPY --chown=user ./requirements.txt requirements.txt
+RUN pip install --no-cache-dir --upgrade -r requirements.txt
+COPY --chown=user . /app
+CMD ["uvicorn", "app:app", "--host", "0.0.0.0", "--port", "7860"]

app.py ADDED Viewed

	@@ -0,0 +1,49 @@

+from fastapi import FastAPI, HTTPException
+from fastapi.middleware.cors import CORSMiddleware
+from pydantic import BaseModel
+import subprocess
+import shlex
+app = FastAPI()
+# Add CORS middleware
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],  # Allows all origins
+    allow_credentials=True,
+    allow_methods=["*"],  # Allows all methods
+    allow_headers=["*"],  # Allows all headers
+)
+ALLOWED_COMMANDS = {
+    'ls', 'cd', 'pwd', 'echo', 'cat', 'grep', 'find', 'touch', 'mkdir', 'rm', 'cp', 'mv'
+}
+class Command(BaseModel):
+    command: str
+@app.post("/execute")
+async def execute_command(command: Command):
+    try:
+        # Parse the command to get the base command
+        base_command = shlex.split(command.command)[0]
+        # Check if the base command is allowed
+        if base_command not in ALLOWED_COMMANDS:
+            raise HTTPException(status_code=403, detail=f"Command '{base_command}' is not allowed")
+        # Execute the command in a controlled environment
+        result = subprocess.run(command.command, shell=True, capture_output=True, text=True, timeout=5)
+        return {
+            "output": result.stdout,
+            "error": result.stderr,
+            "returncode": result.returncode
+        }
+    except subprocess.TimeoutExpired:
+        raise HTTPException(status_code=408, detail="Command execution timed out")
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+@app.get("/")
+async def root():
+    return {"message": "Welcome to the Linux Practice Tool API"}

backend/Dockerfile ADDED Viewed

	@@ -0,0 +1,10 @@

+FROM python:3.9-slim
+WORKDIR /app
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+COPY app.py .
+CMD ["python", "app.py"]

backend/app.py ADDED Viewed

	@@ -0,0 +1,37 @@

+from flask import Flask, request, jsonify
+from flask_cors import CORS
+import subprocess
+import shlex
+app = Flask(__name__)
+CORS(app)
+ALLOWED_COMMANDS = {
+    'ls', 'cd', 'pwd', 'echo', 'cat', 'grep', 'find', 'touch', 'mkdir', 'rm', 'cp', 'mv'
+}
+@app.route('/execute', methods=['POST'])
+def execute_command():
+    command = request.json['command']
+    try:
+        # Parse the command to get the base command
+        base_command = shlex.split(command)[0]
+        # Check if the base command is allowed
+        if base_command not in ALLOWED_COMMANDS:
+            return jsonify({'error': f"Command '{base_command}' is not allowed"}), 403
+        # Execute the command in a controlled environment
+        result = subprocess.run(command, shell=True, capture_output=True, text=True, timeout=5)
+        return jsonify({
+            'output': result.stdout,
+            'error': result.stderr,
+            'returncode': result.returncode
+        })
+    except subprocess.TimeoutExpired:
+        return jsonify({'error': 'Command execution timed out'}), 408
+    except Exception as e:
+        return jsonify({'error': str(e)}), 500
+if __name__ == '__main__':
+    app.run(host='0.0.0.0', port=5000)

backend/requirements.txt ADDED Viewed

	@@ -0,0 +1,2 @@


1	+ flask==2.0.1
2	+ flask-cors==3.0.10

frontend/index.html ADDED Viewed

	@@ -0,0 +1,19 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Linux Practice Tool</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div id="terminal">
+        <div id="output"></div>
+        <div id="input-line">
+            <span id="prompt">$</span>
+            <input type="text" id="command-input" autofocus>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>

frontend/script.js ADDED Viewed

	@@ -0,0 +1,70 @@

+const output = document.getElementById('output');
+const input = document.getElementById('command-input');
+let commandHistory = [];
+let historyIndex = -1;
+input.addEventListener('keydown', async (event) => {
+    if (event.key === 'Enter') {
+        event.preventDefault();
+        const command = input.value.trim();
+        if (command) {
+            commandHistory.push(command);
+            historyIndex = commandHistory.length;
+            await executeCommand(command);
+        }
+        input.value = '';
+    } else if (event.key === 'ArrowUp') {
+        event.preventDefault();
+        if (historyIndex > 0) {
+            historyIndex--;
+            input.value = commandHistory[historyIndex];
+        }
+    } else if (event.key === 'ArrowDown') {
+        event.preventDefault();
+        if (historyIndex < commandHistory.length - 1) {
+            historyIndex++;
+            input.value = commandHistory[historyIndex];
+        } else {
+            historyIndex = commandHistory.length;
+            input.value = '';
+        }
+    }
+});
+async function executeCommand(command) {
+    output.innerHTML += `$ ${command}\n`;
+    try {
+        const response = await fetch('http://localhost:5000/execute', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({ command }),
+        });
+        const data = await response.json();
+        if (response.ok) {
+            output.innerHTML += data.output;
+            if (data.error) {
+                output.innerHTML += `Error: ${data.error}\n`;
+            }
+        } else {
+            output.innerHTML += `Error: ${data.error}\n`;
+        }
+    } catch (error) {
+        output.innerHTML += `Error: ${error.message}\n`;
+    }
+    output.scrollTop = output.scrollHeight;
+}
+// Focus on input when clicking anywhere in the terminal
+document.getElementById('terminal').addEventListener('click', () => {
+    input.focus();
+});
+// Initial welcome message
+output.innerHTML = "Welcome to the Linux Practice Tool!\nType 'help' for a list of available commands.\n\n";

frontend/styles.css ADDED Viewed

	@@ -0,0 +1,36 @@

+body {
+    font-family: monospace;
+    background-color: #000;
+    color: #0f0;
+    margin: 0;
+    padding: 20px;
+}
+#terminal {
+    width: 100%;
+    height: 100vh;
+    overflow-y: auto;
+}
+#output {
+    white-space: pre-wrap;
+}
+#input-line {
+    display: flex;
+    margin-top: 10px;
+}
+#prompt {
+    margin-right: 5px;
+}
+#command-input {
+    flex-grow: 1;
+    background-color: transparent;
+    border: none;
+    color: #0f0;
+    font-family: inherit;
+    font-size: inherit;
+    outline: none;
+}

index.html ADDED Viewed

	@@ -0,0 +1,147 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Linux Practice Tool</title>
+    <style>
+        body {
+            font-family: monospace;
+            background-color: #000;
+            color: #0f0;
+            margin: 0;
+            padding: 20px;
+        }
+        #terminal {
+            width: 100%;
+            height: 100vh;
+            overflow-y: auto;
+        }
+        #output {
+            white-space: pre-wrap;
+        }
+        #input-line {
+            display: flex;
+            margin-top: 10px;
+        }
+        #prompt {
+            margin-right: 5px;
+        }
+        #command-input {
+            flex-grow: 1;
+            background-color: transparent;
+            border: none;
+            color: #0f0;
+            font-family: inherit;
+            font-size: inherit;
+            outline: none;
+        }
+    </style>
+</head>
+<body>
+    <div id="terminal">
+        <div id="output"></div>
+        <div id="input-line">
+            <span id="prompt">$</span>
+            <input type="text" id="command-input" autofocus>
+        </div>
+    </div>
+    <script>
+        const output = document.getElementById('output');
+        const input = document.getElementById('command-input');
+        let commandHistory = [];
+        let historyIndex = -1;
+        input.addEventListener('keydown', async (event) => {
+            if (event.key === 'Enter') {
+                event.preventDefault();
+                const command = input.value.trim();
+                if (command) {
+                    commandHistory.push(command);
+                    historyIndex = commandHistory.length;
+                    await executeCommand(command);
+                }
+                input.value = '';
+            } else if (event.key === 'ArrowUp') {
+                event.preventDefault();
+                if (historyIndex > 0) {
+                    historyIndex--;
+                    input.value = commandHistory[historyIndex];
+                }
+            } else if (event.key === 'ArrowDown') {
+                event.preventDefault();
+                if (historyIndex < commandHistory.length - 1) {
+                    historyIndex++;
+                    input.value = commandHistory[historyIndex];
+                } else {
+                    historyIndex = commandHistory.length;
+                    input.value = '';
+                }
+            }
+        });
+        async function executeCommand(command) {
+            if (command.toLowerCase() === 'help') {
+                displayHelp();
+            } else {
+                output.innerHTML += `$ ${command}\n`;
+                try {
+                    const response = await fetch('/execute', {
+                        method: 'POST',
+                        headers: {
+                            'Content-Type': 'application/json',
+                        },
+                        body: JSON.stringify({ command }),
+                    });
+                    const data = await response.json();
+                    if (response.ok) {
+                        output.innerHTML += data.output;
+                        if (data.error) {
+                            output.innerHTML += `Error: ${data.error}\n`;
+                        }
+                    } else {
+                        output.innerHTML += `Error: ${data.detail}\n`;
+                    }
+                } catch (error) {
+                    output.innerHTML += `Error: ${error.message}\n`;
+                }
+            }
+            output.scrollTop = output.scrollHeight;
+        }
+        function displayHelp() {
+            const helpText = `
+Available commands:
+- ls: List directory contents
+- cd: Change directory
+- pwd: Print working directory
+- echo: Display a line of text
+- cat: Concatenate files and print on the standard output
+- grep: Print lines that match patterns
+- find: Search for files in a directory hierarchy
+- touch: Change file timestamps
+- mkdir: Make directories
+- rm: Remove files or directories
+- cp: Copy files and directories
+- mv: Move (rename) files
+Type 'help' to see this message again.
+`;
+            output.innerHTML += helpText;
+        }
+        // Focus on input when clicking anywhere in the terminal
+        document.getElementById('terminal').addEventListener('click', () => {
+            input.focus();
+        });
+        // Initial welcome message
+        output.innerHTML = "Welcome to the Linux Practice Tool!\nType 'help' for a list of available commands.\n\n";
+    </script>
+</body>
+</html>

requirements.txt ADDED Viewed

	@@ -0,0 +1,2 @@


1	+ fastapi
2	+ uvicorn[standard]