{
  "namespace": "host_options",

  //////////////////////////////////////////////////////////////////////////
  // Host Panel
  //////////////////////////////////////////////////////////////////////////

  "button_label": {
    "type": "label",
    "text": "$button_text",
    "$button_label_shadow|default": false,
    "shadow": "$button_label_shadow",
    "$button_label_anchor_from|default": "center",
    "$button_label_anchor_to|default": "center",
    "$button_label_offset|default": [ 0, 0 ],
    "anchor_from": "$button_label_anchor_from",
    "anchor_to": "$button_label_anchor_to",
    "offset": "$button_label_offset",
    "color": "$button_text_color",

    // For text bindings
    "$button_text_binding_type|default": "none",
    "$button_binding_condition|default": "none",
    "$button_text_grid_collection_name|default": "",

    "bindings": [
      {
        "binding_type": "$button_text_binding_type",
        "binding_condition": "$button_binding_condition",
        "binding_collection_name": "$button_text_grid_collection_name",
        "binding_name": "$button_text",
        "binding_name_override": "$button_text"
      }
    ]
  },

  "host_image_panel": {
    "type": "panel",
    "size": [ 17, 17 ],
    "controls": [
      {
        "host_image@host_options.button_label": {
          "$button_text_color": "$text_color",
          "$button_text": "/"
        }
      }
    ]
  },

  "host_glyph_panel": {
    "$offset_glyph|default": [ 0, 0 ],
    "type": "image",
    "layer": 1,
    "offset": "$offset_glyph",
    "anchor_from": "$button_glyph_anchor_from",
    "anchor_to": "$button_glyph_anchor_to",

    "texture": "$button_glyph_texture",

    // For texture bindings
    "$button_glyph_binding_type|default": "none",
    "$button_glyph_binding_condition|default": "none",
    "$button_glyph_grid_collection_name|default": "",

    "$button_glyph_visible_binding_type|default": "none",
    "$button_glyph_visible_binding_condition|default": "none",
    "$button_glyph_visible_collection_name|default": "",

    "bindings": [
      {
        "binding_type": "$button_glyph_binding_type",
        "binding_condition": "$button_glyph_binding_condition",
        "binding_collection_name": "$button_glyph_grid_collection_name",
        "binding_name": "$button_glyph_texture",
        "binding_name_override": "$button_glyph_texture"
      },
      {
        "binding_type": "$button_glyph_visible_binding_type",
        "binding_condition": "$button_glyph_visible_binding_condition",
        "binding_collection_name": "$button_glyph_visible_collection_name",
        "binding_name": "#button_glyph_visible",
        "binding_name_override": "#visible"
      }
    ]
  },

  // Scrollable Panel //

  "scrollable_selector_area@common.scrolling_panel": {
    "$size_scrollable_panel|default": [ "100%", "100%" ],
    "$offset_scrollable_panel|default": [ 0, 0 ],

    "offset": "$offset_scrollable_panel",
    "size": "$size_scrollable_panel",
    "anchor_from": "bottom_left",
    "anchor_to": "bottom_left",

    "$scroll_size": [ 5, "100%" ],
    "$show_background": false,
    "$scroll_bar_contained": false
  },

  "host_main_button@common_buttons.light_text_form_fitting_button": {
    "$pressed_button_name": "button.host_toggle",
    "anchor_from": "bottom_right",
    "anchor_to": "bottom_right",
    "size": [ "100%c", 27 ],
    "$focus_id": "host_main_button_focus_id",
    "$button_type_panel": "host_options.host_image_panel",
    "bindings": [
      {
        "binding_name": "#cheats_on",
        "binding_name_override": "#visible"
      },
      {
        "binding_name": "#host_main_button_focus_override_up",
        "binding_name_override": "#focus_change_up"
      },
      {
        "binding_name": "#host_main_button_focus_override_down",
        "binding_name_override": "#focus_change_down"
      }
    ]
  },

  "scrolling_panel": {
    "type": "panel",
    "size": [ "100%", "100%" ],
    "anchor_from": "bottom_left",
    "anchor_to": "bottom_left",

    "$main_scrolling_content|default": "host_main_buttons",
    "$main_offset_scrollable_panel|default": [ 0, -1 ],
    "$main_offset_background|default": [ -2, 0 ],
    "$main_size_scrollable_panel|default": [ "100% - 2px", "100% - 4px" ],
    "$main_background_visible": true,

    "$scroll_bar_right_padding_size": [ 0, 0 ],

    "controls": [
      {
        "background": {
          "type": "image",
          "texture": "textures/ui/Banners",
          "offset": "$main_offset_background",
          "size": [ "100% + 4px", "100%" ],
          "anchor_from": "bottom_left",
          "anchor_to": "bottom_left",
          "visible": "$main_background_visible"
        }
      },
      {
        "scrollable_tab@host_options.scrollable_selector_area": {
          "layer": 2,
          "$scrolling_content": "$main_scrolling_content",
          "anchor_from": "bottom_middle",
          "anchor_to": "bottom_middle",
          "$offset_scrollable_panel": "$main_offset_scrollable_panel",
          "$size_scrollable_panel": "$main_size_scrollable_panel"
        }
      }
    ]
  },

  "button_content": {
    "$button_glyph_visible|default": true,
    "$button_glyph_texture|default": "textures/ui/arrowRight",
    "$glyph_size|default": [ 8, 8 ],
    "$button_content_offset_glyph|default": [ 0, 0 ],

    "type": "panel",
    "controls": [
      {
        "button_label@host_options.button_label": {
          "$button_text_color|default": "$text_color",
          "$button_label_anchor_from": "left_middle",
          "$button_label_anchor_to": "left_middle"
        }
      },
      {
        "image@host_options.host_glyph_panel": {
          "$offset_glyph": "$button_content_offset_glyph",
          "$button_glyph_anchor_from|default": "center",
          "$button_glyph_anchor_to|default": "center",
          "visible": "$button_glyph_visible",
          "size": "$glyph_size"
        }
      }
    ]
  },

  "main_light_button@common_buttons.light_content_button": {
    "$button_size|default": [ "100%", 30 ],
    "size": "$button_size",
    "offset": "$button_offset",
    "$button_content": "host_options.button_content"
  },

  "main_dark_button@common_buttons.dark_content_button": {
    "$button_size|default": [ "100%", 30 ],
    "size": "$button_size",
    "$button_content": "host_options.button_content",
    "$glyph_size": [ "20px", "20px" ]
  },

  // Sub command helper grid //

  "host_grid": {
    "type": "grid",
    "size": [ "100%", "default" ],
    "grid_item_template": "$grid_item_template",
    "grid_dimension_binding": "$grid_dimension_binding",
    "collection_name": "$grid_collection_name",
    "anchor_to": "top_left",
    "anchor_from": "top_left",
    "bindings": [
      {
        "binding_name": "$grid_dimension_binding"
      }
    ]
  },

  // Button for the sub command grid //

  "host_sub_command_grid_item": {
    "type": "panel",
    "size": [ "100%", 30 ],
    "controls": [
      {
        "host_option_banner@main_dark_button": {
          "$button_text": "#button_text",
          "$button_text_binding_type": "collection",
          "$button_text_grid_collection_name": "$grid_collection_name",
          "$pressed_button_name": "button.sub_command",

          "$button_glyph_anchor_from": "left_middle",
          "$button_glyph_anchor_to": "left_middle",
          "$button_content_offset_glyph": [ 2, 0 ],
          "$button_label_offset": [ 30, 0 ],

          "$button_glyph_texture": "#texture",
          "$button_glyph_binding_type": "collection",
          "$button_glyph_grid_collection_name": "$grid_collection_name",

          "property_bag": {
            "#sub_command": ""
          },
          "bindings": [
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#sub_command"
            }
          ]
        }
      }
    ]
  },

  // Return to the main panel button (requires the button_text field) //

  "return_from_sub_command_button@host_options.main_light_button": {
    "anchor_from": "bottom_left",
    "anchor_to": "bottom_left",
    "$button_label_offset": [ 30, 0 ],
    "$pressed_button_name": "button.host_main",
    "$button_glyph_texture": "textures/ui/arrowLeft",
    "$glyph_size": [ 8, 8 ],
    "$button_glyph_anchor_from": "left_middle",
    "$button_glyph_anchor_to": "left_middle",
    "$button_content_offset_glyph": [ 10, 0 ]
  },

  //////////////////////////////////////////////////////////////////////////
  // Teleport
  //////////////////////////////////////////////////////////////////////////

  // This is defined in the pause namespace, stealing it from there
  "platform_icon_panel@pause.platform_icon_panel": {
    "$icon_panel_size": [ "100%c + 2px", "100%" ]
  },

  "gamertag_wrapper@pause.gametag_wrapper": {
    "anchor_from": "left_middle",
    "anchor_to": "left_middle"
  },

  "player_pic_panel": {
    "type": "panel",
    "size": [ 20, "100%" ],
    "offset": [ 1, 0 ],
    "anchor_to": "left_middle",
    "anchor_from": "left_middle",
    "ignored": "$education_edition",
    "controls": [
      { "player_gamer_pic@pause.player_gamer_pic": {} },
      { "player_local_icon@pause.player_local_icon": {} }
    ]
  },

  "player_button_content": {
    "type": "stack_panel",
    "orientation": "horizontal",
    "anchor_from": "left_middle",
    "anchor_to": "left_middle",
    "size": [ "100%-4px", "100%-4px" ],
    "offset": [ 4, 0 ],
    "layer": 3,
    "controls": [
      { "player_pic_panel@host_options.player_pic_panel": {} },
      {
        "player_gamertag@host_options.gamertag_wrapper": {
          "size": [ "fill", "100%" ]
        }
      },
      { "platform_icon@host_options.platform_icon_panel": {} }
    ]
  },

  "player_grid_item": {
    "type": "panel",
    "size": [ "100%", 30 ],
    "controls": [
      {
        "player_banner@main_dark_button": {
          "$button_text": "#gamertag",
          "$pressed_button_name": "button.sub_command",
          "$button_content": "host_options.player_button_content",

          "bindings": [
            {
              "binding_name": "#gamertag",
              "binding_type": "collection",
              "binding_collection_name": "players_collection",
              "binding_name_override": "#sub_command"
            }
          ]
        }
      }
    ]
  },

  "host_friends_tab": {
    "type": "panel",
    "size": [ "100%", "100%c" ],
    "$button_glyph_anchor_from": "left_middle",
    "$button_glyph_anchor_to": "left_middle",
    "$button_content_offset_label": [ 30, 0 ],
    "$button_content_offset_glyph": [ 10, 0 ],
    "controls": [
      {
        "players_grid@host_grid": {
          "$grid_dimension_binding": "#players_grid_dimension",
          "$grid_collection_name": "players_collection",
          "$grid_item_template": "host_options.player_grid_item"
        }
      }
    ]
  },

  // Who and where
  "host_teleport_grid_item": {
    "type": "panel",
    "size": [ "100%", 30 ],

    "controls": [
      {
        "host_option_toggle@common_toggles.light_text_toggle_collection": {
          "anchor_from": "top_left",
          "anchor_to": "top_left",
          "size": [ "100%", "100%" ],

          "$button_label_offset": [ 10, 0 ],
          "$button_type_panel": "host_options.button_content",

          "$button_glyph_anchor_from": "right_middle",
          "$button_glyph_anchor_to": "right_middle",
          "$button_content_offset_glyph": [ -10, 0 ],

          "$toggle_group_default_selected": 0,
          "$radio_toggle_group": true,
          "$toggle_name": "navigation_tab",

          "$button_text": "#button_text",
          "$button_text_binding_type": "collection",
          "$button_text_grid_collection_name": "$grid_collection_name",

          "$toggle_grid_collection_name": "$grid_collection_name",

          "$toggle_state_binding_name": "#toggle_selected",
          "$toggle_binding_type": "collection",

          "bindings": [
            {
              "binding_name": "#host_teleport_visible",
              "binding_name_override": "#visible",
              "binding_collection_name": "$grid_collection_name",
              "binding_type": "collection"
            }
          ]
        }
      },
      {
        // The inverse button for undoing tele comand, shadow tele
        "host_option_button@main_dark_button": {
          "$button_text": "#tele_name",
          "$button_text_binding_type": "collection",
          "$button_text_grid_collection_name": "$grid_collection_name",
          "$pressed_button_name": "button.teleport_clear",
          "$button_glyph_texture": "textures/ui/arrowRight",
          "$glyph_size": [ 8, 8 ],

          "$button_glyph_anchor_from": "right_middle",
          "$button_glyph_anchor_to": "right_middle",
          "$button_content_offset_glyph": [ -10, 0 ],
          "$button_label_offset": [ 10, 0 ],

          "property_bag": {
            "#button_navigation": 0 // For knowing what button is pressed
          },
          "bindings": [
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#button_navigation",
              "binding_name_override": "#button_navigation"
            },
            {
              "binding_name": "(not #host_teleport_visible)",
              "binding_name_override": "#visible",
              "binding_collection_name": "$grid_collection_name",
              "binding_type": "collection"
            }
          ]
        }
      }
    ]
  },

  "host_teleport_buttons": {
    "type": "stack_panel",
    "orientation": "vertical",
    "anchor_from": "bottom_right",
    "anchor_to": "bottom_right",
    "bindings": [
      {
        "binding_name": "#host_teleport_main_visible",
        "binding_name_override": "#visible"
      }
    ],
    "controls": [
      {
        "return@return_from_sub_command_button": {
          "$button_text": "hostOption.teleport"
        }
      },
      {
        "sub_tab": {
          "type": "panel",
          "size": [ "100%", "100%c" ],
          "controls": [
            {
              "host_main_grid@host_grid": {
                "offset": "$offset_sub_tabs",
                "$grid_dimension_binding": "#host_teleport_grid_dimension",
                "$grid_collection_name": "host_teleport_collection",
                "$grid_item_template": "host_options.host_teleport_grid_item"
              }
            }
          ]
        }
      }
    ]
  },

  "host_teleport_player_list_buttons": {
    "type": "stack_panel",
    "orientation": "vertical",
    "anchor_from": "bottom_left",
    "anchor_to": "bottom_left",
    "$offset_second_sub_tabs|default": [ 0, 0 ],
    "controls": [
      {
        "toggle": {
          "type": "panel",
          "size": [ "100%", "90px" ],
          "controls": [
            {
              "host_time_panel@scrolling_panel": {
                "$main_scrolling_content": "host_options.host_friends_tab",
                "offset": "$offset_second_sub_tabs"
              }
            }
          ]
        }
      }
    ]
  },

  "host_teleport_player_buttons@host_teleport_player_list_buttons": {
    "bindings": [
      {
        "binding_name": "#host_teleport_players_visible",
        "binding_name_override": "#visible"
      }
    ]
  },

  //////////////////////////////////////////////////////////////////////////
  // Time Buttons
  //////////////////////////////////////////////////////////////////////////

  "host_time_buttons": {
    "type": "stack_panel",
    "orientation": "vertical",
    "anchor_from": "bottom_right",
    "anchor_to": "bottom_right",
    "bindings": [
      {
        "binding_name": "#host_time_visible",
        "binding_name_override": "#visible"
      }
    ],
    "controls": [
      {
        "return@return_from_sub_command_button": {
          "$button_text": "hostOption.time"
        }
      },
      {
        "sub_tab": {
          "type": "panel",
          "size": [ "100%", "90px" ],
          "anchor_from": "bottom_left",
          "anchor_to": "bottom_left",
          "controls": [
            {
              "scrolli_scrolli_ravioli@scrolling_panel": {
                "offset": "$offset_sub_tabs",
                "$main_scrolling_content": "host_options.host_grid",
                "$grid_dimension_binding": "#host_time_grid_dimension",
                "$grid_collection_name": "host_time_collection",
                "$grid_item_template": "host_options.host_sub_command_grid_item"
              }
            }
          ]
        }
      }
    ]
  },

  //////////////////////////////////////////////////////////////////////////
  // Weather Buttons
  //////////////////////////////////////////////////////////////////////////

  "host_weather_buttons": {
    "type": "stack_panel",
    "orientation": "vertical",
    "anchor_from": "bottom_right",
    "anchor_to": "bottom_right",
    "bindings": [
      {
        "binding_name": "#host_weather_visible",
        "binding_name_override": "#visible"
      }
    ],
    "controls": [
      {
        "return@return_from_sub_command_button": {
          "$button_text": "hostOption.weather"
        }
      },
      {
        "sub_tab": {
          "type": "panel",
          "size": [ "100%", "100%c" ],
          "controls": [
            {
              "host_main_grid@host_grid": {
                "offset": "$offset_sub_tabs",
                "$grid_dimension_binding": "#host_weather_grid_dimension",
                "$grid_collection_name": "host_weather_collection",
                "$grid_item_template": "host_options.host_sub_command_grid_item"
              }
            }
          ]
        }
      }
    ]
  },

  //////////////////////////////////////////////////////////////////////////
  // Main Buttons
  //////////////////////////////////////////////////////////////////////////

  "host_menu_grid_item": {
    "type": "panel",
    "size": [ "100%", 30 ],
    "controls": [
      {
        "host_option_banner@host_options.main_light_button": {
          "$button_text": "#button_text",
          "$button_text_binding_type": "collection",
          "$button_text_grid_collection_name": "$grid_collection_name",
          "$pressed_button_name": "button.menu_navigation",
          "$button_content": "host_options.button_content",
          "$button_glyph_anchor_from": "right_middle",
          "$button_glyph_anchor_to": "right_middle",
          "$button_content_offset_glyph": [ -10, 0 ],
          "$glyph_size": [ 8, 8 ],
          "$button_label_offset": [ 10, 0 ],
          "$button_glyph_visible_binding_type": "collection",
          "$button_glyph_visible_collection_name": "$grid_collection_name",
          "property_bag": {
            "#button_navigation": 0
          },
          "bindings": [
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#button_navigation",
              "binding_name_override": "#button_navigation"
            },
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#host_option_focus_id",
              "binding_name_override": "#focus_identifier"
            },
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#host_option_focus_override_left",
              "binding_name_override": "#focus_change_left"
            },
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#host_option_focus_override_right",
              "binding_name_override": "#focus_change_right"
            },
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#host_option_focus_override_up",
              "binding_name_override": "#focus_change_up"
            },
            {
              "binding_type": "collection",
              "binding_collection_name": "$grid_collection_name",
              "binding_name": "#host_option_focus_override_down",
              "binding_name_override": "#focus_change_down"
            }
          ]
        }
      }
    ]
  },

  "host_main_buttons": {
    "type": "stack_panel",
    "orientation": "vertical",
    "anchor_from": "bottom_left",
    "anchor_to": "bottom_left",
    "controls": [
      {
        "host_main_grid@host_grid": {
          "$grid_dimension_binding": "#host_main_grid_dimension",
          "$grid_collection_name": "host_main_collection",
          "$grid_item_template": "host_options.host_menu_grid_item"
        }
      }
    ],
    "bindings": [
      {
        "binding_name": "#host_main_visible",
        "binding_name_override": "#visible"
      }
    ]
  },

  //////////////////////////////////////////////////////////////////////////
  // Host Panel
  //////////////////////////////////////////////////////////////////////////

  "host_panel": {
    "type": "panel",
    "size": [ 160, "100%-20px" ],
    "offset": [ 0, -27 ],
    "anchor_from": "bottom_left",
    "anchor_to": "bottom_left",
    "$offset_sub_tabs": [ "10%", 0 ],
    "$offset_second_sub_tabs": [ "110% + 2px", 0 ],
    "controls": [
      { "host_main_panel@host_main_buttons": {} },
      { "host_teleport_panel@host_teleport_buttons": {} },
      { "host_teleport_player_panel@host_teleport_player_buttons": {} },
      { "host_time_panel@host_time_buttons": {} },
      { "host_weather_panel@host_weather_buttons": {} }
    ]
  }
}