extends ../../../layouts/account

block head
  title Account Settings

block feet
  script(src='/views/account/settings/index.min.js?#{cacheBreaker}')

block body
  div.row
    div.col-xs-12
      div.page-header
        h1 Account Settings
  div.row
    div.col-sm-9
      div#details
      div#identity
      div#password
    div.col-sm-3
      if oauthTwitter || oauthGitHub || oauthFacebook || oauthGoogle || oauthTumblr
        legend Social Connections
        if oauthMessage
          div.alerts
            div.alert.alert-info.alert-dismissable
              button.close(type='button', data-dismiss='alert') ×
              |#{oauthMessage}
        if oauthTwitter
          if oauthTwitterActive
            a.btn.btn-block.btn-danger(href='/account/settings/twitter/disconnect/')
              i.fa.fa-twitter.fa-lg
              |  Disconnect Twitter
          else
            a.btn.btn-block.btn-default(href='/account/settings/twitter/')
              i.fa.fa-twitter.fa-lg
              |  Connect Twitter
        if oauthGitHub
          if oauthGitHubActive
            a.btn.btn-block.btn-danger(href='/account/settings/github/disconnect/')
              i.fa.fa-github.fa-lg
              |  Disconnect GitHub
          else
            a.btn.btn-block.btn-default(href='/account/settings/github/')
              i.fa.fa-github.fa-lg
              |  Connect GitHub
        if oauthFacebook
          if oauthFacebookActive
            a.btn.btn-block.btn-danger(href='/account/settings/facebook/disconnect/')
              i.fa.fa-facebook-square.fa-lg
              |  Disconnect Facebook
          else
            a.btn.btn-block.btn-default(href='/account/settings/facebook/')
              i.fa.fa-facebook-square.fa-lg
              |  Connect Facebook
        if oauthGoogle
          if oauthGoogleActive
            a.btn.btn-block.btn-danger(href='/account/settings/google/disconnect/')
              i.fa.fa-google-plus-square.fa-lg
              |  Disconnect Google
          else
            a.btn.btn-block.btn-default(href='/account/settings/google/')
              i.fa.fa-google-plus-square.fa-lg
              |  Connect Google
        if oauthTumblr
          if oauthTumblrActive
            a.btn.btn-block.btn-danger(href='/account/settings/tumblr/disconnect/')
              i.fa.fa-tumblr-square.fa-lg
              |  Disconnect Tumblr
          else
            a.btn.btn-block.btn-default(href='/account/settings/tumblr/')
              i.fa.fa-tumblr-square.fa-lg
              |  Connect Tumblr

  script(type='text/template', id='tmpl-details')
    fieldset
      legend Contact Info
      div.alerts
        |<% _.each(errors, function(err) { %>
        div.alert.alert-danger.alert-dismissable
          |<%- err %>
        |<% }); %>
        |<% if (success) { %>
        div.alert.alert-info.alert-dismissable
          button.close(type='button', data-dismiss='alert') &times;
          | Changes have been saved.
        |<% } %>
      div.form-group(class!='<%- errfor.first ? "has-error" : "" %>')
        label First Name:
        input.form-control(type='text', name='first', value!='<%- first %>')
        span.help-block <%- errfor.first %>
      div.form-group(class!='<%- errfor.middle ? "has-error" : "" %>')
        label Middle Name:
        input.form-control(type='text', name='middle', value!='<%- middle %>')
        span.help-block <%- errfor.middle %>
      div.form-group(class!='<%- errfor.last ? "has-error" : "" %>')
        label Last Name:
        input.form-control(type='text', name='last', value!='<%- last %>')
        span.help-block <%- errfor['last'] %>
      div.form-group(class!='<%- errfor.company ? "has-error" : "" %>')
        label Company Name:
        input.form-control(type='text', name='company', value!='<%- company %>')
        span.help-block <%- errfor.company %>
      div.form-group(class!='<%- errfor.phone ? "has-error" : "" %>')
        label Phone:
        input.form-control(type='text', name='phone', value!='<%- phone %>')
        span.help-block <%- errfor.phone %>
      div.form-group(class!='<%- errfor.zip ? "has-error" : "" %>')
        label Zip:
        input.form-control(type='text', name='zip', value!='<%- zip %>')
        span.help-block <%- errfor.zip %>
      div.form-group
        button.btn.btn-primary.btn-update(type='button') Update

  script(type='text/template', id='tmpl-identity')
    fieldset
      legend Identity
      div.alerts
        |<% _.each(errors, function(err) { %>
        div.alert.alert-danger.alert-dismissable
          button.close(type='button', data-dismiss='alert') &times;
          |<%- err %>
        |<% }); %>
        |<% if (success) { %>
        div.alert.alert-info.alert-dismissable
          button.close(type='button', data-dismiss='alert') &times;
          | Changes have been saved.
        |<% } %>
      div.form-group(class!='<%- errfor.username ? "has-error" : "" %>')
        label Username:
        input.form-control(type='text', name='username', value!='<%= username %>')
        span.help-block <%- errfor.username %>
      div.form-group(class!='<%- errfor.email ? "has-error" : "" %>')
        label Email:
        input.form-control(type='text', name='email', value!='<%= email %>')
        span.help-block <%- errfor.email %>
      div.form-group
        button.btn.btn-primary.btn-update(type='button') Update

  script(type='text/template', id='tmpl-password')
    fieldset
      legend Set Password
      div.alerts
        |<% _.each(errors, function(err) { %>
        div.alert.alert-danger.alert-dismissable
          button.close(type='button', data-dismiss='alert') &times;
          |<%- err %>
        |<% }); %>
      |<% if (success) { %>
      div.alert.alert-info.alert-dismissable
        button.close(type='button', data-dismiss='alert') &times;
        | A new password has been set.
      |<% } %>
      div.form-group(class!='<%- errfor.newPassword ? "has-error" : "" %>')
        label New Password:
        input.form-control(type='password', name='newPassword', value!='<%= newPassword %>')
        span.help-block <%- errfor.newPassword %>
      div.form-group(class!='<%- errfor.confirm ? "has-error" : "" %>')
        label Confirm Password:
        input.form-control(type='password', name='confirm', value!='<%= confirm %>')
        span.help-block <%- errfor.confirm %>
      div.form-group
        button.btn.btn-primary.btn-password(type='button') Set Password

  script(type='text/template', id='data-account') !{data.account}
  script(type='text/template', id='data-user') !{data.user}