eeprom/public/index.html

102 lines
4.3 KiB
HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>EEPROM</title>
<link href="/assets/style.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<div class="eeprom">
<div class="eeprom-inner">
<div class="eeprom-header">
<div class="eeprom-logo">
<img src="/assets/eeprom-logo.png" alt="EEPROM" class="eeprom-logo" />
</div>
<div class="eeprom-description">
<p>File Upload Service</p>
</div>
</div>
<div class="eeprom-stats">
<div class="eeprom-stat">
<div class="eeprom-stat-num">
<div id="-eeprom-stat-size-fmt" class="eeprom-stat-num-big">---</div>
<div id="-eeprom-stat-size-byte" class="eeprom-stat-num-small">&nbsp;</div>
</div>
<div class="eeprom-stat-title">
Size
</div>
</div>
<div class="eeprom-divider"></div>
<div class="eeprom-stat">
<div class="eeprom-stat-num">
<div id="-eeprom-stat-files" class="eeprom-stat-num-big">---</div>
</div>
<div class="eeprom-stat-title">
Files
</div>
</div>
<div class="eeprom-divider"></div>
<div class="eeprom-stat">
<div class="eeprom-stat-num">
<div id="-eeprom-stat-types" class="eeprom-stat-num-big">---</div>
</div>
<div class="eeprom-stat-title">
Types
</div>
</div>
<div class="eeprom-divider"></div>
<div class="eeprom-stat">
<div class="eeprom-stat-num">
<div id="-eeprom-stat-members" class="eeprom-stat-num-big">---</div>
</div>
<div class="eeprom-stat-title">
Uploaders
</div>
</div>
</div>
<div class="eeprom-footer">
<a href="https://flash.moe" target="_blank" rel="noopener">flashwave</a> 2020-2024
</div>
</div>
</div>
<script type="text/javascript">
var sSizeFmt = document.getElementById('-eeprom-stat-size-fmt'),
sSizeByte = document.getElementById('-eeprom-stat-size-byte'),
sFiles = document.getElementById('-eeprom-stat-files'),
sTypes = document.getElementById('-eeprom-stat-types'),
sMembers = document.getElementById('-eeprom-stat-members');
Number.prototype.formatFileSize = function(binary) {
if(this < 1)
return 'Zero Bytes';
var div = binary ? 1024 : 1000,
exp = Math.floor(Math.log(this) / Math.log(div)),
size = this / Math.pow(div, exp);
var symbol = ['', 'K', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y'][exp];
return size.toFixed(2) + ' ' + symbol + (binary ? 'i' : '') + 'B';
};
var eUpdateStats = function() {
var xhr = new XMLHttpRequest;
xhr.onload = function() {
var stats = JSON.parse(xhr.responseText);
sSizeFmt.textContent = stats.size.formatFileSize();
sSizeByte.textContent = stats.size.toLocaleString() + ' bytes';
sFiles.textContent = stats.files.toLocaleString();
sTypes.textContent = stats.types.toLocaleString();
sMembers.textContent = stats.members.toLocaleString();
};
xhr.open('GET', '/stats.json');
xhr.send();
};
eUpdateStats();
setInterval(eUpdateStats, 5 * 60 * 1000);
</script>
</body>
</html>