From def5a432143751128a0697678459571e8f6d874f Mon Sep 17 00:00:00 2001 From: Twann Date: Mon, 29 May 2023 02:14:40 +0200 Subject: [PATCH] add lightweight web frontend --- index.html | 61 +++++++++++++++++++++++++++-- static/base.js | 4 ++ static/explorer.css | 57 +++++++++++++++++++++++++++ static/explorer.js | 31 +++++++++++++++ static/tblock.svg | 1 + static/viewer.js | 33 ++++++++++++++++ view.html | 95 +++++++++++++++++++++++++++++++++++++++++++++ 7 files changed, 279 insertions(+), 3 deletions(-) create mode 100644 static/base.js create mode 100644 static/explorer.css create mode 100644 static/explorer.js create mode 100644 static/tblock.svg create mode 100644 static/viewer.js create mode 100644 view.html diff --git a/index.html b/index.html index 45aa47f..c1a957e 100644 --- a/index.html +++ b/index.html @@ -1,8 +1,63 @@ - Redirecting... - + + + + + Filter list repository | TBlock + + + + + + + + + + + + + + + + + + + + + - + + +
+
+

TBlock filter list repository

+ Lightweight web frontend +
    +
  • View raw (JSON)
    • +
  • Total filter lists:
    • +
  • Repository version:
    • +
  • Latest version of TBlock:
    • +
+
+ + + + + + + +
Filter listTitleDescriptionLicense
+
+

+ View this list with the command-line: +

+ 
$ tblock -Lk
+
+
+ + diff --git a/static/base.js b/static/base.js new file mode 100644 index 0000000..a67d199 --- /dev/null +++ b/static/base.js @@ -0,0 +1,4 @@ +async function fetchJSON(url) { + const response = await fetch(url); + return await response.json(); +} \ No newline at end of file diff --git a/static/explorer.css b/static/explorer.css new file mode 100644 index 0000000..9e45109 --- /dev/null +++ b/static/explorer.css @@ -0,0 +1,57 @@ +body{ + font-family: sans-serif; + margin:1rem auto; + max-width:80rem; +} +#main{ + visibility: hidden; +} +.header,table{ + margin:3rem 1rem 1rem 1rem; +} +.footer{ + margin:2rem 1rem 3rem 1rem; +} +table,th,td{ + border:2px solid black; + border-collapse:collapse; +} +th,td{ + padding:5px 10px; +} +a{ + color:rgb(19, 84, 148); + text-decoration: underline rgb(19, 84, 148); +} +.noscript,#error{ + max-width:20rem; + text-align:center; + margin:1rem auto; + background-color:rgb(235, 34, 75); + border:rgb(160, 23, 50) solid 4px; + border-radius:15px; + padding:1rem 3rem; +} +#error{ + display:none; +} +#error a{ + color:black; + text-decoration: underline black; +} +code,pre{ + font-family: monospace; + font-size:100%; + background-color:rgb(34, 34, 34); + color:white; + padding:2px 5px; + border-radius:5px; +} +li{ + margin:10px 0px; +} +pre{ + font-size:120%; + padding:1rem; + overflow-x:scroll; +} \ No newline at end of file diff --git a/static/explorer.js b/static/explorer.js new file mode 100644 index 0000000..05aba77 --- /dev/null +++ b/static/explorer.js @@ -0,0 +1,31 @@ +(async function() { + const data = await fetchJSON("/2.4.0/index.json"); + const table = document.getElementById("explorer"); + const filters = Object.keys(data.filters); + document.getElementById("main").style.visibility = "visible"; + document.getElementById("tblock-version").innerText = data.repo.latest_version; + document.getElementById("version").innerText = data.repo.version; + document.getElementById("total").innerText = filters.length; + for await(id of filters){ + let tr = document.createElement("tr"); + let td_id = document.createElement("td"); + let td_id_a = document.createElement("a"); + td_id_a.href = "view.html?id=".concat(id); + td_id_a.innerText = id; + td_id.appendChild(td_id_a); + tr.appendChild(td_id); + let td_title = document.createElement("td"); + td_title.innerText = data.filters[id].title; + tr.appendChild(td_title); + let td_description = document.createElement("td"); + td_description.innerText = data.filters[id].desc; + tr.appendChild(td_description); + let td_license = document.createElement("td"); + let td_license_a = document.createElement("a"); + td_license_a.href = data.filters[id].license[1]; + td_license_a.innerText = data.filters[id].license[0]; + td_license.appendChild(td_license_a); + tr.appendChild(td_license); + table.appendChild(tr); + } +})(); \ No newline at end of file diff --git a/static/tblock.svg b/static/tblock.svg new file mode 100644 index 0000000..c4809e4 --- /dev/null +++ b/static/tblock.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/viewer.js b/static/viewer.js new file mode 100644 index 0000000..640ca43 --- /dev/null +++ b/static/viewer.js @@ -0,0 +1,33 @@ +(async function() { + id = new URLSearchParams(document.location.search).get("id"); + const data = await fetchJSON("/2.4.0/index.json"); + filters = Object.keys(data.filters); + if(filters.indexOf(id) != -1){ + document.getElementById("main").style.visibility = "visible"; + document.getElementById("id").innerText = id; + document.getElementById("id-code").innerText = id; + document.getElementById("id-code-2").innerText = id; + document.getElementById("title").innerText = data.filters[id].title; + document.getElementById("description").innerText = data.filters[id].desc; + const source = document.createElement("a"); + source.href = data.filters[id].source; + source.innerText = source; + document.getElementById("source").appendChild(source); + document.getElementById("syntax").innerText = data.filters[id].syntax; + document.getElementById("mirrors").innerText = data.filters[id].mirrors.length; + const homepage = document.createElement("a"); + homepage.href = data.filters[id].homepage; + homepage.innerText = data.filters[id].homepage; + document.getElementById("homepage").appendChild(homepage); + const license = document.createElement("a"); + license.href = data.filters[id].license[1]; + license.innerText = data.filters[id].license[0]; + document.getElementById("license").appendChild(license); + for(tag of data.filters[id].tags){ + document.getElementById("tags").innerText += " ".concat(tag); + } + } + else{ + document.getElementById("error").style.display = "block"; + } +})(); \ No newline at end of file diff --git a/view.html b/view.html new file mode 100644 index 0000000..2d2df23 --- /dev/null +++ b/view.html @@ -0,0 +1,95 @@ + + + + + + + + Filter list repository | TBlock + + + + + + + + + + + + + + + + + + + + + + + + +

This filter list does not exist. Click here to view all filter lists.

+
+
+

TBlock filter list repository

+ Lightweight web frontend + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Filter list
Title
Description
Source
Format
Mirrors
Homepage
License
Tags
+
+

+ Subscribe to this filter list: +

+ 
$ tblock -S
+

+ View this information with the command-line: +

+ 
$ tblock -I
+
+
+ + +