aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorkaotisk <kaotisk@arching-kaos.org>2022-11-09 22:55:06 +0200
committerkaotisk <kaotisk@arching-kaos.org>2022-11-09 22:55:06 +0200
commit88b8b5e68a41d1f3c6c4d548452a29941db09828 (patch)
tree18e5ee8ba139376857fa64120a132cc9d2c0116c /src
parente671e781a5ef5d77e9af0039b44e22b3eaa9b495 (diff)
downloadarching-kaos-web-ui-88b8b5e68a41d1f3c6c4d548452a29941db09828.tar.gz
arching-kaos-web-ui-88b8b5e68a41d1f3c6c4d548452a29941db09828.tar.bz2
arching-kaos-web-ui-88b8b5e68a41d1f3c6c4d548452a29941db09828.zip
Pre separation with tons of updates
Diffstat (limited to 'src')
-rw-r--r--src/css/akn.css124
-rw-r--r--src/index.html892
-rw-r--r--src/js/app.js771
3 files changed, 1787 insertions, 0 deletions
diff --git a/src/css/akn.css b/src/css/akn.css
new file mode 100644
index 0000000..e1ead05
--- /dev/null
+++ b/src/css/akn.css
@@ -0,0 +1,124 @@
+pre { white-space: pre-wrap; }
+#stellar-freigher-connect-address {
+ position: fixed;
+ top: 0;
+ right: 7vw;
+ z-index: 998;
+ padding: 0.5vh 1vw;
+ font-size: 0.9rem;
+}
+#stats-section div {
+ border: #1c241c 2px solid;
+ color: #ff1e1e;
+ padding: 2px;
+ width: fit-content;
+ margin: 0;
+}
+#progress {
+ word-wrap: break-word;
+}
+select {
+ border: 1px solid;
+ background-color: #1a1a1a;
+ color: #7ef07e;
+}
+article {
+ border: 2px solid #672178;
+ padding: 24px;
+}
+.sidebar{
+ position: fixed;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ float: left;
+ max-width: 25vw;
+ padding-right: 1vw;
+ padding-left: 1vw;
+ padding-top: 1vh;
+ padding-bottom: 1vh;
+}
+
+.main{
+ position: absolute;
+ top: 0;
+ right: 2vw;
+ left: 27vw;
+ max-width: 86vw;
+ width: auto;
+ padding-left: 2vw;
+ padding-right: 2vw;
+ padding-top: 1vh;
+ padding-bottom: 1vh;
+ overflow-y: auto;
+ max-height: 89vh;
+}
+@font-face {
+ font-family: 'terminessttf_nerd_font_monoMd';
+ src: url('https://ipfs.arching-kaos.com/ipfs/QmTiFZ9BjPGaoz5FEqsy5FJcVNRXrknsGkLPQXca6fb8Hz?filename=terminess_ttf_nerd_font_complete_mono-webfont.woff2') format('woff2'),
+ url('https://ipfs.arching-kaos.com/ipfs/QmeTV8JiVLdYw4Jt1gDngH2P6dZXkDucNKaruSMMAMkMhq?filename=terminess_ttf_nerd_font_complete_mono-webfont.woff') format('woff');
+ font-weight: normal;
+ font-style: normal;
+}
+body {
+ position: relative;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 0;
+ margin: 0;
+ display: block;
+ font-family: 'terminessttf_nerd_font_monoMd';
+}
+.footer {
+ position: fixed;
+ height: 8vh;
+ bottom: 0;
+ background: #1c241c;
+ width: -moz-available;
+ width: -webkit-fill-available;
+}
+.header img {
+ max-width: 15vw;
+ width: -moz-available;
+ width: -webkit-fill-available;
+}
+h1 {
+ font-size: large;
+}
+#menu {
+ padding: 2px;
+}
+#menu a {
+ display: flex;
+}
+#menu a {
+ display: flex;
+ background: #1c241c;
+ border: 1px solid #17392e;
+ padding: 1px;
+ margin: 1px;
+}
+#menu a:hover {
+ background: #008033;
+}
+div {
+ padding: 0;
+}
+.hsm {
+ z-index: 999;
+ position: fixed;
+ text-decoration-line: overline;
+ background: #1c241c;
+ border: 1px solid #1c241c;
+ box-shadow: 2px 2px #2c223c;
+ top: 0px;
+ text-shadow: 1px 2px #461551;
+ right: 1vw;
+}
+audio {
+ width: -webkit-fill-available;
+ width: -moz-available;
+}
+
diff --git a/src/index.html b/src/index.html
new file mode 100644
index 0000000..13637fa
--- /dev/null
+++ b/src/index.html
@@ -0,0 +1,892 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>Arching Kaos</title>
+ <link rel="stylesheet" type="text/css" href="//ipfs.arching-kaos.com/ipfs/Qmcusex5HCKKeKAouXtUiwGoFxZzzsvcmo4dGewKBETwDv?filename=style2.css">
+ <link rel="stylesheet" type="text/css" href="//ipfs.arching-kaos.com/ipfs/Qme4Lao1ffeyDtn4r9z8ZPCUPipRWJHPJig9Kh9XHw1ete?filename=style.css">
+ <link rel="stylesheet" type="text/css" href="./css/akn.css">
+ <style type="text/css">
+ </style>
+ <link rel="icon" href="https://ipfs.arching-kaos.com/ipfs/QmagKP1zLWaGHLR4191dpvsCYHS8tuPCRYJgfK9Zdr6i9S?filename=logo.png" sizes="32x32">
+ <link rel="icon" href="https://ipfs.arching-kaos.com/ipfs/QmagKP1zLWaGHLR4191dpvsCYHS8tuPCRYJgfK9Zdr6i9S?filename=logo.png" sizes="192x192">
+ <link rel="apple-touch-icon" href="https://ipfs.arching-kaos.com/ipfs/QmagKP1zLWaGHLR4191dpvsCYHS8tuPCRYJgfK9Zdr6i9S?filename=logo.png">
+ <meta name="msapplication-TileImage" content="https://ipfs.arching-kaos.com/ipfs/QmagKP1zLWaGHLR4191dpvsCYHS8tuPCRYJgfK9Zdr6i9S?filename=logo.png">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/stellar-freighter-api/1.1.2/index.min.js"></script>
+ <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+</head>
+<body>
+ <p class="hsm" onclick="hsm()">Hide menu</p>
+ <div class="sidebar">
+ <div class="header">
+ <img src="//ipfs.arching-kaos.com/ipfs/QmcyDhApg19qDcjdCpTFaezXrjfcUrC9MZq9wKo69trRDH">
+ <h1 style="text-align: center;">Arching Kaos</h1>
+ </div>
+ <div class="options-menu" style="display:none;">
+ <select>
+ <option value="ARCHINGKAOS">ARCHINGKAOS</option>
+ <option value="KAOTISKHUND" disabled>KAOTISKHUND</option>
+ </select>
+ <select>
+ <option value="archingkaos">ipfs.arching-kaos.com</option>
+ <option value="ipfsio" disabled>ipfs.io</option>
+ <option value="localhost" disabled>localhost</option>
+ </select>
+ </div>
+ <hr>
+ <div id="menu" class="linkin">
+ <a href="#welcome-section" onclick="menusel(this)">Home</a>
+ <a href="#mixtapes-section" onclick="menusel(this)">Mixtapes</a>
+ <a href="#news-section" onclick="menusel(this)">News</a>
+ <a href="#files-section" onclick="menusel(this)">Files</a>
+ <a href="#zchain-data-section" onclick="menusel(this)">zchain</a>
+ <a href="#stats-section" onclick="menusel(this)">Stats</a>
+ <a href="#chat-section" onclick="menusel(this)">Chat</a>
+ <a href="#about-section" onclick="menusel(this)">About</a>
+ <a href="#loading-status" onclick="menusel(this)">Logs</a>
+ </div>
+</div>
+<div id="stellar-freigher-connect-address" onmouseenter="showStellar()" onmouseleave="hideStellar()">
+<button class="sub-input" id="stellar-freigher-connect-address-button" onclick="connect()" >Connect with Stellar address</button>
+<div id="stellar-related-dropdown" class="linkin">
+ <div id="menu">
+ <span id="mypage-section-link"><a href="#mypage-section" onclick="menusel(this)">My page</a> </span>
+ <span id="stellar-balances-link"><a href="#stellar-balances" onclick="menusel(this)">Balances</a> </span>
+ <span id="stellar-data-config-link"><a href="#stellar-data-config" onclick="menusel(this)">Data</a> </span>
+ <span id="arching-kaos-id-link"><a href="#arching-kaos-id" onclick="menusel(this)">AKID</a> </span>
+ </div>
+</div>
+</div>
+<div class="main">
+ <div id="welcome-section">
+ <h2>Welcome!!!</h2>
+ <p>This is the application page of Arching Kaos project.</p>
+ <p>Please wait for your web browser to find the content!</p>
+ <p>Loading ...</p>
+ <progress id="total-progress"></progress>
+ <pre id="logtext"></pre>
+ <em>* When you see "Reached genesis link..." it means that a zchain was properly loaded in the page.</em>
+ </div>
+ <div id="about-section">
+ <h2>About</h2>
+ <p>Arching Kaos is a project about radio, music, communications and decentralization.</p>
+ <p>On site, you can listen to the latest mixes of music (menu entry "Mixtapes"), read latest news ("News") of the network and chat (you guessed it, "Chat" menu entry).</p>
+ <p>You can see the zchains appearing in "zchain" and logs of the process on "Logs"</p>
+ <p>Note that to participate you will need to set up your Arching Kaos set, which is not so convinient yet but possible.</p>
+ <p>Furthermore, if you are using Freighter extension you can additionally see:</p>
+ <ol>
+ <li>Your balances on your wallet</li>
+ <li>Your configuration IPNS address (if any)</li>
+ <li>Your Arching Kaos configuration (if any)</li>
+ <li>Your zchain (...)</li>
+ <li>Your posted newsfeed (...)</li>
+ </ol>
+ <p>Finally, on the stats page you can find people that are participating over the Stellar Network, using the ARCHINGKAOS token/asset/coin.</p>
+ </div>
+ <div id="stellar-balances"><h2>Balances</h2><em id="stellar-balances-not-found">No data found (yet?)!</em><table id="stellar-balances-table"></table></div>
+ <div id="stellar-data-config"><h2>Data</h2><em id="stellar-data-config-not-found">No data found (yet?)!</em></div>
+ <div id="arching-kaos-id"><h2>AKID</h2><em id="akid-not-found">No data found (yet?)!</em></div>
+ <div id="mypage-section">
+ <h2>My page</h2>
+ <div id="my-news"><h3>My news</h3><em id="my-news-sec-not-found">No data found (yet?)!</em></div>
+ <div id="my-mixtapes"><h3>My mixtapes</h3><em id="my-mixtapes-sec-not-found">No data found (yet?)!</em></div>
+ <div id="my-zchain"><h3>My zchain</h3><em id="my-zchain-sec-not-found">No data found (yet?)!</em></div>
+ </div>
+ <div id="zchain-data-section"><h2>zchains</h2><em id="zchain-data-sec-not-found">No data found (yet?)!</em></div>
+ <div id="news-section"><h2>News</h2><em id="news-sec-not-found">No data found (yet?)!</em></div>
+ <div id="mixtapes-section"><h2>Mixtapes</h2><em id="mixtapes-sec-not-found">No data found (yet?)!</em></div>
+ <div id="files-section"><h2>Files</h2><em id="files-sec-not-found">No data found (yet?)!</em></div>
+ <div id="chat-section"><h2>Chat</h2>
+ <iframe src="https://irc.arching-kaos.com" style="width: -webkit-fill-available; width: -moz-available; height: 80vh;"></iframe>
+ </div>
+ <div id="stats-section"><h2>Stats</h2></div>
+ <div id="loading-status"><h2>Logs</h2></div>
+</div>
+<div class="footer">
+ <hr>
+ Arching Kaos <a target="_blank" href="https://git.kaotisk-hund.com/arching-kaos-tools/.git">Tools</a>, <a target="_blank" href="https://arching-kaos.org">Org</a>, <a target="_blank" href="https://arching-kaos.net">Net</a> |
+ <a target="_blank" href="https://github.com/arching-kaos/arching-kaos-web-ui/issues/new/choose">Report an issue</a> |
+ Powered by <a target="_blank" href="https://www.kaotisk-hund.com">Kaotisk Hund</a>.
+</div>
+</body>
+<script src="//cdnjs.cloudflare.com/ajax/libs/stellar-sdk/10.0.1/stellar-sdk.js"></script>
+<script src="./js/app.js"></script>
+<!--<script>
+ var progressPlaceholder = document.querySelector('#total-progress');
+ var logtextPlaceholder = document.querySelector('#logtext');
+ progressPlaceholder.value = '0';
+ /*
+ * Show and hide the menu
+ */
+ function hsm(){
+ var m = document.querySelector('.sidebar');
+ var t = document.querySelector('.hsm');
+ var c = document.querySelector('.main');
+ if (m.hidden===true){
+ m.hidden=false;
+ t.innerHTML = "Hide menu";
+ c.style.maxWidth = "100vw"
+ c.style.left = "27vw";
+ } else {
+ m.hidden=true;
+ t.innerHTML = "Show menu";
+ c.style.maxWidth = "100vw";
+ c.style.left = "1vw";
+ }
+ }
+
+ var profilemenuids = [];
+ /*
+ * Array of all the menu-panes IDs
+ */
+ var menuids = ['#welcome-section','#about-section','#zchain-data-section','#news-section','#stats-section','#mixtapes-section','#chat-section','#mypage-section','#stellar-balances','#stellar-data-config','#arching-kaos-id', '#loading-status', '#files-section'];
+ // Function to hide all the panes
+ function menuinit(){
+ menuids.forEach(m=>document.querySelector(m).hidden=true);
+ }
+ // And call
+ menuinit();
+ // We bring up the default pane ( #welcome-section )
+ document.querySelector('#welcome-section').hidden=false;
+
+ /*
+ * Function called on clicks on the menu bar
+ * Unhides the pane connected to the clicked menu entry
+ */
+ function menusel(m){
+ menuinit();
+ document.querySelector(m.hash).hidden=false;
+ }
+
+ // Here we store the participants found
+ var participants = [];
+
+ // loading-status element
+ var lse = document.querySelector("#loading-status");
+ /*
+ * Get Trustlines for ARCHINGKAOS asset
+ * Returns DOM element with number of trustlines
+ */
+ function gettrustlines(){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Loading trustlines...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ var url='https://horizon.stellar.org/assets?asset_code=ARCHINGKAOS&asset_issuer=GB4QVKD6NW3CSNO5TNPARAWNPPXOPSSTKB35XCWB7PUNBIQTK3DVELB2';
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ var stats = document.querySelector('#stats-section')
+ var small = document.createElement("small")
+ small.innerHTML = 'Connected trustlines: ' + json._embedded.records[0].accounts.authorized
+ stats.appendChild(small)
+ })
+ }
+ sta.innerHTML+=" Done!"
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ })
+ }
+ gettrustlines()
+ /*
+ * Get addresses that trust the asset
+ * Limit is 200 addresses cause horizon API limitations.
+ *
+ * TODO: Crawl through the pagination
+ *
+ * Returns div DOM elements for each found address, embedding
+ * the address both in innerHTML and in id of the div.
+ */
+ function getholders(a=0){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Searching holders..."
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ var url='https://horizon.stellar.org/accounts?asset=ARCHINGKAOS:GB4QVKD6NW3CSNO5TNPARAWNPPXOPSSTKB35XCWB7PUNBIQTK3DVELB2&limit=200'
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ var stats = document.querySelector('#stats-section')
+ json._embedded.records.forEach(r=>{
+ var p = document.createElement("div")
+ p.innerHTML = r.account_id
+ p.id = r.account_id
+ checkforconfig(r.account_id)
+ stats.appendChild(p)
+ })
+ // if (json._links.next) getholders(json._links.next.href)
+ })
+ }
+ })
+ sta.innerHTML+=" Done"
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ }
+ getholders()
+
+ /*
+ * Function that checks the address' variable 'config' to see
+ * if it's set up.
+ *
+ * Returns the IPNS link in the DOM as p element and proceeds to
+ * get nickname from the variables
+ */
+ function checkforconfig(addr) {
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Checking configuration for "+ addr+ "..."
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ url='https://horizon.stellar.org/accounts/'+addr+'/data/config'
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ var cnf = document.createElement("p")
+ if(document.querySelector("#stellar-data-config-not-found")) document.querySelector("#stellar-data-config-not-found").hidden = true;
+ cnf.innerHTML = atob(json.value)
+ document.querySelector('#'+addr).appendChild(cnf)
+ document.querySelector('#'+addr).style="color: #3dbb3d;"
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ getnickname(atob(json.value),addr)
+ })
+ }
+ })
+ }
+
+ /*
+ * Function that gets nickname and parses the config variable.
+ *
+ * Returns the key:value pairs of the configuration and proceeds
+ * to get the zchain
+ */
+ function getnickname(a,eid){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Parsing the configuration..."
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ url='https://ipfs.arching-kaos.com/ipns/'+a
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ /* Could be json object with
+ * - genesis
+ * - gpg
+ * - profile {
+ * - nickname
+ * }
+ * - zchain
+ */
+ var divs = document.querySelector('#'+eid)
+ if(json.genesis){
+ var p = document.createElement("p")
+ p.innerHTML="Genesis: " +json.genesis
+ divs.appendChild(p)
+ }
+ if(json.gpg){
+ var p = document.createElement("p")
+ p.innerHTML="GPG: " +json.gpg
+ divs.appendChild(p)
+ }
+ if(json.profile.nickname){
+ var p = document.createElement("p")
+ p.innerHTML="Nickname: " +json.profile.nickname
+ divs.appendChild(p)
+ }
+ if(json.zchain){
+ var p = document.createElement("p")
+ p.innerHTML="zchain: " +json.zchain
+ divs.appendChild(p)
+ }
+ participants[eid]=json;
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ zseek(json.zchain);
+ })
+ }
+ })
+ }
+
+ /*
+ * We now connect our client to horizon
+ */
+ var server = new StellarSdk.Server('https://horizon.stellar.org');
+ // We ask for the 'a' stellar address the balances
+ function letme(a){
+ server.accounts()
+ .accountId(a)
+ .call().then(function(r){ const L = r; putit(r); });
+ }
+ // We print them
+ function putit(i){
+ var ta=document.querySelector("#stellar-balances-table");
+ readit(i);
+ for (b in i.balances) {
+ var row = document.createElement("tr");
+ x = i.balances[b];
+ var amount = document.createElement("td");
+ var assetCode = document.createElement("td");
+ amount.innerHTML = x.balance;
+ assetCode.innerHTML = ( x.asset_code && x.asset_code != "undefined" ? x.asset_code : 'XLM');
+ row.appendChild(assetCode);
+ row.appendChild(amount);
+ ta.appendChild(row);
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ if(document.querySelector("#stellar-balances-not-found")) document.querySelector("#stellar-balances-not-found").hidden = true;
+ }
+ }
+ // We also search for a config file and display it
+ async function dataf(i){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Loading your profile...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ url='https://horizon.stellar.org/accounts/'+i+'/data/config'
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ var cnf = document.createElement("p");
+ cnf.innerHTML = atob(json.value);
+ document.querySelector('#stellar-data-config').appendChild(cnf);
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ akiseek(atob(json.value));
+ })
+ }
+ })
+ }
+ // Although we implemented something similar already,
+ // it seems like I was not happy so JRM
+ // #TODO : Revisit this
+
+ /*
+ * Function to seek configuration for any address i
+ * it's used to seek specifically the Freighter user's address.
+ *
+ * Returns p DOM elements on #arching-kaos-id pane
+ */
+ function akiseek(i){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Parsing AKID...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ url='https://ipfs.arching-kaos.com/ipns/'+i;
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ /* Could be json object with
+ * - genesis
+ * - gpg
+ * - profile {
+ * - nickname
+ * }
+ * - zchain
+ */
+ var divs = document.querySelector('#arching-kaos-id');
+ if(json.genesis){
+ var p = document.createElement("p");
+ p.innerHTML="Genesis: " +json.genesis;
+ divs.appendChild(p);
+ }
+ if(json.gpg){
+ var p = document.createElement("p");
+ p.innerHTML="GPG: " +json.gpg;
+ divs.appendChild(p);
+ }
+ if(json.profile.nickname){
+ var p = document.createElement("p");
+ p.innerHTML="Nickname: " +json.profile.nickname;
+ divs.appendChild(p);
+ }
+ if(json.zchain){
+ var p = document.createElement("p");
+ p.innerHTML="zchain: " +json.zchain;
+ divs.appendChild(p);
+ }
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ zseek(json.zchain,eid,json);
+ })
+ }
+ })
+ }
+ /*
+ * Function to seek Zblocks
+ *
+ * Returns Block and Signature for each ZBLOCK found.
+ *
+ * Proceeds to the blocks found.
+ */
+ function zseek(i,d,j){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Seeking zchain "+i+"...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ var divs = document.querySelector('#zchain-data-section');
+ if(i){
+ var p = document.createElement("p");
+ p.innerHTML="zchain: " +i;
+ divs.appendChild(p);
+ }
+ lse.appendChild(sta);
+ url = 'https://ipfs.arching-kaos.com/ipns/'+i;
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ /* Could be json object with
+ * - block
+ * - block_signature
+ */
+ var divs = document.querySelector('#zchain-data-section');
+ if(json.block){
+ var p = document.createElement("p");
+ p.innerHTML="Block: " +json.block;
+ divs.appendChild(p);
+ }
+ if(json.block_signature){
+ var p = document.createElement("p");
+ p.innerHTML="Signature: " +json.block_signature;
+ divs.appendChild(p);
+ }
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ seekblock(json.block,i,d,j);
+ })
+ }
+ })
+ }
+
+ /*
+ * Seeks a block and parses it.
+ *
+ * Returns each element found in #zchain-data-section pane.
+ *
+ * Proceeds to execute the block.
+ */
+ function seekblock(i,l,d,j){
+ console.log(i,l,d,j);
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Seeking block "+i+"...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ url = 'https://ipfs.arching-kaos.com/ipfs/'+i;
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ /* Could be json object with
+ * - action
+ * - data
+ * - gpg
+ * - timestamp
+ * - previous
+ * - detach
+ */
+ var divs = document.querySelector('#zchain-data-section');
+ if(json.action){
+ var p = document.createElement("p");
+ p.innerHTML="Action: " +json.action;
+ divs.appendChild(p);
+ }
+ if(json.detach){
+ var p = document.createElement("p");
+ p.innerHTML="Detach: " +json.detach;
+ divs.appendChild(p);
+ }
+ if(json.gpg){
+ var p = document.createElement("p");
+ p.innerHTML="GPG: " +json.gpg;
+ divs.appendChild(p);
+ }
+ if(json.data){
+ var p = document.createElement("p");
+ var a = document.createElement("a");
+ a.href = 'https://ipfs.arching-kaos.com/ipfs/'+json.data;
+ a.innerHTML = json.data;
+ p.innerHTML="Data: ";
+ p.appendChild(a);
+ divs.appendChild(p);
+ }
+ if(json.timestamp){
+ var p = document.createElement("p");
+ p.innerHTML="Timestamp: " +json.timestamp;
+ divs.appendChild(p);
+ }
+ if(json.previous){
+ var p = document.createElement("p");
+ p.innerHTML="Previous: " +json.previous;
+ divs.appendChild(p);
+ }
+ divs.appendChild(document.createElement("hr"));
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ exe(json.action,json.data,json,l,d,j);
+ if(json.previous!="QmbFMke1KXqnYyBBWxB74N4c5SBnJMVAiMNRcGu6x1AwQH"){
+ seekzblock(json.previous);
+ } else {
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Reached genesis link: "+json.previous+"!";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ }
+ })
+ }
+ })
+ }
+
+ // seeks a zblock obviously. another double function
+ // TODO: figure out why the second one exists
+
+ /*
+ * Function gets ZBLOCK and parses it
+ *
+ * Returns Block and Signature elements on DOM as p
+ *
+ * Proceeds to seek the block found
+ */
+ function seekzblock(i){
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Seeking ZBLOCK "+i+"...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ var divs = document.querySelector('#zchain-data-section');
+ if (document.querySelector("#zchain-data-sec-not-found")) document.querySelector("#zchain-data-sec-not-found").hidden=true;
+ if(i){
+ var p = document.createElement("p");
+ p.innerHTML="zblock: " +i;
+ divs.appendChild(p);
+ }
+ lse.appendChild(sta);
+ url = 'https://ipfs.arching-kaos.com/ipfs/'+i;
+ fetch(url, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ /* Could be json object with
+ * - block
+ * - block_signature
+ */
+ var divs = document.querySelector('#zchain-data-section');
+ if(json.block){
+ var p = document.createElement("p");
+ p.innerHTML="Block: " +json.block;
+ p.id=i;
+ divs.appendChild(p);
+ }
+ if(json.block_signature){
+ var p = document.createElement("p");
+ p.innerHTML="Signature: " +json.block_signature;
+ divs.appendChild(p);
+ }
+ progressPlaceholder.max++;
+ progressPlaceholder.value++;
+ seekblock(json.block,i);
+ })
+ }
+ })
+ }
+
+ /*
+ * Function that executes a specified block
+ *
+ * Returns the result of execution on the proper page in DOM
+ */
+ function exe(a,d,j,x,y,z){
+ //console.log("Executing...",a,d,j,x,y,z)
+ var sta = document.createElement("pre");
+ sta.innerHTML = "Executing block "+d+"...";
+ logtextPlaceholder.innerHTML = sta.innerHTML;
+ lse.appendChild(sta);
+ gurl = 'https://ipfs.arching-kaos.com/ipfs/'
+ fetch(gurl+d, {
+ method:'GET',
+ headers:{
+ Accept: 'application/json'
+ }
+ }).then(response=>{
+ if(response.ok){
+ response.json().then(json=>{
+ /* Could be json object with
+ * - block
+ * - block_signature
+ */
+ if (a == "files/add") {
+ var divs = document.querySelector('#files-section');
+ var art = document.createElement("article");
+ art.id = d;
+ if(json.title){
+ var h3 = document.createElement("h3");
+ h3.innerHTML = json.filename;
+ art.appendChild(h3);
+ }
+ if(json.datetime){
+ var small = document.createElement("p");
+ small.innerHTML="Published: " +json.datetime;
+ art.appendChild(small);
+ }
+ for (let i in participants){
+ if ( participants[i].gpg === j.gpg ){
+ if (participants[i].profile.nickname){
+ var small = document.createElement("p");
+ small.innerHTML="Author: " +participants[i].profile.nickname;
+ art.appendChild(small);
+ }
+ }
+ }
+ if(json.ipfs){
+ // getipfstext(json.ipfs,art.id);
+ var small = document.createElement("a");
+ small.innerHTML=json.filename;
+ small.href="https://ipfs.arching-kaos.com/ipfs/"+json.ipfs+"?filename="+json.filename;
+ art.appendChild(small);
+ }
+ divs.appendChild(art);
+ if(document.querySelector("#files-sec-not-found")) document.querySelector("#files-sec-not-found").hidden = true;
+ divs.appendChild(document.createElement("hr"));
+ }
+ if (a == "news/add") {
+ var divs = document.querySelector('#news-section');
+ var art = document.createElement("article");
+ art.id = d;
+ if(json.title){
+ var h3 = document.createElement("h3");
+ h3.innerHTML = json.title;
+ art.appendChild(h3);
+ }
+ if(json.datetime){
+ var small = document.createElement("p");
+ small.innerHTML="Published: " +json.datetime;
+ art.appendChild(small);
+ }
+ for (let i in participants){
+ if ( participants[i].gpg === j.gpg ){
+ if (participants[i].profile.nickname){
+ var small = document.createElement("p");
+ small.innerHTML="Author: " +participants[i].profile.nickname;
+ art.appendChild(small);
+ }
+ }
+ }
+ if(json.ipfs){
+ getipfstext(json.ipfs,art.id);
+ }
+ if (document.querySelector("#news-sec-not-found")) document.querySelector("#news-sec-not-found").hidden=true;
+ divs.appendChild(art);
+ divs.appendChild(document.createElement("hr"));
+ }
+ if (a == "mixtape/add") {
+ var divs = document.querySelector('#mixtapes-section');
+ var art = document.createElement("article");
+ art.id = d;
+ if(json.title){
+ var h3 = document.createElement("h3");
+ h3.innerHTML = json.title;
+ art.appendChild(h3);
+ }
+ if(json.artist){
+ var h4 = document.createElement("h4");
+ h4.innerHTML = json.artist;
+ art.appendChild(h4);
+ }
+ if(json.datetime){
+ var small = document.createElement("small");
+ small.innerHTML="Published: " +json.datetime;
+ art.appendChild(small);
+ }
+ if(json.ipfs){
+ var audio = document.createElement("audio");
+ audio.setAttribute('controls','');
+ var source = document.createElement("source");
+ source.src = 'https://ipfs.arching-kaos.com/ipfs/' + json.ipfs;
+ audio.appendChild(source);
+ art.appendChild(audio);
+ }
+ if (document.querySelector("#mixtapes-sec-not-found")) document.querySelector("#mixtapes-sec-not-found").hidden=true;
+ divs.appendChild(art);
+ }
+ // seekblock(json.block)
+ progressPlaceholder.max++;
+ progressPla