proxyweb/index.html
2025-10-27 07:57:59 -04:00

176 lines
6.7 KiB
HTML

<!DOCTYPE html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"
integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg=="
crossorigin="anonymous"></script>
<script src="api.js"></script>
<script src="ui.js"></script>
<script src="app_state.js"></script>
<script src="app.js"></script>
<style>
/*
* Custom CSS
*/
:root {
--bs-body-bg: var(--bs-gray-100);
}
</style>
</head>
<body>
<div class="container">
<div class="container" >
<input type="button" value="config" onclick="ui.toggle_configuration_form()"></div>
<!-- Configuration Form -->
<form style="margin-top: 12px;" id="configuration_form">
<div class="form-group">
<label for="address">API address</label>
<input type="text" class="form-control" id="api_endpoint_field" required="" value=""
onchange="ui.address_changed_handler()">
</div>
<div class="form-group">
<label for="api_token_field">Access Token</label>
<input type="password" class="form-control" id="api_token_field" onchange="ui.token_changed_handler()">
</div>
<div class="form-group">
<label for="poll_toggle_field">Toggle Polling</label>
<input type="checkbox" id="poll_toggle_field" onchange="ui.poll_changed_handler()" checked="false">
</div>
</form>
<!-- summary -->
<div class="container">
<label for="memory_progress_bar">Memory: </label>
<span id="memory_text_view"></span >
<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar" id="memory_progress_bar" style="width: 0%"></div>
</div>
<label for="proxy_version">Proxy Version: </label>
<span id="proxy_version"></span>
</div>
<div>
<label for="proxy_restricted">Restricted Mode:</label>
<input type="checkbox" id="proxy_restricted">
</div>
<!-- Hash Rates -->
<div id="hash_rates">
<span id="hash_rates_1min"></span> |
<span id="hash_rates_10min"></span> |
<span id="hash_rates_60min"></span> |
<span id="hash_rates_12h"></span> |
<span id="hash_rates_24h"></span> |
</div>
<!-- Workers -->
<div>
<table id="workers" class="table table-striped">
<thead>
<tr>
<td scope="col">Name</td>
<td scope="col">CX</td>
<td scope="col">Shares</td>
<td scope="col">Hash Rate</td>
</tr>
</thead>
<tbody id="workers_body">
</tbody>
</table>
</div>
</div>
<script>
// Utility Functions
function truncateString(str, maxLength) {
if (str.length <= maxLength) {
return str; // Return original string if it's already within the limit
} else {
// Truncate the string and add an ellipsis
return str.slice(0, maxLength - 3) + "...";
}
}
function update_stored_token() {
console.log("Storing updated token.");
localStorage.setItem('token', $('#token').val());
}
function load_status() {
var headers = {};
const token = $('#token').val();
headers.Authorization = 'Bearer ' + token;
$('#endpoint').val("/2/summary");
$.ajax({
method: 'get',
url: $('#address').val() + $('#endpoint').val(),
headers: headers
})
.done(function(data, textStatus, jqXHR) {
const parsed = $.parseJSON(jqXHR.responseText);
// console.log(parsed);
let memory_percent = parsed.resources.memory.free / parsed.resources.memory.total;
let memory_string = parsed.resources.memory.free + "/" + parsed.resources.memory.total;
$('#memory_progress_bar').css("width", memory_percent + "%");
$('#memory_text_view').text(memory_string);
$('#proxy_version').text(parsed.version);
$('#proxy_restricted').val(parsed.restricted);
})
}
function load_workers() {
var headers = {};
const token = $('#token').val();
headers.Authorization = 'Bearer ' + token;
$("#endpoint").val("/1/workers");
$.ajax({
method: 'get',
url: $('#address').val() + $('#endpoint').val(),
headers: headers
})
.done(function (data, textStatus, jqXHR) {
$('#workers_body').innerHTML = "";
$('#result').text(jqXHR.responseText);
const parsed = $.parseJSON(jqXHR.responseText);
// console.log(parsed);
$('#hash_rates_1min').text(parsed.hashrate.total[0]);
$('#hash_rates_10min').text(parsed.hashrate.total[1]);
$('#hash_rates_60min').text(parsed.hashrate.total[2]);
$('#hash_rates_12h').text(parsed.hashrate.total[3]);
$('#hash_rates_24h').text(parsed.hashrate.total[4]);
parsed.workers.forEach(element => {
var builder = "<tr>";
// name
builder += "<td>" + truncateString(element[0], 20) + "</td>";
builder += "<td>" + element[2] + "</td>";
builder += "<td>" + element[3] + "/" + element[4] + "</td>";
builder += "<td>" + element[9] + "</td>";
builder += "</tr>";
$("#workers tbody").append(builder);
});
})
.fail(function (jqXHR, textStatus) {
console.log("failed -> " + jqXHR.status + " / " + textStatus);
})
}
$(function () {
console.log("Global Init Started...");
app.init();
console.log("...Global Init Completed.");
// api.init("http://198.46.176.136:44444");
// console.log("token = " + app_state.api_token);
// console.log("endpoint = " + app_state.api_endpoint);
api.load_workers();
})
</script>
</body>
</html>