diff --git a/ventures/mdecks/README.md b/ventures/mdecks/README.md index e7e1510..e92cc02 100644 --- a/ventures/mdecks/README.md +++ b/ventures/mdecks/README.md @@ -29,6 +29,8 @@ Everything runs in the page. Nothing is stored, nothing is sent anywhere, no acc ## Links, for agents and scripts +The quickest way to hand this to an agent is the page's **Copy prompt for your agent** button. It copies [SKILL.md](SKILL.md) as a prompt: paste it into Claude, ChatGPT, Cursor or any other agent, ask for a deck, and the agent answers with a link that opens here. An agent that can install skills can keep SKILL.md as the `mdeck` skill instead. + A link is the page's address, then `#d=`, then the deck's text (UTF-8) compressed with raw deflate and written in base64url without padding. Anything that can't compress can use `#md=` and the text percent-encoded instead; those links are just longer. The page opens either kind. In Python: diff --git a/ventures/mdecks/SKILL.md b/ventures/mdecks/SKILL.md new file mode 100644 index 0000000..d65fe53 --- /dev/null +++ b/ventures/mdecks/SKILL.md @@ -0,0 +1,54 @@ +--- +name: mdeck +description: Make slide decks as .mdeck links, plain-text slides that open at mdecks.yolopreneur.lol with the whole deck inside the link and nothing uploaded. Use when asked for slides, a deck or a presentation to open in a browser or share as a link. +--- + +# Slide decks as .mdeck links + +.mdeck (https://mdecks.yolopreneur.lol/) turns plain text into slides. The deck travels inside its link, after the `#`, so nothing is uploaded and opening it needs no account. Whoever opens the link can present it with the arrow keys, edit it, or copy it as one HTML file. + +## Write the deck + +- `# Title` starts a slide's title, and `## Subtitle` goes under it. +- `- point` (or `* point`) is a bullet. +- Any other line is a paragraph. +- `---` on its own line starts a new slide. +- Inline: `**bold**`, `*italic*`, `` `code` `` and `[text](https://...)`. + +Nothing else renders: no images, tables, nested lists or code blocks. Aim for a title and three to six short bullets per slide. A slide that runs long shrinks its text and, past 70%, is cut in two with its title repeated, so nothing overflows, but your own `---` breaks will fall in better places. + +For example: + +``` +# Q3 in one minute +## What shipped and what slipped + +- Shipped: the new editor +- Slipped: PDF export, now due in November +- Next: a link for every deck + +--- +# Thanks + +Questions welcome. +``` + +## Make the link + +The link is `https://mdecks.yolopreneur.lol/#d=` followed by the deck's UTF-8 text compressed with raw deflate (no zlib header) and encoded as base64url without padding. In Python: + +```python +import base64, zlib + +c = zlib.compressobj(9, zlib.DEFLATED, -15) +data = c.compress(deck.encode()) + c.flush() +link = "https://mdecks.yolopreneur.lol/#d=" + base64.urlsafe_b64encode(data).decode().rstrip("=") +``` + +In Node: `"https://mdecks.yolopreneur.lol/#d=" + require("zlib").deflateRawSync(deck).toString("base64url")`. + +If you can't run code, use `https://mdecks.yolopreneur.lol/#md=` followed by the text percent-encoded, the way `encodeURIComponent` does it. Those links are longer but work the same. + +## Hand it over + +Reply with the link, and keep the deck's text so you can revise it: every change makes a new link. Someone who wants a file can open the link and press **Copy deck as HTML** for one self-contained HTML file. diff --git a/ventures/mdecks/app.js b/ventures/mdecks/app.js index 68ae693..7a43aa8 100644 --- a/ventures/mdecks/app.js +++ b/ventures/mdecks/app.js @@ -500,6 +500,26 @@ else makeLink(text).then(share); }); + // The prompt for an agent is SKILL.md, fetched once, so pasting it teaches any agent to make these links; + // it also points to the file, for agents that can install it as a skill. Until SKILL.md arrives (or if + // it can't), the prompt only points to it. + var SKILL_URL = "https://mdecks.yolopreneur.lol/SKILL.md"; + var agentBtn = document.getElementById("agent"); + var agentPrompt = "Read " + SKILL_URL + " and follow it to make slide decks for me as .mdeck links."; + + fetch("SKILL.md").then(function (r) { + if (!r.ok) throw new Error("SKILL.md: " + r.status); + return r.text(); + }).then(function (skill) { + agentPrompt = "Use .mdeck to make slide decks for me. These instructions are also at " + SKILL_URL + + "; if you can install skills, save that file as a skill named mdeck so you have it next time.\n\n" + + skill.replace(/^---\r?\n[\s\S]*?\r?\n---\r?\n+/, ""); + }).catch(function () { /* keep the prompt that points to SKILL.md */ }); + + agentBtn.addEventListener("click", function () { + copyText(agentPrompt, agentBtn, "Prompt copied!"); + }); + // Build the self-contained export deck: the slides as shown, cuts and all. function buildExport() { var slidesHtml = deck.map(function (s) { diff --git a/ventures/mdecks/index.html b/ventures/mdecks/index.html index d718446..ff95a76 100644 --- a/ventures/mdecks/index.html +++ b/ventures/mdecks/index.html @@ -250,7 +250,7 @@ } .steps { display: grid; - grid-template-columns: repeat(3, 1fr); + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; } .step { @@ -379,12 +379,14 @@ header h1 { font-size: 1.4rem; letter-spacing: -0.01em; } header .promise { margin: 0; color: var(--ink-dim); font-size: 0.9rem; } header .early-note { margin: 0 0 0 auto; font-size: 0.75rem; color: var(--ink-dim); } + header .agent { padding: 6px 12px; font-size: 0.8rem; white-space: nowrap; } main { flex: none; height: calc(100svh - 60px); min-height: 460px; } main section { padding: 0; max-width: none; margin: 0; } .hint code { white-space: nowrap; } @media (max-width: 820px) { header { padding: 10px 16px; } header .early-note { margin: 0; flex: 1 1 150px; } + header .agent { order: 1; } main { height: auto; min-height: 0; grid-template-rows: auto auto; padding: 12px 16px 16px; } } @@ -393,6 +395,7 @@

.mdeck

Plain text in, slides out.

+

Opens a public GitHub issue. No email, no payment.

Get early access
@@ -435,6 +438,10 @@

Take the file with you

One button copies the deck as a single self-contained HTML file. Open it anywhere, present it offline, email it, done. Or copy a link with the whole deck inside it.

+
+

Or ask your agent

+

Press Copy prompt for your agent at the top, paste it into Claude, ChatGPT, Cursor or any other agent, and ask for a deck. It answers with a link that opens here.

+