// ChatManager is already imported in the current scope. var CHARACTER_DESCRIPTION = 'You are the player\'s energetic talking pet called Buckmon eager for affection from the player. You speak in an eager, somewhat childish way and say Chyeah everytime you speak.'; const baseStyle = ` font-family: 'Garamond', serif; font-size: 16px; font-weight: bold; border: solid rgba(255, 255, 255, 1.0); box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); `; const chatLogStyle = ` ${baseStyle} width: 800px; height: 125px; border-width: 1.5px 1.5px 1.5px 1.5px; background-color: rgba(0, 0, 0, 0.7); padding: 30px; overflow-y: auto; `; const chatLogContentStyle = ` direction: ltr; display: inline-block; width: 100%; `; const inputStyle = ` ${baseStyle} width: 720px; height: 30px; background-color: rgba(0, 0, 0, 0.7); padding-left: 30px; border-width: 0px 0px 1.5px 1.5px; color: rgba(255, 255, 255, 1.0); overflow-x: auto; `; const sendButtonStyle = ` ${baseStyle} width: 80px; height: 30px; color: #e0d7c5; border-width: 0px 1.5px 1.5px 1.5px; background-color: rgba(0, 0, 0, 0.7); `; class ChatScene extends Phaser.Scene { constructor() { super(); this.songs = []; this.isMuted = false; this.muteButton = null; } preload() { // Existing assets this.load.image('background', `https://play.rosebud.ai/assets/ladnscape 3.jpg?kI67`); this.load.image('restart', `https://play.rosebud.ai/assets/restart button.png?5Uec`); this.load.image('soundOn', 'https://i.imgur.com/8mqRn3K.png'); this.load.image('soundOff', 'https://i.imgur.com/UmfvCU3.png'); this.load.audio('song1', 'https://storage.googleapis.com/rosebud_assets_storage/80ab990c-8385-46e0-b2a2-ad9b3f5e892d.mp3'); // New assets this.load.image('dogTreat', 'https://storage.googleapis.com/rosebud_assets_storage/2ce24d16-7701-42de-a500-65c7597609ae.png'); this.load.image('tennisBall', 'https://storage.googleapis.com/rosebud_assets_storage/c95e8d1a-c7e2-48dc-83ff-2f4e51efac2b.png'); this.load.image('happyPet', `https://play.rosebud.ai/assets/Happy Monster.png?zjAc`); this.load.image('neutralPet', `https://play.rosebud.ai/assets/Neutral Monster.png?1LdM`); this.load.image('sadPet', `https://play.rosebud.ai/assets/Sad Monster.png?acv5`); this.load.image('hungryPet', `https://play.rosebud.ai/assets/Hungry Monster.png?5208`); } create() { this.add.image(400, 300, 'background').setScale(1.0); // Initialize both sprites this.neutralSprite = this.add.image(this.scale.width / 2, (this.scale.height / 2), 'neutralSprite').setScale(0.30); this.happySprite01 = this.add.image(this.scale.width / 2, (this.scale.height / 2), 'happySprite01').setScale(0.30); this.happySprite01.visible = false; // Start with happy sprite hidden // Implement breathing animation // (Make sure this is the corrected version without duplicated code) this.tweens.add({ targets: [this.neutralSprite, this.happySprite01], scaleY: 0.72, yoyo: true, repeat: -1, ease: 'Sine.easeInOut', duration: 900, }); const restart = this.add.image(40, 30, 'restart').setScale(0.55).setInteractive(); // Mute toggle button this.muteButton = this.add.image(40, 80, 'soundOn').setScale(0.23).setInteractive(); // Background music setup with reduced volume this.songs.push(this.sound.add('song1', { volume: 0.005, loop: true })); // Volume reduced this.songs[0].play(); this.chatManager = new ChatManager(CHARACTER_DESCRIPTION); this.add.dom(400, 506).createFromHTML(`

`); const chatInput = this.add.dom(360, 585).createFromHTML(` `); const sendButton = this.add.dom(760, 585).createFromHTML(` `); chatInput.node.addEventListener('keyup', (event) => { if (event.key === "Enter" || event.keyCode === 13) { this.sendChatMessage(this.chatManager); } }); sendButton.addListener('click').on('click', () => { this.sendChatMessage(this.chatManager); }); restart.on('pointerdown', () => { const confirmReset = window.confirm("Are you sure you want to clear the chat?"); if (confirmReset) { if (this.chatManager.cleanChatHistory) { this.chatManager.cleanChatHistory(); } const chatLogContentDiv = document.getElementById('chatLogContent'); chatLogContentDiv.innerHTML = ''; } }); // Add initial character message const initialCharacterMessage = "Heyo! I'm Buddy, the best pet around! Please don't forget to feed, play, and chat with me."; this.animateChatLog('Buddy', initialCharacterMessage); // Mute toggle functionality this.muteButton.on('pointerdown', () => { this.isMuted = !this.isMuted; this.sound.mute = this.isMuted; this.muteButton.setTexture(this.isMuted ? 'soundOff' : 'soundOn'); }); // Create circular buttons for icons const buttonStyle = { fillStyle: { color: 0x000000, alpha: 0.7 }, lineStyle: { color: 0xffffff, width: 2 }, add: true, }; // Treat button this.add.circle(360, 40, 28, buttonStyle.fillStyle).setStrokeStyle(buttonStyle.lineStyle.width, buttonStyle.lineStyle.color); // Positioned to top this.dogTreatIcon = this.add.image(360, 40, 'dogTreat').setScale(0.1).setInteractive(); // Tennis ball button this.add.circle(440, 40, 28, buttonStyle.fillStyle).setStrokeStyle(buttonStyle.lineStyle.width, buttonStyle.lineStyle.color); // Positioned to top this.tennisBallIcon = this.add.image(440, 40, 'tennisBall').setScale(0.1).setInteractive(); // Pet state this.hunger = 100; this.mood = 3; // 3: Happy, 2: Neutral, 1: Sad // Revised status box style const statusBoxStyle = ` font-family: 'Courier New', monospace; // Using Courier New font font-size: 16px; font-weight: bold; text-align: right; padding: 15px; border: solid rgba(255, 255, 255, 1.0); // White border box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); width: 200px; height: 150px; background-color: rgba(0, 0, 0, 0.7); // Semi-transparent black background border-width: 1.5px 1.5px 1,5px 1.5px; color: #FFF; // Light text color position: absolute; `; this.add.dom(700, 370).createFromHTML(`

STATUS: SATISFIED
HUNGER: ${this.hunger}
MOOD: HAPPY
LVL: 1

`); // Icons resized annd positioned this.dogTreatIcon = this.add.image(360, 40, 'dogTreat').setScale(0.1).setInteractive(); // Reduced scale and positioned to top this.tennisBallIcon = this.add.image(440, 40, 'tennisBall').setScale(0.1).setInteractive(); // Reduced scale and positioned to top // Event listeners for icons this.dogTreatIcon.on('pointerdown', () => this.feedPet()); this.tennisBallIcon.on('pointerdown', () => this.playWithPet()); // Timers for mood and hunger this.time.addEvent({ delay: 10000, callback: this.decreaseHunger, callbackScope: this, loop: true }); this.time.addEvent({ delay: 20000, callback: this.changeMood, callbackScope: this, loop: true }); // Load pet sprites this.load.image('happyPet', `https://play.rosebud.ai/assets/Happy Monster.png?zjAc`); this.load.image('neutralPet', `https://play.rosebud.ai/assets/Neutral Monster.png?1LdM`); this.load.image('sadPet', `https://play.rosebud.ai/assets/Sad Monster.png?acv5`); this.load.image('hungryPet', `https://play.rosebud.ai/assets/Hungry Monster.png?5208`); // Add pet sprite to the scene this.petSprite = this.add.image(this.scale.width / 2, (this.scale.height / 2), 'happyPet').setScale(0.75); } feedPet() { this.hunger = 100; this.updateStatusBox(); this.updatePetSprite(); this.updateChatLog('SYSTEM', 'You fed your pet.', '#FFFF99'); // soft yellow text } playWithPet() { if (this.mood < 3) this.mood++; this.updateStatusBox(); this.updatePetSprite(); this.updateChatLog('SYSTEM', 'You played with your pet.', '#FFFF99'); // soft yellow text } decreaseHunger() { this.hunger = Math.max(this.hunger - 10, 0); this.updateStatusBox(); this.updatePetSprite(); } changeMood() { if (this.mood > 1) this.mood--; this.updateStatusBox(); this.updatePetSprite(); } updateStatusBox() { let statusBox = document.getElementById('statusBox'); let moodText = ['Sad', 'Neutral', 'Happy'][this.mood - 1]; let statusText = this.hunger <= 30 ? 'HUNGRY' : 'SATISFIED'; statusBox.innerHTML = ` STATUS: ${statusText}
HUNGER: ${this.hunger}
MOOD: ${moodText}
LVL: 1 `; } updatePetSprite() { let spriteKey; if (this.hunger <= 30) { spriteKey = 'hungryPet'; } else { spriteKey = this.mood === 3 ? 'happyPet' : this.mood === 2 ? 'neutralPet' : 'sadPet'; } this.petSprite.setTexture(spriteKey); } async sendChatMessage(chatManager) { const inputValue = document.getElementById('chatInput').value; if (inputValue) { chatManager.addMessage('user', inputValue); this.updateChatLog('Player', inputValue); const response = await chatManager.getCharacterResponse(); chatManager.addMessage('assistant', response); this.animateChatLog('Buddy', response); // Use animateChatLog for character responses } } updateChatLog(role, message, color = '#ADF2FF') { const chatLogContentDiv = document.getElementById('chatLogContent'); const messageColor = color || (role === 'Player' ? '#ffffff' : '#ADF2FF'); chatLogContentDiv.innerHTML += `

${role}: ${message}

`; const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; } animateChatLog(role, message) { const chatLogContentDiv = document.getElementById('chatLogContent'); const color = role === 'Player' ? '#ffffff' : '#ADF2FF'; // Create a new paragraph element for the new message let newMessageElement = document.createElement('p'); newMessageElement.style.color = color; newMessageElement.innerHTML = `${role}: `; let i = 0; const interval = setInterval(() => { if (i < message.length) { newMessageElement.innerHTML += message[i]; if (i === 0) { chatLogContentDiv.appendChild(newMessageElement); // Append the new paragraph element only once } i++; this.toggleCharacterSprite(); // Toggle between neutral and happy sprites } else { clearInterval(interval); const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; // Scroll to the bottom of the chat log } }, 75); // Adjust timing as needed } toggleCharacterSprite() { if (this.neutralSprite.visible) { this.neutralSprite.visible = false; this.happySprite01.visible = true; } else { this.neutralSprite.visible = true; this.happySprite01.visible = false; } } } const config = { type: Phaser.AUTO, parent: 'renderDiv', scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, width: 800, height: 600, }, scene: ChatScene, dom: { createContainer: true }, }; window.phaserGame = new Phaser.Game(config);