/********************************************************
+*   (c) Mojang. All rights reserved                       *
+*   (c) Microsoft. All rights reserved.                   *
+*********************************************************/

{
  "namespace": "how_to_play_common",

  "dynamic_dialog_screen@common.base_screen": {
    "type": "screen",
    "size": [ "100%", "100%" ],
    "button_mappings": [
      {
        "from_button_id": "button.menu_cancel",
        "to_button_id": "button.menu_exit",
        "mapping_type": "global"
      },
      {
        "from_button_id": "button.menu_tab_left",
        "to_button_id": "button.menu_tab_left",
        "mapping_type": "global",
        "scope": "view"
      },
      {
        "from_button_id": "button.menu_tab_right",
        "to_button_id": "button.menu_tab_right",
        "mapping_type": "global",
        "scope": "view"
      }
    ],
    "$screen_content": "how_to_play_common.how_to_play_content",
    "$screen_background_control": "how_to_play_common.screen_background"
  },

  "screen_background": {
    "type": "image",
    "texture": "textures/ui/White",
    "color": [ 0.192, 0.196, 0.2 ],
    "layer": -1
  },

  "top_bar": {
    "type": "image",
    "texture": "textures/ui/StoreTopBar"
  },

  "button_panel@common_buttons.new_ui_binding_button_label": {
    "$anchor|default": "left_middle",
    "$offset|default": [ 10, 0 ],
    "offset": "$offset"
  },

  "light_text_button@common_buttons.light_text_button": {
    "$button_type_panel": "how_to_play_common.button_panel"
  },

  "action_button@how_to_play_common.light_text_button": {
    "$pressed_button_name|default": "unset_button_name",
    "$button_text|default": "unset $button_text",
    "size": [ "100%", 30 ],
    "anchor_from": "left_middle",
    "anchor_to": "left_middle"
  },

  "topic_category": {
    "type": "panel",
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "size": [ "100%", "16px" ],
    "controls": [
      {
        "category_text": {
          "type": "label",
          "anchor_from": "bottom_left",
          "anchor_to": "bottom_left",
          "size": [ "default", "default" ],
          "max_size": [ "100%", "100% - 4px" ],
          "offset": [ "0px", "-3px" ],
          "text": "('howtoplay.category.' + $category)",
          "color": "$main_header_text_color"
        }
      }
    ]
  },

  "toggle_button_control": {
    "type": "panel",
    "layer": 2,
    "controls": [
      {
        "tab_button_text": {
          "type": "label",
          "anchor_from": "left_middle",
          "anchor_to": "left_middle",
          "size": [ "100% - 10px", "default" ],
          "max_size": [ "100% - 14px", "100% - 4px" ],
          "offset": [ 10, 0 ],
          "text": "('howtoplay.' + $section_topic)",
          "layer": 3,
          "color": "$text_color",
          "alpha": "$content_alpha"
        }
      }
    ]
  },

  "glyph_button_control": {
    "type": "panel",
    "layer": 2,
    "$glyph_texture|": "textures/ui/arrowRight",
    "controls": [
      {
        "tab_button_text": {
          "type": "label",
          "anchor_from": "left_middle",
          "anchor_to": "left_middle",
          "size": [ "100% - 10px", "default" ],
          "max_size": [ "100% - 14px", "100% - 4px" ],
          "offset": [ 10, 0 ],
          "text": "('howtoplay.' + $section_topic)",
          "layer": 3,
          "color": "$text_color",
          "alpha": "$content_alpha"
        }
      },
      {
        "glyph": {
          "type": "image",
          "anchor_from": "right_middle",
          "anchor_to": "right_middle",
          "offset": [ -4, 0 ],
          "texture": "$glyph_texture",
          "size": [ 10, 10 ]
        }
      }
    ]
  },

  "section_toggle_button": {
    "type": "panel",
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "size": [ "100%", "30px" ],
    "controls": [
      {
        "section_toggle_button@common_toggles.light_ui_toggle": {
          "anchor_from": "top_left",
          "anchor_to": "top_left",
          "size": [ "100%", "30px" ],

          "$button_type_panel|default": "how_to_play_common.toggle_button_control",
          "$checked_control": "common_toggles.toggle_checked",
          "$radio_toggle_group": true,
          "$toggle_name": "navigation_tab",
          "$toggle_group_default_selected": "$default_selector_toggle_index",

          "$toggle_tab_focus_binding_type": "global",
          "$toggle_tab_focus_binding_name": "#navigation_tab_focus_precedence",
          "$toggle_on_hover_binding_type": "global",
          "$toggle_on_hover_binding_name": "#toggle_on_hover",

          "$toggle_view_binding_name": "($section_topic + '_button_toggle')",
          "$toggle_property_bag": {
            "#panel_title": "('howtoplay.' + $section_topic)"
          }
        }
      }
    ]
  },

  "edu_section_toggle_button@how_to_play_common.section_toggle_button": {
    "ignored": "(not $education_edition)"
  },

  "padding": {
    "type": "panel",
    "size": [ "100%", "12px" ]
  },

  "touch_padding@padding": {
    "bindings": [
      {
        "binding_name": "#touch_being_used",
        "binding_name_override": "#visible"
      }
    ]
  },

  "small_padding": {
    "type": "panel",
    "size": [ "100%", "4px" ]
  },

  "large_padding@how_to_play_common.padding": {
    "type": "panel",
    "size": [ "100%", "22px" ]
  },

  "section_contents_header": {
    "type": "input_panel",
    "focus_enabled": true,
    "size": [ "100%", "6px" ]
  },

  "section_contents_footer": {
    "type": "input_panel",
    "focus_enabled": true,
    "size": [ "100%", "24px" ]
  },

  "main_sections": {
    "type": "stack_panel",
    "size": [ "100%", "100%c" ],
    "anchor_from": "top_left",
    "anchor_to": "top_left"
  },

  "splitscreen_only_content": {
    "type": "stack_panel",
    "size": [ "100%", "100%c" ],
    "orientation": "vertical",
    "controls": "$content",
    "bindings": [
      {
        "binding_name": "#splitscreen_enabled",
        "binding_name_override": "#visible"
      }
    ]
  },

  "header_background": {
    "type": "image",
    "size": [ "100%", "20px" ],
    "offset": [ 0, "-2px" ],
    "anchor_from": "left_middle",
    "anchor_to": "left_middle",
    "texture": "textures/ui/banners_no_border",
    "controls": [
      {
        "header_label": {
          "type": "label",
          "color": "$body_text_color",
          "layer": 1,
          "anchor_from": "left_middle",
          "anchor_to": "left_middle",
          "text_alignment": "center",
          "max_size": [ "95%", 10 ],
          "offset": [ 8, 0 ],
          "text": "$text"
        }
      }
    ]
  },

  "header": {
    "type": "panel",
    "size": [ "100%", "28px" ],
    "controls": [
      { "header@how_to_play_common.header_background": {} }
    ]
  },

  "paragraph": {
    "type": "label",
    "color": "$body_text_color",
    "anchor_from": "left_middle",
    "anchor_to": "left_middle",
    "size": [ "75%", "default" ],
    "line_padding": 4.0,
    "text": "$text"
  },

  "paragraph_with_icons@how_to_play_common.paragraph": {
    "text": "('#pre_process_' + $text)",
    "bindings": [
      {
        "binding_name": "('#pre_process_' + $text)"
      }
    ]
  },

  "paragraph_no_icons@how_to_play_common.paragraph": {
    "bindings": [
      {
        "binding_name": "$input_binding",
        "binding_name_override": "#visible"
      }
    ]
  },

  "paragraph_with_selective_input@how_to_play_common.paragraph_with_icons": {
    "line_padding": 4.0,
    "bindings": [
      {
        "binding_name": "('#pre_process_' + $text)"
      },
      {
        "binding_name": "$input_binding",
        "binding_name_override": "#visible"
      }
    ]
  },

  "paragraph_keyboard@how_to_play_common.paragraph_with_selective_input": {
    "$input_binding": "#keyboard_being_used"
  },

  "paragraph_gamepad@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 6.0,
    "$input_binding": "#gamepad_being_used"
  },

  "paragraph_gamepad_no_icons@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 4.0,
    "$input_binding": "#gamepad_being_used"
  },

  "paragraph_rift_controller@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 10.0,
    "$input_binding": "#rift_controller_being_used"
  },

  "paragraph_windowsmr_controller@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 10.0,
    "$input_binding": "#windowsmr_controller_being_used"
  },

  "paragraph_vr@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 10.0,
    "$input_binding": "#vr_controls_being_used"
  },

  "paragraph_touch@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 6.0,
    "$input_binding": "#touch_being_used"
  },

  "paragraph_touch_classic_dpad_spacing@how_to_play_common.paragraph_with_selective_input": {
    "$input_binding": "#touch_being_used",
    "line_padding": 12.0
  },

  "paragraph_touch_no_icons@how_to_play_common.paragraph_no_icons": {
    "$input_binding": "#touch_being_used",
    "line_padding": 4.0
  },

  "paragraph_touch_joystick_tap@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 6.0,
    "$input_binding": "#touch_joystick_tap_being_used"
  },

  "paragraph_touch_classic_dpad@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 12.0,
    "$input_binding": "#touch_classic_dpad_being_used"
  },

  "paragraph_touch_joystick_crosshair@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 6.0,
    "$input_binding": "#touch_joystick_crosshair_being_used"
  },

  "paragraph_not_touch@how_to_play_common.paragraph_with_selective_input": {
    "line_padding": 6.0,
    "$input_binding": "#touch_not_being_used"
  },

  "image": {
    "type": "image",
    "layer": 1,
    "size": [ "100%", "128px" ],
    "offset": [ 0, 5 ],
    "anchor_from": "center",
    "anchor_to": "center"
  },

  "how_to_play_header": {
    "type": "panel",
    "controls": [
      {
        "top_bar@how_to_play_common.top_bar": {
          "size": [ "100%", "100%" ],
          "layer": 2,
          "controls": [
            {
              "back_button@common.back_title_button": {
                "anchor_from": "left_middle",
                "anchor_to": "left_middle",
                "offset": [ 2, -1 ]
              }
            },
            {
              "how_to_play_title@common.screen_header_title_panel": {
                "size": [ "70% - 22px", "100%" ], // Gamepad helpers have max size of 30% and the back button is 20px
                "offset": [ 20, -1 ],
                "anchor_from": "left_middle",
                "anchor_to": "left_middle",
                "$screen_header_title": "#section_title",
                "$screen_header_title_binding_type": "global",
                "layer": 2
              }
            },
            { "gamepad_bumper_helpers@how_to_play_common.gamepad_bumper_helpers": {} }
          ]
        }
      }
    ]
  },

  "how_to_play_content": {
    "type": "panel",
    "controls": [
      {
        "header@how_to_play_common.how_to_play_header": {
          "size": [ "100%", "23px" ],
          "anchor_from": "top_left",
          "anchor_to": "top_left"
        }
      },
      {
        "container": {
          "type": "panel",
          "size": "$store_screen_size",
          "controls": [
            { "$dialog_content@$dialog_content": {} }
          ]
        }
      }
    ]
  },

  "dialog_content": {
    "type": "panel",
    "anchor_from": "top_middle",
    "anchor_to": "top_middle",
    "controls": [
      { "selector_area@how_to_play_common.selector_area": {} },
      { "content_area@how_to_play_common.content_area_wrapper": {} },
      { "section_divider@how_to_play_common.section_divider": {} }
    ]
  },

  "scrollable_selector_area_content": {
    "type": "panel",
    "offset": [ "6px", "2px" ],
    "size": [ "100% - 8px", "100%c + 4px" ],
    "controls": [
      { "$selector_stack_panel@$selector_stack_panel": {} }
    ]
  },

  // left side
  "selector_area": {
    "type": "panel",
    "offset": [ "-2px", "21px" ],
    "size": [ "30% + 2px", "100% - 19px" ],
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "layer": 3,
    "focus_container": true,
    "use_last_focus": true,
    "$focus_navigation_mode_override_down|default": "contained",
    "$focus_navigation_mode_override_up|default": "contained",
    "$focus_navigation_mode_override_left|default": "",
    "$focus_navigation_mode_override_right|default": "",
    "focus_navigation_mode_down": "$focus_navigation_mode_override_down",
    "focus_navigation_mode_up": "$focus_navigation_mode_override_up",
    "focus_navigation_mode_left": "$focus_navigation_mode_override_left",
    "focus_navigation_mode_right": "$focus_navigation_mode_override_right",
    "controls": [
      {
        "scrolling_panel@common.scrolling_panel": {
          "$scrolling_content": "how_to_play_common.scrollable_selector_area_content",
          "$show_background": false,
          "$scroll_size": [ "5px", "100% - 4px" ],
          "$scroll_bar_left_padding_size": [ 0, 0 ]
        }
      }
    ]
  },

  // divider between two sides
  "section_divider": {
    "type": "image",
    "offset": [ "30%", "20px" ],
    "size": [ "4px", "100% - 18px" ],
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "layer": 3,
    "texture": "textures/ui/HowToPlayDivider"
  },

  // contains right side
  "content_area_wrapper": {
    "type": "panel",
    "offset": [ "2px", "21px" ],
    "size": [ "70% - 2px", "100% - 19px" ],
    "anchor_from": "top_right",
    "anchor_to": "top_right",
    "layer": 1,
    "focus_container": true,
    "use_last_focus": false,
    "controls": [
      { "content_area@how_to_play_common.content_area": {} }
    ]
  },

  // right side
  "content_area": {
    "type": "panel",
    "size": [ "100% - 6px", "100%" ],
    "anchor_from": "top_right",
    "anchor_to": "top_right",
    "controls": [
      {
        "control": {
          "type": "stack_panel",
          "size": [ "100%", "100%" ],
          "anchor_from": "top_right",
          "anchor_to": "top_right",
          "controls": [
            {
              "scrolling_panel@common.scrolling_panel": {
                "size": [ "100%", "fill" ],
                "$scrolling_content": "$section_content_panels",
                "$show_background": false,
                "$scroll_size": [ "5px", "100% - 4px" ],
                "$scroll_bar_left_padding_size": [ 5, 0 ],
                "$scroll_bar_right_padding_size": [ 5, 0 ]
              }
            }
          ]
        }
      }
    ]
  },

  "screen_base@how_to_play_common.dynamic_dialog_screen": {
    "$dialog_content": "how_to_play_common.dialog_content"
  },

  "gamepad_bumper_helper_description@common.gamepad_helper_icon_description": {
    "max_size": [ "54px", "10px" ]
  },

  // gamepad helpers
  "gamepad_bumper_helpers": {
    "type": "stack_panel",
    "orientation": "horizontal",
    "anchor_from": "right_middle",
    "anchor_to": "right_middle",
    "offset": [ "-4px", "-2px" ],
    "max_size": [ "30%", "26px" ],
    "layer": 6,
    "controls": [
      {
        "gamepad_helper_left_bumper@common.gamepad_helper_left_bumper": {
          "$gamepad_description": "how_to_play_common.gamepad_bumper_helper_description"
        }
      },
      {
        "padding": {
          "type": "panel",
          "size": [ "4px", "100%" ]
        }
      },
      {
        "gamepad_helper_right_bumper@common.gamepad_helper_right_bumper": {
          "$gamepad_description": "how_to_play_common.gamepad_bumper_helper_description"
        }
      }
    ]
  }

}
