diff --git a/src/pages/lab.astro b/src/pages/lab.astro deleted file mode 100644 index 6f66dea..0000000 --- a/src/pages/lab.astro +++ /dev/null @@ -1,30 +0,0 @@ ---- -import Layout from '../layouts/Layout.astro'; ---- - - -

~/lab

- -
-

This is where experiments happen.

- -
- ls -la experiments/ -
-

Terminal Text Effects

-

ASCII Art Generator

-

Command Line Games

-
-
- -
- cat README.md -
-

- The lab is a space for experimental projects and ideas. - Feel free to explore, but be cautious as things might break. -

-
-
-
- \ No newline at end of file diff --git a/src/pages/lab/[slug].astro b/src/pages/lab/[slug].astro deleted file mode 100644 index 910a7ba..0000000 --- a/src/pages/lab/[slug].astro +++ /dev/null @@ -1,410 +0,0 @@ ---- -import Layout from '../../layouts/Layout.astro'; - -export function getStaticPaths() { - return [ - { params: { slug: 'experiment-1' } }, - { params: { slug: 'experiment-2' } }, - { params: { slug: 'experiment-3' } } - ]; -} - -const { slug } = Astro.params; - -const experiments = { - 'experiment-1': { - title: 'Terminal Text Effects', - content: ` -

This is a demonstration of terminal-like text effects.

-
-

This text will change colors like a rainbow.

-
-
-

This text will occasionally glitch.

-
- `, - script: ` - // Rainbow text effect - const rainbowText = document.getElementById('rainbow-text'); - if (rainbowText) { - const colors = ['#ff5555', '#ffb86c', '#f1fa8c', '#50fa7b', '#8be9fd', '#bd93f9', '#ff79c6']; - let colorIndex = 0; - - setInterval(() => { - rainbowText.style.color = colors[colorIndex]; - colorIndex = (colorIndex + 1) % colors.length; - }, 1000); - } - - // Glitch text effect - const glitchText = document.getElementById('glitch-text'); - if (glitchText) { - const originalText = glitchText.textContent; - - const glitchChars = '!@#$%^&*()_+-=[]{}|;:,.<>?/\\\\'; - - setInterval(() => { - if (Math.random() > 0.9) { - let glitchedText = ''; - for (let i = 0; i < originalText.length; i++) { - if (Math.random() > 0.9) { - glitchedText += glitchChars[Math.floor(Math.random() * glitchChars.length)]; - } else { - glitchedText += originalText[i]; - } - } - glitchText.textContent = glitchedText; - - setTimeout(() => { - glitchText.textContent = originalText; - }, 100); - } - }, 2000); - } - ` - }, - 'experiment-2': { - title: 'ASCII Art Generator', - content: ` -

Generate ASCII art from text.

-
- - -
-
-
- `, - script: ` - const generateBtn = document.getElementById('generate-btn'); - const asciiInput = document.getElementById('ascii-input'); - const asciiOutput = document.getElementById('ascii-output'); - - if (generateBtn && asciiInput && asciiOutput) { - generateBtn.addEventListener('click', () => { - const text = asciiInput.value.trim(); - if (!text) return; - - const fontStyles = [ - generateSimpleAscii, - generateBlockAscii, - generateShadowAscii - ]; - - const style = fontStyles[Math.floor(Math.random() * fontStyles.length)]; - asciiOutput.textContent = style(text); - }); - } - - function generateSimpleAscii(text) { - return \` - _____ _____ _____ _____ _____ _____ - |_____||_____||_____||_____||_____||_____| - | ${text.split('').join(' | ')} | - |_____|_____|_____|_____|_____|_____| -\`; - } - - function generateBlockAscii(text) { - return \` - ██████╗ ${text.split('').map(() => '██████╗ ').join('')} -██╔════╝ ${text.split('').map(() => '██╔══██╗').join('')} -██║ ███╗${text.split('').map(() => '██████╔╝').join('')} -██║ ██║${text.split('').map(() => '██╔══██╗').join('')} -╚██████╔╝${text.split('').map(() => '██████╔╝').join('')} - ╚═════╝ ${text.split('').map(() => '╚═════╝ ').join('')} -\`; - } - - function generateShadowAscii(text) { - return \` - ░░░░░░${text.split('').map(() => '░░░░░░').join('')} -▒░ ▒░${text.split('').map(() => '▒░ ▒░').join('')} -▒▒ ▒▒${text.split('').map(() => '▒▒ ▒▒').join('')} -▓▒ ▒▓${text.split('').map(() => '▓▒ ▒▓').join('')} - ▓▓▓▓▓▓ ${text.split('').map(() => '▓▓▓▓▓▓ ').join('')} -\`; - } - `, - style: ` - .terminal-input { - background-color: var(--bg-color); - border: 1px solid var(--border-color); - color: var(--text-color); - padding: 0.5rem; - font-family: var(--font-mono); - margin-right: 0.5rem; - } - - .terminal-btn { - background-color: var(--border-color); - border: none; - color: var(--text-color); - padding: 0.5rem 1rem; - font-family: var(--font-mono); - cursor: pointer; - transition: background-color 0.2s; - } - - .terminal-btn:hover { - background-color: var(--accent-color); - color: var(--bg-color); - } - ` - }, - 'experiment-3': { - title: 'Command Line Games', - content: ` -

Try a simple command line game.

-
-

Enter a command:

-
- play - -
-
- Available games: number-guess, rock-paper-scissors, hangman -
-
- `, - script: ` - const gameInput = document.getElementById('game-input'); - const gameOutput = document.getElementById('game-output'); - - let currentGame = null; - let gameState = {}; - - if (gameInput && gameOutput) { - gameInput.addEventListener('keydown', (e) => { - if (e.key === 'Enter') { - const command = gameInput.value.trim().toLowerCase(); - gameInput.value = ''; - - processCommand(command); - } - }); - } - - function processCommand(command) { - if (!currentGame) { - // Starting a new game - if (command === 'number-guess') { - currentGame = 'number-guess'; - gameState = { - target: Math.floor(Math.random() * 100) + 1, - attempts: 0 - }; - appendOutput('I\'m thinking of a number between 1 and 100.'); - appendOutput('Enter your guess:'); - } else if (command === 'rock-paper-scissors') { - currentGame = 'rock-paper-scissors'; - appendOutput('Let\'s play Rock, Paper, Scissors!'); - appendOutput('Enter rock, paper, or scissors:'); - } else if (command === 'hangman') { - currentGame = 'hangman'; - const words = ['javascript', 'terminal', 'computer', 'keyboard', 'program']; - gameState = { - word: words[Math.floor(Math.random() * words.length)], - guessed: [], - attempts: 0 - }; - appendOutput('Let\'s play Hangman!'); - appendOutput(\`The word has \${gameState.word.length} letters.\`); - appendOutput(getHangmanDisplay()); - } else { - appendOutput(\`Unknown game: \${command}\`); - appendOutput('Available games: number-guess, rock-paper-scissors, hangman'); - } - } else if (currentGame === 'number-guess') { - const guess = parseInt(command); - if (isNaN(guess)) { - appendOutput('Please enter a valid number.'); - return; - } - - gameState.attempts++; - - if (guess === gameState.target) { - appendOutput(\`Congratulations! You guessed it in \${gameState.attempts} attempts.\`); - currentGame = null; - appendOutput('\\nAvailable games: number-guess, rock-paper-scissors, hangman'); - } else if (guess < gameState.target) { - appendOutput('Too low! Try again:'); - } else { - appendOutput('Too high! Try again:'); - } - } else if (currentGame === 'rock-paper-scissors') { - const choices = ['rock', 'paper', 'scissors']; - if (!choices.includes(command)) { - appendOutput('Please enter rock, paper, or scissors.'); - return; - } - - const computerChoice = choices[Math.floor(Math.random() * choices.length)]; - appendOutput(\`You chose \${command}. Computer chose \${computerChoice}.\`); - - if (command === computerChoice) { - appendOutput('It\'s a tie!'); - } else if ( - (command === 'rock' && computerChoice === 'scissors') || - (command === 'paper' && computerChoice === 'rock') || - (command === 'scissors' && computerChoice === 'paper') - ) { - appendOutput('You win!'); - } else { - appendOutput('Computer wins!'); - } - - appendOutput('Play again? Enter rock, paper, or scissors, or type "exit" to quit:'); - - if (command === 'exit') { - currentGame = null; - appendOutput('\\nAvailable games: number-guess, rock-paper-scissors, hangman'); - } - } else if (currentGame === 'hangman') { - if (command === 'exit') { - currentGame = null; - appendOutput(\`The word was: \${gameState.word}\`); - appendOutput('\\nAvailable games: number-guess, rock-paper-scissors, hangman'); - return; - } - - if (command.length !== 1) { - appendOutput('Please enter a single letter.'); - return; - } - - const letter = command.toLowerCase(); - - if (gameState.guessed.includes(letter)) { - appendOutput('You already guessed that letter!'); - return; - } - - gameState.guessed.push(letter); - - if (!gameState.word.includes(letter)) { - gameState.attempts++; - } - - appendOutput(getHangmanDisplay()); - - const wordDisplay = gameState.word - .split('') - .map(char => gameState.guessed.includes(char) ? char : '_') - .join(' '); - - appendOutput(\`Word: \${wordDisplay}\`); - appendOutput(\`Guessed: \${gameState.guessed.join(', ')}\`); - - if (!wordDisplay.includes('_')) { - appendOutput('Congratulations! You guessed the word!'); - currentGame = null; - appendOutput('\\nAvailable games: number-guess, rock-paper-scissors, hangman'); - } else if (gameState.attempts >= 6) { - appendOutput(\`Game over! The word was: \${gameState.word}\`); - currentGame = null; - appendOutput('\\nAvailable games: number-guess, rock-paper-scissors, hangman'); - } - } - } - - function getHangmanDisplay() { - const hangmanStages = [ - \` - +---+ - | | - | - | - | - | -=========\`, - \` - +---+ - | | - O | - | - | - | -=========\`, - \` - +---+ - | | - O | - | | - | - | -=========\`, - \` - +---+ - | | - O | - /| | - | - | -=========\`, - \` - +---+ - | | - O | - /|\\ | - | - | -=========\`, - \` - +---+ - | | - O | - /|\\ | - / | - | -=========\`, - \` - +---+ - | | - O | - /|\\ | - / \\ | - | -=========\` - ]; - - return hangmanStages[Math.min(gameState.attempts, 6)]; - } - - function appendOutput(text) { - gameOutput.textContent += '\\n' + text; - gameOutput.scrollTop = gameOutput.scrollHeight; - } - `, - style: ` - .terminal-input { - background-color: var(--bg-color); - border: 1px solid var(--border-color); - color: var(--text-color); - padding: 0.5rem; - font-family: var(--font-mono); - } - ` - } -}; ---- - - -

{experiments[slug]?.title}

- -
-
-
- -
- ← Back to lab -
- - {experiments[slug]?.style && ( - - )} - - {experiments[slug]?.script && ( - - )} - \ No newline at end of file