[object Object]

← back to Commercialrealestate

Apply Nav Agent to CRCP (9 pages incl. sfv-pool): field toggles, sort-any, group-by, list/KV views; data-field model on pool cards

84c2a7c8e52c4e202f1f62366719f29f84c8f32f · 2026-08-26 09:18:38 -0700 · Steve Abrams

Files touched

Diff

commit 84c2a7c8e52c4e202f1f62366719f29f84c8f32f
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Wed Aug 26 09:18:38 2026 -0700

    Apply Nav Agent to CRCP (9 pages incl. sfv-pool): field toggles, sort-any, group-by, list/KV views; data-field model on pool cards
---
 public/agent.html               |  2 ++
 public/direct-listings.html     |  2 ++
 public/firecities.html          |  2 ++
 public/index.html               |  2 ++
 public/lending.html             |  2 ++
 public/nav-agent/nav-agent.js   |  2 +-
 public/recities.html            |  2 ++
 public/residential-brokers.html |  2 ++
 public/sfv-pool.html            | 12 ++++++++----
 public/valley-pools.html        |  2 ++
 10 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/public/agent.html b/public/agent.html
index d31ef0b..5143d84 100644
--- a/public/agent.html
+++ b/public/agent.html
@@ -40,6 +40,7 @@ select{background:var(--card);border:1px solid var(--line);color:var(--ink);bord
 .note{color:var(--mut);font-size:11.5px;margin:14px 0 0;line-height:1.5}
 </style>
 <link rel="stylesheet" href="/crcp-theme.css">
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head><body>
 <header>
   <h1>📇 Agent Profile</h1>
@@ -149,4 +150,5 @@ else fetch('/api/agent-profile?'+(ID?'id='+encodeURIComponent(ID):'name='+encode
 <script src="/agent-notes.js" defer></script>
 <script src="/corner-nav.js" defer></script>
 <script src="/crcp-theme.js" defer></script>
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body></html>
diff --git a/public/direct-listings.html b/public/direct-listings.html
index b6a5ff4..60112c9 100644
--- a/public/direct-listings.html
+++ b/public/direct-listings.html
@@ -95,6 +95,7 @@ td a.f{color:var(--blue);text-decoration:none}td a.f:hover{text-decoration:under
   <link rel="stylesheet" href="/three-view.css">
   <link rel="stylesheet" href="/crcp-theme.css"><!-- CRCP day/night tokens: load LAST so it wins -->
   <style>/* theme-aware "text on accent" so chips/pills pass contrast in BOTH themes (Cody gate) */:root{--onacc:#0e1116}html[data-theme="light"]{--onacc:#ffffff}</style>
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head><body>
 <header>
   <h1><b>Direct Listings</b> · our-own dbase</h1>
@@ -390,4 +391,5 @@ boot();
   <script src="/three-view.js" defer></script>
   <script src="/corner-nav.js" defer></script>
   <script src="/crcp-theme.js" defer></script><!-- day/night toggle (auto-injects into header) -->
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body></html>
diff --git a/public/firecities.html b/public/firecities.html
index 1773d34..6037353 100644
--- a/public/firecities.html
+++ b/public/firecities.html
@@ -54,6 +54,7 @@
   footer{color:var(--mut);font-size:12px;margin-top:30px}
 </style>
   <link rel="stylesheet" href="/crcp-theme.css"><!-- CRCP day/night tokens: load LAST so html[data-theme] wins -->
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <div class="wrap">
@@ -141,5 +142,6 @@ render();
 </script>
   <script src="/crcp-theme.js" defer></script><!-- CRCP day/night toggle (auto-injects into header) -->
   <script src="/corner-nav.js" defer></script>
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>
diff --git a/public/index.html b/public/index.html
index 596b7a9..014e1ba 100644
--- a/public/index.html
+++ b/public/index.html
@@ -440,6 +440,7 @@
 <script async src="https://www.googletagmanager.com/gtag/js?id=G-7R2X3B2V18"></script><script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}gtag('js',new Date());gtag('config','G-7R2X3B2V18');</script>
 <link rel="stylesheet" href="/crcp-theme.css">
   <!-- <link rel="stylesheet" href="/nav-agent/nav-agent.css"> nav-agent removed (no floating pop-out) -->
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <header>
@@ -2542,5 +2543,6 @@ function loadRanked(_retry){ return fetch('data/ranked.json').then(r=>{ if(!r.ok
     h.addEventListener('dblclick',function(){ document.documentElement.style.removeProperty('--railW'); try{ localStorage.removeItem(KEY); }catch(_){} });
   })();
   </script>
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>
diff --git a/public/lending.html b/public/lending.html
index 23be34e..12613ba 100644
--- a/public/lending.html
+++ b/public/lending.html
@@ -25,6 +25,7 @@
   .pub{color:var(--acc);border:1px solid rgba(112,173,71,.5);border-radius:8px;padding:2px 9px;font-size:11px;text-transform:uppercase;letter-spacing:.4px;}
 </style>
   <link rel="stylesheet" href="/crcp-theme.css"><!-- CRCP day/night tokens: load LAST so html[data-theme] wins -->
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <header>
@@ -102,5 +103,6 @@ counts();
 </script>
 <script src="/corner-nav.js" defer></script>
   <script src="/crcp-theme.js" defer></script><!-- CRCP day/night toggle (auto-injects into header) -->
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>
diff --git a/public/nav-agent/nav-agent.js b/public/nav-agent/nav-agent.js
index f955268..d368cf4 100644
--- a/public/nav-agent/nav-agent.js
+++ b/public/nav-agent/nav-agent.js
@@ -1,5 +1,5 @@
 /* ============================================================================
- * Nav Agent — universal grid-controls drop-in  (v1.2)
+ * Nav Agent — universal grid-controls drop-in  (v1.3)
  *
  * Drop one <script src=".../nav-agent.js" defer></script> (+ the CSS) onto any
  * page. It auto-detects the primary data grid (a <table> or a .grid/.card list),
diff --git a/public/recities.html b/public/recities.html
index 2a52c25..e6375f1 100644
--- a/public/recities.html
+++ b/public/recities.html
@@ -51,6 +51,7 @@
   footer{color:var(--mut);font-size:12px;margin-top:34px}
 </style>
   <link rel="stylesheet" href="/crcp-theme.css"><!-- CRCP day/night tokens: load LAST so html[data-theme] wins -->
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <div class="wrap">
@@ -150,5 +151,6 @@ render();
 </script>
   <script src="/crcp-theme.js" defer></script><!-- CRCP day/night toggle (auto-injects into header) -->
   <script src="/corner-nav.js" defer></script>
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>
diff --git a/public/residential-brokers.html b/public/residential-brokers.html
index 9dfef83..1eab582 100644
--- a/public/residential-brokers.html
+++ b/public/residential-brokers.html
@@ -59,6 +59,7 @@
   <style>/* theme this page's custom vars (crcp-theme.css doesn't define --panel/--accent) + text-on-accent, so light mode fully flips */
     html[data-theme="dark"]{--panel:#121722;--accent:#4a90d9;--onacc:#0a0d13}
     html[data-theme="light"]{--panel:#ffffff;--accent:#0969da;--onacc:#ffffff}</style>
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <header>
@@ -241,5 +242,6 @@ $('dens').oninput=e=>{ state.cols=+e.target.value; save(); draw(); };
 renderToggles(); startViews(); load();
 </script>
   <script src="/crcp-theme.js" defer></script><!-- CRCP day/night toggle (auto-injects into header) -->
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>
diff --git a/public/sfv-pool.html b/public/sfv-pool.html
index baabd0d..688e2d7 100644
--- a/public/sfv-pool.html
+++ b/public/sfv-pool.html
@@ -69,6 +69,7 @@
   .btn.ghost { background:#21262d; color:#c9d1d9; border:1px solid #2a313c; }
   .x { background:none; border:0; color:#8b949e; font-size:22px; cursor:pointer; line-height:1; }
 </style>
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <div class="wrap">
@@ -153,12 +154,14 @@ function render() {
     const photo = r.photo_url
       ? `<img class="photo" src="${r.photo_url}" alt="" loading="lazy">`
       : `<div class="photo ph"></div>`;
+    const poolTxt = r._pool==='true'?'Pool':r._pool==='false'?'No Pool':'Pending';
+    // data-field tags give the Nav Agent a clean per-field model (Fields toggle / sort-by-any / group-by)
     return `<div class="card" data-id="${r.id}">
       ${photo}
-      <div class="addr">${r.address||'—'}</div>
-      <div class="price">${money(r.price)} <span style="font-size:12px;color:#8b949e;font-weight:400">${pp?'· '+pp:''}</span></div>
-      <div class="meta">${r.city} · ${r.beds||'?'} bd / ${r.baths||'?'} ba · ${r.sqft?(+r.sqft).toLocaleString()+' sqft':'—'}${lot?' · lot '+lot:''} · ${r.days_on_market!=null?r.days_on_market+'d':''}</div>
-      <div>${poolBadge(r._pool)}</div>${feat}
+      <div class="addr" data-field="Address">${r.address||'—'}</div>
+      <div class="price"><span data-field="Price">${money(r.price)}</span> <span data-field="$/sqft" style="font-size:12px;color:#8b949e;font-weight:400">${pp?'· '+pp:''}</span></div>
+      <div class="meta"><span data-field="City">${r.city}</span> · <span data-field="Beds">${r.beds||'?'}</span> bd / <span data-field="Baths">${r.baths||'?'}</span> ba · <span data-field="Sqft">${r.sqft?(+r.sqft).toLocaleString():'—'}</span> sqft${lot?' · lot <span data-field="Lot">'+lot+'</span>':''} · <span data-field="DOM">${r.days_on_market!=null?r.days_on_market+'d':''}</span></div>
+      <div><span data-field="Pool">${poolBadge(r._pool)}</span></div>${feat}
     </div>`;
   }).join('');
   $('#foot').textContent = `${rows.length} shown · pool status enriched from Redfin listing detail (structured POOL_FEATURES). "Pending" = detail not yet checked or field absent.`;
@@ -239,5 +242,6 @@ document.addEventListener('keydown', e => { if (e.key === 'Escape') closeModal()
 
 load();
 </script>
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>
diff --git a/public/valley-pools.html b/public/valley-pools.html
index fefeffe..b645160 100644
--- a/public/valley-pools.html
+++ b/public/valley-pools.html
@@ -114,6 +114,7 @@
 </style>
 <link rel="stylesheet" href="/three-view.css">
 <link rel="stylesheet" href="/nav-agent/nav-agent.css">
+  <link rel="stylesheet" href="/nav-agent/nav-agent.css"><!-- nav-agent -->
 </head>
 <body>
 <header>
@@ -346,5 +347,6 @@ Promise.all([
 <script src="/nav-agent/nav-agent.js" defer></script>
 <script src="/filter-modal.js" defer></script>
 <script src="/crcp-theme.js" defer></script>
+  <script src="/nav-agent/nav-agent.js" defer></script><!-- nav-agent -->
 </body>
 </html>

← 5f4acf6 SFV pool: mls.html ?shortlist=sfv-pool deep-link (lands on m  ·  back to Commercialrealestate  ·  sfv-pool: add Cards/Map view toggle — Leaflet map w/ cluster 8d76471 →