aeth
/
keiji


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
							{{ define "patch_blogpost_editor" }}
<form hx-patch="/admin/posts" hx-ext="json-enc" hx-target="#response" hx-swap="innerHTML">
{{ end }}

{{ define "post_blogpost_editor" }}
<form hx-post="/admin/posts" hx-ext="json-enc" hx-target="#response" hx-swap="innerHTML">
{{ end }}


{{ define "blogpost_editor" }}
<!DOCTYPE html>
<html lang="en">
    <div class="container-fluid p-2 position-relative"
        style="width: 80vw; max-width: 80%; background-color: rgb(22, 22, 22);">
        <div class="container">
            <div class="row">
                <div class="col-sm"></div>
                <div class="container position-relative">
                    <a style="color: white; height: fit-content; font-size: xx-large; font-weight: bold; font-family: monospace;">Making a New Post</a>
                    <div class="col m-5">
                        {{ if $.Post }}
                            {{ template "post_blogpost_editor" }}
                        {{ else }}
                            {{ template "patch_blogpost_editor" }}
                        {{ end }}
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: larger; font-family: monospace;">
                                <a>Title:</a>
                                <textarea name="title"
                                    style="background-color: rgb(73, 73, 73); color: white;">{{ .Title }}</textarea>
                            </div>
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: larger; font-family: monospace;">
                                <a>Post ID:</a>
                                <textarea name="id"
                                    style="background-color: rgb(73, 73, 73); color: white;">{{ .Ident }}</textarea>
                            </div>
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: larger; font-family: monospace;">
                                <a>Category:</a>
                                <select name="category" class="form-select"
                                    style="background-color: rgb(73, 73, 73); color: white; height: fit-content; font-size: larger; font-family: monospace;">
                                    <option selected>{{ .DefaultTopic }}</option>
                                    {{ range .Topics }}
                                    <option value="{{ . }}">{{ . }}</option>
                                    {{ end }}
                                </select>
                            </div>
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: large; font-family: monospace;">
                                <a>Time of creation:</a>
                                <textarea name="created"
                                    style="background-color: rgb(73, 73, 73); color: white;">{{ .Created }}</textarea>
                            </div>
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: larger; font-family: monospace;">
                                <a>Post Body:</a>
                                <textarea name="body" rows="30" wrap="soft" id="myTextarea"
                                    style="background-color: rgb(73, 73, 73); color: white;">{{ .Body }}</textarea>
                            </div>
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: large; font-family: monospace;">
                                <div class="image-select">
                                    <!-- visible dropdown button -->
                                    <div class="selected" onclick="toggleDropdown(this)">
                                        <span>Select an image</span>
                                    </div>

                                    <!-- dropdown list -->
                                    <div class="options">
                                        {{ range .ImageIds }}
                                        <div class="option" onclick="chooseImage(this, '{{ . }}')">
                                            <img src="/api/v1/images/{{ . }}">
                                            <span>{{ . }}</span>
                                        </div>
                                        {{ end }}
                                    </div>

                                    <!-- REAL select for form submission -->
                                    <select name="imageId" class="real-select" id="imageSelect">
                                        <option value="">Select an image</option>
                                        {{ range .ImageIds }}
                                        <option value="{{ . }}">{{ . }}</option>
                                        {{ end }}
                                    </select>
                                </div>
                                <button
                                    type="button"
                                    hx-on:click="insertSelectedImage()">
                                    Insert Image
                                </button>
                            </div>
                            <div class="row"
                                style="background-color: rgb(22, 22, 22); color: white; height: fit-content; font-size: larger; font-family: monospace;">
                                <button type="submit">Send</button><div id="response"></div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col-sm"></div>
            </div>
        </div>
    </div>
</html>
{{ end }}