{
  "namespace": "friendsbutton",

  "friendsdrawer_animated_icon": {
    "type": "image",
    "layer": 2,
    "size": [ 18, 18 ],
    "$friendsdrawer_animated_icon_offset|default": [ 0, 0 ]
  },

   "profilepicture": {
    "type": "custom",
    "renderer": "profile_image_renderer",
    "size": [ 18, 18 ],
    "layer": 2,
    "$gamerpic_visible|default": "#none",
    "$profilepic|default" : "#none",
    "bindings": [
      {
        "binding_name": "$profilepic",
        "binding_name_override": "#profile_image_options",
        "binding_condition": "visible"
      },
      {
        "binding_name": "$gamerpic_visible",
        "binding_name_override": "#visible"
      }
    ]
  },

  "persona_icon_with_border":{
    "type":"panel",
    "size":[18, 18],
    "offset": [ -2, 0 ],
    "anchor_from":"top_left",
    "anchor_to": "top_left",
	"$icon_offset|default": [ 0, 0 ],
    "$show_icon|default":"#none",
    "controls": [
      {
        "profile_icon@friendsbutton.profilepicture": {
		  "offset": "$icon_offset",
          "layer": 2,
          "$gamerpic|default": "#none",
          "$profilepic": "$gamerpic",
          "anchor_from":"top_left",
          "anchor_to": "top_left"
        }
      },
      {
        "border_black@common.focus_border_black": {
		  "offset": "$icon_offset",
          "layer": 3,
          "size": [ 18, 18 ],
          "anchor_from":"top_left",
          "anchor_to": "top_left"
        }
      }
    ],
    "bindings": [
      {
        "binding_name": "$show_icon",
        "binding_name_override": "#visible"
      }
    ]
  },

  "friendsdrawer_persona_icons": {
    "type": "stack_panel",
    "orientation": "horizontal"
  },

  "social_button_stackpanel@friendsbutton.friendsdrawer_persona_icons":{
    "$social_icon_image|default": "#social_icon",
    "controls":[
      {
        "image_panel":{
          "type": "panel",
          "anchor_from": "top_left",
          "anchor_to": "top_left",
          "size": [ 18, 18 ],
          "controls":[
            {
              "social_icon@friendsbutton.friendsdrawer_animated_icon":{
                "size": [ 12, 12 ],
                "$friendsdrawer_animated_icon_offset": [ 0, 0 ],
                "anchor_from": "center",
                "anchor_to": "center",
                "bindings":[
                  {
                    "binding_name": "$social_icon_image",
                    "binding_name_override": "#texture",
                    "binding_condition": "visible"
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  "social_button_hover_stackpanel@friendsbutton.social_button_stackpanel": {
    "$social_icon_image": "#social_icon_hovered"
  },

  "self_persona_stackpanel@friendsbutton.friendsdrawer_persona_icons":{
    "controls":[
      {
        "self_icon@friendsbutton.persona_icon_with_border": {
          "$gamerpic": "#current_user_profile_options",
          "$show_icon": "#is_in_party"
        }
      }
    ]
  },

  "single_friend_persona_stackpanel@friendsbutton.friendsdrawer_persona_icons":{
    "controls":[
      {
        "self_icon@friendsbutton.self_persona_stackpanel": {
        }
      },
      {
        "friend_one_icon@friendsbutton.persona_icon_with_border": {
		  "$icon_offset": [ -1, 0 ],
          "$gamerpic": "#first_party_member_profile_options",
          "$show_icon": "#is_in_party"
        }
      }
    ]
  },


  "many_friend_persona_stackpanel@friendsbutton.friendsdrawer_persona_icons": {
    "controls": [
      {
        "self_icon@friendsbutton.self_persona_stackpanel": {
        }
      },
      {
          "extra_friends_text_panel": {
          "type": "panel",
          "size": [ 18, 18 ],
          "controls": [
            {
              "background": {
                "layer": 1, 
                "offset": [ -1, 0 ],				
                "size": [ 18, 18 ],
                "anchor_from": "top_left",
                "anchor_to": "top_left",
                "type": "image",
                "texture": "textures/ui/button_borderless_dark"
              }
            },
            {
              "extra_members_label": {
                "type": "label",
                "font_size": "normal",
				"offset": [ -1, 0 ],
                "anchor_from": "center",
                "anchor_to": "center",
                "layer": 2,
                "text_alignment": "center",
                "color": "$dark_button_default_text_color",
                "text": "#party_extra_member_count",
                "bindings": [
                  {
                    "binding_name": "#party_extra_member_count",
                    "binding_name_override": "#party_extra_member_count",
                    "binding_condition": "visible"
                  }
                ]
              }
            },
            {
              "border_black@common.focus_border_black": {
                "layer": 3,  
				        "offset": [ -1, 0 ],
                "size": [ 18, 18 ],
                "anchor_from": "top_left",
                "anchor_to": "top_left"
              }
            }
          ]
        }
      }
    ]
  },

  "button@common_buttons.light_content_form_fitting_button": {
    "size": [ "100%c", "100%c" ],
    "anchor_to": "top_right",
    "anchor_from": "top_right",
    "$button_content_size_override": [ "100%c", "100%c - 4px" ],
    "$button_content": "friendsbutton.friendsdrawer_button_content",
    "$button_content_hover": "friendsbutton.friendsdrawer_hover_button_content",
    "$button_content_pressed": "friendsbutton.friendsdrawer_hover_button_content",
    "$button_content_locked": "friendsbutton.friendsdrawer_button_content",
    "$pressed_button_name": "button.friends_drawer",
    "$context|default": "",
    "controls": [
      {
        "default@$button_state_panel": {
          "$new_ui_button_texture": "$default_button_texture",
          "$button_content": "$button_content",
          "$text_color": "$default_text_color",
          "$content_alpha": "$default_content_alpha", 
          "$secondary_text_color": "$light_button_secondary_default_text_color",
          "$glyph_color": "$light_glyph_default_color",
          "$border_color": "$light_border_default_color",
          "$button_alpha": "$default_button_alpha",
          "$border_visible": "$default_state_border_visible",
          "$border_layer": "$border_default_layer",
          "$default_state": true,
          "$border_alpha": "$border_default_alpha",
           "layer": 1
          }
        },
        {
          "hover@$button_state_panel": {
            "$new_ui_button_texture": "$hover_button_texture",
            "$button_content": "$button_content_hover",
            "$text_color": "$light_button_hover_text_color",
            "$secondary_text_color": "$light_button_secondary_hover_text_color",
            "$glyph_color": "$light_glyph_hover_color",
            "$content_alpha": "$hover_content_alpha",
            "$border_color": "$light_border_hover_color",
            "$border_visible": "$hover_state_border_visible",
            "$border_layer": "$border_hover_layer",
            "$hover_state": true,
            "$button_alpha": "$default_hover_alpha",
            "layer": 2
          }
        },
        {
          "pressed@$button_state_panel": {
            "$new_ui_button_texture": "$pressed_button_texture",
            "$button_content": "$button_content_pressed",
            "$text_color": "$light_button_pressed_text_color",
            "$secondary_text_color": "$light_button_secondary_pressed_text_color",
            "$glyph_color": "$light_glyph_pressed_color",
            "$content_alpha": "$pressed_alpha",
            "$button_offset": "$button_pressed_offset",
            "$border_color": "$light_border_pressed_color",
            "$border_visible": "$pressed_state_border_visible",
            "$border_layer": "$border_pressed_layer",
            "$button_alpha": "$default_pressed_alpha",
            "$pressed_state": true,
            "layer": 3
          }
        },
        {
          "locked@$button_state_panel": {
            "$new_ui_button_texture": "$locked_button_texture",
            "$button_content": "$button_content_locked",
            "$text_color": "$light_button_locked_text_color",
            "$secondary_text_color": "$light_button_secondary_locked_text_color",
            "$glyph_color": "$light_glyph_locked_color",
            "$content_alpha": "$locked_alpha",
            "$border_color": "$light_border_locked_color",
            "$button_image": "common_buttons.locked_button_image",
            "$border_visible": "$locked_state_border_visible",
            "$border_layer": "$border_locked_layer",
            "$locked_state": true,
            "layer": 1
          }
        }
       ],
    "property_bag": {
      "#context": "$context"
    }
  },

  "social_factory_stackpanel_default": {
    "type": "stack_panel",
    "orientation": "horizontal",
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "factory": {
       "name": "social_icons_factory",
      "control_ids": {
        "social_button_control": "@friendsbutton.social_button_stackpanel",
        "self_persona_control": "@friendsbutton.self_persona_stackpanel",
        "single_friend_persona_control": "@friendsbutton.single_friend_persona_stackpanel",
        "many_friend_persona_control": "@friendsbutton.many_friend_persona_stackpanel"
      }
    },
    "bindings": [
      {
        "binding_name": "#social_icon_content",
        "binding_name_override": "#collection_length",
        "binding_type": "global",
        "binding_condition": "visible"
      }
    ]
  },

  "social_factory_stackpanel_hovered": {
    "type": "stack_panel",
    "orientation": "horizontal",
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "factory": {
      "name": "social_icons_factory",
      "control_ids": {
        "social_button_control": "@friendsbutton.social_button_hover_stackpanel",
        "self_persona_control": "@friendsbutton.self_persona_stackpanel",
        "single_friend_persona_control": "@friendsbutton.single_friend_persona_stackpanel",
        "many_friend_persona_control": "@friendsbutton.many_friend_persona_stackpanel"
      }
    },
    "bindings": [
      {
        "binding_name": "#social_icon_content",
        "binding_name_override": "#collection_length",
        "binding_type": "global",
        "binding_condition": "visible"
      }
    ]
  },

  "friendsdrawer_button_content": {
    "type": "stack_panel",
    "orientation": "horizontal",
    "size": [ "100%c", 24 ],
    "$social_factory_stackpanel_control|default": "friendsbutton.social_factory_stackpanel_default",
    "controls": [
      { "social_factory_stackpanel@$social_factory_stackpanel_control": {} },
      {
        "padding_middle@common.empty_panel": {
          "size": [ 3, "100%" ]
        }
      },
      {
        "vertically_centered_text": {
          "type": "stack_panel",
          "orientation": "vertical",
          "size": [ "100%c", "100%c" ],
          "controls": [
            {
              "top_padding": {
                "type": "panel",
                "size": [ "0px", 4 ]
              }
            },
            {
              "profile_button_label@common_buttons.new_ui_binding_button_label": {
              "layer": 1,
              "$button_text_binding_type": "global",
              "$button_text_size": [ "default", "default" ],
              "$button_text_max_size": [ "default", 20 ],
              "$button_binding_condition": "none",
              "$button_text_grid_collection_name": "",
              "$button_text": "#social_button_text"
            }
          }
        ]
      }
    },
    {
      "padding_right@common.empty_panel": {
        "size": [ 6, "100%" ]
      }
    }
    ]
  },
  "friendsdrawer_hover_button_content@friendsbutton.friendsdrawer_button_content": {
    "$social_factory_stackpanel_control|default": "friendsbutton.social_factory_stackpanel_hovered"
  },

  "friends_drawer_popup@common_buttons.static_tooltip_notification_panel": {
    "$tooltip_panel_size": [ 210, "100%cm + 6px" ],
    "$size": [ 210, "default" ],
    "$tooltip_panel_offset": [ 0, 0 ],
    "$ignore_tooltip_popup_image": true,
    "allow_clipping": false,
    "anchor_to": "top_right",
    "anchor_from": "top_right",
    "$tooltip_button_default_texture": "textures/ui/bubble/bubble-background",
    "$tooltip_button_pressed_texture": "textures/ui/bubble/bubble-background",
    "$tooltip_button_hover_texture": "textures/ui/bubble/bubble-background",
    "$tooltip_button_locked_texture": "textures/ui/bubble/bubble-background",
    "$tooltip_background_texture": "textures/ui/bubble/bubble-background",
    "$tooltip_popup_chevron_texture": "textures/ui/bubble/onboarding_bubble_arrow_up_left",
    "$tooltip_text_font_size": "medium",
    "$tooltip_popup_chevron_size": [ 8, 7 ],
    "$tooltip_image_text_panel_offset": [ 7, 0 ],
    "$tooltip_popup_chevron_offset": [ "-10px", "-6px" ],
    "$tooltip_chevron_anchor": "top_right",
    "$pressed_button_name": "button.friends_drawer",
    "consume_hover_events": false,
    "focus_enabled": true,
    "$tooltip_panel_content_background_alpha": 0.0,
    "$dynamic_tooltip_button_visibility_binding_name": "#tooltip_visible",
    "$tooltip_popup_visible_binding": "#tooltip_visible",
    "$override_tooltip_popup_image": false,
    "$tooltip_popup_override_image_panel": "common.empty_panel",
    "$tooltip_text_binding_name": "#tooltip_text",
    "$tooltip_text_line_padding": 4,
    "$tool_tip_text_max_size": [ 200, 0 ],
    "$tooltip_panel_content": "common.empty_panel",
    "button_mappings": [],
    "bindings": [
      {
        "binding_name": "#tooltip_visible",
        "binding_name_override": "#visible"
      }
    ]
  }
}