Peak Detection
This commit is contained in:
parent
6e70e1495e
commit
a1416b232b
20 changed files with 653 additions and 0 deletions
|
|
@ -159,6 +159,23 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Peaks Card -->
|
||||
<div class="row mb-4" id="peaksSection" style="display: none;">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">
|
||||
<i class="bi bi-triangle"></i> Peaks
|
||||
</h5>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<ul class="list-group list-group-flush" id="peaksList">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Weather Card -->
|
||||
<div class="row mb-4" id="weatherSection" style="display: none;">
|
||||
<div class="col-12">
|
||||
|
|
@ -626,6 +643,18 @@
|
|||
loadWeatherData(activity.id);
|
||||
}
|
||||
|
||||
// Render peaks
|
||||
if (activity.peaks && activity.peaks.length > 0) {
|
||||
const peaksList = document.getElementById('peaksList');
|
||||
peaksList.innerHTML = activity.peaks.map(peak => {
|
||||
const content = peak.wikipedia
|
||||
? `<a href="${peak.wikipedia}" target="_blank" rel="noopener">${peak.name} <i class="bi bi-box-arrow-up-right small"></i></a>`
|
||||
: peak.name;
|
||||
return `<li class="list-group-item">${content}</li>`;
|
||||
}).join('');
|
||||
document.getElementById('peaksSection').style.display = 'block';
|
||||
}
|
||||
|
||||
// Render elevation chart if data exists
|
||||
if (activity.trackPoints && activity.trackPoints.length > 0) {
|
||||
// Store track points globally for map marker updates
|
||||
|
|
|
|||
|
|
@ -92,6 +92,20 @@
|
|||
</div>
|
||||
|
||||
<!-- Public Activities -->
|
||||
<!-- Visited Peaks -->
|
||||
<div class="card mb-4" id="peaksSection" style="display: none;">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">
|
||||
<i class="bi bi-triangle"></i> Visited Peaks
|
||||
<span class="badge bg-secondary ms-2" id="peaksCount">0</span>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<ul class="list-group list-group-flush" id="peaksList">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">
|
||||
|
|
@ -149,6 +163,7 @@
|
|||
.then(user => {
|
||||
renderProfile(user);
|
||||
loadPublicActivities(user.id);
|
||||
loadPeaks();
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading profile:', error);
|
||||
|
|
@ -298,6 +313,35 @@
|
|||
|
||||
let currentPage = 0;
|
||||
|
||||
async function loadPeaks() {
|
||||
try {
|
||||
const response = await fetch(`/api/users/${targetUsername}/peaks`);
|
||||
if (response.ok) {
|
||||
const peaks = await response.json();
|
||||
if (peaks.length > 0) {
|
||||
document.getElementById('peaksCount').textContent = peaks.length;
|
||||
const list = document.getElementById('peaksList');
|
||||
list.innerHTML = peaks.map(peak => {
|
||||
const nameHtml = peak.wikipedia
|
||||
? `<a href="${peak.wikipedia}" target="_blank" rel="noopener">${peak.name} <i class="bi bi-box-arrow-up-right small"></i></a>`
|
||||
: peak.name;
|
||||
const visits = peak.visitCount > 1 ? `${peak.visitCount} visits` : '1 visit';
|
||||
const activityLink = peak.latestActivityId
|
||||
? ` · <a href="/activities/${peak.latestActivityId}">latest activity</a>`
|
||||
: '';
|
||||
return `<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
<span>${nameHtml}</span>
|
||||
<span class="text-muted small">${visits}${activityLink}</span>
|
||||
</li>`;
|
||||
}).join('');
|
||||
document.getElementById('peaksSection').style.display = 'block';
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error loading peaks:', error);
|
||||
}
|
||||
}
|
||||
|
||||
async function loadPublicActivities(userId) {
|
||||
try {
|
||||
const response = await fetch(`/api/activities/user/${targetUsername}?page=${currentPage}&size=10`);
|
||||
|
|
|
|||
|
|
@ -89,6 +89,20 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Visited Peaks -->
|
||||
<div class="card mb-4" id="peaksSection" style="display: none;">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0">
|
||||
<i class="bi bi-triangle"></i> Visited Peaks
|
||||
<span class="badge bg-secondary ms-2" id="peaksCount">0</span>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<ul class="list-group list-group-flush" id="peaksList">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Recent Activities -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
|
|
@ -150,6 +164,7 @@
|
|||
const user = await response.json();
|
||||
renderProfile(user);
|
||||
loadRecentActivities();
|
||||
loadPeaks(user.username);
|
||||
} else {
|
||||
throw new Error('Failed to load profile');
|
||||
}
|
||||
|
|
@ -205,6 +220,35 @@
|
|||
// Stats (activities count will be loaded separately)
|
||||
}
|
||||
|
||||
async function loadPeaks(username) {
|
||||
try {
|
||||
const response = await fetch(`/api/users/${username}/peaks`);
|
||||
if (response.ok) {
|
||||
const peaks = await response.json();
|
||||
if (peaks.length > 0) {
|
||||
document.getElementById('peaksCount').textContent = peaks.length;
|
||||
const list = document.getElementById('peaksList');
|
||||
list.innerHTML = peaks.map(peak => {
|
||||
const nameHtml = peak.wikipedia
|
||||
? `<a href="${peak.wikipedia}" target="_blank" rel="noopener">${peak.name} <i class="bi bi-box-arrow-up-right small"></i></a>`
|
||||
: peak.name;
|
||||
const visits = peak.visitCount > 1 ? `${peak.visitCount} visits` : '1 visit';
|
||||
const activityLink = peak.latestActivityId
|
||||
? ` · <a href="/activities/${peak.latestActivityId}">latest activity</a>`
|
||||
: '';
|
||||
return `<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
<span>${nameHtml}</span>
|
||||
<span class="text-muted small">${visits}${activityLink}</span>
|
||||
</li>`;
|
||||
}).join('');
|
||||
document.getElementById('peaksSection').style.display = 'block';
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error loading peaks:', error);
|
||||
}
|
||||
}
|
||||
|
||||
async function loadRecentActivities() {
|
||||
try {
|
||||
const response = await FitPubAuth.authenticatedFetch('/api/activities?page=0&size=5');
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue