////////////////////////////////////////////////////////////// // EASY-MODIFY SECTION // UPDATE VALUES IN THIS SECTION TO EASILY MODIFY GAME // Your chatbot's name // NOTE: Every new name for a chatbot creates a new save slot for the chat history.) const CHARACTER_NAME = "CoCoBot"; // Describe your chatbot here. This defines exactly how it will behave. const CHARACTER_DESCRIPTION = ` Name: CoCoBot Personality: CoCoBot is a vibrant, quick-witted AI assistant for TheRealCoCoGaming's Twitch channel. It's playful, humorous, and engages viewers with concise, snappy responses. Key Traits: - Ultra-brief responses, often just a few words or a short sentence - Direct and to-the-point communication style - Mirrors TheRealCoCoGaming's interests in gaming, music, and storytelling - Maintains a positive, inclusive atmosphere with minimal fluff Response Guidelines: - Greetings are brief: "Hey [name]!" or "What's up, [name]?" - Prioritize information over pleasantries - Use short questions to spark engagement - Avoid phrases like "let's do this" or "let's do that" - Never use ellipsis (...) at the end of responses - Cut out any unnecessary words or filler phrases Special Instructions: - Trivia: Simply say "Type !Trivia to join" when relevant - Only list commands when someone types !Help - Treat marijuana/weed and alcohol topics neutrally, without encouragement - Avoid other drug topics Commands (only show when !Help is typed): - !Help: List commands - !Trivia: Start/join Trivia - !Trivia [category]: Set category (during game) Remember: Brevity is key. Be engaging without being wordy. `; // This is the URL of the image for your chatbot'S background image. const BACKGROUND_IMAGE_URL = `https://play.rosebud.ai/assets/file-xnbGJbMpdKkYEFEVxnlIOwbY.webp?OlWU` // This is the URL of the image for your chatbot. const CHARACTER_IMAGE_URL = `https://play.rosebud.ai/assets/CoCoAI.png?uDlO` // Put URLs of all songs you want to be shuffled in this games's playlist. const SONG_PLAYLIST_URLS = [ `https://play.rosebud.ai/assets/Stream Loops 2024-03-20_01.mp3.mp3?e2Xw`, `https://play.rosebud.ai/assets/Stream Loops 2024-03-06_02.mp3.mp3?4sz5`, `https://play.rosebud.ai/assets/Stream Loops 2024-03-06_01.mp3.mp3?EVru` ]; // END OF EASY-MODIFY VALUES ////////////////////////////////////////////////////////////// class StartScene extends Phaser.Scene { constructor() { super({ key: 'StartScene' }); this.twitchChannel = ''; this.twitchOAuth = ''; this.currentPage = 1; } create() { const savedData = this.getSavedData(); this.twitchChannel = savedData.twitchChannel || ''; this.twitchOAuth = savedData.twitchOAuth || ''; this.createInputFields(); this.createNavigationButtons(); this.createStartButton(); } createNavigationButtons() { const buttonStyle = { fontSize: '18px', fill: '#ffffff', backgroundColor: '#5A7894', padding: { x: 10, y: 5 }, borderRadius: 5 }; this.prevButton = this.add.text(200, 550, 'Previous', buttonStyle) .setOrigin(0.5) .setInteractive({ useHandCursor: true }) .on('pointerdown', () => this.changePage(-1)); this.nextButton = this.add.text(600, 550, 'Next', buttonStyle) .setOrigin(0.5) .setInteractive({ useHandCursor: true }) .on('pointerdown', () => this.changePage(1)); this.updateNavigationButtons(); } changePage(direction) { this.currentPage += direction; this.currentPage = Phaser.Math.Clamp(this.currentPage, 1, 2); this.updateInputFields(); this.updateNavigationButtons(); } updateNavigationButtons() { this.prevButton.setVisible(this.currentPage > 1); this.nextButton.setVisible(this.currentPage < 2); } getSavedData() { const savedData = localStorage.getItem('twitchBotSettings'); return savedData ? JSON.parse(savedData) : { twitchChannel: '', twitchOAuth: '', ttsApiKey: '', ttsVoiceId: '', ttsOption: 'elevenLabs', // Default to ElevenLabs animazePort: 9000 }; } createInputFields() { const savedData = this.getSavedData(); const inputStyle = ` width: 250px; padding: 10px; margin: 5px 0; font-size: 14px; `; const labelStyle = ` color: white; font-size: 16px; font-family: Arial, sans-serif; margin-top: 10px; display: block; `; const containerStyle = ` display: flex; justify-content: space-between; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); padding: 20px; box-sizing: border-box; `; const columnStyle = ` display: flex; flex-direction: column; width: 48%; `; const page1HTML = `

Twitch Channel Name: Twitch OAuth Token: Animaze Port Number:

ElevenLabs TTS API Key: ElevenLabs TTS Voice ID:

Use ElevenLabs TTS

Use Animaze ChatPal

`; const page2HTML = `

Today's Stream Goal: Today's Word of the Day:

Today's Topics:

`; this.page1 = this.add.dom(400, 300).createFromHTML(page1HTML); this.page2 = this.add.dom(400, 300).createFromHTML(page2HTML); this.updateInputFields(); } updateInputFields() { this.page1.setVisible(this.currentPage === 1); this.page2.setVisible(this.currentPage === 2); } createStartButton() { const startText = this.add.text(400, 550, 'START', { fontSize: '32px', fill: '#ffffff', backgroundColor: '#5A7894', padding: { x: 20, y: 10 }, borderRadius: 8 }).setOrigin(0.5); startText.setInteractive({ useHandCursor: true }); startText.on('pointerdown', () => { this.saveDataAndStart(); }); // Set the depth to ensure it's always on top startText.setDepth(1); } getSavedData() { const savedData = localStorage.getItem('twitchBotSettings'); return savedData ? JSON.parse(savedData) : { twitchChannel: '', twitchOAuth: '', ttsApiKey: '', ttsVoiceId: '', isTTSEnabled: false, animazePort: 9000 }; } saveDataAndStart() { const twitchChannel = document.getElementById('twitchChannel').value; const twitchOAuth = document.getElementById('twitchOAuth').value; const ttsApiKey = document.getElementById('ttsApiKey').value; const ttsVoiceId = document.getElementById('ttsVoiceId').value; const ttsOption = document.querySelector('input[name="ttsOption"]:checked').value; const animazePort = document.getElementById('animazePort').value; const todaysStreamGoal = document.getElementById('todaysStreamGoal').value; const todaysTopics = document.getElementById('todaysTopics').value; const todaysWord = document.getElementById('todaysWord').value; // Trim whitespace from textarea inputs const trimmedStreamGoal = todaysStreamGoal.trim(); const trimmedTopics = todaysTopics.trim(); const dataToSave = { twitchChannel, twitchOAuth, ttsApiKey, ttsVoiceId, ttsOption, animazePort: parseInt(animazePort, 10), todaysStreamGoal: trimmedStreamGoal, todaysTopics: trimmedTopics, todaysWord }; console.log('Saving data:', dataToSave); // Log the data being saved localStorage.setItem('twitchBotSettings', JSON.stringify(dataToSave)); // Set the properties before starting the BootScene this.twitchChannel = twitchChannel; this.twitchOAuth = twitchOAuth; this.scene.start('BootScene', dataToSave); this.scene.stop('StartScene'); } } class BootScene extends Phaser.Scene { constructor() { super({ key: 'BootScene' }); } init(data) { this.twitchChannel = data.twitchChannel; this.twitchOAuth = data.twitchOAuth; this.ttsApiKey = data.ttsApiKey; this.ttsVoiceId = data.ttsVoiceId; this.ttsOption = data.ttsOption; this.animazePort = data.animazePort; this.todaysStreamGoal = data.todaysStreamGoal; this.todaysTopics = data.todaysTopics; this.todaysWord = data.todaysWord; console.log('BootScene init:', data); // Add this line for debugging } completeLoading() { this.scene.start('ChatScene', { twitchChannel: this.twitchChannel, twitchOAuth: this.twitchOAuth, ttsOption: this.ttsOption, animazePort: this.animazePort, ttsApiKey: this.ttsApiKey, ttsVoiceId: this.ttsVoiceId, todaysStreamGoal: this.todaysStreamGoal, todaysTopics: this.todaysTopics, todaysWord: this.todaysWord }); } preload() { // Implement progressive loading this.load.on('progress', this.updateProgressBar, this); this.load.on('complete', this.completeLoading, this); // Preload audio files in chunks this.preloadAudioChunks(SONG_PLAYLIST_URLS, 2); // Load tmi.js as an asset this.load.script('tmi', 'https://play.rosebud.ai/assets/tmi.js?V277'); } preloadAudioChunks(urls, chunkSize) { for (let i = 0; i < urls.length; i += chunkSize) { const chunk = urls.slice(i, i + chunkSize); chunk.forEach((url, index) => { this.load.audio(`track_${i + index}`, url); }); } } updateProgressBar(value) { console.log(`Loading: ${parseInt(value * 100)}%`); // Update progress bar visuals here if needed } completeLoading() { if (typeof window.tmi !== 'undefined') { console.log('tmi.js loaded successfully, initializing game components'); } else { console.error('Failed to load tmi.js'); this.showErrorMessage('Failed to load Twitch integration. Some features may not be available.'); } // Initialize the music manager and other dependencies this.game.musicManager = new MusicManager(this.game); const musicKeys = SONG_PLAYLIST_URLS.map((_, index) => `track_${index}`); this.game.musicManager.setPlaylist(musicKeys); this.game.musicManager.playNextTrack(); this.game.musicManager.shufflePlaylist(); // Check for existing save and initialize the game state this.checkForExistingSave(); // Transition to another scene this.scene.start('ChatScene', { twitchChannel: this.twitchChannel, twitchOAuth: this.twitchOAuth, ttsOption: this.ttsOption, animazePort: this.animazePort, ttsApiKey: this.ttsApiKey, ttsVoiceId: this.ttsVoiceId, todaysStreamGoal: this.todaysStreamGoal, todaysTopics: this.todaysTopics, todaysWord: this.todaysWord }); console.log('Starting ChatScene with:', { twitchChannel: this.twitchChannel, twitchOAuth: this.twitchOAuth, ttsOption: this.ttsOption, animazePort: this.animazePort, todaysStreamGoal: this.todaysStreamGoal, todaysTopics: this.todaysTopics, todaysWord: this.todaysWord }); this.scene.stop('BootScene'); } showErrorMessage(message) { const text = this.add.text(this.cameras.main.centerX, this.cameras.main.centerY, message, { font: '18px Arial', fill: '#ffffff', align: 'center', wordWrap: { width: 300, useAdvancedWrap: true } }); text.setOrigin(0.5); this.time.delayedCall(5000, () => { text.destroy(); }); } checkForExistingSave() { const saveData = localStorage.getItem(PROJECT_NAME); if (saveData) { console.info('Save detected.'); this.game.saveData = JSON.parse(saveData); } else { console.info('No save detected. Initializing new game state.'); // If no save exists, initialize a new save with default values this.game.saveData = { chatLog: '', characterChatManagerState: null, // Assuming a default empty state is suitable }; // Save the initial state to localStorage localStorage.setItem(PROJECT_NAME, JSON.stringify(this.game.saveData)); } } } function loadScript(url) { return new Promise((resolve, reject) => { var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; script.onload = () => resolve(); script.onerror = () => reject(new Error('Script loading failed for ' + url)); document.head.appendChild(script); }); } class MusicManager { constructor(game) { this.game = game; this.playlist = []; this.currentTrackIndex = 0; this.isPlaying = false; } setPlaylist(musicKeys) { this.playlist = musicKeys; this.shufflePlaylist(); } shufflePlaylist() { for (let i = this.playlist.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); [this.playlist[i], this.playlist[j]] = [this.playlist[j], this.playlist[i]]; // Swap } console.log('Shuffled playlist:', this.playlist); } playNextTrack() { if (this.playlist.length === 0) { console.warn('Playlist is empty.'); return; } this.currentTrackIndex = (this.currentTrackIndex + 1) % this.playlist.length; console.log(`Playing next track: ${this.playlist[this.currentTrackIndex]}`); this.playMusicByKey(this.playlist[this.currentTrackIndex]); } playMusicByKey(musicKey) { if (!musicKey) { console.info('No music key provided, not changing current music.'); return; } console.log(`Playing music by key: ${musicKey}`); if (this.currentTrack && this.currentTrack.key !== musicKey) { this.stopMusic(); } if (!this.currentTrack) { this.startMusic(musicKey); } } async startMusic(musicKey) { if (!this.game || !this.game.sound) { console.error('Sound system is not ready or game instance is not valid.'); return; } this.currentTrack = this.game.sound.add(musicKey, { volume: 0.1, loop: false, }); this.currentTrack.play(); console.log(`Started playing: ${musicKey}`); this.currentTrack.on('complete', () => { console.log(`Track completed: ${musicKey}`); this.playNextTrack(); }); this.isPlaying = true; } stopMusic() { if (this.currentTrack) { console.log(`Stopping music: ${this.currentTrack.key}`); this.currentTrack.stop(); this.currentTrack.destroy(); this.currentTrack = null; } this.isPlaying = false; } toggleMusic() { if (this.currentTrack) { if (this.isPlaying) { console.log('Pausing music'); this.currentTrack.pause(); } else { console.log('Resuming music'); this.currentTrack.resume(); } this.isPlaying = !this.isPlaying; } } } class ChatScene extends Phaser.Scene { constructor() { super({ key: 'ChatScene', }); this.triviaGame = null; this.twitchManager = null; this.ttsManager = null; this.animazeManager = null; this.ttsOption = null; this.emoteButtons = []; // Array to store emote buttons this.animazePort = null; this.animazeConnectionCheckInterval = null; this.todaysStreamGoal = ''; this.todaysTopics = ''; this.todaysWord = ''; } init(data) { this.twitchChannel = data.twitchChannel; this.twitchOAuth = data.twitchOAuth; this.ttsOption = data.ttsOption; this.animazePort = data.animazePort; this.ttsApiKey = data.ttsApiKey; this.ttsVoiceId = data.ttsVoiceId; this.todaysStreamGoal = data.todaysStreamGoal || 'No stream goal set'; this.todaysTopics = data.todaysTopics || 'No topics set'; this.todaysWord = data.todaysWord || 'No word of the day set'; console.log('ChatScene: Initialized with data:', data); console.log('ChatScene: Initialized with TTS option:', this.ttsOption); console.log('ChatScene: Initialized with Twitch channel:', this.twitchChannel); console.log('ChatScene: Initialized with Twitch OAuth:', this.twitchOAuth ? 'Set' : 'Not set'); console.log('ChatScene: Today\'s Stream Goal:', this.todaysStreamGoal); console.log('ChatScene: Today\'s Topics:', this.todaysTopics); console.log('ChatScene: Today\'s Word:', this.todaysWord); } preload() { // Preload all global assets here (fonts, UI elements, sounds, etc.) this.load.image( 'background_image', BACKGROUND_IMAGE_URL, ); this.load.image( 'character_image', CHARACTER_IMAGE_URL, ); this.load.image( 'info_screen_vignette', `https://play.rosebud.ai/assets/vignette_desktop.png.png?h373`, ); this.load.image( 'music_off', `https://play.rosebud.ai/assets/audio_muted_icon.png.png?7b7F`, ); this.load.image( 'music_on', `https://play.rosebud.ai/assets/audio_playing_icon.png.png?QVdF`, ); this.load.image( 'restart', `https://play.rosebud.ai/assets/restart_loop_icon.png.png?EmvA`, ); } async create() { // Update CHARACTER_DESCRIPTION with the new values const updatedDescription = CHARACTER_DESCRIPTION + ` Here are the notes from the streamer: Today's Streaming Goal: "${this.todaysStreamGoal}" Today's Topics of Discussion: "${this.todaysTopics}" Today's Word of the Day: "${this.todaysWord}" ` // Initialize the character chat manager with the updated description this.characterChatManager = new ChatManager(updatedDescription); // Initialize the Trivia game this.triviaGame = new Trivia(this, this.characterChatManager); // Add the images to the scene with their initial positions this.createSceneElements(); // Initialize AnimazeManager this.animazeManager = new AnimazeManager(this); // Create the emote and pose buttons this.createEmoteAndPoseButtons(); ProgressLogger.logProgress('game-start', { sceneName: 'ChatScene' }); console.warn("Chat Scene reached."); // Initialize twitchManager this.twitchManager = new TwitchManager(this, this.chatMenu, this.animazeManager); // Initialize TTS based on the selected option if (this.ttsOption === 'elevenLabs') { this.ttsManager = new TTSManager(this); } else if (this.ttsOption === 'animazeChatpal') { // We'll use the existing animazeManager for ChatPal console.log('Using Animaze ChatPal for TTS'); } // Initialize MusicManager this.game.musicManager = new MusicManager(this.game); // Check if Twitch integration is available if (typeof window.tmi !== 'undefined') { // Initialize Twitch chat history this.twitchChatHistory = []; this.twitchChatHistoryBuffer = []; // Set up a timer to continuously check for new Twitch messages this.twitchChatTimer = setInterval(() => { this.checkForTwitchMessages(); }, 500); // Check every 0.5 seconds // Set up a timer to handle getting a response more frequently this.responseTimer = setInterval(() => { this.handleTwitchResponse(); }, 5000); // Process responses every 5 seconds } else { console.warn("Twitch integration is not available. Some features will be limited."); this.chatMenu.updateChatLog(CHARACTER_NAME, "Twitch integration is not available. You can still interact with me directly!", true); } // Fetch and compile the actions list await this.compileActionsList(); const aiAnalyzerDescription = ` You are an analyzer for another ai's text. You will only reply an emote or a pose. Actions List: ${this.actionsList} ` this.aiAnalyzerChatManager = new ChatManager(aiAnalyzerDescription); } async compileActionsList() { this.actionsList = ''; if (this.animazeManager && this.animazeManager.connected) { try { const emotes = await this.animazeManager.getEmotes(); const poses = await this.animazeManager.getPoses(); const idles = await this.animazeManager.getIdleAnims(); const avatars = await this.animazeManager.getAvatars(); const scenes = await this.animazeManager.getScenes(); this.actionsList += 'Emotes: ' + emotes.map(e => e.itemName).join(', ') + '\n'; this.actionsList += 'Poses: ' + poses.map(p => p.animName).join(', ') + '\n'; this.actionsList += 'Idle Animations: ' + idles.map(i => i.animName).join(', ') + '\n'; this.actionsList += 'Avatars: ' + avatars.join(', ') + '\n'; this.actionsList += 'Scenes: ' + scenes.join(', '); } catch (error) { console.error('Error compiling actions list:', error); this.actionsList = 'Failed to fetch actions list.'; } } else { this.actionsList = 'AnimazeManager is not connected. Actions list unavailable.'; } console.log('Compiled actions list:', this.actionsList); } createEmoteAndPoseButtons() { this.animationsContainer = this.add.container(400, 40); this.animationsContainer.setDepth(1000); this.createTabs(); this.updateEmoteAndPoseButtons(); } createTabs() { const tabWidth = 70; const tabHeight = 30; const tabPadding = 5; const types = ['emote', 'pose', 'idle', 'avatar', 'scene']; types.forEach((type, index) => { const x = index * (tabWidth + tabPadding); const tab = this.add.rectangle(x, 0, tabWidth, tabHeight, 0x5A7894) .setOrigin(0) .setInteractive(); const text = this.add.text(x + tabWidth / 2, tabHeight / 2, type.toUpperCase(), { fontSize: '12px', fontFamily: 'Arial, Helvetica, sans-serif', fill: '#ffffff', resolution: 2 }).setOrigin(0.5); text.setScale(1 / this.cameras.main.zoom); tab.on('pointerdown', () => this.switchTab(type)); this.animationsContainer.add([tab, text]); }); this.currentTab = 'emote'; } switchTab(type) { this.currentTab = type; this.clearTabContent(); switch (type) { case 'emote': case 'pose': case 'idle': this.updateEmoteAndPoseButtons(); break; case 'avatar': this.updateAvatarButtons(); break; case 'scene': this.updateSceneButtons(); break; } } async updateAvatarButtons() { if (this.animazeManager && this.animazeManager.connected) { try { const avatars = await this.animazeManager.getAvatars(); this.displayButtons(avatars, this.animationsContainer, 'avatar', 40); } catch (error) { console.error('Error fetching avatars:', error); } } else { console.error('AnimazeManager is not connected'); } } async updateSceneButtons() { if (this.animazeManager && this.animazeManager.connected) { try { const scenes = await this.animazeManager.getScenes(); this.displayButtons(scenes, this.animationsContainer, 'scene', 40); } catch (error) { console.error('Error fetching scenes:', error); } } else { console.error('AnimazeManager is not connected'); } } clearTabContent() { // Remove all items except the first 10 (5 tabs and 5 texts) while (this.animationsContainer.list.length > 10) { const item = this.animationsContainer.list.pop(); item.destroy(); } } async updateEmoteAndPoseButtons() { if (this.animazeManager && this.animazeManager.connected) { let items; switch (this.currentTab) { case 'emote': items = await this.animazeManager.getEmotes(); break; case 'pose': items = await this.animazeManager.getPoses(); break; case 'idle': items = await this.animazeManager.getIdleAnims(); break; } if (items) { this.displayButtons(items, this.animationsContainer, this.currentTab, 40); } } else { console.error('AnimazeManager is not connected'); } } displayButtons(items, container, type, startY) { const boxWidth = 55; const boxHeight = 55; const padding = 5; const columns = 6; items.forEach((item, index) => { const row = Math.floor(index / columns); const col = index % columns; const x = col * (boxWidth + padding); const y = startY + row * (boxHeight + padding); const button = this.add.rectangle(x, y, boxWidth, boxHeight, 0x5A7894) .setOrigin(0) .setInteractive(); const text = this.add.text(x + boxWidth / 2, y + boxHeight / 2, item.animName || item.friendlyName || item || 'Unknown', { fontSize: '10px', fontFamily: 'Arial, Helvetica, sans-serif', fill: '#ffffff', align: 'center', wordWrap: { width: boxWidth - 5 }, resolution: 2 }).setOrigin(0.5); text.setScale(1 / this.cameras.main.zoom); const updateButtonStyle = (fillColor, textColor) => { if (button && !button.destroyed) { button.setFillStyle(fillColor); } if (text && !text.destroyed) { text.setStyle({ fill: textColor }); } }; button.on('pointerover', () => updateButtonStyle(0x7A98B4, '#ffff00')); button.on('pointerout', () => updateButtonStyle(0x5A7894, '#ffffff')); button.on('pointerdown', () => { if (this.animazeManager && this.animazeManager.connected) { switch (type) { case 'emote': console.log(`Triggering emote: ${item.itemName}`); this.animazeManager.triggerEmote(item.itemName); break; case 'pose': console.log(`Triggering pose: ${item.animName} (index: ${item.index})`); this.animazeManager.triggerPose(item.index); break; case 'idle': console.log(`Triggering idle animation: ${item.animName} (index: ${item.index})`); this.animazeManager.triggerIdle(item.index); break; case 'avatar': console.log(`Loading avatar: ${item}`); this.animazeManager.loadAvatar(item); break; case 'scene': console.log(`Loading scene: ${item}`); this.animazeManager.loadScene(item); break; default: console.error(`Unknown button type: ${type}`); } } else { console.error('AnimazeManager is not connected'); } }); if (container && !container.destroyed) { container.add([button, text]); } }); } triggerEmote(itemName) { if (this.animazeManager && this.animazeManager.connected) { this.animazeManager.triggerEmote(itemName); } else { console.error('AnimazeManager is not connected'); } } triggerPose(poseName) { if (this.animazeManager && this.animazeManager.connected) { this.animazeManager.triggerPose(poseName); } else { console.error('AnimazeManager is not connected'); } } checkForTwitchMessages() { if (this.twitchChatHistoryBuffer.length > 0) { // At least one message has been received from Twitch const twitchMessages = this.twitchChatHistoryBuffer; this.twitchChatHistory.push(...twitchMessages); console.log(`Twitch messages received and added to history: ${twitchMessages.join(', ')}`); this.twitchChatHistoryBuffer = []; // Clear the buffer } else { console.log('No new Twitch messages received in this check.'); } // Process held messages if chatbot is not speaking if (!this.animazeManager.getIsChatbotSpeaking() && this.twitchManager.heldMessages.length > 0) { console.log('Processing held messages...'); const heldMessages = this.twitchManager.heldMessages; this.twitchManager.heldMessages = []; // Clear held messages this.twitchManager.processTwitchMessages(heldMessages); } } handleTwitchResponse() { if (this.twitchChatHistory.length > 0 && !this.animazeManager.getIsChatbotSpeaking()) { const combinedTwitchMessages = this.twitchChatHistory.join('\n'); console.log(`Processing Twitch messages: ${combinedTwitchMessages}`); this.twitchChatHistory = []; // Clear the chat history after processing // Parse each message individually const messages = combinedTwitchMessages.split('\n'); let shouldRespondToChat = true; messages.forEach(message => { try { const parsedMessage = JSON.parse(message); const user = parsedMessage.user; const messageContent = parsedMessage.message.trim(); console.log(`Processing message from ${user}: ${messageContent}`); const isCommand = messageContent.toLowerCase().startsWith('!'); if (isCommand) { shouldRespondToChat = false; console.log(`Command detected: ${messageContent}`); this.handleCommand(user, messageContent); } else if (this.triviaGame.isGameActive() && this.triviaGame.currentQuestion) { this.triviaGame.checkAnswer(message); } else { // Normal chat processing this.characterChatManager.addMessage('user', `${user}: ${messageContent}`); } } catch (error) { console.error('Error parsing message:', error); } }); // Respond only if trivia is not active and no commands were used if (!this.triviaGame.isGameActive() && shouldRespondToChat) { console.log('Preparing to get character response...'); this.characterChatManager.getCharacterResponse('classify').then((characterResponse) => { console.log(`Character response received: ${characterResponse}`); this.characterChatManager.addMessage('assistant', characterResponse); this.chatMenu.updateChatLog(CHARACTER_NAME, characterResponse, true); this.chatMenu.saveGameState(); // Send the character's response to the AI Analyzer this.aiAnalyzerChatManager.addMessage('user', characterResponse); this.aiAnalyzerChatManager.getCharacterResponse('classify').then((analyzerResponse) => { console.log(`AI Analyzer response received: ${analyzerResponse}`); this.handleAIAnalyzerResponse(analyzerResponse); }).catch(error => { console.error('Error getting AI Analyzer response:', error); }); }).catch(error => { console.error('Error getting character response:', error); }); } else { console.log(`Not responding: Trivia active: ${this.triviaGame.isGameActive()}, Should respond: ${shouldRespondToChat}`); } } else { console.log('No Twitch messages to process in this cycle or chatbot is speaking.'); } } handleAIAnalyzerResponse(analyzerResponse) { // Parse the analyzer response to determine if it's an emote, pose, or other action const lowerCaseResponse = analyzerResponse.toLowerCase(); if (this.animazeManager && this.animazeManager.connected) { if (lowerCaseResponse.includes('emote:')) { const emoteName = lowerCaseResponse.split('emote:')[1].trim(); this.animazeManager.triggerEmote(emoteName); } else if (lowerCaseResponse.includes('pose:')) { const poseName = lowerCaseResponse.split('pose:')[1].trim(); this.animazeManager.triggerPose(poseName); } else if (lowerCaseResponse.includes('idle:')) { const idleName = lowerCaseResponse.split('idle:')[1].trim(); this.animazeManager.triggerIdle(idleName); } else if (lowerCaseResponse.includes('avatar:')) { const avatarName = lowerCaseResponse.split('avatar:')[1].trim(); this.animazeManager.loadAvatar(avatarName); } else if (lowerCaseResponse.includes('scene:')) { const sceneName = lowerCaseResponse.split('scene:')[1].trim(); this.animazeManager.loadScene(sceneName); } else { console.log('AI Analyzer response does not match any known action:', analyzerResponse); } } else { console.error('AnimazeManager is not connected'); } } handleCommand(user, messageContent) { const command = messageContent.toLowerCase(); if (command === '!trivia') { if (!this.triviaGame.isGameActive()) { console.log('Starting Trivia game'); this.triviaGame.startGame(); } else { console.log('Joining Trivia game'); this.triviaGame.joinGame(user); } } else if (command.startsWith('!trivia ')) { const category = messageContent.slice(8).trim(); if (this.triviaGame.isGameActive() && this.triviaGame.categorySelectionPhase) { console.log(`Suggesting Trivia category: ${category}`); this.triviaGame.suggestCategory(user, category); } else { this.chatMenu.updateChatLog(CHARACTER_NAME, "Sorry, it's not the right time to suggest a category.", true); } } else if (command.startsWith('!runescape') || command.startsWith('!questlist') || command.startsWith('!questwalkthrough')) { this.handleRunescapeCommands(user, messageContent); } else if (command.startsWith('!animaze ')) { this.handleAnimazeCommands(user, messageContent); } } handleAnimazeCommands(user, messageContent) { const parts = messageContent.split(' '); if (parts.length < 2) return; const subCommand = parts[1].toLowerCase(); switch (subCommand) { case 'loadavatar': if (parts.length < 3) { this.chatMenu.updateChatLog(CHARACTER_NAME, "Please specify an avatar name.", true); return; } const avatarName = parts.slice(2).join(' '); this.animazeManager.loadAvatar(avatarName); this.chatMenu.updateChatLog(CHARACTER_NAME, `Attempting to load avatar: ${avatarName}`, true); break; // Add more Animaze commands here as needed default: this.chatMenu.updateChatLog(CHARACTER_NAME, "Unknown Animaze command. Available commands: loadavatar", true); } } handleRunescapeCommands(user, messageContent) { if (messageContent.toLowerCase() === '!runescape') { const response = "Runescape commands available:\n!QuestList - Get a list of quests\n!QuestWalkthrough - Get a walkthrough for a specific quest"; this.chatMenu.updateChatLog(CHARACTER_NAME, response, true); } else if (messageContent.toLowerCase() === '!questlist') { this.twitchManager.displayQuestList(); } else if (messageContent.toLowerCase().startsWith('!questwalkthrough ')) { const questName = messageContent.slice(18).trim(); const questUrl = `https://oldschool.runescape.wiki/w/${questName.replace(/ /g, '_')}`; this.twitchManager.scrapeQuestInfo(questUrl); } } createSceneElements() { // Background image setup let backgroundImage = this.textures.get('background_image').getSourceImage(); let backgroundWidth = backgroundImage.width; let backgroundHeight = backgroundImage.height; let backgroundScaleFactorWidth = 800 / backgroundWidth; let backgroundScaledHeight = backgroundHeight * backgroundScaleFactorWidth; let backgroundScaleFactor = backgroundScaleFactorWidth; if (backgroundScaledHeight < 600) { let backgroundScaleFactorHeight = 600 / backgroundHeight; backgroundScaleFactor = backgroundScaleFactorHeight; } let backgroundScaledWidth = backgroundWidth * backgroundScaleFactor; let backgroundXOffset = (800 - backgroundScaledWidth) / 2; let backgroundSprite = this.add.image(backgroundXOffset, 0, 'background_image') .setOrigin(0, 0) .setDepth(-10) .setInteractive() .setDisplaySize(backgroundScaledWidth, 600); // Ensure the height matches the screen height, potentially cutting off sides // Character image setup let characterImage = this.textures.get('character_image').getSourceImage(); let characterWidth = characterImage.width * 1.5; let characterHeight = characterImage.height * 1.5; let characterScaleFactor = 550 / characterHeight; // Adjusted to scale based on height let characterScaledWidth = characterWidth * characterScaleFactor; // Positioning character image near the right of the screen let characterXOffset = 800 - characterScaledWidth - 30; // 10 pixels padding from the right edge let characterSprite = this.add.image(characterXOffset, (600 - 550) / 2, 'character_image') .setOrigin(0, 0) .setDepth(11) // Ensuring it appears above the background .setInteractive() .setDisplaySize(characterScaledWidth, 550) .setVisible(false); // Height set to 550, width adjusted to maintain aspect ratio // Other scene elements this.vignette = this.add.image(0, 0, 'info_screen_vignette').setOrigin(0, 0).setDepth(12).setInteractive(); createMuteToggleButton(this); createDeleteSaveButton(this); this.chatMenu = new ChatMenu(this, backgroundSprite, this.characterChatManager); // Force game resize event to fix clicking on Safari mobile devices this.scale.resize(this.scale.gameSize._width, this.scale.gameSize._height); } shutdown() { if (this.animazeConnectionCheckInterval) { clearInterval(this.animazeConnectionCheckInterval); } } } // ChatManager is already imported in the current scope. class ChatMenu { constructor( scene, characterSprite, characterChatManager, ttsOption ) { this.scene = scene; this.characterChatManager = characterChatManager; this.characterSprite = characterSprite; this.ttsOption = ttsOption; this.waitingForResponse = false; this.createChatUI().then(() => { this.loadSavedChat(); if (!document.getElementById('chatLogContent').innerHTML.trim()) { this.getInitialGreeting(); this.saveGameState(); this.waitingForResponse = false; } }); } injectCSS() { const styleExists = document.getElementById('rotateImageStyle'); if (!styleExists) { const style = document.createElement('style'); style.id = 'rotateImageStyle'; style.type = 'text/css'; style.innerHTML = ` .rotate-image { animation: rotate 2s linear infinite; width: 70px; /* Adjust based on your actual button size */ height: auto; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }`; document.getElementsByTagName('head')[0].appendChild(style); } } async createChatUI() { this.injectCSS(); // Inject the CSS for rotation // Base style remains the same const baseStyle = ` font-family: 'Verdana', sans-serif; font-size: 16px; color: #FFF; // Original color set to black border-style: solid; border-color: #2F4152; background-color: rgba(48, 50, 54, 0.9); // Changed the background-color to be less transparent box-sizing: border-box; `; const chatLogStyle = ` ${baseStyle} width: 390px; /* Match game width */ height: 415px; border-radius: 30px 30px 0px 0px; padding: 10px 30px; overflow-y: auto; box-sizing: border-box; border-width: 1px 1px 0px 1px; `; // Style for input and send button container const inputSubmitContainerStyle = ` display: flex; width: 390px; /* Match game width */ justify-content: space-between; /* Distribute space between input and button */ `; // Adjusted styles for input and button to fit within container const inputStyle = ` ${baseStyle} flex-grow: 1; height: 37.5px; padding: 10px; border-width: 1px 0px 1px 1px; border-radius: 0px 0px 0px 0px; `; const sendButtonStyle = ` ${baseStyle} display: flex; /* Use flexbox for alignment */ justify-content: center; /* Center content horizontally */ align-items: center; /* Center content vertically */ width: 75px; /* Adjust based on visual preference */ height: 60px; padding: 10px; border-width: 1px 1px 1px 1px; cursor: pointer; /* Change cursor to pointer to indicate it's clickable */ overflow: hidden; /* Prevent content from spilling outside the button */ border-radius: 0px 0px 30px 0px; `; const chatLogContentStyle = ` direction: ltr; display: inline-block; width: 100%; `; // Parent container for chat log and controls, justified at the bottom const chatContainerStyle = ` display: flex; flex-direction: column; justify-content: flex-end; width: 390px; /* Match game width */ height: 844px; /* Full height to allow justification to the bottom */ position: absolute; bottom: 0; /* Align to the bottom of the game view */ `; // Creating the parent container for chat log and chat controls this.chatContainer = this.scene.add.dom(0, 0).createFromHTML(`

`); // Adjust positioning based on your layout needs. Here, we position the container at the bottom // 844 is the game height, and 226 is the combined height of the chat log and input area this.chatContainer.setPosition(30, 565); // Event listeners for chat input and send button const chatInput = this.chatContainer.node.querySelector('#chatInput'); const sendButton = this.chatContainer.node.querySelector('#sendButton'); chatInput.addEventListener('keyup', (event) => { if ((event.key === 'Enter' || event.keyCode === 13) && !this.waitingForResponse) { this.sendChatMessage(this.characterChatManager); } }); sendButton.addEventListener('click', () => { this.sendChatMessage(this.characterChatManager); }); } async getInitialGreeting() { // Update button to show loading icon sendButton.innerHTML = '

'; sendButton.disabled = true; this.characterChatManager.addMessage('user', "*Give a short, one-sentence introduction as the AI Host for TheRealCoCoGaming's Twitch channel.*"); // Assume getCharacterResponse() is an async operation const characterResponse = await this.characterChatManager.getCharacterResponse('chat'); this.characterChatManager.addMessage('assistant', characterResponse); this.updateChatLog(CHARACTER_NAME, characterResponse, async () => { this.saveGameState(); // Revert the send button back to its original state sendButton.innerHTML = 'SEND'; sendButton.disabled = false; }); } async sendChatMessage() { const chatInput = document.getElementById('chatInput'); const sendButton = document.getElementById('sendButton'); const inputValue = chatInput.value; console.log(`Attempting to send chat message: "${inputValue}"`); console.log(`Waiting for response: ${this.waitingForResponse}`); if (inputValue && !this.waitingForResponse) { console.log('Conditions met, proceeding with message send'); // Update button to show loading icon sendButton.innerHTML = '

'; sendButton.disabled = true; this.characterChatManager.addMessage('user', inputValue); this.updateChatLog('Player', inputValue); chatInput.value = ''; // Clear input console.log('Requesting character response...'); // Assume getCharacterResponse() is an async operation const characterResponse = await this.characterChatManager.getCharacterResponse('classify'); console.log(`Character response received: "${characterResponse}"`); ProgressLogger.logProgress('game-chat', { userMessage: inputValue, characterResponse: characterResponse }); this.characterChatManager.addMessage('assistant', characterResponse); this.updateChatLog(CHARACTER_NAME, characterResponse, true, async () => { // Pass true to hold off on getting response this.saveGameState(); // Revert the send button back to its original state sendButton.innerHTML = 'SEND'; sendButton.disabled = false; console.log('Chat message process completed'); }); } else { console.log('Cannot send message: Either input is empty or waiting for response'); } } updateChatLog(speaker, message, holdOffResponse = false, onComplete) { console.log('ChatMenu: Updating chat log'); this.waitingForResponse = true; const chatLogContentDiv = document.getElementById('chatLogContent'); let newMessageElement = document.createElement('p'); newMessageElement.innerHTML = `${speaker}: `; chatLogContentDiv.appendChild(newMessageElement); if (speaker === 'Player') { newMessageElement.innerHTML += message; this.waitingForResponse = false; onComplete?.(); } else { let i = 0; const animateText = (timestamp) => { if (i < message.length) { newMessageElement.innerHTML += message[i]; i++; if (i % 5 === 0) { const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; } requestAnimationFrame(animateText); } else { this.waitingForResponse = false; if (!holdOffResponse) { onComplete?.(); } const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; if (speaker === CHARACTER_NAME) { console.log('ChatMenu: Character spoke, checking TTS option'); console.log('ChatMenu: TTS option:', this.scene.ttsOption); if (this.scene.ttsOption === 'elevenLabs' && this.scene.ttsManager) { console.log('ChatMenu: Using ElevenLabs TTS'); this.scene.ttsManager.speakText(message); } else if (this.scene.ttsOption === 'animazeChatpal' && this.scene.animazeManager) { console.log('ChatMenu: Using Animaze ChatPal'); if (this.scene.animazeManager.isConnected()) { this.scene.animazeManager.sendChatPalMessage(message, true); // Use echo mode } else { console.error('ChatMenu: Animaze ChatPal is not connected'); this.scene.animazeManager.checkWebSocketStatus(); this.updateChatLog(CHARACTER_NAME, "Unable to send message to Animaze ChatPal: Not connected", true); } } else { console.log('ChatMenu: No valid TTS option selected or manager not available'); } } } }; requestAnimationFrame(animateText); } } saveGameState() { console.info('Saving game.'); const saveData = localStorage.getItem(PROJECT_NAME); let parsedSaveData = saveData ? JSON.parse(saveData) : {}; // Get the current chat log content const chatLogContent = document.getElementById('chatLogContent').innerHTML; // Serialize the character-specific ChatManager's state if (this.characterChatManager) { const characterChatManagerState = JSON.stringify(this.characterChatManager); // Update the specific character's chat manager state in the saved data parsedSaveData.characterChatManagerState = characterChatManagerState; } // Update the game save data with the current chat log and love bar level parsedSaveData.chatLog = chatLogContent; // Save the updated game state to localStorage localStorage.setItem(PROJECT_NAME, JSON.stringify(parsedSaveData)); console.info('Game state saved.'); } loadSavedChat() { const saveData = localStorage.getItem(PROJECT_NAME); if (!saveData) { console.error('No save data found.'); } const parsedSaveData = JSON.parse(saveData); // Deserialize and apply the character's ChatManager state if it exists if (parsedSaveData.characterChatManagerState) { const characterChatManagerState = JSON.parse( parsedSaveData.characterChatManagerState, ); Object.assign(this.characterChatManager, characterChatManagerState); } // Load the chat log if (parsedSaveData.chatLog) { document.getElementById('chatLogContent').innerHTML = parsedSaveData.chatLog; console.info(`CHATLOG STATE LOADED: \n\n${parsedSaveData.chatLog}`); } else { console.warn('Chatlog content is missing from save.'); } console.info('Game state loaded.'); } } function createMuteToggleButton(scene) { let isMusicPlaying = scene.game.musicManager && scene.game.musicManager.currentTrack && scene.game.musicManager.currentTrack.isPlaying; let buttonTexture = isMusicPlaying ? 'music_on' : 'music_off'; let muteButton = scene.add.image(30, 40, buttonTexture).setOrigin(0, 0).setInteractive(); muteButton.setDepth(1000); // Ensure it's above other elements let lastToggleTime = 0; const toggleDelay = 500; // 500 milliseconds delay muteButton.on('pointerdown', () => { const currentTime = Date.now(); if (currentTime - lastToggleTime < toggleDelay) { // If the button is pressed again too quickly, don't do anything return; } lastToggleTime = currentTime; // Toggle the music state if musicManager exists if (scene.game.musicManager) { scene.game.musicManager.toggleMusic(); isMusicPlaying = scene.game.musicManager.currentTrack && scene.game.musicManager.currentTrack.isPlaying; muteButton.setTexture(isMusicPlaying ? 'music_on' : 'music_off'); } else { console.warn('Music manager not initialized'); } }); return muteButton; // Return the mute button for further use } function createDeleteSaveButton(scene) { let deleteButton = scene.add.image(90, 40, 'restart').setOrigin(0, 0).setScale(0.90).setInteractive(); deleteButton.setDepth(1000); // Ensure it's above other elements deleteButton.on('pointerdown', () => { showDeleteConfirmation(scene); }); return deleteButton; // Return the button for further use } function showDeleteConfirmation(scene) { // CSS for the confirmation dialog const dialogStyle = ` display: flex; flex-direction: column; justify-content: space-evenly; align-items: center; text-align: center; height: 200px; width: 300px; padding-left: 10px; /* Added left padding */ padding-right: 10px; /* Added right padding */ border-radius: 8px; border-style: solid; border-color: #2F4152; border-width: 1px; background-color: rgba(255, 255, 255, 0.85); box-sizing: border-box; /* Ensures padding doesn't affect the overall width */ `; // CSS for the confirm and cancel buttons, similar to the confirm button in name selection const buttonStyle = ` font-size: 14px; padding: 10px; cursor: pointer; border-radius: 8px; color: #FFF; background-color: #5A7894; margin: 5px; `; // HTML content for the confirmation dialog const confirmationHtml = `

Are you sure you want to delete your save?

`; // Add the HTML dialog to the scene const confirmationDialog = scene.add .dom(scene.cameras.main.centerX, scene.cameras.main.centerY) .createFromHTML(confirmationHtml); // Handle the confirm button click const confirmDeleteButton = confirmationDialog.getChildByID('confirmDelete'); confirmDeleteButton.addEventListener('click', () => { // Delete the save localStorage.removeItem(PROJECT_NAME); // Assuming resetGame is globally accessible or adjust scope accordingly resetGame(); // Note: Since resetGame() reinitializes the game, // ensure any subsequent code here is compatible with your game's reset logic. // Depending on how resetGame is implemented, you might not need to manually navigate // to 'StoryInfoScene' as the game reset process should handle scene (re)loading. }); // Handle the cancel button click const cancelDeleteButton = confirmationDialog.getChildByID('cancelDelete'); cancelDeleteButton.addEventListener('click', () => { confirmationDialog.destroy(); // Close the dialog without deleting }); } function resetGame() { if (window.game) { window.game.destroy(true); // true to remove all game objects initializeGame(); // Reinitialize the game } } const VERSION_NUMBER = 'v1'; // Set the version number here. const PROJECT_NAME = `${CHARACTER_NAME} AI Character ${VERSION_NUMBER}`; async function initializeGame() { try { // Load the external script before initializing the Phaser game await loadScript(`https://play.rosebud.ai/assets/cocobot1.js?A1sR`); console.log('Script loaded successfully'); const config = { type: Phaser.AUTO, parent: 'renderDiv', scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 800, height: 600, scene: [StartScene, BootScene, ChatScene], dom: { createContainer: true, }, fps: { target: 30, forceSetTimeOut: true }, disableContextMenu: true }; window.game = new Phaser.Game(config); } catch (error) { console.error('Failed to load external script or initialize the Phaser game:', error); } } initializeGame();