{% extends "account.twig" %}

{% block account_content %}

    <div id="account-password">
        <div class="form-horizontal account password">
            <h2>{% trans "Change password" %}</h2>
            <p>{% trans "For security reasons we ask you to provide your current password. Please make sure you use a strong password." %}</p>
            <fieldset>
                <div class="control-group">
                    <label class="control-label" for="cur-pwd">{% trans "Current Password" %}</label>
                    <div class="controls">
                        <input type="password" class="input-xlarge" id="cur-pwd">
                        <p class="help-block">{% trans "For security reasons, please provide your current password." %}</p>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="pwd">{% trans "New Password" %}</label>
                    <div class="controls">
                        <input type="password" class="input-xlarge" id="pwd">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="pwd2">{% trans "(repeat)" %}</label>
                    <div class="controls">
                        <input type="password" class="input-xlarge" id="pwd2">
                    </div>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <label class="checkbox"><input type="checkbox" id="show-passwords" /> {%    trans "Show password in clear text" %}</label>
                    </div>
                </div>

                <div class="form-actions">
                    <button class="btn btn-primary" type="submit" id="change-password">{% trans "Change Password" %}</button>
                </div>
            </fieldset>
        </div>
    </div>
    <script type="text/javascript">

        // change password
        $('#change-password').click(function(e) {
            var submit = $(e.target),
                parent = $($('.settings.password .control-group')[0]),
                curPwd = $.trim($('#cur-pwd').val()),
                pwd = $.trim($('#pwd').val()),
                pwd2 = $.trim($('#pwd2').val()),
                check;

            dw.backend.clearAlerts()

            check = dw.backend.checkPassword(curPwd, pwd, pwd2);
            if (check === true) {
                // at first we req
                submit.addClass('loading');

                $.getJSON('/api/auth/salt', function(res) {
                    if (res.status == 'ok') {
                        var salt = res.data.salt
                            hmac = CryptoJS.HmacSHA256,
                            payload = {
                                oldpwhash: hmac(curPwd, salt).toString(),
                                pwd: CryptoJS.HmacSHA256(pwd, salt).toString()
                            };

                        $('#pwd').val('');
                        $('#pwd2').val('');
                        $('#cur-pwd').val('');

                        $.ajax({
                            url: '/api/users/{{ user.id }}',
                            type: 'PUT',
                            data: JSON.stringify(payload),
                            dataType: 'json',
                            success: function(data) {
                                submit.removeClass('loading');
                                if (data.status == 'ok') {
                                    _.each(data.data.messages, function(msg) {
                                        dw.backend.logMessage(msg, $('.account.password .control-group')[0], 'info');
                                    });
                                    _.each(data.data.errors, function(msg) {
                                        dw.backend.logMessage(msg, $('.account.password .control-group')[0], 'warning');
                                    });
                                    if (!data.data.errors.length) {
                                        dw.backend.logMessage('{% trans "Congrats! Your password has been changed." %}', parent);
                                    }
                                }
                            }
                        });
                    }
                });
            }
        });

        // show password in clear text
        $('#show-passwords').change(function() {
            var t = $('#show-passwords').prop('checked') ? 'text' : 'password';
            $('#pwd')[0].type = t;
            $('#pwd2')[0].type = t;
        });

    </script>

{% endblock %}
