<%

' (SS,03/04/08) added "If ProductDiscontinued(AProductCode, AProductName)" to ShowHighlightsItem to not show "Buy" button for discontinued/special order products
' (SS,25/06/10) added IsStockAvailable to Sub ShowHighlightsItem 
' (SS,06/07/10) replaced GetProductLink with GetProductLinkWithName for SEO in Sub ShowHighlightsItem
' (SS,19/06/12) hide buy button if no stock Sub ShowHighlightsItem
' (SS,20/05/13) added price per section using CustomShowPricePerSection to Sub ShowHighlightsItem
' (SS,14/08/14) new responsive web design version using Bootstrap
' (SS,01/06/17) change to ShowHighlightsItem to use product list instead and added a horizontal sale banner to ShowProductListItem (see inc-template-product-list.asp) 
' (SS,30/05/18) in ShowHighlightsHeader, added "grid" to last div class to make isotope work
' (SS,18/12/24) fix to Sub ShowHighlightsItem to fix W3C validator complaining about width="100%" height="100%" i.e. didn't like % being used, used class w-100 and h-100 instead

' --- START OF HIGHLIGHT TEMPLATES --- '

' (SS,3/12/15) For SEO changed "Featured Products" to "Featured Cast Iron Radiators"
' (SS,13/11/17) For SEO changed "Featured Cast Iron Radiators" to "Cast Iron Radiators"
' (SS,30/5/18) added grid to last div class to make isotope work
' (SS,17/6/24) new Bootstrap 5 version, i.e. best sellers
Sub ShowHighlightsHeader
%>
    <div class="container">
      <div class="row">  
<%
  ShowSectionHeading "Best selling Cast Iron Radiators &amp; Accessories", ""
End Sub

' (SS,1/6/17) replaced above with following to highlight summer sale, also remove the ribbon and show the prices as in product list, change also made to product list to show a "Summer Saler" banner
Sub ShowHighlightsItem_old(ACount, AProductCode, AProductName, ADescription, ASalePrice, AStdPrice, ANumInStock, ACategory, ASubcategory, AShowCategoryPicture)
 ' ShowProductListItem 100, AProductCode, AProductName, ASalePrice, AStdPrice, ANumInStock, False, False, False, "", "", ""
  ShowProductListItem 100, AProductCode, CustomProductNameWithBreak(AProductName), ASalePrice, AStdPrice, ANumInStock, False, False, False, "", "", ""
End Sub

' (SS,17/6/24) new Bootstrap 5 version
' (SS,18/12/24) fix to fix W3C validator complaining about width="100%" height="100%" i.e. didn't like % being used, used class w-100 and h-100 instead
Sub ShowHighlightsItem(ACount, AProductCode, AProductName, ADescription, ASalePrice, AStdPrice, ANumInStock, ACategory, ASubcategory, AShowCategoryPicture)
  Dim LProductName
  LProductName = AProductName
  
  Dim LReviewRating, LReviewCount
  LReviewRating = GetReviewRatingAndCount(AProductCode, LReviewCount)
  
  Dim LProductID
  LProductID = GetProductIDForProductCode(AProductCode)
  
      '<div class="col-6 col-lg-2 col-md-4 col-sm-6 m-0 p-0">
      '<div class="card m-1 p-1 m-lg-1 p-lg-1 m-md-3 p-md-3 m-sm-3 p-sm-3 rounded-4">

  ' (SS,18/12/24) removed width="100%" height="100%" from img src using % is not allowed and W3C validator complains
  ' helps image centred in smaller widths i.e. mobile, fixed in the end by replacing adding w-100 h-100 to the class
  ' (SS,28/4/25) replaced text-black with bestseller-text (new style) to fit longer text of bundles without overlapping
  ' also changes to adapt slightly for product with per section text and without
  Dim LIsPerSection, LBestsellerTextClass, LHeightEM
  LIsPerSection = ProductOptionExists(LProductID, "Sections")
  If LIsPerSection Then
    LBestsellerTextClass = "bestseller-text-4l"
    LHeightEM = "4.5"
  Else
    LBestsellerTextClass = "bestseller-text-5l"
    LHeightEM = "5.5"
  End If
  
%>
<!-- START OF BEST SELLERS ITEM -->
    <div class="col-6 col-lg-2 col-md-4 col-sm-6 m-0 p-0">
      <div class="card m-1 p-1 m-lg-1 p-lg-1 m-md-3 p-md-3 m-sm-3 p-sm-3 rounded-4">
        <div class="m-1">
          <a href="<%=GetProductLinkWithName(AProductCode, LProductName)%>" title="<%=LProductName%>"><img class="img-thumbnail border-0 w-100 h-100" src="<%=GetProductImageLink(AProductCode, "s")%>" alt="<%=AProductCode%>"></a>
        </div>
        <div class="card-body p-0 text-center">
        
          <div class="d-flex flex-column align-items-start">
            <div class="mx-auto" style="height:<%=LHeightEM%>em;" >
              <p class="card-title m-0 p-1">
              <a href="<%=GetProductLinkWithName(AProductCode, LProductName)%>" class="<%=LBestsellerTextClass%>" style="max-width: 1500px;">
              <%=LProductName%></a>
              </p>
            </div>
<%If LIsPerSection Then%>            
            <div class="mx-auto">
              <p class="my-2 lh-1">
              <strong><span class="text-danger">
              <%=GetProductPriceForProductID(LProductID, False, True)%>
              </span>
              </strong>
              <br>
              <strong>
              <%CustomShowPerSectionText(LProductID)%>&nbsp;
              </strong>
              </p>
            </div>
<%Else%>            
            <div class="mx-auto">
              <p class="my-2 lh-1">
              <strong><span class="text-danger">
              <%=GetProductPriceForProductID(LProductID, False, True)%>
              </span>
              </strong>
              </p>
            </div>
<%End If%>
            
            <div class="mx-auto">
              <a href="<%=GetProductLinkWithName(AProductCode, LProductName)%>" class="btn btn-primary btn-sm mb-1" role="button">More details</a>
              <a href="<%=GetBuyLink(AProductCode)%>" class="btn btn-success btn-sm mb-1" role="button">Buy</a>
            </div>
            
            <div class="mx-auto">
            <%ShowReviewRatingStars LReviewRating, ""
            Response.Write "<small>(" & LReviewCount & ")</small>"
            %>
            </div>
            
          </div>

       </div>
      </div>
    </div>
<!-- END OF BEST SELLERS ITEM -->
<%
End Sub


Sub ShowHighlightsFooter
%>
      </div>
    </div>
<%
End Sub

' --- END OF HIGHLIGHT TEMPLATES --- '


%>