<metal:page define-macro="master">
  <html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:i18n="http://xml.zope.org/namespaces/i18n"
        xmlns:metal="http://xml.zope.org/namespaces/metal"
        xmlns:tal="http://xml.zope.org/namespaces/tal"
        lang="en"
        xml:lang="en"
        tal:define="
          depth python:int(request.form.get('depth', 0));
          widget_url python: context.widget_url;
          panel_url python: context.panel_url;
        "
        i18n:domain="ploneintranet"
  >
    <body>
      <div id="pat-modal-panel-space">
        <dialog class="large pat-modal-panel"
                id="pat-modal-panel"
                open
        >
          <div class="modal-panel-contents">

            <div class="modal-panel-header">
              <h1 class="modal-panel-title">${view/title}</h1>
            </div>

              <article class="pat-rich">
                <p>${view/description}</p>
              </article>

            <form class="pat-form modal-panel-body pat-inject"
                  action="${panel_url}"
                  method="post"
                  tal:condition="view/up_path"
                  data-pat-inject="
                    source: #pat-modal-panel-space;
                    target: #pat-modal-panel-space;
                  "
            >
              <button class="default pat-button pat-subform pat-inject icon-import"
                 name="path"
                 type="submit"
                 value="${view/up_path}"
                 i18n:translate=""
              >Up one level</button>
              </form>

            <form class="pat-form modal-panel-body pat-inject"
                  action="${widget_url}"
                  method="post"
                  data-pat-inject="
                    source: #${context/id}-wrapper;
                    target: #${context/id}-wrapper;
                  "
            >
              <fieldset class="group ueber-selector">
                <fieldset class="pat-miller-columns">
                  <div class="pat-miller-columns-column-set"
                       id="column-set-${depth}"
                       tal:define="
                         preview nocall:view/preview;
                       "
                  >
                    <a class="pat-scroll assistive-text"
                       href="#miller-column-${depth}"
                       data-pat-scroll="
                  direction: left;
                  trigger: auto;
                  selector: #miller-column-${depth}"
                    >Jump to content</a>
                    <fieldset class="pat-miller-columns-column pat-autosubmit pat-subform pat-inject"
                              id="miller-column-contents-${depth}"
                              data-pat-inject="
                                scroll: top;
                                url: ${panel_url};
                                source: #column-set-${next_depth};
                                target: #miller-column-${next_depth}
                                    &amp;&amp;
                                url: ${panel_url};
                                source: #miller-columns-button-bar;
                                target: #miller-columns-button-bar"
                              tal:define="
                                next_depth python:depth + 1;
                              "
                    >

                      <div class="miller-columns-item-preview"
                           tal:condition="python:preview"
                      >
                        <tal:preview define="
                                       portal_type preview/portal_type|preview/@type;
                                       type_title python:view.type_title(portal_type);
                                       image preview/image/scales/preview|nothing;
                                     ">
                          <h1 class="title">
                            ${preview/Title|type_title}
                          </h1>
                          <figure class="illustration"
                                  tal:condition="image"
                          >
                            <img alt=""
                                 src="${image/download}"
                            />
                          </figure>
                          <p class="description"
                             tal:content="structure preview/Description|preview/description"
                          ></p>
                          <dl class="pat-grid-list">
                            <dt i18n:translate="">
                              Type
                            </dt>
                            <dd>
                              ${type_title}
                            </dd>
                            <dt i18n:translate="">
                              Items
                            </dt>
                            <dd>
                              ${python:len(view.items)}
                            </dd>
                            <!-- <dt>
                              TODO Author?
                          </dt>
                          <dd>
                              Liz Baker
                          </dd> -->
                            <dt i18n:translate="">
                              Created
                            </dt>
                            <dd tal:define="
                                  toLocalizedTime nocall:context/@@plone/toLocalizedTime;
                                  created preview/created;
                                ">
                              ${python:toLocalizedTime(created)}
                            </dd>
                          </dl>
                        </tal:preview>
                      </div>

                      <tal:items repeat="(item, selectable) view/items">
                        <label class="pat-miller-columns-column-item type-${python:view.portal_type_to_icon(portal_type)}"
                               tabindex="0"
                               tal:define="
                                 portal_type item/portal_type;
                               "
                        >
                          ${item/Title}
                          <input name="${python:'preview' if selectable else 'path'}"
                                 type="radio"
                                 value="${item/getPath}"
                          />
                        </label>
                      </tal:items>

                      <input name="depth"
                             type="hidden"
                             value="${next_depth}"
                      />
                      <button class="assistive-text"
                              type="submit"
                      >
                        Update
                      </button>
                    </fieldset>
                    <div class="pat-miller-columns-column-set"
                         id="miller-column-${python:depth + 1}"
                    >
                      <div class="pat-miller-columns-column placeholder">
                        <p hidden>
                          Select a folder or a document above.
                        </p>
                      </div>
                    </div>
                  </div>
                </fieldset>
              </fieldset>

              <div class="pat-button-bar"
                   id="miller-columns-button-bar"
              >
                <button class="default pat-button close-panel"
                        disabled="${python:'disabled' if not view.preview else None}"
                        name="${here/name}"
                        type="submit"
                        value="${view/preview_uid}"
                        i18n:translate=""
                >${view/button_title}</button>

                <button class="pat-button close-panel"
                        type="button"
                        i18n:translate=""
                >Cancel</button>
              </div>

            </form>

          </div>
        </dialog>
      </div>
    </body>
  </html>
</metal:page>
