diff --git a/README.md b/README.md index f13f15e..334e905 100644 --- a/README.md +++ b/README.md @@ -43,9 +43,13 @@ Bookの閲覧テストはJavaScript無効、ランディングのテストは有 ### ランディング -トップはSVGのルートマークから始まります。クリック・ホイール/タッチスクロール・キー入力のいずれか一回で、約6.2秒のタイムラインを最後まで再生します。追加入力で段階を進めたり、再生を重ねたりはしません。Escapeまたは画面右下のスキップで直ちにデモへ移れます。ブラウザの修飾キー付きショートカットは妨げません。 +トップはSVGのルートマークから始まります。コンテの2はホバー専用の「Tap」表現で、ポインタを離すと消え、待っていても本編には進みません。クリック・ホイール/タッチスクロール・キー入力のいずれか一回で、3〜6を約5.6秒で最後まで再生します。ホバーは再生の前提ではなく、追加入力で段階を進めたり、再生を重ねたりもしません。Escapeまたは画面右下のスキップで直ちにデモへ移れます。ブラウザの修飾キー付きショートカットは妨げません。 + +ツリーとパネルはASCII glitchから確定した文字・罫線へ収束します。ノイズは局所的なセル置換を10Hzで更新し、全画面の点滅は使いません。空白・改行・日本語は保持し、完了/スキップ時には元の文字列を完全に復元します。 - `src/components/Landing.astro` — SVGと、最終的に操作するツリー/パネルの静的HTML。 +- `src/components/BoxFrame.astro` — `┌─┐`・`│`・`└─┘`によるText View/Call resultの枠。CSS borderやSVGで枠を代用せず、幅・高さに合わせて罫線素片をクリップします。JavaScript無効時も表示されます。 +- `src/lib/landing-ascii.mjs` — セル幅を保つ決定的なglitch文字置換。 - `src/scripts/landing.ts` — 単一の`requestAnimationFrame`時計、役割別の速度曲線、等弧長で円をほどくSVG path、ツリー操作。 - `src/lib/landing-demo.ts` — ブラウザ内だけで使うサンプル。外部Hostへの接続、変更操作、通信はありません。Object signatureとInterface signatureを分け、本文は明示的なCallで表示します。 - `src/styles/landing.css` — トップ全体を14pxのmonoフォント・24pxの行高で構成。フレーム幅を4ch単位に揃え、列・ガター・パディングもセルと行の整数倍にします。ツリーはSVGの線ではなく`├──`・`└──`・`│`などの罫線素片を使い、JavaScript無効時も同じ構造を表示します。モバイルはツリーとパネルを縦に配置します。 diff --git a/site/src/components/BoxFrame.astro b/site/src/components/BoxFrame.astro new file mode 100644 index 0000000..bcdfeb5 --- /dev/null +++ b/site/src/components/BoxFrame.astro @@ -0,0 +1,12 @@ +--- +// Overrun is clipped inside complete mono cells. No JS measurement, SVG, +// borders, or background gradients are needed, including for static HTML. +const horizontal = '─'.repeat(160); +const vertical = '│\n'.repeat(160).trimEnd(); +--- +
diff --git a/site/src/components/Landing.astro b/site/src/components/Landing.astro index c38afc8..0f31bb0 100644 --- a/site/src/components/Landing.astro +++ b/site/src/components/Landing.astro @@ -2,11 +2,12 @@ import { objects, initialObject, childrenOf, treePrefix, objectSignature, interfaceSignature } from '../lib/landing-demo'; import { href } from '../lib/book'; import '../styles/landing.css'; +import BoxFrame from './BoxFrame.astro'; ---{objectSignature(initialObject)}
選択したObjectの公開情報。本文はOperationで取得します。
{initialObject.path}{interfaceSignature(initialObject)}
/::issue.read#read_body// Operationを選び、Callで本文を取得。+
// このデモはブラウザ内だけで動作します。
{'// Operationを選び、Callで本文を取得。\n// このデモはブラウザ内だけで動作します。'}
ローカルサンプル — 外部への通信や変更は行いません。