---
sidebar_position: 4
---

# Set Up Spinning Panel

---

## Overview

Reel slot panel is just one part one the spinning panel. 

There are other panels that need to be setup: **landing-panel**, **tension-panel**, **present-win-cell-panel** and **present-win-border-panel**.

The setup is very straightforward by using the `Generate Panel` command in each panel's helper class.

## Set Up Panel

- Landing Panel: 

    ![Landing Panel](../img/05-main-scene/landing-panel.png)     

To define Landing Panel, create the following script:

:::warning
    ```jsx title="assets/game-assets/scripts/slotty-settings/extend-slotty-setting.js"
    SlottySetting.prototype._registerInjection = function () {
        DIContainer.Register('landingGenerator', require('landing-generator'));
    };
    ```
:::

- Present Win Cell Panel:

    ![Present Win Cell Panel](../img/05-main-scene/present-win-cell-panel.png)

- Present Win Cell Panel:

    ![Present Win Border Panel](../img/05-main-scene/present-win-border-panel.png)

- Tension Panel:

    ![Tension Panel](../img/05-main-scene/tension-panel.png)

    If the tension use a custom size frame, we can change the option **sizeMode** to **Custom** and set the static frame and size.

    ![Tension Size Custom](../img/05-main-scene/tension-panel-custom.png)    

    **check toggle General Panel** 

    ![Tension Size Custom](../img/05-main-scene/note-bug-tension.png)    
    To define Tension Panel, create the following script:
    :::warning
    ```jsx title="assets/game-assets/scripts/slotty-settings/extend-slotty-setting.js"
    SlottySetting.prototype._registerInjection = function () {
        DIContainer.Register('tensionGenerator', require('tension-generator'));
    };
    ```
    :::