<% include Popup %>
<div class="hero-image-text hero-lg">
    <div class="swiper-container" id="swiper-slideshow-home">
        <div class="swiper-wrapper">
        <% if $Banners %>
            <% loop $Banners %>
                <% if $ClassName = 'BannerImageElement' %>
                    <% if $Up.IsMobile || $Up.IsTablet %>
                        <div class="swiper-slide" data-id="$ID" style="background-image:url('<% if $Top.IsMobile %>{$MobileImage.URL}<% else %>{$Image.URL}<% end_if %>');">
                            <% if $ClickAbleBanner %>
                            <a href="<% if $ClickAbleBannerLink %>{$ClickAbleBannerLink}<% else %>{$ClickAbleBannerInternalLink.Link}<% end_if %>" <% if $ClickAbleBannerLink %>target="_blank"<% end_if %>>
                            <% end_if %>
                                <div class="vcenter-parent">
                                    <div class="vcenter">
                                        <div class="container {$TextColour}">
                                            <% if $First %>
                                                <h1>$BannerTitle</h1>
                                            <% else %>
                                                <h2>$BannerTitle</h2>
                                            <% end_if %>

                                            <% if not $ClickAbleBanner %>
                                                <div class="btn-group">
                                                    <% if $ButtonOneText && $ButtonOneLink %>
                                                        <a class="btn btn-yellow" href="$ButtonOneLink.Link">
                                                            $ButtonOneText
                                                        </a>
                                                    <% end_if %>
                                                    <% if $ButtonTwoText && $ButtonTwoLink %>
                                                        <a class="btn btn-pink" href="$ButtonTwoLink.Link">
                                                            $ButtonTwoText
                                                        </a>
                                                    <% end_if %>
                                                </div>
                                            <% end_if %>
                                        </div>
                                    </div>
                                </div>
                            <% if $ClickAbleBanner %>
                            </a>
                            <% end_if %>
                        </div>
                    <% else %>

                    <div class="swiper-slide" data-id="$ID" style="background-image:url('<% if $Top.IsMobile %>{$MobileImage.URL}<% else %>{$Image.URL}<% end_if %>');">

                        <% if $ClickAbleBanner %>
                        <a href="<% if $ClickAbleBannerLink %>{$ClickAbleBannerLink}<% else %>{$ClickAbleBannerInternalLink.Link}<% end_if %>" <% if $ClickAbleBannerLink %>target="_blank"<% end_if %>>
                        <% end_if %>
                            <div class="vcenter-parent">
                                <div class="vcenter">
                                    <div class="container slide-container {$TextColour}">
                                        <% if $First %>
                                            <h1>$BannerTitle</h1>
                                        <% else %>
                                            <h2>$BannerTitle</h2>
                                        <% end_if %>

                                        <% if not $ClickAbleBanner %>
                                            <div class="btn-group">
                                                <% if $ButtonOneText && $ButtonOneLink %>
                                                    <a class="btn btn-yellow" href="$ButtonOneLink.Link">
                                                        $ButtonOneText
                                                    </a>
                                                <% end_if %>
                                                <% if $ButtonTwoText && $ButtonTwoLink && not $IsMobile %>
                                                    <a class="btn btn-pink" href="$ButtonTwoLink.Link">
                                                        $ButtonTwoText
                                                    </a>
                                                <% end_if %>

                                            </div>
                                        <% end_if %>
                                    </div>
                                </div>
                            </div>
                        <% if $ClickAbleBanner %>
                        </a>
                        <% end_if %>
                    </div>
                <% end_if %>
                <% else %>
                    <% if $ClassName = 'BannerVideoElement' && not $Up.IsMobile && not $Up.IsTablet %>
                    <div class="swiper-slide" data-id="$ID"
                        style="background-image: url(<% if $Image %>$Image.URL<% else %>'http://i.ytimg.com/vi_webp/{$getYouTubeCode}/mqdefault.webp'<% end_if %>);">
                        $SVG('video-play-circle').Size('150','150')
                        <div class="swiper-video-container" data-video="swiper-video-1">
                            <div class="swiper-video" id="swiper-video-1"
                                data-video-src="{$getYouTubeCode}"></div>
                        </div>
                    </div>
                    <% end_if %>
                <% end_if %>
            <% end_loop %>
        <% end_if %>
        </div>

   <!-- If we need navigation buttons -->
   <div class="previous-button"></div>
   <div class="next-button"></div>
 </div>
</div>

<% if not $getRestrictedAccess %>
    <% cache 'HomeFilters' %>
    <div class="show-filters condensed">
        <div class="container">
            <h2>Find a show</h2>

            <form method="get" action="{$ShowPage.Link}">
                <div class="form-group">
                    <input type="text" class="form-control form-search" name="Search"
                           placeholder="Search for a comedian/show">
                </div>
                <div class="form-group search-select">
                    <select class="form-control" name="CategoryID">
                        <option value="0">All categories</option>
                        <% loop $ShowCategories.Sort('Title ASC') %>
                            <option value="{$ID}"
                                    <% if $Top.Filters.CategoryID == $ID %>selected<% end_if %>>$Title</option>
                        <% end_loop %>
                    </select>
                    {$SVG('select-arrow').extraClass('svg-arrow').Width('11').Height('9')}
                </div>
                <div class="form-group">
                    <input type="text" class="form-control form-date" name="StartTime" placeholder="From date">
                </div>
                <div class="form-group">
                    <input type="text" class="form-control form-date" name="EndTime" placeholder="To date">
                </div>
                <button type="submit" class="btn btn-charcoal">Search</button>
            </form>
        </div>
    </div>
    <% end_cache %>

    <% if $TodaysShows %>
    <div class="grid-shows-container">
        <div class="container container-dynamic">
            <div class="grid-shows-title">
                <h2>On today in $Locale.Title </h2>
            </div>
            <div class="grid-shows small-padding">
              <% loop $TodaysShows.Limit(5) %>
              <a class="grid-show small" href="{$Link}">
              <span class="image small-image"
                    style="background-image: url('<% if $PreviewImage %>$PreviewImage.URL<% else %>http://placehold.it/380x285<% end_if %>');"></span>
                  <span class="description">
              <span class="title-small">
                  <% if $BigTitle %>
                      $BigTitle
                  <% else %>
                      $Title
                  <% end_if %>
              </span>
              <span class="subtitle">
                  <% if $SmallTitle %>
                      {$SmallTitle}
                  <% else %>
                      {$Subtitle}
                  <% end_if %>
              </span>
              <%-- <span class="date">
                  $StartDate - $EndDate
              </span> --%>
               <span class="time">
                   {$SessionLocationInformation.TimeDetails}
              </span>
          </span>
              </a>
          <% end_loop %>
        </div>
        <div class="grid-shows-pager small-padding">
            <a class="btn btn-pink" href="find-a-show/?Search=&VenueID=0&CategoryID=0&StartTime=$getStartDate&EndTime=$getStartDate&Sort=Today_Featured_DESC">View all todays shows</a>
        </div>
        </div>
      </div>
    <% end_if %>


    <% cache 'FeaturedShows' %>
    <% if $FeaturedShows %>
        <div class="grid-shows-container">
            <div class="container container-dynamic">
                <div class="grid-shows-title">
                    <h2>Featured $Locale.Title shows</h2>
                </div>
                <div class="grid-shows">

                    <% if $getAdvertising('AdvertisingHomePage') %>
                        <% with $getAdvertising('AdvertisingHomePage') %>
                            <% if $Image %>
                                <a class="grid-show hidden-xs" href="$Link" target="_blank">
                                    <img src="$Image.Fill(380, 461).URL" alt="$Title">
                                </a>
                            <% end_if %>
                        <% end_with %>
                    <% end_if %>

                    <% if $getAdvertising('AdvertisingHomePage') %>
                        <% loop $FeaturedShows.Limit(9) %>
                            <a class="grid-show" href="{$Link}">
                            <span class="image"
                                  style="background-image: url('<% if $PreviewImage %>$PreviewImage.URL<% else %>http://placehold.it/380x285<% end_if %>');"></span>
                                <span class="description">
                                <span class="title">
                                    <% if $BigTitle %>
                                        $BigTitle
                                    <% else %>
                                        $Title
                                    <% end_if %>
                                </span>
                                <span class="subtitle">
                                    <% if $SmallTitle %>
                                        {$SmallTitle}
                                    <% else %>
                                        {$Subtitle}
                                    <% end_if %>
                                </span>
                                <span class="date">
                                    $StartDate - $EndDate
                                </span>
                             <span class="time">
                                 {$SessionLocationInformation.TimeDetails}
                            </span>
                            </span>
                            </a>
                        <% end_loop %>
                    <% else %>
                        <% loop $FeaturedShows.Limit(10) %>
                            <a class="grid-show" href="{$Link}">
                            <span class="image"
                                  style="background-image: url('<% if $PreviewImage %>$PreviewImage.URL<% else %>http://placehold.it/380x285<% end_if %>');"></span>
                                <span class="description">
                            <span class="title">
                                <% if $BigTitle %>
                                    $BigTitle
                                <% else %>
                                    $Title
                                <% end_if %>
                            </span>
                            <span class="subtitle">
                                <% if $SmallTitle %>
                                    {$SmallTitle}
                                <% else %>
                                    {$Subtitle}
                                <% end_if %>
                            </span>
                            <span class="date">
                                $StartDate - $EndDate
                            </span>
                             <span class="time">
                                 {$SessionLocationInformation.TimeDetails}
                            </span>
                        </span>
                            </a>
                        <% end_loop %>
                    <% end_if %>
                    <% if $getAdvertising('AdvertisingHomePage') %>
                        <% with $getAdvertising('AdvertisingHomePage') %>
                            <% if $Image %>
                                <a class="grid-show visible-xs" href="$Link" target="_blank">
                                    <img src="$Image.Fill(380, 461).URL" alt="$Title">
                                </a>
                            <% end_if %>
                        <% end_with %>
                    <% end_if %>
                </div>
                <div class="grid-shows-pager">
                    <a class="btn btn-pink" href="find-a-show/">View all shows</a>
                </div>
            </div>
        </div>
        
    <% end_if %>
    <% end_cache %>
<% end_if %>

<% if ShowSocial %>
<% cache 'SocialFeed' %>
    <% include SocialFeed %>
<% end_cache %>
<% end_if %>
