Change project structure

Makefile

@@ -4,21 +4,22 @@ GOCLEAN=$(GOCMD) clean
 GOTEST=$(GOCMD) test
 GOGET=$(GOCMD) get
 BINARY_NAME=drmdtool
+SRC_DIR=src
 
 all: test build
 
 build:
-	$(GOBUILD) -o $(BINARY_NAME) -v
+	cd $(SRC_DIR) && $(GOBUILD) -o ../$(BINARY_NAME) -v
 
 test:
-	$(GOTEST) -v ./...
+	cd $(SRC_DIR) && $(GOTEST) -v ./...
 
 clean:
 	$(GOCLEAN)
 	rm -f $(BINARY_NAME)
 
 run:
-	$(GOBUILD) -o $(BINARY_NAME) -v
+	cd $(SRC_DIR) && $(GOBUILD) -o ../$(BINARY_NAME) -v
 	./$(BINARY_NAME)
 
 deps:
@@ -28,12 +29,12 @@ deps:
 
 # Cross compilation
 build-linux:
-	CGO_ENABLED=0 GOOS=linux GOARCH=amd64 $(GOBUILD) -o $(BINARY_NAME)_linux -v
+	cd $(SRC_DIR) && CGO_ENABLED=0 GOOS=linux GOARCH=amd64 $(GOBUILD) -o ../$(BINARY_NAME)_linux -v
 
 build-windows:
-	CGO_ENABLED=0 GOOS=windows GOARCH=amd64 $(GOBUILD) -o $(BINARY_NAME).exe -v
+	cd $(SRC_DIR) && CGO_ENABLED=0 GOOS=windows GOARCH=amd64 $(GOBUILD) -o ../$(BINARY_NAME).exe -v
 
 build-mac:
-	CGO_ENABLED=0 GOOS=darwin GOARCH=amd64 $(GOBUILD) -o $(BINARY_NAME)_mac -v
+	cd $(SRC_DIR) && CGO_ENABLED=0 GOOS=darwin GOARCH=amd64 $(GOBUILD) -o ../$(BINARY_NAME)_mac -v
 
 .PHONY: all build test clean run deps build-linux build-windows build-mac

src/templates/stats

@@ -0,0 +1,114 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Network Stats</title>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+    <style>
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+            background-color: #1e1e1e;
+            color: #d4d4d4;
+            line-height: 1.6;
+            padding: 20px;
+            max-width: 800px;
+            margin: 0 auto;
+            box-sizing: border-box;
+        }
+        h1 {
+            border-bottom: 1px solid #333;
+            padding-bottom: 10px;
+        }
+        .stats-container {
+            display: flex;
+            justify-content: space-between;
+            margin-bottom: 20px;
+        }
+        .stat-box {
+            background-color: #2d2d2d;
+            border-radius: 4px;
+            padding: 10px;
+            width: 48%;
+        }
+        canvas {
+            background-color: #2d2d2d;
+            border-radius: 4px;
+            padding: 10px;
+            margin-bottom: 20px;
+        }
+    </style>
+</head>
+<body>
+    <h1>Network Stats</h1>
+    <div class="stats-container">
+        <div class="stat-box">
+            <h2>Upload Speed</h2>
+            <p id="upload-speed">0 MB/s</p>
+            <h2>Total Upload</h2>
+            <p id="total-upload">0 MB</p>
+        </div>
+        <div class="stat-box">
+            <h2>Download Speed</h2>
+            <p id="download-speed">0 MB/s</p>
+            <h2>Total Download</h2>
+            <p id="total-download">0 MB</p>
+        </div>
+    </div>
+    <canvas id="speed-chart"></canvas>
+    <script>
+        const ctx = document.getElementById('speed-chart').getContext('2d');
+        const chart = new Chart(ctx, {
+            type: 'line',
+            data: {
+                labels: [],
+                datasets: [{
+                    label: 'Upload Speed (MB/s)',
+                    borderColor: 'rgb(75, 192, 192)',
+                    data: []
+                }, {
+                    label: 'Download Speed (MB/s)',
+                    borderColor: 'rgb(255, 99, 132)',
+                    data: []
+                }]
+            },
+            options: {
+                responsive: true,
+                scales: {
+                    x: {
+                        type: 'time',
+                        time: {
+                            unit: 'second'
+                        }
+                    },
+                    y: {
+                        beginAtZero: true
+                    }
+                }
+            }
+        });
+
+        const ws = new WebSocket('ws://' + window.location.host + '/ws');
+        ws.onmessage = function(event) {
+            const data = JSON.parse(event.data);
+            document.getElementById('upload-speed').textContent = data.UploadSpeed.toFixed(2) + ' MB/s';
+            document.getElementById('download-speed').textContent = data.DownloadSpeed.toFixed(2) + ' MB/s';
+            document.getElementById('total-upload').textContent = (data.TotalUpload / (1024 * 1024)).toFixed(2) + ' MB';
+            document.getElementById('total-download').textContent = (data.TotalDownload / (1024 * 1024)).toFixed(2) + ' MB';
+
+            const now = new Date();
+            chart.data.labels.push(now);
+            chart.data.datasets[0].data.push(data.UploadSpeed);
+            chart.data.datasets[1].data.push(data.DownloadSpeed);
+
+            if (chart.data.labels.length > 60) {
+                chart.data.labels.shift();
+                chart.data.datasets[0].data.shift();
+                chart.data.datasets[1].data.shift();
+            }
+
+            chart.update();
+        };
+    </script>
+</body>
+</html>