This page contains information about the templates used in the Aftermarket Catalog (Facted catalog)
The new Sophio © faceted catalog's design is based on Twitter's popular Bootstrap CSS framework.
This document will provide an understanding on how, where and when are the templates used.
These pages are using ASP like tags for dynamic content.
<%= variable|function() %>
will output the content of the variable or the result of the function where the tag is placed
<% function() %>
will execute a function and no output will result
The most common function you might encounter have the following sintax:
If .... Else....EndIf
<% if <condition> %> execute this line if condition is true <% else %> execute this line if condition is false <% endif %>
Do Case .... Case....Otherwise...EndCase
<% do case %> <% case <condition1> %> execute this line if condition1 is true <% case <condition2> %> execute this line if condition2 is true <% otherwise %> execute this line if non of the coditions above were true <% endcase %>
For ..... EndFor
<% for counter_startvalue <= counter_endvalue %> execute this line <% endfor %>
For Each ..... EndFor
<% for each object in collection %> execute this line <% endfor %>
String Functions:
<%= Upper("string") %>
will output the sting in UPPERCASE
<%= Lower("string") %>
will output the sting in lower case
<%= Proper("string") %>
will output the sting in Proper Case ( Camel case)
Utility functions:
<%= GetWebVarOnly("string") %>
retreives a variable passed in the form of query string or form field !!! Not safe to redisplay as its subject to cross site scripting !!!
<%= GetWebVarOnlySafe("string") %>
same as above, except is sanitzes the input and it html encodes suspicios entries !!! Safe to redisplay !!!
The most common way to shop for auto parts is by year, make, model. The faceted catalog uses the ACES vehicle database (VCDB). Once established, the buyer's vehicle will be stored in the users 'garage'.
Shopping by vehicle will include 3 basic steps to identify the vehicle and then the buyer is presented with a list of parts available for the chosen vehicle. The list can be further filtered by the avaiable facets (category, subcategory,part type, manufacturer).
<a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
<ul class="thumbnails">
<%
For m.i=1 to collYearData.Count
oYearData=collYearData.item(m.i)
%>
<li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('year-item-link'),oYearData.id)%>" class="thumbnail" title="<%=oYearData.label%>"> <span class="yearname"> <span class="yearlabel label"><%=Upper(oYearData.label)%></span> <small><span class="badge counter"><%=oYearData.count%></span></small></span> </a> </li>
<% EndFor %>
</ul>
<a href="<%=FormatString(oNavigation.oURLLinks.Item('year-item-link'),oYearData.id)%>" class="yourclass" title="<%=oYearData.label%>"> <%=Upper(oYearData.label)%></a>
<ul class="thumbnails">
<%
For m.i=1 to collYearData.Count
oYearData=collYearData.item(m.i)
%>
<li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('year-item-link'),oYearData.id)%>" class="thumbnail" title="<%=oYearData.label%>"> <span class="yearname"> <span class="yearlabel label"><%=Upper(oYearData.label)%></span> <small><span class="badge counter"><%=oYearData.count%></span></small></span> </a> </li>
<% EndFor %>
</ul>
<a href="<%=FormatString(oNavigation.oURLLinks.Item('model-item-link'),oModelData.id)%>" class="thumbnail" title="<%=oModelData.label%>"><%=oModelData.label%></a>
<ul class="thumbnails">
<%
For m.i=1 to collModelData.Count
oModelData=collModelData.item(m.i)
%>
<li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('model-item-link'),oModelData.id)%>" class="thumbnail" title="<%=oModelData.label%>"><img src="<%=oModelData.logo%>" alt="<%=oModelData.label%>"/> <span class="modelname">
<span class="modellabel label"><%=oModelData.label%></span> <small><span class="badge counter"><%=oModelData.count%></span></small></span> </a>
</li>
<% EndFor %>
</ul>
Shopping by category will include 2 basic steps to indetify the category and the vehicle make and then the buyer is presented with a list of parts availble for the chosen vehicle. The list can be further filtered by the avaiable facets (year, make, subcategory,part type, manufacturer).
<a href="<%=FormatString(oNavigation.oURLLinks.Item('category-item-link'),oCategoryData.id)%>" class="thumbnail" title="<%=oCategoryData.label%>"><%=Upper(oCategoryData.label)%></a>
<ul class="thumbnails">
<%
For m.i=1 to collCategoryData.Count
oCategoryData=collCategoryData.item(m.i)
%>
<li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('category-item-link'),oCategoryData.id)%>" class="thumbnail" title="<%=oCategoryData.label%>">
<img src="<%=oCategoryData.logo%>" alt="<%=oCategoryData.label%>"/> <span class="categoryname">
<span class="categorylabel label"><%=Upper(oCategoryData.label)%></span> <small> <span class="badge"><%=oCategoryData.count%></span></small></span> </a>
</li>
<% EndFor %>
</ul>
<a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
<ul class="thumbnails"> <% For m.i=1 to collMakeData.Count oMakeData=collMakeData.item(m.i) %> <li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>" class="thumbnail" title="<%=oMakeData.label%>"> <img src="<%=oMakeData.logo%>" alt="<%=oMakeData.label%>"/> <span class="makename"> <span class="makelabel label"><%=Upper(oMakeData.label)%></span> <small><span class="badge counter"><%=oMakeData.count%></span></small></span> </a> </li> <% EndFor %> </ul>
Shopping by subcategory will include 2 basic steps to identify the subcategory and vehicle make and then the buyer is presented with a list of parts availble for the chosen vehicle. The list can be further filtered by the avaiable facets (year, model,category,part types, manufacturer).
<a href="<%=FormatString(oNavigation.oURLLinks.Item('subcategory-item-link'),oSubcategoryData.id)%>" class="thumbnail" title="<%=oSubcategoryData.label%>"><%=Upper(oSubcategoryData.label)%></a>
<ul class="nav nav-pills">
<%
For m.i=1 to collSubCategoryData.Count
oSubCategoryData=collSubCategoryData.item(m.i)
%>
<li> <a href="<%= FormatString(oNavigation.oURLLinks.Item('subcategory-item-link'),oSubCategoryData.id) %>"> <span class="subcategoryname"><%=oSubCategoryData.label%> <small class="muted">(<%=oSubCategoryData.count%>)</small></span> </a> </li>
<% EndFor %>
</ul>
<a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
<ul class="thumbnails"> <% For m.i=1 to collMakeData.Count oMakeData=collMakeData.item(m.i) %> <li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>" class="thumbnail" title="<%=oMakeData.label%>"> <img src="<%=oMakeData.logo%>" alt="<%=oMakeData.label%>"/> <span class="makename"> <span class="makelabel label"><%=Upper(oMakeData.label)%></span> <small><span class="badge counter"><%=oMakeData.count%></span></small></span> </a> </li> <% EndFor %> </ul>
Shopping by part type will include 2 basic steps to identify the part type and vehicle make and then the buyer is presented with a list of parts availble for the chosen vehicle. The list can be further filtered by the avaiable facets (year, model,category,part types, manufacturer).
<a href="<%=FormatString(oNavigation.oURLLinks.Item('parttype-item-link'),oPartTypeData.id)%>" class="yourclass" title="<%=oPartTypeData.label%>"><%=Upper(oPartTypeData.label)%></a>
<ul class="nav nav-pills">
<%
For m.i=1 to collPartTypesData.Count
oPartTypeData=collPartTypesData.item(m.i)
%>
<li> <a href="<%= FormatString(oNavigation.oURLLinks.Item('parttype-item-link'),oPartTypeData.id) %>"> <span class="parttypename"><%=oPartTypeData.label%> <small class="muted">(<%=oPartTypeData.count%>)</small> </span> </a> </li>
<% EndFor %>
</ul>
<a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
<ul class="thumbnails"> <% For m.i=1 to collMakeData.Count oMakeData=collMakeData.item(m.i) %> <li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>" class="thumbnail" title="<%=oMakeData.label%>"> <img src="<%=oMakeData.logo%>" alt="<%=oMakeData.label%>"/> <span class="makename"> <span class="makelabel label"><%=Upper(oMakeData.label)%></span> <small><span class="badge counter"><%=oMakeData.count%></span></small></span> </a> </li> <% EndFor %> </ul>
Shopping by manufacturer will include 2 basic steps to identify the part type and vehicle make and then the buyer is presented with a list of parts availble for the chosen vehicle. The list can be further filtered by the avaiable facets (year, model,category,subcategory,part type).
<a href="<%=FormatString(oNavigation.oURLLinks.Item(mfgname-item-link'),oMfgNameData.id)%>" class="yourclass" title="<%=oMfgNameData.label%>"><%=Upper(oMfgNameData.label)%></a>
<ul class="nav nav-pills">
<%
For m.i=1 to collMfgNamesData.Count
oMfgNameData=collMfgNamesData.item(m.i)
%>
<li> <a href="<%= FormatString(oNavigation.oURLLinks.Item('mfgname-item-link'),oMfgNameData.id) %>"> <span class="manufacturername"><%=oMfgNameData.label%> <small class="muted">(<%=oMfgNameData.count%>)</small></span> </a> </li> <% EndFor %> </ul>
<a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
<ul class="thumbnails"> <% For m.i=1 to collMakeData.Count oMakeData=collMakeData.item(m.i) %> <li> <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>" class="thumbnail" title="<%=oMakeData.label%>"> <img src="<%=oMakeData.logo%>" alt="<%=oMakeData.label%>"/> <span class="makename"> <span class="makelabel label"><%=Upper(oMakeData.label)%></span> <small><span class="badge counter"><%=oMakeData.count%></span></small></span> </a> </li> <% EndFor %> </ul>