r/demeter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs: add project description and server setup instructions to README

Browse Source
This commit is contained in:
Robert
2026-03-21 18:25:35 +00:00
parent c81815a83d
commit 6115a065c7
36 changed files with 4003 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
server/templates/dashboard.html Normal file
View File

@@ -0,0 +1,141 @@
{% extends "base.html" %}
{% block title %}Dashboard — Demeter IoT{% endblock %}
{% block content %}
<!-- Stats bar -->
<div class="stats shadow w-full mb-6 bg-base-100">
<div class="stat">
<div class="stat-title">Devices</div>
<div class="stat-value" id="stat-total">{{ devices|length }}</div>
<div class="stat-desc">Registered</div>
</div>
<div class="stat">
<div class="stat-title">Online</div>
<div class="stat-value text-success" id="stat-online">{{ devices|selectattr('online')|list|length }}</div>
<div class="stat-desc">Connected via CoAP</div>
</div>
<div class="stat">
<div class="stat-title">Subscriptions</div>
<div class="stat-value text-info" id="stat-subs">{{ active_subscriptions }}</div>
<div class="stat-desc">Active Observe</div>
</div>
</div>
<!-- Device cards grid -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4" id="devices-grid">
{% for device in devices %}
<div class="card bg-base-100 shadow-xl" id="card-{{ device.config.id }}">
<div class="card-body">
<!-- Header -->
<div class="flex items-center justify-between">
<h2 class="card-title text-lg">{{ device.config.name }}</h2>
{% if device.online %}
<div class="badge badge-success gap-1">
<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3" fill="currentColor" viewBox="0 0 24 24">
<circle cx="12" cy="12" r="10"/>
</svg>
Online
</div>
{% else %}
<div class="badge badge-error gap-1">
<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3" fill="currentColor" viewBox="0 0 24 24">
<circle cx="12" cy="12" r="10"/>
</svg>
Offline
</div>
{% endif %}
</div>
<p class="text-sm opacity-60">{{ device.config.ip }}:{{ device.config.port }} &middot; {{ device.config.id }}</p>
<div class="divider my-1"></div>
<!-- Sensor readings -->
{% if device.readings %}
{% for uri, reading in device.readings.items() %}
<div class="flex justify-between items-center py-1">
<span class="text-sm font-medium">
{% if 'soil_moisture' in uri %}
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline text-success" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707" /></svg>
Soil Moisture
{% elif 'temperature' in uri %}
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline text-warning" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" /></svg>
Temperature
{% elif 'water_level' in uri %}
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline text-info" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z" /></svg>
Water Level
{% elif 'trigger' in uri %}
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline text-error" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" /></svg>
Trigger
{% else %}
{{ uri }}
{% endif %}
</span>
<span class="font-mono text-lg {% if reading.stale %}opacity-40{% endif %}">
{% if reading.value is not none %}
{{ reading.value }}
<span class="text-xs opacity-60">{{ reading.unit }}</span>
{% else %}
<span class="opacity-40">—</span>
{% endif %}
</span>
</div>
{% if 'soil_moisture' in uri or 'water_level' in uri %}
<progress
class="progress {% if 'soil_moisture' in uri %}progress-success{% else %}progress-info{% endif %} w-full h-2"
value="{{ reading.value or 0 }}"
max="100">
</progress>
{% endif %}
{% endfor %}
{% else %}
<p class="text-sm opacity-40 italic">No readings yet</p>
{% endif %}
<!-- Card actions -->
<div class="card-actions justify-end mt-2">
<a href="/dashboard/devices/{{ device.config.id }}" class="btn btn-sm btn-outline">Details</a>
</div>
</div>
</div>
{% endfor %}
{% if not devices %}
<div class="col-span-full">
<div class="alert alert-info">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
<span>No devices configured. Edit <code>config/devices.yaml</code> and restart the server.</span>
</div>
</div>
{% endif %}
</div>
{% endblock %}
{% block scripts %}
<script>
// Auto-refresh readings every 5 seconds
setInterval(async () => {
try {
const resp = await fetch('/dashboard/api/readings');
const data = await resp.json();
// Update online count
let online = 0;
for (const [id, dev] of Object.entries(data.devices)) {
if (dev.online) online++;
// Update readings in each card
// (Full re-render would be more robust, but this is POC)
}
const statOnline = document.getElementById('stat-online');
if (statOnline) statOnline.textContent = online;
} catch (e) {
console.warn('Auto-refresh failed:', e);
}
}, 5000);
</script>
{% endblock %}