camper/web/templates/admin/media/picker.gohtml

62 lines
2.6 KiB
Plaintext

<!--
SPDX-FileCopyrightText: 2023 jordi fita mas <jordi@tandem.blog>
SPDX-License-Identifier: AGPL-3.0-only
-->
<dialog class="media-picker">
{{- /*gotype: dev.tandem.ws/tandem/camper/pkg/media.mediaPicker*/ -}}
<header>
<h3>{{( pgettext "Media Picker" "title" )}}</h3>
</header>
<form id="mediaPickerUpload" enctype="multipart/form-data" action="/admin/media" method="post"
data-hx-boost="true" data-hx-push-url="false">
{{ CSRFInput }}
{{ with .Field -}}
<input type="hidden" name="name" value="{{ .Name }}"/>
<input type="hidden" name="label" value="{{ .Label }}"/>
<input type="hidden" name="prompt" value="{{ .Prompt }}"/>
{{- end }}
<fieldset>
<legend>{{( pgettext "Upload New Media" "title" )}}</legend>
{{ with .File -}}
<label>
{{( pgettext "File" "input" )}}
<input type="file" name="{{ .Name }}"
required {{ template "error-attrs" . }}><br>
</label>
<p>{{ printf (gettext "Maximum upload file size: %s") (.MaxSize | humanizeBytes) }}</p>
{{ template "error-message" . }}
{{- end }}
</fieldset>
<footer>
<button name="picker" type="submit">{{( pgettext "Upload" "action" )}}</button>
<progress value="0" max="100"></progress>
</footer>
</form>
<script>camperUploadForm(document.getElementById('mediaPickerUpload'))</script>
<form action="/admin/media/field" method="get" data-hx-boost="true" data-hx-push-url="false">
{{ with .Field -}}
<input type="hidden" name="name" value="{{ .Name }}"/>
<input type="hidden" name="label" value="{{ .Label }}"/>
<input type="hidden" name="prompt" value="{{ .Prompt }}"/>
{{- end }}
{{ if .Media -}}
<fieldset>
<legend>{{( pgettext "Choose Existing Media" "title" )}}</legend>
<ul class="media-grid">
{{ range .Media -}}
<li>
<button name="value" value="{{ .ID }}" type="submit"><img src="{{ .Path }}" alt="">
</button>
</li>
{{- end }}
</ul>
</fieldset>
{{ else -}}
<p>{{( gettext "No media uploaded yet." )}}</p>
{{- end }}
<footer>
<button name="value" value="{{ .Field.Val }}" type="submit">{{( pgettext "Cancel" "action" )}}</button>
</footer>
</form>
</dialog>