more of new ascription/triad stuff.. getting there..

public/global.css

@@ -50,6 +50,15 @@ button:disabled {
   color: #999;
 }
 
+.button {
+  color: #333;
+  background-color: #f4f4f4;
+  border: 1px solid lightgrey;
+  padding: 0.2em 0.4em;
+  grid-column: 2/3;
+  margin-right: 0.2rem;
+}
+
 button:not(:disabled):active {
   background-color: #ddd;
 }
@@ -177,3 +186,11 @@ select {
 #fmicon, #frontmatter, input.hasinput {
   background-color: #ffccbc;
 }
+
+#newtier {
+  display: none;
+}
+
+.news {
+  grid-column: 2/3;
+}

src/App.svelte

@@ -13,7 +13,6 @@
   let hases = [];
   let hasesCandidates = [];
   let frontmatter = {};
- let frontmatterLoaded = false;
   frontmatter["triad"] = [];
   frontmatter["ascriptions"] = [];
   frontmatter["notsand"] = [];
@@ -32,19 +31,61 @@
     return Array.from(diff);
   }
 
+  function newTier(fmKeyType, fmKey, fmValue = "") {
+    console.log("newTier", fmKeyType, fmKey);
+
+    if (fmKeyType == "ascriptions" && 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]
+        }
+      } else {
+        return
+      }
+    }
+
     frontmatter[fmKeyType][index] = {
       fmKey: newFmKey,
       tiers: [],
       candidates: METASP[newFmKey].tiers,
     };
+
     hasesCandidates = hasesCandidates.filter((h) => h != newFmKey);
     hasesCandidates = [...hasesCandidates, oldFmKey];
+    toggleNewTriadButton();
   }
 
   function loadHugoPageMetadata(editHash) {
-    var el = document.createElement("script");
+    let el = document.createElement("script");
     el.onload = () => {
       v = repo.content;
       if (v.startsWith("\n")) {
@@ -54,8 +95,8 @@
       relpath = repo.path;
       relpermalink = repo.relpermalink;
       protocol = document.location.protocol.substring(0, 4);
-      let notSelf = Object.entries(METASP).filter(n => n[1].singular == relpath.split("/")[0])[0][0]
-      hases = Object.keys(METASP).filter(k => k != notSelf);
+      const notSelf = Object.entries(METASP).filter((n) => n[1].singular == relpath.split("/")[0])[0][0];
+      hases = Object.keys(METASP).filter((k) => k != notSelf);
       Object.entries(repo.frontmatter).forEach(([fmKey, fmValue]) => {
         let fmKeyType = "";
         if (fmKey.toLowerCase().startsWith("has_")) {
@@ -73,20 +114,7 @@
 
         if (["triad", "ascriptions"].includes(fmKeyType)) {
           if (Array.isArray(fmValue)) {
-            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: candidates,
-            });
+            newTier(fmKeyType, fmKey, fmValue);
           }
         } else if (fmKeyType == "journal") {
           frontmatter["journal"] || (frontmatter["journal"] = []);
@@ -99,7 +127,18 @@
           }
         }
       });
-      hasesCandidates = diffArrr(hases, [
+      hasesCandidates = reckonHasesCandidates();
+      const tkey = Object.keys(repo.frontmatter).filter((t) => t.toLowerCase() == "title")[0];
+      title = repo.frontmatter[tkey];
+
+      toggleNewTriadButton();
+    };
+    el.src = `../js/repo/${editHash}.js`;
+    document.body.appendChild(el);
+  }
+
+  function reckonHasesCandidates() {
+    return diffArrr(hases, [
       ...frontmatter["triad"].map((t) => {
         return t.fmKey;
       }),
@@ -107,17 +146,9 @@
         return t.fmKey;
       }),
     ]);
-
-      let tkey = Object.keys(repo.frontmatter).filter((t) => t.toLowerCase() == "title")[0];
-      title = repo.frontmatter[tkey];
-      frontmatterLoaded = true;
-    };
-    el.src = `../js/repo/${editHash}.js`;
-    document.body.appendChild(el);
   }
-
   function addToCandidatesRemoveFromTiers(arrgs) {
-    let [fmKeyType, index, fmKey, tier] = arrgs.detail;
+    const [fmKeyType, index, fmKey, tier] = arrgs.detail;
     frontmatter[fmKeyType][index]["fmKey"] = fmKey;
     frontmatter[fmKeyType][index]["tiers"] = frontmatter[fmKeyType][index]["tiers"].filter(
       (t) => t !== tier
@@ -126,7 +157,7 @@
   }
 
   function addToTiersRemoveFromCandidates(arrgs) {
-    let [fmKeyType, index, , value] = arrgs.detail;
+    const [fmKeyType, index, , value] = arrgs.detail;
     const tier = frontmatter[fmKeyType][index]["candidates"].filter((t) => t.file == value);
     if (tier.length > 0) {
       frontmatter[fmKeyType][index]["tiers"] = [...frontmatter[fmKeyType][index]["tiers"], tier[0]];
@@ -156,26 +187,34 @@
   }
 
   function newFrontmatter() {
-   return Object.entries(frontmatter).filter(val => val[1].length == 0).map(key => key[0])
+    return Object.entries(frontmatter)
+      .filter((val) => val[1].length == 0)
+      .map((key) => key[0]);
   }
 
- function checkTriad() {
-   let ct = Object.entries(frontmatter).filter(i => i[1].length == 0 && i[0] == "triad")
-   return ct.length == 0 ? false : true
+  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";
+      }
+    }
   }
 
   function newTriad() {
-   newHasTiers({"detail": ["triad", 0, "authors", "editors"]})
+    newHasTiers({ detail: ["triad", 0, "_new", ""] });
   }
 
   function dispatchHash() {
-   var searchParams = new URLSearchParams(location.search);
-   let editHash = searchParams.get('edit')
+    const searchParams = new URLSearchParams(location.search);
+    const editHash = searchParams.get("edit");
     if (editHash) {
-     loadHugoPageMetadata(editHash)
+      loadHugoPageMetadata(editHash);
     } else {
-     let newPage = searchParams.get('new')
-     console.log(newPage)
+      let newPage = searchParams.get("new");
+      console.log(newPage);
     }
   }
 
@@ -206,6 +245,7 @@
               {hases}
               {hasesCandidates}
               on:hasTiersSelected={newHasTiers}
+
             />
             <SpTiers
               on:addToCandidatesRemoveFromTiers={addToCandidatesRemoveFromTiers}
@@ -224,9 +264,12 @@
           {/if}
         {/each}
       {/each}
-      {#if frontmatterLoaded && checkTriad()}
-        <div on:click="{newTriad}">NEW TRIAD TIER</div>
-      {/if}
+      <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")}>
+          NEW ASCRIPTION
+        </div>
+      </div>
     </span>
     <div class="formgrid">
       <label for="pagecontent">Content:</label>

src/SpTiers.svelte

@@ -46,7 +46,7 @@
             on:click={swapTier(tier, -1)}
                   disabled={i == 0 ? true : false}>⇑</button
                                                     >
-          <button type="button" on:click={removeTier(tier)}>×</button>
+          <button type="button" on:click={()=> removeTier(tier)}>×</button>
         </div>
       </div>
     {/each}