@(signUpForm:Form[securesocial.controllers.Registration.RegistrationInfo], token: String)(implicit request: RequestHeader)
@import securesocial.core.providers.UsernamePasswordProvider
@import securesocial.core.IdentityProvider
@import helper._
@implicitFieldConstructor = @{ FieldConstructor(securesocial.views.html.inputFieldConstructor.f) }
@import services.AppConfiguration

@main(Messages("securesocial.signup.title") ) {
    <div class="col-md-4 col-md-offset-4 col-sm-4 col-sm-offset-4 panel panel-default">
        <div class="page-header">
            <h1>Sign Up</h1>
        </div>

        @request.flash.get("error").map { msg =>
            <div class="alert alert-info">
                @msg
            </div>
        }

        <div class="clearfix">
            <p>@Messages("Please enter your personal information to finish registration")</p>
        </div>

        @*<form action="@securesocial.core.providers.utils.RoutesHelper.handleSignUp(token).absoluteURL(IdentityProvider.sslEnabled)"*@
      <form action = @routes.Registration.handleSignUp(token)
              class="form-horizontal"
              autocomplete= "off"
              method="POST"
        >
            <fieldset>
                @if( UsernamePasswordProvider.withUserNameSupport ) {
                    @helper.inputText(
                        signUpForm("userName"),
                        '_label -> Messages("securesocial.signup.username"),
                        'class -> "form-control",
                        '_help -> "",
                        '_showErrors -> true
                    )
                }

                @helper.inputText(
                    signUpForm("firstName"),
                    '_label -> Messages("securesocial.signup.firstName"),
                    'class -> "form-control",
                    '_help -> "",
                    '_showErrors -> true
                )

                @helper.inputText(
                    signUpForm("lastName"),
                    '_label -> Messages("securesocial.signup.lastName"),
                    'class -> "form-control",
                    '_help -> "",
                    '_showErrors -> true
                )

                @helper.inputPassword(
                    signUpForm("password.password1"),
                    '_label -> Messages("securesocial.signup.password1"),
                    'class -> "form-control",
                    '_help -> "",
                    '_showErrors -> true
                )

                @helper.inputPassword(
                    signUpForm("password.password2"),
                    '_label -> Messages("securesocial.signup.password2"),
                    'class -> "form-control",
                    '_help -> "",
                    '_showErrors -> true
                )

                @helper.checkbox(
                    signUpForm("agreementAcknowledged"),
                    '_label -> "Terms of Service",
                    '_text -> Html("Check the box to accept the <a target=\"tos\" href=\"../tos\">Terms of Service</a>"),
                    '_help -> "",
                    '_showErrors -> true
                )

                <div class="form-actions btn-margin-bottom">
                    <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-ok"></span> @Messages("securesocial.signup.createAccount")</button>
                    <a class="btn btn-default" href="@securesocial.core.providers.utils.RoutesHelper.login()"><span class="glyphicon glyphicon-remove"></span> @Messages("securesocial.signup.cancel")</a>
                </div>
            </fieldset>
      </form>

      <script type="text/javascript">
        $(document).ready(function() {
            var userAgreementElement = $("#agreementAcknowledged");
            if (userAgreementElement && userAgreementElement.length) {
                // if there is a value in the Admin -> Customize menu for User Agreement,
                // this element will present. In that case, disable the submit button until
                // the user clicks the checkbox to agree to the terms
                $(":submit").prop('disabled', true);

                // if the user submits the form with the checkbox checked, but there are validation errors
                // this will uncheck the form on the validation page
                userAgreementElement.attr('checked', false);

                // toggle whether the button is disabled depending on if the checkbox is checked
                userAgreementElement.on('click', function() {
                    $(":submit").prop('disabled', function(i, v) { return !v; });
                });
            }

        })
      </script>
    </div>
}