infusionvlc/infusion

<h2><%= I18n.t 'main.edit' %> <%= I18n.t 'user.profile' %></h2>

<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
  <%= devise_error_messages! %>
  <% if devise_mapping.confirmable? && resource.pending_reconfirmation? %>
    <div>Currently waiting confirmation for: <%= resource.unconfirmed_email %></div>
  <% end %><br />
  <div class="row">
    <div class="col-sm-12 col-md-6">
      <div class="field">
        <%= f.label :username %><br />
        <%= f.text_field :username, autofocus: true, class: 'form-control' %>
      </div><br />

      <%= f.hidden_field :role_id, value: resource.role_id %>

      <div class="field">
        <%= f.label :email %><br />
        <%= f.email_field :email, class: 'form-control' %>
      </div><br />

      <div class="field">
        <%= f.label :locale %><br />
        <%= f.select :locale, [['Spanish', :es ], ['Valencià', :ca], ['English', :en]], {}, class: 'form-control' %>
      </div><br />


      <div class="field">
        <%= f.label :bio %><br />
        <div class="row">
          <div class="col-sm-12 col-md-6">
            <%= f.text_area :bio, class: 'form-control', id:'bio_edit' %>
          </div>
          <div class="col-sm-12 col-md-6">
            <p id="bio_view"></p>
          </div>
        </div>
      </div><br />
    </div>
    <div class="col-sm-12 col-md-6">
    <div style="width: 50%; margin:0 auto;"><div class="avatar" style="background-image: url(<%= resource.avatar.url %>)"></div></div>
      <div class="field">
        <%= f.label :avatar %><br />
        <%= f.file_field :avatar, class: 'form-control' %>
      </div><br />
      <div class="card card-body">
        <h3><%= I18n.t 'user.change_password' %></h3>
        <div class="field">
          <%= f.label :password %><br />
          <%= f.password_field :password, autocomplete: :off, class: 'form-control' %>
        </div><br />

        <div class="field">
          <%= f.label :password_confirmation %>
          <%= f.password_field :password_confirmation, autocomplete: :off, class: 'form-control' %>
        </div><br />
      </div>
    </div>
  </div>
  <div class="field">
        <h3><%= I18n.t 'user.notifications' %></h3>
        <%= f.check_box :notify_meetups %> <%= f.label :notify_meetups %><br />
        <%= f.check_box :notify_proposals %> <%= f.label :notify_proposals %><br />
        <%= f.check_box :notify_comments %> <%= f.label :notify_comments %><br />
      </div><br />
  <div class="actions">
    <%= f.submit class:"btn btn-primary" %>
  </div>
<% end %>

<hr/>

<h3><%= I18n.t 'user.cancel' %></h3>

<p><%= I18n.t 'user.cancel_descr' %></p>
<%= link_to registration_path(resource_name), method: :delete, class:"btn btn-danger" do %>
  <%= I18n.t 'user.cancel' %>
<% end %>

<script>
  var converter = new showdown.Converter({simplifiedAutoLink: true, openLinksInNewWindow: true, emoji: true});

  function autosize(el){
    setTimeout(function(){
      el.style.cssText = 'height:auto; padding:0';
      el.style.cssText = 'height:' + (el.scrollHeight + 5) + 'px';
    },0);
  };

  $("#bio_edit").keyup(function() {
    $('#bio_view').html(converter.makeHtml(this.value));
    autosize(this);
  });

  $(document).on('turbolinks:load', function(){
    $('#bio_edit').keyup();
  });

</script>