Merge feature/measurements-wide-view into demo/example-data

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-04 12:30:13 +00:00
7 changed files with 61 additions and 119 deletions

View File

@@ -22,98 +22,6 @@ function groupMeasurements() {
});
}
function buildWideTable() {
var tbody = document.getElementById('measurements');
var wideContainer = document.getElementById('measurements-wide');
if (!tbody || !wideContainer) return;
var rows = Array.from(tbody.querySelectorAll('tr[data-taken-at]'));
if (rows.length === 0) { wideContainer.innerHTML = ''; return; }
// Unique quantities in alphabetical order
var qOrder = [], qSeen = new Set();
rows.forEach(function(r) {
var id = r.dataset.quantityId;
if (id && !qSeen.has(id)) { qSeen.add(id); qOrder.push({id: id, name: r.dataset.quantityName}); }
});
qOrder.sort(function(a, b) { return a.name.localeCompare(b.name); });
// Group rows by taken_at, preserving order
var groups = [], groupMap = new Map();
rows.forEach(function(r) {
var key = r.dataset.takenAt || '';
if (!groupMap.has(key)) { var g = {rows: []}; groups.push(g); groupMap.set(key, g); }
groupMap.get(key).rows.push(r);
});
var takenAtHeader = (document.querySelector('[data-column="taken-at"]') || {}).textContent || '';
var createdAtHeader = (document.querySelector('[data-column="created-at"]') || {}).textContent || '';
var table = document.createElement('table');
table.className = 'items-table';
// Header
var thead = table.createTHead();
var hrow = thead.insertRow();
[takenAtHeader].concat(qOrder.map(function(q) { return q.name; })).concat([createdAtHeader]).forEach(function(text) {
var th = document.createElement('th');
th.textContent = text;
hrow.appendChild(th);
});
// Body
var tbodyEl = table.createTBody();
groups.forEach(function(group) {
var tr = tbodyEl.insertRow();
// Taken at
var tdTime = tr.insertCell();
var takenAtEl = group.rows[0].querySelector('.taken-at');
tdTime.textContent = takenAtEl ? takenAtEl.textContent : '';
// One cell per quantity
qOrder.forEach(function(q) {
var td = tr.insertCell();
var readoutRow = group.rows.find(function(r) { return r.dataset.quantityId === q.id; });
if (readoutRow) {
td.className = 'ralign';
var wrap = document.createElement('span');
wrap.className = 'wide-cell';
var editLink = readoutRow.querySelector('a.link');
if (editLink) {
var editUrl = editLink.href + (editLink.href.includes('?') ? '&' : '?') + 'view=wide';
var btn = document.createElement('button');
btn.className = 'link';
btn.type = 'button';
btn.dataset.editUrl = editUrl;
btn.addEventListener('click', function() { editMeasurementWide(this.dataset.editUrl); this.blur(); });
btn.textContent = readoutRow.dataset.value;
wrap.appendChild(btn);
wrap.appendChild(document.createTextNode('\u00a0' + readoutRow.dataset.unit));
} else {
wrap.appendChild(document.createTextNode(readoutRow.dataset.value + '\u00a0' + readoutRow.dataset.unit));
}
var srcActions = readoutRow.querySelector('td.flex');
if (srcActions) srcActions.querySelectorAll('form').forEach(function(f) {
var cloned = f.cloneNode(true);
var span = cloned.querySelector('button span');
if (span) span.remove();
wrap.appendChild(cloned);
});
td.appendChild(wrap);
}
});
// Created at (from first row of group)
var tdCreated = tr.insertCell();
var createdAtEl = group.rows[0].querySelector('.created-at');
tdCreated.textContent = createdAtEl ? createdAtEl.textContent : '';
});
wideContainer.innerHTML = '';
wideContainer.appendChild(table);
}
function buildCharts() {
var container = document.getElementById('measurements-charts');
@@ -169,7 +77,6 @@ function getMeasurementsView() {
function applyMeasurementsView(view) {
document.body.dataset.measurementsView = view;
if (view === 'wide') buildWideTable();
}
function setMeasurementsView(view) {
@@ -189,8 +96,6 @@ document.addEventListener('turbo:load', function() {
applyMeasurementsView(getMeasurementsView());
new MutationObserver(function() {
groupMeasurements();
var view = getMeasurementsView();
if (view === 'wide') buildWideTable();
}).observe(tbody, {
childList: true, subtree: true,
attributes: true, attributeFilter: ['style']
@@ -225,26 +130,6 @@ window.detailsObserver = new MutationObserver((mutations) => {
mutations[0].target.dispatchEvent(new Event('change', {bubbles: true}))
});
function editMeasurementWide(url) {
fetch(url, {
headers: {
'Accept': 'text/vnd.turbo-stream.html',
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(response => response.text())
.then(html => {
Turbo.renderStreamMessage(html);
requestAnimationFrame(() => {
var panel = document.getElementById('measurement_edit_form');
if (panel && panel.firstElementChild) {
panel.scrollIntoView({behavior: 'smooth', block: 'nearest'});
}
});
})
.catch(err => console.error('editMeasurementWide failed:', err));
}
window.editMeasurementWide = editMeasurementWide
function readoutUnitChanged(select) {
var button = select.closest('tr').querySelector('.set-default-unit');