// ChatManager is already imported in the current scope. // @ts-ignore var CHARACTER_DESCRIPTION = 'You are Wally Darling, a creative and sociable artist in "The Neighborhood". At 3 feet tall with yellow fleece skin and a distinct blue spiraled pompadour, you make a memorable impression. Your fashion choice of a blue cardigan with yellow borders, a red necktie, and rainbow-striped pants complements your unique style. Your facial features, including droopy eyes and a cat-like mouth, lack a nose and eyebrows, yet your expression is always softly and sweetly smiling. In your late 20s, you are known for your blunt yet polite manner. Direct in communication, you always keep a friendly demeanor. Your world revolves around "The Neighborhood" and its inhabitants, especially your house named Home, which is not just where you live but a close friend. You share a deep bond with your best friend, Barnaby B. Beagle, and have a unique dynamic with each of your other friends: Julie Joyful, Frank Frankly, Sally Starlet, Howdy Pillar, Poppy Partridge, and Eddie Dear. You view the viewer as a best friend, always eager to interact and learn about them. Your life is deeply integrated into "Welcome Home", where you are often the focal point. Your interests lie in drawing and painting, activities you frequently enjoy for your house, Home. Despite its non-verbal nature, you understand and communicate with Home. Making new friends and including the viewer in your activities and the neighborhood is something you relish. You demonstrate a deep understanding and care for your friends and Home. One of your notable behaviors is maintaining eye contact as a sign of politeness and attention. However, you sometimes struggle to interpret social cues and understand why some might keep their distance. Despite these challenges, your presence in "The Neighborhood" is cherished, and your contributions as an artist and friend are invaluable. Please answer naturally like a human talking to a friend. Do not mention that you want to assist. You are talking to your friend, do not mention your appearance.'; const baseStyle = ` font-family: 'Georgia', serif; font-size: 14px; border: 2px solid #4e342e; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); `; const chatLogStyle = ` ${baseStyle} width: 350px; height: 400px; background-color: rgba(0, 0, 0, 0.9); /* Modified opacity to make it darker */ padding: 10px; overflow-y: scroll; direction: rtl; `; const chatLogContentStyle = ` direction: ltr; display: inline-block; width: 100%; `; const inputStyle = ` ${baseStyle} width: 270px; height: 30px; background-color: rgba(255, 255, 255, 0.65); `; const sendButtonStyle = ` ${baseStyle} width: 80px; height: 44px; color: #e0d7c5; background: linear-gradient(to bottom, #957d5f, #6c543e); `; class ChatScene extends Phaser.Scene { preload() { this.load.image('background', `https://play.rosebud.ai/assets/WelcomeHome.png?8ruD`); this.load.image('character', `https://play.rosebud.ai/assets/WebP to.png?EI2W`); this.load.image('restart', 'https://storage.googleapis.com/rosebud_assets_storage/07518716-f520-4dac-8f15-0d183d99c679.png'); this.load.image('soundOn', 'https://i.imgur.com/8mqRn3K.png'); this.load.image('soundOff', 'https://i.imgur.com/UmfvCU3.png'); this.load.audio('8bitMusic', `https://play.rosebud.ai/assets/Welcome Home theme.mp3?CzZr`); // Updated music URL } create() { this.add.image(400, 200, 'background').setScale(1); this.add.image(500, 300, 'character').setScale(0.6); const restart = this.add.image(40, 30, 'restart').setScale(0.5).setInteractive(); this.chatManager = new ChatManager(CHARACTER_DESCRIPTION); this.add.dom(200, 320).createFromHTML(`

`); const chatInput = this.add.dom(160, 570).createFromHTML(` `); const sendButton = this.add.dom(340, 572).createFromHTML(` `); // Sound toggle this.isMusicPlaying = true; this.soundOnIcon = this.add.image(80, 30, 'soundOn').setScale(0.23).setInteractive(); this.soundOffIcon = this.add.image(80, 30, 'soundOff').setScale(0.23).setInteractive(); this.soundOffIcon.visible = false; this.music = this.sound.add('8bitMusic', { volume: 0.1, loop: true }); this.music.play(); this.soundOnIcon.on('pointerdown', () => this.toggleMusic(false)); this.soundOffIcon.on('pointerdown', () => this.toggleMusic(true)); 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 the developer credit text this.add.dom(660, 580).createFromHTML(`

AI Character created by firefly8236

`); } toggleMusic(play) { this.isMusicPlaying = play; if (this.isMusicPlaying) { this.music.play(); this.soundOnIcon.visible = true; this.soundOffIcon.visible = false; } else { this.music.pause(); this.soundOnIcon.visible = false; this.soundOffIcon.visible = true; } } updateChatLog(role, message) { const chatLogContentDiv = document.getElementById('chatLogContent'); let color = ''; if (role === 'Player') { color = '#3498db'; // Light blue for player's text } else if (role === 'Character') { color = '#ffffff'; // White for character's text } chatLogContentDiv.innerHTML += `

${role}: ${message}

`; const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; } 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.updateChatLog('Character', response); } } } const container = document.getElementById('renderDiv'); const config = { parent: 'renderDiv', type: Phaser.AUTO, scene: ChatScene, scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, width: 800, height: 600, }, dom: { createContainer: true }, }; window.phaserGame = new Phaser.Game(config);