@using Dynamicweb.Frontend
@using System.Reflection
@using Dynamicweb.Content.Items
@using System.Web.UI.HtmlControls
@using Dynamicweb.Rapido.Blocks.Components
@using Dynamicweb.Rapido.Blocks




@* Components for the articles - Remeber to make a NZ copy of this template - and change line NZheader.cshtml to @Include("NZHeader.cshtml") *@
@Include("Articles/Banner.cshtml")
@Include("Articles/NZHeader.cshtml")
@Include("Articles/BodyRow.cshtml")
@Include("Articles/Image.cshtml")
@Include("Articles/SubHeader.cshtml")
@Include("Articles/Text.cshtml")
@Include("Articles/NZQuote.cshtml")
@Include("Articles/InfoTable.cshtml")
@Include("Articles/GalleryModal.cshtml")
@Include("Articles/NZRelated.cshtml")
@Include("Articles/Menu.cshtml")
@Include("Articles/List.cshtml")
@Include("Articles/Summary.cshtml")
@Include("Articles/ListCategoryFilter.cshtml")
@Include("Articles/ListFilter.cshtml")
@Include("Articles/ListSearch.cshtml")
@Include("Articles/ListNoResultsInfo.cshtml")
@Include("Articles/ListItem.cshtml")
@Include("Articles/AuthorAndDate.cshtml")
@Include("Articles/Link.cshtml")
@Include("Articles/Carousel.cshtml")
@Include("Articles/Video.cshtml")

@if (PageView.Current().Page.ID != 10)
  {
  <text>@Include("Articles/NZArticleSchemaMarkup.cshtml")</text>
  }


@* Simple helpers *@@*Requires the Gallery ItemType that comes with Rapido*@

@helper RenderArticleItemGallery(IList<ItemViewModel> gallery)
  {
  if (gallery != null && gallery.Count > 0)
    {
    int count = 1;

    foreach (var item in gallery)
      {
      if (item.GetFile("ImagePath") != null)
        {
        string image = item.GetFile("ImagePath").PathUrlEncoded;
        string imagePrefix = "/Admin/Public/GetImage.ashx?width=1200&amp;height=820&amp;crop=5&amp;Compression=75&amp;DoNotUpscale=1&amp;image=";
        int imagesCount = gallery.Count;
        if (count == 1)
          {
          <label class="gallery" for="GalleryModalTrigger" onclick="Gallery.openImage(this.querySelector('.js-gallery'))">
            <span class="gallery__main-image">
              <img src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=992&amp;height=760&amp;crop=0&amp;Compression=75&amp;DoNotUpscale=1&amp;image=@image" class="b-lazy flex-img js-gallery" alt="" data-for="FullImage" data-image="@imagePrefix@image" />
            </span>
            <span class="gallery__image-counter">
              <i class="fas fa-camera fa-2x"></i> <span class="gallery__image-counter__number">@imagesCount</span>
              <span class="gallery__image-counter__text">@Translate("See all") <i class="fas fa-angle-right"></i></span>
            </span>
          </label>
          }
        else
          {
          <div class="u-hidden js-gallery" data-for="FullImage" data-image="@imagePrefix@image"></div>
          }

        count++;
        }
      }
    }
}

@helper RenderArticleItemGalleryModal()
  {
  <!-- Trigger for the gallery modal -->
  <input type="checkbox" id="GalleryModalTrigger" class="modal-trigger" />

  <!-- Gallery modal -->
  <div class="modal-container">
    <label for="GalleryModalTrigger" id="GalleryModalOverlay" class="modal-overlay"></label>
    <div class="modal modal--full" id="GalleryModal">
      <div class="modal__body modal__body--full">
        <div class="gallery-slider">
          <div class="gallery-slider__image">
            <img src="#" alt="" class="modal--full__img" id="FullImage" />
          </div>
          <div class="gallery-slider__image-counter" id="FullImage_counter"></div>
          <label class="gallery-slider__close-btn" for="GalleryModalTrigger"></label>
          <button class="gallery-slider__previous-btn" id="FullImage_prev" onclick="Gallery.prevImage('FullImage')"></button>
          <button class="gallery-slider__next-btn" id="FullImage_next" onclick="Gallery.nextImage('FullImage')"></button>
        </div>
      </div>
    </div>
  </div>
}


@helper RenderMobileFilters(List<Block> subBlocks)
  {
  if (subBlocks.Count > 0)
    {
    <div class="grid__col-12">
      <input type="checkbox" id="CheckFilters" class="js-remember-state u-hidden" data-expand="CheckFilters" />
      <div class="grid u-margin-bottom dw-mod" data-trigger="CheckFilters">
        @RenderBlockList(subBlocks)
      </div>
      <label for="CheckFilters" class="btn btn--secondary btn--full dw-mod js-expand-hide" data-trigger="CheckFilters">@Translate("Select filters")</label>
      <label for="CheckFilters" class="btn btn--secondary btn--full dw-mod expandable--collapsed" data-trigger="CheckFilters">@Translate("Close filters")</label>
    </div>
    }
}