diff --git a/docs/gmc/images/add_color_rect.png b/docs/gmc/images/add_color_rect.png new file mode 100644 index 0000000000..97a9f4a916 Binary files /dev/null and b/docs/gmc/images/add_color_rect.png differ diff --git a/docs/gmc/images/add_node_to_scene.png b/docs/gmc/images/add_node_to_scene.png new file mode 100644 index 0000000000..c5972fd128 Binary files /dev/null and b/docs/gmc/images/add_node_to_scene.png differ diff --git a/docs/gmc/images/create_attract_slide.png b/docs/gmc/images/create_attract_slide.png index 5a8845d596..94b7121352 100644 Binary files a/docs/gmc/images/create_attract_slide.png and b/docs/gmc/images/create_attract_slide.png differ diff --git a/docs/gmc/images/label_settings.png b/docs/gmc/images/label_settings.png new file mode 100644 index 0000000000..bedd885f13 Binary files /dev/null and b/docs/gmc/images/label_settings.png differ diff --git a/docs/gmc/images/new_scene_root_node.png b/docs/gmc/images/new_scene_root_node.png new file mode 100644 index 0000000000..990e32d5e5 Binary files /dev/null and b/docs/gmc/images/new_scene_root_node.png differ diff --git a/docs/gmc/images/new_slide_scene.png b/docs/gmc/images/new_slide_scene.png new file mode 100644 index 0000000000..f2c729f522 Binary files /dev/null and b/docs/gmc/images/new_slide_scene.png differ diff --git a/docs/gmc/images/select_rect_color.png b/docs/gmc/images/select_rect_color.png new file mode 100644 index 0000000000..a16cee6937 Binary files /dev/null and b/docs/gmc/images/select_rect_color.png differ diff --git a/docs/gmc/images/set_main_scene.png b/docs/gmc/images/set_main_scene.png new file mode 100644 index 0000000000..62f273f992 Binary files /dev/null and b/docs/gmc/images/set_main_scene.png differ diff --git a/docs/gmc/setup.md b/docs/gmc/setup.md index f0571e4046..d384df4253 100644 --- a/docs/gmc/setup.md +++ b/docs/gmc/setup.md @@ -6,6 +6,7 @@ title: Setting up GMC Before we can start building scenes, a few project setup steps are required. With your project open in the Godot Editor, go to *Project > Project Settings* to open the settings dialog. + ## Set the Main Scene Every slide, widget, and other UI file in Godot is called a "scene". When your Godot project runs, it needs to know which scene to load as its entry point. @@ -16,6 +17,9 @@ As your project becomes more complex and your knowledge of Godot improves, you m Since your Godot project is brand new, you need to tell it what scene is the entry point. On the left menu bar of Project Settings, select *Application > Run* and in the Main Scene picker, navigate to `/addons/mpf-gmc/slides/window.tscn` and select that to be your main scene. +![image](images/set_main_scene.png) + + ## Set the Window Size If you only have one display for your game, your Window size will be the size of that display. If you are using multiple displays, the Window size will be the size of the box necessary to encompass all of the displays. @@ -26,6 +30,7 @@ The other settings here will be customized later, including windowed/fullscreen You can now close the Project Settings and save your project. + ## Configure the Audio Busses Godot manages audio through a series of buses that feed into the *Master* audio bus for output to speakers. You can configure as many audio buses as you'd like, and most pinball projects use a standard set of three: *music*, *effects*, and *voice*. @@ -34,6 +39,7 @@ Godot manages audio through a series of buses that feed into the *Master* audio Each bus can be configured with its own parameters for how it plays back sounds (e.g. music plays one file at a time, voice plays files sequentially, and effects play files simultaneously), how it ducks for other buses, and which bus is the default. + ### Create Buses in Godot Editor At the bottom panel of the Godot Editor there is a tab called *Audio* which will bring up the audio control panel. By default your new project only has one bus, "Master", which is the main audio output. @@ -46,6 +52,7 @@ At the bottom panel of the Godot Editor there is a tab called *Audio* which wil Click on the *Add Bus* button to add a new bus and name it *"music"* (case sensitive). Do the same for *"effects"* and *"voice"*, or customize the buses to what you need for your project. + ### Configure the Busses in GMC Config File Unfortunately, Godot Audio Buses are not extensible like Nodes, so GMC cannot create customization options directly on the buses. Instead, a GMC configuration file will be used to configure the audio system. @@ -62,17 +69,38 @@ Create a new text file in the root of your project called *gmc.cfg* and paste in You may then adjust these defaults if you've customized your buses, but otherwise this configuration will take care of you for a while. Save the *gmc.cfg* file and close it. + ## Create an Attract Mode slide The first slide we will create is for Attract mode, so we can connect to MPF and verify that GMC is working properly. Slides can live in either a `slides` folder in the project root, or in a `slides` subfolder under any mode in your project modes folder (e.g. `/modes/attract/slides`). Create a slides folder in either location, and then in the Godot FileSystem panel right-click on the slides folder and select *Create New > Scene*. +![image](images/new_slide_scene.png) + +Enter the name of your slide "attract" as the scene name and click the tree icon to open the root type selection menu. + ![image](images/create_attract_slide.png) -Every slide in GMC must derive from the custom `MPFSlide` class, so in the *Create New Scene* dialog under **Root Type** click on the tree icon to pick a custom node class. Search for and select the `MPFSlide` class. Enter the name of your slide "attract" as the scene name, and press OK to create the scene. +Every slide in GMC must derive from the custom `MPFSlide` class, so in the *Create New Scene* dialog under **Root Type** click on the tree icon to pick a custom node class. Search for and select the `MPFSlide` class, then press "Pick". + +![image](images/new_scene_root_node.png) + +Back in the "Create new Scene" menu, press OK to complete creation. + ## Decorate the Attract slide -You'll now be at the Scene Editor view for the attract slide, which is empty. We'll start by adding a nice background color: In the *Scene* panel in the upper-left, click on the **+** icon to add a new node. In the node panel, search for and select `ColorRect` to add a colored rectangle to the scene. Drag the rectangle's corners to fill the purple dimensions on screen (which correspond to your Window size). Use the color picker in the *Inspector* panel to set a nice color. +You'll now be at the Scene Editor view for the attract slide, which is empty. We'll start by adding a nice background color: In the *Scene* panel in the upper-left, click on the **+** icon to add a new node. + +![image](images/add_node_to_scene.png) + +In the node panel, search for and select `ColorRect` to add a colored rectangle to the scene. + +![image](images/add_color_rect.png) + +Drag the rectangle's corners to fill the purple dimensions on screen (which correspond to your Window size). Use the color picker in the *Inspector* panel to set a nice color. + +![image](images/select_rect_color.png) + !!! tip @@ -82,8 +110,13 @@ Next we'll add some text to the slide. Back at the *Scene* panel, add another no In the *Inspector* panel, in the *Text* field type in the text "Welcome to GMC!", set the *Horizontal Alignment* to Center, and under *Theme Overrides > Font Sizes* set a nice big font, like 100px. +![image](images/label_settings.png) + +Overall you should have a slide with a background color and text label that looks something like this: + ![image](images/attract_slide.png) + ## Run MPF In your `attract.yaml` mode config, add the following block: @@ -110,6 +143,7 @@ In your terminal, in your project folder with your virtual environment activated sudo ln -s /Applications/Godot.app/Contents/MacOS/Godot /usr/local/bin/godot ``` + ## Create a Keymap For testing your game, it's convenient to setup a keyboard map for using keys to simulate switches and events without a connection to a physical machine.