{% extends 'layout/layout.html' %}

{% block html_base_css %}login-page nologin{% endblock %}

{% block html_title %}{{ customizeService.generateCustomTitleForFixedPageName(t('Sign in')) }}{% endblock %}



{#
 # Remove default contents
 #}
{% block html_head_loading_legacy %}
{% endblock %}
{% block html_head_loading_app %}
{% endblock %}
{% block layout_head_nav %}
{% endblock %}
{% block sidebar %}
{% endblock %}
{% block head_warn_alert_siteurl_undefined %}
{% endblock %}
{% block fixed-controls %}
{% endblock %}

{% block html_additional_headers %}
  <script src="{{ webpack_asset('js/nologin.js') }}" defer></script>
{% endblock %}

{% block layout_main %}

<div class="main container-fluid">

  <div class="row">
    <div class="col-md-12">
      <div class="login-header mx-auto">
        <div class="logo mb-3">{% include 'widget/logo.html' %}</div>
        <h1>{{ appService.getAppTitle() | preventXss }}</h1>

          <div class="login-form-errors px-3">
            {% if isLdapSetupFailed() %}
            <div class="alert alert-warning small">
              <strong><i class="icon-fw icon-info"></i>LDAP is enabled but the configuration has something wrong.</strong>
              <br>
              (Please set the environment variables <code>DEBUG=crowi:service:PassportService</code> to get the logs)
            </div>
            {% endif %}

            {#
            # The case that there already exists a user whose username matches ID of the newly created LDAP user
            # https://github.com/weseek/growi/issues/193
            #}
            {% set failedProviderForDuplicatedUsernameException = req.flash('provider-DuplicatedUsernameException') %}
            {% if failedProviderForDuplicatedUsernameException != null %}
            <div class="alert alert-warning small">
              <p><strong><i class="icon-fw icon-ban"></i>DuplicatedUsernameException occured</strong></p>
              <p>
                Your {{ failedProviderForDuplicatedUsernameException }} authentication was succeess, but a new user could not be created.
                See the issue <a href="https://github.com/weseek/growi/issues/193">#193</a>.
              </p>
            </div>
            {% endif %}

            {% set success = req.flash('successMessage') %}
            {% if success.length %}
            <div class="alert alert-success">
              {{ success }}
            </div>
            {% endif %}

            {% set warn = req.flash('warningMessage') %}
            {% if warn.length %}
            {% for w in warn %}
            <div class="alert alert-warning">
              {{ w }}
            </div>
            {% endfor %}
            {% endif %}

            {% set error = req.flash('errorMessage') %}
            {% if error.length %}
            {% for e in error %}
            <div class="alert alert-danger">
              {{ e }}
            </div>
            {% endfor %}
            {% endif %}

            {% if req.form.errors.length > 0 %}
            <div class="alert alert-danger">
              <ul class="mb-0">
              {% for error in req.form.errors %}
                <li>{{ error }}</li>
              {% endfor %}
              </ul>
            </div>
            {% endif %}
          </div>
          <div id="register-form-errors" class="px-3">
            {% set message = req.flash('registerWarningMessage') %}
            {% if message.length %}
            <div class="alert alert-danger">
              {% for msg in message %}
              {{ msg }}<br>
              {% endfor  %}
            </div>
            {% endif %}
          </div>
      </div>

      {% set registrationMode = getConfig('crowi', 'security:registrationMode') %}
      {% set isRegistrationEnabled = passportService.isLocalStrategySetup && registrationMode != 'Closed' %}

      <div
        id="login-form"
        data-is-registering="{{ req.query.register or req.body.registerForm or isRegistering }}"
        data-username ="{{ req.body.registerForm.username }}"
        data-name ="{{ req.body.registerForm.name }}"
        data-email ="{{ req.body.registerForm.email }}"
        data-is-registration-enabled="{{ isRegistrationEnabled }}"
        data-registration-mode = "{{ registrationMode }}"
        data-registration-white-list = "{{ getConfig('crowi', 'security:registrationWhiteList') }}"
        data-is-local-strategy-setup = "{{ passportService.isLocalStrategySetup }}"
        data-is-ldap-strategy-setup = "{{ passportService.isLdapStrategySetup}}"
        data-is-google-auth-enabled = "{{ getConfig('crowi', 'security:passport-google:isEnabled') }}"
        data-is-github-auth-enabled = "{{ getConfig('crowi', 'security:passport-github:isEnabled') }}"
        data-is-facebook-auth-enabled = "{{ getConfig('crowi', 'security:passport-facebook:isEnabled') }}"
        data-is-twitter-auth-enabled = "{{ getConfig('crowi', 'security:passport-twitter:isEnabled') }}"
        data-is-saml-auth-enabled = "{{ getConfig('crowi', 'security:passport-saml:isEnabled') }}"
        data-is-oidc-auth-enabled = "{{ getConfig('crowi', 'security:passport-oidc:isEnabled') }}"
        data-is-basic-auth-enabled = "{{ getConfig('crowi', 'security:passport-basic:isEnabled') }}"
      ></div>
    </div>
  </div>
</div>

{% endblock %}


{% block body_end %}
<script>
  $('#register-form input[name="registerForm[username]"]').change(function(e) {
    var username = $(this).val();
    $('#login-dialog').removeClass('has-error');
    $('#input-group-username').removeClass('has-error');
    $('#help-block-username').html("");

    $.getJSON('/_api/check_username', {username: username}, function(json) {
      if (!json.valid) {
        $('#help-block-username').html(
          '<i class="icon-fw icon-ban"></i> This User ID is not available.'
        );
        $('#login-dialog').addClass('has-error');
        $('#input-group-username').addClass('has-error');
      }
    });
  });
</script>
{% endblock %}
