{{ define "page:content" }}

{{ $fields_present := false }}
{{ if (gt (len (index .item.FieldsSection "fields"))  0) }}
{{ $fields_present = true }}
{{ end }}

{{ $shares_present := false }}
{{ if (gt (len (index .item.FieldsSection "fields"))  0) }}
  {{ $shares_present = true }}
{{ end }}

<form method="POST" hx-post="{{.formAction}}"  hx-target="{{.formTarget}}">
<div class="page-container">
  <div class="tab-bar">
    <a class="active tab-button" onclick="bm_open_tab(this, 'tab-button', 'tab', 'general')">General</a>
    {{ if $fields_present }}
    <a class="tab-button" onclick="bm_open_tab(this, 'tab-button', 'tab', 'fields')">Fields</a>
    {{ end }}
    <a class="tab-button" onclick="bm_open_tab(this, 'tab-button', 'tab', 'relationsSection')">Relations</a>
    <a class="tab-button" onclick="bm_open_tab(this, 'tab-button', 'tab', 'sharesSection')">Shares</a>
  </div>

  <div id="general" class="tab" style="display: block">
    <div class="row">
      <div class="col s12 m6 l6">
        <p>
          <label for="item-title">Title</label>
          <input name="Title" id="item-title" type="text" value="{{.item.Title}}" />
        </p>
        <p>
          {{ widget_select "Type_id" "Type" .item.Type_id .types `style="width: 100%"` }}
        </p>
      </div>
      <div class="col s12 m6 l6">
        <p>
          {{ widget_checkboxes "Notebooks" "Notebooks" .item.Notebooks .notebooks `` }}
        </p>
      </div>
    </div>

    <div id="fields-general">
      {{ template "items:fields" (map "FieldsSection" .item.FieldsSection "FieldsValues" .item.FieldsValues "uisection" "general")}}
    </div>

    {{ if eq .item.Type_show_summary 1}}
    <p>
      <label for="item-summary">Summary</label>
      <textarea name="Summary" id="item-summary" type="text" rows="5">{{.item.Summary}}</textarea>
    </p>
    {{ end }}

    {{ if eq .item.Type_show_description 1}}
    <p>
      <label for="item-description">Description</label>
      <textarea name="Description" id="item-description" rows="10">{{.item.Description}}</textarea>
    </p>
    {{ end }}
    <div class="row">
      <div class="col m6 s12">
        <p>
          <label for="item-tags">Tags</label>
          <input name="Tags" id="item-tags" type="text" value="{{.item.Tags}}" />
        </p>   
      </div>
      <div class="col m6 s12">
        <p>
          {{ widget_slim_select "Categories" "Categories" .item.Categories .categories `multiple="true"` }}
        </p>
      </div>
    </div>

    <p>
      {{ widget_checkbox "On_dashboard" "On dashboard" "1" .item.On_dashboard }}
    </p>
  </div>

  {{ if $fields_present }}
  <div class="tab" id="fields" style="display: none">
    <div id="fields-fields">
    {{ template "items:fields" (map "FieldsSection" .item.FieldsSection "FieldsValues" .item.FieldsValues "uisection" "fields")}}
    </div>
  </div>
  {{ end }}

  <div class="tab" id="relationsSection" style="display: none">
    <fieldset  style="margin-top: 10px;">
      <legend>Related items</legend>
      <div id="relations" style="margin-top: 8px;">
        {{ template "item:relations" . }}
      </div>
     </fieldset>
    <fieldset style="margin-top: 8px;">
      <legend>Add items</legend>
      <div class="row">
          <div class="col l6 m9 s10">
            <input id="search-item-relation" name="SearchText" type="text" value="" placeholder="Search" hx-get="/items/search-for-relations/{{.item.Id}}" hx-trigger="search-item-relation, keyup changed delay:1s" hx-vals="js:{SearchText: document.getElementById('search-item-relation').value}" hx-target="#items-list-for-relations"/>
          </div>
          <div class="col l6 m3 s1" style="padding-left: 10px;">
            <a class="button main" hx-vals="js:{SearchText: document.getElementById('search-item-relation').value}" hx-target="#items-list-for-relations" hx-get="/items/search-for-relations/{{.item.Id}}"><i class="bi bi-search"></i><span class="hide-xsmall"> Find</span></a>
          </div>
      </div>
      <div id="items-list-for-relations" style="margin-top:10px">
      </div>
     </fieldset>
  </div>

  {{ if $shares_present }}
    <div class="tab" id="shares" style="display: none">
      <div id="shares">
        {{ template "items:fields" (map "FieldsSection" .item.FieldsSection "FieldsValues" .item.FieldsValues "uisection" "fields")}}
      </div>
    </div>
  {{ end }}
</div>

  <div id="footer-navbar">
      <button type="submit" class="main" title="Save"><i class="bi bi-floppy"></i><span>Save</span></button>
    {{ if not (eq .item.Id 0) }}
      <a class="button secondary hide-xsmall" href="/item/view/{{.item.Id}}" hx-get="/item/view/{{.item.Id}}" hx-target="body" hx-swap="beforeend"><i class="bi bi-binoculars"></i><span>View</span></a>
      <a class="button secondary hide-medium hide-large" href="/item/read/{{.item.Id}}" hx-get="/item/read/{{.item.Id}}" hx-push-url="true" hx-target="#page-content"><i class="bi bi-binoculars"></i><span>View</span></a>
      <a class="button delete" hx-delete="/item/delete/{{.item.Id}}"  hx-target="#page-content"  hx-trigger="confirmed"  onClick="bm_show_confirm_delete(this, 'Items', 'Delete this item ?')"  title="Delete"><i class="bi bi-trash"></i><span>Delete</span></a>
      <a class="button secondary" href="#" hx-target="body" hx-swap="beforeend" hx-get="/item/share/{{.item.Id}}" title="Share"><i class="bi bi-share-fill"></i><span>Share</span></a>
    {{ end }}
      <a class="button secondary" onclick="history.back()" ><i class="bi bi-arrow-left-circle"></i><span>Back</span></a>
    </div>
</form>
{{ end }}