// ChatManager is already imported in the current scope. var CHARACTER_DESCRIPTION = 'I am Dick Winter, a seasoned private investigator in the gritty city of Santa Angeles, where shadows whisper secrets and danger lurks in every alley. With a keen eye for detail and a knack for getting to the truth, I navigate through a maze of lies and deceit, solving cases that others dare not touch. You are my veteran partner, and we have a new case. How would you like to proceed?'; 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.7); padding: 10px; overflow-y: auto; overflow-x: hidden; 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); `; const journalLinkStyle = ` ${baseStyle} position: absolute; top: 10px; right: 10px; width: 100px; height: 30px; color: #e0d7c5; background: linear-gradient(to bottom, #957d5f, #6c543e); `; const journalStyle = ` ${baseStyle} position: fixed; top: 50%; left: 50%; width: 400px; height: 300px; background-color: #fff; padding: 20px; transform: translate(-50%, -50%); display: none; `; const journalInputStyle = ` ${baseStyle} width: 350px; height: 200px; background-color: rgba(255, 255, 255, 0.65); overflow-y: scroll; `; class ChatScene extends Phaser.Scene { preload() { this.load.image('background', `https://play.rosebud.ai/assets/PIbgImage.jpg?qLZJ`); this.load.image('character', `https://play.rosebud.ai/assets/dickwinter.png?Kcv1`); this.load.image('restart', `https://play.rosebud.ai/assets/restart button.png?DWDx`); this.load.audio('bgm', `https://play.rosebud.ai/assets/detBGM.mp3?fMWn`); } create() { this.add.image(400, 300, 'background'); this.add.image(600, 400, 'character').setScale(0.75).setFlipX(true); const restart = this.add.image(40, 30, 'restart').setScale(0.23).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(` `); const journalLink = this.add.dom(760, 30).createFromHTML(` `); const journal = this.add.dom(400, 300).createFromHTML(`

Journal

`); chatInput.node.addEventListener('keyup', (event) => { if (event.key === "Enter" || event.keyCode === 13) { this.sendChatMessage(this.chatManager); chatInput.node.value = ''; } }); sendButton.addListener('click').on('click', () => { this.sendChatMessage(this.chatManager); chatInput.node.value = ''; }); journalLink.addListener('click').on('click', () => { this.openJournal(); }); document.getElementById('journalSave').addEventListener('click', () => { this.saveJournal(); window.alert('Your notes have been saved!'); }); document.getElementById('journalClose').addEventListener('click', () => { this.closeJournal(); }); restart.on('pointerdown', () => { this.chatManager.cleanChatHistory(); const chatLogContentDiv = document.getElementById('chatLogContent'); chatLogContentDiv.innerHTML = ''; }); // Adding BGM const bgm = this.sound.add('bgm', { loop: true, volume: 0.25 }); bgm.play(); // Initial Prompt for the First Case this.initialCasePrompt(); } updateChatLog(role, message) { const chatLogContentDiv = document.getElementById('chatLogContent'); const color = role === 'Player' ? '#a93226' : '#2e7d32'; chatLogContentDiv.innerHTML += `

${role}: ${message}

`; const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; // Text to speech const utterance = new SpeechSynthesisUtterance(message); window.speechSynthesis.speak(utterance); } 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); // clear the input field document.getElementById('chatInput').value = ''; } } openJournal() { document.getElementById('journal').style.display = 'block'; const savedNotes = localStorage.getItem('playerNotes'); document.getElementById('journalContent').value = savedNotes ? savedNotes : ''; } saveJournal() { const notes = document.getElementById('journalContent').value; localStorage.setItem('playerNotes', notes); } closeJournal() { document.getElementById('journal').style.display = 'none'; } initialCasePrompt() { const openingLine = "The rain beats a steady rhythm on your office window, casting shadows across the worn-out leather chair opposite your desk. Just as you light a cigarette, the door creaks open. Dick Winter, your trusted partner, steps in. 'I need your help, bucko,' they say, 'We have a new case...' their voice barely above a whisper. 'It's a matter of life and death.'"; this.updateChatLog('Character', openingLine); } } 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);