Skip to content

Commit c4ea425

Browse files
author
Tim Willebrands
committed
Remove demo.html and update index.html to enhance the Streaming Markdown Demo with new content and improved styling.
1 parent fff871c commit c4ea425

2 files changed

Lines changed: 38 additions & 96 deletions

File tree

‎demo.html‎

Lines changed: 0 additions & 85 deletions
This file was deleted.

‎docs/index.html‎

Lines changed: 38 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
<head>
44
<meta charset="utf-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1">
6-
<title>Streaming Markdown Component Demo</title>
6+
<title>Streaming Markdown Demo</title>
77
<style>
88
:root { color-scheme: light dark; }
9-
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial; margin: 2rem; line-height: 1.5; }
9+
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; margin: 2rem; line-height: 1.5; }
1010
main { max-width: 800px; margin: 0 auto; }
1111
.controls { display: flex; gap: 0.5rem; margin: 1rem 0; align-items: center; }
1212
button { padding: 0.5rem 0.75rem; font: inherit; cursor: pointer; }
@@ -18,8 +18,8 @@
1818
</head>
1919
<body>
2020
<main>
21-
<h1>Streaming Markdown Component Demo</h1>
22-
<p>This page is hosted via GitHub Pages. It loads the built component and streams some text.</p>
21+
<h1>Streaming Markdown Demo</h1>
22+
<p>This demo streams predefined Markdown chunks into the custom <code>&lt;streaming-md&gt;</code> component.</p>
2323
<div class="controls">
2424
<button id="start">Start stream</button>
2525
<button id="reset">Reset</button>
@@ -30,14 +30,38 @@ <h1>Streaming Markdown Component Demo</h1>
3030
<script type="module">
3131
import './dist/index.js';
3232

33-
const md = `# Hello Pages!\n\n` +
34-
`This demo is served from GitHub Pages.\n\n` +
35-
`- Uses <streaming-md>\n` +
36-
`- Powered by streaming-markdown\n\n` +
37-
`\` +
38-
`\`\`\`js\nconsole.log("Pages demo")\n\`\`\`\n`;
33+
const md = `
34+
*[DIAL-UP MODEM SOUNDS INTENSIFY]*
35+
36+
37+
# \U0001f389 PROOMPTING: The Future Is Now, Thanks To Science!
38+
39+
**SOI SOI SOI SOI SOI SOI SOI**
40+
41+
Greetings, fellow carbon-based life forms! Microsoft Sam here, and boy oh boy, do I have something SPECTACULAR to show you today! Remember when I used to read your emails back in Windows XP? Well, those days are OVER because now I'm here to tell you about PROOMPTING - the most REVOLUTIONARY chat application since... well... since ME!
42+
43+
## What The Heck Is This Thing?
44+
45+
Picture this: It's 2001. You've got your Windows XP machine humming along, Limewire is downloading your "totally legal" MP3s, and your 56k modem is screaming into the void. But WAIT! What if I told you that you could chat with an ARTIFICIAL INTELLIGENCE right from your desktop? That's right, folks - we've taken the best parts of Windows XP and SUPERCHARGED them with \u2728AI\u2728!
46+
47+
\`\`\`
48+
\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510
49+
\u2502 \U0001f5a5\ufe0f AUTHENTIC XP DESKTOP EXPERIENCE \u2502
50+
\u2502 \U0001f916 REAL AI THAT SOMEWHAT WORKS \u2502
51+
\u2502 \U0001f4ac CHAT ROOMS (LIKE MSN BUT BETTER) \u2502
52+
\u2502 \u26a1 FASTER THAN DIALUP (THANKFULLY) \u2502
53+
\u2502 \U0001f504 REAL-TIME MESSAGE STREAMING \u2502
54+
\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518
55+
\`\`\`
56+
57+
Link (wow): [Windows XP](https://www.microsoft.com/en-us/windowsxp/)
58+
59+
60+
*[WINDOWS XP SHUTDOWN SOUND]*
61+
`
3962

4063
function delay(ms) { return new Promise(r => setTimeout(r, ms)); }
64+
4165
async function start() {
4266
const el = document.getElementById('md');
4367
el.reset();
@@ -48,11 +72,14 @@ <h1>Streaming Markdown Component Demo</h1>
4872
}
4973
el.finish();
5074
}
75+
5176
document.getElementById('start').addEventListener('click', start);
5277
document.getElementById('reset').addEventListener('click', () => document.getElementById('md').reset());
78+
79+
// Auto-start
5380
start();
5481
</script>
5582
</body>
56-
</html>
83+
</html>
5784

5885

0 commit comments

Comments
 (0)