From 66da0779fce8f607a500cd25e0c4d55d745acdc8 Mon Sep 17 00:00:00 2001
From: SuperCoolYun <yunraccoon@gmail.com>
Date: Fri, 20 Sep 2024 10:30:37 -0400
Subject: [PATCH 1/6] bug on wrong renderer redirect to landscape fixed,
 redirect to tree instead

---
 pkg/arvo/app/neo.hoon                  |   2 +
 pkg/arvo/neo/cod/std/src/fil/wi-nd.js  | 765 +++++++++++++------------
 pkg/arvo/neo/cod/std/src/imp/mast.hoon |  22 +
 3 files changed, 437 insertions(+), 352 deletions(-)

diff --git a/pkg/arvo/app/neo.hoon b/pkg/arvo/app/neo.hoon
index 8cf3866d74..e4abcce6d7 100644
--- a/pkg/arvo/app/neo.hoon
+++ b/pkg/arvo/app/neo.hoon
@@ -1570,6 +1570,8 @@
     (emit (do-card #/[p/our.bowl]/srv/hawk %make %hawk-eyre ~ ~))
   =.  run
     (emit (do-card #/[p/our.bowl]/blue %make %blue ~ ~))
+  =.  run
+    (emit (do-card #/[p/our.bowl]/cod/std/src/imp %make %sig ~ ~))
   =.  run
     (emit (do-card #/[p/our.bowl]/mast %make %mast ~ ~))
   =.  run
diff --git a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
index 42cf284aef..0ee2a94723 100644
--- a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
+++ b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
@@ -1,25 +1,26 @@
-customElements.define('wi-nd',
-class extends HTMLElement {
-  static get observedAttributes() {
-    //
-    return [
-      "wid",
-      "here",
-      "searching",  // boolean. true is user is using the search bar in the header
-      "strategies", // space-separated list of iframe prefixes
-      "renderer",    // current iframe strategy
-      "menu",
-      "dragging",
-      "tab-title",
-      "favicon",
-    ];
-  }
-  constructor() {
-    //
-    super();
-    const shadow = this.attachShadow({ mode: 'open' });
-    shadow.adoptedStyleSheets = [sharedStyles];
-    this.shadowRoot.innerHTML = `
+customElements.define(
+  'wi-nd',
+  class extends HTMLElement {
+    static get observedAttributes() {
+      //
+      return [
+        'wid',
+        'here',
+        'searching', // boolean. true is user is using the search bar in the header
+        'strategies', // space-separated list of iframe prefixes
+        'renderer', // current iframe strategy
+        'menu',
+        'dragging',
+        'tab-title',
+        'favicon'
+      ]
+    }
+    constructor() {
+      //
+      super()
+      const shadow = this.attachShadow({ mode: 'open' })
+      shadow.adoptedStyleSheets = [sharedStyles]
+      this.shadowRoot.innerHTML = `
       <style>
        @import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
        .mso,
@@ -117,293 +118,352 @@ class extends HTMLElement {
       <div id="tabs" class="fc grow">
       </div>
     `
-    this.intervalId = null;
-  }
-  connectedCallback() {
-    $(this.gid('searchbar')).off();
-    $(this.gid('searchbar')).on('submit', (e) => {
-      e.preventDefault();
-      this.setAttribute('here', $(this.gid('input-here')).val());
-      this.setAttribute('renderer', this.strategies[0]);
-      this.rebuildIframe();
-    });
-    $(this.gid('input-here')).off();
-    $(this.gid('input-here')).on('focusout', (e) => {
-      $(this).removeAttr('searching');
-    });
-    $(this.gid('input-here')).on('blur', (e) => {
-      $(this).removeAttr('searching');
-    });
-    $(this.gid('menu-toggle')).off();
-    $(this.gid('menu-toggle')).on('click', (e) => {
-      this.toggleAttribute('menu');
-    });
+      this.intervalId = null
+    }
+    connectedCallback() {
+      $(this.gid('searchbar')).off()
+      $(this.gid('searchbar')).on('submit', (e) => {
+        e.preventDefault()
+        this.setAttribute('here', $(this.gid('input-here')).val())
+        this.setAttribute('renderer', this.strategies[0])
+        this.rebuildIframe()
+      })
+      $(this.gid('input-here')).off()
+      $(this.gid('input-here')).on('focusout', (e) => {
+        $(this).removeAttr('searching')
+      })
+      $(this.gid('input-here')).on('blur', (e) => {
+        $(this).removeAttr('searching')
+      })
+      $(this.gid('menu-toggle')).off()
+      $(this.gid('menu-toggle')).on('click', (e) => {
+        this.toggleAttribute('menu')
+      })
 
-    $(this.gid('dragger')).off();
-    $(this.gid('dragger')).on('dragstart', (e) => {
-      e.originalEvent.dataTransfer.setData('text/plain', this.getAttribute('wid'));
-    })
-    $(this.gid('dragger')).on('dragenter', (e) => {
-      $(this).emit('drag-start');
-    })
-    $(this.gid('dragger')).on('dragend', (e) => {
-      $(this).emit('drag-end');
-    })
+      $(this.gid('dragger')).off()
+      $(this.gid('dragger')).on('dragstart', (e) => {
+        e.originalEvent.dataTransfer.setData(
+          'text/plain',
+          this.getAttribute('wid')
+        )
+      })
+      $(this.gid('dragger')).on('dragenter', (e) => {
+        $(this).emit('drag-start')
+      })
+      $(this.gid('dragger')).on('dragend', (e) => {
+        $(this).emit('drag-end')
+      })
 
-    $(this).off();
-    $(this).on('close', () => {
-      $(this).emit('close-window');
-    })
-    $(this).on('minimize', () => {
-      $(this).emit('minimize-window');
-    })
-    $(this).on('dragenter', (e) => {
-      $(this).addClass('dragging');
-    })
-    $(this).on('dragover', (e) => {
-      e.preventDefault();
-    })
-    $(this).on('dragleave', (e) => {
-      $(this).removeClass('dragging');
-    })
-    $(this).on('drop', (e) => {
-      e.preventDefault();
-      $(this).emit('drag-end');
-      let wid = e.originalEvent.dataTransfer.getData('text/plain');
-      let wind = $(`[wid='${wid}']`);
-      let newSlot = parseInt(this.getAttribute('slot').slice(1));
-      let oldSlot = parseInt(wind.attr('slot')?.slice(1));
-      if (!isNaN(oldSlot) && oldSlot < newSlot) {
-        newSlot = newSlot + 0.5;
-      } else {
-        newSlot = newSlot - 0.5;
-      }
-      wind.attr('slot', `s${newSlot}`);
-      $(this).emit('fix-slots');
-    })
-    this.setAttribute('wid', `${Date.now()}`);
-    this.buildMenu()
+      $(this).off()
+      $(this).on('close', () => {
+        $(this).emit('close-window')
+      })
+      $(this).on('minimize', () => {
+        $(this).emit('minimize-window')
+      })
+      $(this).on('dragenter', (e) => {
+        $(this).addClass('dragging')
+      })
+      $(this).on('dragover', (e) => {
+        e.preventDefault()
+      })
+      $(this).on('dragleave', (e) => {
+        $(this).removeClass('dragging')
+      })
+      $(this).on('drop', (e) => {
+        e.preventDefault()
+        $(this).emit('drag-end')
+        let wid = e.originalEvent.dataTransfer.getData('text/plain')
+        let wind = $(`[wid='${wid}']`)
+        let newSlot = parseInt(this.getAttribute('slot').slice(1))
+        let oldSlot = parseInt(wind.attr('slot')?.slice(1))
+        if (!isNaN(oldSlot) && oldSlot < newSlot) {
+          newSlot = newSlot + 0.5
+        } else {
+          newSlot = newSlot - 0.5
+        }
+        wind.attr('slot', `s${newSlot}`)
+        $(this).emit('fix-slots')
+      })
+      this.setAttribute('wid', `${Date.now()}`)
+      this.buildMenu()
 
-    // poll iframes for changes every 350ms
-    this.intervalId = setInterval(() => {
-      let here = this.getAttribute('here');
-      let favicon = this.getAttribute('favicon');
-      let tabTitle = this.getAttribute('tab-title');
-      $(this.gid('tabs')).children().each(function() {
-        this.contentWindow.postMessage({
-          messagetype: "sky-poll",
-          here,
-          favicon,
-          tabTitle,
-        });
-      });
-    }, 350);
+      // poll iframes for changes every 350ms
+      this.intervalId = setInterval(() => {
+        let here = this.getAttribute('here')
+        let favicon = this.getAttribute('favicon')
+        let tabTitle = this.getAttribute('tab-title')
+        $(this.gid('tabs'))
+          .children()
+          .each(function () {
+            this.contentWindow.postMessage({
+              messagetype: 'sky-poll',
+              here,
+              favicon,
+              tabTitle
+            })
+          })
+      }, 350)
 
-    $(this).on('title-changed', (e) => {
-      if (!!e.detail) {
-        $(this).attr('tab-title', e.detail);
-      } else {
-        $(this).attr('tab-title', null);
+      $(this).on('title-changed', (e) => {
+        if (!!e.detail) {
+          $(this).attr('tab-title', e.detail)
+        } else {
+          $(this).attr('tab-title', null)
+        }
+        $(this).emit('here-moved')
+      })
+      $(this).on('favicon-changed', (e) => {
+        if (!!e.detail) {
+          $(this).attr('favicon', e.detail)
+        } else {
+          $(this).attr('favicon', null)
+        }
+        $(this).emit('here-moved')
+      })
+      $(this).on('iframe-moved', (e) => {
+        $(this).attr('renderer', e.detail.prefix)
+        $(this).attr('here', e.detail.here)
+      })
+      $(this).on('set-feather-values', (e) => {
+        $(this.gid('tabs'))
+          .children()
+          .each(function () {
+            this.contentWindow.postMessage({
+              messagetype: 'feather-change',
+              rules: e.detail
+            })
+          })
+      })
+      $(this).on('reset-feather-values', (e) => {
+        $(this.gid('tabs'))
+          .children()
+          .each(function () {
+            this.contentWindow.postMessage({
+              messagetype: 'feather-reset'
+            })
+          })
+      })
+      $(this).on('bookmark-renderer', (e) => {
+        this.setAttribute(
+          'strategies',
+          (this.getAttribute('strategies') || '') + ' ' + e.detail
+        )
+        $(this).emit('strategy-change', this.strategyPoke)
+      })
+      $(this).on('unbookmark-renderer', (e) => {
+        let newstrats = this.strategies
+          .slice(0, -1)
+          .filter((s) => s != e.detail)
+        this.setAttribute('strategies', newstrats)
+        $(this).emit('strategy-change', this.strategyPoke)
+      })
+    }
+    disconnectedCallback() {
+      if (this.intervalId !== null) {
+        clearInterval(this.intervalId)
+        this.intervalId = null
       }
-      $(this).emit('here-moved');
-    });
-    $(this).on('favicon-changed', (e) => {
-      if (!!e.detail) {
-        $(this).attr('favicon', e.detail);
-      } else {
-        $(this).attr('favicon', null);
+    }
+    attributeChangedCallback(name, oldValue, newValue) {
+      //
+      if (name === 'here') {
+        this.setAttribute(
+          'strategies',
+          (this.defaultStrategies[newValue] || []).join(' ')
+        )
+        this.buildBreadcrumbs()
+        this.buildMenu()
+        $(this.gid('input-here')).val(newValue)
+        $(this).emit('here-moved')
+      } else if (name === 'searching') {
+        if (newValue === null) {
+          $(this.gid('breadcrumbs')).removeClass('hidden')
+          $(this.gid('searchbar')).addClass('hidden')
+        } else {
+          $(this.gid('breadcrumbs')).addClass('hidden')
+          $(this.gid('searchbar')).removeClass('hidden')
+          this.gid('input-here').focus()
+          this.gid('input-here').setSelectionRange(999, 999)
+        }
+      } else if (name === 'renderer') {
+        $(this.gid('menu-toggle')).text(this.prettyCurrent)
+        if (oldValue !== newValue) {
+          this.rebuildIframe()
+        }
+        this.buildMenu()
+      } else if (name === 'menu') {
+        if (newValue === null) {
+          $(this.gid('menu')).addClass('hidden')
+          $(this.gid('menu-toggle')).removeClass('o7')
+        } else {
+          $(this.gid('menu')).removeClass('hidden')
+          $(this.gid('menu-toggle')).addClass('o7')
+        }
+      } else if (name === 'strategies') {
+        this.buildMenu()
+      } else if (name === 'dragging') {
+        if (newValue === null) {
+          $(this).removeClass('dragging')
+          $(this.gid('drag-overlay')).addClass('hidden')
+        } else {
+          $(this.gid('drag-overlay')).removeClass('hidden')
+        }
       }
-      $(this).emit('here-moved');
-    });
-    $(this).on('iframe-moved', (e) => {
-      $(this).attr('renderer', e.detail.prefix);
-      $(this).attr('here', e.detail.here);
-    });
-    $(this).on('set-feather-values', (e) => {
-      $(this.gid('tabs')).children().each(function() {
-        this.contentWindow.postMessage({
-          messagetype: "feather-change",
-          rules: e.detail
-        });
-      });
-    });
-    $(this).on('reset-feather-values', (e) => {
-      $(this.gid('tabs')).children().each(function() {
-        this.contentWindow.postMessage({
-          messagetype: "feather-reset",
-        });
-      });
-    });
-    $(this).on('bookmark-renderer', (e) => {
-      this.setAttribute('strategies', (this.getAttribute('strategies') || '') + ' ' + e.detail);
-      $(this).emit('strategy-change', this.strategyPoke);
-    });
-    $(this).on('unbookmark-renderer', (e) => {
-      let newstrats = this.strategies.slice(0, -1).filter(s => s != e.detail);
-      this.setAttribute('strategies', newstrats);
-      $(this).emit('strategy-change', this.strategyPoke);
-    });
-  }
-  disconnectedCallback() {
-    if (this.intervalId !== null) {
-      clearInterval(this.intervalId);
-      this.intervalId = null;
     }
-  }
-  attributeChangedCallback(name, oldValue, newValue) {
-    //
-    if (name === "here") {
-      this.setAttribute('strategies', (this.defaultStrategies[newValue] || []).join(' '))
-      this.buildBreadcrumbs();
-      this.buildMenu()
-      $(this.gid('input-here')).val(newValue);
-      $(this).emit('here-moved');
+    qs(sel) {
+      return this.shadowRoot.querySelector(sel)
     }
-    else if (name === "searching") {
-      if (newValue === null) {
-        $(this.gid('breadcrumbs')).removeClass('hidden');
-        $(this.gid('searchbar')).addClass('hidden');
-      } else {
-        $(this.gid('breadcrumbs')).addClass('hidden');
-        $(this.gid('searchbar')).removeClass('hidden');
-        this.gid('input-here').focus();
-        this.gid('input-here').setSelectionRange(999,999);
-      }
+    gid(id) {
+      return this.shadowRoot.getElementById(id)
     }
-    else if (name === "renderer") {
-      $(this.gid('menu-toggle')).text(this.prettyCurrent)
-      if (oldValue !== newValue) {
-        this.rebuildIframe();
-      }
-      this.buildMenu()
+    get here() {
+      return this.getAttribute('here') || '/'
     }
-    else if (name === "menu") {
-      if (newValue === null) {
-        $(this.gid('menu')).addClass('hidden');
-        $(this.gid('menu-toggle')).removeClass('o7');
-      } else {
-        $(this.gid('menu')).removeClass('hidden');
-        $(this.gid('menu-toggle')).addClass('o7');
-      }
+    get path() {
+      return this.here
+        .slice(1)
+        .split('/')
+        .filter((s) => !!s.trim().length)
     }
-    else if (name === "strategies") {
-      this.buildMenu()
+    get defaultStrategies() {
+      let strats = document
+        .querySelector('s-k-y')
+        ?.getAttribute('default-strategies')
+      return JSON.parse(strats || '{}')
     }
-    else if (name === "dragging") {
-      if (newValue === null) {
-        $(this).removeClass('dragging');
-        $(this.gid('drag-overlay')).addClass('hidden');
-      } else {
-        $(this.gid('drag-overlay')).removeClass('hidden');
+    get strategies() {
+      const userStrategies = (this.getAttribute('strategies') || '')
+        .split(' ')
+        .map((m) => m.trim())
+        .filter((f) => !!f)
+
+      const uniqueStrategies = new Set([
+        ...userStrategies,
+        '/hawk',
+        '/tree',
+        '/self'
+      ])
+
+      return [...uniqueStrategies]
+    }
+    get strategyPoke() {
+      let poke = {
+        here: this.here,
+        strategies: this.strategies.slice(0, -1)
       }
+      return JSON.stringify(poke)
     }
-  }
-  qs(sel) {
-    return this.shadowRoot.querySelector(sel);
-  }
-  gid(id) {
-    return this.shadowRoot.getElementById(id);
-  }
-  get here() {
-    return this.getAttribute("here") || "/";
-  }
-  get path() {
-    return this.here.slice(1).split("/").filter(s => !!s.trim().length);
-  }
-  get defaultStrategies() {
-    let strats = document.querySelector('s-k-y')?.getAttribute('default-strategies');
-    return JSON.parse(strats || '{}');
-  }
-  get strategies() {
-    const userStrategies = (this.getAttribute('strategies') || '')
-      .split(' ')
-      .map(m => m.trim())
-      .filter(f => !!f);
-  
-    const uniqueStrategies = new Set([...userStrategies, '/hawk', '/tree', '/self']);
-  
-    return [...uniqueStrategies];
-  }
-  get strategyPoke() {
-    let poke = {
-      here: this.here,
-      strategies: this.strategies.slice(0, -1)
+    get renderer() {
+      let c = this.getAttribute('renderer')
+      return c || this.strategies[0]
     }
-    return JSON.stringify(poke);
-  }
-  get renderer() {
-    let c = this.getAttribute('renderer');
-    return (c || this.strategies[0]);
-  }
-  get rendererLabels() {
-    //
-    //  this is assuming a naming structure that should
-    //  not need to be assumed. fix this thix this fix this
-    //  ... eventually
-    //
-    return {
-      "/hawk": () => "hawk",
-      "/tree": () => "tree",
-      "/self": () => "self",
+    get rendererLabels() {
       //
-      "/mast": (x) => {
-        let words = x.split("/").map(s => s.trim()).filter(s => !!s);
-        if (words.length != 2) {
-          words = ["mast", "mast-error"];
-        }
-        return words[1].split('-').slice(1).join(' ');
-      },
+      //  this is assuming a naming structure that should
+      //  not need to be assumed. fix this thix this fix this
+      //  ... eventually
       //
-      "/blue": (x) => {
-        let words = x.split("/").map(s => s.trim()).filter(s => !!s);
-        if (words.length != 2) {
-          words = ["b", "b-error"];
+      return {
+        '/hawk': () => 'hawk',
+        '/tree': () => 'tree',
+        '/self': () => 'self',
+        //
+        '/mast': (x) => {
+          let words = x
+            .split('/')
+            .map((s) => s.trim())
+            .filter((s) => !!s)
+          if (words.length != 2) {
+            words = ['mast', 'mast-error']
+          }
+          return words[1].split('-').slice(1).join(' ')
+        },
+        //
+        '/blue': (x) => {
+          let words = x
+            .split('/')
+            .map((s) => s.trim())
+            .filter((s) => !!s)
+          if (words.length != 2) {
+            words = ['b', 'b-error']
+          }
+          return words[1].split('-').slice(1).join(' ')
         }
-        return words[1].split('-').slice(1).join(' ');
-      },
+      }
     }
-  }
-  labelLookup(renderer) {
-    let entries = Object.entries(this.rendererLabels);
-    let entry = entries.filter(([k, v]) => renderer.startsWith(k))[0];
-    if (!entry) return;
-    return entry[1](renderer);
-  }
-  get prettyCurrent() {
-    let r = this.renderer;
-    let m = this.labelLookup(r)
-    if (m) {
-      return m;
+    labelLookup(renderer) {
+      let entries = Object.entries(this.rendererLabels)
+      let entry = entries.filter(([k, v]) => renderer.startsWith(k))[0]
+      if (!entry) return
+      return entry[1](renderer)
     }
-    return r
-  }
-  createIframe(prefix, here, open) {
-    let el = document.createElement('iframe');
-    el.setAttribute('prefix', prefix);
-    el.setAttribute('lazy', '');
-    el.setAttribute('src', prefix+here);
-    el.setAttribute('style', 'width: 100%; flex-grow: 1; border: none; background: var(--b0);');
-    if (!open) {
-      el.hidden = true;
+    get prettyCurrent() {
+      let r = this.renderer
+      let m = this.labelLookup(r)
+      if (m) {
+        return m
+      }
+      return r
     }
-    el.addEventListener('load', () => {
-      this.registerServiceWorker(el, prefix);
-    });
-    return el;
-  }
-  rebuildIframe() {
-    $(this.gid('tabs')).children().remove();
-    let frame = this.createIframe(this.renderer, this.here, true);
-    $(this.gid('tabs')).append(frame);
-  }
-  registerServiceWorker(iframe, prefix) {
-    //  for convenience, this part is inject by wi-nd.
-    //  in future, due to the need to sandbox the iframes,
-    //  this must be provided by the iframe's contents.
-    const iframeDoc = iframe.contentWindow.document;
-    let wid = this.getAttribute('wid');
-    const inlineScript = iframeDoc.createElement('script');
-    inlineScript.textContent = `
+    async checkUrl(url) {
+      try {
+        let response = await fetch(url, { method: 'GET' })
+        if (response.ok) {
+          if (response.redirected) {
+            return false
+          } else {
+            return true
+          }
+        } else {
+          return false
+        }
+      } catch (error) {
+        console.error('Fetch error:', error)
+        return false
+      }
+    }
+    createIframe(prefix, here, open) {
+      let el = document.createElement('iframe')
+      el.setAttribute('prefix', prefix)
+      el.setAttribute('lazy', '')
+      el.setAttribute('src', prefix + here)
+      el.setAttribute(
+        'style',
+        'width: 100%; flex-grow: 1; border: none; background: var(--b0);'
+      )
+      if (!open) {
+        el.hidden = true
+      }
+      el.addEventListener('load', () => {
+        this.registerServiceWorker(el, prefix)
+      })
+      return el
+    }
+    async rebuildIframe() {
+      $(this.gid('tabs')).children().remove()
+      let isLoading = await this.checkUrl(
+        window.location.origin + this.renderer + this.here
+      )
+      if (isLoading) {
+        console.log('url works')
+        let frame = this.createIframe(this.renderer, this.here, true)
+        $(this.gid('tabs')).append(frame)
+      } else {
+        console.log('redirect to tree')
+        let frame = this.createIframe(`/tree`, this.here, true)
+        $(this.gid('menu-toggle')).text(`tree`)
+        $(this.gid('tabs')).append(frame)
+      }
+    }
+    registerServiceWorker(iframe, prefix) {
+      //  for convenience, this part is inject by wi-nd.
+      //  in future, due to the need to sandbox the iframes,
+      //  this must be provided by the iframe's contents.
+      const iframeDoc = iframe.contentWindow.document
+      let wid = this.getAttribute('wid')
+      const inlineScript = iframeDoc.createElement('script')
+      inlineScript.textContent = `
       window.parent.postMessage(
         {
           messagetype: 'iframe-wants-feather',
@@ -463,43 +523,43 @@ class extends HTMLElement {
           document.documentElement.style = '';
         }
       });
-    `;
-    iframeDoc.body.appendChild(inlineScript);
-  }
-  buildBreadcrumbs() {
-    let breadcrumbs = $(this.gid('breadcrumbs'));
-    breadcrumbs.children().remove();
-    //
-    this.path.forEach((p, i) => {
-      let chevron = $(document.createElement('span'));
-      chevron.addClass('s-2 f4 o6 fc ac jc no-select');
-      if (i > 0) {
-        chevron.text('›');
-      }
-      breadcrumbs.append(chevron);
+    `
+      iframeDoc.body.appendChild(inlineScript)
+    }
+    buildBreadcrumbs() {
+      let breadcrumbs = $(this.gid('breadcrumbs'))
+      breadcrumbs.children().remove()
       //
-      let crumb = $(document.createElement('button'));
-      crumb.addClass((i === 0 ? 'p-1' : 'p1') + ' b2 hover br1 s-1 f2');
-      crumb.text((i === 0 && this.path[0].startsWith('~')) ? "/" : this.path[i]);
-      crumb.on('click', () => {
-        $(this).attr('here', "/"+this.path.slice(0, i+1).join("/"));
-        $(this).attr('renderer', this.strategies[0]);
-        this.rebuildIframe();
-      });
-      breadcrumbs.append(crumb);
-    })
-    let spacer = $(document.createElement('button'));
-    spacer.addClass('grow b2 br1 hover')
-    spacer.on('click', () => {
-      $(this).attr('searching', '');
-    });
-    breadcrumbs.append(spacer);
-  }
-  buildMenu() {
-    let menu = this.gid('menu');
-    $(menu).children().remove();
-    //
-    /*let top = $(`
+      this.path.forEach((p, i) => {
+        let chevron = $(document.createElement('span'))
+        chevron.addClass('s-2 f4 o6 fc ac jc no-select')
+        if (i > 0) {
+          chevron.text('›')
+        }
+        breadcrumbs.append(chevron)
+        //
+        let crumb = $(document.createElement('button'))
+        crumb.addClass((i === 0 ? 'p-1' : 'p1') + ' b2 hover br1 s-1 f2')
+        crumb.text(i === 0 && this.path[0].startsWith('~') ? '/' : this.path[i])
+        crumb.on('click', () => {
+          $(this).attr('here', '/' + this.path.slice(0, i + 1).join('/'))
+          $(this).attr('renderer', this.strategies[0])
+          this.rebuildIframe()
+        })
+        breadcrumbs.append(crumb)
+      })
+      let spacer = $(document.createElement('button'))
+      spacer.addClass('grow b2 br1 hover')
+      spacer.on('click', () => {
+        $(this).attr('searching', '')
+      })
+      breadcrumbs.append(spacer)
+    }
+    buildMenu() {
+      let menu = this.gid('menu')
+      $(menu).children().remove()
+      //
+      /*let top = $(`
       <div class="fc g1">
         <span class="s-2 f3">renderer</span>
         <div class="fr g3 ac js">
@@ -528,7 +588,7 @@ class extends HTMLElement {
         </div>
       </div>
     `);*/
-    let top = $(`
+      let top = $(`
       <div class="fc g1">
         <div class="fr g3 ac js">
           <div class="grow"></div>
@@ -542,8 +602,8 @@ class extends HTMLElement {
           </a>
         </div>
       </div>
-    `);
-    /*$(top).find('h4').text(this.renderer);
+    `)
+      /*$(top).find('h4').text(this.renderer);
     if (this.strategies.includes(this.renderer)) {
       $(top).find('#bm-save-btn').addClass('hidden')
     }
@@ -556,39 +616,40 @@ class extends HTMLElement {
     $(top).find('#bm-del-btn').on('click', (e) => {
       $(this).emit('unbookmark-renderer', this.renderer)
     });*/
-    //menu.appendChild(top.get(0));
-    //
-    let bookmarks = $(`
+      //menu.appendChild(top.get(0));
+      //
+      let bookmarks = $(`
       <div class="fc g1">
         <span class="s-2 f3">renderers</span>
         <div class="frw g2 ac js">
         </div>
       </div>
-    `);
-    //
-    this.strategies.forEach(s => {
-      let bookmark = $(`<button class="b1 br1 bd1 p-1 wfc"></button>`);
-      bookmark.text(this.labelLookup(s) || s);
-      $(bookmark).on('click', (e) => {
-        $(this).attr('renderer', s)
+    `)
+      //
+      this.strategies.forEach((s) => {
+        let bookmark = $(`<button class="b1 br1 bd1 p-1 wfc"></button>`)
+        bookmark.text(this.labelLookup(s) || s)
+        $(bookmark).on('click', (e) => {
+          $(this).attr('renderer', s)
+        })
+        if (s === this.renderer) {
+          $(bookmark).addClass('toggled')
+        }
+        bookmarks.find('.frw').append(bookmark)
       })
-      if (s === this.renderer) {
-        $(bookmark).addClass('toggled');
-      }
-      bookmarks.find('.frw').append(bookmark);
-    })
-    menu.appendChild(bookmarks.get(0));
-    //
-    let any = $(`
+      menu.appendChild(bookmarks.get(0))
+      //
+      let any = $(`
       <form class="fr g1 af js wf" onsubmit="event.preventDefault()">
         <input type="text" class="grow br1 bd1 p-1 b0 wf" autocomplete="off" required placeholder="/any/renderer" />
         <button class="p-1 br1 bd1 b1 hover">submit</button>
       </form>
-    `);
-    any.on('submit', (e) => {
-      e.preventDefault();
-      $(this).attr('renderer', any.find('input').val());
-    })
-    menu.appendChild(any.get(0));
+    `)
+      any.on('submit', (e) => {
+        e.preventDefault()
+        $(this).attr('renderer', any.find('input').val())
+      })
+      menu.appendChild(any.get(0))
+    }
   }
-});
+)
diff --git a/pkg/arvo/neo/cod/std/src/imp/mast.hoon b/pkg/arvo/neo/cod/std/src/imp/mast.hoon
index 91edc14af7..9f9c0859be 100644
--- a/pkg/arvo/neo/cod/std/src/imp/mast.hoon
+++ b/pkg/arvo/neo/cod/std/src/imp/mast.hoon
@@ -1,5 +1,6 @@
 /@  ui-event
 /@  mast-bind
+/-  su=shrub-utils
 /*  mast-js
 =<
 ^-  kook:neo
@@ -7,6 +8,19 @@
 ++  state  [%pro %sig]
 ++  poke   (sy %mast-bind %eyre-task %eyre-chan-task %gift ~)
 ++  deps   *deps:neo
+  :: %-  ~(gas by *band:neo)
+  :: :~  :-  %src
+  ::     ^-  fief:neo
+  ::     :-  req=&
+  ::     ^-  quay:neo
+  ::     :-  [pro/%sig ~]
+      :: ^-  (unit port:neo)
+      :: :+  ~  %y
+      :: %-  ~(gas by *lads:neo)
+      :: :~  :-  &
+      ::     `lash:neo`[pro/%hoon ~]
+      :: ==
+  ::==
 ++  kids
   :+  ~  %y
   %-  my
@@ -68,10 +82,18 @@
         =/  url=path  (stab url.request.req)
         =/  =bind
           ?:  ?=([%mast ^] url)
+            =/  renderer  ;;  @tas  i.t.url
+            ::=/  lore  q:(~(got by deps.bowl) %src)
+            ::=/  u-pail=(unit pail:neo)  (get-pail-saga-by-pith:su q:(~(got by deps.bowl) %src) `pith`/[renderer])
+            ::  i.t.url should match existing imp file 
+            ~&  >>  it-url/i.t.url 
+            ::~&  >>  pail-at-tt-url/(kids-at-pith:su lore /)
             [i.t.url (pave:neo t.t.url)]
           (~(got by endpoints.rig) url)
         =/  =rope  (mug bind)
+        ~&  >  rope/rope
         =/  =boat  ship.src.bowl
+        ~&  >  boat/boat
         ?.  ?|  =(our.bowl boat)
                 (~(has in public.rig) rope)
             ==

From f1cea5867dd8f62a63b219db04e4ae9fe33341d8 Mon Sep 17 00:00:00 2001
From: SuperCoolYun <yunraccoon@gmail.com>
Date: Fri, 20 Sep 2024 11:38:41 -0400
Subject: [PATCH 2/6] validating imp-renderer in mast

---
 pkg/arvo/app/neo.hoon                  |  6 ++--
 pkg/arvo/neo/cod/std/src/imp/mast.hoon | 40 ++++++++++++--------------
 2 files changed, 21 insertions(+), 25 deletions(-)

diff --git a/pkg/arvo/app/neo.hoon b/pkg/arvo/app/neo.hoon
index e4abcce6d7..43b20a2500 100644
--- a/pkg/arvo/app/neo.hoon
+++ b/pkg/arvo/app/neo.hoon
@@ -1564,6 +1564,8 @@
   =.  run  (emit do-std-warp)
   =.  run
     (emit (do-card #/[p/our.bowl] %make %root ~ ~))
+  =.  run
+    (emit (do-card #/[p/our.bowl]/cod/std/src/imp %make %sig `sig/!>(~) ~))
   =.  run
     (emit (do-card #/[p/our.bowl]/sky %make %sky ~ ~))
   =.  run
@@ -1571,9 +1573,7 @@
   =.  run
     (emit (do-card #/[p/our.bowl]/blue %make %blue ~ ~))
   =.  run
-    (emit (do-card #/[p/our.bowl]/cod/std/src/imp %make %sig ~ ~))
-  =.  run
-    (emit (do-card #/[p/our.bowl]/mast %make %mast ~ ~))
+    (emit (do-card #/[p/our.bowl]/mast %make %mast ~ (~(gas by *crew:neo) src/#/[p/our.bowl]/cod/std/src/imp ~)))
   =.  run
     (emit (do-card #/[p/our.bowl]/self %make %self ~ ~))
   =.  run
diff --git a/pkg/arvo/neo/cod/std/src/imp/mast.hoon b/pkg/arvo/neo/cod/std/src/imp/mast.hoon
index 9f9c0859be..b0c27a4ee9 100644
--- a/pkg/arvo/neo/cod/std/src/imp/mast.hoon
+++ b/pkg/arvo/neo/cod/std/src/imp/mast.hoon
@@ -7,20 +7,20 @@
 |%
 ++  state  [%pro %sig]
 ++  poke   (sy %mast-bind %eyre-task %eyre-chan-task %gift ~)
-++  deps   *deps:neo
-  :: %-  ~(gas by *band:neo)
-  :: :~  :-  %src
-  ::     ^-  fief:neo
-  ::     :-  req=&
-  ::     ^-  quay:neo
-  ::     :-  [pro/%sig ~]
-      :: ^-  (unit port:neo)
-      :: :+  ~  %y
-      :: %-  ~(gas by *lads:neo)
-      :: :~  :-  &
-      ::     `lash:neo`[pro/%hoon ~]
-      :: ==
-  ::==
+++  deps   
+  %-  ~(gas by *band:neo)
+  :~  :-  %src
+      ^-  fief:neo
+      :-  req=&
+      ^-  quay:neo
+      :-  [only/%sig ~]
+      ^-  (unit port:neo)
+      :+  ~  %y
+      %-  ~(gas by *lads:neo)
+      :~  :-  [|/%tas |]
+          `lash:neo`[only/%hoon ~]
+      ==
+  ==
 ++  kids
   :+  ~  %y
   %-  my
@@ -82,22 +82,18 @@
         =/  url=path  (stab url.request.req)
         =/  =bind
           ?:  ?=([%mast ^] url)
-            =/  renderer  ;;  @tas  i.t.url
-            ::=/  lore  q:(~(got by deps.bowl) %src)
-            ::=/  u-pail=(unit pail:neo)  (get-pail-saga-by-pith:su q:(~(got by deps.bowl) %src) `pith`/[renderer])
-            ::  i.t.url should match existing imp file 
-            ~&  >>  it-url/i.t.url 
-            ::~&  >>  pail-at-tt-url/(kids-at-pith:su lore /)
             [i.t.url (pave:neo t.t.url)]
           (~(got by endpoints.rig) url)
         =/  =rope  (mug bind)
-        ~&  >  rope/rope
         =/  =boat  ship.src.bowl
-        ~&  >  boat/boat
+        =/  lore  q:(~(got by deps.bowl) %src)
+        =/  renderer=(unit pail:neo)  (get-pail-saga-by-pith:su lore /[view.bind])
+        ~&  >>  u-pail/=(~ renderer)
         ?.  ?|  =(our.bowl boat)
                 (~(has in public.rig) rope)
             ==
           [(~(make-403 res bowl) rid) pail]
+        ?~  renderer  [(~(make-403 res bowl) rid) pail]
         =/  at=pith:neo    (~(session moor our.bowl) rope boat)
         =/  =made:neo      [view.bind ~ (my [%src src.bind] ~)]
         =/  wat            (~(get by waiting.rig) [rope boat])

From a4801b01f03918b9957097f757ef44ca2e0bde00 Mon Sep 17 00:00:00 2001
From: SuperCoolYun <yunraccoon@gmail.com>
Date: Fri, 20 Sep 2024 12:45:21 -0400
Subject: [PATCH 3/6] redirect to tree on nack in mast and blue renderer

---
 pkg/arvo/app/neo.hoon                  |  2 +-
 pkg/arvo/neo/cod/std/src/imp/blue.hoon | 29 +++++++++++++++++++++++++-
 pkg/arvo/neo/cod/std/src/imp/mast.hoon | 12 +++++++++--
 3 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/pkg/arvo/app/neo.hoon b/pkg/arvo/app/neo.hoon
index 43b20a2500..f4916846cc 100644
--- a/pkg/arvo/app/neo.hoon
+++ b/pkg/arvo/app/neo.hoon
@@ -1571,7 +1571,7 @@
   =.  run
     (emit (do-card #/[p/our.bowl]/srv/hawk %make %hawk-eyre ~ ~))
   =.  run
-    (emit (do-card #/[p/our.bowl]/blue %make %blue ~ ~))
+    (emit (do-card #/[p/our.bowl]/blue %make %blue ~ (~(gas by *crew:neo) src/#/[p/our.bowl]/cod/std/src/imp ~)))
   =.  run
     (emit (do-card #/[p/our.bowl]/mast %make %mast ~ (~(gas by *crew:neo) src/#/[p/our.bowl]/cod/std/src/imp ~)))
   =.  run
diff --git a/pkg/arvo/neo/cod/std/src/imp/blue.hoon b/pkg/arvo/neo/cod/std/src/imp/blue.hoon
index 0231c60aea..1adbab404b 100644
--- a/pkg/arvo/neo/cod/std/src/imp/blue.hoon
+++ b/pkg/arvo/neo/cod/std/src/imp/blue.hoon
@@ -1,6 +1,7 @@
 /@  eyre-reqs
 /-  serv=sky-server
 /-  srv=server
+/-  su=shrub-utils
 ^-  kook:neo
 |%
 ++  state  pro/%sig
@@ -11,7 +12,20 @@
   :~  :-  [|/%ta |]
       [pro/%eyre-task (sy %rely ~)]
   ==
-++  deps  *deps:neo
+++  deps   
+  %-  ~(gas by *band:neo)
+  :~  :-  %src
+      ^-  fief:neo
+      :-  req=&
+      ^-  quay:neo
+      :-  [only/%sig ~]
+      ^-  (unit port:neo)
+      :+  ~  %y
+      %-  ~(gas by *lads:neo)
+      :~  :-  [|/%tas |]
+          `lash:neo`[only/%hoon ~]
+      ==
+  ==
 ++  form
   |_  [=bowl:neo =aeon:neo =pail:neo]
   ++  init
@@ -44,8 +58,21 @@
       ::
       ::  handle everything under /blue
       =/  renderer  (snag 1 inner)
+      =/  lore  q:(~(got by deps.bowl) %src)
+      =/  has-renderer  
+        !=(~ (get-pail-saga-by-pith:su lore /[renderer]))
       ?^  renderer
         ~|('Second iota in URL must be a @tas.' !!)
+      ?.  has-renderer 
+        :_  sig/!>(~)
+        =/  =pith:neo  #/[p/our.bowl]/$/eyre
+        =/  loc  
+          (en-cord:pith:neo (welp /tree (tail (tail inner))))
+        :~
+          [pith %poke eyre-sign/!>([eyre-id %head 307 ['Location' loc]~])]
+          [pith %poke eyre-sign/!>([eyre-id %data ~])]
+          [pith %poke eyre-sign/!>([eyre-id %done ~])]
+        ==
       :_  sig/!>(~)
       :~  :*  (welp here.bowl [[%ta eyre-id] ~])
               %make
diff --git a/pkg/arvo/neo/cod/std/src/imp/mast.hoon b/pkg/arvo/neo/cod/std/src/imp/mast.hoon
index b0c27a4ee9..bac501aa36 100644
--- a/pkg/arvo/neo/cod/std/src/imp/mast.hoon
+++ b/pkg/arvo/neo/cod/std/src/imp/mast.hoon
@@ -88,12 +88,12 @@
         =/  =boat  ship.src.bowl
         =/  lore  q:(~(got by deps.bowl) %src)
         =/  renderer=(unit pail:neo)  (get-pail-saga-by-pith:su lore /[view.bind])
-        ~&  >>  u-pail/=(~ renderer)
         ?.  ?|  =(our.bowl boat)
                 (~(has in public.rig) rope)
             ==
           [(~(make-403 res bowl) rid) pail]
-        ?~  renderer  [(~(make-403 res bowl) rid) pail]
+        =/  has-renderer  !=(~ renderer)
+        ?.  has-renderer  [(~(make-tree-redirect res bowl) rid src.bind) pail]
         =/  at=pith:neo    (~(session moor our.bowl) rope boat)
         =/  =made:neo      [view.bind ~ (my [%src src.bind] ~)]
         =/  wat            (~(get by waiting.rig) [rope boat])
@@ -309,6 +309,14 @@
       [307 ['Location' '/~/login?redirect='] ~]
     ~
   ::
+  ++  make-tree-redirect
+    |=  [rid=@ta loc=pith]
+    ^-  (list card:neo)
+    %^    make-direct-http-cards
+        rid
+      [307 ['Location' (en-cord:pith:neo (welp /tree loc))] ~]
+    ~
+  ::
   ++  make-direct-http-cards
     |=  [rid=@ta hed=response-header:http dat=(unit octs)]
     ^-  (list card:neo)

From c55174a434962ac13d4fbf53152e147e7195b032 Mon Sep 17 00:00:00 2001
From: SuperCoolYun <yunraccoon@gmail.com>
Date: Fri, 20 Sep 2024 12:47:46 -0400
Subject: [PATCH 4/6] wi-nd console logs removed

---
 pkg/arvo/neo/cod/std/src/fil/wi-nd.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
index 0ee2a94723..ffb3a7921a 100644
--- a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
+++ b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
@@ -446,11 +446,9 @@ customElements.define(
         window.location.origin + this.renderer + this.here
       )
       if (isLoading) {
-        console.log('url works')
         let frame = this.createIframe(this.renderer, this.here, true)
         $(this.gid('tabs')).append(frame)
       } else {
-        console.log('redirect to tree')
         let frame = this.createIframe(`/tree`, this.here, true)
         $(this.gid('menu-toggle')).text(`tree`)
         $(this.gid('tabs')).append(frame)

From f42589ce5f63c2cf5e79a96fe2fe384a5e03dd73 Mon Sep 17 00:00:00 2001
From: SuperCoolYun <yunraccoon@gmail.com>
Date: Fri, 20 Sep 2024 15:37:48 -0400
Subject: [PATCH 5/6] default renderer changed to `/self`

---
 pkg/arvo/neo/cod/std/src/fil/wi-nd.js  | 15 +++++++++++----
 pkg/arvo/neo/cod/std/src/imp/home.hoon |  2 +-
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
index ffb3a7921a..aaa4ac16ad 100644
--- a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
+++ b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
@@ -427,7 +427,11 @@ customElements.define(
       let el = document.createElement('iframe')
       el.setAttribute('prefix', prefix)
       el.setAttribute('lazy', '')
-      el.setAttribute('src', prefix + here)
+      if (prefix === '/self') {
+        el.setAttribute('src', here)
+      } else {
+        el.setAttribute('src', prefix + here)
+      }
       el.setAttribute(
         'style',
         'width: 100%; flex-grow: 1; border: none; background: var(--b0);'
@@ -442,9 +446,12 @@ customElements.define(
     }
     async rebuildIframe() {
       $(this.gid('tabs')).children().remove()
-      let isLoading = await this.checkUrl(
-        window.location.origin + this.renderer + this.here
-      )
+      let url =
+        this.renderer === '/self'
+          ? window.location.origin + this.here
+          : window.location.origin + this.renderer + this.here
+      let isLoading = await this.checkUrl(url)
+      console.log('isLoading', isLoading, url)
       if (isLoading) {
         let frame = this.createIframe(this.renderer, this.here, true)
         $(this.gid('tabs')).append(frame)
diff --git a/pkg/arvo/neo/cod/std/src/imp/home.hoon b/pkg/arvo/neo/cod/std/src/imp/home.hoon
index 7e582e45b1..d8a68d2b56 100644
--- a/pkg/arvo/neo/cod/std/src/imp/home.hoon
+++ b/pkg/arvo/neo/cod/std/src/imp/home.hoon
@@ -52,7 +52,7 @@
         [#/[p/our.bowl]/home/docs/guides/feather %make %sail `sail/!>([feather-intro 'prose p-page mw-page ma' ~]) ~]
         [#/[p/our.bowl]/home/docs/guides/axal-core %make %sail `sail/!>([axal 'prose p-page mw-page ma' ~]) ~]
       ::
-        [#/[p/our.bowl]/sky/strategy/[p/our.bowl]/home %make %order `order/!>([#/hawk ~]) ~]
+        [#/[p/our.bowl]/sky/strategy/[p/our.bowl]/home %make %order `order/!>([#/self ~]) ~]
     ==
   ++  poke
     |=  =pail:neo

From c028ad8ed37b36dc037ea9c04ce613110fe6cbcd Mon Sep 17 00:00:00 2001
From: SuperCoolYun <yunraccoon@gmail.com>
Date: Fri, 20 Sep 2024 15:55:06 -0400
Subject: [PATCH 6/6] minor bug fixes in wi-nd iframe

---
 pkg/arvo/neo/cod/std/src/fil/wi-nd.js | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
index aaa4ac16ad..bde6c35d7b 100644
--- a/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
+++ b/pkg/arvo/neo/cod/std/src/fil/wi-nd.js
@@ -427,11 +427,7 @@ customElements.define(
       let el = document.createElement('iframe')
       el.setAttribute('prefix', prefix)
       el.setAttribute('lazy', '')
-      if (prefix === '/self') {
-        el.setAttribute('src', here)
-      } else {
-        el.setAttribute('src', prefix + here)
-      }
+      el.setAttribute('src', prefix + here)
       el.setAttribute(
         'style',
         'width: 100%; flex-grow: 1; border: none; background: var(--b0);'
@@ -445,17 +441,17 @@ customElements.define(
       return el
     }
     async rebuildIframe() {
-      $(this.gid('tabs')).children().remove()
       let url =
         this.renderer === '/self'
           ? window.location.origin + this.here
           : window.location.origin + this.renderer + this.here
       let isLoading = await this.checkUrl(url)
-      console.log('isLoading', isLoading, url)
       if (isLoading) {
+        $(this.gid('tabs')).children().remove()
         let frame = this.createIframe(this.renderer, this.here, true)
         $(this.gid('tabs')).append(frame)
       } else {
+        $(this.gid('tabs')).children().remove()
         let frame = this.createIframe(`/tree`, this.here, true)
         $(this.gid('menu-toggle')).text(`tree`)
         $(this.gid('tabs')).append(frame)