{{template "header" .}}

<div class="page-header">
    <div class="page-header-title">
        <h1>{{if .Data.IsNew}}Neuer Eintrag{{else}}Eintrag bearbeiten{{end}}</h1>
        {{if not .Data.IsNew}}<span class="help"><code>{{.Data.Entry.Slug}}</code> · Fassung {{.Data.Entry.Version}}</span>{{end}}
    </div>
</div>

<div class="card">
    {{/* data-unsaved: Rückfrage beim Verlassen mit ungespeicherten
         Änderungen (static/unsaved.js). data-shortcut-save:
         Strg+Enter speichert (static/shortcuts.js). */}}
    <form method="POST" class="form"
          action="{{if .Data.IsNew}}/p/{{.Project.Slug}}/save{{else}}/p/{{.Project.Slug}}/e/{{.Data.Entry.Slug}}/save{{end}}"
          data-preview-url="/p/{{.Project.Slug}}/preview"
          data-unsaved data-shortcut-save>
        <input type="hidden" name="csrf_token" value="{{.CSRFToken}}">

        {{/* Die Fassung wandert unverändert durchs Formular und zurück. Hat jemand
             anderes den Eintrag zwischenzeitlich geändert, erkennt der Server das
             und meldet einen Konflikt, statt die fremde Änderung zu überschreiben. */}}
        <input type="hidden" name="version" value="{{.Data.Entry.Version}}">

        <div class="field long">
            <label for="title">Titel</label>
            {{if .Data.IsNew}}
            {{/* Beim Tippen: Gibt es schon einen ähnlichen Eintrag? Dieselbe
                 Prüfung wie bei "remember" über MCP, hier nur als Hinweis
                 (static/similar.js). */}}
            <input type="text" id="title" name="title" value="{{.Data.Entry.Title}}" required autofocus
                   data-similar-url="/p/{{.Project.Slug}}/entries/similar" autocomplete="off">
            <div class="similar-hint" data-similar-list hidden aria-live="polite">
                <span class="help">Gibt es schon? Lieber den vorhandenen Eintrag fortschreiben, statt einen zweiten daneben zu legen:</span>
                <ul></ul>
            </div>
            {{else}}
            <input type="text" id="title" name="title" value="{{.Data.Entry.Title}}" required autofocus>
            {{end}}
        </div>

        {{if .Data.IsNew}}
        <div class="field short">
            <label for="slug">Bezeichner</label>
            <span class="help">Leer lassen, um ihn aus dem Titel abzuleiten.</span>
            <input type="text" id="slug" name="slug" pattern="[a-z0-9][a-z0-9_-]*"
                   value="{{.Data.Entry.Slug}}" placeholder="wird-abgeleitet" autocomplete="off">
        </div>
        {{else}}
        <input type="hidden" name="slug" value="{{.Data.Entry.Slug}}">
        {{end}}

        <div class="field medium">
            <label for="tags">Schlagworte</label>
            <span class="help">Durch Komma getrennt.</span>
            <input type="text" id="tags" name="tags" value="{{.Data.TagsIn}}" placeholder="ops, deployment">
        </div>

        <div class="field" data-editor>
            <label for="content">Inhalt {{template "helplink" "weboberflaeche#markdown-im-inhalt"}}</label>
            <span class="help">Markdown. <code>[[bezeichner]]</code> verweist auf einen anderen Eintrag.</span>

            {{/* Ohne JavaScript bleibt einfach der erste Reiter aktiv — das
                 Formular funktioniert dann genau wie vorher, nur ohne
                 Vorschau-Knopf-Wirkung. Kein <noscript>-Sonderfall nötig. */}}
            <div class="editor-tabs" role="tablist">
                <button type="button" class="editor-tab active"
                        data-editor-tab="write" role="tab" aria-selected="true">Schreiben</button>
                <button type="button" class="editor-tab"
                        data-editor-tab="preview" role="tab" aria-selected="false">Vorschau</button>
            </div>

            <textarea id="content" name="content" rows="24" spellcheck="true"
                      data-editor-panel="write"
                      data-suggest-url="/p/{{.Project.Slug}}/entries/suggest">{{.Data.Entry.Content}}</textarea>
            {{/* Erscheint nur, während "[[" getippt und noch nicht mit "]]"
                 geschlossen wurde — siehe static/autocomplete.js. */}}
            <ul class="autocomplete" data-autocomplete hidden></ul>
            <div class="entry-text preview-area" data-editor-panel="preview" hidden></div>
        </div>

        <div class="field checkbox">
            <input type="checkbox" id="curated" name="curated" value="1" {{if .Data.Entry.Curated}}checked{{end}}>
            <label for="curated">
                Kuratiert
                <span class="help">Geprüftes Wissen, keine Beobachtung eines Agenten.</span>
            </label>
        </div>

        <div class="form-actions">
            <button type="submit" title="Speichern (Strg+Enter)" aria-keyshortcuts="Control+Enter Meta+Enter">Speichern</button>
            <a class="button secondary"
               href="{{if .Data.IsNew}}/p/{{.Project.Slug}}/{{else}}/p/{{.Project.Slug}}/e/{{.Data.Entry.Slug}}{{end}}">Abbrechen</a>
        </div>
    </form>
</div>

{{template "footer" .}}