Code_Progress_Hub/analytics_backup.php at main · harshitahegde/Code_Progress_Hub · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<?php
session_start();
include 'db_connect.php';

if (!isset($_SESSION['user_id'])) {
    header("Location: login.php");
    exit();
}

$user_id = $_SESSION['user_id'];

// Summary Stats
$sql = "SELECT
            SUM(CASE WHEN status='solved' THEN 1 ELSE 0 END) AS solved,
            SUM(CASE WHEN status='unsolved' THEN 1 ELSE 0 END) AS unsolved,
            SUM(time_taken) AS total_time
        FROM submissions WHERE user_id = ?";
$stmt = $conn->prepare($sql);
$stmt->bind_param("i", $user_id);
$stmt->execute();
$summary = $stmt->get_result()->fetch_assoc();

$solved = $summary['solved'] ?? 0;
$unsolved = $summary['unsolved'] ?? 0;

// Solved by category
$sql2 = "SELECT c.category_name, COUNT(*) as count
         FROM submissions s
         JOIN problems p ON s.problem_id = p.problem_id
         JOIN categories c ON p.category_id = c.category_id
         WHERE s.user_id = ? AND s.status = 'solved'
         GROUP BY c.category_name";
$stmt2 = $conn->prepare($sql2);
$stmt2->bind_param("i", $user_id);
$stmt2->execute();
$categories = $stmt2->get_result();

$category_labels = [];
$category_counts = [];
while ($row = $categories->fetch_assoc()) {
    $category_labels[] = $row['category_name'];
    $category_counts[] = $row['count'];
}
?>

<!DOCTYPE html>
<html>
<head>
    <title>Analytics</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body class="bg-light">
<div class="container mt-4">
    <h2>My Analytics</h2>

    <div class="row mt-4">
        <div class="col-md-4">
            <div class="card bg-success text-white">
                <div class="card-body">
                    <h5>Total Solved</h5>
                    <p class="fs-4"><?= $solved ?></p>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card bg-danger text-white">
                <div class="card-body">
                    <h5>Total Unsolved</h5>
                    <p class="fs-4"><?= $unsolved ?></p>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card bg-info text-white">
                <div class="card-body">
                    <h5>Total Time Spent</h5>
                    <p class="fs-4"><?= $summary['total_time'] ?? 0 ?> mins</p>
                </div>
            </div>
        </div>
    </div>

    <h4 class="mt-5">Problems Solved by Category</h4>
    <canvas id="categoryChart" height="100"></canvas>

    <h4 class="mt-5">Medium vs Easy vs hard</h4>
    <canvas id="pieChart" height="100"></canvas>

    <a href="dashboard.php" class="btn btn-secondary mt-4">Back to Dashboard</a>
</div>

<script>
const categoryCtx = document.getElementById('categoryChart').getContext('2d');
new Chart(categoryCtx, {
    type: 'bar',
    data: {
        labels: <?= json_encode($category_labels) ?>,
        datasets: [{
            label: 'Problems Solved',
            data: <?= json_encode($category_counts) ?>,
            backgroundColor: 'rgba(54, 162, 235, 0.7)',
            borderColor: 'rgba(54, 162, 235, 1)',
            borderWidth: 1
        }]
    },
    options: {
        responsive: true,
        scales: {
            y: {
                beginAtZero: true,
                precision: 0
            }
        }
    }
});

const pieCtx = document.getElementById('pieChart').getContext('2d');
new Chart(pieCtx, {
    type: 'pie',
    data: {
        labels: ['solved', 'unsolved'],
        datasets: [{
            data: [<?= $solved ?>, <?= $unsolved ?>],
            backgroundColor: ['#28a745', '#dc3545']
        }]
    },
    options: {
        responsive: true,
        plugins: {
            legend: {
                position: 'bottom'
            }
        }
    }
});
</script>
</body>
</html>