{% extends "@ContaoInstallation/layout.html.twig" %}

{% block main %}
  <fieldset class="tl_tbox nolegend">
    <div>
      <h3>{{ 'database_connection'|trans }}</h3>
      {% if database_error is defined %}
        <p class="tl_error">{{ database_error }}</p>
      {% endif %}
      <p>{{ 'database_connection_explain'|trans }}</p>
      <form method="post">
        <div class="tl_formbody">
          <input type="hidden" name="FORM_SUBMIT" value="tl_database_login">
          <input type="hidden" name="REQUEST_TOKEN" value="{{ request_token }}">
          <h4><label for="dbHost">{{ 'database_host'|trans }}</label></h4>
          <input type="text" name="dbHost" id="dbHost" class="tl_text" value="{{ parameters.database_host|default('localhost') }}">
          <h4><label for="dbPort">{{ 'database_port'|trans }}</label></h4>
          <input type="text" name="dbPort" id="dbPort" class="tl_text" value="{{ parameters.database_port|default(3306) }}">
          <h4><label for="dbUser">{{ 'database_user'|trans }}</label></h4>
          <input type="text" name="dbUser" id="dbUser" class="tl_text" value="{{ parameters.database_user }}">
          <h4><label for="dbPassword">{{ 'database_password'|trans }}</label></h4>
          <input type="password" name="dbPassword" id="dbPassword" class="tl_text" value="{% if parameters.database_password %}*****{% endif %}">
          <h4><label for="dbName">{{ 'database_name'|trans }}</label></h4>
          <input type="text" name="dbName" id="dbName" class="tl_text" value="{{ parameters.database_name }}">
        </div>
        <div class="tl_formbody_submit">
          <div class="tl_submit_container">
            <button type="submit" class="tl_submit">{{ 'save_settings'|trans }}</button>
          </div>
        </div>
      </form>
    </div>
  </fieldset>
  <script>
    $('dbHost').focus();
  </script>
{% endblock %}