diff --git a/css/style.css b/css/style.css
new file mode 100644
index 0000000..51d333e
--- /dev/null
+++ b/css/style.css
@@ -0,0 +1,57 @@
+body {
+ width: 100vw;
+ height: 100vh;
+
+ margin: 0;
+ padding: 0;
+
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ background: #eff1f5;
+ color: #4c4f69;
+}
+
+@media (prefers-color-scheme: dark) {
+ body {
+ background: #1e1e2e;
+ color: #cdd6f4;
+ }
+}
+
+fieldset {
+ border: 1px solid currentColor;
+}
+
+.container {
+ width: auto;
+ height: auto;
+ display: inline;
+}
+
+legend {
+ margin: 0 auto;
+}
+
+.nf-spin {
+ display: inline-block;
+
+ animation-delay: 0;
+ animation-direction: normal;
+
+ animation-name: spin;
+ animation-duration: 2s;
+ animation-iteration-count: infinite;
+ animation-timing-function: linear
+}
+
+@keyframes spin {
+ 0% {
+ transform: rotate(0deg)
+ }
+
+ to {
+ transform: rotate(1turn)
+ }
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 45b983b..bc1d546 100644
--- a/index.html
+++ b/index.html
@@ -1 +1,33 @@
-hi
+
+
+
+
+
+
+ opentracker
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/js/script.js b/js/script.js
new file mode 100644
index 0000000..d46a328
--- /dev/null
+++ b/js/script.js
@@ -0,0 +1,50 @@
+function xml2json(xml) {
+ var obj = {};
+
+ if (xml.nodeType == 1) {
+ if (xml.attributes.length > 0) {
+ obj["@attributes"] = {};
+ for (var j = 0; j < xml.attributes.length; j++) {
+ var attribute = xml.attributes.item(j);
+ obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
+ }
+ }
+ } else if (xml.nodeType == 3) {
+ obj = xml.nodeValue.trim();
+ }
+
+ var textNodes = [].slice.call(xml.childNodes).filter(function (node) {
+ return node.nodeType === 3;
+ });
+ if (xml.hasChildNodes() && xml.childNodes.length === textNodes.length) {
+ obj = [].slice.call(xml.childNodes).reduce(function (text, node) {
+ return text + node.nodeValue.trim();
+ }, "");
+ } else if (xml.hasChildNodes()) {
+ for (var i = 0; i < xml.childNodes.length; i++) {
+ var item = xml.childNodes.item(i);
+ var nodeName = item.nodeName;
+ if (nodeName == "#text") continue;
+ if (typeof obj[nodeName] == "undefined") {
+ obj[nodeName] = xml2json(item);
+ } else {
+ if (typeof obj[nodeName].push == "undefined") {
+ var old = obj[nodeName];
+ obj[nodeName] = [];
+ obj[nodeName].push(old);
+ }
+ obj[nodeName].push(xml2json(item));
+ }
+ }
+ }
+ return obj;
+}
+
+const parser = new DOMParser();
+
+fetch("stats?mode=everything").then(r => r.text()).then(r => {
+ var data = xml2json(parser.parseFromString(r, "text/xml")).stats;
+ document.querySelector("#s").textContent = data.seeds.count;
+ document.querySelector("#l").textContent = data.completed.count;
+ document.querySelector("#footer").textContent = `serving ${data.torrents.count_mutex} torrents`;
+});
\ No newline at end of file