Skip to content

Main Menu

ishusharma13 edited this page Oct 16, 2024 · 7 revisions

Main Menu Overview

The Main Menu serves as the central hub through which players can access the various features of the game, such as starting a new game, loading a saved game, viewing achievements, playing minigames, accessing settings, receiving help, and exiting the game. It also features an interactive chatbot and animated elements to enhance the player’s experience.

Key Components

MainMenuDisplay

  • MainMenuDisplay is the core class responsible for rendering the main menu and managing interactions. It defines the layout of buttons, animations, and additional features.
  • The class dynamically adjusts the menu's layout and behavior based on user settings and screen size (responsive design).
  • It also integrates other important systems such as the ChatbotUI, SettingsMenu, and MinigameLeaderboard.

Screenshot 2024-10-16 183951


Buttons and Interactions

The main buttons in the menu include:

  • Start Button: Launches a new game session.
  • Load Button: Opens the interface to load previously saved game data.
  • Minigames Button: Directs players to various in-game minigames.
  • Settings Button: Opens the settings menu where players can adjust their game preferences (e.g., display mode, audio settings).
  • Achievements Button: Displays the player's achievements.
  • Help Button: Shows a help window with multiple instructional slides to guide the player through game mechanics and features.
  • Exit Button: Triggers a confirmation dialog for exiting the game.
  • Chatbot Button (Monkey Icon): Interacts with a chatbot that responds to common questions and provides useful gameplay tips.

Each button has sound feedback when clicked, and most buttons trigger animations to enhance user engagement.

image


Animal Animations

  • Owl: An animated owl character resides in the top-right corner of the main menu. When clicked, the owl hoots and displays random fun facts about various animals. It uses an Image object that cycles through textures for the animation and is dynamically resized based on screen resolution.
  • Monkey: The monkey character sits on the bottom-left corner of the menu. Clicking on the monkey opens the chatbot window. The monkey’s animation consists of six frames, and like the owl, it adjusts its size dynamically with screen changes.
  • Bird and Dog Animations: Additional animated characters, such as a bird and a dog, traverse the screen in dynamic patterns, providing further visual engagement.

Screenshot 2024-10-16 173031 Screenshot 2024-10-16 174642 Screenshot 2024-10-16 175254 Screenshot 2024-10-16 175445


Chatbot Integration

  • ChatbotUI: The ChatbotUI allows users to interact with a chatbot by either typing questions or selecting from pre-defined FAQs. The chatbot window is opened by clicking on the monkey icon in the menu.
  • The chatbot window is resizable and positioned dynamically based on screen size.
  • Players can ask questions about basic game mechanics, and the chatbot responds accordingly.

image


Settings Menu Integration

  • User Settings: The applyUserSettings() method ensures that user preferences (such as fullscreen or windowed mode and audio settings) are applied as soon as the menu is loaded. The settings menu can be accessed via the Settings Button, allowing players to further adjust their game preferences.

Screenshot 2024-10-16 175826 (1)

Help Window and Slides

  • The help window provides an interactive guide for the game. It features multiple slides, each covering a specific aspect of gameplay:
    • MovementSlide: Explains the basic movement mechanics in the game.
    • CombatSlide: Teaches the combat system and available actions.
    • StorylineSlide: Provides background on the game’s narrative and main objectives.
    • MinigamesSlide: Shows the player how to access and play in-game minigames.
    • StatsSlide: Explains how player stats are tracked and how to view achievements.
  • Players can navigate between slides using “Previous” and “Next” buttons, or they can use keyboard inputs for easier navigation.
  • Each slide dynamically resizes and repositions elements based on the screen size to ensure readability and responsiveness. More Info

Screenshot 2024-10-16 181602 Screenshot 2024-10-16 182000 Screenshot 2024-10-16 182011 Screenshot 2024-10-16 182021 Screenshot 2024-10-16 182030 Screenshot 2024-10-16 182040 Screenshot 2024-10-16 182048


Audio Feedback

  • The entire menu features sound effects to improve the user experience. Each button has a unique sound, and interactive elements like the owl and chatbot play different audio cues when interacted with.
  • Mute/Unmute Button: The top-right corner of the screen includes a mute toggle button, allowing players to easily enable or disable background music and sound effects.

image


Exit Confirmation Dialog

  • When the Exit Button is clicked, a confirmation dialog appears, asking the player if they are sure they want to exit the game.
  • This dialog is styled to match the game's visual theme and features "Yes" and "No" options to either close the game or cancel the action.

Screenshot 2024-10-16 182916

Responsive Design

  • The main menu layout is fully responsive, dynamically adjusting its elements to suit different screen resolutions and display modes (fullscreen or windowed).
  • Elements like buttons, animations, and the background are resized proportionally to maintain visual consistency across different devices and screen configurations.

UML Breakdown (Updated)

The UML diagram shows the structure and relationships of the MainMenuDisplay class and its related components. Here is a breakdown of the main elements:

  • MainMenuDisplay:

    • Contains multiple methods responsible for adding UI elements (addMonkey(), addOwl(), addDog(), etc.).
    • Holds references to other components such as SettingsMenu, ChatbotUI, and animated Image objects (e.g., owlAniImage, monkeyAniImage).
  • ChatbotUI:

    • Integrated into MainMenuDisplay and manages the interaction with the chatbot window. It uses methods such as openChatbotWindow() and closeChatbotWindow() to control visibility.
  • Slides:

    • The help window consists of multiple slides (MovementSlide, CombatSlide, StorylineSlide, MinigamesSlide, StatsSlide). Each slide provides specific gameplay instructions and is managed by the HelpWindow class.
  • DogActor:

    • Represents the animated dog character, managed by the MovementSlide. It uses its own methods for drawing, acting, and handling input.

The final UML is shown as follows:

image

for the code version: open https://www.planttext.com/ insert the following code

@startuml
skin rose

package "com.csse3200.game.components.mainmenu" {
    class MainMenuDisplay {
        - - static final Logger logger
  - static final float Z_INDEX
  - Table table
  - ImageButton toggleWindowBtn
  - Texture minimizeTexture
  - Texture maximizeTexture
  - Drawable minimizeDrawable
  - Drawable maximizeDrawable
  - Table menuButtonTable
  - Table loginRegisterTable
  - Table leaderboardTable
  - SettingsMenu settingsMenu
  - MinigameLeaderboard minigameLeaderboard
  - Texture mainTitle
  - Texture lightBackgroundTexture
  - Texture settingBackground
  - Texture toggleTexture
  - Button muteButton
  - Texture muteTexture
  - Texture unmuteTexture
  - Texture dog2Texture
  - Texture crocTexture
  - Texture cursorTexture
  - ChatbotUI chatbotUI
  - Sound owlSound
  - Label factLabel
  - String[] owlFacts
  - boolean isNightMode
  - Texture nightBackgroundTexture
  - Texture dayBackgroundTexture
  - Sound clickSound
  - boolean dogDirection
  - Cursor customCursor
  - CustomButton startBtn
  - CustomButton loadBtn
  - CustomButton minigamesBtn
  - CustomButton settingsBtn
  - CustomButton achievementsBtn
  - CustomButton helpBtn
  - CustomButton exitBtn
  - Image birdAniImage
  - Image monkeyAniImage
  - Image dogAniImage
  - static final float WINDOWBUTTONWIDTH
  - static final float WINDOWBUTTONHEIGHT
  - static final float WINDOWBUTTONSPACING
  - static final float FULLSCREENBUTTONWIDTH
  - static final float FULLSCREENBUTTONHEIGHT
  - static final float FULLSCREENBUTTONSPACING
  - Image owlAniImage
  - Array<TextureRegion> birdTextures
  - Array<TextureRegion> monkeyTextures
  - Array<TextureRegion> dogTextures
  - Array<TextureRegion> owlTextures
  - boolean birdDirection
  - int birdCurrentFrame
  - int monkeyCurrentFrame
  - int dogCurrentFrame
  - int owlCurrentFrame
  - float timer
  - float owlTimer
  - Image titleAniImage
  - Button dayNightBtn
  - Button profileBtn
  - Button trophyBtn
  + void create()
  - void loadTextures()
  - void applyUserSettings()
  - void addActors()
  - void initializeTopLeftButtons()
  - void initializeTables()
  - void initializeMenuButtons()
  - void addOwl()
  - void addMonkey()
  - void addDog()
  - void addBird()
  - void addTitle()
  - void setupCustomCursor()
  - void setupOwlFacts()
  - void addOwlToMenu()
  + void updateMenuButtonLayout()
  + void setMenuUntouchable()
  + void setMenuTouchable()
  + CustomButton createMenuButton(String, Runnable)
  + void addTopLeftToggle()
  + void updateTopLeftToggle()
  - void applyNightMode()
  - void applyDayMode()
  - void updateMuteButtonIcon()
  - void addLoginRegisterTable()
  + void updateLoginRegisterTable()
  - void addLeaderboardTable()
  + void updateLeaderboardTable()
  - void showHelpWindow()
  - void addTopRightButtons()
  + void updateToggleWindowButtonTexture()
  - void addSettingMenu()
  - void handleExitConfirmation()
  + void update()
  + void updateBirdFly()
  + void updateDogRun()
  + ChatbotUI getChatbotUI()
  + void draw(SpriteBatch)
  + float getZIndex()
  + void dispose()
    }
}

package "com.csse3200.game.components.settingsmenu" {
    class SettingsMenu {
        - Window settingsWindow
        - TextField fpsText
        - CheckBox fullScreenCheck
        - Slider audioScaleSlider
        - Slider soundScaleSlider
        - SelectBox<StringDecorator<DisplayMode>> displayModeSelect
        - Label audioScaleValue
        - Label soundScaleValue
        - SelectBox<String> musicSelectBox
        - Skin skin
        - Texture backgroundTexture
        - MainMenuDisplay mainMenuDisplay

        + SettingsMenu(MainMenuDisplay mainMenuDisplay)
        + void create()
        + Table makeSettingsTable()
        + Table createBottomTable()
        - void setupListeners()
        - void applyChanges()
        + void showSettingsMenu()
        + void hideSettingsMenu()
        + void update()
        + void dispose()
    }

    class SettingsMenuDisplay {
        - Table rootTable
        - TextField fpsText
        - CheckBox fullScreenCheck
        - Slider audioScaleSlider
        - Slider soundScaleSlider
        - SelectBox<StringDecorator<DisplayMode>> displayModeSelect
        - Label audioScaleValue
        - Label soundScaleValue
        - SelectBox<String> musicSelectBox

        + SettingsMenuDisplay()
        + void create()
        - void addActors()
        + Table makeSettingsTable()
        + void applyChanges()
        + void update()
        + void dispose()
    }

    class UserSettings {
        - static final String ROOT_DIR
        - static final String SETTINGS_FILE
        - static final int WINDOW_WIDTH
        - static final int WINDOW_HEIGHT
        - static Map<Sound, Float> soundVolumes
        - static Map<Music, Float> musicVolumes
        - static float lastMusicVolume
        - static float lastSoundVolume
        - static boolean isMuted

        + static Settings get()
        + static void set(Settings settings, boolean applyImmediate)
        + static void applySettings(Settings settings)
        + static void applyDisplayMode(Settings settings)
        + static void muteAudio()
        + static void unmuteAudio()
        + static void toggleMute()
    }

    class Settings {
        + int fps
        + boolean fullscreen
        + float audioScale
        + float soundScale
        + DisplaySettings displayMode
        + String selectedMusicTrack
    }

    class DisplaySettings {
        + int width
        + int height
        + int refreshRate

        + DisplaySettings()
        + DisplaySettings(DisplayMode displayMode)
    }
}

package "com.csse3200.game.components.chatbot" {
    class ChatbotUI {
        - Window chatbotWindow
        - TextField userInputField
        - Label chatbotResponseLabel
        - List<String> predefinedQuestions

        + ChatbotUI(Stage stage, Skin skin, MainMenuDisplay menuDisplay)
        + void openChatbotWindow()
        + void closeChatbotWindow()
        + boolean isChatbotWindowVisible()
        + void processChatInput(String userInput)
    }

    class ChatbotService {
        - Map<String, String> responses

        + ChatbotService()
        - void initializeResponses()
        + String getResponse(String userMessage)
    }
}

package "com.csse3200.game.components.mainmenu" {
    class Bird {
        - static final int MOVEMENT
        - Vector3 position
        - Rectangle bounds
        - BirdAnimation birdAnimation
        - Texture texture

        + Bird(int x, int y)
        + void update(float dt)
        + Vector3 getPosition()
        + TextureRegion getTexture()
        + Rectangle getBounds()
        + void dispose()
    }

    class BirdAnimation {
        - Array<TextureRegion> frames
        - float maxFrameTime
        - float currentFrameTime
        - int frameCount
        - int frame

        + BirdAnimation(TextureRegion region, int frameCount, float cycleTime)
        + void update(float dt)
        + TextureRegion getFrame()
    }
}

Slides <|-- MovementSlide
Slides <|-- CombatSlide
Slides <|-- StorylineSlide
Slides <|-- MinigamesSlide
Slides <|-- StatsSlide

MainMenuDisplay --> SettingsMenu : uses
MainMenuDisplay --> SettingsMenuDisplay : uses
MainMenuDisplay --> Slides : uses
MainMenuDisplay --> ChatbotUI : uses
MainMenuDisplay --> Bird : uses
SettingsMenu --> UserSettings : uses
SettingsMenuDisplay --> UserSettings : uses
UserSettings <|-- Settings
UserSettings <|-- DisplaySettings
MainMenuDisplay --> "1" Image : uses monkeyAniImage
MainMenuDisplay --> "1" Image : uses owlAniImage
MainMenuDisplay --> "1" Image : uses birdAniImage
MainMenuDisplay --> "1" Image : uses dogAniImage
Bird *-- BirdAnimation : contains
ChatbotUI --> ChatbotService : uses

@enduml
Clone this wiki locally