Search and listings lead with the <name>.pit.world link for Moshpit names

src/html.ts

@@ -7,7 +7,7 @@ import { readFileSync } from 'node:fs'
 import { BANGS } from './bangs.js'
 import { LINKS, MOSHPIT_ROOT_SHA256, type NetworkStats, type Resolution } from './moshpit.js'
 import type { Promo } from './promoted.js'
-import { ringBar, ringSites, RSS_RING, siteHref, type RingSite } from './ring.js'
+import { proxyUrl, ringBar, ringSites, RSS_RING, siteHref, type RingSite } from './ring.js'
 import { LABELS, type Provider, type SearchResult } from './search.js'
 import { thumbSrc, VERTICALS, type Media, type MediaResult, type Vertical } from './verticals.js'
 
@@ -178,11 +178,16 @@ export function homePage(stats: NetworkStats | null, options: { newsletter?: boo
 
 function moshpitCard(resolution: Resolution): string {
   const live = resolution.nameRegistered
+  // A name with a server opens for everyone through our relay (<name>.pit.world): that is the link we lead with,
+  // because most people searching have no Moshpit DNS. The bare name is for those who do.
+  const served = live && Boolean(resolution.target)
+  const web = proxyUrl(resolution.name)
   return `<aside class="card mosh">
   <p class="kicker">Moshpit name</p>
-  <h2><a href="https://${esc(resolution.name)}/" rel="noreferrer noopener">${esc(resolution.name)}</a></h2>
-  <p>${live ? `Registered on the Moshpit network${resolution.target ? `, pointing at <code>${esc(resolution.target)}</code>` : ''}.` : 'Not registered yet: it could be yours.'}</p>
-  <p class="row"><a class="btn" href="${esc(resolution.page)}">${live ? 'Registry page' : 'Claim it'}</a>
+  <h2><a href="${esc(served ? web : `https://${resolution.name}/`)}" rel="noreferrer noopener">${esc(resolution.name)}</a></h2>
+  ${served ? `<p class="url"><a href="${esc(web)}" rel="noreferrer noopener">${esc(web.replace(/\/$/, ''))}</a></p>` : ''}
+  <p>${live ? `Registered on the Moshpit network${resolution.target ? `, pointing at <code>${esc(resolution.target)}</code>` : ''}.${served ? ' Opens in any browser through pit.world, no setup needed.' : ''}` : 'Not registered yet: it could be yours.'}</p>
+  <p class="row">${served ? `<a class="btn" href="${esc(web)}" rel="noreferrer noopener">Open ${esc(resolution.name)}</a> <a href="https://${esc(resolution.name)}/" rel="noreferrer noopener">On Moshpit DNS</a> · ` : ''}<a${served ? '' : ' class="btn"'} href="${esc(resolution.page)}">${live ? 'Registry page' : 'Claim it'}</a>
   <a href="/connect">How to open Moshpit names →</a></p>
 </aside>`
 }

src/listings-html.ts

@@ -2,7 +2,7 @@
 import { docPage, esc } from './html.js'
 import type { ClaimStart, ContactStatus, Listing } from './listings.js'
 import { CATEGORIES, PRICES, categoryOf, operatorHref, priceLabel } from './pros.js'
-import { ringSnippet, RSS_RING } from './ring.js'
+import { proxyUrl, ringSnippet, RSS_RING } from './ring.js'
 
 const p = (s: string) => encodeURIComponent(s)
 const ext = (href: string, text: string) => `<a href="${esc(href)}" rel="noreferrer noopener">${esc(text)}</a>`
@@ -19,8 +19,12 @@ function licenseRow(l: Listing): string {
   return `<li><b>License</b> ${esc(l.license)}${esc(checked)}${verify}</li>`
 }
 
-/** The listing's website: a link on its own domain (some sites only answer on www or http), else https://<domain>/. */
+/**
+ * The listing's website: a link on its own domain (some sites only answer on www or http), else https://<domain>/.
+ * A site that lives only on Moshpit opens through our relay, so the link works in any browser.
+ */
 export function siteUrl(l: Listing): string {
+  if (l.moshpitOnly) return proxyUrl(l.domain)
   const own = l.links.find((u) => {
     try {
       return new URL(u).hostname.replace(/^www\./, '') === l.domain
@@ -49,7 +53,7 @@ function details(l: Listing): string {
     l.address && `<li><b>Address</b> ${esc(l.address)}</li>`,
     licenseRow(l),
     l.phone && `<li><b>Phone</b> <a href="tel:${esc(l.phone.replace(/[^\d+]/g, ''))}">${esc(l.phone)}</a></li>`,
-    l.moshpit && `<li><b>On Moshpit</b> ${ext(`https://${l.moshpit}/`, l.moshpit)}</li>`,
+    l.moshpit && `<li><b>On Moshpit</b> ${ext(`https://${l.moshpit}/`, l.moshpit)} · ${ext(proxyUrl(l.moshpit), `${l.moshpit}.pit.world`)} <span class="muted">(any browser)</span></li>`,
     l.feed && `<li><b>Feed</b> ${ext(l.feed, bare(l.feed))}</li>`,
     ...l.links.filter((u) => u !== siteUrl(l)).map((u) => `<li>${ext(u, bare(u))}</li>`),
   ].filter(Boolean)

test/pit.test.ts

@@ -522,3 +522,16 @@ describe('the Moshpit ring', () => {
     expect((await request('/ring/sideways')).status).toBe(404)
   })
 })
+
+describe('the Moshpit name card leads with a link that opens anywhere', () => {
+  it('a served name links through <name>.pit.world, with the bare name for Moshpit DNS', async () => {
+    const { resultsPage } = await import('../src/html.ts')
+    const page = resultsPage({ query: 'family.tree', result: null, error: null, resolution: { name: 'family.tree', registered: true, nameRegistered: true, target: 'dev2.profullstack.com', mode: 'clearnet', page: 'https://pit.moshcode.sh/n/family.tree' } })
+    expect(page).toContain('<h2><a href="https://family.tree.pit.world/"')
+    expect(page).toContain('class="btn" href="https://family.tree.pit.world/" rel="noreferrer noopener">Open family.tree</a>')
+    expect(page).toContain('href="https://family.tree/" rel="noreferrer noopener">On Moshpit DNS</a>')
+    const unclaimed = resultsPage({ query: 'nobody.tree', result: null, error: null, resolution: { name: 'nobody.tree', registered: true, nameRegistered: false, target: null, mode: null, page: 'https://pit.moshcode.sh/n/nobody.tree' } })
+    expect(unclaimed).not.toContain('nobody.tree.pit.world')
+    expect(unclaimed).toContain('>Claim it</a>')
+  })
+})