Backbox

In this TechTip, we look at the default backbox image and how to make it more interactive. We also look at the LEDs on the backbox.

Displays

Unity supports up to 8 Displays. The numbers 1 to 8 are used in the Unity programming environment, including the Inspector. Somewhat confusingly, the same displays are numbered 0 to 7 in C# code. We will use the numbers 1 to 8 for this discussion.

The P3 uses three Displays:

Display 1 is activated by default by Unity. The other displays are activated in Setup (the base class of P3SASetup).

The LCD screens on the modules are driven by a Raspberry Pi, not directly by Unity. The AppLauncher can show a fixed image from the application’s LauncherMedia/Icons/Auxiliary directory. If you want to display something more dynamic, you will need to talk to Multimorphic. For some reason, they chose not to make this API part of the SDK and there is no public documentation for it.

In the Unity development environment, you can change which Display is shown when the app is running. For example, click on Display 1 in the Game tab and select Display 2 to show the backbox. The image will look stretched. That’s because the playfield is portrait (1080x1920) but the backbox is landscape (1920x1080). You can fix this by creating a new resolution in the Game window. Click on Standalone (1080x1920), click on + at the bottom of the dropdown list, for the Label enter Landscape, for the Width enter 1920, for the Height enter 1080, and click OK. Now the backbox displays correctly. If you go back to Display 1, now the playfield is stretched. You will need to change the resolution back to Standalone.

It is tempting to customize the Unity Layout to have two Game tabs side by side, but there is a bug in Unity 5.6.7 when two Game tabs have different resolutions. Only one of them will display correctly. It might not work well for the playfield and backbox together, but you could make it work for the playfield side by side with the LED simulation.

Camera

To see anything on a Display, you need a Camera with its TargetDisplay set to that Display. This table lists the Cameras defined in each scene of P3SampleApp.

The SecondDisplayCamera is disabled and never used in P3SampleApp. The Camera for the backbox display is created at runtime. More on that later.

When multiple Cameras have the same TargetDisplay, the Camera with the smallest Depth is rendered first, with the higher Depth cameras drawing on top. The Depth is a property on the Camera.

Let’s mention the ApronDisplay because the name might be confusing. The ApronDisplay does not control a whole display. It is a Canvas shown on Display 1 under the lower flippers. The ApronDisplays in the Attract scene and the Home scene are similar, but they have a different object hierarchy.

Canvas

A Canvas is the area where all UI elements must be inside. You can assign a Canvas to a TargetDisplay.

The Render Mode determine how the UI is shown. Choose “Screen Space – Overlay” to render the UI flat on the same plane as the screen. Choose “Screen Space – Camera” to place the Canvas at a given distance in front of the specified Camera within the scene.

You can have multiple Canvas for multiple UI areas, targeting the same or different Displays.

Within one Canvas, UI elements are drawn in hierarchy order, with later elements drawn on top of earlier ones. When multiple Canvas overlap, the one with higher “Sorting Order” draws on top of Canvas with lower “Sorting Order”. The “Sorting Order” is a property on the Canvas.

BackboxImage

The BackboxImage prefab is located at Assets/Resources/Prefabs/Framework/BackboxImage.prefab

This prefab is a Canvas with TargetDisplay set to 2. It is the default content for the backbox Display.

SceneController has a boolean parameter named “Show Default Backbox” to specify if the BackboxImage is used or not. The SceneControllers in P3SampleApp have “Show Default Backbox” set to true.

If the default backbox is disabled for the scene, the SceneController destroys the BackboxImage (if present).

If the default backbox is enabled for the scene, the SceneController reuses the one already there, or else it creates a new one with the DontDestroyOnLoad flag. The CompanyLogo is displayed during the Bootstrap scene. For other scenes, the file matching ./LauncherMedia/Icons/Backbox/*.png or *.jpg is shown instead. If the file does not exist, the app name is shown as Text. In P3SampleApp, the png file exists, though it is just the app name with two black stripes.

Even though, the BackboxCamera’s Culling Mask includes Everything, the scene objects are not visible because the Canvas renders on top of all scene objects.

Layers

The BackboxImage is very limited because it is restricted to a static image. To show more dynamic content, you need to disable it and create your own Camera for TargetDisplay 2.

Unity runs only one scene at a time. That’s the way it is designed. There is no way around it. This means the data for all monitors come from the same scene.

To display different content on Display 1 versus Display 2, you assign the objects to different layers. Unity supports up to 32 Layers, though you must not use layer 31. To see the existing layers in P3SampleApp:

• select Edit > Project Settings > Tags and Layers > Layers,
• or select a game object, select the Layer dropdown in the Inspector window, and select Add Layer.

The Tags and Layers window appears.

Create one or more Layers for the backbox. For example, enter Backbox next to User Layer 15.

In the Camera, you set the Culling Mask to the layers you want to display. For example, on the Main Camera, you may select all Layers except the Backbox Layer. Conversely, on your Backbox Camera, you select only the Backbox Layer. You may also want to select the UI layer. It does not really matter because the UI layer is always on regardless of the Culling Mask.

TwitchChatBot

The TwitchChatBot is shown on Display 2 if the TwitchChatBotDisplay game attribute is true, otherwise it is shown on Display 1. The TwitchChatBotLayer game attribute determines the canvas sorting order. For example, if showing on Display 2, this determines the precedence against the BackboxImage canvas (or whatever Canvas you have defined in your Backbox Layer).

Backbox LEDs

The backbox has 3 LEDs: backboxP3 for the P3 logo, playfield which shines down on the playfield and backbox behind the translite. By default, BaseAppMode creates BackboxColorsMode which sets the colors of these LEDs based on 9 game attributes (unless overridden by a higher priority mode).

BackboxColorsMode responds to these mode events:

Evt_SetBackboxP3Color, Evt_SetBackboxColor and Evt_SetPFColor are called by SettingsMode. The other events are not used by the SDK or P3SampleApp.

You can disable BackboxColorsMode to gain full control of the backbox LEDs. Just set useBackboxColorsMode to false in your <app>BaseGameMode constructor. For P3SampleApp, that would be in P3SABaseGameMode. You may want to handle the Evt_SetBackboxP3Color, Evt_SetBackboxColor and Evt_SetPFColor events in your new mode, but that’s unlikely. Chances are the 9 game attributes are no long relevant when you replace BackboxColorsMode.

The RGB LED Speaker Panel kit is an optional mod that adds LEDs around the backbox speakers. The application can control the speaker LEDs by creating LEDScripts for the following LEDs:

speakerLeft0 .. speakerLeft60

speakerRight0 .. speakerRight60

These LEDs are part of the P3 base platform module definition whether the kit is installed or not. If you control these LEDs and the kit is not installed, nothing bad will happen.

The base platform module definition also declares these LEDs:

backboxBack0 .. backboxBack82

backboxBottom0 .. backboxBottom17

backboxFront0 .. backboxFront89

backboxTop0 .. backboxTop27

cabinetBack0 .. cabinetBack82

cabinetBottom0 .. cabinetBottom171

cabinetFront0 .. cabinetFront20

cabinetTop0 .. cabinetTop155

These can be ignored because they are exclusive to a prototype machine that now sits in the Multimorphic showroom. Multimorphic does not have a commercial offering for the exterior lighting of the backbox or cabinet.