<dl class="portlet extendedCollectionPortlet"
    i18n:domain="plone"
    tal:define="collection_url view/collection_url;
                plone_view context/@@plone;
                toLocalizedTime nocall:plone_view/toLocalizedTime;
                viewActions here/portal_properties/site_properties/typesUseViewActionInListings|python:();
                getIcon nocall:plone_view/getIcon;">

  <dt class="portletHeader">
    <span class="portletTopLeft"></span>
    <a tal:attributes="href collection_url"
        tal:omit-tag="not:view/data/show_more">
      <span tal:content="view/data/header" /><span tal:define="collection_description python: view.collection().Description()" tal:condition="collection_description" class="collection_description" tal:content="python: '&nbsp;&nbsp;' + view.collection().Description()" />
    </a>
    <span class="portletTopRight"></span>
  </dt>
  <tal:events tal:repeat="obj view/results">
    <dd class="portletItem"
        tal:define="
          oddrow repeat/obj/odd;
          useView python:obj.portal_type in viewActions;
          itemUrl python:useView and obj.getURL() + '/view' or obj.getURL();
          item_icon python:getIcon(obj);
          type obj/Type;
          isEvent python: type == 'Event';
          "
        tal:attributes="
          class python:oddrow and 'portletItem even' or 'portletItem odd'">
      <a href="#"
         class="tile"
         tal:define="item_has_leadimage obj/hasContentLeadImage"
         tal:attributes="href itemUrl;
                         title obj/Description">
        <div class="extendedCollectionImage"
            tal:define="itemObj python:obj.getObject()">

          <div id="formatted-date"
              tal:define="
                startdate itemObj/startDate | nothing;
                months python: ['Jan', 'Feb', 'Mar', 'Apr', 'Mei', 'Jun',
                                'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec']"
              tal:condition="python: isEvent and startdate">
            <div class="month"
                tal:content="python: months[int(startdate.strftime('%m')) - 1]"
                >Aug</div>
            <div class="day"
                tal:content="startdate/day">24</div>
          </div>

          <img src="" alt=""
              tal:condition="exists:itemObj/image_preview"
              tal:replace="structure python: path('nocall:itemObj/tag')(scale='preview', css_class='relatedImage')" />
          <img src="" alt="" class="relatedImage"
              tal:condition="item_has_leadimage"
              tal:attributes="src python:obj.getURL() + '/leadImage_preview'" />
          <img class="play-button"
              tal:define="searchview context/@@laboral_searchview;"
              src=""
              tal:replace="structure here/play-button-small.png"
              tal:condition="python:searchview.isVideo(obj.getObject())"
              src="" alt="play video"/>
        </div>
        <div class="visualClear"></div>

        <div class="infoWrapper">

          <div class="thema-tag"
              tal:define="
                  tagInfo python: context.restrictedTraverse('virtualTreeTag').tag(obj.Subject);
                  "
              tal:condition="tagInfo">
            <span tal:define="
                  tagId tagInfo/id;
                  tagTitle tagInfo/title;
                  "
                tal:attributes="class string:tag-${tagId}"
                tal:content="tagTitle">
              Tag
            </span>
          </div>

          <div class="news-date"
              tal:define="date obj/Date | nothing"
              tal:condition="python: not isEvent and date">
            <span
                tal:content="python:toLocalizedTime(obj.Date)">
              Date
            </span>
          </div>

          <div class="visualClear"></div>
          <h2 class="tileHeadline"
              tal:content="obj/pretty_title_or_id">
            Title
          </h2>
          <div class="visualClear"></div>
          <p class="description"
              tal:define="description obj/Description | nothing"
              tal:condition="description"
              tal:content="python:view.trimDescription(description, 250)">
            Description text, or "samenvatting"
          </p>

        </div>
      </a>
    <div class="visualClear"></div>
    </dd>
  </tal:events>

  <dd class="portletFooter" tal:condition="view/data/show_more">
      <span class="portletBottomLeft"></span>
      <span>
      <a tal:attributes="href collection_url" i18n:translate="more_url">
           More&hellip;
           </a>
      </span>
      <span class="portletBottomRight"></span>
  </dd>

</dl>
