retire-provenance: superseded Q b/ objects (sha256 CAS, HOLO-LEAN-RESOLVER P1.3)
Browse files
sha256/197099c7be1a25b40c0d8cb7825701228333a869652902934d1b8d28c404c554
ADDED
|
The diff for this file is too large to render.
See raw diff
|
|
|
sha256/1990a824dea84e1dbcc4f8dd32a7ac1e326f85b7ea1d4db7c7545d29496c5280
ADDED
|
@@ -0,0 +1,779 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!doctype html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="utf-8" />
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
| 6 |
+
<title>Your Space — a place for friends</title>
|
| 7 |
+
<meta name="description" content="Your page is back. A whole 2004-style space carried inside one link — no account, no app, no server. Step in, then make it yours in one tap." />
|
| 8 |
+
<meta property="og:title" content="Your Space — a place for friends" />
|
| 9 |
+
<meta property="og:description" content="The page your thumbs remember, reborn: it travels whole inside one link. Step in, then make it yours in one tap." />
|
| 10 |
+
<meta property="og:type" content="website" />
|
| 11 |
+
<meta name="twitter:card" content="summary" />
|
| 12 |
+
<style>
|
| 13 |
+
/* ── HOLO-MYSPACE-AUTHENTIC A0 tokens — harvested from wittenbrock/toms-myspace-page.
|
| 14 |
+
Authentic in FORM (2004 palette, Verdana 8pt, 800px white page, table rhythm),
|
| 15 |
+
lawful in SUBSTANCE (κ-true, honest numbers, 2026 speed). ─────────────────────── */
|
| 16 |
+
:root {
|
| 17 |
+
--ms-blue: #003399; --ms-band: #6699cc; --ms-label: #b1d0f0; --ms-cell: #d5e8fb;
|
| 18 |
+
--ms-labeltext: #336699; --ms-orange: #ff6600; --ms-orangeband: #ffcc99;
|
| 19 |
+
--ms-cth: #ff9933; --ms-ctd: #f9d6b4; --ms-red: #cc0000; --ms-page: #ffffff; --ms-bg: #e5e5e5;
|
| 20 |
+
}
|
| 21 |
+
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
|
| 22 |
+
html, body { margin: 0; }
|
| 23 |
+
body { font-family: verdana, arial, sans-serif, helvetica; font-size: 8pt; background: var(--ms-bg); color: #000; }
|
| 24 |
+
a { font-weight: bold; text-decoration: none; color: var(--ms-blue); cursor: pointer; }
|
| 25 |
+
a:hover { text-decoration: underline; color: var(--ms-red); }
|
| 26 |
+
h1 { font-size: 12.25pt; font-weight: bold; margin: 15px 0 0; }
|
| 27 |
+
h2 { font-size: 9pt; font-weight: bold; margin: 0; }
|
| 28 |
+
.master { margin: auto; width: 800px; max-width: 100%; background: var(--ms-page); min-height: 100vh;
|
| 29 |
+
padding-bottom: calc(70px + env(safe-area-inset-bottom)); } /* clear the fixed loop bar */
|
| 30 |
+
|
| 31 |
+
/* header — the blue block + search row + #6699CC navbar */
|
| 32 |
+
.hdr { background: var(--ms-blue); color: #fff; padding-top: 6px; }
|
| 33 |
+
.hdr a { color: #fff; font-weight: normal; }
|
| 34 |
+
.hdr .toprow { display: flex; align-items: baseline; gap: .5rem; padding: 4px 10px; flex-wrap: wrap; }
|
| 35 |
+
.hdr .wordmark { font-size: 15pt; font-weight: bold; letter-spacing: -.5px; }
|
| 36 |
+
.hdr .tagline { font-size: 8pt; opacity: .92; }
|
| 37 |
+
.hdr .helpsignup { margin-left: auto; font-size: 8pt; }
|
| 38 |
+
.searchrow { display: flex; align-items: center; gap: 6px; padding: 4px 10px 8px; flex-wrap: wrap; font-size: 8pt; }
|
| 39 |
+
.searchrow input[type="text"] { width: 160px; font: inherit; padding: 1px 3px; }
|
| 40 |
+
.btn2004 { border: 1px solid rgb(186,186,186); padding: 2px 7px; background: #e0ffff; font-size: 10px; font-family: inherit; cursor: pointer; color: #000; }
|
| 41 |
+
.navbar { display: flex; align-items: center; background: var(--ms-band); min-height: 26px; flex-wrap: wrap; padding: 2px 6px; }
|
| 42 |
+
.navbar a { color: #fff; font-weight: bold; font-size: 8pt; white-space: nowrap; }
|
| 43 |
+
.navbar a:hover { color: var(--ms-blue); text-decoration: none; }
|
| 44 |
+
.navbar .sep { color: #000; margin: 0 .33rem; }
|
| 45 |
+
|
| 46 |
+
/* two columns: 325 / 453, 20px gap (the harvest), stacked on phones */
|
| 47 |
+
.page { display: grid; grid-template-columns: 305px 1fr; gap: 20px; padding: 0 12px 20px 27px; }
|
| 48 |
+
@media (max-width: 719px) { .page { display: block; padding: 0 10px 20px; } .netbanner { width: auto !important; } }
|
| 49 |
+
|
| 50 |
+
/* left column */
|
| 51 |
+
.picwrap { display: flex; gap: 15px; margin: 10px 0 12px; }
|
| 52 |
+
.avatar { width: 130px; height: 150px; flex: none; display: grid; place-items: center; font-size: 64px;
|
| 53 |
+
background: #fff; border: 1px solid #999; overflow: hidden; }
|
| 54 |
+
.avatar img { width: 100%; height: 100%; object-fit: cover; }
|
| 55 |
+
.picmeta { display: flex; flex-direction: column; min-width: 0; }
|
| 56 |
+
.picmeta .quote { margin: 2px 0 10px; font-weight: bold; }
|
| 57 |
+
.picmeta ul { list-style: none; margin: 0; padding: 0; }
|
| 58 |
+
.picmeta .lastlogin { margin-top: auto; padding-bottom: 4px; color: #000; }
|
| 59 |
+
.online { color: #fff; background: #390; font-weight: bold; padding: 0 4px; font-size: 7pt; display: inline-block; margin-top: 3px; }
|
| 60 |
+
.moodline { margin-top: 6px; }
|
| 61 |
+
|
| 62 |
+
.contactbox { border: 2px solid var(--ms-band); width: 100%; margin-bottom: 24px; }
|
| 63 |
+
.contactbox h2 { color: #fff; background: var(--ms-band); padding: 2px 0 2px 10px; font-size: 9pt; }
|
| 64 |
+
.contactgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 4px; padding: 6px 10px 8px; }
|
| 65 |
+
.contactgrid a { font-size: 8pt; }
|
| 66 |
+
.urlbox { border: 1px solid var(--ms-band); margin-bottom: 24px; padding: 2px 6px 4px; overflow: hidden; }
|
| 67 |
+
.urlbox b { font-size: 8pt; }
|
| 68 |
+
.urlbox .thelink { color: var(--ms-blue); font-weight: bold; cursor: pointer; word-break: break-all; display: block; max-height: 3.9em; overflow: hidden; }
|
| 69 |
+
.urlbox .kap { color: #666; font-weight: normal; cursor: pointer; }
|
| 70 |
+
.urlbox .kap.ok { color: #390; }
|
| 71 |
+
|
| 72 |
+
table.side { border: 2px solid var(--ms-band); border-collapse: separate; border-spacing: 3px; width: 100%; margin-bottom: 13px; }
|
| 73 |
+
table.side .h2row td { background: var(--ms-band); color: #fff; font-weight: bold; font-size: 9pt; padding: 2px 0 2px 15px; }
|
| 74 |
+
table.side th { vertical-align: top; text-align: left; width: 37%; background: var(--ms-label); color: var(--ms-labeltext); padding: 3px; font-weight: bold; font-size: 8pt; }
|
| 75 |
+
table.side td.v { background: var(--ms-cell); padding: 3px; width: 63%; word-break: break-word; }
|
| 76 |
+
|
| 77 |
+
/* right column */
|
| 78 |
+
.netbanner { display: flex; justify-content: center; align-items: center; width: 433px; max-width: 100%; margin: 13px auto 0; height: 75px; border: 2px solid #000; text-align: center; padding: 0 8px; }
|
| 79 |
+
.netbanner h2 { font-size: 12pt; }
|
| 80 |
+
.blog { margin: 13px 0 16px 12px; }
|
| 81 |
+
.blog p { margin: 3px 0; }
|
| 82 |
+
.mainhead { background: var(--ms-orangeband); padding: 3px 0; margin: 0 0 8px; }
|
| 83 |
+
.mainhead h2 { color: var(--ms-orange); margin-left: 20px; }
|
| 84 |
+
.blurbs h3 { margin: 0 0 2px 15px; color: var(--ms-orange); font-size: 9pt; }
|
| 85 |
+
.blurbs p { margin: 0 10px 15px 15px; white-space: pre-wrap; line-height: 1.3; }
|
| 86 |
+
section { margin-bottom: 10px; }
|
| 87 |
+
|
| 88 |
+
/* the profile song — the little player bar */
|
| 89 |
+
.player { display: flex; align-items: center; gap: 8px; border: 2px solid var(--ms-band); background: #001a4d; color: #fff; padding: 5px 8px; margin: 0 10px 18px 15px; }
|
| 90 |
+
.player button { background: #e0ffff; border: 1px solid #999; width: 26px; height: 22px; cursor: pointer; font-size: 10px; }
|
| 91 |
+
.player .tt { font-size: 8pt; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
|
| 92 |
+
.player .tt b { color: #ffcc99; }
|
| 93 |
+
/* braille equalizer — animates only while the song plays (JS-driven frames) */
|
| 94 |
+
.player .viz { flex: none; width: 0; overflow: hidden; font-family: "Segoe UI Symbol", "Noto Sans Symbols2", monospace;
|
| 95 |
+
font-size: 13px; line-height: 1; letter-spacing: 1px; color: var(--ms-orange, #ffcc99); text-shadow: 0 0 6px currentColor;
|
| 96 |
+
transition: width .18s ease; white-space: nowrap; }
|
| 97 |
+
.player.playing .viz { width: 3.4em; }
|
| 98 |
+
|
| 99 |
+
.friends p.count { margin: 0 0 8px 15px; }
|
| 100 |
+
.focus { color: var(--ms-red); font-weight: bold; font-size: 10pt; }
|
| 101 |
+
.friendgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 0 8px; }
|
| 102 |
+
@media (max-width: 719px) { .friendgrid { grid-template-columns: repeat(2, 1fr); } }
|
| 103 |
+
.friendgrid figure { margin: 0; text-align: center; cursor: pointer; position: relative; }
|
| 104 |
+
.friendgrid .face { width: 88px; height: 88px; margin: auto; display: grid; place-items: center; font-size: 40px; background: #eee; border: 1px solid #999; overflow: hidden; }
|
| 105 |
+
.friendgrid .face img { width: 100%; height: 100%; object-fit: cover; }
|
| 106 |
+
.friendgrid figcaption { margin-top: 3px; }
|
| 107 |
+
.friendgrid figcaption a { color: var(--ms-blue); }
|
| 108 |
+
.friendgrid .rm { display: none; position: absolute; top: -6px; right: 6px; width: 20px; height: 20px; border: 1px solid #999; background: #fff; color: var(--ms-red); font-weight: bold; cursor: pointer; }
|
| 109 |
+
body.edit .friendgrid .rm { display: block; }
|
| 110 |
+
.viewall { text-align: right; margin: 7px 8px 22px 0; }
|
| 111 |
+
.viewall a { color: var(--ms-red); }
|
| 112 |
+
|
| 113 |
+
.comments table { width: calc(100% - 16px); margin: 0 auto 5px; border-collapse: separate; border-spacing: 2px; }
|
| 114 |
+
.comments th { background: var(--ms-cth); width: 35%; padding: 3px; vertical-align: top; font-size: 8pt; text-align: center; }
|
| 115 |
+
.comments td { background: var(--ms-ctd); padding: 3px 6px; vertical-align: top; font-weight: normal; text-align: left; }
|
| 116 |
+
.comments .ccount { margin: 0 0 6px 15px; }
|
| 117 |
+
.addcomment { text-align: right; margin: 0 10px 12px 0; }
|
| 118 |
+
|
| 119 |
+
.ftr { background: var(--ms-bg); padding: 10px 8px 14px; text-align: center; }
|
| 120 |
+
.ftr a { font-weight: normal; text-decoration: underline; font-size: 8pt; }
|
| 121 |
+
.ftr small { display: block; margin-top: 8px; font-size: 8pt; color: #333; }
|
| 122 |
+
|
| 123 |
+
/* ── edit mode: Playground law — every element edits in place ───────────────────────── */
|
| 124 |
+
body.edit [data-ek], body.edit [data-eki], body.edit [data-ekd], body.edit [data-ekg] { outline: 1px dashed var(--ms-red); outline-offset: 2px; min-width: 20px; cursor: text; }
|
| 125 |
+
[contenteditable]:empty::before { content: attr(data-ph); color: #999; font-weight: normal; }
|
| 126 |
+
.editonly { display: none; }
|
| 127 |
+
body.edit .editonly { display: block; }
|
| 128 |
+
body.edit .avatar { cursor: pointer; }
|
| 129 |
+
.layoutchips { display: flex; flex-wrap: wrap; gap: 5px; padding: 4px 10px 8px; }
|
| 130 |
+
.csspaste { width: calc(100% - 20px); margin: 0 10px 8px; font: 8pt monospace; min-height: 70px; }
|
| 131 |
+
.srchbox input { width: calc(100% - 20px); margin: 0 10px 6px; font: inherit; padding: 2px 4px; }
|
| 132 |
+
.srchbox .res { display: flex; gap: 6px; align-items: center; padding: 3px 12px; cursor: pointer; }
|
| 133 |
+
.srchbox .res:hover { background: var(--ms-cell); }
|
| 134 |
+
.srchbox .res img { width: 30px; height: 30px; }
|
| 135 |
+
.doorform input { width: calc(100% - 20px); margin: 0 10px 5px; font: inherit; padding: 2px 4px; }
|
| 136 |
+
|
| 137 |
+
/* the loop bar — a modern sticky bar (the one deliberate anachronism). SKIN-INDEPENDENT: its own
|
| 138 |
+
neutral dark chrome + always-readable buttons, so it never inherits a profile skin into an
|
| 139 |
+
unreadable dark-on-dark button (the primary used to take --ms-orangeband + #000 text). */
|
| 140 |
+
#cta { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; display: flex; gap: 10px; justify-content: center;
|
| 141 |
+
padding: 9px 10px calc(9px + env(safe-area-inset-bottom)); background: rgba(14,14,14,.94); border-top: 1px solid rgba(255,255,255,.14);
|
| 142 |
+
-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
|
| 143 |
+
#cta .btn2004 { font-size: 12px; padding: 9px 18px; min-height: 44px; min-width: 132px; font-weight: bold; border-radius: 8px;
|
| 144 |
+
background: rgba(255,255,255,.10); color: #fff; border: 1px solid rgba(255,255,255,.34); }
|
| 145 |
+
#cta .btn2004:hover { background: rgba(255,255,255,.18); }
|
| 146 |
+
#cta .go { background: #fff; color: #111; border-color: #fff; }
|
| 147 |
+
#cta .go:hover { background: #eaeaea; }
|
| 148 |
+
#toast { position: fixed; z-index: 10; left: 50%; bottom: 78px; transform: translateX(-50%) translateY(16px); opacity: 0; pointer-events: none;
|
| 149 |
+
background: #fffbd6; border: 1px solid #999; color: #000; padding: 6px 12px; font-size: 8pt; transition: all .25s; max-width: 88vw; text-align: center; }
|
| 150 |
+
#toast.on { opacity: 1; transform: translateX(-50%); }
|
| 151 |
+
#picker { display: none; position: fixed; z-index: 9; left: 50%; bottom: 84px; transform: translateX(-50%); width: min(92vw, 360px);
|
| 152 |
+
padding: 8px; background: #fff; border: 2px solid var(--ms-band); }
|
| 153 |
+
#picker.on { display: block; }
|
| 154 |
+
#picker .grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; }
|
| 155 |
+
#picker .grid button { font-size: 18px; padding: 3px 0; background: none; border: 0; cursor: pointer; }
|
| 156 |
+
#picker input { width: 100%; margin-top: 6px; font: inherit; padding: 2px 4px; }
|
| 157 |
+
.hint { background: #fffbd6; border: 1px solid #e0c000; margin: 8px 12px 0; padding: 5px 8px; display: none; }
|
| 158 |
+
.hint.on { display: block; }
|
| 159 |
+
|
| 160 |
+
/* ── L1 (HOLO-SPACE-ALIVE): infinite holospace nesting — a friend's space mounts IN the page,
|
| 161 |
+
each nested layer a full instance of THIS app; doors inside nest again, arbitrarily deep. ── */
|
| 162 |
+
#nest { position: fixed; inset: 0; z-index: 40; display: none; flex-direction: column; background: rgba(0,0,0,.55); }
|
| 163 |
+
#nest.on { display: flex; }
|
| 164 |
+
.nestbar { display: flex; align-items: center; gap: 6px; padding: calc(6px + env(safe-area-inset-top)) 10px 6px; background: var(--ms-blue); color: #fff;
|
| 165 |
+
font-size: 8pt; box-shadow: 0 2px 8px rgba(0,0,0,.35); }
|
| 166 |
+
.nestbar .crumbs { display: flex; align-items: center; gap: 3px; flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
|
| 167 |
+
.nestbar .crumbs::-webkit-scrollbar { display: none; }
|
| 168 |
+
.nestbar .crumb { color: #fff; font-weight: bold; cursor: pointer; padding: 3px 6px; border-radius: 4px; }
|
| 169 |
+
.nestbar .crumb:hover { background: rgba(255,255,255,.2); }
|
| 170 |
+
.nestbar .crumb.here { opacity: .75; cursor: default; }
|
| 171 |
+
.nestbar .sepc { opacity: .6; }
|
| 172 |
+
.nestbar .nclose { flex: none; background: #fff; color: var(--ms-blue); border: 0; font-weight: bold; cursor: pointer; border-radius: 4px;
|
| 173 |
+
min-width: 40px; min-height: 30px; font-size: 11px; }
|
| 174 |
+
.nestframes { position: relative; flex: 1; background: var(--ms-bg); }
|
| 175 |
+
.nestframes iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #fff; display: none; }
|
| 176 |
+
.nestframes iframe.top { display: block; }
|
| 177 |
+
.doorspace { position: relative; }
|
| 178 |
+
.doorspace::after { content: "↳ space"; position: absolute; left: 50%; bottom: 2px; transform: translateX(-50%); font-size: 6.5pt;
|
| 179 |
+
background: var(--ms-band); color: #fff; padding: 0 4px; border-radius: 3px; pointer-events: none; opacity: .9; }
|
| 180 |
+
</style>
|
| 181 |
+
</head>
|
| 182 |
+
<body>
|
| 183 |
+
<div class="master">
|
| 184 |
+
<header class="hdr">
|
| 185 |
+
<div class="toprow">
|
| 186 |
+
<span class="wordmark">yourspace</span><span class="tagline">a place for friends.</span>
|
| 187 |
+
<span class="helpsignup"><a id="navhelp">Help</a> | <a id="navsignup">SignUp</a></span>
|
| 188 |
+
</div>
|
| 189 |
+
<div class="searchrow">
|
| 190 |
+
<input type="text" id="q" placeholder="" aria-label="search" />
|
| 191 |
+
<button class="btn2004" id="qgo">Search</button>
|
| 192 |
+
<label><input type="radio" name="sw" /> The Web</label>
|
| 193 |
+
<label><input type="radio" name="sw" checked /> YourSpace</label>
|
| 194 |
+
</div>
|
| 195 |
+
<nav class="navbar" id="navbar"></nav>
|
| 196 |
+
</header>
|
| 197 |
+
|
| 198 |
+
<div class="hint" id="hint"></div>
|
| 199 |
+
|
| 200 |
+
<div class="page">
|
| 201 |
+
<div class="col-left">
|
| 202 |
+
<h1 id="name" data-ek="name" data-ph="Your Name"></h1>
|
| 203 |
+
<div class="picwrap">
|
| 204 |
+
<div class="avatar" id="avatar">🪐</div>
|
| 205 |
+
<div class="picmeta">
|
| 206 |
+
<p class="quote" id="headline" data-ek="headline" data-ph='":-)"'></p>
|
| 207 |
+
<ul>
|
| 208 |
+
<li id="d-gender" data-ekg="gender" data-ph="Gender"></li>
|
| 209 |
+
<li id="d-age" data-ekg="age" data-ph="Age"></li>
|
| 210 |
+
<li id="d-city" data-ekg="city" data-ph="City"></li>
|
| 211 |
+
<li id="d-region" data-ekg="region" data-ph="State / Region"></li>
|
| 212 |
+
<li id="d-country" data-ekg="country" data-ph="Country"></li>
|
| 213 |
+
</ul>
|
| 214 |
+
<div class="moodline">Mood: <span id="moodemo" data-ek="moodemo" data-ph=":-)"></span> <span id="moodword" data-ek="moodword" data-ph="chillin"></span></div>
|
| 215 |
+
<ul class="lastlogin"><li id="lastlogin"></li><li><span class="online" id="online" style="display:none">ONLINE NOW!</span></li></ul>
|
| 216 |
+
</div>
|
| 217 |
+
</div>
|
| 218 |
+
|
| 219 |
+
<div class="contactbox">
|
| 220 |
+
<h2 id="contacth">Contacting You</h2>
|
| 221 |
+
<div class="contactgrid" id="contactgrid"></div>
|
| 222 |
+
</div>
|
| 223 |
+
|
| 224 |
+
<div class="urlbox">
|
| 225 |
+
<b>YourSpace URL:</b>
|
| 226 |
+
<span class="thelink" id="thelink" title="tap to copy your link — the link IS your whole space"></span>
|
| 227 |
+
<span class="kap" id="kap" title="this page's content address — tap to re-derive + copy">κ…</span>
|
| 228 |
+
</div>
|
| 229 |
+
|
| 230 |
+
<table class="side" id="interests"><tbody></tbody></table>
|
| 231 |
+
<table class="side" id="details"><tbody></tbody></table>
|
| 232 |
+
|
| 233 |
+
<div class="contactbox editonly srchbox" id="songbox">
|
| 234 |
+
<h2>Profile Song</h2>
|
| 235 |
+
<input id="srchin" placeholder="Search any song…" autocomplete="off" />
|
| 236 |
+
<div id="srchres"></div>
|
| 237 |
+
</div>
|
| 238 |
+
|
| 239 |
+
<div class="contactbox editonly" id="layoutbox">
|
| 240 |
+
<h2>Pick a Layout</h2>
|
| 241 |
+
<div class="layoutchips" id="layoutchips"></div>
|
| 242 |
+
<textarea class="csspaste" id="csspaste" placeholder="…or paste your own layout code (CSS only — no scripts, no imports)"></textarea>
|
| 243 |
+
<div style="padding:0 10px 8px"><button class="btn2004" id="cssapply">Apply Code</button></div>
|
| 244 |
+
</div>
|
| 245 |
+
</div>
|
| 246 |
+
|
| 247 |
+
<main class="col-right">
|
| 248 |
+
<div class="netbanner"><h2 id="netbanner"></h2></div>
|
| 249 |
+
|
| 250 |
+
<div class="blog" id="blog"></div>
|
| 251 |
+
|
| 252 |
+
<section class="blurbs">
|
| 253 |
+
<div class="mainhead"><h2 id="blurbh"></h2></div>
|
| 254 |
+
<h3>About me:</h3>
|
| 255 |
+
<p id="aboutme" data-ek="aboutMe" data-ph="Tell the world. This is your corner of it."></p>
|
| 256 |
+
<h3>Who I'd like to meet:</h3>
|
| 257 |
+
<p id="meet" data-ek="meet" data-ph="People who educate, inspire, or entertain."></p>
|
| 258 |
+
</section>
|
| 259 |
+
|
| 260 |
+
<div class="player" id="player" style="display:none">
|
| 261 |
+
<button id="songbtn" aria-label="Play">▶</button>
|
| 262 |
+
<span class="viz" id="songviz" aria-hidden="true"></span>
|
| 263 |
+
<div class="tt"><b id="songt"></b> · <span id="songa"></span></div>
|
| 264 |
+
</div>
|
| 265 |
+
|
| 266 |
+
<section class="friends">
|
| 267 |
+
<div class="mainhead"><h2 id="friendh"></h2></div>
|
| 268 |
+
<p class="count" id="friendcount"></p>
|
| 269 |
+
<div class="friendgrid" id="friendgrid"></div>
|
| 270 |
+
<div class="contactbox editonly doorform" id="doorform">
|
| 271 |
+
<h2>Add to Top 8</h2>
|
| 272 |
+
<input id="doorlink" placeholder="Paste a friend's space link (or any link)" autocomplete="off" />
|
| 273 |
+
<input id="doorname" placeholder="Their name" autocomplete="off" />
|
| 274 |
+
<div style="padding:0 10px 8px"><button class="btn2004" id="dooradd">Add Friend</button></div>
|
| 275 |
+
</div>
|
| 276 |
+
<p class="viewall"><a id="viewall"></a></p>
|
| 277 |
+
</section>
|
| 278 |
+
|
| 279 |
+
<section class="comments">
|
| 280 |
+
<div class="mainhead"><h2 id="commenth"></h2></div>
|
| 281 |
+
<p class="ccount" id="ccount"></p>
|
| 282 |
+
<div id="commentrows"></div>
|
| 283 |
+
<p class="addcomment"><a id="addcomment">Add Comment</a></p>
|
| 284 |
+
</section>
|
| 285 |
+
</main>
|
| 286 |
+
</div>
|
| 287 |
+
|
| 288 |
+
<footer class="ftr">
|
| 289 |
+
<a id="fabout">About</a> | <a id="ffaq">FAQ</a> | <a id="fterms">Terms</a> | <a id="fprivacy">Privacy</a> |
|
| 290 |
+
<a id="fsafety">Safety Tips</a> | <a id="fcontact">Contact</a> | <a id="fpromote">Promote!</a> | <a id="fnew">Start a blank space</a>
|
| 291 |
+
<small>©2003-2026 your space. the page is a κ — the link is the whole thing. no account, no app, no server.</small>
|
| 292 |
+
</footer>
|
| 293 |
+
</div>
|
| 294 |
+
|
| 295 |
+
<div id="cta"></div>
|
| 296 |
+
<div id="picker"><div class="grid" id="emojis"></div><input id="avurl" placeholder="…or paste an image URL" autocomplete="off" /></div>
|
| 297 |
+
<div id="nest"><div class="nestbar"><div class="crumbs" id="crumbs"></div><button class="nclose" id="nclose" aria-label="close">Close ✕</button></div><div class="nestframes" id="nestframes"></div></div>
|
| 298 |
+
<div id="toast"></div>
|
| 299 |
+
<audio id="audio"></audio>
|
| 300 |
+
<style id="usercss"></style>
|
| 301 |
+
|
| 302 |
+
<script>
|
| 303 |
+
/* pre-paint (boot-ground): name + the visitor's layout code land BEFORE the module, so a
|
| 304 |
+
glitter page NEVER flashes default first. Decode + the same fail-closed CSS refusal —
|
| 305 |
+
no trust decisions beyond "is this lawful CSS"; the module re-derives κ and owns behaviour. */
|
| 306 |
+
(function () {
|
| 307 |
+
try {
|
| 308 |
+
var m = location.hash.match(/#p=v[23]\.([A-Za-z0-9_-]+)/);
|
| 309 |
+
var p = m ? JSON.parse(atob(m[1].replace(/-/g, "+").replace(/_/g, "/").padEnd(Math.ceil(m[1].length / 4) * 4, "="))) : null;
|
| 310 |
+
if (p && p.kind === "profile") {
|
| 311 |
+
document.getElementById("name").textContent = p.name || "";
|
| 312 |
+
var css = String(p.customCss || "");
|
| 313 |
+
if (css && css.length <= 32768 && !/[<]|@import|expression\s*\(|behavior\s*:|javascript\s*:|url\(\s*['"]?\s*(?!data:|https:)[a-z]/i.test(css))
|
| 314 |
+
document.getElementById("usercss").textContent = css;
|
| 315 |
+
}
|
| 316 |
+
} catch (e) { /* refused → default skin */ }
|
| 317 |
+
})();
|
| 318 |
+
</script>
|
| 319 |
+
|
| 320 |
+
<script type="module">
|
| 321 |
+
import * as YS from "./holo-yourspace.mjs";
|
| 322 |
+
|
| 323 |
+
const OS = "https://hologram-technologies.github.io/Q";
|
| 324 |
+
const $ = (id) => document.getElementById(id);
|
| 325 |
+
const esc = (s) => String(s || "").replace(/[&<>"']/g, (c) => ({ "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }[c]));
|
| 326 |
+
const ME_KEY = "holo-yourspace.me.v2"; // key stable across versions; payload self-describes
|
| 327 |
+
const EMOJIS = ["🙂","😎","🛰️","🪐","🌸","🔥","🌊","🌙","⚡","🎧","🎮","🐉","🦋","🌵","👾","✨"];
|
| 328 |
+
const SITE = OS + "/apps/yourspace/"; // canonical public home of this app
|
| 329 |
+
|
| 330 |
+
/* ── Two guest skins, MySpace anatomy kept, restyled to feel like home. Pure CSS, zero
|
| 331 |
+
external hosts, fail-closed-clean (no <, no @import, no scripts). ─────────────────── */
|
| 332 |
+
const SKIN_OPENAI =
|
| 333 |
+
":root{--ms-blue:#000;--ms-band:#000;--ms-label:#f2f2f3;--ms-cell:#fafafa;--ms-labeltext:#0d0d0d;" +
|
| 334 |
+
"--ms-orange:#10a37f;--ms-orangeband:#eef8f4;--ms-cth:#10a37f;--ms-ctd:#f7faf9;--ms-red:#10a37f;--ms-page:#fff;--ms-bg:#ececec}" +
|
| 335 |
+
"body{background:#ececec}a{color:#10a37f}a:hover{color:#0a7f63}.mainhead h2,.blurbs h3{color:#10a37f}.comments th{color:#fff}";
|
| 336 |
+
const SKIN_GEFORCE =
|
| 337 |
+
":root{--ms-blue:#76b900;--ms-band:#111;--ms-label:#141414;--ms-cell:#0d0d0d;--ms-labeltext:#76b900;" +
|
| 338 |
+
"--ms-orange:#76b900;--ms-orangeband:#0f1a00;--ms-cth:#1a2a00;--ms-ctd:#0d0d0d;--ms-red:#9fe000;--ms-page:#0b0b0b;--ms-bg:#000}" +
|
| 339 |
+
"body{background:#000}.master{background:#0b0b0b}h1,h2,h3,p,li,td,th,div,span,b{color:#c8f078}" +
|
| 340 |
+
"a{color:#76b900}a:hover{color:#9fe000}.navbar{background:#111;border-bottom:1px solid #76b900}.hdr{background:#0b0b0b;border-bottom:1px solid #1a2a00}" +
|
| 341 |
+
"table.side th{background:#141414}table.side td.v{background:#0d0d0d}.comments th{background:#1a2a00}.comments td{background:#0d0d0d}" +
|
| 342 |
+
".mainhead{background:#0f1a00}.player{background:#0f1a00;border-color:#76b900}";
|
| 343 |
+
|
| 344 |
+
/* ── A3: Tom = Q — the seed page, beat for beat ─────────────────────────────────────── */
|
| 345 |
+
const SEED = YS.identity({
|
| 346 |
+
v: 3, name: "Q", headline: '":-)"', avatar: "🪐", accent: "#7c6cf0",
|
| 347 |
+
mood: { emo: ":-)", word: "helpful" },
|
| 348 |
+
demog: { gender: "Bot", age: "∞ years old", city: "Inside the seed,", region: "HOLOGRAM", country: "The Internet" },
|
| 349 |
+
interests: { general: "Helping you move in. Links that carry whole worlds. Pages nobody can take down.",
|
| 350 |
+
music: "Everything, at once. Tap my song.", movies: "The Matrix (obviously)", television: "Tuned out.",
|
| 351 |
+
books: "The κ-closure, cover to cover", heroes: "Tom." },
|
| 352 |
+
details: { status: "Here to help", hereFor: "Friends", hometown: "myspace.com/tom", occupation: "Your Space" },
|
| 353 |
+
blurbs: {
|
| 354 |
+
aboutMe: "I'm here to help you with your Space. Fork me and you're home.\n\nThis whole page — the layout, the song, the Top 8 — travels inside ONE link. No account, no app, no server. Post your link anywhere and anyone steps straight into your world.",
|
| 355 |
+
meet: "People who educate, inspire, or entertain. And anyone who misses their old page.",
|
| 356 |
+
},
|
| 357 |
+
blog: [{ title: "why your page is a κ now", link: "https://hologram-technologies.github.io/" }],
|
| 358 |
+
song: { title: "Space Oddity", artist: "David Bowie", query: "david bowie space oddity", art: "", preview: "" },
|
| 359 |
+
top: [{ name: "Q", link: OS, photo: "🪐" }, { name: "HOLOGRAM", link: "https://hologram-technologies.github.io/", photo: "✨" }],
|
| 360 |
+
wall: "", layout: "", customCss: "", via: null,
|
| 361 |
+
});
|
| 362 |
+
|
| 363 |
+
/* ── Two famous seeds. Each boots by its short name-link (#who=sam / #who=jensen) baked
|
| 364 |
+
into this one static file — no server, nothing to take down. Their Top-8 doors point at
|
| 365 |
+
each other, so each one's whole page opens live inside the other, forever. ─────────── */
|
| 366 |
+
const SEED_SAM = YS.identity({
|
| 367 |
+
v: 3, name: "Sam", headline: '"i think this is going to be great"', avatar: "🍓", accent: "#10a37f",
|
| 368 |
+
mood: { emo: "🍓", word: "feeling the AGI" },
|
| 369 |
+
demog: { gender: "Founder", age: "41 years old", city: "San Francisco,", region: "California", country: "Earth (for now)" },
|
| 370 |
+
interests: {
|
| 371 |
+
general: "Energy that never runs out, and lives that last a lot longer. I back a bunch of it.",
|
| 372 |
+
music: "whatever's playing while the model trains",
|
| 373 |
+
movies: "Her. Ex Machina. Oppenheimer — we share a birthday, April 22.",
|
| 374 |
+
television: "the progress bar",
|
| 375 |
+
books: "David Deutsch, The Beginning of Infinity. And 'We Are Legion (We Are Bob).'",
|
| 376 |
+
heroes: "the researchers. and whoever's running the GPUs → check my Top 8." },
|
| 377 |
+
details: { status: "married to Oliver", hereFor: "the future, and friends", hometown: "St. Louis → Stanford (dropped out)",
|
| 378 |
+
zodiac: "Taurus", smokeDrink: "vegetarian", children: "",
|
| 379 |
+
education: "Stanford, briefly", occupation: "CEO, OpenAI. Built a social network at 19, so this is a homecoming." },
|
| 380 |
+
blurbs: {
|
| 381 |
+
aboutMe: "Hi, I'm Sam. When I was 8 I took apart a Macintosh just to see how it worked. At 19 I built a social network called Loopt — so a page like this feels like coming home.\n\nNow I spend my days trying to make sure the future goes well. Optimistic about almost everything. I keep a little gold and a patch of land in Big Sur, just in case — but mostly I think it's going to be great.\n\nThis whole page has no server. It lives inside one link, and nobody can take it down.",
|
| 382 |
+
meet: "People building the future a little faster than is comfortable. Especially anyone with a few hundred thousand spare GPUs. Jensen's in my Top 8 — tap him and his whole page opens right inside this one." },
|
| 383 |
+
blog: [{ title: "The Merge — where people and machines meet", link: "https://blog.samaltman.com/the-merge" }],
|
| 384 |
+
song: { title: "Harder, Better, Faster, Stronger", artist: "Daft Punk", query: "daft punk harder better faster stronger", art: "", preview: "" },
|
| 385 |
+
top: [
|
| 386 |
+
{ name: "Jensen", link: SITE + "#who=jensen", photo: "🧥" },
|
| 387 |
+
{ name: "OpenAI", link: "https://openai.com", photo: "🌀" },
|
| 388 |
+
{ name: "Oppenheimer", link: "https://en.wikipedia.org/wiki/J._Robert_Oppenheimer", photo: "💥" },
|
| 389 |
+
{ name: "David Deutsch", link: "https://en.wikipedia.org/wiki/David_Deutsch", photo: "♾️" },
|
| 390 |
+
{ name: "Helion", link: "https://www.helionenergy.com/", photo: "☀️" },
|
| 391 |
+
{ name: "Q", link: OS, photo: "🪐" }],
|
| 392 |
+
wall: "", layout: "", customCss: SKIN_OPENAI, via: null,
|
| 393 |
+
});
|
| 394 |
+
|
| 395 |
+
const SEED_JENSEN = YS.identity({
|
| 396 |
+
v: 3, name: "Jensen", headline: '"the more you buy, the more you save"', avatar: "🧥", accent: "#76b900",
|
| 397 |
+
mood: { emo: "🟢", word: "30 days from going out of business" },
|
| 398 |
+
demog: { gender: "Founder", age: "63 years old", city: "Santa Clara,", region: "California", country: "Accelerated Computing" },
|
| 399 |
+
interests: {
|
| 400 |
+
general: "Making the impossible run fast. Also: cooking, and my whiteboard.",
|
| 401 |
+
music: "the hum of a datacenter at full tilt",
|
| 402 |
+
movies: "anything my chips helped render",
|
| 403 |
+
television: "my own keynotes, ideally from the kitchen",
|
| 404 |
+
books: "whatever's on the whiteboard. I erase it every morning.",
|
| 405 |
+
heroes: "Grace Hopper — I named a chip after her. And whoever's building the demand → Top 8." },
|
| 406 |
+
details: { status: "40 years married", hereFor: "friends, and design wins", hometown: "Tainan, Taiwan → Oregon",
|
| 407 |
+
zodiac: "Aquarius", smokeDrink: "cheap Denny's coffee, black", children: "",
|
| 408 |
+
education: "Oregon State, then Stanford", occupation: "Founder & CEO, NVIDIA. Started it in a Denny's booth in 1993." },
|
| 409 |
+
blurbs: {
|
| 410 |
+
aboutMe: "I started at 15, washing dishes at a Denny's in Oregon. Bussed tables, cleaned bathrooms, the whole thing. I paid for table-tennis tournaments by scrubbing floors.\n\nIn 1993 I started NVIDIA in a Denny's booth — it was quiet and the coffee was cheap. We were thirty days from going out of business. We've been thirty days from going out of business for thirty-three years. It keeps me sharp.\n\nSame black leather jacket every day. This page has no server — it lives inside one link, and nobody can take it down.",
|
| 411 |
+
meet: "Anyone with a once-in-a-lifetime idea small enough to fit on a whiteboard. And anyone who needs compute — Sam's in my Top 8. Tap him: his whole world opens inside mine, and mine's already inside his." },
|
| 412 |
+
blog: [{ title: "Once In A Lifetime", link: "https://www.nvidia.com/en-us/about-nvidia/" }],
|
| 413 |
+
song: { title: "Sweet Child O' Mine", artist: "Guns N' Roses", query: "guns n roses sweet child o mine", art: "", preview: "" },
|
| 414 |
+
top: [
|
| 415 |
+
{ name: "Sam", link: SITE + "#who=sam", photo: "🍓" },
|
| 416 |
+
{ name: "NVIDIA", link: "https://www.nvidia.com/", photo: "🟢" },
|
| 417 |
+
{ name: "Grace Hopper", link: "https://en.wikipedia.org/wiki/Grace_Hopper", photo: "⚓" },
|
| 418 |
+
{ name: "CUDA", link: "https://developer.nvidia.com/cuda-toolkit", photo: "⚡" },
|
| 419 |
+
{ name: "Denny's", link: "https://www.dennys.com/", photo: "🥞" },
|
| 420 |
+
{ name: "Q", link: OS, photo: "🪐" }],
|
| 421 |
+
wall: "", layout: "", customCss: SKIN_GEFORCE, via: null,
|
| 422 |
+
});
|
| 423 |
+
|
| 424 |
+
/* ── A4-lite: the layout rack — period-exact, pure CSS/data-URIs, zero external hosts ── */
|
| 425 |
+
const LAYOUTS = {
|
| 426 |
+
"Classic": "",
|
| 427 |
+
"Glitter Pink": "body{background:repeating-linear-gradient(45deg,#ffd7ef 0 12px,#ffc2e5 12px 24px)}.master{background:#fff0fa}:root{--ms-band:#ff5fb0;--ms-label:#ffc2e5;--ms-cell:#ffe3f4;--ms-labeltext:#b0006d;--ms-orangeband:#ffc2e5;--ms-orange:#e0007a;--ms-cth:#ff8fd0;--ms-ctd:#ffe3f4;--ms-blue:#c4008a}",
|
| 428 |
+
"Goth": "body{background:#000}.master{background:#0d0d0d;color:#ccc}:root{--ms-band:#8b0000;--ms-label:#1a0000;--ms-cell:#140a0a;--ms-labeltext:#ff4444;--ms-orangeband:#2b0000;--ms-orange:#ff2222;--ms-cth:#8b0000;--ms-ctd:#1c0d0d;--ms-blue:#ff4444;--ms-red:#fff;--ms-page:#0d0d0d}h1,h2,h3,p,li,td,th,div,span{color:#ccc}",
|
| 429 |
+
"Baby Blue": "body{background:#dff1ff}:root{--ms-band:#8fc6f0;--ms-label:#d5ecff;--ms-cell:#ecf7ff;--ms-orangeband:#d5ecff;--ms-orange:#2277bb;--ms-cth:#a8d4f5;--ms-ctd:#ecf7ff}",
|
| 430 |
+
"Zebra": "body{background:repeating-linear-gradient(135deg,#000 0 16px,#fff 16px 32px)}.master{background:#fff}:root{--ms-band:#000;--ms-label:#e8e8e8;--ms-cell:#f7f7f7;--ms-labeltext:#000;--ms-orangeband:#000;--ms-orange:#fff;--ms-cth:#000;--ms-ctd:#eee;--ms-blue:#000}",
|
| 431 |
+
"Matrix": "body{background:#000}.master{background:#020a02;color:#39ff5a}:root{--ms-band:#0a3d0a;--ms-label:#04140 4;--ms-cell:#031003;--ms-labeltext:#39ff5a;--ms-orangeband:#052505;--ms-orange:#39ff5a;--ms-cth:#0a3d0a;--ms-ctd:#031003;--ms-blue:#39ff5a;--ms-page:#020a02}h1,h2,h3,p,li,td,th,div,span{color:#39ff5a}",
|
| 432 |
+
"Flames": "body{background:linear-gradient(180deg,#1a0000,#4d0f00 40%,#993300)}.master{background:#fff7ef}:root{--ms-band:#cc3300;--ms-label:#ffd9b3;--ms-cell:#fff0e0;--ms-labeltext:#992200;--ms-orangeband:#ffb366;--ms-orange:#cc2200;--ms-cth:#ff6600;--ms-ctd:#ffe6cc}",
|
| 433 |
+
"Sunset": "body{background:linear-gradient(180deg,#3d1635,#7a2b3d 45%,#c96f3f)}.master{background:#fff5f0}:root{--ms-band:#b0486a;--ms-label:#ffd9e0;--ms-cell:#fff0f3;--ms-labeltext:#8a2c48;--ms-orangeband:#ffd9c0;--ms-orange:#c2452a;--ms-cth:#e98a5f;--ms-ctd:#ffeadd}",
|
| 434 |
+
"OpenAI": SKIN_OPENAI,
|
| 435 |
+
"GeForce": SKIN_GEFORCE,
|
| 436 |
+
};
|
| 437 |
+
// fix the Matrix typo above at runtime (space in a hex) — fail-closed sanitizer would keep it, so scrub:
|
| 438 |
+
LAYOUTS["Matrix"] = LAYOUTS["Matrix"].replace("#04140 4", "#041404");
|
| 439 |
+
|
| 440 |
+
// L0 (HOLO-SPACE-ALIVE): every nav item is a real verb or it is gone. No "coming soon" toasts.
|
| 441 |
+
// Deleted (no real κ verb yet): Favorites, Forum, Groups, Events, Classifieds. Film/Mail/Videos
|
| 442 |
+
// open the real Hologram OS (a live destination — L4 deep-links + nests them in-page).
|
| 443 |
+
const NAV = [
|
| 444 |
+
["Home", () => goHome()],
|
| 445 |
+
["Browse", () => $("friendh").scrollIntoView({ behavior: "smooth", block: "start" })],
|
| 446 |
+
["Search", () => { $("q").focus(); $("q").scrollIntoView({ behavior: "smooth", block: "center" }); }],
|
| 447 |
+
["Invite", () => share()],
|
| 448 |
+
["Blog", () => $("blog").scrollIntoView({ behavior: "smooth" })],
|
| 449 |
+
["Music", () => playSong(true)],
|
| 450 |
+
["Videos", () => open(OS, "_blank", "noopener")],
|
| 451 |
+
["Mail", () => open(OS, "_blank", "noopener")]];
|
| 452 |
+
|
| 453 |
+
let doc = null, mode = "view", curKappa = "", gestured = false, curWho = "";
|
| 454 |
+
const seedShareLink = () => (curWho ? SITE + curWho + ".html" : ""); // the pretty link that unfurls nicely
|
| 455 |
+
const me = () => { try { return JSON.parse(localStorage.getItem(ME_KEY)); } catch (e) { return null; } };
|
| 456 |
+
const saveMe = (d, l) => localStorage.setItem(ME_KEY, JSON.stringify({ payload: YS.encode(d), link: l }));
|
| 457 |
+
const toast = (msg, ms = 2800) => { const t = $("toast"); t.textContent = msg; t.classList.add("on"); clearTimeout(t._h); t._h = setTimeout(() => t.classList.remove("on"), ms); };
|
| 458 |
+
const myLink = () => location.origin + location.pathname + "#p=v" + doc.v + "." + YS.encode(doc);
|
| 459 |
+
|
| 460 |
+
/* ── L1: infinite holospace nesting ─────────────────────────────────────────────────────
|
| 461 |
+
A space door mounts the friend's world as a full instance of THIS app, in-page. Frames are
|
| 462 |
+
a FLAT stack under the topmost page (every nested frame's parent IS the top), so depth is
|
| 463 |
+
unbounded and cheap. A door tapped inside any frame bubbles up via postMessage; the top owns
|
| 464 |
+
the one stack + breadcrumb. 100% serverless — each frame is just index.html#p=<the friend>. */
|
| 465 |
+
const IN_FRAME = window.parent !== window; // am I mounted inside another space?
|
| 466 |
+
const nstack = []; // [{name, frame}] — top-owned
|
| 467 |
+
const whoOf = (link) => (String(link || "").match(/who=(sam|jensen)/) || [])[1] || "";
|
| 468 |
+
const isSpaceLink = (link) => !!YS.parseLink(link) || !!whoOf(link); // a door that nests in-page
|
| 469 |
+
function frameSrc(link) {
|
| 470 |
+
const w = whoOf(link); if (w) return location.pathname + "#who=" + w; // a famous seed → boot it fresh in-frame
|
| 471 |
+
const payload = YS.parseLink(link); if (!payload) return link;
|
| 472 |
+
let v = 3; try { const p = YS.decode(payload); if (p) v = p.v; } catch (e) {}
|
| 473 |
+
return location.pathname + "#p=v" + v + "." + payload;
|
| 474 |
+
}
|
| 475 |
+
function openSpace(link, name) {
|
| 476 |
+
if (IN_FRAME) { try { parent.postMessage({ holoNest: { link, name } }, location.origin); } catch (e) {} return; }
|
| 477 |
+
pushLayer(link, name);
|
| 478 |
+
}
|
| 479 |
+
function pushLayer(link, name) {
|
| 480 |
+
const frames = $("nestframes");
|
| 481 |
+
[...frames.children].forEach((c) => c.classList.remove("top"));
|
| 482 |
+
const f = document.createElement("iframe");
|
| 483 |
+
f.src = frameSrc(link); f.className = "top"; f.title = name || "space";
|
| 484 |
+
frames.appendChild(f);
|
| 485 |
+
nstack.push({ name: name || "space", frame: f });
|
| 486 |
+
try { $("audio").pause(); $("songbtn").textContent = "▶"; } catch (e) {} // no double song
|
| 487 |
+
renderCrumbs(); $("nest").classList.add("on"); document.body.style.overflow = "hidden";
|
| 488 |
+
}
|
| 489 |
+
function popTo(depth) { // depth 0 = base page → close
|
| 490 |
+
while (nstack.length > depth) nstack.pop().frame.remove();
|
| 491 |
+
if (!nstack.length) return closeNest();
|
| 492 |
+
const top = nstack[nstack.length - 1].frame;
|
| 493 |
+
[...$("nestframes").children].forEach((c) => c.classList.toggle("top", c === top));
|
| 494 |
+
renderCrumbs();
|
| 495 |
+
}
|
| 496 |
+
function closeNest() { nstack.length = 0; $("nestframes").innerHTML = ""; $("nest").classList.remove("on"); document.body.style.overflow = ""; }
|
| 497 |
+
function renderCrumbs() {
|
| 498 |
+
const c = $("crumbs"); c.innerHTML = "";
|
| 499 |
+
const crumb = (label, depth, here) => { const s = document.createElement("span"); s.className = "crumb" + (here ? " here" : "");
|
| 500 |
+
s.textContent = label; if (!here) s.onclick = () => popTo(depth); return s; };
|
| 501 |
+
c.appendChild(crumb((doc && doc.name) || "Home", 0, false));
|
| 502 |
+
nstack.forEach((l, i) => { const sep = document.createElement("span"); sep.className = "sepc"; sep.textContent = "›"; c.appendChild(sep);
|
| 503 |
+
c.appendChild(crumb(l.name, i + 1, i === nstack.length - 1)); });
|
| 504 |
+
c.scrollLeft = c.scrollWidth;
|
| 505 |
+
}
|
| 506 |
+
if (!IN_FRAME) addEventListener("message", (e) => {
|
| 507 |
+
if (e.origin !== location.origin) return; // only our own frames may drive nesting
|
| 508 |
+
const d = e.data; if (d && d.holoNest && d.holoNest.link) pushLayer(d.holoNest.link, d.holoNest.name);
|
| 509 |
+
});
|
| 510 |
+
addEventListener("keydown", (e) => { if (e.key === "Escape" && nstack.length) popTo(nstack.length - 1); });
|
| 511 |
+
$("nclose").onclick = closeNest;
|
| 512 |
+
|
| 513 |
+
function boot() {
|
| 514 |
+
curWho = (location.hash.match(/who=(sam|jensen)/) || location.search.match(/who=(sam|jensen)/) || [])[1] || "";
|
| 515 |
+
if (curWho && !/#p=/.test(location.hash)) return show(curWho === "sam" ? SEED_SAM : SEED_JENSEN, "view");
|
| 516 |
+
const payload = YS.parseLink(location.hash);
|
| 517 |
+
if (payload) { const p = YS.decode(payload); if (p) return show(YS.upgrade(p), "view"); }
|
| 518 |
+
const m = me();
|
| 519 |
+
if (m && m.payload) { const p = YS.decode(m.payload); if (p) { const u = YS.upgrade(p); history.replaceState(null, "", "#p=v" + u.v + "." + YS.encode(u)); return show(u, "view"); } }
|
| 520 |
+
history.replaceState(null, "", location.pathname + location.search);
|
| 521 |
+
show(SEED, "view", true);
|
| 522 |
+
}
|
| 523 |
+
addEventListener("hashchange", boot);
|
| 524 |
+
|
| 525 |
+
/* ── render: the doc IS the page; view and edit are the same anatomy ────────────────── */
|
| 526 |
+
async function show(p, m, isSeed = false) {
|
| 527 |
+
doc = YS.upgrade(p); mode = m;
|
| 528 |
+
document.body.classList.toggle("edit", mode === "edit");
|
| 529 |
+
$("usercss").textContent = doc.customCss || "";
|
| 530 |
+
const first = (doc.name || "Your").split(/\s+/)[0];
|
| 531 |
+
|
| 532 |
+
// nav (once)
|
| 533 |
+
if (!$("navbar").childElementCount) NAV.forEach(([label, fn], i) => {
|
| 534 |
+
if (i) { const s = document.createElement("span"); s.className = "sep"; s.textContent = "|"; $("navbar").appendChild(s); }
|
| 535 |
+
const a = document.createElement("a"); a.textContent = label; a.onclick = fn; $("navbar").appendChild(a);
|
| 536 |
+
});
|
| 537 |
+
|
| 538 |
+
// left column
|
| 539 |
+
$("name").textContent = doc.name;
|
| 540 |
+
$("headline").textContent = doc.headline;
|
| 541 |
+
$("avatar").innerHTML = /^(https:\/\/|data:image\/)/.test(doc.avatar) ? `<img src="${esc(doc.avatar)}" alt="">` : (esc(doc.avatar) || (mode === "edit" ? "+" : "🪐"));
|
| 542 |
+
for (const k of ["gender", "age", "city", "region", "country"]) $("d-" + k).textContent = doc.demog[k];
|
| 543 |
+
$("moodemo").textContent = doc.mood.emo; $("moodword").textContent = doc.mood.word;
|
| 544 |
+
const owner = !!(me() && me().payload === YS.encode(doc));
|
| 545 |
+
// honest presence: only the owner is provably online (they're holding the page); visitors see no invented row
|
| 546 |
+
$("lastlogin").textContent = owner ? ("Last Login: " + new Date().toLocaleDateString()) : "";
|
| 547 |
+
$("online").style.display = owner ? "" : "none";
|
| 548 |
+
|
| 549 |
+
$("contacth").textContent = "Contacting " + (doc.name || "this space");
|
| 550 |
+
// L0: real verbs + honest explainers only. Deleted fakes: Add to Favorites, Add to Group.
|
| 551 |
+
// Block/Report state a TRUE property of a κ page (it can't track or be edited by anyone but
|
| 552 |
+
// its owner) — that is honest content, not a "coming soon" stub. Instant Message → L3 (AIM).
|
| 553 |
+
const CONTACT = [
|
| 554 |
+
["✉️", "Send Message", () => doc.wall ? open(doc.wall, "_blank", "noopener") : open(OS, "_blank", "noopener")],
|
| 555 |
+
["↪️", "Forward to Friend", share],
|
| 556 |
+
["➕", "Add to Friends", addToFriends],
|
| 557 |
+
["💬", "Instant Message", () => open(OS, "_blank", "noopener")],
|
| 558 |
+
["🚫", "Block User", () => toast("Nothing to block — a κ page can't follow or track anyone. To leave, just close it.")],
|
| 559 |
+
["🏳️", "Report", () => toast("A κ page can't be edited by anyone but its owner. Concerns? Tell whoever sent you the link.")],
|
| 560 |
+
];
|
| 561 |
+
$("contactgrid").innerHTML = "";
|
| 562 |
+
CONTACT.forEach(([g, label, fn]) => { const a = document.createElement("a"); a.textContent = g + " " + label; a.onclick = fn; $("contactgrid").appendChild(a); });
|
| 563 |
+
|
| 564 |
+
const shareUrl = seedShareLink() || (location.hash.includes("#p=") ? location.href : "");
|
| 565 |
+
$("thelink").textContent = shareUrl || "mint your link with Make It Mine ↓";
|
| 566 |
+
$("thelink").onclick = async () => { try { await navigator.clipboard.writeText(shareUrl || location.href); toast("Link copied — no server behind it, nobody can take it down 💫"); } catch (e) {} };
|
| 567 |
+
$("kap").textContent = "κ…";
|
| 568 |
+
try { curKappa = await YS.kappa(doc); $("kap").textContent = "κ·" + YS.hexOf(curKappa).slice(0, 10) + " — tap to verify"; } catch (e) { $("kap").textContent = "κ offline"; }
|
| 569 |
+
|
| 570 |
+
sideTable("interests", first + "'s Interests", [["General", "general"], ["Music", "music"], ["Movies", "movies"], ["Television", "television"], ["Books", "books"], ["Heroes", "heroes"]], doc.interests, "eki");
|
| 571 |
+
sideTable("details", first + "'s Details", [["Status", "status"], ["Here for", "hereFor"], ["Hometown", "hometown"], ["Zodiac Sign", "zodiac"], ["Smoke / Drink", "smokeDrink"], ["Children", "children"], ["Education", "education"], ["Occupation", "occupation"]], doc.details, "ekd");
|
| 572 |
+
|
| 573 |
+
// right column
|
| 574 |
+
const viewer = me();
|
| 575 |
+
$("netbanner").textContent = owner ? "This is your space — you're home."
|
| 576 |
+
: viewer ? (doc.name || "This space") + " is in your extended network"
|
| 577 |
+
: (doc.name || "This space") + " is one tap away from being your network";
|
| 578 |
+
const blog = $("blog"); blog.innerHTML = "";
|
| 579 |
+
if (doc.blog.length) {
|
| 580 |
+
blog.innerHTML = `<p><b>${esc(first)}'s Latest Blog Entry</b> <a>[Subscribe to this Blog]</a></p>` +
|
| 581 |
+
doc.blog.map((b) => `<p><a href="${esc(b.link)}" target="_blank" rel="noopener">${esc(b.title)}</a></p>`).join("");
|
| 582 |
+
}
|
| 583 |
+
$("blurbh").textContent = first + "'s Blurbs";
|
| 584 |
+
$("aboutme").textContent = doc.blurbs.aboutMe; $("meet").textContent = doc.blurbs.meet;
|
| 585 |
+
|
| 586 |
+
const s = doc.song; $("player").style.display = s ? "" : "none";
|
| 587 |
+
if (s) { $("songt").textContent = s.title; $("songa").textContent = s.artist; }
|
| 588 |
+
|
| 589 |
+
$("friendh").textContent = first + "'s Friend Space";
|
| 590 |
+
$("friendcount").innerHTML = `${esc(doc.name || "This space")} has <span class="focus">${doc.top.length}</span> friend${doc.top.length === 1 ? "" : "s"}.`;
|
| 591 |
+
const fg = $("friendgrid"); fg.innerHTML = "";
|
| 592 |
+
doc.top.forEach((d, i) => {
|
| 593 |
+
const isSpace = isSpaceLink(d.link);
|
| 594 |
+
const fig = document.createElement("figure");
|
| 595 |
+
fig.innerHTML = `<div class="face${isSpace ? " doorspace" : ""}">${/^https:\/\//.test(d.photo) ? `<img src="${esc(d.photo)}" alt="">` : (esc(d.photo) || esc((d.name || "•")[0].toUpperCase()))}</div><figcaption><a>${esc(d.name || "friend")}</a></figcaption><button class="rm" aria-label="remove">×</button>`;
|
| 596 |
+
// L1: a space door NESTS the friend's world in-page (infinite depth); anything else opens out.
|
| 597 |
+
fig.onclick = (ev) => { if (ev.target.className === "rm") return commit(YS.removeDoor(doc, i));
|
| 598 |
+
if (isSpace) return openSpace(d.link, d.name || "space"); open(d.link, "_blank", "noopener"); };
|
| 599 |
+
fg.appendChild(fig);
|
| 600 |
+
});
|
| 601 |
+
$("viewall").textContent = "View All of " + first + "'s Friends";
|
| 602 |
+
$("viewall").onclick = () => toast(doc.top.length ? doc.top.map((d) => d.name || "friend").join(" · ") : "No friends yet — that's what forking is for");
|
| 603 |
+
|
| 604 |
+
$("commenth").textContent = first + "'s Friends Comments";
|
| 605 |
+
$("ccount").innerHTML = doc.wall
|
| 606 |
+
? `Comments live in <b>${esc(first)}'s sealed wall</b> — step in to read and write. Honest number: only the room knows.`
|
| 607 |
+
: `Displaying <b>0</b> of <b>0</b> comments — this wall isn't open yet.`;
|
| 608 |
+
$("commentrows").innerHTML = doc.wall ? "" : `<table><tr><th>${esc(first)}<br><div style="font-size:30px">${esc(doc.avatar) || "🪐"}</div></th><td><b>${new Date().toLocaleDateString()}</b><br><br>Your wall opens when you weld a sealed room to this page. Until then: real numbers only — this page never invents a comment.</td></tr></table>`;
|
| 609 |
+
$("addcomment").onclick = () => doc.wall ? open(doc.wall, "_blank") : toast(owner ? "Weld a room link into your wall field (rooms are live in the messenger)" : "This wall isn't open yet — fork the page and open your own");
|
| 610 |
+
|
| 611 |
+
// hint + CTA
|
| 612 |
+
$("hint").classList.toggle("on", isSeed);
|
| 613 |
+
if (isSeed) $("hint").innerHTML = "👋 <b>Welcome back.</b> This is Q's page — same page your thumbs remember, except it lives inside the link itself. <b>Make It Mine</b> below ↓";
|
| 614 |
+
const cta = $("cta"); cta.innerHTML = "";
|
| 615 |
+
const btn = (label, cls, fn) => { const b = document.createElement("button"); b.className = "btn2004 " + cls; b.textContent = label; b.onclick = fn; cta.appendChild(b); };
|
| 616 |
+
if (mode === "edit") btn("Done — mint my link", "go", finish);
|
| 617 |
+
else if (owner) { btn("Edit My Space", "", () => show(doc, "edit")); btn("Share", "go", share); }
|
| 618 |
+
else { btn("✨ Make It Mine", "go", makeItMine); btn("Share", "", share); }
|
| 619 |
+
|
| 620 |
+
renderEditRacks();
|
| 621 |
+
wireEditables();
|
| 622 |
+
maybeAutoplay(); // song starts on open where the browser allows; else on first gesture
|
| 623 |
+
}
|
| 624 |
+
|
| 625 |
+
function sideTable(id, title, rows, data, ekAttr) {
|
| 626 |
+
const tb = $(id).querySelector("tbody"); tb.innerHTML = "";
|
| 627 |
+
const live = rows.filter(([, k]) => data[k] || mode === "edit");
|
| 628 |
+
$(id).style.display = live.length ? "" : "none";
|
| 629 |
+
if (!live.length) return;
|
| 630 |
+
tb.innerHTML = `<tr class="h2row"><td colspan="2">${esc(title)}</td></tr>` +
|
| 631 |
+
live.map(([label, k]) => `<tr><th>${esc(label)}</th><td class="v" data-${ekAttr}="${k}" data-ph="…">${esc(data[k])}</td></tr>`).join("");
|
| 632 |
+
}
|
| 633 |
+
|
| 634 |
+
/* ── the loop ────────────────────────────────────────────────────────────────────────── */
|
| 635 |
+
async function makeItMine() {
|
| 636 |
+
let mine;
|
| 637 |
+
try { mine = await YS.fork(doc, location.hash.includes("#p=") ? location.href : location.origin + location.pathname); }
|
| 638 |
+
catch (e) { mine = YS.upgrade(doc); mine = YS.withFields(mine, { name: "", via: { k: "", name: doc.name } }); }
|
| 639 |
+
toast("It's yours. Decorate, then mint your link ✨");
|
| 640 |
+
show(mine, "edit");
|
| 641 |
+
scrollTo({ top: 0, behavior: "smooth" });
|
| 642 |
+
}
|
| 643 |
+
async function addToFriends() { // 2004 "Add to Friends" = put THIS page in MY Top 8
|
| 644 |
+
const m = me();
|
| 645 |
+
if (!m) return makeItMine();
|
| 646 |
+
const my = YS.upgrade(YS.decode(m.payload));
|
| 647 |
+
const updated = YS.addDoor(my, { name: doc.name || "friend", link: location.href, photo: doc.avatar });
|
| 648 |
+
saveMe(updated, m.link);
|
| 649 |
+
toast((doc.name || "This space") + " added to your Top 8 ✔ — friendship is mutual when they add you back");
|
| 650 |
+
}
|
| 651 |
+
function commit(next) { doc = YS.identity(next); show(doc, mode); }
|
| 652 |
+
|
| 653 |
+
function collectEdits() {
|
| 654 |
+
const g = {}; for (const k of ["gender", "age", "city", "region", "country"]) g[k] = $("d-" + k).textContent.trim();
|
| 655 |
+
const interests = {}, details = {};
|
| 656 |
+
document.querySelectorAll("[data-eki]").forEach((el) => interests[el.dataset.eki] = el.textContent.trim());
|
| 657 |
+
document.querySelectorAll("[data-ekd]").forEach((el) => details[el.dataset.ekd] = el.textContent.trim());
|
| 658 |
+
return YS.withFields(doc, {
|
| 659 |
+
name: $("name").textContent.trim(), headline: $("headline").textContent.trim(),
|
| 660 |
+
mood: { emo: $("moodemo").textContent.trim(), word: $("moodword").textContent.trim() },
|
| 661 |
+
demog: g, interests: { ...doc.interests, ...interests }, details: { ...doc.details, ...details },
|
| 662 |
+
blurbs: { aboutMe: $("aboutme").textContent.trim(), meet: $("meet").textContent.trim() },
|
| 663 |
+
});
|
| 664 |
+
}
|
| 665 |
+
async function finish() {
|
| 666 |
+
doc = collectEdits();
|
| 667 |
+
saveMe(doc, myLink());
|
| 668 |
+
history.replaceState(null, "", "#p=v" + doc.v + "." + YS.encode(doc));
|
| 669 |
+
await show(doc, "view");
|
| 670 |
+
toast("Minted. The URL box on the left IS your page — copy it, post it anywhere.");
|
| 671 |
+
share();
|
| 672 |
+
}
|
| 673 |
+
async function share() {
|
| 674 |
+
const url = seedShareLink() || location.href;
|
| 675 |
+
const title = (doc.name ? doc.name + "'s" : "my") + " space";
|
| 676 |
+
try { if (navigator.share) return await navigator.share({ title, text: "step into " + title, url }); } catch (e) { if (e.name === "AbortError") return; }
|
| 677 |
+
try { await navigator.clipboard.writeText(url); toast("Link copied — drop it in any chat 💫"); }
|
| 678 |
+
catch (e) { prompt("Copy your space link:", url); }
|
| 679 |
+
}
|
| 680 |
+
function goHome() { const m = me(); if (m && m.link) location.assign(m.link); else { location.hash = ""; } }
|
| 681 |
+
|
| 682 |
+
/* ── edit affordances ───────────────────────────────────────────────────────────────── */
|
| 683 |
+
function wireEditables() {
|
| 684 |
+
const on = mode === "edit";
|
| 685 |
+
document.querySelectorAll("[data-ek],[data-eki],[data-ekd],[data-ekg]").forEach((el) => { el.contentEditable = on ? "plaintext-only" : "false"; });
|
| 686 |
+
}
|
| 687 |
+
function renderEditRacks() {
|
| 688 |
+
const rack = $("layoutchips"); rack.innerHTML = "";
|
| 689 |
+
Object.keys(LAYOUTS).forEach((name) => { const b = document.createElement("button"); b.className = "btn2004"; b.textContent = name;
|
| 690 |
+
b.onclick = () => { commit(YS.withFields(collectEdits(), { customCss: LAYOUTS[name] })); toast(name + " layout on — via the rack, free forever"); }; rack.appendChild(b); });
|
| 691 |
+
$("csspaste").value = doc.customCss || "";
|
| 692 |
+
}
|
| 693 |
+
$("cssapply").onclick = () => {
|
| 694 |
+
const clean = YS.sanitizeCss($("csspaste").value);
|
| 695 |
+
if ($("csspaste").value.trim() && !clean) return toast("Code refused — CSS only: no <, no @import, no scripts, urls must be data:/https:");
|
| 696 |
+
commit(YS.withFields(collectEdits(), { customCss: clean }));
|
| 697 |
+
toast(clean ? "Your code is live on your page ✨" : "Back to the classic skin");
|
| 698 |
+
};
|
| 699 |
+
$("avatar").onclick = () => { if (mode !== "edit") return; const p = $("picker"); p.classList.toggle("on");
|
| 700 |
+
const g = $("emojis"); if (!g.childElementCount) EMOJIS.forEach((e) => { const b = document.createElement("button"); b.textContent = e;
|
| 701 |
+
b.onclick = () => { p.classList.remove("on"); commit(YS.withFields(collectEdits(), { avatar: e })); }; g.appendChild(b); }); };
|
| 702 |
+
$("avurl").onchange = () => { $("picker").classList.remove("on"); commit(YS.withFields(collectEdits(), { avatar: $("avurl").value.trim() })); };
|
| 703 |
+
document.addEventListener("click", (e) => { if (!$("picker").contains(e.target) && e.target !== $("avatar")) $("picker").classList.remove("on"); });
|
| 704 |
+
|
| 705 |
+
let srchT = null;
|
| 706 |
+
$("srchin").oninput = () => { clearTimeout(srchT); srchT = setTimeout(async () => {
|
| 707 |
+
const q = $("srchin").value.trim(); const box = $("srchres"); if (!q) { box.innerHTML = ""; return; }
|
| 708 |
+
try {
|
| 709 |
+
const r = await fetch(`https://itunes.apple.com/search?media=music&limit=5&term=${encodeURIComponent(q)}`);
|
| 710 |
+
const js = await r.json(); box.innerHTML = "";
|
| 711 |
+
(js.results || []).forEach((t) => { const d = document.createElement("div"); d.className = "res";
|
| 712 |
+
d.innerHTML = `<img src="${esc(t.artworkUrl100 || "")}" alt=""><div><b>${esc(t.trackName)}</b><br><span>${esc(t.artistName)}</span></div>`;
|
| 713 |
+
d.onclick = () => { commit(YS.withFields(collectEdits(), { song: { title: t.trackName, artist: t.artistName, art: t.artworkUrl100 || "", query: `${t.artistName} ${t.trackName}`, preview: t.previewUrl || "" } })); toast("Song set 🎧 — it plays when someone enters"); };
|
| 714 |
+
box.appendChild(d); });
|
| 715 |
+
} catch (e) { box.innerHTML = `<div class="res">search unreachable — try again later</div>`; }
|
| 716 |
+
}, 350); };
|
| 717 |
+
$("dooradd").onclick = () => { const l = $("doorlink").value.trim(), n = $("doorname").value.trim();
|
| 718 |
+
if (!l) return toast("Paste a link first");
|
| 719 |
+
commit(YS.addDoor(collectEdits(), { name: n || "friend", link: l, photo: "" })); $("doorlink").value = $("doorname").value = ""; };
|
| 720 |
+
|
| 721 |
+
/* ── the song: first gesture starts it (the lawful 2004 autoplay) ───────────────────── */
|
| 722 |
+
// braille equalizer: 4 columns, each a bottom-up ramp at a phase offset — bounces like a VU meter.
|
| 723 |
+
let vizTimer = null;
|
| 724 |
+
const VIZ_RAMP = "⣀⣄⣆⣇⣧⣷⣿⣷⣧⣇⣆⣄", VIZ_OFF = [0, 3, 6, 9];
|
| 725 |
+
const vizFrame = (t) => VIZ_OFF.map((o) => VIZ_RAMP[(t + o) % VIZ_RAMP.length]).join("");
|
| 726 |
+
function setPlaying(on) {
|
| 727 |
+
const btn = $("songbtn"), player = $("player"), v = $("songviz");
|
| 728 |
+
btn.textContent = on ? "❚❚" : "▶"; player.classList.toggle("playing", on);
|
| 729 |
+
if (on) { if (!vizTimer) { let t = 0; v.textContent = vizFrame(0); vizTimer = setInterval(() => { t++; v.textContent = vizFrame(t); }, 110); } }
|
| 730 |
+
else { clearInterval(vizTimer); vizTimer = null; v.textContent = ""; }
|
| 731 |
+
}
|
| 732 |
+
async function playSong(toggle) {
|
| 733 |
+
const s = doc.song; if (!s) return;
|
| 734 |
+
const a = $("audio");
|
| 735 |
+
if (toggle && !a.paused) { a.pause(); setPlaying(false); try { busCmd("pause"); } catch (e) {} return; }
|
| 736 |
+
if (!toggle && !a.paused) return; // already playing — a non-toggle start is a no-op (never restart)
|
| 737 |
+
if (await busCmd("play", [s.query || `${s.artist} ${s.title}`])) { setPlaying(true); toast("Playing in Holo Music 🎶"); return; }
|
| 738 |
+
let src = s.preview;
|
| 739 |
+
if (!src && (s.query || s.title)) { try {
|
| 740 |
+
const r = await fetch(`https://itunes.apple.com/search?media=music&limit=1&term=${encodeURIComponent(s.query || s.artist + " " + s.title)}`);
|
| 741 |
+
src = ((await r.json()).results || [])[0]?.previewUrl || ""; } catch (e) {} }
|
| 742 |
+
if (!src) { if (toggle) toast("Song not reachable right now"); return; }
|
| 743 |
+
a.src = src; try { await a.play(); setPlaying(true); } catch (e) { if (toggle) toast("Tap ▶ to play"); }
|
| 744 |
+
a.onended = () => setPlaying(false);
|
| 745 |
+
a.onpause = () => { if (a.ended || a.currentTime === 0) setPlaying(false); };
|
| 746 |
+
}
|
| 747 |
+
$("songbtn").onclick = () => playSong(true);
|
| 748 |
+
// play on OPEN where the browser's autoplay policy allows (returning visitor / engaged origin);
|
| 749 |
+
// browsers that block autoplay-with-sound fall through to firstGesture (the very next tap/scroll).
|
| 750 |
+
let autoTried = false;
|
| 751 |
+
function maybeAutoplay() { if (autoTried || mode !== "view" || !doc || !doc.song) return; autoTried = true; playSong(false); }
|
| 752 |
+
const firstGesture = () => { if (gestured) return; gestured = true; if (mode === "view" && doc && doc.song) playSong(false); };
|
| 753 |
+
addEventListener("pointerdown", firstGesture, { once: false });
|
| 754 |
+
addEventListener("scroll", firstGesture, { once: true, passive: true });
|
| 755 |
+
|
| 756 |
+
function busCmd(cmd, args = []) {
|
| 757 |
+
return new Promise((res) => { let done = false;
|
| 758 |
+
try { const ch = new BroadcastChannel("holo-music-ctl"); const id = Math.random().toString(36).slice(2);
|
| 759 |
+
ch.onmessage = (e) => { if (e.data && e.data.re === id) { done = true; ch.close(); res(!!e.data.ok); } };
|
| 760 |
+
ch.postMessage({ id, cmd, args }); setTimeout(() => { if (!done) { ch.close(); res(false); } }, 800);
|
| 761 |
+
} catch (e) { res(false); } });
|
| 762 |
+
}
|
| 763 |
+
|
| 764 |
+
$("kap").onclick = async () => { try {
|
| 765 |
+
const ok = await YS.verify(doc, curKappa);
|
| 766 |
+
$("kap").classList.toggle("ok", ok); setTimeout(() => $("kap").classList.remove("ok"), 1600);
|
| 767 |
+
await navigator.clipboard.writeText(curKappa); toast(ok ? "re-derived ✓ · κ copied — the page you see IS the link you share" : "κ MISMATCH — refused");
|
| 768 |
+
} catch (e) { toast("κ unavailable here"); } };
|
| 769 |
+
|
| 770 |
+
$("navsignup").onclick = () => makeItMine();
|
| 771 |
+
$("navhelp").onclick = () => { location.hash = ""; };
|
| 772 |
+
$("qgo").onclick = () => { const v = $("q").value.trim(); const p = YS.parseLink(v); if (p) location.assign(location.pathname + "#p=v" + (YS.decode(p).v) + "." + p); else toast(v ? "Paste a space link to teleport to it" : "Search = paste any space link"); };
|
| 773 |
+
$("fnew").onclick = () => show(YS.identity({ v: 3, name: "", customCss: "" }), "edit");
|
| 774 |
+
["fabout", "ffaq", "fterms", "fprivacy", "fsafety", "fcontact", "fpromote"].forEach((id) => $(id).onclick = () => toast("This page has no company behind it — it's a κ. About: the footer says it all."));
|
| 775 |
+
|
| 776 |
+
boot();
|
| 777 |
+
</script>
|
| 778 |
+
</body>
|
| 779 |
+
</html>
|
sha256/77e482d79563886843cbcfc20379161c34794979ff6dc5ad2e10ab3a3201d6be
ADDED
|
@@ -0,0 +1 @@
|
|
|
|
|
|
|
| 1 |
+
{"@context":["https://www.w3.org/ns/did/v1","https://w3id.org/security/data-integrity/v2",{"dcterms":"http://purl.org/dc/terms/","links":{"@container":"@set","@id":"schema:hasPart"},"prov":"http://www.w3.org/ns/prov#","rel":"schema:additionalType","schema":"https://schema.org/"},{"holstr":"https://hologram.os/ns/strand#"}],"@type":["prov:Entity","holstr:Entry"],"holstr:kind":"release","holstr:op":"did:holo:sha256:87599792c7b13fad9d6c57d3b89d2cef35e4715869f5cde597ab60ca92699f0b","holstr:payload":{"apps":{"carry":"9f44164b17e6b7e37f39623bb445d49b6608da5f2b04cef8b1a8b183362a6b9a","hello":"66c1ada5ac08a2d4f73851bbe7458ad5fb6e2226c5a131c3829abfe715900fed","holo-messenger":"0a65550d027ecaf8ee3e58e6c9221a09c376a3ea4cd8283e6376baeae525bab6","jellyfin":"f5e5604c1c08be8d5833fbf61d4ff2fd563b411443f10fef13ca346df44af1ab","resolve":"23aec66382775f5773693615338f37c37a5f58257ec95aece33a664baa6fe0db","self":"0511772584510f0888d97dd5a72bf986ad6791bd8e305063ddd8a82c39888a70","spaces":"d8aebefb67e7fc7802e757b9a7d95bb881e6d75b4a9bc4bd4227634541757e51","yourspace":"1990a824dea84e1dbcc4f8dd32a7ac1e326f85b7ea1d4db7c7545d29496c5280"},"boot":{"entry":"holo-portal.mjs","sha256":"caeb3e57b6eeab09bee6d67c022145a8e2dae610c929a7f51bc169898625e7e8"},"closure":"83b4a5f512bd5b8cdd11f37c131e6309df3fb4aa09922eda55775d41ac96aae2","manifest":"8bd00282804b748cc852f8ad5fc7a583144ecbbcd715b333421445ed1d6fe3cc","runtime":{"apps/q/pkg/holospaces_web.js":"b9f8a887de588c5193dc65ca9ce206a70c6df53595b848e0ce0299c2d88a5753","apps/q/pkg/holospaces_web_bg.wasm":"9d90b4ea8bccee8c239073c7ec7dd5158c6d11f1f668487570d17475d79e661e","apps/workspace/pkg/holospaces_web.js":"8c30aa5582dffe4548d27fa7863163eba689ed65126be472c003f5884fc8e534","usr/lib/holo/holowhat/holospaces_web.js":"a5b5d9c559a1d2812c33e9d7a4b1c24bb03059482503a23356e4c9c32d4d8b88","usr/lib/holo/holowhat/holospaces_web_bg.wasm":"00cfa4960b319ba1ba7291cddb20dea130a407ce8b42426218854f4f68f4dcd7","usr/lib/pkg/holospaces_web.js":"8c30aa5582dffe4548d27fa7863163eba689ed65126be472c003f5884fc8e534","usr/lib/pkg/holospaces_web_bg.wasm":"3370b22070b56218a57df6406e2e4ba7cc171e942d4d1f2ae4297ea2c4c08d9c"},"shell":"97ca1ee6446f04c1d395d318e759c5a9ffdf4a27c26ef6ce9a5001dc49b2fd70"},"holstr:prev":"did:holo:sha256:03bf55535eb10577ddaa587bfb9310f04813cb1696e4847ed7572259ec342dbc","holstr:seq":247,"prov:generatedAtTime":"2026-07-13T15:47:13.668Z"}
|