{% extends "base.html" %}
{% block content %}
<div class="narrow wide">
  <h1>Upload file</h1>
  <p class="meta">Choose the file first. The repository will inspect it, extract available metadata and pre-fill the form before you save it.</p>
  <form id="uploadForm" method="post" enctype="multipart/form-data" class="panel form">
    <label>File
      <input id="uploadFile" type="file" name="file" required>
      <small id="inspectStatus">Choose a file to inspect it.</small>
    </label>
    <input type="hidden" name="pending_token" id="pendingToken">
    <input type="hidden" name="client_modified" id="clientModified">

    <label>Add as a new version of an existing file
      <select name="existing_file_id"><option value="">Create new file group</option>{% for f in existing %}<option value="{{f.id}}">{{f.display_name}}</option>{% endfor %}</select>
    </label>

    <div class="twocol tight">
      <label>Display name<input id="displayName" name="display_name" placeholder="Filled from file metadata where possible"></label>
      <label>Logical name<input id="logicalName" name="logical_name" placeholder="Stable internal name"></label>
    </div>
    <div class="twocol tight">
      <label>Version label<input id="versionLabel" name="version_label" placeholder="e.g. 2.1, 2026-09, Final"></label>
      <label>Category<select name="category_id"><option value="">Uncategorised</option>{% for c in categories %}<option value="{{c.id}}">{{c.name}}</option>{% endfor %}</select></label>
    </div>

    <label>Keywords<input id="keywords" name="keywords" placeholder="Extracted keywords/tags are added where available"></label>
    <label>Notes<textarea id="notes" name="notes" rows="5" placeholder="Description, comments or subject are pre-filled where available"></textarea></label>

    <div class="platform-editor">
      <h3>Operating system versions</h3>
      <div class="platform-row"><label class="check"><input id="windowsSupported" type="checkbox" name="windows_supported"> Windows</label><input name="windows_version" placeholder="Version / requirement, e.g. Windows 10 or later"></div>
      <div class="platform-row"><label class="check"><input id="macSupported" type="checkbox" name="mac_supported"> macOS</label><input name="mac_version" placeholder="Version / requirement, e.g. macOS 14+"></div>
      <div class="platform-row"><label class="check"><input id="linuxSupported" type="checkbox" name="linux_supported"> Linux</label><input name="linux_version" placeholder="Version / distro requirement, e.g. Ubuntu 24.04+"></div>
    </div>

    <label>Custom file icon / image
      <input type="file" name="icon" accept="image/png,image/jpeg,image/webp,image/gif,image/x-icon,.ico">
      <small>Optional. PNG, JPG, WEBP, GIF or ICO.</small>
    </label>

    <details id="metadataPreview" class="metadata" hidden><summary>Detected metadata</summary><pre id="metadataText"></pre></details>
    <button class="btn" id="saveButton">Save to repository</button>
  </form>
</div>
{% endblock %}
{% block scripts %}
<script>
const fileInput = document.getElementById('uploadFile');
const statusEl = document.getElementById('inspectStatus');
const tokenEl = document.getElementById('pendingToken');
const modifiedEl = document.getElementById('clientModified');
const metadataBox = document.getElementById('metadataPreview');
const metadataText = document.getElementById('metadataText');
const CHUNK_SIZE = 8 * 1024 * 1024;

function setIfEmpty(id, value) {
  const el = document.getElementById(id);
  if (el && !el.value && value) el.value = value;
}
function pct(done,total){ return total ? Math.min(100, Math.round(done * 100 / total)) : 0; }

fileInput.addEventListener('change', async () => {
  tokenEl.value = '';
  fileInput.name = 'file';
  metadataBox.hidden = true;
  const file = fileInput.files[0];
  if (!file) return;
  modifiedEl.value = file.lastModified ? new Date(file.lastModified).toISOString() : '';
  try {
    statusEl.textContent = 'Preparing upload…';
    let r = await fetch('{{ url_for("start_inspection") }}', {
      method:'POST', headers:{'Content-Type':'application/json'},
      body:JSON.stringify({filename:file.name, client_modified:modifiedEl.value})
    });
    let data = await r.json();
    if (!r.ok || !data.ok) throw new Error(data.error || 'Could not start upload');
    const token = data.token;
    const totalChunks = Math.ceil(file.size / CHUNK_SIZE) || 1;
    for (let i=0;i<totalChunks;i++) {
      const start = i * CHUNK_SIZE;
      const end = Math.min(file.size, start + CHUNK_SIZE);
      const fd = new FormData();
      fd.append('index', String(i));
      fd.append('chunk', file.slice(start,end), 'chunk.bin');
      statusEl.textContent = `Uploading for inspection… ${pct(end,file.size)}%`;
      r = await fetch(`/admin/upload-chunk/${token}`, {method:'POST', body:fd});
      data = await r.json();
      if (!r.ok || !data.ok) throw new Error(data.error || `Chunk ${i+1} failed`);
    }
    statusEl.textContent = 'Extracting file metadata…';
    r = await fetch(`/admin/finish-inspection/${token}`, {method:'POST'});
    data = await r.json();
    if (!r.ok || !data.ok) throw new Error(data.error || 'Inspection failed');
    tokenEl.value = token;
    fileInput.name = '';
    const s = data.suggestions || {};
    setIfEmpty('displayName', s.display_name);
    setIfEmpty('logicalName', s.logical_name);
    setIfEmpty('versionLabel', s.version_label);
    setIfEmpty('keywords', s.keywords);
    setIfEmpty('notes', s.notes);
    if (s.windows_supported) document.getElementById('windowsSupported').checked = true;
    if (s.mac_supported) document.getElementById('macSupported').checked = true;
    if (s.linux_supported) document.getElementById('linuxSupported').checked = true;
    metadataText.textContent = JSON.stringify(data.metadata || {}, null, 2);
    metadataBox.hidden = false;
    statusEl.textContent = 'Inspection complete. Metadata has been pre-filled. The file is already on the server and will not be uploaded again.';
  } catch (err) {
    fileInput.name = 'file';
    tokenEl.value = '';
    statusEl.textContent = 'Metadata inspection failed: ' + err.message + '. You can still save the file normally.';
  }
});
</script>
{% endblock %}