nathanwoodburn/firehsd
1
0
Fork 0
generated from nathanwoodburn/python-webserver-template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add initial code
All checks were successful
Build Docker / BuildImage (push) Successful in 51s
Details

Browse Source
This commit is contained in:
Nathan Woodburn
2025-08-22 13:34:17 +10:00
parent e3bad90b8e
commit 132f97325a
4 changed files with 359 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
templates/index.html
View File

@@ -4,57 +4,130 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nathan.Woodburn/</title>
<title>Fire HSD | Nathan.Woodburn</title>
<link rel="icon" href="/assets/img/favicon.png" type="image/png">
<link rel="stylesheet" href="/assets/css/index.css">
<style>
/* Extra styling for index page */
.intro {
max-width: 600px;
margin: 0 auto 2em auto;
padding: 1.5em;
background: rgba(40, 40, 40, 0.5);
border-radius: 10px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
font-size: 1.15em;
line-height: 1.7;
}
.api-table-container {
max-width: 800px;
margin: 0 auto;
}
footer {
margin-top: 4em;
text-align: center;
color: #aaa;
font-size: 0.95em;
}
.logo {
width: 80px;
height: 80px;
margin-bottom: 1em;
border-radius: 50%;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
</style>
</head>
<body>
<div class="spacer"></div>
<div class="centre">
<h1>Nathan.Woodburn/</h1>
<span>The current date and time is {{datetime}}</span>
<img src="/assets/img/favicon.png" alt="Fire HSD Logo" class="logo">
<h1>Fire HSD</h1>
<span style="font-size:1.2em; color:#f0f0f0;">A free public API for Handshake (HSD)</span>
</div>
<div class="spacer"></div>
<div class="centre">
<h2 id="test-content-header">Pulling data</h2>
<span class="test-content">This is a test content area that will be updated with data from the server.</span>
<div class="intro">
Fire HSD is a public API for the <a href="https://handshake.org/" target="_blank">Handshake</a> blockchain.<br>
You can use these endpoints to query blocks, transactions, coins and names.<br>
No authentication required!<br>
<br>
<br>
<span class="test-content-timestamp">Timestamp: Waiting to pull data</span>
<b>Quick Start:</b> Try <code>/api/v1/status</code> or <code>/api/v1/block/1</code> in your browser or with
<code>curl</code>.
</div>
<div class="spacer"></div>
<div class="centre api-table-container">
<h2>API Endpoints</h2>
<div id="api-endpoints"></div>
</div>
<div class="spacer"></div>
<footer>
&copy; 2025 Nathan Woodburn &mdash; <a href="https://git.woodburn.au/nathanwoodburn/firehsd" style="color:#aaa;">Source</a>
</footer>
<script>
function fetchData() {
// Fetch the data from the server
fetch('/api/v1/data')
.then(response => response.json())
.then(data => {
// Get the data header element
const dataHeader = document.getElementById('test-content-header');
// Update the header with the fetched data
dataHeader.textContent = data.header;
// Get the test content element
const testContent = document.querySelector('.test-content');
// Update the content with the fetched data
testContent.textContent = data.content;
function renderApiEndpoints(apiList) {
const container = document.getElementById('api-endpoints');
// Create table element
const table = document.createElement('table');
table.style.margin = 'auto';
table.style.borderCollapse = 'collapse';
table.style.width = '100%';
// Get the timestamp element
const timestampElement = document.querySelector('.test-content-timestamp');
// Update the timestamp with the fetched data
timestampElement.textContent = `Timestamp: ${data.timestamp}`;
})
.catch(error => console.error('Error fetching data:', error));
// Create table header
const thead = document.createElement('thead');
const headerRow = document.createElement('tr');
const thEndpoint = document.createElement('th');
thEndpoint.style.padding = '8px';
thEndpoint.style.borderBottom = '1px solid #ccc';
thEndpoint.textContent = 'Endpoint';
const thDescription = document.createElement('th');
thDescription.style.padding = '8px';
thDescription.style.borderBottom = '1px solid #ccc';
thDescription.textContent = 'Description';
headerRow.appendChild(thEndpoint);
headerRow.appendChild(thDescription);
thead.appendChild(headerRow);
table.appendChild(thead);
// Create table body
const tbody = document.createElement('tbody');
apiList.forEach(api => {
const row = document.createElement('tr');
const tdEndpoint = document.createElement('td');
tdEndpoint.style.padding = '8px';
tdEndpoint.style.borderBottom = '1px solid #eee';
const code = document.createElement('code');
code.textContent = api.endpoint;
tdEndpoint.appendChild(code);
const tdDescription = document.createElement('td');
tdDescription.style.padding = '8px';
tdDescription.style.borderBottom = '1px solid #eee';
tdDescription.textContent = api.description;
row.appendChild(tdEndpoint);
row.appendChild(tdDescription);
tbody.appendChild(row);
});
table.appendChild(tbody);
// Replace container content
container.innerHTML = '';
container.appendChild(table);
}
// Initial fetch after 2 seconds
setTimeout(fetchData, 2000);
// Then fetch every 2 seconds
setInterval(fetchData, 2000);
fetch('/api/v1/help')
.then(response => response.json())
.then(data => {
if (data.api) {
renderApiEndpoints(data.api);
}
})
.catch(error => console.error('Error fetching API endpoints:', error));
</script>
</body>
</html>