162 lines
5.2 KiB
HTML
162 lines
5.2 KiB
HTML
<parcel-modal class="hidden" with-htmx hx-target="this" hx-swap="outerHTML">
|
|
<form
|
|
class="form"
|
|
hx-post="/uploads/{{ upload.id }}/edit">
|
|
<input type="hidden" name="token" value="{{ token }}" />
|
|
<label for="filename">Filename</label>
|
|
<input
|
|
class="field"
|
|
type="text"
|
|
id="filename"
|
|
name="filename"
|
|
value="{{ upload.filename }}"
|
|
autofocus
|
|
required />
|
|
<div class="checkbox">
|
|
<input
|
|
type="checkbox"
|
|
name="public"
|
|
id="public"
|
|
{% if upload.public %}checked{% endif %} />
|
|
<label for="public">Download is publicly accessible (no need to sign in to download)</label>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-4">
|
|
<div>
|
|
<div class="checkbox">
|
|
<input
|
|
type="checkbox"
|
|
name="limit_check"
|
|
id="limit_check"
|
|
{% if upload.limit is number %}checked{% endif %} />
|
|
<label for="limit_check">Limit downloads</label>
|
|
</div>
|
|
<input
|
|
class="field"
|
|
type="number"
|
|
min="0"
|
|
id="limit"
|
|
name="limit"
|
|
value="{% if upload.limit is number %}{{ upload.limit }}{% else %}0{% endif %}"
|
|
{% if upload.limit is not number %}disabled{% endif %} />
|
|
</div>
|
|
<div>
|
|
<div class="checkbox">
|
|
<input
|
|
type="checkbox"
|
|
name="expiry_check"
|
|
id="expiry_check"
|
|
{% if upload.expiry_date %}checked{% endif %} />
|
|
<label for="expiry_check">Expiry date</label>
|
|
</div>
|
|
<input
|
|
class="field"
|
|
type="date"
|
|
id="expiry_date"
|
|
name="expiry_date"
|
|
{% if upload.expiry_date %}
|
|
value="{{ upload.expiry_date | date(format="[year]-[month]-[day]") }}"
|
|
{% else %}
|
|
value="{{ now | datetime(format="[year]-[month]-[day]") }}"
|
|
{% endif %}
|
|
{% if not upload.expiry_date %}disabled{% endif %} />
|
|
</div>
|
|
<div>
|
|
<div class="checkbox">
|
|
<input
|
|
type="checkbox"
|
|
name="has_password"
|
|
id="has_password"
|
|
{% if has_password %}checked{% endif %} />
|
|
<label for="has_password">Password protect download</label>
|
|
</div>
|
|
{% if has_password %}
|
|
<div class="checkbox">
|
|
<input
|
|
type="checkbox"
|
|
id="change_password" />
|
|
<label for="change_password">Change password</label>
|
|
</div>
|
|
{% endif %}
|
|
<input
|
|
class="grow field"
|
|
type="password"
|
|
id="password"
|
|
name="password"
|
|
placeholder="••••••"
|
|
disabled />
|
|
</div>
|
|
<div>
|
|
<div class="checkbox">
|
|
<input
|
|
type="checkbox"
|
|
name="has_custom_slug"
|
|
id="has_custom_slug"
|
|
{% if upload.custom_slug is string %}checked{% endif %} />
|
|
<label for="has_custom_slug">File has a custom slug</label>
|
|
</div>
|
|
{% include "uploads/edit/slug.html" %}
|
|
</div>
|
|
</div>
|
|
<div class="buttons reverse end mt-2">
|
|
<button
|
|
type="submit"
|
|
class="button">
|
|
Save changes
|
|
</button>
|
|
<button
|
|
class="button hollow"
|
|
onclick="event.preventDefault(); event.target.closest('parcel-modal').closeModal();">
|
|
Cancel
|
|
</button>
|
|
</div>
|
|
<script type="text/javascript">
|
|
(function() {
|
|
const has_password = {{ has_password | tojson | safe }};
|
|
|
|
function limitCheckChange(event) {
|
|
document.getElementById("limit").disabled = !event.target.checked;
|
|
}
|
|
|
|
function expiryCheckChange(event) {
|
|
document.getElementById("expiry_date").disabled = !event.target.checked;
|
|
}
|
|
|
|
function hasPasswordChange(event) {
|
|
const password = document.getElementById("password");
|
|
|
|
if (!has_password) {
|
|
if (event.target.checked) {
|
|
password.disabled = false;
|
|
password.required = true;
|
|
} else {
|
|
password.disabled = true;
|
|
password.required = false;
|
|
}
|
|
} else {
|
|
const change_password = document.getElementById("change_password");
|
|
change_password.disabled = !event.target.checked;
|
|
}
|
|
}
|
|
|
|
function changePasswordChange(event) {
|
|
document.getElementById("password").disabled = !event.target.checked;
|
|
}
|
|
|
|
function hasCustomSlugChange(event) {
|
|
document.getElementById("custom_slug").disabled = !event.target.checked;
|
|
}
|
|
|
|
document.getElementById("limit_check").addEventListener("change", limitCheckChange);
|
|
document.getElementById("expiry_check").addEventListener("change", expiryCheckChange);
|
|
document.getElementById("has_password").addEventListener("change", hasPasswordChange);
|
|
|
|
if (has_password) {
|
|
document.getElementById("change_password").addEventListener("change", changePasswordChange);
|
|
}
|
|
|
|
document.getElementById("has_custom_slug").addEventListener("change", hasCustomSlugChange);
|
|
})();
|
|
</script>
|
|
</form>
|
|
</parcel-modal>
|