From 6cbaecc5f918ea71920d0d3fe56eb372c8eef6e0 Mon Sep 17 00:00:00 2001 From: kaotisk Date: Thu, 23 Oct 2025 05:07:46 +0300 Subject: [fs] Adds AKFS GET form --- src/js/ui/components/akfsGet/index.js | 46 ++++++++ src/js/ui/components/homeGrid/index.js | 51 ++++++++ src/js/ui/components/logsArea/index.js | 24 ++++ src/js/ui/components/manualPeer/index.js | 45 +++++++ src/js/ui/components/previewArea/index.js | 13 +++ src/js/ui/components/progressArea/index.js | 33 ++++++ src/js/ui/components/renderForm/index.js | 45 +++++++ src/js/ui/components/resultsArea/index.js | 19 +++ src/js/ui/components/scanButtons/index.js | 35 ++++++ src/js/ui/sections/welcomeSection.js | 182 +++-------------------------- 10 files changed, 326 insertions(+), 167 deletions(-) create mode 100644 src/js/ui/components/akfsGet/index.js create mode 100644 src/js/ui/components/homeGrid/index.js create mode 100644 src/js/ui/components/logsArea/index.js create mode 100644 src/js/ui/components/manualPeer/index.js create mode 100644 src/js/ui/components/previewArea/index.js create mode 100644 src/js/ui/components/progressArea/index.js create mode 100644 src/js/ui/components/renderForm/index.js create mode 100644 src/js/ui/components/resultsArea/index.js create mode 100644 src/js/ui/components/scanButtons/index.js (limited to 'src') diff --git a/src/js/ui/components/akfsGet/index.js b/src/js/ui/components/akfsGet/index.js new file mode 100644 index 0000000..9fe0a9e --- /dev/null +++ b/src/js/ui/components/akfsGet/index.js @@ -0,0 +1,46 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +const label = { + element : "h3", + innerText: "Get a file via AKFS" +}; + +const input = { + element: "input", + id:"hash-field", + type:"text", + name:"search", + placeholder:"Enter a hash" +}; + +const button = { + element:"button", + onclick:"akfsGetMap(this.parentElement.querySelector('#hash-field').value)", + innerText:"Get!" +} + +const container = { + element: "div", + style:"padding: 1vh 1vw; display: flex; flex-direction: row; align-items: center; gap: 10px;", + innerHTML: [ + input, + button + ] +}; + + +export const akfsGetForm = { + element: "div", + style:"padding: 1vh 1vw; display: flex; flex-direction: column; align-items: center; gap: 10px;", + innerHTML: [ + label, + container + ] +} + +// @license-end diff --git a/src/js/ui/components/homeGrid/index.js b/src/js/ui/components/homeGrid/index.js new file mode 100644 index 0000000..004057c --- /dev/null +++ b/src/js/ui/components/homeGrid/index.js @@ -0,0 +1,51 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +export const homeGrid = { + element: "div", + id: "home-grid", + innerHTML: [ + { + element:"button", + className:"menu-clickable", + id:"#/mixtapes-section", + onclick:"menusel(this)", + style:"background-image: url(img/mixtapes-logo.png); background-repeat: round;" + }, + { + element:"button", + className:"menu-clickable", + id:"#/news-section", + onclick:"menusel(this)", + style:"background-image: url(img/news-logo.png); background-repeat: round;" + }, + { + element:"button", + className:"menu-clickable", + id:"#/chat-section", + onclick:"menusel(this)", + style:"background-image: url(img/chat-logo.png); background-repeat: round;" + }, + { + element:"button", + className:"menu-clickable", + id:"#/radio-section", + onclick:"menusel(this)", + style:"background-image: url(img/radio-logo.png); background-repeat: round; background-size: cover;" + }, + { + element:"button", + className:"menu-clickable", + id:"#/stats-section", + onclick:"menusel(this)", + // innerText:"Stats", + style:"background-image: url(img/stats-logo.png); background-repeat: round; background-size: cover;" + } + ] +}; + +// @license-end diff --git a/src/js/ui/components/logsArea/index.js b/src/js/ui/components/logsArea/index.js new file mode 100644 index 0000000..5782b87 --- /dev/null +++ b/src/js/ui/components/logsArea/index.js @@ -0,0 +1,24 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +export const logsArea = { + element: "details", + id: "logs-area", + innerHTML: [ + { + element: "summary", + innerText: "Logs (click to expand)" + }, + { + element: "div", + style: "font-size: 9px;", + id: "logs-area-element" + } + ] +}; + +// @license-end diff --git a/src/js/ui/components/manualPeer/index.js b/src/js/ui/components/manualPeer/index.js new file mode 100644 index 0000000..6a78f71 --- /dev/null +++ b/src/js/ui/components/manualPeer/index.js @@ -0,0 +1,45 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +const label = { + element : "h3", + innerText: "Connect to specific peer manually" +}; + +const input = { + element: "input", + id:"peer-field", + type:"text", + name:"search", + placeholder:"Enter an arching-kaos node address" +}; + +const button = { + element:"button", + onclick:"seekPeer(this.parentElement.querySelector('#peer-field').value, ['search', false])", + innerText:"Try" +}; + +const container = { + element: "div", + style:"padding: 1vh 1vw; display: flex; flex-direction: row; align-items: center; gap: 10px;", + innerHTML: [ + input, + button + ] +}; + +export const manualPeerForm = { + element: "div", + style:"padding: 1vh 1vw; display: flex; flex-direction: column; align-items: center; gap: 10px;", + innerHTML: [ + label, + container + ] +}; + +// @license-end diff --git a/src/js/ui/components/previewArea/index.js b/src/js/ui/components/previewArea/index.js new file mode 100644 index 0000000..153fe6f --- /dev/null +++ b/src/js/ui/components/previewArea/index.js @@ -0,0 +1,13 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +export const previewArea = { + element: "div", + className: "preview" +}; + +// @license-end diff --git a/src/js/ui/components/progressArea/index.js b/src/js/ui/components/progressArea/index.js new file mode 100644 index 0000000..428481b --- /dev/null +++ b/src/js/ui/components/progressArea/index.js @@ -0,0 +1,33 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +export const progressArea = { + element: "div", + className: "dialog", + innerHTML: [ + { + element: "h3", + innerText: "Progress" + }, + { + element: "progress", + id: "total-progress", + value: 0 + }, + { + element: "progress", + id: "http-progress", + value: 0 + }, + { + element: "pre", + id: "current-log-message" + } + ] +}; + +// @license-end diff --git a/src/js/ui/components/renderForm/index.js b/src/js/ui/components/renderForm/index.js new file mode 100644 index 0000000..ed9e4b7 --- /dev/null +++ b/src/js/ui/components/renderForm/index.js @@ -0,0 +1,45 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +const label = { + element : "h3", + innerText: "Render explicit zblock" +}; + +const input = { + element: "input", + id:"search-field", + type:"text", + name:"search", + placeholder:"Enter a zblock hash" +}; + +const button = { + element:"button", + onclick:"seekZblock(this.parentElement.querySelector('#search-field').value, ['search', false])", + innerText:"Render" +} + +const container = { + element: "div", + style:"padding: 1vh 1vw; display: flex; flex-direction: row; align-items: center; gap: 10px;", + innerHTML: [ + input, + button + ] +}; + +export const renderForm = { + element: "div", + style:"padding: 1vh 1vw; display: flex; flex-direction: column; align-items: center; gap: 10px;", + innerHTML: [ + label, + container + ] +}; + +// @license-end diff --git a/src/js/ui/components/resultsArea/index.js b/src/js/ui/components/resultsArea/index.js new file mode 100644 index 0000000..58b72ca --- /dev/null +++ b/src/js/ui/components/resultsArea/index.js @@ -0,0 +1,19 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +export const resultsArea = { + element: "div", + className: "results-area", + innerHTML: [ + { + element: "h3", + innerText: "Results" + } + ] +}; + +// @license-end diff --git a/src/js/ui/components/scanButtons/index.js b/src/js/ui/components/scanButtons/index.js new file mode 100644 index 0000000..2e7d33b --- /dev/null +++ b/src/js/ui/components/scanButtons/index.js @@ -0,0 +1,35 @@ +// Arching Kaos Welcome Section +// +// Kaotisk Hund - 2024 +// +// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 +// + +export const scanMethodsArea = { + element: "div", + id: "scan-methods-area", + innerHTML: [ + { + element: "h3", + innerText: "Manual scan" + }, + { + element: "div", + id: "manual-scan-section", + innerHTML: [ + { + element: "div", + className: "manual-scan", + innerHTML: [ + { element:"button", onclick:"scanStellarNetworkForPeers()", innerText:"Check Stellar Network"}, + { element:"button", onclick:"checkLocalNodeInfo()", innerText:"Check local Node"}, + { element:"button", onclick:"checkLocalPeers()", innerText:"Check local Peers"}, + { element:"button", onclick:"checkLocalSchain()", innerText:"Check Local Schain"} + ] + } + ] + }, + ] +} + +// @license-end diff --git a/src/js/ui/sections/welcomeSection.js b/src/js/ui/sections/welcomeSection.js index cfa6816..72c9646 100644 --- a/src/js/ui/sections/welcomeSection.js +++ b/src/js/ui/sections/welcomeSection.js @@ -6,6 +6,15 @@ // import { makeElement } from "../../arching-kaos-generator.js"; +import { homeGrid } from "../components/homeGrid/index.js"; +import { scanMethodsArea } from "../components/scanButtons/index.js"; +import { akfsGetForm } from "../components/akfsGet/index.js"; +import { renderForm } from "../components/renderForm/index.js"; +import { manualPeerForm } from "../components/manualPeer/index.js"; +import { progressArea } from "../components/progressArea/index.js"; +import { logsArea } from "../components/logsArea/index.js"; +import { previewArea } from "../components/previewArea/index.js"; +import { resultsArea } from "../components/resultsArea/index.js"; var whereAmI = { element: "div", @@ -22,180 +31,20 @@ var greeting = { innerText: "Welcome to Arching Kaos project." }; -var homeGrid = { - element: "div", - id: "home-grid", - innerHTML: [ - { - element:"button", - className:"menu-clickable", - id:"#/mixtapes-section", - onclick:"menusel(this)", - style:"background-image: url(img/mixtapes-logo.png); background-repeat: round;" - }, - { - element:"button", - className:"menu-clickable", - id:"#/news-section", - onclick:"menusel(this)", - style:"background-image: url(img/news-logo.png); background-repeat: round;" - }, - { - element:"button", - className:"menu-clickable", - id:"#/chat-section", - onclick:"menusel(this)", - style:"background-image: url(img/chat-logo.png); background-repeat: round;" - }, - { - element:"button", - className:"menu-clickable", - id:"#/radio-section", - onclick:"menusel(this)", - style:"background-image: url(img/radio-logo.png); background-repeat: round; background-size: cover;" - }, - { - element:"button", - className:"menu-clickable", - id:"#/stats-section", - onclick:"menusel(this)", - // innerText:"Stats", - style:"background-image: url(img/stats-logo.png); background-repeat: round; background-size: cover;" - } - ] -}; - -var renderTitle = { - element : "h3", - innerText: "Render explicit zblock" -}; - -var renderForm = { - element: "div", - style:"padding: 1vh 1vw; display: flex; flex-direction: row; align-items: center; gap: 10px;", - innerHTML: [ - { - element: "input", - id:"search-field", - type:"text", - name:"search", - placeholder:"Enter a zblock hash" - }, - { - element:"button", - onclick:"seekZblock(this.parentElement.querySelector('#search-field').value, ['search', false])", - innerText:"Render" - } - ] -}; - -var manualPeerTitle = { - element : "h3", - innerText: "Connect to specific peer manually" -}; - -var manualPeerForm = { - element: "div", - style:"padding: 1vh 1vw; display: flex; flex-direction: row; align-items: center; gap: 10px;", - innerHTML: [ - { - element: "input", - id:"peer-field", - type:"text", - name:"search", - placeholder:"Enter an arching-kaos node address" - }, - { - element:"button", - onclick:"seekPeer(this.parentElement.querySelector('#peer-field').value, ['search', false])", - innerText:"Try" - } - ] -}; - var content = { element : "div", className: "content", innerHTML: [ greeting, homeGrid, - renderTitle, renderForm, - manualPeerTitle, + akfsGetForm, manualPeerForm, - { - element: "div", - className: "results-area", - innerHTML: [ - { - element: "h3", - innerText: "Results" - } - ] - }, - { - element: "h3", - innerText: "Manual scan" - }, - { - element: "div", - id: "manual-scan-section", - innerHTML: [ - { - element: "div", - className: "manual-scan", - innerHTML: [ - { element:"button", onclick:"scanStellarNetworkForPeers()", innerText:"Check Stellar Network"}, - { element:"button", onclick:"checkLocalNodeInfo()", innerText:"Check local Node"}, - { element:"button", onclick:"checkLocalPeers()", innerText:"Check local Peers"}, - { element:"button", onclick:"checkLocalSchain()", innerText:"Check Local Schain"} - ] - } - ] - }, - { - element: "div", - className: "preview" - }, - { - element: "div", - className: "dialog", - innerHTML: [ - { - element: "h3", - innerText: "Progress" - }, - { - element: "progress", - id: "total-progress", - value: 0 - }, - { - element: "progress", - id: "http-progress", - value: 0 - }, - { - element: "pre", - id: "current-log-message" - } - ] - }, - { - element: "details", - id: "logs-area", - innerHTML: [ - { - element: "summary", - innerText: "Logs (click to expand)" - }, - { - element: "div", - style: "font-size: 9px;", - id: "logs-area-element" - } - ] - } + resultsArea, + scanMethodsArea, + previewArea, + progressArea, + logsArea ] }; @@ -209,7 +58,6 @@ export function welcomeSection() content ] }; - makeElement(welcomeSection, document.querySelector('.main')); } // @license-end -- cgit v1.2.3