Skip to content
Snippets Groups Projects
Commit 16030d3b authored by Benedikt's avatar Benedikt
Browse files

influence condition render now uses correctly parsed units in header.

parent abba0688
Branches
No related tags found
No related merge requests found
......@@ -19,27 +19,28 @@ export class InfluenceConditionsRenderer {
conditions = [conditions];
}
conditions.forEach(condition => {
// Create collapsible section for each influence condition
// Create a collapsible section for each influence condition
const details = document.createElement('details');
details.style.border = '1px solid #ccc';
details.style.padding = '8px';
details.style.marginBottom = '10px';
// Summary always shows condition name and (if only one quantity) its value/unit
// Summary: always visible, shows the condition name and, if only one quantity exists, its value (plain text)
const summary = document.createElement('summary');
const condName = this._getText(condition['dcc:name']);
let summaryText = condName;
const quantities = this._getQuantities(condition);
if (quantities.length === 1) {
// If only one quantity, append its value and unit
// Use plain flag for summary display so that HTML is not double-escaped
const qty = quantities[0];
const valueStr = this._formatQuantity(qty);
summaryText += `: ${valueStr}`;
const valueStr = this._formatQuantity(qty, true);
summaryText += ` : ${valueStr}`;
}
summary.textContent = summaryText;
// Use innerHTML here so that any HTML markup in the unit is rendered
summary.innerHTML = summaryText;
details.appendChild(summary);
// Expanded content: description and quantities table
// Expanded content: condition description and quantities table
const contentDiv = document.createElement('div');
contentDiv.style.marginTop = '8px';
contentDiv.style.fontFamily = 'sans-serif';
......@@ -49,14 +50,16 @@ export class InfluenceConditionsRenderer {
p.textContent = descText;
contentDiv.appendChild(p);
}
// Render quantities table (if any)
// Render quantities table if available
if (condition['dcc:data'] && condition['dcc:data']['dcc:quantity']) {
let quantities = this._getQuantities(condition);
const table = document.createElement('table');
table.style.width = '100%';
table.style.borderCollapse = 'collapse';
// Header row
// Header row for the table
const headerRow = document.createElement('tr');
['Quantity', 'Value', 'Description'].forEach(text => {
['Quantity', 'Value', 'Description', 'Additional Info'].forEach(text => {
const th = document.createElement('th');
th.textContent = text;
th.style.border = '1px solid #ccc';
......@@ -64,39 +67,50 @@ export class InfluenceConditionsRenderer {
headerRow.appendChild(th);
});
table.appendChild(headerRow);
// Data rows for each quantity
this._getQuantities(condition).forEach(q => {
// Render each quantity as a row
quantities.forEach(q => {
const row = document.createElement('tr');
// Quantity name cell
// Column 1: Quantity name
const nameCell = document.createElement('td');
nameCell.style.border = '1px solid #ccc';
nameCell.style.padding = '4px';
nameCell.textContent = this._getText(q['dcc:name']);
row.appendChild(nameCell);
// Value cell with merged unit and uncertainty, plus tooltip for additional info
// Column 2: Value (with unit, uncertainty, merged) – rendered with HTML markup
const valueCell = document.createElement('td');
valueCell.style.border = '1px solid #ccc';
valueCell.style.padding = '4px';
const formattedValue = this._formatQuantity(q);
const formattedValue = this._formatQuantity(q, false);
valueCell.innerHTML = formattedValue;
// If there is additional (non-standard) data, add a tooltip
// If additional (non-standard) data exists, attach a tooltip
const additional = this._getAdditionalData(q);
if (Object.keys(additional).length > 0) {
const infoSpan = document.createElement('span');
infoSpan.textContent = '';
infoSpan.style.cursor = 'pointer';
infoSpan.style.color = '#888';
// Use the title attribute for a basic tooltip (or later replace with a dynamic tree)
infoSpan.title = JSON.stringify(additional, null, 2);
valueCell.appendChild(infoSpan);
}
row.appendChild(valueCell);
// Description cell
// Column 3: Description for the quantity
const descCell = document.createElement('td');
descCell.style.border = '1px solid #ccc';
descCell.style.padding = '4px';
descCell.textContent = this._getText(q['dcc:description']);
row.appendChild(descCell);
// Column 4: Additional info (if any)
const additionalCell = document.createElement('td');
additionalCell.style.border = '1px solid #ccc';
additionalCell.style.padding = '4px';
additionalCell.textContent = Object.keys(additional).length > 0 ? JSON.stringify(additional) : '';
row.appendChild(additionalCell);
table.appendChild(row);
});
contentDiv.appendChild(table);
......@@ -129,13 +143,14 @@ export class InfluenceConditionsRenderer {
return quantities;
}
// Helper: format a quantity’s value (supporting si:hybrid, si:realListXMLList, si:real, and dcc:noQuantity)
_formatQuantity(quantity) {
// Helper: format a quantity's value.
// If plain is true, render unit as plain text; otherwise use HTML from DSIUnit.
_formatQuantity(quantity, plain = false) {
// Handle noQuantity (categorical data)
if (quantity['dcc:noQuantity']) {
return this._getText(quantity['dcc:noQuantity']);
}
// Handle si:hybrid: if there are two si:real elements, render first normally and second in light gray.
// Handle si:hybrid block: map over si:real elements.
if (quantity['si:hybrid']) {
const hybrid = quantity['si:hybrid'];
let reals = hybrid['si:real'];
......@@ -148,7 +163,7 @@ export class InfluenceConditionsRenderer {
if (real['si:unit']) {
const rawUnit = real['si:unit'].trim();
const unitObj = new DSIUnit(rawUnit);
unit = unitObj.toHTML({ oneLine: true });
unit = plain ? unitObj.toHTML() : unitObj.toHTML({ oneLine: true });
}
let uncertainty = '';
if (real['si:measurementUncertaintyUnivariate'] &&
......@@ -161,11 +176,11 @@ export class InfluenceConditionsRenderer {
: `${value} ${unit}`;
if (index > 0) {
// For subsequent representations, wrap in a light gray span.
result = `<span style="color:lightgray;">${result}</span>`;
result = `<span style="color:lightgray;">(${result})</span>`;
}
return result;
});
return formatted.join(' / ');
return formatted.join(' ');
}
// Handle si:realListXMLList
if (quantity['si:realListXMLList']) {
......@@ -175,13 +190,14 @@ export class InfluenceConditionsRenderer {
if (rl['si:unitXMLList']) {
const rawUnit = rl['si:unitXMLList'].trim();
const unitObj = new DSIUnit(rawUnit);
unit = unitObj.toHTML({ oneLine: true });
unit = plain ? unitObj.toHTML() : unitObj.toHTML({ oneLine: true });
}
let uncertainty = [];
if (rl['si:measurementUncertaintyUnivariateXMLList'] &&
rl['si:measurementUncertaintyUnivariateXMLList']['si:expandedMUXMLList'] &&
rl['si:measurementUncertaintyUnivariateXMLList']['si:expandedMUXMLList']['si:valueExpandedMUXMLList']) {
uncertainty = rl['si:measurementUncertaintyUnivariateXMLList']['si:expandedMUXMLList']['si:valueExpandedMUXMLList'].trim().split(/\s+/);
uncertainty = rl['si:measurementUncertaintyUnivariateXMLList']['si:expandedMUXMLList']['si:valueExpandedMUXMLList']
.trim().split(/\s+/);
}
const formatted = values.map((val, i) => {
const unc = (uncertainty[i] !== undefined) ? uncertainty[i] : '';
......@@ -197,7 +213,7 @@ export class InfluenceConditionsRenderer {
if (real['si:unit']) {
const rawUnit = real['si:unit'].trim();
const unitObj = new DSIUnit(rawUnit);
unit = unitObj.toHTML({ oneLine: true });
unit = plain ? unitObj.toHTML() : unitObj.toHTML({ oneLine: true });
}
let uncertainty = '';
if (real['si:measurementUncertaintyUnivariate'] &&
......@@ -210,7 +226,7 @@ export class InfluenceConditionsRenderer {
return '';
}
// Helper: extract additional data (all keys except the common ones)
// Helper: extract additional data (all keys except the common ones) for tooltip purposes
_getAdditionalData(quantity) {
const exclude = ['dcc:name', 'dcc:description', 'si:real', 'si:realListXMLList', 'dcc:noQuantity'];
const additional = {};
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment