diff --git a/templates/index.html b/templates/index.html index 12e6772..bc11520 100644 --- a/templates/index.html +++ b/templates/index.html @@ -522,6 +522,228 @@ return html; } + // Format name info nicely + function formatNameInfo(data) { + if (!data || data.error) { + return `
Error: ${data.error || 'Invalid name data'}
`; + } + + const info = data.info; + const start = data.start; + const formatValue = (value) => (value / 1e6).toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2}) + ' HNS'; + const formatDate = (timestamp) => new Date(timestamp * 1000).toLocaleString(); + + let html = ` +
+
+

Name: ${info.name}

+
+
State: ${info.state}
+
Registered: ${info.registered ? 'Yes' : 'No'}
+
Height: ${info.height.toLocaleString()}
+
Value: ${formatValue(info.value)}
+
Highest Bid: ${formatValue(info.highest)}
+
Renewals: ${info.renewals}
+
Next Renewal: Height ${info.renewal.toLocaleString()}
+
Expired: ${info.expired ? 'Yes' : 'No'}
+
Revoked: ${info.revoked > 0 ? 'Yes' : 'No'}
+
Weak: ${info.weak ? 'Yes' : 'No'}
+
+
+ + ${info.stats ? ` +
+

Expiration Info

+
+
Blocks Until Expire: ${info.stats.blocksUntilExpire.toLocaleString()}
+
Days Until Expire: ${info.stats.daysUntilExpire.toFixed(2)}
+
Renewal Period Start: ${info.stats.renewalPeriodStart.toLocaleString()}
+
Renewal Period End: ${info.stats.renewalPeriodEnd.toLocaleString()}
+
+
+ ` : ''} + +
+

Owner

+
+
TX: ${info.owner.hash}
+
Output Index: ${info.owner.index}
+
+
+ +
+

Name Hash

+
${info.nameHash}
+
+ + ${start ? ` +
+

Auction Info

+
+
Start Height: ${start.start.toLocaleString()}
+
Week: ${start.week}
+
Reserved: ${start.reserved ? 'Yes' : 'No'}
+
Locked: ${start.locked ? 'Yes' : 'No'}
+
+
+ ` : ''} + +
+ + 
${JSON.stringify(data, null, 2)}
+
+
+ `; + + return html; + } + + // Format name resource records nicely + function formatNameResource(data) { + if (!data || data.error) { + return `
Error: ${data.error || 'Invalid resource data'}
`; + } + + if (!data.records || data.records.length === 0) { + return `
No resource records found
`; + } + + const records = data.records; + + let html = ` +
+
+

DNS Records (${records.length})

+
+ ${records.map((record, i) => { + let recordDetails = `${record.type}`; + + switch(record.type) { + case 'NS': + recordDetails += ` → ${record.ns}`; + break; + case 'DS': + recordDetails += `
KeyTag: ${record.keyTag}, Algorithm: ${record.algorithm}, DigestType: ${record.digestType}
${record.digest}`; + break; + case 'TXT': + recordDetails += `
${record.txt.map(t => `"${t}"`).join('
')}`; + break; + case 'GLUE4': + case 'GLUE6': + recordDetails += ` → ${record.ns}
${record.address}`; + break; + case 'SYNTH4': + case 'SYNTH6': + recordDetails += ` → ${record.address}`; + break; + } + + return ` +
+
+ Record #${i} +
+
${recordDetails}
+
+ `; + }).join('')} +
+
+ +
+ + 
${JSON.stringify(data, null, 2)}
+
+
+ `; + + return html; + } + + // Format name summary nicely + function formatNameSummary(data) { + if (!data || data.error) { + return `
Error: ${data.error || 'Invalid summary data'}
`; + } + + const formatValue = (value) => (value).toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2}) + ' HNS'; + const formatDate = (timestamp) => new Date(timestamp * 1000).toLocaleString(); + + let html = ` +
+
+

Name: ${data.name}

+
+
State: ${data.state}
+
Height: ${data.height.toLocaleString()}
+
Value: ${formatValue(data.value)}
+
Blocks Until Expire: ${data.blocksUntilExpire.toLocaleString()}
+
Mint Date: ${formatDate(data.mintTimestamp)}
+
+
+ +
+

Owner Address

+
+
${data.owner}
+
+
+ +
+

Name Hash

+
${data.hash}
+
+ + ${data.resources && data.resources[0] && data.resources[0].records ? ` +
+

DNS Records (${data.resources[0].records.length})

+
+ ${data.resources[0].records.map((record, i) => { + let recordDetails = `${record.type}`; + + switch(record.type) { + case 'NS': + recordDetails += ` → ${record.ns}`; + break; + case 'DS': + recordDetails += `
KeyTag: ${record.keyTag}, Algorithm: ${record.algorithm}`; + break; + case 'TXT': + recordDetails += `
${record.txt.map(t => `"${t}"`).join('
')}`; + break; + case 'GLUE4': + case 'GLUE6': + recordDetails += ` → ${record.ns}
${record.address}`; + break; + case 'SYNTH4': + case 'SYNTH6': + recordDetails += ` → ${record.address}`; + break; + } + + return ` +
+
+ Record #${i} +
+
${recordDetails}
+
+ `; + }).join('')} +
+
+ ` : ''} + +
+ + 
${JSON.stringify(data, null, 2)}
+
+
+ `; + + return html; + } + // Format transaction data nicely function formatTransactionData(tx) { if (!tx || tx.error) { @@ -767,7 +989,14 @@ } updateURL('name', name); const data = await apiCall(`name/${name}`); - displayResult('name-result', data); + + // Use formatted display + const resultElement = document.getElementById('name-result'); + if (data.error) { + resultElement.innerHTML = `
Error: ${data.error}
`; + } else { + resultElement.innerHTML = formatNameInfo(data); + } } async function searchNameResource() { @@ -777,7 +1006,14 @@ return; } const data = await apiCall(`nameresource/${name}`); - displayResult('name-result', data); + + // Use formatted display + const resultElement = document.getElementById('name-result'); + if (data.error) { + resultElement.innerHTML = `
Error: ${data.error}
`; + } else { + resultElement.innerHTML = formatNameResource(data); + } } async function searchNameSummary() { @@ -787,7 +1023,14 @@ return; } const data = await apiCall(`namesummary/${name}`); - displayResult('name-result', data); + + // Use formatted display + const resultElement = document.getElementById('name-result'); + if (data.error) { + resultElement.innerHTML = `
Error: ${data.error}
`; + } else { + resultElement.innerHTML = formatNameSummary(data); + } } async function searchNameHash() {