first-working-commit

IoniaOU · Feb 23, 2024 · e3bd599 · e3bd599
1 parent f848342
commit e3bd599
Show file tree

Hide file tree

Showing 2 changed files with 71 additions and 6 deletions.
diff --git a/index.html b/index.html
@@ -84,14 +84,56 @@ <h5 class="text-center m-4">
 									   placeholder="Enter hashrate">
 							</div>
 							<div class="form-group col-md-3 d-flex align-items-end">
-								<button type="button" class="btn btn-primary" onclick="calculateHashrate()">Calculate</button>
+								<button type="button" class="btn btn-primary" onclick="calculateHashrate()">Calculate
+								</button>
 							</div>
 						</div>
 
 					</form>
 
-					<div id="result" class="mt-3 text-monospace">
-						Result will be here.
+					<div class="d-flex justify-content-center">
+						<div id="result" class="mt-3 text-monospace">
+							<table class="table table-responsive" style="min-width: 600px !important;">
+								<tbody>
+								<tr>
+									<th scope="row">Your hashrate</th>
+									<td id="your-hashrate"></td>
+								</tr>
+								<tr>
+									<th scope="row">Network hashrate</th>
+									<td id="network-hashrate"></td>
+								</tr>
+								<tr>
+									<th scope="row">Block interval</th>
+									<td id="block-interval"></td>
+								</tr>
+								<tr>
+									<th scope="row">Chance per block</th>
+									<td id="chance-per-block"></td>
+								</tr>
+								<tr>
+									<th scope="row">Chance per hour</th>
+									<td id="chance-per-hour"></td>
+								</tr>
+								<tr>
+									<th scope="row">Chance per day</th>
+									<td id="chance-per-day"></td>
+								</tr>
+								<tr>
+									<th scope="row">Chance per week</th>
+									<td id="chance-per-week"></td>
+								</tr>
+								<tr>
+									<th scope="row">Chance per month</th>
+									<td id="chance-per-month"></td>
+								</tr>
+								<tr>
+									<th scope="row">Chance per year</th>
+									<td id="chance-per-year"></td>
+								</tr>
+								</tbody>
+							</table>
+						</div>
 					</div>
 				</div>
 			</div>

diff --git a/js/form.js b/js/form.js
@@ -9,9 +9,32 @@ async function calculateHashrate() {
         const response = await fetch(apiUrl);
         const data = await response.json();
 
-        const resultContainer = document.getElementById('result');
-        resultContainer.innerHTML = `<p>API Response:</p>
-                                 <pre>${JSON.stringify(data, null, 2)}</pre>`;
+        const yourHashrateContainer = document.getElementById('your-hashrate');
+        yourHashrateContainer.innerHTML = data['currentHashrateText'];
+
+        const networkHashrateContainer = document.getElementById('network-hashrate');
+        networkHashrateContainer.innerHTML = data['networkHashrateText'];
+
+        const blockIntervalContainer = document.getElementById('block-interval');
+        blockIntervalContainer.innerHTML = data['blockIntervalInMinutes'] + ' minutes';
+
+        const blockChance = document.getElementById('chance-per-block');
+        blockChance.innerHTML = data['blockChanceText'];
+
+        const hourChance = document.getElementById('chance-per-hour');
+        hourChance.innerHTML = data['hourChanceText'];
+
+        const dayChance = document.getElementById('chance-per-day');
+        dayChance.innerHTML = data['dayChanceText'];
+
+        const weekChance = document.getElementById('chance-per-week');
+        weekChance.innerHTML = data['weekChanceText'];
+
+        const monthChance = document.getElementById('chance-per-month');
+        monthChance.innerHTML = data['monthChanceText'];
+
+        const yearChance = document.getElementById('chance-per-year');
+        yearChance.innerHTML = data['yearChanceText'];
     } catch (error) {
         console.error('Error fetching data:', error);
     }