-
Event Participation
+
Event Participation
Event history coming soon...
@@ -1026,6 +940,86 @@
// Store health records data for dynamic comparison
const healthRecordsData = @json($healthRecords->items());
+ // Radar chart variables
+ let radarChart = null;
+ const metricLabels = ['Weight', 'Body Fat', 'BMI', 'Body Water', 'Muscle Mass', 'Bone Mass', 'Visceral Fat', 'BMR', 'Protein', 'Body Age'];
+ const metricKeys = ['weight', 'body_fat_percentage', 'bmi', 'body_water_percentage', 'muscle_mass', 'bone_mass', 'visceral_fat', 'bmr', 'protein_percentage', 'body_age'];
+
+ // Function to create/update radar chart
+ function updateRadarChart(currentRecord, previousRecord) {
+ console.log('updateRadarChart called', currentRecord, previousRecord);
+ const ctx = document.getElementById('radarChart').getContext('2d');
+ console.log('ctx', ctx);
+
+ const currentData = metricKeys.map(key => currentRecord ? (currentRecord[key] || 0) : 0);
+ const previousData = metricKeys.map(key => previousRecord ? (previousRecord[key] || 0) : 0);
+ console.log('currentData', currentData);
+ console.log('previousData', previousData);
+ console.log('window.Chart', window.Chart);
+
+ if (radarChart) {
+ radarChart.destroy();
+ }
+
+ radarChart = new window.Chart(ctx, {
+ type: 'radar',
+ data: {
+ labels: metricLabels,
+ datasets: [
+ {
+ label: 'From Record',
+ data: previousData,
+ borderColor: 'rgba(54, 162, 235, 1)',
+ backgroundColor: 'rgba(54, 162, 235, 0.2)',
+ pointBackgroundColor: 'rgba(54, 162, 235, 1)',
+ pointBorderColor: '#fff',
+ pointHoverBackgroundColor: '#fff',
+ pointHoverBorderColor: 'rgba(54, 162, 235, 1)',
+ },
+ {
+ label: 'To Record',
+ data: currentData,
+ borderColor: 'rgba(255, 99, 132, 1)',
+ backgroundColor: 'rgba(255, 99, 132, 0.2)',
+ pointBackgroundColor: 'rgba(255, 99, 132, 1)',
+ pointBorderColor: '#fff',
+ pointHoverBackgroundColor: '#fff',
+ pointHoverBorderColor: 'rgba(255, 99, 132, 1)',
+ }
+ ]
+ },
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ plugins: {
+ legend: {
+ position: 'top',
+ },
+ tooltip: {
+ callbacks: {
+ label: function(context) {
+ let label = context.dataset.label || '';
+ if (label) {
+ label += ': ';
+ }
+ label += context.parsed.r;
+ return label;
+ }
+ }
+ }
+ },
+ scales: {
+ r: {
+ beginAtZero: true,
+ ticks: {
+ stepSize: 10
+ }
+ }
+ }
+ }
+ });
+ }
+
// Function to reset modal for adding new record
function resetHealthModal() {
document.getElementById('healthUpdateModalLabel').textContent = 'Add Health Update';
@@ -1115,6 +1109,9 @@
updateTableRow('bmr', currentRecord.bmr, previousRecord.bmr);
updateTableRow('protein', currentRecord.protein_percentage, previousRecord.protein_percentage);
updateTableRow('body_age', currentRecord.body_age, previousRecord.body_age);
+
+ // Update the radar chart
+ updateRadarChart(currentRecord, previousRecord);
}
function calculateTimeDifference(date1, date2) {
@@ -1155,19 +1152,19 @@
// Update previous value
if (metric === 'weight' || metric === 'muscle_mass' || metric === 'bone_mass') {
- cells[3].textContent = previousValue ? `${previousValue}kg` : 'N/A';
+ cells[2].textContent = previousValue ? `${previousValue}kg` : 'N/A';
} else if (metric === 'body_fat' || metric === 'body_water' || metric === 'protein') {
- cells[3].textContent = previousValue ? `${previousValue}%` : 'N/A';
+ cells[2].textContent = previousValue ? `${previousValue}%` : 'N/A';
} else if (metric === 'bmr') {
- cells[3].textContent = previousValue ? `${previousValue}cal` : 'N/A';
+ cells[2].textContent = previousValue ? `${previousValue}cal` : 'N/A';
} else if (metric === 'body_age') {
- cells[3].textContent = previousValue ? `${previousValue}yrs` : 'N/A';
+ cells[2].textContent = previousValue ? `${previousValue}yrs` : 'N/A';
} else {
- cells[3].textContent = previousValue || 'N/A';
+ cells[2].textContent = previousValue || 'N/A';
}
// Update change cell
- const changeCell = cells[2];
+ const changeCell = cells[3];
if (currentValue && previousValue) {
const change = currentValue - previousValue;
let arrow = '';
@@ -1195,7 +1192,25 @@
currentDateSelect.addEventListener('change', updateComparisonTable);
previousDateSelect.addEventListener('change', updateComparisonTable);
+
+ // Initialize chart with default values
+ updateComparisonTable();
}
+
+ // Initialize radar chart with data from data attributes after a delay to ensure tab is shown
+ setTimeout(() => {
+ const radarCanvas = document.getElementById('radarChart');
+ if (radarCanvas) {
+ const currentData = radarCanvas.dataset.current ? JSON.parse(radarCanvas.dataset.current) : null;
+ const previousData = radarCanvas.dataset.previous ? JSON.parse(radarCanvas.dataset.previous) : null;
+ if (currentData && previousData) {
+ updateRadarChart(currentData, previousData);
+ } else {
+ // Initialize with empty chart or message
+ updateRadarChart(null, null);
+ }
+ }
+ }, 1000);
});
@endsection
diff --git a/routes/web.php b/routes/web.php
index 57e489e..8304983 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -74,7 +74,7 @@ Route::post('/email/verification-notification', function (Request $request) {
})->middleware(['auth', 'throttle:6,1'])->name('verification.send');
// Explore routes (accessible to authenticated users)
-Route::middleware(['auth', 'verified'])->group(function () {
+Route::middleware(['auth'])->group(function () {
Route::get('/explore', [ClubController::class, 'index'])->name('clubs.explore');
Route::get('/clubs/nearby', [ClubController::class, 'nearby'])->name('clubs.nearby');
Route::get('/clubs/all', [ClubController::class, 'all'])->name('clubs.all');