Refactoring using ak-generator

7 files changed, 221 insertions, 184 deletions

diff --git a/src/js/arching-kaos-log.js b/src/js/arching-kaos-log.js
index 67a9d37..1f79994 100644
--- a/src/js/arching-kaos-log.js
+++ b/src/js/arching-kaos-log.js
@@ -7,11 +7,12 @@
  */
 
 function archingKaosLog(message){
-    var sta = document.createElement("div");
     var lts = new Date(Date.now());
-    var fmsg = lts.toISOString() + " " + message;
-    sta.innerText = fmsg
-    currentLogMessageElement.innerHTML = fmsg;
-    logsAreaElement.appendChild(sta);
+    var sta = {
+        element:"div",
+        innerText: lts.toISOString() + " " + message
+    };
+    currentLogMessageElement.innerText = sta.innerText;
+    makeElement(sta, logsAreaElement);
 }
 // @license-end
diff --git a/src/js/arching-kaos-modules-comments.js b/src/js/arching-kaos-modules-comments.js
index 041c481..aad581f 100644
--- a/src/js/arching-kaos-modules-comments.js
+++ b/src/js/arching-kaos-modules-comments.js
@@ -8,22 +8,29 @@
 function akModuleComments(zblockIPFSHash, blockObject, json){
     if (!document.querySelector('#comment-'+zblockIPFSHash)){
         var divs = document.querySelector('#comments-section');
-        var art = document.createElement("article");
-        art.id = 'comment-'+zblockIPFSHash;
+        var art = {
+            element:"article",
+            id: 'comment-'+zblockIPFSHash
+        };
+        makeElement(art, divs);
+        art = document.querySelector('#comment-'+zblockIPFSHash);
         if(json.datetime){
-            var small = document.createElement("p");
-            small.innerText="Published: " + new Date(json.datetime*1000);
-            art.appendChild(small);
+            var small = {
+                element:"p",
+                innerText:"Published: " + new Date(json.datetime*1000)
+            };
+            makeElement(small, art);
         }
-        var small = document.createElement("p");
-        small.innerText="Contributor: " + getNicknameAssossiatedWithGPG(blockObject.gpg);
-        art.appendChild(small);
+        var small = {
+            element:"p",
+            innerText:"Contributor: " + getNicknameAssossiatedWithGPG(blockObject.gpg)
+        };
+        makeElement(small, art);
         if(json.ipfs){
             getipfstext(json.ipfs,art.id);
         }
         if (document.querySelector("#comments-sec-not-found")) document.querySelector("#comments-sec-not-found").hidden=true;
-        divs.appendChild(art);
-        divs.appendChild(document.createElement("hr"));
+        makeElement(document.createElement("hr"), divs);
     }
 }
 // @license-end
diff --git a/src/js/arching-kaos-modules-files.js b/src/js/arching-kaos-modules-files.js
index f5aed1b..b566226 100644
--- a/src/js/arching-kaos-modules-files.js
+++ b/src/js/arching-kaos-modules-files.js
@@ -8,32 +8,19 @@
 function akModuleFiles(zblockIPFSHash, blockObject, json){
     if (!document.querySelector('#file-'+zblockIPFSHash)){
         var divs = document.querySelector('#files-section');
-        var art = document.createElement("article");
-        art.id = 'file-'+zblockIPFSHash;
-        if(json.title){
-            var h3 = document.createElement("h3");
-            h3.innerText = json.filename;
-            art.appendChild(h3);
-        }
-        if(json.datetime){
-            var small = document.createElement("p");
-            small.innerText="Published: " +json.datetime;
-            art.appendChild(small);
-        }
-        getNicknameAssossiatedWithGPG(blockObject.gpg);
-        var small = document.createElement("p");
-        small.innerText="Contributor: " + getNicknameAssossiatedWithGPG(blockObject.gpg);
-        art.appendChild(small);
-        if(json.ipfs){
-            //    getipfstext(json.ipfs,art.id);
-            var small = document.createElement("a");
-            small.innerText=json.filename;
-            small.href="https://ipfs.arching-kaos.com/ipfs/"+json.ipfs+"?filename="+json.filename;
-            art.appendChild(small);
-        }
-        divs.appendChild(art);
+        var art = {
+            element:"article",
+            id : 'file-'+zblockIPFSHash,
+            innerHTML: [
+                { element:"h3", innerText: (json.filename===null)?'':json.filename },
+                { element:"p", innerText:"Published: "+ (json.datetime===null)?'':json.datetime },
+                { element:"p", innerText:"Contributor: " + (getNicknameAssossiatedWithGPG(blockObject.gpg))?blockObject.gpg:getNicknameAssossiatedWithGPG(blockObject.gpg)},
+                { element:"a", innerText:json.filename, href:"https://ipfs.arching-kaos.com/ipfs/"+json.ipfs+"?filename="+json.filename}
+            ]
+        };
+        makeElement(art, divs);
         if(document.querySelector("#files-sec-not-found")) document.querySelector("#files-sec-not-found").hidden = true;
-        divs.appendChild(document.createElement("hr"));
+        makeElement({element:"hr"}, divs);
     }
 }
 // @license-end
diff --git a/src/js/arching-kaos-modules-mixtapes.js b/src/js/arching-kaos-modules-mixtapes.js
index 2702e95..ac23ed4 100644
--- a/src/js/arching-kaos-modules-mixtapes.js
+++ b/src/js/arching-kaos-modules-mixtapes.js
@@ -9,51 +9,52 @@
 function akModuleMixtapes(zblockIPFSHash, zblockObject, blockObject, json){
     if(!document.querySelector('#mixtape-'+zblockIPFSHash)){
         var divs = document.querySelector('#mixtapes-section');
-        var art = document.createElement("article");
-        art.id = 'mixtape-'+zblockIPFSHash;
-        if(json.title){
-            var h3 = document.createElement("h3");
-            h3.innerText = json.title;
-            art.appendChild(h3);
-        }
-        if(json.artist){
-            var h4 = document.createElement("h4");
-            h4.innerText = json.artist;
-            art.appendChild(h4);
-        }
-        if(json.timestamp){
-            var small = document.createElement("h5");
-            small.innerText="Published: " + new Date(json.timestamp*1000);
-            art.appendChild(small);
-        }
-        if(json.ipfs){
-            var audio = document.createElement("audio");
-            audio.setAttribute('controls','');
-            audio.id = 'mixtape-player-'+zblockIPFSHash;
-            mixtapeIds.push(audio.id);
-            var source = document.createElement("source");
-            source.src = getIPFSURL(json.ipfs);
-            var rs = source.cloneNode(true);
-            audio.appendChild(source);
-            //radio.appendChild(rs);
-            art.appendChild(audio);
-            audio.addEventListener( "loadedmetadata", ()=>{
-                if ( mixtapes[zblockIPFSHash] === undefined ){
-                    mixtapes[zblockIPFSHash]={
-                        zblock:zblockIPFSHash,
-                        block:zblockObject.block,
-                        block_signature:zblockObject.block_signature,
-                        action:blockObject.action,
-                        previous:blockObject.previous,
-                        data:blockObject.data,
-                        dataExpansion:json,
-                        detach:blockObject.detach,
-                        gpg:blockObject.gpg,
-                        timestamp:blockObject.timestamp,
-                        audioDuration:audio.duration
-                    };
+        var art = {
+            element:"article",
+            id:'mixtape-'+zblockIPFSHash,
+            innerHTML:[
+                {
+                    element:"h3",
+                    innerText:(json.title)?json.title:''
+                },
+                {
+                    element:"h4",
+                    innerText:(json.artist)?json.artist:''
+                },
+                {
+                    element:"h5",
+                    innerText:"Published: " + (json.timestamp)?new Date(json.timestamp*1000):''
+                },
+                {
+                    element:"audio",
+                    id:'mixtape-player-'+zblockIPFSHash,
+                    innerHTML:[
+                        { element:"source", src: getIPFSURL(json.ipfs)}
+                    ]
                 }
-                /* console.log(
+            ]
+        };
+        makeElement(art, divs);
+        var audio = document.querySelector('#mixtape-player-'+zblockIPFSHash);
+        audio.setAttribute('controls','');
+        mixtapeIds.push('mixtape-player-'+zblockIPFSHash);
+        audio.addEventListener( "loadedmetadata", ()=>{
+            if ( mixtapes[zblockIPFSHash] === undefined ){
+                mixtapes[zblockIPFSHash]={
+                    zblock:zblockIPFSHash,
+                    block:zblockObject.block,
+                    block_signature:zblockObject.block_signature,
+                    action:blockObject.action,
+                    previous:blockObject.previous,
+                    data:blockObject.data,
+                    dataExpansion:json,
+                    detach:blockObject.detach,
+                    gpg:blockObject.gpg,
+                    timestamp:blockObject.timestamp,
+                    audioDuration:audio.duration
+                };
+            }
+            /* console.log(
                                     zblockIPFSHash+"'s duration is: "+
                                     audio.duration +
                                     " Ceiled: " + Math.ceil(audio.duration) +
@@ -62,9 +63,7 @@ function akModuleMixtapes(zblockIPFSHash, zblockObject, blockObject, json){
                                     " DIFF: " + (blockObject.timestamp - json.timestamp)
                                 ); */
             }, false );
-        }
         if (document.querySelector("#mixtapes-sec-not-found")) document.querySelector("#mixtapes-sec-not-found").hidden=true;
-        divs.appendChild(art);
     }
 }
 // @license-end
diff --git a/src/js/arching-kaos-modules-news.js b/src/js/arching-kaos-modules-news.js
index 9292fad..0a1652a 100644
--- a/src/js/arching-kaos-modules-news.js
+++ b/src/js/arching-kaos-modules-news.js
@@ -9,34 +9,46 @@
 function akModuleNews(zblockIPFSHash, zblockObject, blockObject, json){
     if (!document.querySelector('#news-'+zblockIPFSHash)){
         var newsSectionDivElement = document.querySelector('#news-section');
-        var articleContainerElement = document.createElement("article");
-        articleContainerElement.id = 'news-'+zblockIPFSHash;
+        var articleContainerElement = {
+            element:"article",
+            id:'news-'+zblockIPFSHash
+        };
+        makeElement(articleContainerElement, newsSectionDivElement);
+        articleContainerElement = document.querySelector(`#news-${zblockIPFSHash}`);
         if(json.title){
-            var ubs = document.createElement("a");
-            ubs.innerText = json.title;
-            ubs.href = '#news-'+zblockIPFSHash;
-            articleContainerElement.appendChild(ubs);
-            var ahref = document.createElement("a");
-            ahref.innerText = '[permalink]';
-            ahref.target = '_blank';
-            ahref.href = 'https://news.arching-kaos.net/?from_zblock='+zblockIPFSHash;
-            articleContainerElement.appendChild(ahref);
+            var ubs = {
+                element:"a",
+                innerText : json.title,
+                href : '#news-'+zblockIPFSHash
+            };
+            makeElement(ubs, articleContainerElement);
+            var ahref = {
+                element:"a",
+                innerText:'[permalink]',
+                target: '_blank',
+                href:'https://news.arching-kaos.net/?from_zblock='+zblockIPFSHash
+            };
+            makeElement(ahref, articleContainerElement);
         }
         if(json.datetime){
-            var small = document.createElement("p");
-            small.innerText="Published: " + new Date(blockObject.timestamp*1000);
-            articleContainerElement.appendChild(small);
+            var small = {
+                element:"p",
+                innerText:"Published: " + new Date(blockObject.timestamp*1000)
+            };
+            makeElement(small, articleContainerElement);
         }
-        var small = document.createElement("p");
-        small.innerText="Contributor: " + getNicknameAssossiatedWithGPG(blockObject.gpg);
-        articleContainerElement.appendChild(small);
-        articleContainerElement.appendChild(document.createElement("hr"));
+        var small = {
+            element:"p",
+            innerText:"Contributor: " + getNicknameAssossiatedWithGPG(blockObject.gpg)
+        };
+        makeElement(small, articleContainerElement);
+        var hr = { element:"hr" };
+        makeElement(hr, articleContainerElement);
         if(json.ipfs){
             getipfstext(json.ipfs,articleContainerElement.id);
         }
         if (document.querySelector("#news-sec-not-found")) document.querySelector("#news-sec-not-found").hidden=true;
-        newsSectionDivElement.appendChild(articleContainerElement);
-        newsSectionDivElement.appendChild(document.createElement("hr"));
+        makeElement(hr, newsSectionDivElement);
     }
 }
 // @license-end
diff --git a/src/js/arching-kaos-stellar-network.js b/src/js/arching-kaos-stellar-network.js
index bcc0f5f..b05770b 100644
--- a/src/js/arching-kaos-stellar-network.js
+++ b/src/js/arching-kaos-stellar-network.js
@@ -25,13 +25,14 @@ function getNumberOfTrustlinesAndRenderThem(json){
 function renderStellarAddress(stellarAddress){
     if (!document.querySelector('.stellar-network').querySelector('#'+stellarAddress)){
         var stats = document.querySelector('.stellar-network');
-        var d = document.createElement("details");
-        d.className = "stellar-address";
-        var s = document.createElement("summary");
-        s.innerText = stellarAddress;
-        d.id = stellarAddress;
-        d.appendChild(s);
-        stats.appendChild(d);
+        var d = {
+            element:"details",
+            className:"stellar-address",
+            innerHTML:[
+                {element:"summary", innerText:stellarAddress, id:stellarAddress}
+            ]
+        };
+        makeElement(d, stats);
     }
 }
 
diff --git a/src/js/arching-kaos-tools.js b/src/js/arching-kaos-tools.js
index 99da9a3..0e35c7f 100644
--- a/src/js/arching-kaos-tools.js
+++ b/src/js/arching-kaos-tools.js
@@ -17,17 +17,23 @@ function showResult(id){
     const found = document.querySelector(`#${id}`).cloneNode(true);
     const overlay = document.createElement('div');
     overlay.id = 'unique-overlay';
-    const title = document.createElement('h3');
-    title.innerText = "Result";
-    overlay.appendChild(title);
-    const closeButton = document.createElement('button');
-    closeButton.onclick = ()=>{
-        document.querySelector('#unique-overlay').remove();
+    const title = {
+        element:'h3',
+        innerText : "Result"
+    };
+    makeElement(title, overlay);
+    var closeButton = {
+        element:'button',
+        innerHTML: 'x',
+        id:"buttonCloseResult"
     };
-    closeButton.innerHTML = 'x';
-    overlay.appendChild(closeButton);
-    overlay.appendChild(found);
-    resultsArea.appendChild(overlay);
+    makeElement(closeButton, overlay);
+    makeElement(found, overlay);
+    makeElement(overlay, resultsArea);
+    closeButton = document.querySelector('#buttonCloseResult');
+    closeButton.addEventListener("click", ()=>{
+        document.querySelector('#unique-overlay').remove();
+    });
 }
 
 function renderStellarAddressPlaceholder(stellarAddress){
@@ -80,15 +86,19 @@ function renderZblockAndProceed(json, params){
     console.log(group);
     var zblockElement = document.querySelector('#zb-'+zblockIPFSHash);
     if(json.block){
-        var p = document.createElement("p");
-        p.innerText="Block: " +json.block;
-        p.id=zblockIPFSHash;
-        zblockElement.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Block: " +json.block,
+            id:zblockIPFSHash
+        };
+        makeElement(p, zblockElement);
     }
     if(json.block_signature){
-        var p = document.createElement("p");
-        p.innerText="Signature: " +json.block_signature;
-        zblockElement.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Signature: " +json.block_signature
+        };
+        makeElement(p, zblockElement);
     }
     progressPlaceholder.max++;
     progressPlaceholder.value++;
@@ -113,38 +123,49 @@ function blockRenderAndProceed(json, params){
     // var divs = document.querySelector('#zchain-data-section');
     var detailsPlace = document.querySelector('#zb-'+zblockIPFSHash);
     if(json.action){
-        var p = document.createElement("p");
-        p.innerText="Action: " +json.action;
-        if(detailsPlace!== null) detailsPlace.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Action: " +json.action
+        };
+        if(detailsPlace!== null) makeElement(p, detailsPlace);
     }
     if(json.detach){
-        var p = document.createElement("p");
-        p.innerText="Detach: " +json.detach;
-        if(detailsPlace!== null) detailsPlace.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Detach: " +json.detach
+        };
+        if(detailsPlace!== null) makeElement(p, detailsPlace);
     }
     if(json.gpg){
-        var p = document.createElement("p");
-        p.innerText="GPG: " +json.gpg;
-        if(detailsPlace!== null) detailsPlace.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"GPG: " +json.gpg
+        };
+        if(detailsPlace!== null) makeElement(p, detailsPlace);
     }
     if(json.data){
-        var p = document.createElement("p");
-        var a = document.createElement("a");
-        a.href = getIPFSURL(json.data);
-        a.innerText = json.data;
-        p.innerText="Data: ";
-        p.appendChild(a);
-        if(detailsPlace!== null) detailsPlace.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Data: ",
+            innerHTML:[
+                { element:"a", href: getIPFSURL(json.data), innerText: json.data }
+            ]
+        };
+        if(detailsPlace!== null) makeElement(p, detailsPlace);
     }
     if(json.timestamp){
-        var p = document.createElement("p");
-        p.innerText="Timestamp: " +json.timestamp + " [" + new Date(json.timestamp*1000) + "]";
-        if(detailsPlace!== null) detailsPlace.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Timestamp: " +json.timestamp + " [" + new Date(json.timestamp*1000) + "]"
+        };
+        if(detailsPlace!== null) makeElement(p, detailsPlace);
     }
     if(json.previous){
-        var p = document.createElement("p");
-        p.innerText="Previous: " +json.previous;
-        if(detailsPlace!== null) detailsPlace.appendChild(p);
+        var p = {
+            element:"p",
+            innerText:"Previous: " +json.previous
+        };
+        if(detailsPlace!== null) makeElement(p, detailsPlace);
     }
     progressPlaceholder.value++;
     exe(json.action,json.data,json,zblockIPFSHash,group,zblockObject,recursive);
@@ -192,17 +213,21 @@ function seekZchain(zchainIPNSLink,stellarAddress,json){
     var divs = document.querySelector('#zchain-data-section');
     var details = 0;
     if ( document.querySelector('#zd-' + zchainIPNSLink) === null ){
-        details = document.createElement("details");
-        details.id = 'zd-' + zchainIPNSLink;
-        details.className = 'zchain-details';
-        divs.appendChild(details);
+        details = {
+            element:"details",
+            id : 'zd-' + zchainIPNSLink,
+            className : 'zchain-details'
+        };
+        makeElement(details, divs);
     }
     details = document.querySelector('#zd-' + zchainIPNSLink);
 
     if(zchainIPNSLink){
-        var p = document.createElement("summary");
-        p.innerText="zchain: " + zchainIPNSLink;
-        details.appendChild(p);
+        var p = {
+            element:"summary",
+            innerText:"zchain: " + zchainIPNSLink
+        };
+        makeElement(p, details);
     }
     archingKaosLog("Seeking zchain " + zchainIPNSLink + "...");
     console.log(json)
@@ -224,7 +249,7 @@ function seekBlock(blockIPFSHash, zblockIPFSHash, group, zblockObject, recursive
     console.log(zblockObject);
     console.log(recursive);
     archingKaosLog("Seeking block "+blockIPFSHash+"...");
-    detailsPlace = document.querySelector('#zb-'+zblockIPFSHash);
+    // detailsPlace = document.querySelector('#zb-'+zblockIPFSHash);
     progressPlaceholder.max++;
     archingKaosFetchJSON(
         getIPFSURL(blockIPFSHash),
@@ -252,13 +277,15 @@ function renderGroupOnDataSection(group){
         divs.querySelector("#zchain-data-sec-not-found").remove();
     }
     if ( divs.querySelector('#zd-' + group) === null ){
-        details = document.createElement("details");
-        details.id = 'zd-' + group;
-        details.className = 'zchain-details';
-        var summary = document.createElement('summary');
-        summary.innerText = group;
-        details.appendChild(summary);
-        divs.appendChild(details);
+        var details = {
+            element:"details",
+            id : 'zd-' + group,
+            className : 'zchain-details',
+            innerHTML:[
+                { element:'summary', innerText: group }
+            ]
+        };
+        makeElement(details, divs);
     } else {
         //console.log('Else got hit in seekZchain');
         return 0;
@@ -267,14 +294,14 @@ function renderGroupOnDataSection(group){
 
 function renderZblockUnderGroup(zblock, group){
     const divs = document.querySelector('#zd-' + group);
-    var zblockElement = document.createElement("article");
-    zblockElement.id = 'zb-' + zblock;
-    if(zblock){
-        var p = document.createElement("p");
-        p.innerText="zblock: " + zblock;
-        zblockElement.appendChild(p);
-    }
-    divs.appendChild(zblockElement);
+    var zblockElement = {
+        element:"article",
+        id: "zb-"+zblock,
+        innerHTML:[
+            { element:"p", innerText:"zblock: "+zblock }
+        ]
+    };
+    makeElement(zblockElement, divs);
 }
 
 function seekZblock(zblockIPFSHash, params){
@@ -375,15 +402,16 @@ function getipfstext(ipfsHash, articleid){
             response.text().then(text=>{
                 var divs = document.querySelector('#'+articleid);
                 if(text){
-                    var pre = document.createElement("div");
-                    pre.className="news-text";
                     var lines = text.split('\n');
                     // remove one line, starting at the first position
                     // lines.splice(0,1);
-                    // join the array back into a single string
                     var newtext = lines.join('\n');
-                    pre.innerHTML = DOMPurify.sanitize(marked.parse(newtext));
-                    divs.appendChild(pre);
+                    var pre = {
+                        element:"div",
+                        className:"news-text",
+                        innerHTML:DOMPurify.sanitize(marked.parse(newtext))
+                    };
+                    makeElement(pre, divs);
                 }
             })
         }
@@ -394,10 +422,12 @@ function checkIfZchainAndProceed(json, params){
     const [group] = params;
     if (json.zlatest) {
         if (!aknet.querySelector('#ak-zchain-'+json.zchain)){
-            var a = document.createElement("pre");
-            a.innerText=json.zchain;
-            a.id='ak-zchain-'+json.zchain;
-            aknet.appendChild(a);
+            var pre = {
+                element:"pre",
+                innerText:json.zchain,
+                id:'ak-zchain-'+json.zchain
+            };
+            makeElement(pre, aknet);
         }
     }
     seekZblock(json.zlatest, [group, true]);