summaryrefslogtreecommitdiff
path: root/app/views/profiles/show.html.haml
blob: f3993ad8c3346c32f9eafc9253d325f21458287e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
- breadcrumb_title s_("Profiles|Edit Profile")
- page_title s_("Profiles|Edit Profile")
- @content_class = "limit-container-width" unless fluid_layout
- gravatar_link = link_to Gitlab.config.gravatar.host, 'https://' + Gitlab.config.gravatar.host
- availability = availability_values
- custom_emoji = show_status_emoji?(@user.status)

= bootstrap_form_for @user, url: profile_path, method: :put, html: { multipart: true, class: 'edit-user gl-mt-3 js-quick-submit gl-show-field-errors js-password-prompt-form', remote: true }, authenticity_token: true do |f|
  = form_errors(@user)

  .row.js-search-settings-section
    .col-lg-4.profile-settings-sidebar
      %h4.gl-mt-0
        = s_("Profiles|Public avatar")
      %p
        - if @user.avatar?
          - if gravatar_enabled?
            = s_("Profiles|You can change your avatar here or remove the current avatar to revert to %{gravatar_link}").html_safe % { gravatar_link: gravatar_link }
          - else
            = s_("Profiles|You can change your avatar here")
        - else
          - if gravatar_enabled?
            = s_("Profiles|You can upload your avatar here or change it at %{gravatar_link}").html_safe % { gravatar_link: gravatar_link }
          - else
            = s_("Profiles|You can upload your avatar here")
        - if current_appearance&.profile_image_guidelines?
          .md
            = brand_profile_image_guidelines
    .col-lg-8
      .avatar-image
        = link_to avatar_icon_for_user(@user, 400), target: '_blank', rel: 'noopener noreferrer' do
          = image_tag avatar_icon_for_user(@user, 96), alt: '', class: 'avatar s96'
      %h5.gl-mt-0= s_("Profiles|Upload new avatar")
      .gl-my-3
        %button.gl-button.btn.btn-default.js-choose-user-avatar-button{ type: 'button' }= s_("Profiles|Choose file...")
        %span.avatar-file-name.gl-ml-3.js-avatar-filename= s_("Profiles|No file chosen.")
        = f.file_field_without_bootstrap :avatar, class: 'js-user-avatar-input hidden', accept: 'image/*'
      .gl-text-gray-500= s_("Profiles|The maximum file size allowed is 200KB.")
      - if @user.avatar?
        = link_to s_("Profiles|Remove avatar"), profile_avatar_path, data: { confirm: s_("Profiles|Avatar will be removed. Are you sure?") }, method: :delete, class: 'gl-button btn btn-danger-secondary btn-sm gl-mt-5'
    .col-lg-12
      %hr
  .row.js-search-settings-section
    .col-lg-4.profile-settings-sidebar
      %h4.gl-mt-0= s_("Profiles|Current status")
      %p= s_("Profiles|This emoji and message will appear on your profile and throughout the interface.")
    .col-lg-8
      = f.fields_for :status, @user.status do |status_form|
        - emoji_button = button_tag type: :button,
          class: 'js-toggle-emoji-menu emoji-menu-toggle-button btn gl-button btn-default has-tooltip',
          title: s_("Profiles|Add status emoji") do
          - if custom_emoji
            = emoji_icon(@user.status.emoji, class: 'gl-mr-0!')
          %span#js-no-emoji-placeholder.no-emoji-placeholder{ class: ('hidden' if custom_emoji) }
            = sprite_icon('slight-smile', css_class: 'award-control-icon-neutral')
            = sprite_icon('smiley', css_class: 'award-control-icon-positive')
            = sprite_icon('smile', css_class: 'award-control-icon-super-positive')
        - reset_message_button = button_tag type: :button,
          id: 'js-clear-user-status-button',
          class: 'clear-user-status btn gl-button btn-default has-tooltip',
          title: s_("Profiles|Clear status") do
          = sprite_icon("close")

        = status_form.hidden_field :emoji, id: 'js-status-emoji-field'
        = status_form.text_field :message,
          id: 'js-status-message-field',
          class: 'form-control gl-form-input input-lg',
          label: s_("Profiles|Your status"),
          prepend: emoji_button,
          append: reset_message_button,
          placeholder: s_("Profiles|What's your status?")
        .checkbox-icon-inline-wrapper
          = status_form.check_box :availability, { data: { testid: "user-availability-checkbox" }, label: s_("Profiles|Busy"), wrapper_class: 'gl-mr-0 gl-font-weight-bold' }, availability["busy"], availability["not_set"]
          .gl-text-gray-600.gl-ml-5= s_('Profiles|An indicator appears next to your name and avatar')
    .col-lg-12
      %hr
  .row.user-time-preferences.js-search-settings-section
    .col-lg-4.profile-settings-sidebar
      %h4.gl-mt-0= s_("Profiles|Time settings")
      %p= s_("Profiles|Set your local time zone")
    .col-lg-8
      %h5= _("Time zone")
      = dropdown_tag(_("Select a time zone"), options: { toggle_class: 'gl-button btn js-timezone-dropdown input-lg gl-w-full!', title: _("Select a time zone"), filter: true, placeholder: s_("OfSearchInADropdown|Filter"), data: { data: timezone_data } } )
      %input.hidden{ :type => 'hidden', :id => 'user_timezone', :name => 'user[timezone]', value: @user.timezone }
    .col-lg-12
      %hr
  .row.js-search-settings-section
    .col-lg-4.profile-settings-sidebar
      %h4.gl-mt-0
        = s_("Profiles|Main settings")
      %p
        = s_("Profiles|This information will appear on your profile")
        - if current_user.ldap_user?
          = s_("Profiles|Some options are unavailable for LDAP accounts")
    .col-lg-8
      .row
        = render 'profiles/name', form: f, user: @user
        = f.text_field :id, class: 'gl-form-input', readonly: true, label: s_('Profiles|User ID'), wrapper: { class: 'col-md-3' }

      = f.text_field :pronouns, class: 'input-md gl-form-input', help: s_("Profiles|Enter your pronouns to let people know how to refer to you")
      = f.text_field :pronunciation, class: 'input-md gl-form-input', help: s_("Profiles|Enter how your name is pronounced to help people address you correctly")
      = render_if_exists 'profiles/extra_settings', form: f
      = render_if_exists 'profiles/email_settings', form: f
      = f.text_field :skype, class: 'input-md gl-form-input', placeholder: s_("Profiles|username")
      = f.text_field :linkedin, class: 'input-md gl-form-input', help: s_("Profiles|Your LinkedIn profile name from linkedin.com/in/profilename")
      = f.text_field :twitter, class: 'input-md gl-form-input', placeholder: s_("Profiles|@username")
      = f.text_field :website_url, class: 'input-lg gl-form-input', placeholder: s_("Profiles|https://website.com")
      - if @user.read_only_attribute?(:location)
        = f.text_field :location, class: 'gl-form-input', readonly: true, help: s_("Profiles|Your location was automatically set based on your %{provider_label} account") % { provider_label: attribute_provider_label(:location) }
      - else
        = f.text_field :location, label: s_('Profiles|Location'), class: 'input-lg gl-form-input', placeholder: s_("Profiles|City, country")
      = f.text_field :job_title, class: 'input-md gl-form-input'
      = f.text_field :organization, label: s_('Profiles|Organization'), class: 'input-md gl-form-input', help: s_("Profiles|Who you represent or work for")
      = f.text_area :bio, class: 'gl-form-input', label: s_('Profiles|Bio'), rows: 4, maxlength: 250, help: s_("Profiles|Tell us about yourself in fewer than 250 characters")
      %hr
      %h5= _('Private profile')
      .checkbox-icon-inline-wrapper
        - private_profile_label = capture do
          = s_("Profiles|Don't display activity-related personal information on your profile")
        = f.check_box :private_profile, label: private_profile_label, inline: true, wrapper_class: 'mr-0'
        = link_to sprite_icon('question-o'), help_page_path('user/profile/index.md', anchor: 'make-your-user-profile-page-private')
      %h5= s_("Profiles|Private contributions")
      = f.check_box :include_private_contributions, label: s_('Profiles|Include private contributions on my profile'), wrapper_class: 'mb-2', inline: true
      .help-block
        = s_("Profiles|Choose to show contributions of private projects on your public profile without any project, repository or organization information")
  %hr
  = f.submit s_("Profiles|Update profile settings"), class: 'gl-button btn btn-confirm gl-mr-3 js-password-prompt-btn'
  = link_to _("Cancel"), user_path(current_user), class: 'gl-button btn btn-default btn-cancel'

#password-prompt-modal

.modal.modal-profile-crop{ data: { cropper_css_path: ActionController::Base.helpers.stylesheet_path('lazy_bundles/cropper.css') } }
  .modal-dialog
    .modal-content
      .modal-header
        %h4.modal-title
          = s_("Profiles|Position and size your new avatar")
        %button.close{ type: "button", "data-dismiss": "modal", "aria-label" => _("Close") }
          %span{ "aria-hidden": "true" } ×
      .modal-body
        .profile-crop-image-container
          %img.modal-profile-crop-image{ alt: s_("Profiles|Avatar cropper") }
        .crop-controls
          .btn-group
            %button.btn.gl-button.btn-confirm{ data: { method: 'zoom', option: '-0.1' } }
              %span
                = sprite_icon('search-minus')
            %button.btn.gl-button.btn-confirm{ data: { method: 'zoom', option: '0.1' } }
              %span
                = sprite_icon('search-plus')
      .modal-footer
        %button.btn.gl-button.btn-confirm.js-upload-user-avatar{ type: 'button' }
          = s_("Profiles|Set new profile picture")