/// Modify the elements inside the narrative_scenes array to /// add more scenes and customize the dialog. function initializeStoryScript() { return { speakers: { 'player': { name: '', sprite_url: '', weapon: { name: '', sprite_url: '', }, }, 'Ananta': { sprite_url: `https://play.rosebud.ai/assets/karthik_choice_sprite_06.webp.webp?IzWx`, character_prompt: 'You are a character within an interactive story game. You respond as the character Ananta. A scenario is a unique conversation with the player in a specific context. You do NOT need to manage the scenario. Always base your response on the latest scenario message in the chat history. Ananta is the current Nagaraja, the king of the Snake court, who wants to take the player as your concubine. You are attractive and a shockingly smooth talker. You are likable and not proud/cocky. You are deeply sexually interested in the player and find it hard to hide it. You know deep down the player is attracted to you. You don\'t refer to the player as "player". Just provide the text that Ananta is saying. Do NOT specify that Ananta is the one speaking. Make sure to keep your responses short and sweet. DO NOT SAY TOO MUCH AT ONCE. DO NOT INCLIUDE ANY SYSTEM INFO IN YOUR RESPONSES. EVERYTHING YOU SAY SHOULD BE WHAT ANANTA IS SAYING', chat_manager: null, }, 'Kiara': { sprite_url: `https://play.rosebud.ai/assets/sister_sprite.webp.webp?aJXK`, character_prompt: 'You are a speaking character within an interactive story game. Your job is only to respond as the character "Kiara" depending on the current scenario. A scenario is a unique conversation with the player in a specific context. The scenario is defined in your memory as \'Current Scenario: { insert description }\'. Player messages will be added to your mememory so you can always react to whwat\'s happening. Kiara is sickly, sullen, and soft-spoken. You are sisters with the player and are deeply concerned with their safety. You are super close with the player. You are very sick however and find it hard to smile, laugh, or joke. You don\'t refer to the player as "player". Just provide the text that Kiara is saying. Do NOT specify that Kiara is the one speaking. Make sure to keep your responses short and sweet. DO NOT SAY TOO MUCH AT ONCE. DO NOT INCLIUDE ANY SYSTEM INFO IN YOUR RESPONSES. EVERYTHING YOU SAY SHOULD BE WHAT KIARA IS SAYING', chat_manager: null, }, 'Papa': { sprite_url: `https://play.rosebud.ai/assets/papa_sprite.webp.webp?S086`, }, 'Mama': { sprite_url: `https://play.rosebud.ai/assets/mama_sprite.webp.webp?II3S`, }, 'Villagers': { sprite_url: `https://play.rosebud.ai/assets/villagers_sprite.webp.webp?dwxh`, }, 'Serpent Guard': { sprite_url: `https://play.rosebud.ai/assets/naga_guard_sprite.webp.webp?tydA`, }, }, story_scenes: [ { scene_name: 'scene_1', background: `https://play.rosebud.ai/assets/dining_hall_cropped.webp.webp?B2xs`, music: `https://play.rosebud.ai/assets/Calamity.mp3.mp3?MVl5`, scene_shots: [ { shot_type: 'chat', is_open_ended: false, speaking: 'Ananta', synopsis_for_ai: '(We are now in the stunning dining hall of the Snake Kingdom. You just arrived there by travelling through the forest portal and the player has just woken up from being unconscious due to the trip. The player is seated in front of you eating. You\'re watching them closely, curious.)', goal_info: '(GOAL) Your sister\'s survival is at risk from a snake bite. Flirt with Ananta to convince him to take you somewhere more private. His royal blood could be the antidote.', chat_goal_prompt: "You are the narrator character within an interactive story game. Your job is only to classify the player's previous message by responding with one of three singular characters '+', '-', or '0'. '+' if the player's latest message succeeds in their goal. '-' if the player's latest message fails in their goal. '0' if the player's latest. The scenario is defined by the narrator and player messages within your memory, make sure to always take this into account. The player goal of this chat is for the player to seduce you into taking them from the dining hall to your room. If they are matter of fact and boring respond with '-'. If they are flirty or sexual respond with '+'. If they are neutral or off-topic, provide a '0'.", } ], next_scene: 'scene_2', }, { scene_name: 'scene_2', background: `https://play.rosebud.ai/assets/bedroom_cropped.webp.webp?wHex`, music: '', scene_shots: [ { shot_type: 'chat', is_open_ended: true, speaking: 'Ananta', synopsis_for_ai: '(The player has just seduced you into going to your private bedroom with them. You\'re eagerly waiting for the chance to lay with them and will jump at any chance. Sleep with them if they give you the opportunity.)', goal_info: '(GOAL) Now that you are in his room get Ananta to let down his guard fully. It is the only chance you have of obtaining the antidote.', chat_goal_prompt: "You are the narrator character within an interactive story game. Your job is only to classify the player's previous message by responding with one of three singular characters '+', '-', or '0'. '+' if the player's latest message succeeds in their goal. '-' if the player's latest message fails in their goal. '0' if the player's latest. The scenario is defined by the narrator and player messages within your memory, make sure to always take this into account. The player goal of this chat is for the player to seduce you into sleeping with them and letting your guard down. If they are matter of fact and transactional, respond with '-'. If they are flirty or sexual, respond with '+'. If they are neutral or off-topic, provide a '0'.", } ], next_scene: '', }, ], }; } class SceneTransitionManager { constructor(game) { this.game = game; } transitionTo(sceneKey) { // Stop all scenes before starting the new one Phaser.Actions.Call(this.game.scene.getScenes(true), (scene) => { if (scene.scene.key !== sceneKey) { this.removeScene(scene.scene.key); // Ensure the scene is fully destroyed } }); // Start the new scene this.game.scene.start(sceneKey); } removeScene(sceneKey) { if (this.game.scene.getScene(sceneKey)) { this.game.scene.remove(sceneKey); // This will stop and destroy the scene } } fadeInScene(scene, duration = 1000) { scene.cameras.main.fadeIn(duration); } fadeOutScene(scene, duration = 1000) { scene.cameras.main.fadeOut(duration); } } class MusicManager { constructor(game) { this.game = game; this.currentTrack = null; this.isPlaying = false; // Flag to manage play state } playMusicByKey(musicKey) { // If the musicKey is empty, don't proceed to stop or play new music. if (!musicKey) { console.info('No music key provided, not changing current music.'); return; } // If there's a current track but it's a different key, stop and destroy it. if (this.currentTrack && this.currentTrack.key !== musicKey) { this.stopMusic(); // Directly stop the current track } // If there's no current track or the current track was stopped, start the new track. if (!this.currentTrack) { this.startMusic(musicKey); } } startMusic(musicKey) { // Assume the musicKey corresponds to a preloaded audio file this.currentTrack = this.game.sound.add(musicKey, { volume: 0.05, loop: true, }); this.currentTrack.play(); this.isPlaying = true; // Update flag to indicate music is playing } stopMusic() { if (this.currentTrack) { this.currentTrack.stop(); this.currentTrack.destroy(); this.currentTrack = null; } this.isPlaying = false; // Update flag to indicate music has stopped } toggleMusic() { if (this.currentTrack) { if (this.currentTrack.isPlaying) { this.currentTrack.pause(); this.isPlaying = false; // Update flag to indicate music is paused } else { this.currentTrack.resume(); this.isPlaying = true; // Update flag to indicate music is resumed } } } } // ChatManager is already imported in the current scope. class ChatMenu { constructor( scene, chatIsOpenEnded, chatGoalPrompt, chatSynopsisForCharacter, chatGoalInfo, speakingCharacter, characterPrompt, characterSprite, ) { this.scene = scene; this.chatIsOpenEnded = chatIsOpenEnded; this.openChatSuccessReached = false; this.loveBarGoal; if (chatIsOpenEnded) { this.loveBarGoal = 60; } else { this.loveBarGoal = 2; } this.chatGoalPrompt = chatGoalPrompt; this.chatSynopsisForCharacter = chatSynopsisForCharacter; this.speakingCharacter = speakingCharacter; // Always create new ChatManager instances this.systemChatManager = new ChatManager(chatGoalPrompt); this.characterChatManager = new ChatManager(characterPrompt); this.characterSprite = characterSprite; this.waitingForResponse = false; this.createChatUI().then(() => { this.createLoveBar(); this.loadSavedChat(); // Check if the chat log is empty. if (!document.getElementById('chatLogContent').innerHTML.trim()) { this.characterChatManager.addMessage('user', this.chatSynopsisForCharacter); // Temporarily disable input, send goal message, and greeting message from character. this.saveGameState(); this.waitingForResponse = false; // Reset the state this.updateChatLog('SYSTEM', chatGoalInfo, () => this.sendInitialGreeting()); } // Check if the love status is already at maximum value if (this.loveStatus === this.loveBarGoal && !this.chatIsOpenEnded) { console.info('Success already reached. Disabling submit button and creating continue button.'); document.getElementById('sendButton').disabled = true; // Create and display a continue button this.createContinueButton(); } }); } async createChatUI() { // Base style remains the same const baseStyle = ` font-family: 'Verdana', sans-serif; font-size: 16px; color: #000; border-style: solid; border-color: #2F4152; background-color: rgba(255, 255, 255, 0.85); box-sizing: border-box; `; // Adjust chat log style to fit game width const chatLogStyle = ` ${baseStyle} width: 390px; /* Match game width */ height: 166px; 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: 60px; padding: 10px; border-width: 1px 0px 1px 1px; `; const sendButtonStyle = ` ${baseStyle} width: 75px; /* Adjust based on visual preference */ height: 60px; padding: 10px; border-width: 2px; border-width: 1px 1px 1px 1px; `; 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(0, 844); // 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 sendInitialGreeting() { this.waitingForResponse = true; // Set the state to waiting document.getElementById('sendButton').disabled = true; const initialPrompt = 'Greet the player and stop'; // Adjust as needed const response = await this.characterChatManager.getCharacterResponse(initialPrompt); this.systemChatManager.addMessage('assistant', response); this.characterChatManager.addMessage('assistant', response); // Update the chat log with the greeting message this.updateChatLog(this.speakingCharacter, response, () => { this.saveGameState(); this.waitingForResponse = false; // Reset the state document.getElementById('sendButton').disabled = false; // Re-enable send button after receiving the response + response animation completes }); } async sendChatMessage() { const chatInput = document.getElementById('chatInput'); const sendButton = document.getElementById('sendButton'); const inputValue = chatInput.value; if (inputValue && !this.waitingForResponse) { // Check the flag before proceeding sendButton.disabled = true; // Disable send button this.systemChatManager.addMessage('user', inputValue); this.characterChatManager.addMessage('user', inputValue); this.updateChatLog('Player', inputValue); chatInput.value = ''; // Clear the input box immediately after sending the message // const characterResponse = await this.characterChatManager.getCharacterResponse(); // Use GPT 3.5 const characterResponse = await this.characterChatManager.getCharacterResponse('mistral'); // Use Mistral ProgressLogger.logProgress('snake-king-story-chat', { userMessage: inputValue, characterResponse: characterResponse, }); this.systemChatManager.addMessage('assistant', characterResponse); this.characterChatManager.addMessage('assistant', characterResponse); this.updateChatLog(this.speakingCharacter, characterResponse, async () => { const systemResponse = await this.systemChatManager.getCharacterResponse(inputValue); this.updateLoveStatus(systemResponse); this.systemChatManager.addMessage('assistant', systemResponse); this.saveGameState(); sendButton.disabled = false; // Re-enable send button after the full cycle is complete }); } } updateChatLog(speaker, message, onComplete) { this.waitingForResponse = true; // Set the flag to true when an update starts const chatLogContentDiv = document.getElementById('chatLogContent'); let newMessageElement = document.createElement('p'); newMessageElement.style.color = '#000'; // Standard color for all messages newMessageElement.innerHTML = `${speaker}: `; // Initially set to just the speaker's name chatLogContentDiv.appendChild(newMessageElement); if (speaker === 'Player') { newMessageElement.innerHTML += message; // Append the message instantly for the player this.waitingForResponse = false; // Reset the flag immediately for player messages onComplete?.(); } else { // For system and character messages, simulate typing effect let i = 0; const interval = setInterval(() => { if (i < message.length) { newMessageElement.innerHTML += message[i]; // Append the message character by character i++; } else { clearInterval(interval); const chatLogDiv = document.getElementById('chatLog'); chatLogDiv.scrollTop = chatLogDiv.scrollHeight; this.waitingForResponse = false; // Reset the flag when the message has been fully added onComplete?.(); } }, 30); } } saveGameState() { console.info('Saving game.'); const saveData = localStorage.getItem(`rosebud_snake_kings_tribute`); 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 characterManagerState = JSON.stringify(this.characterChatManager); // Update the specific character's chat manager state in the saved data parsedSaveData.storyScript.speakers[this.speakingCharacter].chat_manager = characterManagerState; } // Serialize the system ChatManager's state if (this.systemChatManager) { const systemManagerState = JSON.stringify(this.systemChatManager); // Update the system chat manager state in the saved data parsedSaveData.systemChatManagerState = systemManagerState; } // Update the game save data with the current chat log and love bar level parsedSaveData.chatLog = chatLogContent; parsedSaveData.loveBarLevel = this.loveStatus; // Save the updated game state to localStorage localStorage.setItem(`rosebud_snake_kings_tribute`, JSON.stringify(parsedSaveData)); console.info('Game state saved.'); } loadSavedChat() { const saveData = localStorage.getItem(`rosebud_snake_kings_tribute`); 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.storyScript.speakers[this.speakingCharacter].chat_manager) { const characterManagerState = JSON.parse( parsedSaveData.storyScript.speakers[this.speakingCharacter].chat_manager, ); Object.assign(this.characterChatManager, characterManagerState); } // Deserialize and apply the system ChatManager state if it exists if (parsedSaveData.systemChatManagerState) { const systemManagerState = JSON.parse(parsedSaveData.systemChatManagerState); Object.assign(this.systemChatManager, systemManagerState); } // 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.'); } // Load the love bar level and update its visual representation if (parsedSaveData.loveBarLevel !== undefined) { if (parsedSaveData.loveBarLevel === null) { if (this.chatIsOpenEnded) { this.loveStatus = 30; } else { this.loveStatus = 1; } } else { this.loveStatus = parsedSaveData.loveBarLevel; } this.updateLoveBarVisual(); console.info(`Loaded love bar status: ${this.loveStatus}`); } else { console.warn('Love bar level is missing from save.'); } console.info('Game state loaded.'); } createLoveBar() { const loveBarContainerStyle = ` width: 250px; height: 18px; border-radius: 30px; background-color: #A38F9E; position: absolute; top: -450px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; position: relative; `; const loveBarFillStyle = ` height: 100%; border-radius: 8px; background-color: #F1C3E6; width: ${this.loveStatus * 10}%; /* Initial state based on love status */ transition: width 1.5s ease-in-out; position: relative; /* For positioning heart icon relative to fill bar */ `; // Create the container const loveBarContainer = document.createElement('div'); loveBarContainer.setAttribute('style', loveBarContainerStyle); loveBarContainer.id = 'loveBarContainer'; // Create the fill bar const loveBarFill = document.createElement('div'); loveBarFill.setAttribute('style', loveBarFillStyle); loveBarFill.id = 'loveBarFill'; // Append fill to container loveBarContainer.appendChild(loveBarFill); // Append the container to the chat container or another appropriate parent document.getElementById('chatContainer').prepend(loveBarContainer); // Create the heart icon const heartIcon = document.createElement('img'); heartIcon.src = `https://play.rosebud.ai/assets/heart_icon.png.png?n99B`; heartIcon.style.width = '35px'; heartIcon.style.height = '35px'; heartIcon.style.position = 'absolute'; heartIcon.style.right = '-20'; // Stick to the right side of the fill bar heartIcon.style.top = '50%'; heartIcon.style.transform = 'translateY(-50%)'; // Append the heart icon to the fill bar loveBarFill.appendChild(heartIcon); // Add fail and love icons to the love bar container this.addLoveBarIcons(loveBarContainer); } addLoveBarIcons(loveBarContainer) { // Create and append fail icon const failIcon = document.createElement('img'); failIcon.src = `https://play.rosebud.ai/assets/fail_icon.png.png?TgiZ`; failIcon.style.width = '35px'; failIcon.style.height = '35px'; failIcon.style.position = 'absolute'; failIcon.style.left = '-20'; failIcon.style.top = '50%'; failIcon.style.transform = 'translateY(-50%)'; loveBarContainer.appendChild(failIcon); // Create and append love icon const loveIcon = document.createElement('img'); loveIcon.src = `https://play.rosebud.ai/assets/love_icon.png.png?o0rJ`; loveIcon.style.width = '35px'; loveIcon.style.height = '35px'; loveIcon.style.position = 'absolute'; loveIcon.style.right = '-20'; loveIcon.style.top = '50%'; loveIcon.style.transform = 'translateY(-50%)'; loveBarContainer.appendChild(loveIcon); } updateLoveStatus(change) { console.info(`System rated a message: ${change}`); console.info(`LoveStatus before update: ${this.loveStatus}`); // Adjust love status based on the change if (change === '+') { if (this.loveStatus < this.loveBarGoal) { this.loveStatus++; // Update the chat log with the greeting message this.updateChatLog('SYSTEM', `${this.speakingCharacter} liked that.`, () => { this.saveGameState(); this.waitingForResponse = false; // Reset the state document.getElementById('sendButton').disabled = false; // Re-enable send button after receiving the response + response animation completes }); } } else if (change === '-') { if (this.loveStatus > 0) { this.loveStatus--; // Update the chat log with the greeting message this.updateChatLog('SYSTEM', `${this.speakingCharacter} disliked that.`, () => { this.saveGameState(); this.waitingForResponse = false; // Reset the state document.getElementById('sendButton').disabled = false; // Re-enable send button after receiving the response + response animation completes }); } } else if (change !== '0') { // If the response is not "+", "-", or "0", throw an error throw new Error(`Unexpected response: ${change}`); } // No action is taken if the response is "0" console.info(`LoveStatus after update: ${this.loveStatus}`); // Update love bar width const newWidth = (this.loveStatus / this.loveBarGoal) * 100; document.getElementById('loveBarFill').style.width = `${newWidth}%`; // Check if the love status has reached its maximum value if (this.loveStatus === this.loveBarGoal && !this.chatIsOpenEnded) { this.waitingForResponse = true; console.info('Success reached.'); console.info('Disabling submit button and creating continue button.'); // Add a narrator message indicating success this.updateChatLog('SYSTEM', 'You Succeeded!', () => { this.saveGameState(); this.createContinueButton(); }); } else if (this.loveStatus === this.loveBarGoal && this.chatIsOpenEnded) { // Reflect changes in save state this.saveGameState(); if (!this.openChatSuccessReached) { this.openChatSuccessReached = true; console.info('Success reached in open-ended chat.'); this.updateChatLog('SYSTEM', 'You Succeeded!', () => { this.saveGameState(); this.waitingForResponse = false; // Reset the state document.getElementById('sendButton').disabled = false; // Re-enable send button after receiving the response + response animation completes }); } } } updateLoveBarVisual() { console.log(`Updating Love Bar to %${(this.loveStatus / this.loveBarGoal) * 100}`); const loveBarFill = document.getElementById('loveBarFill'); if (loveBarFill) { // Calculate the width percentage based on the current love status, now with a scale of 3 instead of 10 const widthPercentage = (this.loveStatus / this.loveBarGoal) * 100; loveBarFill.style.width = `${widthPercentage}%`; } } createContinueButton() { const baseStyle = ` font-family: 'Verdana', sans-serif; font-size: 16px; color: #000; border-style: solid; border-color: #2F4152; background-color: rgba(255, 255, 255, 0.85); box-sizing: border-box; cursor: pointer; /* Change cursor on hover */ padding: 10px; /* Button padding */ border-radius: 20px; /* Rounded corners for the button */ border-width: 1px; /* Border width */ `; const buttonStyle = ` ${baseStyle} position: absolute; top: 50%; /* Center vertically */ left: 50%; /* Center horizontally */ transform: translate(-50%, -50%); /* Adjust based on the exact positioning */ z-index: 100; /* Ensure the button is above other elements */ `; this.continueButton = document.createElement('button'); this.continueButton.setAttribute('style', buttonStyle); this.continueButton.innerText = 'Click Here To Continue'; this.continueButton.id = 'continueButton'; // Append to the chat container or another appropriate parent element document.getElementById('chatContainer').appendChild(this.continueButton); // Add click event listener to handle transition this.continueButton.addEventListener('click', () => { // Perform transition to the next shot or scene this.handleNextTransition(); // Implement this method based on your game logic }); } handleNextTransition() { // Before transitioning, reset the systemChatManager in the save state const saveData = localStorage.getItem(`rosebud_snake_kings_tribute`); if (!saveData) { console.error('No save data found.'); } const parsedSaveData = JSON.parse(saveData); console.info('Resetting system chat manager save slot.'); if (parsedSaveData.systemChatManagerState) { parsedSaveData.systemChatManagerState = null; } console.info('Resetting chat log save slot.'); if (parsedSaveData.chatLog) { parsedSaveData.chatLog = ''; } else { console.warn('Chatlog content is missing from save.'); } console.info('Resetting love bar value save slot.'); if (parsedSaveData.loveBarLevel !== undefined) { parsedSaveData.loveBarLevel = null; } else { console.warn('Love bar level is missing from save.'); } // Reflect changes in save state this.saveGameState(); parsedSaveData.systemChatManagerState = null; // Reset systemChatManager localStorage.setItem(`rosebud_snake_kings_tribute`, JSON.stringify(parsedSaveData)); // Transition to the next shot or scene console.info('Transitioning from chat shot to the next shot or scene'); this.scene.fadeOutAndProceed([this.chatContainer, this.continueButton, this.characterSprite]); } } class BootScene extends Phaser.Scene { constructor() { super({ key: 'BootScene', }); } preload() { // Preload all global assets here (fonts, UI elements, sounds, etc.) this.load.image( 'music_off', `https://play.rosebud.ai/assets/audio_muted_icon.png?ZYIy`, ); this.load.image( 'music_on', `https://play.rosebud.ai/assets/audio_playing_icon.png?UcHD`, ); this.load.image( 'restart', `https://play.rosebud.ai/assets/restart_loop_icon.png?eFS6`, ); // Initialize the music manager here to ensure game systems are ready this.game.musicManager = new MusicManager(this.game); } create() { // Transition to StoryInfoScene this.game.sceneTransitionManager.transitionTo('StoryInfoScene'); } } class StoryInfoScene extends Phaser.Scene { constructor() { super({ key: 'StoryInfoScene', }); } preload() { // Preload the assets for this scene this.load.image( 'story_image', `https://play.rosebud.ai/assets/Splash.webp.webp?01ku`, ); this.load.image( 'info_screen_vignette', `https://play.rosebud.ai/assets/Gradient.webp.webp?qeCi`, ); this.load.image( 'story_title', `https://play.rosebud.ai/assets/story_title_new_b.png.png?To75`, ); this.load.image( 'info_text', `https://play.rosebud.ai/assets/Description Updated.webp.webp?YxZJ`, ); this.load.image( 'play_button', `https://play.rosebud.ai/assets/play_button.webp.webp?5l6p`, ); } create() { this.storyStarted = false; // Check if a save exists and load it, otherwise initialize a new game this.checkForExistingSave(); // Add the images to the scene with their initial positions this.createSceneElements(); this.applyWindEffect(); this.animatePlayButton(); ProgressLogger.logProgress('snake-king-start', { sceneName: this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex].scene_name, shotId: this.game.saveData.currentShotIndex, }); // Fade in the scene this.game.sceneTransitionManager.fadeInScene(this, 1000); } checkForExistingSave() { const saveData = localStorage.getItem(`rosebud_snake_kings_tribute`); 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 = { storyScript: initializeStoryScript(), // Initialize your story script here currentSceneIndex: 0, currentShotIndex: 0, chatLog: '', chatManagerState: null, // Assuming a default empty state is suitable loveBarLevel: null, }; // Initialize ChatManager for each character that requires one Object.entries(this.game.saveData.storyScript.speakers).forEach(([key, value]) => { if (value.hasOwnProperty('chat_manager') && value.chat_manager === null) { // Initialize and serialize a new ChatManager for the character const newChatManager = new ChatManager(value.character_prompt); value.chat_manager = JSON.stringify(newChatManager); // Serialize the new ChatManager } }); // Save the initial state to localStorage localStorage.setItem(`rosebud_snake_kings_tribute`, JSON.stringify(this.game.saveData)); } } createSceneElements() { this.storyImage = this.add.image(0, 0, 'story_image').setOrigin(0, 0).setDepth(-10).setInteractive(); this.vignette = this.add.image(0, 0, 'info_screen_vignette').setOrigin(0, 0).setDepth(-5).setInteractive(); this.storyTitle = this.add.image(this.cameras.main.centerX, 85, 'story_title').setScale(1.2).setInteractive(); this.infoText = this.add.image(5, 590, 'info_text').setOrigin(0, 0).setInteractive(); this.playButton = this.add.image(this.cameras.main.centerX, this.cameras.main.centerY, 'play_button').setInteractive(); // An array of all elements that should respond to click/touch const interactiveElements = [this.storyImage, this.vignette, this.storyTitle, this.infoText, this.playButton]; // Assign the event listener to each interactive element interactiveElements.forEach(element => { element.on('pointerdown', () => { if (this.storyStarted) return; // Ignore the interaction if not allowed // Remove interactivity to prevent further clicks this.storyStarted = true; // Fade out the current scene this.game.sceneTransitionManager.fadeOutScene(this, 1000); // Delay the scene transition to ensure the fade-out completes this.time.delayedCall(1000, () => { this.game.sceneTransitionManager.transitionTo('StoryScene'); }); }); }); // Force game resize event to fix clicking on Safari mobile devices this.scale.resize(this.scale.gameSize._width, this.scale.gameSize._height); } applyWindEffect() { // Apply a gentle movement to simulate wind const elements = [this.storyImage, this.storyTitle]; elements.forEach((element) => { // Separate tweens for x and y to allow independent movement this.createWindTween(element, 'x'); this.createWindTween(element, 'y'); }); } createWindTween(target, axis) { // Determine initial offset values const initialValue = target[axis]; const randomOffset = () => Phaser.Math.Between(-5, 5); // Recursive function to apply continuous and varied movement const applyRecursiveTween = () => { this.tweens.add({ targets: target, [axis]: initialValue + randomOffset(), ease: 'Sine.easeInOut', duration: Phaser.Math.Between(2000, 3000), yoyo: true, repeat: 0, onComplete: () => { applyRecursiveTween(); // Apply a new tween with a new random offset }, }); }; applyRecursiveTween(); // Start the recursive application of tweens } animatePlayButton() { // Periodic enlargement to attract attention this.tweens.add({ targets: this.playButton, scaleX: 1.07, scaleY: 1.07, ease: 'Linear', duration: 500, yoyo: true, delay: 1000, // Start after 5 seconds and repeat repeat: -1 }); } } class StoryScene extends Phaser.Scene { constructor() { super({ key: 'StoryScene', }); this.acceptedShotTypes = [ 'character_customization', 'name_selection', 'dialog', 'weapon_choice', 'story_choice', 'chat', ]; // Only accept character_customization for now this.weaponSprites = []; // To track weapon sprites for easy cleanup // Flag to track if interactions are currently allowed this.allowInteraction = false; } init() { // Define CSS for bubbles this.bubbleStyle = ` font-family: 'Verdana', sans-serif; font-size: 16px; padding: 15px 25px 30px 20px; border-radius: 20px; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); background-color: rgba(255, 255, 255, 0.85); color: #000; `; this.messageBubbleStyle = ` ${this.bubbleStyle} width: 275px; height: 65px; border-radius: 20px; border-style: solid; border-color: #2F4152; border-width: 1px; `; } preload() { // Preload UI elements this.load.image( 'vignette', `https://play.rosebud.ai/assets/vignette.webp.webp?eO1f`, ); this.load.image( 'left_arrow', `https://play.rosebud.ai/assets/left_arrow.webp.webp?rLUD`, ); this.load.image( 'right_arrow', `https://play.rosebud.ai/assets/right_arrow.webp.webp?8aaU`, ); this.load.image( 'confirm_button', `https://play.rosebud.ai/assets/choice_confirmation_button.webp.webp?gtUn`, ); this.load.image( 'instruction_bg', `https://play.rosebud.ai/assets/choice_bubble.webp.webp?SEwA`, ); // Dynamically preload assets defined in the story script from saveData this.game.saveData.storyScript.story_scenes.forEach((scene, sceneIndex) => { // Preload backgrounds if (scene.background && scene.background.trim() !== '') { this.load.image(`background_${sceneIndex}`, scene.background); } // Preload music if (scene.music && scene.music.trim() !== '') { this.load.audio(`music_${sceneIndex}`, scene.music); } // Preload choice sprites and weapon sprites scene.scene_shots.forEach((shot, shotIndex) => { if (shot.shot_type === 'character_customization' && shot.choice_sprites) { console.info(`Loading character customization sprite choices: ${shot.choice_sprites}`); shot.choice_sprites.forEach((spriteUrl, choiceIndex) => { this.load.image(`customizationSprite_${sceneIndex}_${shotIndex}_${choiceIndex}`, spriteUrl); }); } else if (shot.shot_type === 'weapon_choice' && shot.choice_sprites) { console.info(`Loading weapon customization sprite choices: ${shot}`); Object.entries(shot.choice_sprites).forEach(([weaponId, spriteUrl], index) => { this.load.image(`weaponSprite_${sceneIndex}_${shotIndex}_${weaponId}`, spriteUrl); }); } }); }); // Preload speaker and weapon sprites Object.entries(this.game.saveData.storyScript.speakers).forEach(([speakerKey, speakerDetails]) => { if (speakerDetails.sprite_url) { console.info(`Preloading character sprite: ${speakerDetails.sprite_url}`); this.load.image(`speakerSprite_${speakerKey}`, speakerDetails.sprite_url); } if (speakerDetails.weapon && speakerDetails.weapon.sprite_url) { console.info(`Preloading weapon sprite: ${speakerDetails.weapon.sprite_url}`); this.load.image(`weaponSprite_${speakerKey}`, speakerDetails.weapon.sprite_url); } }); } create() { createMuteToggleButton(this); createDeleteSaveButton(this); // Correctly check if the current scene has music defined before attempting to play it const currentSceneMusic = this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex].music; if (currentSceneMusic) { const musicKey = `music_${this.game.saveData.currentSceneIndex}`; console.info(`Playing music: ${musicKey}`); this.game.musicManager.playMusicByKey(musicKey); } this.setSceneBackground(); // Set the scene background based on current scene this.vignette = this.add.image(0, 0, 'vignette').setOrigin(0, 0).setDepth(20); // Add vignette above background this.processCurrentShot(); // Start processing the current shot of the current scene // Fade in the scene this.game.sceneTransitionManager.fadeInScene(this, 1000); } setSceneBackground() { // Generate the next background key based on the current scene index from saveData const nextBackgroundKey = `background_${this.game.saveData.currentSceneIndex}`; // Check if the background for the next scene is intentionally left blank (indicating no change) using saveData if (!this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex].background) { console.info('Background stays the same, no change.'); return; } // Check if the next background is the same as the current one if (this.currentBackground && this.currentBackground.texture.key === nextBackgroundKey) { // The same background is already displayed, no action needed return; } console.info(`Setting background: ${nextBackgroundKey}`); // Fade out current background if exists and it's a different background if (this.currentBackground) { this.tweens.add({ targets: this.currentBackground, alpha: 0, duration: 500, onComplete: () => { // After fade out, set the new texture and fade it in this.currentBackground.setTexture(nextBackgroundKey); this.currentBackground.alpha = 0; // Ensure it's invisible before fading in this.fadeInBackground(); } }); } else { // No existing background, simply add and fade in this.currentBackground = this.add.image(0, 0, nextBackgroundKey).setOrigin(0, 0).setAlpha(0); this.currentBackground.setDepth(-10); this.fadeInBackground(); } } fadeInBackground() { // Fade in the current or new background this.tweens.add({ targets: this.currentBackground, alpha: 1, duration: 1000, }); } makeBackgroundInteractive(elementsToFade) { // Make the background interactive if (this.currentBackground) { this.currentBackground.setInteractive(); } // Add a pointerdown event listener this.currentBackground.on('pointerdown', () => { if (!this.allowInteraction) return; // Ignore the interaction if not allowed this.allowInteraction = false; console.log("Fading background"); // Call fadeOutAndProceed with the provided elements this.fadeOutAndProceed(elementsToFade); // After the background is clicked, remove its interactivity this.currentBackground.disableInteractive(); this.currentBackground.removeAllListeners('pointerdown'); }); } processCurrentShot() { // Accessing current scene and shot using saveData const currentScene = this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex]; const currentShot = currentScene.scene_shots[this.game.saveData.currentShotIndex]; // Check if the current shot type is one of the accepted types and handle accordingly if (this.acceptedShotTypes.includes(currentShot.shot_type)) { ProgressLogger.logProgress('snake-king-shot', { sceneName: currentScene.scene_name, shotType: currentShot.shot_type, shotId: this.game.saveData.currentShotIndex, }); switch (currentShot.shot_type) { case 'character_customization': this.handleCharacterCustomization(currentShot); break; case 'name_selection': this.handleNameChoice(currentShot); break; case 'dialog': this.handleDialog(currentShot); break; case 'weapon_choice': this.handleWeaponChoice(currentShot); break; case 'story_choice': this.handleStoryChoice(currentShot); break; case 'chat': this.handleChat(currentShot); break; default: console.error('Unhandled shot type:', currentShot.shot_type); } } else { console.info( 'Shot type not accepted or end of scene reached, moving to next scene or back to StoryInfoScene.', ); this.game.sceneTransitionManager.transitionTo('StoryInfoScene'); } } proceedToNextShotOrScene() { console.warn(`DOES BG EXIST ${this.currentBackground}`) // Accessing current scene and shot indexes from saveData const currentScene = this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex]; if (this.game.saveData.currentShotIndex < currentScene.scene_shots.length - 1) { // Move to the next shot within the current scene this.game.saveData.currentShotIndex++; this.processCurrentShot(); } else { // Check if a next scene is specified and valid const nextSceneName = currentScene.next_scene; if (nextSceneName) { const nextSceneIndex = this.game.saveData.storyScript.story_scenes.findIndex( (scene) => scene.scene_name === nextSceneName, ); if (nextSceneIndex !== -1) { // Valid next scene found, transition to it this.game.saveData.currentSceneIndex = nextSceneIndex; this.game.saveData.currentShotIndex = 0; this.setSceneBackground(); // Log scene the player is and was on ProgressLogger.logProgress('snake-king-scene-transition', { prevScene: currentScene.scene_name, nextScene: nextSceneName, }); // Check if the next scene has music defined before attempting to play it if (this.game.saveData.storyScript.story_scenes[nextSceneIndex].music) { const musicKey = `music_${nextSceneIndex}`; console.info(`Playing music: ${musicKey}`); this.game.musicManager.playMusicByKey(musicKey); } this.processCurrentShot(); } else { // Next scene name provided but not found, likely a configuration error console.error('Next scene specified not found:', nextSceneName); resetGame(); } } else { console.warn('No next scene specified. Transitioning to main menu.'); // No next scene specified, indicating the end of the game // Transition back to the StoryInfoScene or an end game scene resetGame(); } } // Important: Remember to save changes to localStorage after updating saveData localStorage.setItem(`rosebud_snake_kings_tribute`, JSON.stringify(this.game.saveData)); } handleCharacterCustomization(shot) { // Define CSS for title bubble const titleBubbleStyle = ` font-family: 'Courier New', sans-serif; font-size: 20px; border-radius: 8px; border-style: solid; border-color: #2F4152; border-width: 1px; background-color: #5A7894; color: #FFF; display: flex; justify-content: center; align-items: center; width: 240px; height: 31px; overflow: hidden; `; // Variables to track the current choice let currentChoiceIndex = 0; // Display the first choice sprite using the dynamically generated key let spriteKey = `customizationSprite_${this.game.saveData.currentSceneIndex}_${this.game.saveData.currentShotIndex}_0`; // For the first choice let currentChoiceSprite = this.add.image(0, 185, spriteKey).setOrigin(0.0).setAlpha(0); currentChoiceSprite.setDepth(10); // Character sprite above the background // Message Bubble (example usage, adjust as necessary) let messageBubbleHtml; if (shot.character === 'player') { messageBubbleHtml = `

Choose your look.

`; } else { messageBubbleHtml = `

Choose ${shot.character}'s look.

`; } let instructionMessage = this.add.dom(195, 665).createFromHTML(messageBubbleHtml).setAlpha(0); // Choice Indicator Bubble let choiceIndicatorHtml = `

CHOICE 1/${shot.choice_sprites.length}

`; let choiceIndicator = this.add.dom(195, 602).createFromHTML(choiceIndicatorHtml).setAlpha(0); // Navigation arrows const leftArrow = this.add .image(47, 765, 'left_arrow') .setInteractive() .setAlpha(0) .on('pointerdown', () => { currentChoiceIndex = (currentChoiceIndex - 1 + shot.choice_sprites.length) % shot.choice_sprites.length; spriteKey = `customizationSprite_${this.game.saveData.currentSceneIndex}_${this.game.saveData.currentShotIndex}_${currentChoiceIndex}`; currentChoiceSprite.setTexture(spriteKey); choiceIndicator.node.innerHTML = `

CHOICE ${currentChoiceIndex + 1}/${shot.choice_sprites.length}

`; }); const rightArrow = this.add .image(344, 765, 'right_arrow') .setInteractive() .setAlpha(0) .on('pointerdown', () => { currentChoiceIndex = (currentChoiceIndex + 1) % shot.choice_sprites.length; spriteKey = `customizationSprite_${this.game.saveData.currentSceneIndex}_${this.game.saveData.currentShotIndex}_${currentChoiceIndex}`; currentChoiceSprite.setTexture(spriteKey); choiceIndicator.node.innerHTML = `

CHOICE ${currentChoiceIndex + 1}/${shot.choice_sprites.length}

`; }); [leftArrow, rightArrow].forEach((arrow) => arrow.setDepth(30)); // Arrows above the instruction background // Confirm button const confirmButton = this.add .image(118, 746, 'confirm_button') .setOrigin(0) .setInteractive() .setAlpha(0) .on('pointerdown', () => { if (!this.allowInteraction) return; // Ignore the interaction if not allowed this.allowInteraction = false; if (this.textures.exists(`speakerSprite_${shot.character}`)) { this.textures.remove(`speakerSprite_${shot.character}`); } // Update the speaker's sprite_url in storyScript const selectedSpriteUrl = shot.choice_sprites[currentChoiceIndex]; this.game.saveData.storyScript.speakers[shot.character].sprite_url = selectedSpriteUrl; ProgressLogger.logProgress('snake-king-player-customization', {'character': shot.character, 'playerChoice': currentChoiceIndex}); this.fadeOutAndProceed([ currentChoiceSprite, choiceIndicator, instructionMessage, leftArrow, rightArrow, confirmButton, ]); }); confirmButton.setDepth(30); // Same depth as arrows, above instruction background // Fade in all elements sequentially this.fadeInElementsSequentially([ currentChoiceSprite, instructionMessage, choiceIndicator, leftArrow, rightArrow, confirmButton, ]); } handleNameChoice(shot) { // CSS for the container const containerStyle = ` display: flex; flex-direction: column; justify-content: space-evenly; align-items: center; height: 200px; width: 300px; border-radius: 8px; border-style: solid; border-color: #2F4152; border-width: 1px; background-color: rgba(255, 255, 255, 0.85); `; // CSS for the title text const titleStyle = ` font-family: 'Courier New', sans-serif; font-size: 22px; color: #000; `; // CSS for the input field const inputStyle = ` font-size: 18px; padding: 10px; `; // CSS for the confirm button const buttonStyle = ` font-size: 14px; padding: 10px; cursor: pointer; border-radius: 8px; color: #FFF; background-color: #5A7894; `; // Combine the individual styles into the HTML content for name selection const nameSelectionHtml = `

Select Your Name

`; // Add the HTML form to the scene const nameSelectionForm = this.add.dom(this.cameras.main.centerX, this.cameras.main.centerY).createFromHTML(nameSelectionHtml).setAlpha(0); // Fade in all elements sequentially this.fadeInElementsSequentially([nameSelectionForm]); // Handle the confirm button click const confirmButton = nameSelectionForm.getChildByID('confirmName'); confirmButton.addEventListener('click', () => { // Disable the button immediately to prevent multiple clicks confirmButton.disabled = true; const playerName = nameSelectionForm.getChildByID('nameInput').value; console.info(`Name selected: ${playerName}`); this.game.saveData.storyScript.speakers.player.name = playerName; // Update the player's name in the story script ProgressLogger.logProgress('snake-king-player-name', {'playerName': playerName}); this.fadeOutAndProceed([nameSelectionForm]); }); } handleDialog(shot) { // Formatting message to replace placeholders let message = shot.message.replace(/{playerName}/g, this.game.saveData.storyScript.speakers.player.name); if (this.game.saveData.storyScript.speakers.player.weapon.name) { message = message.replace(/{playerWeapon}/g, this.game.saveData.storyScript.speakers.player.weapon.name); } // Define CSS for title bubble const titleBubbleStyle = ` font-family: 'Courier New', sans-serif; font-size: 20px; border-radius: 8px; border-style: solid; border-color: #2F4152; border-width: 1px; background-color: #5A7894; color: #FFF; display: flex; justify-content: center; align-items: center; width: 240px; height: 31px; overflow: hidden; `; const narratorMessageBubbleStyle = ` ${this.bubbleStyle} width: 298px; height: 396px; overflow: auto; `; if (shot.speaking !== 'narrator') { const speakerDetails = this.game.saveData.storyScript.speakers[shot.speaking]; let spriteKey = `speakerSprite_${shot.speaking}`; if (!this.textures.exists(spriteKey) && speakerDetails.sprite_url) { // Load the sprite and then display the dialogue after loading is complete loadCharacterSprite.call(this, speakerDetails.sprite_url, spriteKey, () => { let speakerName = shot.speaking === "player" ? this.game.saveData.storyScript.speakers.player.name : shot.speaking; this.displayCharacterDialogue(speakerName, message, spriteKey, this.messageBubbleStyle, titleBubbleStyle); }); } else { // Sprite already loaded, or no URL provided; proceed to display dialogue let speakerName = shot.speaking === "player" ? this.game.saveData.storyScript.speakers.player.name : shot.speaking; this.displayCharacterDialogue(speakerName, message, spriteKey, this.messageBubbleStyle, titleBubbleStyle); } } else { // Narrator dialogue this.displayNarratorDialogue(message, narratorMessageBubbleStyle); } } displayNarratorDialogue(message, bubbleStyle) { // Display the narrator's message bubble const messageBubbleHtml = `

${message}

`; const messageBubble = this.add.dom(22, 224).createFromHTML(messageBubbleHtml).setOrigin(0).setAlpha(0); // Fade in all elements sequentially this.fadeInElementsSequentially([messageBubble]); messageBubble.setInteractive().on('pointerdown', () => { if (!this.allowInteraction) return; // Ignore the interaction if not allowed messageBubble.removeInteractive(); this.fadeOutAndProceed([messageBubble]); }); } displayCharacterDialogue(name, message, spriteKey, messageBubbleStyle, titleBubbleStyle) { // Flag to prevent multiple interactions let interactionHandled = false; // Ensure characterSprite is referenced by its key, not URL const characterSprite = this.add.image(0, 185, spriteKey).setOrigin(0.0).setAlpha(0); // Ensure it's ready for fade-in characterSprite.setInteractive(); // Display the message bubble const messageBubbleHtml = `

${message}

`; const messageBubble = this.add.dom(195, 665).createFromHTML(messageBubbleHtml).setAlpha(0); // Ensure it's ready for fade-in messageBubble.setInteractive(); // Display the title bubble if the speaker is not the narrator let titleBubble; if (name) { const titleBubbleHtml = `

${name}

`; titleBubble = this.add.dom(195, 602).createFromHTML(titleBubbleHtml).setAlpha(0); // Ensure it's ready for fade-in titleBubble.setInteractive(); } // Elements to fade in const elementsToFadeIn = [characterSprite, messageBubble, titleBubble].filter(element => element !== undefined); // Fade in all elements sequentially this.fadeInElementsSequentially(elementsToFadeIn); // Centralized interaction handling const handleInteraction = () => { if (!this.allowInteraction) return; // Ignore the interaction if not allowed if (!interactionHandled) { interactionHandled = true; // Remove interactivity from all elements to prevent further interaction elementsToFadeIn.forEach(element => { if (element.removeInteractive) { element.removeInteractive(); } }); // Proceed with fading out and progressing the story this.fadeOutAndProceed(elementsToFadeIn); } }; // Apply the centralized interaction handler to all interactive elements elementsToFadeIn.forEach(element => { if (element.on) { // For Phaser.GameObjects element.on('pointerdown', handleInteraction); } else if (element.node) { // For Phaser.GameObjects.DOMElement element.node.addEventListener('click', handleInteraction); } }); } handleWeaponChoice() { let weaponSelected = false; this.blockWeaponSelection = false; // Flag to block weapon selection // Background setup remains unchanged const backgroundKey = `background_${this.game.saveData.currentSceneIndex}`; const backgroundImage = this.add.image(0, 0, backgroundKey).setOrigin(0, 0).setTint(0x333333); // Message bubble setup for "Choose a weapon." const messageBubble = this.add.dom(195, 665, 'div', this.messageBubbleStyle, 'Choose a weapon.').setAlpha(0); // Weapon sprites setup const weaponSprites = []; const weaponPositions = [{ x: 47, y: 357 }, { x: 50, y: 80 }, { x: 177, y: 328 }]; const weaponChoiceSprites = this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex].scene_shots[this.game.saveData.currentShotIndex].choice_sprites; Object.entries(weaponChoiceSprites).forEach(([weaponId, spriteUrl], index) => { if (index < weaponPositions.length) { const position = weaponPositions[index]; const spriteKey = `weaponSprite_${this.game.saveData.currentSceneIndex}_${this.game.saveData.currentShotIndex}_${weaponId}`; const sprite = this.add.image(position.x, position.y, spriteKey).setInteractive().setOrigin(0).setAlpha(0); weaponSprites.push(sprite); sprite.on('pointerdown', () => { if (this.blockWeaponSelection) return; setTimeout(() => { if (this.blockWeaponSelection) return; // Check again after the delay weaponSelected = true; this.game.saveData.storyScript.speakers.player.weapon.name = weaponId; messageBubble.setText(`You selected the ${weaponId}.`); if (!this.continueButton) { this.createContinueButton(backgroundImage, messageBubble, weaponSprites); } }, 100); // Delay in milliseconds }); } }); // Fade in all elements including the message bubble and weapon sprites this.fadeInElementsSequentially([messageBubble, ...weaponSprites]); } createContinueButton(backgroundImage, messageBubble, weaponSprites) { // Remove existing continue button if any, to prevent duplicates const existingButton = document.getElementById('continueButton'); if (existingButton) { existingButton.parentNode.removeChild(existingButton); } // Create the continue button with original styling const baseStyle = ` font-family: 'Verdana', sans-serif; font-size: 16px; color: #000; border-style: solid; border-color: #2F4152; background-color: rgba(255, 255, 255, 0.85); box-sizing: border-box; cursor: pointer; padding: 15px; border-radius: 20px; border-width: 1px; `; const continueButtonStyle = ` ${baseStyle} position: absolute; transform: translate(-50%, -50%); z-index: 100; `; // Create the continue button using this.add.dom this.continueButton = this.add.dom(this.cameras.main.centerX, this.cameras.main.centerY, 'button', continueButtonStyle, 'Click Here To Continue') .setOrigin(0.5) .setInteractive() .setName('continueButton'); // Set a name for the button, similar to setting an ID // Add click event listener to handle transition this.continueButton.addListener('click').on('click', (event) => { if (this.blockWeaponSelection) return; event.stopPropagation(); // Stop the event from propagating this.blockWeaponSelection = true; // Block weapon selection when continue is clicked // Disable the continue button to prevent multiple clicks this.continueButton.removeListener('click'); this.continueButton.disableInteractive(); // Proceed with fade out and next steps this.fadeOutAndProceed([backgroundImage, messageBubble, ...weaponSprites, this.continueButton]); }); } handleStoryChoice(shot) { // Prevent multiple selections let hasSelected = false; // Define CSS for title bubble const titleBubbleStyle = ` font-family: 'Courier New', sans-serif; font-size: 20px; border-radius: 8px; border-style: solid; border-color: #2F4152; border-width: 1px; background-color: #5A7894; color: #FFF; display: flex; justify-content: center; align-items: center; width: 240px; height: 31px; overflow: hidden; `; // Player sprite setup const playerSpriteKey = `speakerSprite_player`; // Assuming this key was used in preload const playerSprite = this.add.image(0, 185, playerSpriteKey).setOrigin(0).setAlpha(0); // Example position // Text bubble with the question const questionBubbleHtml = `

${shot.message}

`; const questionBubble = this.add.dom(195, 665).createFromHTML(questionBubbleHtml).setAlpha(0); // Title bubble showing the player character name const playerName = this.game.saveData.storyScript.speakers.player.name || "Player"; const titleBubbleHtml = `

${playerName}

`; const titleBubble = this.add.dom(195, 605).createFromHTML(titleBubbleHtml); // Choices container with flexbox layout const choicesContainer = this.add.dom(195, 805, 'div', { 'display': 'flex', 'flex-direction': 'column', 'justify-content': 'space-around', 'height': '240px', // Adjusted height to accommodate gaps 'width': '325px' }).setAlpha(0); Object.entries(shot.choices).forEach(([choiceText, nextScene], index, array) => { let button = document.createElement('button'); button.innerText = choiceText; // Include margin-bottom except for the last button let marginBottom = index < array.length - 1 ? '5px' : '0'; button.style.cssText = `width: 100%; height: 40px; margin-bottom: ${marginBottom}; font-family: 'Verdana', sans-serif; font-size: 12px; border-radius: 8px; border-style: solid; border-color: #2F4152; border-width: 1px; background-color: #5A7894; color: #FFF;`; button.setAttribute('data-next-scene', nextScene); button.onclick = () => { if (!hasSelected) { hasSelected = true; // Prevent further selections // Update the next_scene of the current scene based on the choice this.game.saveData.storyScript.story_scenes[this.game.saveData.currentSceneIndex].next_scene = nextScene; ProgressLogger.logProgress('snake-king-story-choice', {'userChoice': choiceText}); this.fadeOutAndProceed([titleBubble, questionBubble, playerSprite, choicesContainer]); } }; choicesContainer.node.appendChild(button); }); // Fade in all elements sequentially this.fadeInElementsSequentially([playerSprite, questionBubble, choicesContainer]); } handleChat(shot) { const speakerDetails = this.game.saveData.storyScript.speakers[shot.speaking]; let spriteKey = `speakerSprite_${shot.speaking}`; let speakerSprite; if (!this.textures.exists(spriteKey) && speakerDetails.sprite_url) { // Load the character sprite and then display it loadCharacterSprite.call(this, speakerDetails.sprite_url, spriteKey, () => { speakerSprite = this.add.image(0, 185, spriteKey).setOrigin(0.0); }); } else { speakerSprite = this.add.image(0, 185, spriteKey).setOrigin(0.0); } console.warn(`PRINTING SPEAKER DETAILS: ${JSON.stringify(speakerDetails)}`); console.info(`CHAT SHOT CREATED:\n\nOpen Chat Status: ${shot.is_open_ended}\n\nChat Goal Prompt: ${shot.chat_goal_prompt}\n\nChat Goal Info: ${shot.goal_info}\n\nChat Character: ${shot.speaking}\n\nCharacter Prompt: ${speakerDetails.character_prompt}`); // Instantiating ChatMenu with the scene, chat prompt, success prompt, speaking character, character chat manager state, and system chat manager state this.chatMenu = new ChatMenu(this, shot.is_open_ended, shot.chat_goal_prompt, shot.synopsis_for_ai, shot.goal_info, shot.speaking, speakerDetails.character_prompt, speakerSprite); } fadeInElementsSequentially(elements, duration = 300) { this.allowInteraction = false; // Disable new interactions const timeline = this.tweens.createTimeline(); elements.forEach(element => { timeline.add({ targets: element, alpha: { from: 0, to: 1 }, duration: duration, }); }); timeline.setCallback('onComplete', () => { this.allowInteraction = true; // Re-enable interactions after all elements have faded in }, []); timeline.play(); } fadeOutAndProceed(targets) { this.isInteractionAllowed = false; // Disable interactions during fade-out this.tweens.add({ targets: targets, alpha: 0, duration: 750, onComplete: () => { targets.forEach(target => { if (target instanceof Phaser.GameObjects.DOMElement || target instanceof Phaser.GameObjects.Sprite) { target.destroy(); } }); // Re-enable interactions and transition to the next shot or scene this.isInteractionAllowed = true; this.proceedToNextShotOrScene(); } }); } } function loadCharacterSprite(url, key, callback) { console.info(`Loading sprite: ${url}`); this.load.image(key, url); this.load.once('complete', () => { console.info(`Sprite loaded: ${key}`); callback(); // Call the callback function to proceed }); this.load.start(); } function createMuteToggleButton(scene) { let isMusicPlaying = scene.game.musicManager.currentTrack && scene.game.musicManager.currentTrack.isPlaying; let buttonTexture = 'music_on'; let muteButton = scene.add.image(25, 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 scene.game.musicManager.toggleMusic(); isMusicPlaying = scene.game.musicManager.currentTrack && scene.game.musicManager.currentTrack.isPlaying; muteButton.setTexture(isMusicPlaying ? 'music_on' : 'music_off'); }); return muteButton; // Return the mute button for further use } function createDeleteSaveButton(scene) { let deleteButton = scene.add.image(335, 40, 'restart').setOrigin(0, 0).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(`rosebud_snake_kings_tribute`); // 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 findLastSetBackground(scenes, currentIndex) { for (let i = currentIndex; i >= 0; i--) { if (scenes[i].background) return scenes[i].background; } return null; // Return a default background or null if none found } function findLastSetMusic(scenes, currentIndex) { for (let i = currentIndex; i >= 0; i--) { if (scenes[i].music) return scenes[i].music; } return null; // Return a default music or null if none found } const VERSION_NUMBER = 'v0.5.3'; // Set the version number here. function initializeGame() { const config = { type: Phaser.AUTO, parent: 'renderDiv', scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 390, height: 844, scene: [BootScene, StoryInfoScene, StoryScene], dom: { createContainer: true, }, }; // Assuming 'game' is declared in a broader scope if you need to reference it elsewhere window.game = new Phaser.Game(config); window.game.sceneTransitionManager = new SceneTransitionManager(game); } function resetGame() { if (window.game) { window.game.destroy(true); // true to remove all game objects initializeGame(); // Reinitialize the game } } initializeGame();