Skip to content

new motd #33

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
pyramation opened this issue May 18, 2025 · 3 comments
Open

new motd #33

pyramation opened this issue May 18, 2025 · 3 comments

Comments

@pyramation
Copy link
Contributor

could be fun while install is happening, and to replace our motd with this:

// @ts-nocheck

import chalk from 'chalk';
import ora from 'ora';
import figlet from 'figlet';

const logo = `
..................................................
..........................-.......................
.......................-===-......................
....................-======-......-...............
.................-=========-...-===-..............
...............============-..-====-..............
..............-=====-.-====-..-====-..............
..............-====-..-====-..-====-..............
..............-====-..-==-....-====-..............
..............-====-..........-====-..............
..............-====-....-==-..-====-..............
..............-====-..-====-..-====-..............
..............-====-..-====-.-=====-..............
..............-====-..-============...............
..............-===-...-=========-.................
...............-......-======-....................
......................-===-.......................
.......................-..........................
..................................................
`;

const spinner = ora({
  text: chalk.gray('Spinning up your future...'),
  spinner: 'bouncingBall',
}).start();

setTimeout(() => {
  spinner.succeed(chalk.green('Welcome to Hyperweb 🕸️'));
  
  console.log(
    chalk.cyanBright.bold(
      figlet.textSync('Hyperweb', { font: 'Standard', horizontalLayout: 'default' })
    )
  );

  console.log(chalk.cyanBright.bold(logo));
  console.log(
    chalk.bold.white('\n🚀 Let’s build something legendary.')
  );
  console.log(chalk.gray('Type ') + chalk.yellow('npm run dev') + chalk.gray(' to get started.\n'));
}, 1800);
@pyramation
Copy link
Contributor Author

this one is pretty cool

import chalk from 'chalk';

const logo = `
..................................................
..........................-.......................
.......................-===-......................
....................-======-......-...............
.................-=========-...-===-..............
...............============-..-====-..............
..............-=====-.-====-..-====-..............
..............-====-..-====-..-====-..............
..............-====-..-==-....-====-..............
..............-====-..........-====-..............
..............-====-....-==-..-====-..............
..............-====-..-====-..-====-..............
..............-====-..-====-.-=====-..............
..............-====-..-============...............
..............-===-...-=========-.................
...............-......-======-....................
......................-===-.......................
.......................-..........................
..................................................
`;

const colors = [chalk.cyan, chalk.magenta, chalk.yellow, chalk.greenBright];
let colorIndex = 0;
let frame = 0;

function animateLogo() {
  const coloredLogoLines = logo.split('\n').map(line => {
    let coloredLine = '';
    for (let i = 0; i < line.length; i++) {
      coloredLine += line[i] !== '.' ? colors[colorIndex](line[i]) : line[i];
    }
    return coloredLine;
  });

  console.clear();
  console.log(coloredLogoLines.join('\n'));
  console.log(chalk.bold.blue('\nPreparing your Hyperweb experience...'));

  colorIndex = (colorIndex + 1) % colors.length;
  frame++;

  if (frame < 50) { // Adjust the number of frames for longer/shorter animation
    setTimeout(animateLogo, 100); // Adjust the delay for faster/slower animation
  } else {
    console.log(chalk.bold.green('\n✨ Hyperweb app is almost here! Stay tuned. ✨'));
  }
}

console.log(chalk.bold.black("Initializing awesomeness..."));
setTimeout(animateLogo, 500); // Initial delay before animation starts

@pyramation
Copy link
Contributor Author

lol here is a matrix version — I do the like the colored "⚡️" around the hyperweb app

// @ts-nocheck
import chalk from 'chalk';
const readline = require('readline');

// Clear the terminal and move cursor to top-left
const clear = () => {
  process.stdout.write('\x1b[2J');
  process.stdout.write('\x1b[0f');
};

// The ASCII logo
const logo = `
..................................................
..........................-.......................
.......................-===-......................
....................-======-......-...............
.................-=========-...-===-..............
...............============-..-====-..............
..............-=====-.-====-..-====-..............
..............-====-..-====-..-====-..............
..............-====-..-==-....-====-..............
..............-====-..........-====-..............
..............-====-.....==-..-====-..............
..............-====-..-====-..-====-..............
..............-====-..-====-.-=====-..............
..............-====-..-============...............
..............-===-...-=========-.................
...............-......-======-....................
......................-===-.......................
.......................-..........................
..................................................
`;

// Split the logo into lines
const logoLines = logo.split('\n');

// Define color schemes for different animation phases
const colorSchemes = [
  // Cyberpunk scheme
  {
    dot: chalk.gray('.'),
    dash: chalk.cyan('-'),
    equals: chalk.cyan('=')
  },
  // Fire scheme
  {
    dot: chalk.gray('.'),
    dash: chalk.red('-'),
    equals: chalk.yellow('=')
  },
  // Matrix scheme
  {
    dot: chalk.gray('.'),
    dash: chalk.green('-'),
    equals: chalk.green('=')
  },
  // Neon scheme
  {
    dot: chalk.gray('.'),
    dash: chalk.magenta('-'),
    equals: chalk.magenta('=')
  }
];

// Welcome messages that will be typed out
const welcomeMessages = [
  "Welcome to",
  "HYPERWEB APP",
  "The future of web development",
  "Loading system...",
  "Initializing quantum engines...",
  "Establishing neural connections...",
  "Ready to unleash digital power!"
];

// Function to render the logo with a specific color scheme
function renderLogo(scheme, progress = 1.0) {
  const result = [];
  
  const maxLine = Math.floor(logoLines.length * progress);
  
  for (let i = 0; i < logoLines.length; i++) {
    if (i <= maxLine) {
      const line = logoLines[i]
        .replace(/\./g, scheme.dot)
        .replace(/-/g, scheme.dash)
        .replace(/=/g, scheme.equals);
      result.push(line);
    } else {
      result.push('');
    }
  }
  
  return result.join('\n');
}

// Function to simulate typing text
function typeText(text, speed = 50) {
  return new Promise(resolve => {
    let i = 0;
    const interval = setInterval(() => {
      process.stdout.write(text[i]);
      i++;
      if (i >= text.length) {
        clearInterval(interval);
        process.stdout.write('\n');
        setTimeout(resolve, 300);
      }
    }, speed);
  });
}

// Function to create a glitch effect
function glitchText(text) {
  const glitchChars = '!@#$%^&*()_+-=[]{}|;:,.<>?/';
  
  return new Promise(resolve => {
    const originalChars = text.split('');
    let iterations = 0;
    
    const interval = setInterval(() => {
      let output = '';
      
      for (let i = 0; i < text.length; i++) {
        if (Math.random() < 0.1) {
          output += chalk.cyan(glitchChars[Math.floor(Math.random() * glitchChars.length)]);
        } else {
          output += (Math.random() < 0.9) ? chalk.green(originalChars[i]) : chalk.cyan(originalChars[i]);
        }
      }
      
      readline.clearLine(process.stdout, 0);
      readline.cursorTo(process.stdout, 0);
      process.stdout.write(output);
      
      iterations++;
      if (iterations > 20) {
        clearInterval(interval);
        readline.clearLine(process.stdout, 0);
        readline.cursorTo(process.stdout, 0);
        process.stdout.write(chalk.bold.cyan(text) + '\n');
        setTimeout(resolve, 500);
      }
    }, 50);
  });
}

// Run the full animation sequence
async function runAnimation() {
  clear();
  
  // Phase 1: Progressive logo reveal with color cycles
  for (let progress = 0; progress <= 1.0; progress += 0.05) {
    clear();
    const schemeIndex = Math.floor(progress * 4) % colorSchemes.length;
    console.log(renderLogo(colorSchemes[schemeIndex], progress));
    await new Promise(resolve => setTimeout(resolve, 100));
  }
  
  // Phase 2: Color cycling animation
  for (let i = 0; i < 20; i++) {
    clear();
    console.log(renderLogo(colorSchemes[i % colorSchemes.length]));
    await new Promise(resolve => setTimeout(resolve, 100));
  }
  
  // Phase 3: Type out welcome messages
  clear();
  console.log(renderLogo(colorSchemes[2])); // Matrix green
  console.log('\n');
  
  for (const msg of welcomeMessages) {
    if (msg === "HYPERWEB APP") {
      await glitchText(msg);
    } else {
      await typeText(chalk.cyan(msg));
    }
  }
  
  // Phase 4: Final stabilization
  await new Promise(resolve => setTimeout(resolve, 500));
  clear();
  
  // Final display with rainbow effect
  console.log(logo
    .replace(/\./g, chalk.gray('.'))
    .replace(/-/g, chalk.cyan('-'))
    .replace(/=/g, chalk.cyan('='))
  );
  
  console.log('\n');
  console.log(chalk.bold.green(' ⚡ ') + chalk.bold.cyan('HYPERWEB APP') + chalk.bold.green(' ⚡'));
  console.log(chalk.italic.gray(' Where the web becomes hyper.'));
  console.log('\n');
  console.log(chalk.yellowBright(' 🚀 ') + chalk.white('Type') + chalk.bold.green(' hyperweb --launch ') + chalk.white('to begin your journey'));
  console.log('\n');
}

// Check if we're running directly or being imported
if (require.main === module) {
  // Create a message for the user when they run the script
  console.log(chalk.cyan('Starting Hyperweb Terminal Experience...'));
  setTimeout(() => {
    runAnimation().then(() => {
      console.log(chalk.gray('Animation complete. Run again with "node hyperweb-animation.js"'));
    });
  }, 1000);
}

runAnimation().then(()=>{

})

@Jovonni
Copy link

Jovonni commented May 18, 2025

Perfect 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants