gunship999 commited on
Commit
4d05145
·
verified ·
1 Parent(s): 66232de

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +279 -19
index.html CHANGED
@@ -1,19 +1,279 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>Bluetooth Passive Radar</title>
7
+ <style>
8
+ body {
9
+ background: #000;
10
+ color: #00ff00;
11
+ font-family: monospace;
12
+ margin: 0;
13
+ padding: 20px;
14
+ display: flex;
15
+ flex-direction: column;
16
+ align-items: center;
17
+ }
18
+
19
+ .radar-container {
20
+ position: relative;
21
+ width: 600px;
22
+ height: 600px;
23
+ border: 2px solid #00ff00;
24
+ border-radius: 50%;
25
+ margin: 20px;
26
+ overflow: hidden;
27
+ }
28
+
29
+ #radarCanvas {
30
+ position: absolute;
31
+ top: 0;
32
+ left: 0;
33
+ }
34
+
35
+ .controls {
36
+ margin: 20px;
37
+ padding: 15px;
38
+ border: 1px solid #00ff00;
39
+ background: rgba(0, 255, 0, 0.1);
40
+ }
41
+
42
+ .device-list {
43
+ width: 600px;
44
+ max-height: 300px;
45
+ overflow-y: auto;
46
+ border: 1px solid #00ff00;
47
+ margin: 20px;
48
+ padding: 10px;
49
+ }
50
+
51
+ .device-item {
52
+ padding: 5px;
53
+ margin: 5px 0;
54
+ border: 1px solid #00ff00;
55
+ display: flex;
56
+ justify-content: space-between;
57
+ }
58
+
59
+ button {
60
+ background: #000;
61
+ color: #00ff00;
62
+ border: 1px solid #00ff00;
63
+ padding: 10px 20px;
64
+ margin: 5px;
65
+ cursor: pointer;
66
+ }
67
+
68
+ button:hover {
69
+ background: #00ff00;
70
+ color: #000;
71
+ }
72
+
73
+ .stats {
74
+ display: grid;
75
+ grid-template-columns: repeat(2, 1fr);
76
+ gap: 10px;
77
+ margin: 10px 0;
78
+ }
79
+
80
+ .stat-item {
81
+ padding: 5px;
82
+ border: 1px solid #00ff00;
83
+ }
84
+ </style>
85
+ </head>
86
+ <body>
87
+ <h1>Bluetooth Passive Radar System</h1>
88
+
89
+ <div class="controls">
90
+ <button id="startScan">Start Scanning</button>
91
+ <button id="stopScan">Stop Scanning</button>
92
+ <div class="stats">
93
+ <div class="stat-item">Devices found: <span id="deviceCount">0</span></div>
94
+ <div class="stat-item">Scan status: <span id="scanStatus">Inactive</span></div>
95
+ <div class="stat-item">Last update: <span id="lastUpdate">-</span></div>
96
+ <div class="stat-item">Signal strength: <span id="signalStrength">-</span></div>
97
+ </div>
98
+ </div>
99
+
100
+ <div class="radar-container">
101
+ <canvas id="radarCanvas" width="600" height="600"></canvas>
102
+ </div>
103
+
104
+ <div class="device-list" id="deviceList"></div>
105
+
106
+ <script>
107
+ const radarCanvas = document.getElementById('radarCanvas');
108
+ const ctx = radarCanvas.getContext('2d');
109
+ const deviceList = document.getElementById('deviceList');
110
+ const startButton = document.getElementById('startScan');
111
+ const stopButton = document.getElementById('stopScan');
112
+ const deviceCount = document.getElementById('deviceCount');
113
+ const scanStatus = document.getElementById('scanStatus');
114
+ const lastUpdate = document.getElementById('lastUpdate');
115
+ const signalStrength = document.getElementById('signalStrength');
116
+
117
+ let isScanning = false;
118
+ let devices = new Map();
119
+ let angle = 0;
120
+
121
+ class BluetoothDevice {
122
+ constructor(device) {
123
+ this.id = device.id || Math.random().toString(36).substr(2, 9);
124
+ this.name = device.name || 'Unknown Device';
125
+ this.rssi = device.rssi || -100;
126
+ this.lastSeen = Date.now();
127
+ this.distance = this.calculateDistance();
128
+ this.angle = Math.random() * Math.PI * 2;
129
+ }
130
+
131
+ calculateDistance() {
132
+ // Rough distance estimation based on RSSI
133
+ const txPower = -59; // Calibrated transmit power at 1 meter
134
+ const ratio = this.rssi * 1.0 / txPower;
135
+ if (ratio < 1.0) {
136
+ return Math.pow(ratio, 10);
137
+ }
138
+ return 0.89976 * Math.pow(ratio, 7.7095) + 0.111;
139
+ }
140
+ }
141
+
142
+ function drawRadar() {
143
+ ctx.fillStyle = 'rgba(0, 0, 0, 0.1)';
144
+ ctx.fillRect(0, 0, radarCanvas.width, radarCanvas.height);
145
+
146
+ const centerX = radarCanvas.width / 2;
147
+ const centerY = radarCanvas.height / 2;
148
+ const radius = Math.min(centerX, centerY) - 10;
149
+
150
+ // Draw radar circles
151
+ for (let i = 1; i <= 4; i++) {
152
+ ctx.beginPath();
153
+ ctx.arc(centerX, centerY, radius * i / 4, 0, Math.PI * 2);
154
+ ctx.strokeStyle = 'rgba(0, 255, 0, 0.3)';
155
+ ctx.stroke();
156
+ }
157
+
158
+ // Draw scanning line
159
+ ctx.beginPath();
160
+ ctx.moveTo(centerX, centerY);
161
+ ctx.lineTo(
162
+ centerX + radius * Math.cos(angle),
163
+ centerY + radius * Math.sin(angle)
164
+ );
165
+ ctx.strokeStyle = '#00ff00';
166
+ ctx.stroke();
167
+
168
+ // Draw devices
169
+ devices.forEach(device => {
170
+ const deviceX = centerX + (device.distance * radius / 10) * Math.cos(device.angle);
171
+ const deviceY = centerY + (device.distance * radius / 10) * Math.sin(device.angle);
172
+
173
+ ctx.beginPath();
174
+ ctx.arc(deviceX, deviceY, 5, 0, Math.PI * 2);
175
+ ctx.fillStyle = '#00ff00';
176
+ ctx.fill();
177
+
178
+ // Draw device info
179
+ ctx.fillStyle = '#00ff00';
180
+ ctx.font = '12px monospace';
181
+ ctx.fillText(device.name, deviceX + 10, deviceY);
182
+ });
183
+
184
+ angle += 0.02;
185
+ if (angle >= Math.PI * 2) angle = 0;
186
+ }
187
+
188
+ function updateDeviceList() {
189
+ deviceList.innerHTML = '';
190
+ devices.forEach(device => {
191
+ const deviceElement = document.createElement('div');
192
+ deviceElement.className = 'device-item';
193
+ deviceElement.innerHTML = `
194
+ <span>Name: ${device.name}</span>
195
+ <span>RSSI: ${device.rssi}dBm</span>
196
+ <span>Distance: ~${device.distance.toFixed(2)}m</span>
197
+ <span>Last seen: ${Math.round((Date.now() - device.lastSeen)/1000)}s ago</span>
198
+ `;
199
+ deviceList.appendChild(deviceElement);
200
+ });
201
+ deviceCount.textContent = devices.size;
202
+ }
203
+
204
+ async function startScanning() {
205
+ try {
206
+ if (!navigator.bluetooth) {
207
+ alert('Bluetooth not supported in this browser!');
208
+ return;
209
+ }
210
+
211
+ isScanning = true;
212
+ scanStatus.textContent = 'Active';
213
+
214
+ const device = await navigator.bluetooth.requestDevice({
215
+ acceptAllDevices: true,
216
+ optionalServices: ['generic_access']
217
+ });
218
+
219
+ // Simulate continuous scanning with mock data
220
+ const scanInterval = setInterval(() => {
221
+ if (!isScanning) {
222
+ clearInterval(scanInterval);
223
+ return;
224
+ }
225
+
226
+ // Simulate finding new devices
227
+ if (Math.random() < 0.3) {
228
+ const mockDevice = new BluetoothDevice({
229
+ name: `Device_${Math.floor(Math.random() * 1000)}`,
230
+ rssi: -Math.floor(Math.random() * 100),
231
+ });
232
+ devices.set(mockDevice.id, mockDevice);
233
+ }
234
+
235
+ // Update existing devices
236
+ devices.forEach((device, id) => {
237
+ if (Date.now() - device.lastSeen > 10000) {
238
+ devices.delete(id);
239
+ } else {
240
+ device.rssi += Math.random() * 10 - 5;
241
+ device.distance = device.calculateDistance();
242
+ }
243
+ });
244
+
245
+ lastUpdate.textContent = new Date().toLocaleTimeString();
246
+ signalStrength.textContent = `${Math.floor(Math.random() * -100)}dBm`;
247
+ updateDeviceList();
248
+ }, 1000);
249
+
250
+ function animate() {
251
+ if (isScanning) {
252
+ drawRadar();
253
+ requestAnimationFrame(animate);
254
+ }
255
+ }
256
+ animate();
257
+
258
+ } catch (error) {
259
+ console.error('Error starting Bluetooth scan:', error);
260
+ scanStatus.textContent = 'Error';
261
+ }
262
+ }
263
+
264
+ function stopScanning() {
265
+ isScanning = false;
266
+ scanStatus.textContent = 'Inactive';
267
+ devices.clear();
268
+ updateDeviceList();
269
+ }
270
+
271
+ startButton.addEventListener('click', startScanning);
272
+ stopButton.addEventListener('click', stopScanning);
273
+
274
+ // Initial radar background
275
+ ctx.fillStyle = '#000';
276
+ ctx.fillRect(0, 0, radarCanvas.width, radarCanvas.height);
277
+ </script>
278
+ </body>
279
+ </html><script async data-explicit-opt-in="true" data-cookie-opt-in="true" src="https://vercel.live/_next-live/feedback/feedback.js"></script>