@using WePlatform
@using WePlatform.Configuration
@model WePlatform.Models.Account.RegisterViewModel
@{
    ViewBag.Title = L("Register");

}
@section styles
{
    <style>
        .login-page {
            max-width: 520px;
        }

        #RegisterForm .form-control {
            border-left: 1px solid #aaa !important;
        }
    </style>
}
<div class="card">
    <div class="body">
        <form id="RegisterForm" asp-action="Register" method="POST">
            <h4 class="text-center login-title">@L("Register")</h4>

            @Html.AntiForgeryToken()

            @if (ViewBag.ErrorMessage != null)
            {
                <div class="alert alert-danger">
                    <i class="fa fa-warning"></i> @ViewBag.ErrorMessage
                </div>
            }

            <input type="hidden" name="IsExternalLogin" value="@Model.IsExternalLogin.ToString()" />
            <input type="hidden" name="ExternalLoginAuthSchema" value="@Model.ExternalLoginAuthSchema" />
            <input type="hidden" name="userType" value="@(UsersAndRolesTypeDefinition.Ordinary)" />
            <input type="hidden" name="accountType" value="@(AccountTypeDefinition.Guest)" />

            <div class="input-group input-group-sm">
                <label class="col-md-2 control-label iwb-label iwb-label-required" for="">@(L("realName"))</label>
                <div class="col-md-10 focused">
                    <input class="form-control required" id="" name="" type="text" placeholder="@( L("PlaceholderHeader"))@(L("realName"))" value="@(Model.Name)" aria-required="true">
                </div>
            </div>
            <div class="input-group input-group-sm">
                <label class="col-md-2 control-label iwb-label iwb-label-required" for="">@(L("emailAddress"))</label>
                <div class="col-md-10 focused">
                    <input class="form-control required" id="" name="" type="text" placeholder="@( L("PlaceholderHeader"))@(L("emailAddress"))" value="@(Model.EmailAddress)" aria-required="true">
                </div>
            </div>
            <div class="input-group input-group-sm">
                <label class="col-md-2 control-label iwb-label iwb-label-required" for="">@(L("userName"))</label>
                <div class="col-md-10 focused">
                    <input class="form-control required" id="" name="" type="text" placeholder="@( L("PlaceholderHeader"))@(L("userName"))" value="@(Model.UserName)" aria-required="true">
                </div>
            </div>
            <div class="input-group input-group-sm">
                <label class="col-md-2 control-label iwb-label iwb-label-required" for="">@(L("Password"))</label>
                <div class="col-md-10 focused">
                    <input class="form-control required" id="" name="" type="text" placeholder="@( L("PlaceholderHeader"))@(L("Password"))" value="@(Model.Password)" aria-required="true">
                </div>
            </div>


            <div class="row">
                <div class="col-xs-12 text-center">
                    <a href="@Url.Action("Login", "Account")" cl class="btn btn-default waves-effect">@L("Back")</a>
                    <button id="RegisterButton" class="btn btn-iwb waves-effect" type="submit">@L("Register")</button>
                </div>
            </div>
        </form>
    </div>
</div>
@section scripts{
    <script>
        (function ($) {

            if (!$) {
                return;
            }

            $(function () {

                var $registerForm = $('#RegisterForm');

                $.validator.addMethod("customUsername", function (value, element) {
                    if (value === $registerForm.find('input[name="EmailAddress"]').val()) {
                        return true;
                    }

                    //Username can not be an email address (except the email address entered)
                    return !$.validator.methods.email.apply(this, arguments);
                }, abp.localization.localize("RegisterFormUserNameInvalidMessage", "IwbZero"));

                $registerForm.validate({
                    rules: {
                        UserName: {
                            required: true,
                            customUsername: true
                        }
                    },

                    highlight: function (input) {
                        $(input).parents('.form-line').addClass('error');
                    },

                    unhighlight: function (input) {
                        $(input).parents('.form-line').removeClass('error');
                    },

                    errorPlacement: function (error, element) {
                        $(element).parents('.form-group').append(error);
                    }
                });
            });

        })(jQuery);
    </script>
}