serversdown/terra-view
1
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

Add file and session lists to project dashboard

Browse Source 
- Created a new template for displaying a list of data files in `file_list.html`, including file details and actions for downloading and viewing file details.
- Added a new template for displaying recording sessions in `session_list.html`, featuring session status, details, and action buttons for stopping recordings and viewing session details.
- Introduced a legacy dashboard template `slm_legacy_dashboard.html` for sound level meter control, including a live view panel and configuration modal with dynamic content loading.
This commit is contained in:
serversdwn
2026-01-13 01:32:03 +00:00
parent 04c66bdf9c
commit 98ee9d7cea
8 changed files with 1112 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
templates/partials/projects/session_list.html Normal file
View File

@@ -0,0 +1,107 @@
<!-- Recording Sessions List -->
{% if sessions %}
<div class="space-y-4">
{% for item in sessions %}
<div class="border border-gray-200 dark:border-gray-700 rounded-lg p-4 hover:bg-gray-50 dark:hover:bg-gray-800/50 transition-colors">
<div class="flex items-start justify-between gap-3">
<div class="min-w-0 flex-1">
<div class="flex items-center gap-3 mb-2">
<h4 class="font-semibold text-gray-900 dark:text-white">
Session {{ item.session.id[:8] }}...
</h4>
{% if item.session.status == 'recording' %}
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300 rounded-full flex items-center">
<span class="w-2 h-2 bg-red-500 rounded-full mr-1.5 animate-pulse"></span>
Recording
</span>
{% elif item.session.status == 'completed' %}
<span class="px-2 py-1 text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300 rounded-full">
Completed
</span>
{% elif item.session.status == 'paused' %}
<span class="px-2 py-1 text-xs font-medium bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-300 rounded-full">
Paused
</span>
{% elif item.session.status == 'failed' %}
<span class="px-2 py-1 text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300 rounded-full">
Failed
</span>
{% endif %}
</div>
<div class="grid grid-cols-2 gap-3 text-sm text-gray-600 dark:text-gray-400">
{% if item.unit %}
<div>
<span class="text-xs text-gray-500 dark:text-gray-500">Unit:</span>
<a href="/slm/{{ item.unit.id }}" class="text-seismo-orange hover:text-seismo-navy font-medium ml-1">
{{ item.unit.id }}
</a>
</div>
{% endif %}
<div>
<span class="text-xs text-gray-500">Started:</span>
<span class="ml-1">{{ item.session.started_at.strftime('%Y-%m-%d %H:%M') if item.session.started_at else 'N/A' }}</span>
</div>
{% if item.session.ended_at %}
<div>
<span class="text-xs text-gray-500">Ended:</span>
<span class="ml-1">{{ item.session.ended_at.strftime('%Y-%m-%d %H:%M') }}</span>
</div>
{% endif %}
{% if item.session.duration_seconds %}
<div>
<span class="text-xs text-gray-500">Duration:</span>
<span class="ml-1">{{ (item.session.duration_seconds // 3600) }}h {{ ((item.session.duration_seconds % 3600) // 60) }}m</span>
</div>
{% endif %}
</div>
{% if item.session.notes %}
<p class="text-xs text-gray-500 dark:text-gray-400 mt-2">
{{ item.session.notes }}
</p>
{% endif %}
</div>
<div class="flex items-center gap-2">
{% if item.session.status == 'recording' %}
<button onclick="stopRecording('{{ item.session.id }}')"
class="px-3 py-1 text-xs bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors">
Stop
</button>
{% endif %}
<button onclick="viewSession('{{ item.session.id }}')"
class="px-3 py-1 text-xs bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 rounded-lg hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors">
Details
</button>
</div>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="text-center py-12">
<svg class="w-16 h-16 mx-auto mb-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19V6l12-3v13M9 19c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zm12-3c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zM9 10l12-3"></path>
</svg>
<p class="text-gray-500 dark:text-gray-400 mb-2">No recording sessions yet</p>
<p class="text-sm text-gray-400 dark:text-gray-500">Schedule a session to get started</p>
</div>
{% endif %}
<script>
function viewSession(sessionId) {
// TODO: Implement session detail modal or page
alert('Session details coming soon: ' + sessionId);
}
function stopRecording(sessionId) {
if (!confirm('Stop this recording session?')) return;
// TODO: Implement stop recording API call
alert('Stop recording API coming soon for session: ' + sessionId);
}
</script>