<% include ../partials/header %>
<section class="ui basic segment">
  <header>
    <h1>PRESS Test Site</h1>
    <h2>Autocomplete</h2>
  </header>

  <main class="ui two column grid">
    <form class="ui form column" method="POST">
      <h3>Code Under Test</h3>

      <input name="example_form[unchecked_checkbox]" type="hidden" value="0">
      <input class="boolean optional" type="checkbox" value="1" name="example_form[unchecked_checkbox]" id="example_form_unchecked_checkbox">
      <label class="boolean optional" for="example_form_unchecked_checkbox">Unchecked on page load</label>

      <input name="example_form[checked_checkbox]" type="hidden" value="0">
      <input class="boolean optional" type="checkbox" value="1" name="example_form[checked_checkbox]" id="example_form_checked_checkbox" checked>
      <label class="boolean optional" for="example_form_checked_checkbox">Checked on page load</label>

      <div>
        <label>Options</label>
        <input type="hidden" name="options" value="" />
        <div>
          <input selected="selected" checked="checked" type="radio" value="true" name="options" id="option_true" />
          <label for="option_true">Option True</label>
        </div>
        <div>
          <input selected="selected" readonly="readonly" type="radio" value="false" checked="checked" name="options" id="option_false" />
          <label for="option_false">Option False</label>
        </div>
        <div>
          <input selected="selected" readonly="readonly" type="radio" value="third_state" name="options" id="option_third_date" />
          <label for="option_third_date">Option Third</label>
        </div>
      </div>

      <textarea name="prefilled_text">prefilled</textarea>

      <input type="text" readonly name="count" value="0">
      <button id="button-without-name" type="button" @click="count++">Increase Counter</button>
      <button id="button-with-name" type="button" @click="count++" name="button_with_name">Increase Counter</button>

      <select name="select_with_placeholder" <%- required('select_with_placeholder') %>>
        <option value="">Placeholder</option>
        <option value="1" <%- selected('select_with_placeholder', '1') %>>One</option>
        <option value="2" <%- selected('select_with_placeholder', '2') %>>Two</option>
        <option value="3" <%- selected('select_with_placeholder', '3') %>>Three</option>
      </select>

      <select name="select_without_placeholder" <%- required('select_without_placeholder') %>>
        <option value="1" <%- selected('select_without_placeholder', '1') %>>One</option>
        <option value="2" <%- selected('select_without_placeholder', '2') %>>Two</option>
        <option value="3" <%- selected('select_without_placeholder', '3') %>>Three</option>
      </select>

      <button type="submit">Submit</button>
    </form>

    <div class="ui column">
      <%- include ../partials/request.ejs %>
    </div>
  </main>
</section>
<% include ../partials/footer %>
