Added xsd support
This commit is contained in:
@ -128,7 +128,13 @@
|
||||
.field-row {
|
||||
display: flex;
|
||||
margin: 8px 0;
|
||||
padding: 8px 0;
|
||||
align-items: flex-start;
|
||||
border-bottom: 1px dotted #e0e0e0;
|
||||
}
|
||||
|
||||
.field-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.field-label {
|
||||
@ -145,6 +151,20 @@
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/* Style for multi-value fields */
|
||||
.field-value-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.field-value-item {
|
||||
padding: 4px 8px;
|
||||
background: #f5f5f5;
|
||||
border-left: 2px solid #007bff;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.element-pair {
|
||||
position: relative;
|
||||
}
|
||||
@ -412,6 +432,10 @@
|
||||
background: linear-gradient(90deg, transparent, #4fc3f7, transparent);
|
||||
}
|
||||
|
||||
.field-row {
|
||||
border-bottom-color: #444;
|
||||
}
|
||||
|
||||
.field-label {
|
||||
color: #64b5f6;
|
||||
}
|
||||
@ -420,6 +444,11 @@
|
||||
color: #e0e0e0;
|
||||
}
|
||||
|
||||
.field-value-item {
|
||||
background: #3d3d3d;
|
||||
border-left-color: #4fc3f7;
|
||||
}
|
||||
|
||||
.element-index {
|
||||
background: #4fc3f7;
|
||||
}
|
||||
@ -1012,12 +1041,16 @@
|
||||
const siblings = Array.from(element.children).filter(c => c.tagName === fieldName);
|
||||
|
||||
if (siblings.length > 1) {
|
||||
// For multi-value fields, combine them
|
||||
// For multi-value fields, create a list
|
||||
const values = siblings.map(s => formatElementContent(s)).filter(v => v && v !== '<em>(empty)</em>');
|
||||
if (values.length > 0) {
|
||||
// Create a formatted list of values
|
||||
const listHtml = '<div class="field-value-list">' +
|
||||
values.map(v => `<div class="field-value-item">${v}</div>`).join('') +
|
||||
'</div>';
|
||||
fields.push({
|
||||
name: fieldName,
|
||||
value: values.join(', ')
|
||||
value: listHtml
|
||||
});
|
||||
}
|
||||
processedTags.add(fieldName);
|
||||
@ -1155,124 +1188,12 @@
|
||||
}
|
||||
|
||||
function formatElementContent(element) {
|
||||
let html = '';
|
||||
// Simply get the inner HTML of the element, which preserves all HTML formatting
|
||||
const innerHTML = element.innerHTML;
|
||||
|
||||
element.childNodes.forEach(node => {
|
||||
if (node.nodeType === Node.TEXT_NODE) {
|
||||
html += node.textContent;
|
||||
} else if (node.nodeType === Node.ELEMENT_NODE) {
|
||||
// Format known tags
|
||||
const tagName = node.tagName.toLowerCase();
|
||||
const content = formatElementContent(node);
|
||||
|
||||
// Apply appropriate formatting based on tag
|
||||
switch(tagName) {
|
||||
case 'strong':
|
||||
case 'b':
|
||||
html += `<strong>${content}</strong>`;
|
||||
break;
|
||||
case 'em':
|
||||
case 'i':
|
||||
html += `<em>${content}</em>`;
|
||||
break;
|
||||
case 'u':
|
||||
html += `<u>${content}</u>`;
|
||||
break;
|
||||
case 'del':
|
||||
case 'strike':
|
||||
html += `<del>${content}</del>`;
|
||||
break;
|
||||
case 'sup':
|
||||
html += `<sup>${content}</sup>`;
|
||||
break;
|
||||
case 'sub':
|
||||
html += `<sub>${content}</sub>`;
|
||||
break;
|
||||
case 'mark':
|
||||
case 'highlight':
|
||||
html += `<mark>${content}</mark>`;
|
||||
break;
|
||||
case 'small':
|
||||
html += `<small>${content}</small>`;
|
||||
break;
|
||||
case 'code':
|
||||
html += `<code>${content}</code>`;
|
||||
break;
|
||||
case 'kbd':
|
||||
html += `<kbd>${content}</kbd>`;
|
||||
break;
|
||||
case 'samp':
|
||||
html += `<samp>${content}</samp>`;
|
||||
break;
|
||||
case 'var':
|
||||
html += `<var>${content}</var>`;
|
||||
break;
|
||||
case 'pre':
|
||||
html += `<pre>${content}</pre>`;
|
||||
break;
|
||||
case 'critical':
|
||||
html += `<span class="critical">${content}</span>`;
|
||||
break;
|
||||
case 'optional':
|
||||
html += `<span class="optional">${content}</span>`;
|
||||
break;
|
||||
case 'deprecated':
|
||||
html += `<span class="deprecated">${content}</span>`;
|
||||
break;
|
||||
case 'todo':
|
||||
html += `<span class="todo">${content}</span>`;
|
||||
break;
|
||||
case 'value':
|
||||
html += `<span class="value">${content}</span>`;
|
||||
break;
|
||||
case 'unit':
|
||||
html += `<span class="unit">${content}</span>`;
|
||||
break;
|
||||
case 'term':
|
||||
html += `<span class="term">${content}</span>`;
|
||||
break;
|
||||
case 'acronym':
|
||||
html += `<span class="acronym">${content}</span>`;
|
||||
break;
|
||||
case 'version':
|
||||
html += `<span class="version">${content}</span>`;
|
||||
break;
|
||||
case 'br':
|
||||
html += '<br>';
|
||||
break;
|
||||
case 'hr':
|
||||
html += '<hr>';
|
||||
break;
|
||||
case 'ul':
|
||||
html += `<ul>${content}</ul>`;
|
||||
break;
|
||||
case 'ol':
|
||||
html += `<ol>${content}</ol>`;
|
||||
break;
|
||||
case 'li':
|
||||
html += `<li>${content}</li>`;
|
||||
break;
|
||||
case 'blockquote':
|
||||
html += `<blockquote>${content}</blockquote>`;
|
||||
break;
|
||||
case 'ref':
|
||||
html += `<span class="ref">${content}</span>`;
|
||||
break;
|
||||
case 'url':
|
||||
html += `<span class="url">${content}</span>`;
|
||||
break;
|
||||
case 'link':
|
||||
const href = node.getAttribute('href') || '#';
|
||||
html += `<a href="${href}" class="url">${content}</a>`;
|
||||
break;
|
||||
default:
|
||||
// For unknown tags, just include the content
|
||||
html += content;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return html || '<em>(empty)</em>';
|
||||
// If there's content, return it as-is (browser will handle HTML tags)
|
||||
// If empty, return the (empty) indicator
|
||||
return innerHTML ? innerHTML.trim() : '<em>(empty)</em>';
|
||||
}
|
||||
|
||||
function formatXMLElement(element) {
|
||||
|
||||
Reference in New Issue
Block a user