<div class="surface">
<p>Creating upload for <span class="token">{{ dataset.slug }}</span></p>
{% if parts %}
<p>Parts:</p>
<ul class="font-mono">
{% for part in parts %}
<li>{{ part }}</li>
{% endfor %}
</ul>
{% endif %}

<p>Make sure you have read the <a href="/docs/uploading">upload guide</a> for how to create your torrent!</p>
<p>
    If your torrent is particularly large (>5MB) or has a large number of files (>20,000), this may take a few moments.
    If you are uploading a scrape of a website, we strongly recommend zipping directories into logical subsets of the scraped pages,
    or zipping them such that each archive is slightly less than your torrent's piece size (which should be a few MB).
</p>

<form id='{{ dataset.slug }}-upload-form' class="upload-form" name="file" hx-encoding='multipart/form-data'
      hx-post="/datasets/{{ dataset.slug }}/upload/torrent{% if parts %}?{{ parts | join('=on&') }}=on{% endif %}"
      hx-indicator="#{{ dataset.slug }}-upload-indicator"
      hx-swap="outerHTML">
    <input type='file' name='file'>
    <div class="status-bar">
        <button type="submit" class="form-button">
            Upload
        </button>
        <progress id='progress' value='0' max='100' aria-label="Upload progress"></progress>

        <span class="htmx-indicator loading-indicator" id="{{ dataset.slug }}-upload-indicator">
          <img src="/static/img/rings.svg" alt="Loading indicator, a spinning ring"/>
        </span>
    </div>
</form>
<script>

</script>
</div>