% layout 'upravlenie';
% title 'Входъ';

%= stylesheet begin
[name="login_key"] {
    color: rgba(81,81,81,0.1);
    text-shadow: 0 0 15px rgba(0,0,0,1);
}

[type=text]:focus {
   background: white;
   box-shadow: .1em .1em .5em .1em rgba(0, 0, 0, .9) inset;
}
% end

% if(stash->{error_login}) {
<div id="error_login" class="error message"><%= stash->{error_login} %></div>
% }
%= form_for sign_in => (id => 'sign_in', autocomplete =>'off') => begin
%= label_for login_name => '"Име за входъ" е задължително поле (ѿ 1 до 100 знака).'
<br>
%= text_field 'login_name', placeholder => 'Име за входъ', title => 'Име за входъ'
<br>
%= label_for login_key => '"Таен ключъ" е задължително поле (ѿ 1 до 40 знака).'
<br>
%= text_field login_key => placeholder => 'Таен ключ', title => 'Таен ключ'
%= hidden_field 'digest'
%= csrf_field
<br>
%= submit_button 'Входъ'
%= end
%= javascript 'js/CryptoJS-v3.1.2/sha1.js'

%= javascript begin
'use strict';
const name_field   = document.querySelector('[name="login_name"]');
const passw_field  = document.querySelector('[name="login_key"]');
const dijest_field = document.querySelector('[name="digest"]');
const csrf_field   = document.querySelector('[name="csrf_token"]');
const login_form   = document.querySelector('#sign_in');
login_form.onsubmit = function() {
    const concat_ln_lp   = name_field.value  + passw_field.value;
    passw_field.remove();
    const passw_sha1     = CryptoJS.SHA1(concat_ln_lp);
    dijest_field.value = CryptoJS.SHA1(csrf_field.value + passw_sha1);
    return true;
};
% end