{
  "namespace": "realms_slots",

  "vertical_padding": {
    "type": "panel",
    "size": [ "100%", 10 ]
  },

  "horizontal_padding": {
    "type": "panel",
    "size": [ 2, "100%" ]
  },

  "horizontal_padding_sibling_height": {
    "type": "panel",
    "size": [ 2, "100%sm" ]
  },

  //---------------------------------------------------------------------------
  // Images
  //---------------------------------------------------------------------------

  "realms_background": {
    "type": "panel",
    "controls": [
      {
        "gradient": {
          "type": "image",
          "size": [ "100%", "100%" ],
          "texture": "textures/ui/verticalgradient",
          "tiled": "x",
          "$fill_alpha|default": 0.6,
          "alpha": "$fill_alpha",
          "layer": 1
        }
      },
      {
        "particle_1": {
          "type": "image",
          "size": [ "40%", "40%" ],
          "texture": "textures/ui/realms_particles",
          "anchor_from": "bottom_left",
          "anchor_to": "bottom_left",
          "offset": [ 0, 0 ],
          "$fill_alpha|default": 0.4,
          "alpha": "$fill_alpha",
          "layer": 2
        }
      },
      {
        "particle_2": {
          "type": "image",
          "size": [ "40%", "40%" ],
          "texture": "textures/ui/realms_particles",
          "anchor_from": "top_right",
          "anchor_to": "top_right",
          "offset": [ 0, 10 ],
          "$fill_alpha|default": 0.4,
          "alpha": "$fill_alpha",
          "layer": 2
        }
      }
    ]
  },

  "plus": {
    "type": "image",
    "size": [ 22, 22 ],
    "texture": "textures/ui/color_plus"
  },

  "check": {
    "type": "image",
    "size": [ 34, 28 ],
    "texture": "textures/ui/realms_slot_check",
    "layer": 3
  },

  "world_thumbnail": {
    "type": "image",
    "fill": true,
    "layer": 1,
    "bindings": [
      {
        "binding_type": "collection_details",
        "binding_collection_name": "world_slots"
      },
      {
        "binding_name": "#world_image",
        "binding_name_override": "#texture",
        "binding_type": "collection",
        "binding_collection_name": "world_slots"
      },
      {
        "binding_name": "#world_texture_source",
        "binding_name_override": "#texture_file_system",
        "binding_type": "collection",
        "binding_collection_name": "world_slots"
      },
      {
        "binding_name": "(not #slot_is_filled)",
        "binding_name_override": "#grayscale",
        "binding_type": "collection",
        "binding_collection_name": "world_slots"
      }
    ]
  },

  "realms_stories_icon_glyph": {
    "type": "image",
    "texture": "textures/ui/realmsStoriesIconOverlay",
    "size": [ 22, 22 ],
    "controls": [
      {
        "realms_stories_icon@play.realms_stories_icon": {
          "$glyph_color": "$light_glyph_hover_color"
        }
      }
    ]
  },

  //---------------------------------------------------------------------------
  // Buttons
  //---------------------------------------------------------------------------

  "play_button@common_buttons.dark_text_button": {
    "size": [ "fill", "100%" ],
    "$pressed_button_name": "button.play_realm",
    "$button_text": "menu.play",
    "$button_text_binding_type": "none",
    "$default_button_texture": "textures/ui/realmsContent",
    "$hover_button_texture": "textures/ui/realmsContentHover",
    "$pressed_button_texture": "textures/ui/realmsContentPressed"
  },

  "edit_realm_button@common_buttons.light_text_button": {
    "size": [ "fill", "100%" ],
    "$pressed_button_name": "button.edit_realm",
    "$button_text": "realmsSlotsScreen.editRealm",
    "$button_text_binding_type": "none"
  },

  "realms_feed_button@common_buttons.light_glyph_button": {
    "$pressed_button_name": "button.view_feed",
    "$button_content": "realms_slots.realms_stories_icon_glyph",
    "$button_tts_header": "#realms_feed_button_tts_header",
    "bindings": [
      {
        "binding_name": "#realms_feed_button_tts_header",
        "binding_collection_name": "world_slots",
        "binding_type": "collection"
      }
    ],
    "size": [ "100%y", "100%" ],
    "anchor_from": "top_right",
    "anchor_to": "top_right"
  },

  "unread_story_count_text": {
    "type": "label",
    "color": "$tab_secondary_unchecked_text_color",
    "shadow": false,
    "text": "#realms_unread_story_count",
    "bindings": [
      {
        "binding_type": "collection",
        "binding_name": "#realms_unread_story_count",
        "binding_collection_name": "world_slots"
      }
    ]
  },

  "unread_story_count_text_background": {
    "type": "image",
    "texture": "textures/ui/invite_number_background"
  },

  "unread_story_count_panel": {
    "type": "panel",
    "anchor_from": "top_right",
    "anchor_to": "right_middle",
    "size": [ "100%c", "100%c" ],
    "controls": [
      {
        "text@realms_slots.unread_story_count_text": {
          "layer": 9,
          "controls": [
            {
              "background@realms_slots.unread_story_count_text_background": {
                "layer": -1,
                "size": [ "100%+4px", "100%" ],
                "offset": [ -0.5, 0 ]
              }
            }
          ]
        }
      }
    ],
    "bindings": [
      {
        "binding_type": "collection",
        "binding_name": "#realms_unread_story_count_visible",
        "binding_name_override": "#visible",
        "binding_collection_name": "world_slots"
      }
    ]
  },

  "edit_world_button_panel": {
    "type": "stack_panel",
    "orientation": "vertical",
    "size": [ "100% - 4px", 46 ],
    "anchor_from": "top_middle",
    "anchor_to": "top_middle",
    "$default_button_texture": "textures/ui/button_borderless_light",
    "$hover_button_texture": "textures/ui/button_borderless_lighthover",
    "$pressed_button_texture": "textures/ui/button_borderless_lightpressed",
    "controls": [
      {
        "edit_world_button@common_buttons.light_text_button": {
          "size": [ "100%", 22 ],
          "$pressed_button_name": "button.edit_world",
          "$button_text": "#edit_world_button_button_string",
          "$button_text_binding_type": "collection",
          "$button_text_grid_collection_name": "world_slots",
          "bindings": [
            {
              "binding_type": "collection_details",
              "binding_collection_name": "world_slots"
            }
          ]
        }
      },
      {
        "padding": {
          "type": "panel",
          "size": [ "100%", 2 ]
        }
      },
      {
        "activate_world_button@common_buttons.light_text_button": {
          "size": [ "100%", 22 ],
          "$pressed_button_name": "button.activate_world",
          "$button_text": "realmsSlotsScreen.activateWorld",
          "$button_text_binding_type": "none",
          "bindings": [
            {
              "binding_type": "collection_details",
              "binding_collection_name": "world_slots"
            },
            {
              "binding_name": "#show_activate_world",
              "binding_name_override": "#visible",
              "binding_type": "collection",
              "binding_collection_name": "world_slots"
            }
          ]
        }
      }
    ]
  },

  "world_slot_button@common_buttons.dark_content_button": {
    "size": [ "fill", "80%x" ],
    "$pressed_button_name": "button.world_slot",
    "$button_content": "realms_slots.world_slot_button_content",
    "$default_button_texture": "textures/ui/button_border_dark",
    "$hover_button_texture": "$default_button_texture",
    "$pressed_button_texture": "$default_button_texture",
    "bindings": [
      {
        "binding_type": "collection_details",
        "binding_collection_name": "world_slots"
      },
      {
        "binding_collection_name": "world_slots",
        "binding_name": "(not #slot_edit_buttons_toggle)",
        "binding_name_override": "#focus_enabled",
        "binding_type": "collection"
      }
    ]
  },

  "world_slot_button_content": {
    "type": "stack_panel",
    "orientation": "vertical",
    "size": [ "100%", "100%" ],
    "controls": [
      {
        "world_slot_top": {
          "type": "panel",
          "size": [ "100% + 4px", "70%" ],
          "controls": [
            {
              "background": {
                "type": "image",
                "size": [ "100% - 2px", "100% + 4px" ],
                "offset": [ -2, 1 ],
                "fill": true,
                "texture": "textures/ui/banners_no_border",
                "layer": 1
              }
            },
            {
              "add_world_image_panel": {
                "type": "panel",
                "size": [ "121.429%y", "50% - 4px" ],
                "offset": [ -2, 0 ],
                "layer": 2,
                "controls": [
                  {
                    "plus_image@realms_slots.plus": {}
                  }
                ],
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "(not #slot_image_visible)",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            },
            {
              "world_thumbnail_image_panel": {
                "type": "panel",
                "size": [ "100% - 2px", "100% + 4px" ],
                "offset": [ -2, 1 ],
                "layer": 3,
                "controls": [
                  {
                    "world_thumbnail@realms_slots.world_thumbnail": {}
                  }
                ],
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#slot_image_visible",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            },
            {
              "edit_world_button_panel@realms_slots.edit_world_button_panel": {
                "offset": [ -2, 0.25 ],
                "layer": 9,
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#slot_edit_buttons_toggle",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            },
            {
              "foreground": {
                "type": "image",
                "size": [ "100% - 2px", "100% + 4px" ],
                "offset": [ -2, 1 ],
                "alpha": 0.6,
                "texture": "textures/ui/Black",
                "layer": 8,
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#slot_edit_buttons_toggle",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            },
            {
              "check_image@realms_slots.check": {
                "size": [ "121.429%y", "50% - 4px" ],
                "anchor_to": "bottom_middle",
                "anchor_from": "bottom_middle",
                "offset": [ -2, -1.75 ],
                "layer": 7,
                "bindings": [
                  {
                    "binding_type": "collection_details",
                    "binding_collection_name": "world_slots"
                  },
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#slot_is_current_world",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            }
          ]
        }
      },
      {
        "world_slot_bottom": {
          "type": "panel",
          "size": [ "100% + 2px", "30% - 2.3px" ],
          "controls": [
            {
              "divider_line_black": {
                "type": "image",
                "size": [ "100% + 2px", 3 ],
                "texture": "textures/ui/blackline",
                "anchor_from": "top_middle",
                "anchor_to": "top_middle",
                "offset": [ -1, 2 ],
                "tiled": true,
                "fill": true,
                "layer": 5
              }
            },
            {
              "divider_line_white": {
                "visible": "($hover_state or $pressed_state)",
                "type": "image",
                "size": [ "100% + 2px", 2 ],
                "texture": "textures/ui/whiteline",
                "anchor_from": "top_middle",
                "anchor_to": "top_middle",
                "offset": [ -1, 2 ],
                "tiled": true,
                "fill": true,
                "layer": 10
              }
            },
            {
              "add_world_text_panel": {
                "type": "panel",
                "controls": [
                  {
                    "background_grey": {
                      "visible": "$default_state",
                      "type": "image",
                      "fill": true,
                      "offset": [ -1, 4 ],
                      "texture": "textures/ui/button_inside_dark",
                      "layer": 1
                    }
                  },
                  {
                    "background_green": {
                      "visible": "($hover_state or $pressed_state)",
                      "type": "image",
                      "size": [ "100% + 2px", "100% + 1px" ],
                      "fill": true,
                      "offset": [ -1, 4 ],
                      "texture": "textures/ui/banners_no_border_dark_hover",
                      "layer": 1
                    }
                  },
                  {
                    "add_world_text": {
                      "type": "label",
                      "size": [ "default", "60%" ],
                      "layer": 2,
                      "offset": [ 0, 4 ],
                      "font_scale_factor": 1.2,
                      "font_type": "smooth",
                      "text": "#new_slot_label",
                      "color": "$dark_button_default_text_color",
                      "bindings": [
                        {
                          "binding_collection_name": "world_slots",
                          "binding_name": "#new_slot_label",
                          "binding_type": "collection"
                        }
                      ]
                    }
                  }
                ],
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "(not #slot_is_filled)",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            },
            {
              "world_info_panel": {
                "type": "panel",
                "controls": [
                  {
                    "background": {
                      "visible": "$default_state",
                      "type": "image",
                      "fill": true,
                      "offset": [ -1, 4 ],
                      "alpha": 0.8,
                      "texture": "textures/ui/Black",
                      "layer": 1
                    }
                  },
                  {
                    "background_green": {
                      "visible": "($hover_state or $pressed_state)",
                      "type": "image",
                      "size": [ "100% + 2px", "100% + 1px" ],
                      "fill": true,
                      "offset": [ -1, 4 ],
                      "texture": "textures/ui/banners_no_border_dark_hover",
                      "layer": 1
                    }
                  },
                  {
                    "world_info_stack_panel@realms_slots.world_info_stack_panel": {}
                  }
                ],
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#slot_is_filled",
                    "binding_name_override": "#visible",
                    "binding_type": "collection"
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  "world_info_stack_panel": {
    "type": "stack_panel",
    "size": [ "100% - 10px", "100% - 2px" ],
    "orientation": "vertical",
    "offset": [ -3, 4 ],
    "layer": 2,
    "controls": [
      {
        "world_name_panel": {
          "type": "panel",
          "size": [ "100%", 10 ],
          "controls": [
            {
              "world_name": {
                "type": "label",
                "size": [ "default", "default" ],
                "max_size": [ "100%", 10 ],
                "anchor_from": "left_middle",
                "anchor_to": "left_middle",
                "font_type": "smooth",
                "text": "#world_slot_name",
                "color": "$dark_button_default_text_color",
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#world_slot_name",
                    "binding_type": "collection"
                  }
                ]
              }
            }
          ]
        }
      },
      {
        "world_type_panel": {
          "type": "panel",
          "size": [ "100%", 9 ],
          "controls": [
            {
              "world_type": {
                "type": "label",
                "size": [ "default", "default" ],
                "max_size": [ "100%", 10 ],
                "font_scale_factor": 0.9,
                "anchor_from": "left_middle",
                "anchor_to": "left_middle",
                "font_type": "smooth",
                "color": "$tab_unchecked_text_color",
                "text": "#world_slot_type",
                "bindings": [
                  {
                    "binding_collection_name": "world_slots",
                    "binding_name": "#world_slot_type",
                    "binding_type": "collection"
                  }
                ]
              }
            }
          ]
        }
      },
      {
        "bottom_padding": {
          "type": "panel",
          "size": [ "100%", "fill" ]
        }
      }
    ]
  },

  //---------------------------------------------------------------------------
  // Screen Content
  //---------------------------------------------------------------------------

  "main_stack_panel": {
    "type": "stack_panel",
    "orientation": "vertical",
    "size": [ "100% - 20px", "100%c" ],
    "bindings": [
      {
        "binding_name": "#tts_dialog_body",
        "binding_condition": "once"
      }
    ],
    "property_bag": {
      "#tts_dialog_body": "realmsSlotsScreen.description"
    },
    "controls": [
      {
        "padding_0@realms_slots.vertical_padding": {}
      },
      {
        "button_panel": {
          "type": "stack_panel",
          "orientation": "horizontal",
          "size": [ "100%", 30 ],
          "controls": [
            {
              "play_button@realms_slots.play_button": {}
            },
            {
              "left_padding@realms_slots.horizontal_padding": {}
            },
            {
              "edit_realm_button@realms_slots.edit_realm_button": {}
            },
            {
              "right_padding@realms_slots.horizontal_padding": {}
            },
            {
              "feed_panel_with_unread_count": {
                "type": "panel",
                "size": [ "100%y", "100%" ],
                "controls": [
                  {
                    "feed_panel": {
                      "type": "panel",
                      "size": [ "100%c - 1px", "100% + 1px" ],
                      "controls": [
                        {
                          "realms_feed_button@realms_slots.realms_feed_button": {
                            "layer": 1
                          }
                        }
                      ]
                    }
                  },
                  {
                    "unread_story_count@realms_slots.unread_story_count_panel": {
                      "offset": [ 0, 1.5 ]
                    }
                  }
                ]
              }
            }
          ]
        }
      },
      {
        "padding_1@realms_slots.vertical_padding": {}
      },
      {
        "text_panel_0": {
          "type": "panel",
          "size": [ "100%", "100%c" ],
          "controls": [
            {
              "text": {
                "type": "label",
                "size": [ "60%", "default" ],
                "text": "realmsSlotsScreen.description",
                "color": "$dark_button_default_text_color",
                "text_alignment": "center"
              }
            }
          ]
        }
      },
      {
        "padding_2@realms_slots.vertical_padding": {}
      },
      {
        "worlds_panel": {
          "type": "stack_panel",
          "orientation": "horizontal",
          "size": [ "100%", "100%cm" ],
          "collection_name": "world_slots",
          "controls": [
            {
              "world_slot_1@realms_slots.world_slot_button": {
                "collection_index": 0
              }
            },
            {
              "padding_0@realms_slots.horizontal_padding_sibling_height": {}
            },
            {
              "world_slot_2@realms_slots.world_slot_button": {
                "collection_index": 1
              }
            },
            {
              "padding_1@realms_slots.horizontal_padding_sibling_height": {}
            },
            {
              "world_slot_3@realms_slots.world_slot_button": {
                "collection_index": 2
              }
            }
          ]
        }
      },
      {
        "padding_3@realms_slots.vertical_padding": {}
      },
      {
        "text_panel_1": {
          "type": "panel",
          "size": [ "100%", "100%c" ],
          "bindings": [
            {
              "binding_name": "#warning_text_visible",
              "binding_name_override": "#visible"
            }
          ],
          "controls": [
            {
              "text": {
                "type": "label",
                "size": [ "60%", "default" ],
                "text": "realmsSlotsScreen.activateWarning",
                "color": "$dark_button_default_text_color",
                "text_alignment": "center"
              }
            }
          ]
        }
      }
    ]
  },

  //--------------------------------------------------------------------------------
  // Screen
  //--------------------------------------------------------------------------------

  "realms_slots_screen@common.base_screen": {
    "button_mappings": [
      {
        "from_button_id": "button.menu_select",
        "to_button_id": "button.menu_select",
        "mapping_type": "pressed"
      },
      {
        "from_button_id": "button.menu_cancel",
        "to_button_id": "button.exit_or_toggle",
        "mapping_type": "global"
      }
    ],
    "$screen_content": "realms_slots.realms_slots_screen_content",
    "$header_safezone_control": "common_store.store_top_bar_filler",
    "$header_bar_control": "common_store.store_top_bar",
    "$screen_background_control": "realms_slots.realms_background",
    "$is_full_screen_layout": true
  },

  "realms_slots_screen_content": {
    "type": "panel",
    "size": [ "100%", "100%" ],
    "controls": [
      {
        "background@common.fullscreen_header": {
          "$back_button_has_title": true,
          "$button_text": "#slots_screen_header",
          "$button_text_binding_type": "global",
          "$child_control": "realms_slots.realms_slots_screen_content_panel",
          "$show_close_button": true
        }
      }
    ]
  },

  "realms_slots_screen_content_panel": {
    "type": "panel",
    "size": [ "100%", "100%" ],
    "controls": [
      {
        "main_scroll_panel@common.scrolling_panel": {
          "$scrolling_content_anchor_from": "top_middle",
          "$scrolling_content_anchor_to": "top_middle",
          "$scrolling_content": "realms_slots.main_stack_panel",
          "$show_background": false,
          "$scroll_size": [ "5px", "100% - 8px" ],
          "$scroll_bar_left_padding_size": [ 4, 0 ],
          "layer": 3
        }
      }
    ]
  }
}