more of new tiers buttons..

public/global.css

@@ -187,7 +187,7 @@ select {
   background-color: #ffccbc;
 }
 
-#newtier {
+.newtiers {
   display: none;
 }
 

src/App.svelte

@@ -23,6 +23,17 @@
     }
   }
 
+  function reckonHasesCandidates() {
+    return diffArrr(hases, [
+      ...frontmatter["triad"].map((t) => {
+        return t.fmKey;
+      }),
+      ...frontmatter["ascriptions"].map((t) => {
+        return t.fmKey;
+      }),
+    ]);
+  }
+
   function diffArrr(arr, arrr) {
     let diff = new Set(arr);
     for (let e of arrr) {
@@ -31,57 +42,38 @@
     return Array.from(diff);
   }
 
-  function newTier(fmKeyType, fmKey, fmValue = "") {
-    console.log("newTier", fmKeyType, fmKey);
-
-    if (fmKeyType == "ascriptions" && fmKey == "_new") {
+  function newTier(fmKeyType, fmKey, fmValue) {
+    let tiers = [];
+    let candidates = [];
+    if (fmKey == "_new") {
       hasesCandidates = [... new Set(reckonHasesCandidates())]
       if (hasesCandidates.length > 0) {
         fmKey = hasesCandidates[0]
-        console.log(hasesCandidates, fmKey)
       }
     }
-    let tiers = [];
-    let candidates = [];
-    METASP[fmKey].tiers.forEach((t) => {
-      if (fmValue.includes(t.file)) {
-        tiers.push(t);
-      } else {
-        candidates.push(t);
-      }
-    });
-    frontmatter[fmKeyType].push({
-      fmKey: fmKey,
-      tiers: tiers,
-      candidates: [...new Set(candidates)],
-    });
-    frontmatter = { ...frontmatter };
-  }
 
-  function newHasTiers(arrgs) {
-    let [fmKeyType, index, oldFmKey, newFmKey] = arrgs.detail;
-    hasesCandidates = [... new Set(reckonHasesCandidates())]
-    console.log(hasesCandidates)
-    if (fmKeyType=="triad" && oldFmKey == "_new") {
-      if (hasesCandidates.length > 0) {
-        newFmKey = hasesCandidates[0];
-        if (hasesCandidates.length > 1) {
-          oldFmKey = hasesCandidates[1]
+    if (fmKey != "_new") {
+      if (fmValue) {
+      METASP[fmKey].tiers.forEach((t) => {
+        if (fmValue.includes(t.file)) {
+          tiers.push(t);
+        } else {
+          candidates.push(t);
         }
+      })
       } else {
-        return
+        tiers = [];
+        candidates = METASP[fmKey].tiers;
       }
+      frontmatter[fmKeyType].push({
+        fmKey: fmKey,
+        tiers: tiers,
+        candidates: [...new Set(candidates)],
+      });
+      frontmatter = { ...frontmatter };
     }
-
-    frontmatter[fmKeyType][index] = {
-      fmKey: newFmKey,
-      tiers: [],
-      candidates: METASP[newFmKey].tiers,
-    };
-
-    hasesCandidates = hasesCandidates.filter((h) => h != newFmKey);
-    hasesCandidates = [...hasesCandidates, oldFmKey];
-    toggleNewTriadButton();
+    hasesCandidates = [... new Set(reckonHasesCandidates())]
+    toggleNewTiersButtons()
   }
 
   function loadHugoPageMetadata(editHash) {
@@ -131,22 +123,12 @@
       const tkey = Object.keys(repo.frontmatter).filter((t) => t.toLowerCase() == "title")[0];
       title = repo.frontmatter[tkey];
 
-      toggleNewTriadButton();
+      toggleNewTiersButtons();
     };
     el.src = `../js/repo/${editHash}.js`;
     document.body.appendChild(el);
   }
 
-  function reckonHasesCandidates() {
-    return diffArrr(hases, [
-      ...frontmatter["triad"].map((t) => {
-        return t.fmKey;
-      }),
-      ...frontmatter["ascriptions"].map((t) => {
-        return t.fmKey;
-      }),
-    ]);
-  }
   function addToCandidatesRemoveFromTiers(arrgs) {
     const [fmKeyType, index, fmKey, tier] = arrgs.detail;
     frontmatter[fmKeyType][index]["fmKey"] = fmKey;
@@ -186,26 +168,24 @@
     }
   }
 
-  function newFrontmatter() {
-    return Object.entries(frontmatter)
-      .filter((val) => val[1].length == 0)
-      .map((key) => key[0]);
-  }
+ function toggleNewTiersButtons() {
+   hasesCandidates = [... new Set(reckonHasesCandidates())]
 
-  function toggleNewTriadButton() {
-    const ct = Object.entries(frontmatter).filter((i) => i[1].length == 0 && i[0] == "triad");
-    if (document.getElementById("newtier")) {
-      if (ct.length == 0) {
-        document.getElementById("newtier").style.display = "none";
-      } else {
-        document.getElementById("newtier").style.display = "block";
-      }
-    }
-  }
+   if (hasesCandidates.length == 0) {
+     document.querySelectorAll(".newtiers").forEach((button)=> {
+       button.style.display = "none";
+     })
+   } else {
+     document.querySelectorAll(".newtiers").forEach((button)=> {
+       button.style.display = "block";
+     })
+   }
 
-  function newTriad() {
-    newHasTiers({ detail: ["triad", 0, "_new", ""] });
-  }
+   const ct = Object.entries(frontmatter).filter((i) => i[1].length == 0 && i[0] == "triad")[0];
+   if (!ct) {
+     document.getElementById("newtriad").style.display = "none";
+   }
+ }
 
   function dispatchHash() {
     const searchParams = new URLSearchParams(location.search);
@@ -214,17 +194,17 @@
       loadHugoPageMetadata(editHash);
     } else {
       let newPage = searchParams.get("new");
-      console.log(newPage);
+      console.log({newPage});
     }
   }
 
   onMount(() => {
     dispatchHash();
     // loadHugoPageMetadata();
-    console.dir(frontmatter);
+    console.dir({frontmatter});
   });
 
-  $: hashChanged = () => dispatchHash();
+ $: hashChanged = () => dispatchHash();
 </script>
 
 <svelte:window on:keyup={keyUp} on:hashchange={hashChanged} />
@@ -244,7 +224,7 @@
               {fmItem}
               {hases}
               {hasesCandidates}
-              on:hasTiersSelected={newHasTiers}
+              on:hasTiersSelected={newTier}
 
             />
             <SpTiers
@@ -265,8 +245,8 @@
         {/each}
       {/each}
       <div class="buttons news">
-        <div id="newtier" class="button" on:click={newTriad}>NEW TIER</div>
-        <div id="newascription" class="button" on:click={() => newTier("ascriptions", "_new")}>
+        <div id="newtriad" class="newtiers button" on:click={()=> newTier("triad", "_new", null)}>NEW TIER</div>
+        <div id="newascription" class="newtiers button" on:click={() => newTier("ascriptions", "_new", null)}>
           NEW ASCRIPTION
         </div>
       </div>