{% extends ../base.html %}

{% block title %}Crafty Controller - {{ translate('serverWizard', 'newServer') }}{% end %}

{% block content %}

<div class="content-wrapper">
    <div class="row">
      <div class="col-sm-6 grid-margin stretch-card">
        <div class="card">
          <div class="card-body">

            <h4>{{ translate('serverWizard', 'newServer') }}</h4>
            <br />
            <p class="card-description">

              <form method="post" class="server-wizard">
                {% raw xsrf_form_html() %}
                <div class="row">
                  <div class="col-sm-12">
                    <div class="form-group">
                      <h4 class="card-title" style="margin-bottom:20px;">{{ translate('serverWizard', 'serverType') }}</h4>

                      <select class="form-control form-control-lg select-css" id="server" name="server">
                        {% for s in data['server_types'] %}
                          {% for v in data['server_types'][s] %}
                            <option value="{{ s }}|{{ v }}">{{ s.capitalize() }} - {{ v }}</option>
                          {% end %}
                        {% end %}
                      </select>

                    </div>
                  </div>

                  <div class="col-sm-12">
                    <div class="form-group">
                      <label for="server_name">{{ translate('serverWizard', 'serverName') }}</label>
                      <input type="text" class="form-control" id="server_name" name="server_name" placeholder="{{ translate('serverWizard', 'myNewServer') }}">
                    </div>
                  </div>

                </div>
                <br />
                <h4 class="card-title">{{ translate('serverWizard', 'quickSettings') }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription') }}</small></h4>
                <hr>
                <div class="row">

                  <div class="col-sm-3">
                    <div class="form-group">
                      <label for="min_memory1">{{ translate('serverWizard', 'minMem') }} <small> - {{ translate('serverWizard', 'sizeInGB') }}</small></label>
                      <input type="number" class="form-control" id="min_memory1"  name="min_memory" value="1" step="0.5" min="0.5">
                    </div>
                  </div>

                  <div class="col-sm-3 offset-1">
                    <div class="form-group">
                      <label for="max_memory1">{{ translate('serverWizard', 'maxMem') }} <small> - {{ translate('serverWizard', 'sizeInGB') }}</small></label>
                      <input type="number" class="form-control" id="max_memory1"  name="max_memory" value="2" step="0.5" min="0.5">
                    </div>
                  </div>

                  <div class="col-sm-3 offset-1">
                    <div class="form-group">
                      <label for="port1">{{ translate('serverWizard', 'serverPort') }} <small> - {{ translate('serverWizard', 'defaultPort') }}</small></label>
                      <input type="number" class="form-control" id="port1" name="port" value="25565" step="1" min="1">
                    </div>
                  </div>

                </div>
                <button type="submit" class="btn btn-primary mr-2" onclick="wait_msg()">{{ translate('serverWizard', 'buildServer') }}</button>
                <button type="reset" class="btn btn-danger mr-2">{{ translate('serverWizard', 'resetForm') }}</button>

              </form>
            </p>
          </div>
        </div>
      </div>

      <div class="col-sm-6 grid-margin stretch-card">
        <div class="card">
          <div class="card-body">

            <h4>{{ translate('serverWizard', 'importServer') }}</h4>
            <br />
            <p class="card-description">

              <form method="post" class="server-wizard">
                {% raw xsrf_form_html() %}
                <input type="hidden" value="import_jar" name="create_type">
                <div class="row">

                  <div class="col-sm-12">
                    <div class="form-group">
                      <label for="server_name">{{ translate('serverWizard', 'serverName') }}</label>
                      <input type="text" class="form-control" id="server_name" name="server_name" value="" placeholder="{{ translate('serverWizard', 'myNewServer') }}">
                    </div>
                  </div>

                  <div class="col-sm-12">
                    <div class="form-group">
                      <label for="server">{{ translate('serverWizard', 'serverPath') }} <small>{{ translate('serverWizard', 'absoluteServerPath') }}</small></label>
                      <input type="text" class="form-control" id="server_path" name="server_path" placeholder="/var/opt/server">
                    </div>
                  </div>

                  <div class="col-sm-12">
                    <div class="form-group">
                      <label for="server_jar">{{ translate('serverWizard', 'serverJar') }}</label>
                      <input type="text" class="form-control" id="server_jar" name="server_jar" value="" placeholder="paper.jar">
                    </div>
                  </div>



                </div>
                <br />
                <h4 class="card-title">{{ translate('serverWizard', 'quickSettings') }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription') }}</small></h4>
                <hr>
                <div class="row">

                  <div class="col-sm-3">
                    <div class="form-group">
                      <label for="min_memory2">{{ translate('serverWizard', 'minMem') }} <small> - {{ translate('serverWizard', 'sizeInGB') }}</small></label>
                      <input type="number" class="form-control" id="min_memory2"  name="min_memory" value="1" step="0.5" min="0.5">
                    </div>
                  </div>

                  <div class="col-sm-3 offset-1">
                    <div class="form-group">
                      <label for="max_memory2">{{ translate('serverWizard', 'maxMem') }} <small> - {{ translate('serverWizard', 'sizeInGB') }}</small></label>
                      <input type="number" class="form-control" id="max_memory2"  name="max_memory" value="2" step="0.5" min="0.5">
                    </div>
                  </div>

                  <div class="col-sm-3 offset-1">
                    <div class="form-group">
                      <label for="port2">{{ translate('serverWizard', 'serverPort') }} <small> - {{ translate('serverWizard', 'defaultPort') }}</small></label>
                      <input type="number" class="form-control" id="port2" name="port" value="25565" step="1" min="1">
                    </div>
                  </div>

                </div>
                <button type="submit" class="btn btn-primary mr-2" onclick="wait_msg(true)">{{ translate('serverWizard', 'importServerButton') }}</button>
                <button type="reset" class="btn btn-danger mr-2">{{ translate('serverWizard', 'resetForm') }}</button>

              </form>
            </p>
          </div>
        </div>
      </div>
    </div>
    <div class="col-sm-13 grid-margin stretch-card">
        <div class="card">
          <div class="card-body">

            <h4>{{ translate('serverWizard', 'importZip') }}</h4>
            <br />
            <p class="card-description">

              <form method="post" class="server-wizard">
                {% raw xsrf_form_html() %}
                <input type="hidden" value="import_zip" name="create_type">

                <div class="row">
                  <div class="col-sm-9">
                    <div class="col-sm-12">
                      <div class="form-group">
                        <label for="server_name">{{ translate('serverWizard', 'serverName') }}</label>
                        <input type="text" class="form-control" id="server_name" name="server_name" value="" placeholder="{{ translate('serverWizard', 'myNewServer') }}">
                      </div>
                    </div>

                    <div class="col-sm-12">
                      <div class="form-group">
                        <label for="server">{{ translate('serverWizard', 'zipPath') }} <small>{{ translate('serverWizard', 'absoluteZipPath') }}</small></label>
                        <input type="text" class="form-control" id="server_path" name="server_path" placeholder="/var/opt/server.zip">
                      </div>
                    </div>

                    <div class="col-sm-12">
                      <div class="form-group">
                        <label for="server_jar">{{ translate('serverWizard', 'serverJar') }}</label>
                        <input type="text" class="form-control" id="server_jar" name="server_jar" value="" placeholder="paper.jar">
                      </div>
                    </div>
                  </div>



                  <div class="col-sm-3">
                    <h4 class="card-title">{{ translate('serverWizard', 'quickSettings') }} <small style="text-transform: none;"> - {{ translate('serverWizard', 'quickSettingsDescription') }}</small></h4>
                    <hr>
                    <div class="row">

                      <div class="col-sm-12">
                        <div class="form-group">
                          <label for="min_memory3">{{ translate('serverWizard', 'minMem') }} <small> - {{ translate('serverWizard', 'sizeInGB') }}</small></label>
                          <input type="number" class="form-control" id="min_memory3"  name="min_memory" value="1" step="0.5" min="0.5">
                        </div>
                      </div>

                      <div class="col-sm-12">
                        <div class="form-group">
                          <label for="max_memory3">{{ translate('serverWizard', 'maxMem') }} <small> - {{ translate('serverWizard', 'sizeInGB') }}</small></label>
                          <input type="number" class="form-control" id="max_memory3"  name="max_memory" value="2" step="0.5" min="0.5">
                        </div>
                      </div>

                      <div class="col-sm-12">
                        <div class="form-group">
                          <label for="port3">{{ translate('serverWizard', 'serverPort') }} <small> - {{ translate('serverWizard', 'defaultPort') }}</small></label>
                          <input type="number" class="form-control" id="port3" name="port" value="25565" step="1" min="1">
                        </div>
                      </div>

                    </div>
                    <button type="submit" class="btn btn-primary mr-2" onclick="wait_msg(true)">{{ translate('serverWizard', 'importServerButton') }}</button>
                    <button type="reset" class="btn btn-danger mr-2">{{ translate('serverWizard', 'resetForm') }}</button>
                  </div>
                </div>
              </form>
            </p>
          </div>
        </div>
      </div>
</div>

{% end %}

{% block js%}

<script>
  $( document ).ready(function() {
    console.log('ready');
    var forms = $('form.server-wizard');
    forms.each(function(i, formEl) {
      var form = $(formEl);
      var min = form.find('[name=min_memory]');
      var max = form.find('[name=max_memory]');
      console.log(form, min, max)
      min.change(function(){
        check_sizes(max, min, 'min');
      });
      max.change(function(){
        check_sizes(max, min, 'max');
      });
    });
  });

  function wait_msg(importing){
    bootbox.alert({
        title: importing ? '{% raw translate("serverWizard", "importing") %}' : '{% raw translate("serverWizard", "downloading") %}',
        message: '<i class="fas fa-cloud-download"></i> {% raw translate("serverWizard", "bePatient") %}'
      });
  }

  function check_sizes(a, b, changed){
    max_mem = parseFloat(a.val());
    min_mem = parseFloat(b.val());
    if (max_mem < min_mem && changed === 'min'){
      a.val(min_mem)
    }
    if (max_mem < min_mem && changed === 'max'){
      b.val(max_mem)
    }
  }

</script>
{% end %}