oneie/bin/cli-animations.js

🤝 ONE Personal Collaborative Intelligence - Creates personalized AI workspace from your me.md profile. Simple: npx oneie → edit me.md → generate personalized agents, workflows & missions. From students to enterprises, ONE adapts to your context.

#!/usr/bin/env node

/**
 * Beautiful CLI Animations and Progress Indicators
 * Enhanced user experience with context-aware animations
 */

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

export class CLIAnimations {
  constructor(context) {
    this.context = context || { type: 'professional-business' };
    this.currentSpinner = null;
  }

  // Context-aware welcome animations
  async playWelcomeAnimation() {
    const animations = {
      'elementary-school': this.playSchoolWelcome,
      'university-research': this.playResearchWelcome,
      'professional-business': this.playBusinessWelcome,
      'government-agency': this.playGovernmentWelcome
    };

    const animation = animations[this.context.type] || animations['professional-business'];
    await animation.call(this);
  }

  async playSchoolWelcome() {
    console.log(chalk.rainbow('\n🌈 Welcome to your AI Study Group! 🌈\n'));
    
    const messages = [
      '🎒 Setting up your learning workspace...',
      '📚 Your AI study buddies are getting ready...',
      '🎮 Making learning fun and interactive...',
      '✨ Everything is ready for your learning adventure!'
    ];

    for (const message of messages) {
      await this.typewriterEffect(chalk.cyan(message), 30);
      await this.delay(800);
    }

    // ASCII art for kids
    console.log(chalk.yellow(`
    🏫 Your Study Space 🏫
    ┌─────────────────────┐
    │  📖 Learning Helper │
    │  🎨 Creative Friend │
    │  👫 Study Partner   │
    └─────────────────────┘
    `));
  }

  async playResearchWelcome() {
    console.log(chalk.blue.bold('\n🎓 Academic Collaboration Environment Initializing 🎓\n'));
    
    const messages = [
      '📊 Configuring research methodology frameworks...',
      '🔬 Activating peer review systems...',
      '📈 Establishing data analysis protocols...',
      '🎯 Academic collaboration space ready!'
    ];

    for (const message of messages) {
      await this.typewriterEffect(chalk.blue(message), 25);
      await this.delay(1000);
    }

    console.log(chalk.blue(`
    🏛️ Research Collaboration Lab
    ╔═══════════════════════════╗
    ║ 🎓 Research Collaborator  ║
    ║ 📊 Data Analyst           ║
    ║ 🔬 Methodology Guide      ║
    ╚═══════════════════════════╝
    `));
  }

  async playBusinessWelcome() {
    console.log(chalk.green.bold('\n💼 Executive AI Partnership Activated 💼\n'));
    
    const messages = [
      '🚀 Initializing strategic planning systems...',
      '📈 Activating market intelligence networks...',
      '⚡ Deploying execution coordination protocols...',
      '🎯 Your AI co-founders are ready to scale!'
    ];

    for (const message of messages) {
      await this.typewriterEffect(chalk.green(message), 20);
      await this.delay(900);
    }

    console.log(chalk.green(`
    🏢 Executive Suite
    ╔═══════════════════════════╗
    ║ 💼 Executive Partner      ║
    ║ 📊 Strategy Analyst       ║
    ║ ⚡ Implementation Lead    ║
    ╚═══════════════════════════╝
    `));
  }

  async playGovernmentWelcome() {
    console.log(chalk.blue.bold('\n🏛️ Public Service AI Partnership Established 🏛️\n'));
    
    const messages = [
      '📋 Establishing regulatory compliance frameworks...',
      '🔒 Activating transparency and accountability systems...',
      '👥 Configuring citizen-focused service protocols...',
      '✅ Institutional AI partners ready for public service!'
    ];

    for (const message of messages) {
      await this.typewriterEffect(chalk.blue(message), 25);
      await this.delay(1000);
    }

    console.log(chalk.blue(`
    🏛️ Public Service Center
    ╔═══════════════════════════╗
    ║ 📋 Policy Analyst         ║
    ║ 🔒 Compliance Partner     ║
    ║ 👥 Public Service Guide   ║
    ╚═══════════════════════════╝
    `));
  }

  // Context-aware progress spinners
  createContextSpinner(message) {
    const spinnerTypes = {
      'elementary-school': {
        spinner: 'rainbow',
        color: 'cyan',
        prefix: '🌟'
      },
      'university-research': {
        spinner: 'dots12',
        color: 'blue', 
        prefix: '🔬'
      },
      'professional-business': {
        spinner: 'arrow3',
        color: 'green',
        prefix: '🚀'
      },
      'government-agency': {
        spinner: 'clock',
        color: 'blue',
        prefix: '🏛️'
      }
    };

    const config = spinnerTypes[this.context.type] || spinnerTypes['professional-business'];
    
    return ora({
      text: `${config.prefix} ${message}`,
      spinner: config.spinner,
      color: config.color
    });
  }

  // Enhanced success celebrations
  async celebrateSuccess() {
    const celebrations = {
      'elementary-school': this.celebrateSchoolSuccess,
      'university-research': this.celebrateResearchSuccess,
      'professional-business': this.celebrateBusinessSuccess,
      'government-agency': this.celebrateGovernmentSuccess
    };

    const celebration = celebrations[this.context.type] || celebrations['professional-business'];
    await celebration.call(this);
  }

  async celebrateSchoolSuccess() {
    console.log(chalk.rainbow('\n🎉 AWESOME! Your AI Study Group is Ready! 🎉\n'));
    
    const messages = [
      '🏆 You did great setting this up!',
      '🤝 Your AI friends are excited to help!',
      '📚 Ready to make learning super fun!',
      '⭐ Let\'s learn amazing things together!'
    ];

    for (const message of messages) {
      console.log(chalk.yellow(`   ${message}`));
      await this.delay(500);
    }

    console.log(chalk.rainbow('\n✨ Time to start your first learning mission! ✨\n'));
  }

  async celebrateResearchSuccess() {
    console.log(chalk.blue.bold('\n🎓 Academic Collaboration Framework Established! 🎓\n'));
    
    const messages = [
      '📊 Methodology frameworks configured',
      '🔬 Peer review systems operational', 
      '📈 Data analysis protocols active',
      '🤝 Ready for rigorous academic collaboration'
    ];

    for (const message of messages) {
      console.log(chalk.blue(`   ✓ ${message}`));
      await this.delay(400);
    }

    console.log(chalk.blue.bold('\n🌟 Begin your research mission with confidence! 🌟\n'));
  }

  async celebrateBusinessSuccess() {
    console.log(chalk.green.bold('\n🚀 AI Co-Founders Successfully Onboarded! 🚀\n'));
    
    const messages = [
      '💼 Executive partnership established',
      '📊 Strategic intelligence systems online',
      '⚡ Implementation protocols activated', 
      '🎯 Ready to scale your business exponentially'
    ];

    for (const message of messages) {
      console.log(chalk.green(`   ✓ ${message}`));
      await this.delay(400);
    }

    console.log(chalk.green.bold('\n💎 Time to launch your next strategic mission! 💎\n'));
  }

  async celebrateGovernmentSuccess() {
    console.log(chalk.blue.bold('\n🏛️ Public Service AI Partnership Operational! 🏛️\n'));
    
    const messages = [
      '📋 Regulatory compliance frameworks established',
      '🔒 Transparency protocols activated',
      '👥 Citizen-focused systems operational',
      '✅ Ready to serve the public with excellence'
    ];

    for (const message of messages) {
      console.log(chalk.blue(`   ✓ ${message}`));
      await this.delay(400);
    }

    console.log(chalk.blue.bold('\n🌟 Begin your public service mission! 🌟\n'));
  }

  // Progress tracking animations
  async showProgress(total, current, task) {
    const percentage = Math.round((current / total) * 100);
    const progressBar = this.createProgressBar(percentage);
    
    const progressDisplay = {
      'elementary-school': `🌟 ${progressBar} ${percentage}% - ${task}`,
      'university-research': `🔬 ${progressBar} ${percentage}% - ${task}`,
      'professional-business': `🚀 ${progressBar} ${percentage}% - ${task}`,
      'government-agency': `🏛️ ${progressBar} ${percentage}% - ${task}`
    };

    const display = progressDisplay[this.context.type] || progressDisplay['professional-business'];
    
    process.stdout.write(`\r${display}`);
    
    if (current === total) {
      process.stdout.write('\n');
    }
  }

  createProgressBar(percentage) {
    const width = 20;
    const filled = Math.round((percentage / 100) * width);
    const empty = width - filled;
    
    const filledChar = this.context.type === 'elementary-school' ? '🌟' : '█';
    const emptyChar = this.context.type === 'elementary-school' ? '⭐' : '░';
    
    return `[${'█'.repeat(filled)}${'░'.repeat(empty)}]`;
  }

  // Typewriter effect for messages
  async typewriterEffect(message, speed = 30) {
    process.stdout.write('\r' + ' '.repeat(process.stdout.columns || 80) + '\r');
    
    for (let i = 0; i <= message.length; i++) {
      process.stdout.write('\r' + message.slice(0, i));
      await this.delay(speed);
    }
    process.stdout.write('\n');
  }

  // Interactive dialogue animations
  async showDialogue(speaker, message, delay = 1500) {
    const speakerStyles = {
      'human': chalk.cyan('👤 Human User:'),
      'installation-agent': chalk.magenta('🤖 Installation Agent:'),
      'integration-specialist': chalk.cyan('🤖 Integration Specialist:'),
      'system': chalk.gray('💻 System:')
    };

    const styledSpeaker = speakerStyles[speaker] || chalk.white(`🤖 ${speaker}:`);
    console.log(styledSpeaker, chalk.white(`"${message}"`));
    await this.delay(delay);
  }

  // Context-aware next steps animation
  async showNextSteps() {
    const nextStepsConfig = {
      'elementary-school': {
        title: '🎮 Fun Next Steps:',
        color: 'yellow',
        icon: '✨'
      },
      'university-research': {
        title: '📚 Research Next Steps:',
        color: 'blue',
        icon: '🎯'
      },
      'professional-business': {
        title: '🚀 Strategic Next Steps:',
        color: 'green', 
        icon: '💎'
      },
      'government-agency': {
        title: '🏛️ Public Service Next Steps:',
        color: 'blue',
        icon: '🌟'
      }
    };

    const config = nextStepsConfig[this.context.type] || nextStepsConfig['professional-business'];
    
    console.log(chalk[config.color](config.title));
    
    const contextSteps = this.getContextSpecificSteps();
    
    for (let i = 0; i < contextSteps.length; i++) {
      await this.delay(300);
      console.log(chalk.white(`  ${i + 1}. ${config.icon} ${contextSteps[i]}`));
    }
  }

  getContextSpecificSteps() {
    const steps = {
      'elementary-school': [
        'Create your first learning mission',
        'Chat with your AI study partners',
        'Get help with homework and projects',
        'Celebrate your learning wins!'
      ],
      'university-research': [
        'Start: Collaborative research project',
        'Work with AI research partners',
        'Develop academic methodology together',
        'Prepare for peer review and publication'
      ],
      'professional-business': [
        'Launch: Strategic business mission',
        'Collaborate with AI executive partners',
        'Scale your business with AI intelligence',
        'Monitor and optimize performance'
      ],
      'government-agency': [
        'Begin: Public service mission',
        'Partner with compliant AI agents',
        'Develop policy with full transparency',
        'Measure citizen impact and satisfaction'
      ]
    };

    return steps[this.context.type] || steps['professional-business'];
  }

  // Utility methods
  delay(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
  }

  cleanup() {
    if (this.currentSpinner) {
      this.currentSpinner.stop();
      this.currentSpinner = null;
    }
  }
}

// Predefined animation sequences for different phases
export const AnimationSequences = {
  INSTALLATION_PHASES: [
    { phase: 'analysis', message: 'Analyzing your project architecture', duration: 2000 },
    { phase: 'context', message: 'Detecting context and adapting intelligence', duration: 1500 },
    { phase: 'framework', message: 'Creating collaborative framework', duration: 2500 },
    { phase: 'integration', message: 'Integrating lifecycle workflows', duration: 2000 },
    { phase: 'validation', message: 'Validating collaborative setup', duration: 1500 }
  ],

  CONTEXT_MESSAGES: {
    'elementary-school': {
      welcome: '🎮 Hey! Let\'s build something awesome with AI friends!',
      success: '🌟 Your AI study group is ready to help with homework!',
      encouragement: 'You\'re going to learn so many cool things together!'
    },
    'university-research': {
      welcome: '🎓 Initializing academic collaboration environment...',
      success: '📚 Your academic collaboration partners are initialized!',
      encouragement: 'Ready to advance knowledge through rigorous research!'
    },
    'professional-business': {
      welcome: '💼 Deploying executive AI partnership systems...',
      success: '🚀 Your AI co-founders are ready to scale your business!',
      encouragement: 'Time to achieve exponential business growth!'
    },
    'government-agency': {
      welcome: '🏛️ Establishing institutional AI governance framework...',
      success: '✅ Your institutional AI partners are compliant and ready!',
      encouragement: 'Ready to serve citizens with enhanced capabilities!'
    }
  }
};