Hugging Face's logo

Spaces:
Trigger82
/
Try
Paused

App Files Community
Trigger82 commited on
Commit
4a77552
·
verified ·
1 Parent(s): 74fb878

Update public/index.html

Browse files
Files changed (1) hide show
  1. public/index.html +48 -130
public/index.html CHANGED
@@ -3,161 +3,79 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Bot Deployment Panel</title>
7
- <style>
8
- body {
9
- font-family: 'Courier New', monospace;
10
- background-color: #1e1e1e;
11
- color: #f0f0f0;
12
- margin: 0;
13
- padding: 20px;
14
- }
15
- .container {
16
- max-width: 1000px;
17
- margin: 0 auto;
18
- }
19
- .terminal {
20
- background-color: #252525;
21
- border-radius: 5px;
22
- padding: 15px;
23
- height: 500px;
24
- overflow-y: auto;
25
- margin-bottom: 20px;
26
- }
27
- .output {
28
- white-space: pre-wrap;
29
- font-family: 'Courier New', monospace;
30
- line-height: 1.5;
31
- }
32
- .input-area {
33
- display: flex;
34
- margin-top: 10px;
35
- }
36
- input {
37
- flex-grow: 1;
38
- background-color: #252525;
39
- border: 1px solid #444;
40
- color: #f0f0f0;
41
- padding: 8px;
42
- font-family: 'Courier New', monospace;
43
- }
44
- button {
45
- background-color: #4CAF50;
46
- border: none;
47
- color: white;
48
- padding: 8px 15px;
49
- margin-left: 5px;
50
- cursor: pointer;
51
- }
52
- .panel {
53
- background-color: #252525;
54
- border-radius: 5px;
55
- padding: 15px;
56
- margin-bottom: 20px;
57
- }
58
- .tabs {
59
- display: flex;
60
- margin-bottom: 10px;
61
- }
62
- .tab {
63
- padding: 8px 15px;
64
- background-color: #333;
65
- margin-right: 5px;
66
- cursor: pointer;
67
- }
68
- .tab.active {
69
- background-color: #4CAF50;
70
- }
71
- </style>
72
  </head>
73
  <body>
74
  <div class="container">
75
- <h1>Bot Deployment Panel</h1>
76
-
 
 
 
77
  <div class="panel">
78
  <h2>Repository Setup</h2>
79
- <div class="input-area">
80
- <input type="text" id="repoUrl" placeholder="GitHub repository URL (https://github.com/user/repo)">
81
  <button id="cloneBtn">Clone</button>
82
  </div>
83
  </div>
84
-
85
  <div class="panel">
86
  <h2>Dependencies</h2>
87
- <div class="input-area">
88
  <select id="packageManager">
89
  <option value="npm">npm</option>
90
  <option value="yarn">yarn</option>
91
  </select>
92
- <button id="installBtn">Install Dependencies</button>
93
  </div>
94
  </div>
95
-
96
  <div class="panel">
97
- <h2>Run Application</h2>
98
- <div class="input-area">
99
- <input type="text" id="startCommand" placeholder="Start command (e.g., npm start, node index.js)">
100
  <button id="startBtn">Start</button>
101
  <button id="stopBtn">Stop</button>
102
  </div>
 
 
 
 
 
 
 
 
 
 
103
  </div>
104
-
 
 
 
 
 
 
 
 
 
105
  <div class="terminal">
106
- <div id="output" class="output">Welcome to Bot Deployment Panel. Clone a repository to get started.</div>
 
 
 
 
 
 
 
 
 
 
107
  </div>
108
  </div>
109
 
110
  <script src="/socket.io/socket.io.js"></script>
111
- <script>
112
- const socket = io();
113
- const outputEl = document.getElementById('output');
114
- const repoUrlEl = document.getElementById('repoUrl');
115
- const cloneBtn = document.getElementById('cloneBtn');
116
- const packageManagerEl = document.getElementById('packageManager');
117
- const installBtn = document.getElementById('installBtn');
118
- const startCommandEl = document.getElementById('startCommand');
119
- const startBtn = document.getElementById('startBtn');
120
- const stopBtn = document.getElementById('stopBtn');
121
-
122
- // Generate a random user ID for this session
123
- const userId = 'user-' + Math.random().toString(36).substr(2, 9);
124
-
125
- // Handle output from the server
126
- socket.on('output', (data) => {
127
- outputEl.innerHTML += data + '\n';
128
- outputEl.scrollTop = outputEl.scrollHeight;
129
- });
130
-
131
- // Clone repository
132
- cloneBtn.addEventListener('click', () => {
133
- const repoUrl = repoUrlEl.value.trim();
134
- if (!repoUrl) return;
135
-
136
- outputEl.innerHTML += `Cloning repository: ${repoUrl}\n`;
137
- socket.emit('cloneRepo', { userId, repoUrl });
138
- });
139
-
140
- // Install dependencies
141
- installBtn.addEventListener('click', () => {
142
- const packageManager = packageManagerEl.value;
143
- outputEl.innerHTML += `Installing dependencies with ${packageManager}...\n`;
144
- socket.emit('installDeps', { userId, packageManager });
145
- });
146
-
147
- // Start application
148
- startBtn.addEventListener('click', () => {
149
- const startCommand = startCommandEl.value.trim();
150
- if (!startCommand) return;
151
-
152
- outputEl.innerHTML += `Starting application: ${startCommand}\n`;
153
- socket.emit('startApp', { userId, startCommand });
154
- });
155
-
156
- // Stop application
157
- stopBtn.addEventListener('click', () => {
158
- outputEl.innerHTML += 'Stopping application...\n';
159
- socket.emit('stopApp');
160
- });
161
- </script>
162
  </body>
163
  </html>
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>24/7 Bot Deployment Panel</title>
7
+ <link rel="stylesheet" href="style.css">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  </head>
9
  <body>
10
  <div class="container">
11
+ <header>
12
+ <h1>24/7 Bot Deployment Panel</h1>
13
+ <div class="status-indicator" id="status">Connected</div>
14
+ </header>
15
+
16
  <div class="panel">
17
  <h2>Repository Setup</h2>
18
+ <div class="input-group">
19
+ <input type="text" id="repoUrl" placeholder="https://github.com/user/repo">
20
  <button id="cloneBtn">Clone</button>
21
  </div>
22
  </div>
23
+
24
  <div class="panel">
25
  <h2>Dependencies</h2>
26
+ <div class="input-group">
27
  <select id="packageManager">
28
  <option value="npm">npm</option>
29
  <option value="yarn">yarn</option>
30
  </select>
31
+ <button id="installBtn">Install</button>
32
  </div>
33
  </div>
34
+
35
  <div class="panel">
36
+ <h2>Process Control</h2>
37
+ <div class="input-group">
38
+ <input type="text" id="startCommand" placeholder="npm start / node index.js / etc">
39
  <button id="startBtn">Start</button>
40
  <button id="stopBtn">Stop</button>
41
  </div>
42
+ <div class="input-group">
43
+ <select id="pm2Command">
44
+ <option value="start">start</option>
45
+ <option value="stop">stop</option>
46
+ <option value="restart">restart</option>
47
+ <option value="list">list</option>
48
+ <option value="logs">logs</option>
49
+ </select>
50
+ <button id="pm2Btn">PM2</button>
51
+ </div>
52
  </div>
53
+
54
+ <div class="panel file-browser">
55
+ <h2>File Browser</h2>
56
+ <div class="file-list" id="fileList"></div>
57
+ <div class="file-editor">
58
+ <textarea id="fileEditor"></textarea>
59
+ <button id="saveFileBtn">Save</button>
60
+ </div>
61
+ </div>
62
+
63
  <div class="terminal">
64
+ <div id="output"></div>
65
+ <div class="input-line">
66
+ <span class="prompt">$</span>
67
+ <input type="text" id="commandInput" autocomplete="off">
68
+ </div>
69
+ </div>
70
+
71
+ <div class="admin-panel" id="adminPanel">
72
+ <h2>Admin Controls</h2>
73
+ <input type="password" id="adminPassword" placeholder="Admin Password">
74
+ <button id="banBtn">Ban Current IP</button>
75
  </div>
76
  </div>
77
 
78
  <script src="/socket.io/socket.io.js"></script>
79
+ <script src="script.js"></script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
80
  </body>
81
  </html>