<%
' (SS,19/07/18) Added HTMLEncode to ShowSubcategoryListHeader, ShowSubcategoryListItem and ShowSubcategoryListItemWithPicture to prevent XSS
' (SS,05/04/19) Replaced getpic.asp with GetCategoryImageLink and GetSubcategoryImageLink. Removed Sub ShowSubcategoryListItemWithPictureOld.
' (SS,06/06/24) From HyperFlight, refinements for Express Music, moved back to HyperFlight too
' (SS,01/06/26) Bootstrap 5 version (with help from ChatGTP)

' --- START OF SUBCATEGORY LIST TEMPLATES --- '

Const MAX_SUBCATEGORY_LIST_COLUMNS = 3

' (SS,19/7/18) Added HTMLEncode to rendering of ACategory to prevent XSS
' (SS,6/4/19) replaced getpic.asp with GetCategoryImageLink
' (SS,6/6/24) added <div class="grid"> for isotope to sort grid alignment issue for longer subcategory names
' (SS,1/6/26) Bootstrap 5 version
Sub ShowSubcategoryListHeader(ACategory, ACategoryDescription, AShowCategoryPicture)
%>
<!-- START OF SUBCATEGORY LIST -->       
      <div id="subcategory-list">
        <div id="subcategory-list-heading">
          <h1><%=HTMLEncode(ACategory)%></h1>
        </div>

<%If AShowCategoryPicture Or Trim(ACategoryDescription) <> "" Then%>
        <div id="subcategory-list-cat-details">
  <%If AShowCategoryPicture Then%>
          <img id="subcategory-list-cat-image"
               class="img-fluid"
               src="<%=GetCategoryImageLink(ACategory, "l")%>"
               alt="<%=HTMLEncode(ACategory)%>"
               width="75">
  <%End If%>

  <%If Trim(ACategoryDescription) <> "" Then%>
          <div id="subcategory-list-cat-description">
            <%=ACategoryDescription%>
          </div>
  <%End If%>
        </div>
<%End If%>

        <div id="subcategory-list-content" class="row g-4">
<%
End Sub

Sub ShowSubcategoryListFooter
%>
        </div><!-- end #subcategory-list-content -->
      </div><!-- end #subcategory-list -->
<!-- END OF SUBCATEGORY LIST -->
<%
End Sub

' (SS,1/6/26) Bootstrap 5 version
Sub ShowSubcategoryListItem(ACategory, ASubcategory, AIsStartItem, AIsEndItem)
%>
<!-- START OF SUBCATEGORY LIST ITEM -->
          <div class="col-xl-3 col-lg-3 col-md-4 col-sm-6 col-12">
            <a class="subcategory-list-item-link"
               href="<%=GetSubcategoryLink(ACategory, ASubcategory)%>">
              <div class="subcategory-list-item rounded-4 shadow-sm">
                <div class="subcategory-list-item-title">
                  <%=HTMLEncode(ASubcategory)%>
                </div>
              </div>
            </a>
          </div>
<!-- END OF SUBCATEGORY LIST ITEM -->
<%
End Sub

Sub ShowSubcategoryListItemWithPicture(ACategory, ASubcategory, AIsStartItem, AIsEndItem)

%>
<!-- START OF SUBCATEGORY LIST ITEM -->
        <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12 grid-item" style="padding: 10px">
          <a href="<%=GetSubcategoryLink(ACategory, ASubcategory)%>">
          <div class="subcategory-list-item">   
            <img class="subcategory-list-item-image img-responsive" src="<%=GetSubcategoryImageLink(ACategory, ASubcategory, "l")%>" alt="<%=ASubcategory%>">
            <div class="subcategory-list-item-title"><%=HTMLEncode(ASubcategory)%></div>
          </div>
          </a>
        </div>
<!-- END OF SUBCATEGORY LIST ITEM -->
<%
End Sub

' (SS,19/7/18) Added HTMLEncode to rendering of ASubcategory to prevent XSS
' (SS,6/4/19) replaced getpic.asp with GetSubcategoryImageLink
' (SS,6/6/24) added style="padding: 10px"
' (SS,1/6/26) Bootstrap 5 version
Sub ShowSubcategoryListItemWithPicture(ACategory, ASubcategory, AIsStartItem, AIsEndItem)
%>
<!-- START OF SUBCATEGORY LIST ITEM -->
          <div class="col-xl-3 col-lg-3 col-md-4 col-sm-6 col-12">
            <a class="subcategory-list-item-link"
               href="<%=GetSubcategoryLink(ACategory, ASubcategory)%>">
              <div class="subcategory-list-item rounded-4 shadow-sm">
                <img class="subcategory-list-item-image img-fluid"
                     src="<%=GetSubcategoryImageLink(ACategory, ASubcategory, "l")%>"
                     alt="<%=HTMLEncode(ASubcategory)%>">

                <div class="subcategory-list-item-title">
                  <%=HTMLEncode(ASubcategory)%>
                </div>
              </div>
            </a>
          </div>
<!-- END OF SUBCATEGORY LIST ITEM -->
<%
End Sub

Sub ShowSubcategoryListStartRow
End Sub

Sub ShowSubcategoryListEndRow
End Sub

Sub ShowSubcategoryLineSeparator
End Sub

Sub ShowSubcategoryListMissingColumns(ACount)
End Sub

%>