myWebLog/src/admin-theme/post-edit.liquid

<h2 class="my-3">{{ page_title }}</h2>
<article>
  <form action="{{ "admin/post/save" | relative_link }}" method="post" hx-push-url="true">
    <input type="hidden" name="{{ csrf.form_field_name }}" value="{{ csrf.request_token }}">
    <input type="hidden" name="PostId" value="{{ model.post_id }}">
    <div class="container">
      <div class="row mb-3">
        <div class="col-12 col-lg-9">
          {%- assign entity = "post" -%}
          {%- assign entity_id = model.post_id -%}
          {% include_template "_edit-common" %}
          <div class="form-floating pb-3">
            <input type="text" name="Tags" id="tags" class="form-control" placeholder="Tags"
                   value="{{ model.tags }}">
            <label for="tags">Tags</label>
            <div class="form-text">comma-delimited</div>
          </div>
          {% if model.status == "Draft" %}
            <div class="form-check form-switch pb-2">
              <input type="checkbox" name="DoPublish" id="doPublish" class="form-check-input" value="true">
              <label for="doPublish" class="form-check-label">Publish This Post</label>
            </div>
          {% endif %}
          <button type="submit" class="btn btn-primary pb-2">Save Changes</button>
          <hr class="mb-3">
          <fieldset class="mb-3">
            <legend>
              <span class="form-check form-switch">
                <small>
                  <input type="checkbox" name="IsEpisode" id="isEpisode" class="form-check-input" value="true"
                         data-bs-toggle="collapse" data-bs-target="#episodeItems" onclick="Admin.toggleEpisodeFields()"
                         {%- if model.is_episode %} checked="checked"{% endif %}>
                </small>
                <label for="isEpisode">Podcast Episode</label>
              </span>
            </legend>
            <div id="episodeItems" class="container p-0 collapse{% if model.is_episode %} show{% endif %}">
              <div class="row">
                <div class="col-12 col-md-8 pb-3">
                  <div class="form-floating">
                    <input type="text" name="Media" id="media" class="form-control" placeholder="Media" required
                           value="{{ model.media }}">
                    <label for="media">Media File</label>
                    <div class="form-text">
                      Relative URL will be appended to base media path (if set) or served from this web log
                    </div>
                  </div>
                </div>
                <div class="col-12 col-md-4 pb-3">
                  <div class="form-floating">
                    <input type="text" name="MediaType" id="mediaType" class="form-control" placeholder="Media Type"
                           value="{{ model.media_type }}">
                    <label for="mediaType">Media MIME Type</label>
                    <div class="form-text">Optional; overrides podcast default</div>
                  </div>
                </div>
              </div>
              <div class="row pb-3">
                <div class="col">
                  <div class="form-floating">
                    <input type="number" name="Length" id="length" class="form-control" placeholder="Length" required
                           value="{{ model.length }}">
                    <label for="length">Media Length (bytes)</label>
                    <div class="form-text">TODO: derive from above file name</div>
                  </div>
                </div>
                <div class="col">
                  <div class="form-floating">
                    <input type="text" name="Duration" id="duration" class="form-control" placeholder="Duration"
                           value="{{ model.duration }}">
                    <label for="duration">Duration</label>
                    <div class="form-text">Recommended; enter in <code>HH:MM:SS</code> format</div>
                  </div>
                </div>
              </div>
              <div class="row pb-3">
                <div class="col">
                  <div class="form-floating">
                    <input type="text" name="Subtitle" id="subtitle" class="form-control" placeholder="Subtitle"
                           value="{{ model.subtitle }}">
                    <label for="subtitle">Subtitle</label>
                    <div class="form-text">Optional; a subtitle for this episode</div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-12 col-md-8 pb-3">
                  <div class="form-floating">
                    <input type="text" name="ImageUrl" id="imageUrl" class="form-control" placeholder="Image URL"
                           value="{{ model.image_url }}">
                    <label for="imageUrl">Image URL</label>
                    <div class="form-text">
                      Optional; overrides podcast default; relative URL served from this web log
                    </div>
                  </div>
                </div>
                <div class="col-12 col-md-4 pb-3">
                  <div class="form-floating">
                    <select name="Explicit" id="explicit" class="form-control">
                      {% for exp_value in explicit_values %}
                        <option value="{{ exp_value[0] }}"
                                {%- if model.explicit == exp_value[0] %} selected="selected"{% endif -%}>
                          {{ exp_value[1] }}
                        </option>
                      {% endfor %}
                    </select>
                    <label for="explicit">Explicit Rating</label>
                    <div class="form-text">Optional; overrides podcast default</div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-12 col-md-8 pb-3">
                  <div class="form-floating">
                    <input type="text" name="ChapterFile" id="chapterFile" class="form-control"
                           placeholder="Chapter File" value="{{ model.chapter_file }}">
                    <label for="chapterFile">Chapter File</label>
                    <div class="form-text">Optional; relative URL served from this web log</div>
                  </div>
                </div>
                <div class="col-12 col-md-4 pb-3">
                  <div class="form-floating">
                    <input type="text" name="ChapterType" id="chapterType" class="form-control"
                           placeholder="Chapter Type" value="{{ model.chapter_type }}">
                    <label for="chapterType">Chapter MIME Type</label>
                    <div class="form-text">
                      Optional; <code>application/json+chapters</code> assumed if chapter file ends with
                      <code>.json</code>
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-12 col-md-8 pb-3">
                  <div class="form-floating">
                    <input type="text" name="TranscriptUrl" id="transcriptUrl" class="form-control"
                           placeholder="Transcript URL" value="{{ model.transcript_url }}"
                           onkeyup="Admin.requireTranscriptType()">
                    <label for="transcriptUrl">Transcript URL</label>
                    <div class="form-text">Optional; relative URL served from this web log</div>
                  </div>
                </div>
                <div class="col-12 col-md-4 pb-3">
                  <div class="form-floating">
                    <input type="text" name="TranscriptType" id="transcriptType" class="form-control"
                           placeholder="Transcript Type" value="{{ model.transcript_type }}"
                           {%- if model.transcript_url != "" %} required{% endif %}>
                    <label for="transcriptType">Transcript MIME Type</label>
                    <div class="form-text">Required if transcript URL provided</div>
                  </div>
                </div>
              </div>
              <div class="row pb-3">
                <div class="col">
                  <div class="form-floating">
                    <input type="text" name="TranscriptLang" id="transcriptLang" class="form-control"
                           placeholder="Transcript Language" value="{{ model.transcript_lang }}">
                    <label for="transcriptLang">Transcript Language</label>
                    <div class="form-text">Optional; overrides podcast default</div>
                  </div>
                </div>
                <div class="col d-flex justify-content-center">
                  <div class="form-check form-switch align-self-center pb-3">
                    <input type="checkbox" name="TranscriptCaptions" id="transcriptCaptions" class="form-check-input"
                           value="true" {% if model.transcript_captions %} checked="checked"{% endif %}>
                    <label for="transcriptCaptions">This is a captions file</label>
                  </div>
                </div>
              </div>
              <div class="row pb-3">
                <div class="col col-md-4">
                  <div class="form-floating">
                    <input type="number" name="SeasonNumber" id="seasonNumber" class="form-control"
                           placeholder="Season Number" value="{{ model.season_number }}">
                    <label for="seasonNumber">Season Number</label>
                    <div class="form-text">Optional</div>
                  </div>
                </div>
                <div class="col col-md-8">
                  <div class="form-floating">
                    <input type="text" name="SeasonDescription" id="seasonDescription" class="form-control"
                           placeholder="Season Description" maxlength="128" value="{{ model.season_description }}">
                    <label for="seasonDescription">Season Description</label>
                    <div class="form-text">Optional</div>
                  </div>
                </div>
              </div>
              <div class="row pb-3">
                <div class="col col-md-4">
                  <div class="form-floating">
                    <input type="number" name="EpisodeNumber" id="episodeNumber" class="form-control" step="0.01"
                           placeholder="Episode Number" value="{{ model.episode_number }}">
                    <label for="episodeNumber">Episode Number</label>
                    <div class="form-text">Optional; up to 2 decimal points</div>
                  </div>
                </div>
                <div class="col col-md-8">
                  <div class="form-floating">
                    <input type="text" name="EpisodeDescription" id="episodeDescription" class="form-control"
                           placeholder="Episode Description" maxlength="128" value="{{ model.episode_description }}">
                    <label for="episodeDescription">Episode Description</label>
                    <div class="form-text">Optional</div>
                  </div>
                </div>
              </div>
            </div>
            <script>
              document.addEventListener("DOMContentLoaded", () => Admin.toggleEpisodeFields())
            </script>
          </fieldset>
          <fieldset class="pb-3">
            <legend>
              Metadata
              <button type="button" class="btn btn-sm btn-secondary" data-bs-toggle="collapse"
                      data-bs-target="#metaItemContainer">
                show
              </button>
            </legend>
            <div id="metaItemContainer" class="collapse">
              <div id="metaItems" class="container">
                {%- for meta in metadata %}
                  <div id="meta_{{ meta[0] }}" class="row mb-3">
                    <div class="col-1 text-center align-self-center">
                      <button type="button" class="btn btn-sm btn-danger" onclick="Admin.removeMetaItem({{ meta[0] }})">
                        &minus;
                      </button>
                    </div>
                    <div class="col-3">
                      <div class="form-floating">
                        <input type="text" name="MetaNames" id="metaNames_{{ meta[0] }}" class="form-control"
                               placeholder="Name" value="{{ meta[1] }}">
                        <label for="metaNames_{{ meta[0] }}">Name</label>
                      </div>
                    </div>
                    <div class="col-8">
                      <div class="form-floating">
                        <input type="text" name="MetaValues" id="metaValues_{{ meta[0] }}" class="form-control"
                               placeholder="Value" value="{{ meta[2] }}">
                        <label for="metaValues_{{ meta[0] }}">Value</label>
                      </div>
                    </div>
                  </div>
                {% endfor -%}
              </div>
              <button type="button" class="btn btn-sm btn-secondary" onclick="Admin.addMetaItem()">Add an Item</button>
              <script>
                document.addEventListener("DOMContentLoaded", () => Admin.setNextMetaIndex({{ metadata | size }}))
              </script>
            </div>
          </fieldset>
          {% if model.status == "Published" %}
            <fieldset class="pb-3">
              <legend>Maintenance</legend>
              <div class="container">
                <div class="row">
                  <div class="col align-self-center">
                    <div class="form-check form-switch pb-2">
                      <input type="checkbox" name="SetPublished" id="setPublished" class="form-check-input"
                             value="true">
                      <label for="setPublished" class="form-check-label">Set Published Date</label>
                    </div>
                  </div>
                  <div class="col-4">
                    <div class="form-floating">
                      <input type="datetime-local" name="PubOverride" id="pubOverride" class="form-control"
                             placeholder="Override Date"
                             {%- if model.pub_override -%}
                               value="{{ model.pub_override | date: "yyyy-MM-dd\THH:mm" }}"
                             {%- endif %}>
                      <label for="pubOverride" class="form-label">Published On</label>
                    </div>
                  </div>
                  <div class="col-5 align-self-center">
                    <div class="form-check form-switch pb-2">
                      <input type="checkbox" name="SetUpdated" id="setUpdated" class="form-check-input" value="true">
                      <label for="setUpdated" class="form-check-label">
                        Purge revisions and<br>set as updated date as well
                      </label>
                    </div>
                  </div>
                </div>
              </div>
            </fieldset>
          {% endif %}
        </div>
        <div class="col-12 col-lg-3">
          <div class="form-floating pb-3">
            <select name="Template" id="template" class="form-control">
              {% for tmpl in templates -%}
                <option value="{{ tmpl[0] }}"{% if model.template == tmpl[0] %} selected="selected"{% endif %}>
                  {{ tmpl[1] }}
                </option>
              {%- endfor %}
            </select>
            <label for="template">Post Template</label>
          </div>
          <fieldset>
            <legend>Categories</legend>
            {% for cat in categories %}
              <div class="form-check">
                <input type="checkbox" name="CategoryIds" id="categoryId_{{ cat.id }}" class="form-check-input"
                       value="{{ cat.id }}" {% if model.category_ids contains cat.id %} checked="checked"{% endif %}>
                <label for="categoryId_{{ cat.id }}" class="form-check-label"
                       {%- if cat.description %} title="{{ cat.description.value | strip_html | escape }}"{% endif %}>
                  {%- for it in cat.parent_names %}&nbsp; &rang; &nbsp;{% endfor %}{{ cat.name }}
                </label>
              </div>
            {% endfor %}
          </fieldset>
        </div>
      </div>
    </div>
  </form>
</article>
<script>window.setTimeout(() => Admin.toggleEpisodeFields(), 500)</script>