{% extends "base.html" %} {% block content %}
<h1 class="container mt-5 display-4 text-center">
  <br />Create new experiment: (1/4)
</h1>
<br />
<br />
<p class="lead">
  Please input the following information. All fields are required.
</p>
{% from "_formhelpers.html" import render_field %} <div class=container"><br />
<div class="row align-items-center justify-content-center">
  <div class="col-12">
    <form action="" method="post" role="form">
      <div class="form-group">
        <label for="name">Your name:</label>
        <input
          required
          type="text"
          class="form-control"
          id="creator_name"
          name="creator_name"
          placeholder="Creator name?"
        />
        <br />
        {% for group in groups %} {{ group }} {% endfor %}
        <label for="research-group">Group:</label>
        <select class="form-control" id="group" name="group">
          {% for group in valid_groups %}
          <option value="{{group.id}}">{{ group.name }}</option>
          {% endfor %}
        </select>

        <br />
        <label for="name">Name of the experiment:</label>
        <input
          required
          type="text"
          class="form-control"
          id="name"
          name="name"
          placeholder="Experiment name?"
        />
        <br />

        <div class="form-group">
          <label for="language">Select a language for the experiment:</label>
          <select class="form-control" id="language" name="language">
            <!--<option disabled selected value></option>-->
            <option value="Afrikanns">Afrikanns</option>
            <option value="Albanian">Albanian</option>
            <option value="Arabic">Arabic</option>
            <option value="Armenian">Armenian</option>
            <option value="Basque">Basque</option>
            <option value="Bengali">Bengali</option>
            <option value="Bulgarian">Bulgarian</option>
            <option value="Catalan">Catalan</option>
            <option value="Cambodian">Cambodian</option>
            <option value="Chinese">Chinese</option>
            <option value="Croation">Croation</option>
            <option value="Czech">Czech</option>
            <option value="Danish">Danish</option>
            <option value="Dutch">Dutch</option>
            <option selected value="English">English</option>
            <option value="Estonian">Estonian</option>
            <option value="Fiji">Fiji</option>
            <option value="Finnish">Finnish</option>
            <option value="French">French</option>
            <option value="Georgian">Georgian</option>
            <option value="German">German</option>
            <option value="Greek">Greek</option>
            <option value="Gujarati">Gujarati</option>
            <option value="Hebrew">Hebrew</option>
            <option value="Hindi">Hindi</option>
            <option value="Hungarian">Hungarian</option>
            <option value="Icelandic">Icelandic</option>
            <option value="Indonesian">Indonesian</option>
            <option value="Irish">Irish</option>
            <option value="Italian">Italian</option>
            <option value="Japanese">Japanese</option>
            <option value="Javanese">Javanese</option>
            <option value="Korean">Korean</option>
            <option value="Latin">Latin</option>
            <option value="Latvian">Latvian</option>
            <option value="Lithuanian">Lithuanian</option>
            <option value="Macedonian">Macedonian</option>
            <option value="Malay">Malay</option>
            <option value="Malayalam">Malayalam</option>
            <option value="Maltese">Maltese</option>
            <option value="Maori">Maori</option>
            <option value="Marathi">Marathi</option>
            <option value="Mongolian">Mongolian</option>
            <option value="Nepali">Nepali</option>
            <option value="Norwegian">Norwegian</option>
            <option value="Persian">Persian</option>
            <option value="Polish">Polish</option>
            <option value="Portuguese">Portuguese</option>
            <option value="Punjabi">Punjabi</option>
            <option value="Quechua">Quechua</option>
            <option value="Romanian">Romanian</option>
            <option value="Russian">Russian</option>
            <option value="Samoan">Samoan</option>
            <option value="Serbian">Serbian</option>
            <option value="Slovak">Slovak</option>
            <option value="Slovenian">Slovenian</option>
            <option value="Spanish">Spanish</option>
            <option value="Swahili">Swahili</option>
            <option value="Swedish ">Swedish</option>
            <option value="Tamil">Tamil</option>
            <option value="Tatar">Tatar</option>
            <option value="Telugu">Telugu</option>
            <option value="Thai">Thai</option>
            <option value="Tibetan">Tibetan</option>
            <option value="Tonga">Tonga</option>
            <option value="Turkish">Turkish</option>
            <option value="Ukranian">Ukranian</option>
            <option value="Urdu">Urdu</option>
            <option value="Uzbek">Uzbek</option>
            <option value="Vietnamese">Vietnamese</option>
            <option value="Welsh">Welsh</option>
            <option value="Xhosa">Xhosa</option>
          </select>

          <br />
          <p>
            Instructions for the experiment come in three forms: <br />
            (1) A single sentence instruction that is shown during the rating
            task above the sliders. <br />
            (2) A short general description of the task that is shown on the
            experiment listing on Onni's front page and on the informed consent
            page. <br />
            (3) a longer detailed explanation of the instructions that is shown
            to the participant after the consent and before the rating task
            begins. <br />
            Please input all three types of instructions below:
          </p>

          <label for="single_sentence_instruction">(1) Single sentence:</label>
          <input
            required
            type="text"
            class="form-control"
            id="single_sentence_instruction"
            name="single_sentence_instruction"
            placeholder="Input here"
            required
          />
          <br />
          <label for="short_instruction">(2) Short description:</label>
          <textarea
            class="form-control"
            rows="5"
            id="short_instruction"
            name="short_instruction"
            placeholder="Input here"
            required
          ></textarea>
          <br />

          <label for="instruction">(3) Longer version:</label>
          <textarea
            class="form-control"
            rows="15"
            id="instruction"
            name="instruction"
            placeholder="Input here"
            required
          ></textarea>
          <br />

          <label for="instruction">Please input consent form text</label>
          <textarea
            class="form-control"
            rows="15"
            id="consent_text"
            name="consent_text"
            placeholder="Input here"
            required
          ></textarea>
          <br />
        </div>
      </div>
      <br />
      <button type="submit" class="btn btn-primary">Submit</button>
    </form>

    {% endblock %}
  </div>
</div>