@{
    ViewBag.Title = "Reset Password";
}
@Html.Partial("Scripts/Styles")

@if (!Request.IsAuthenticated || Session["DateLoggedIn"] == null)
{
    Response.Redirect("~/Auth/SignIn");
}

<div id="resetPassword">
    <div id="resetPasswordForm">
        <fieldset><legend data-bind="text: _legend"></legend>
            <ol>
                <li id="oldPassword">
                    <label id="oldPasswordLabel" for="oldPasswordInput" class="required">Old Password:</label>
                    <input id="oldPasswordInput" type="password" data-bind="value: oldPassword, valueUpdate: 'afterkeydown'" />
                </li>
                <li id="newPassword">
                    <label id="newPasswordLabel" for="newPasswordInput" class="required">New Password:</label>
                    <input id="newPasswordInput" type="password" data-bind="value: newPassword, valueUpdate: 'afterkeydown'" />
                </li>
                <li id="newPasswordConfirm">
                    <label id="newPasswordConfirmLabel" for="newPasswordConfirmInput" class="required">New Password Confirmation:</label>
                    <input id="newPasswordConfirmInput" type="password" data-bind="value: newPasswordConfirm, valueUpdate: 'afterkeydown'" />
                </li>
            </ol>
            <div id="finishedItem" style="padding: 0 4em 1em 0">
                Your password has been updated.
            </div>
            <div id="resetPasswordError" class="errorLabel" data-bind="text: _errorMessage, visible: _errorMessage">
            </div>
            <div>                
                <button class="align-right" data-bind="juiEnabled: _isValid" id="resetButton">Reset Password</button>
            </div>
        </fieldset>
    </div>
</div>
@Html.Partial("Scripts/ResetPassword.Init")
@Html.Partial("Scripts/ResetPassword.Ui")
@Html.Partial("Scripts/ResetPassword.Validation")

<script type="text/javascript">
    $(function () {
        $(document).ready(function () {                            
            $("#resetButton").button({
                icons: {
                    primary: "ui-icon-arrowreturnthick-1-e"
                },
                text: true
            })
            .click(function ()
            {
                viewModel.resetPassword();
            });
                
            viewModel.oldPassword.subscribe(function (newValue) { viewModel.validate() });
            viewModel.newPassword.subscribe(function (newValue) { viewModel.validate() });
            viewModel.newPasswordConfirm.subscribe(function (newValue) { viewModel.validate() });

            viewModel.setVisualState(viewModel.STATE_USER());            
        });
    });
</script>