Aftermarket Catalog

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).

 

  1. Identifying the make of the vehicle:
    • URL: <domain>/catalog-1/vehicle
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-makes-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
              <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
          class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
      • collMakeData - collection of make objects
        • collMakeData.Count - number of make objects
        • collMakeData.Item(n) - method to retreive the n-th make object
        • a make object has the following properties:
          • id - unique, web friendly indentifier for the current make ( also used in the url)
          • logo - the image related to this make ( usually the make's logo)
          • label - the name of this make ( Audi, Ford, Honda etc.)
          • count - the number of parts cataloged for this make
    • Example:
      <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>
  2. Identifying the year of the vehicle by make:
    • URL: <domain>/catalog-1/vehicle/<make>
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-years.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a year link use this:
              <a href="<%=FormatString(oNavigation.oURLLinks.Item('year-item-link'),oYearData.id)%>" 
              class="yourclass" title="<%=oYearData.label%>"> <%=Upper(oYearData.label)%></a>
      • collYearData - collection of year objects
        • collYearData.Count - number of year objects
        • collYearData.Item(n) - method to retreive the n-th year object
        • a year object has the following properties:
          • id - unique, web friendly indentifier for the current year ( also used in the url)
          • label - the name of this year ( 1998, 2000 etc.)
          • count - the number of parts cataloged for this make and year combination
    • Example:
      <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>
  3. Identifying the model of the vehicle by make and year:
    • URL: <domain>/catalog-1/vehicle/<make>/<year>
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-model-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a model link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('model-item-link'),oModelData.id)%>" 
              class="thumbnail" title="<%=oModelData.label%>"><%=oModelData.label%></a>
      • collModelData - collection of year objects
        • collModelData.Count - number of year objects
        • collModelData.Item(n) - method to retreive the n-th year object
        • a model object has the following properties:
          • id - unique, web friendly indentifier for the current model ( also used in the url)
          • logo - the image related to this make-model
          • label - the name of this model ( Escort, Taurus etc.)
          • count - the number of parts cataloged for this make,year and model combination
    • Example:
      <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>
  4. Display available parts for the selected vehicle ( make, year, model ):
    • URL: <domain>/catalog-1/vehicle/<make>/<year>/<model>
    • Main Template:
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-vehicle-one-column.ww - facets displayed in tabs above the part listing ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-vehicle-two-columns.ww - facets displayed as list to the left of the part listing ( controlled by user's choice)
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\part-listing-keyword-search.wws - keyword search module
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-category-list.wws - category facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-subcategory-list.wws - subcategory facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-parttype-list.wws - part type facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-manufacurer.wws - manufacturer facet
      • <shared-template-path>\e-catalog\catalog\afmkt\paging.wws -paging module for part listing
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-grid.wws -displayes parts in a grid view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-list.wws -displayes parts in a list view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-phone.wws -displayes parts when the site is accessd via a smart phone device
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
      • collPartsData - collection of part objects
      • collCategoriesData - collection of Category Facets
      • colSubCategoriesData - collection of Subcategory Facets
      • collPartTypesData - collection of Part Type Facets
      • collMfgNamesData - collection of Manufacturer (Brand) Facets

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).

 

  1. Indetifying the category:
    • URL: <domain>/catalog-1/category
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-categories-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('category-item-link'),oCategoryData.id)%>" 
              class="thumbnail" title="<%=oCategoryData.label%>"><%=Upper(oCategoryData.label)%></a>
      • collCategoryData - collection of category objects
        • collCategoryData.Count - number of category objects
        • collCategoryData.Item(n) - method to retreive the n-th category object
        • a category object has the following properties:
          • id - unique, web friendly indentifier for the current category ( also used in the url)
          • logo - the image related to this category
          • label - the name of this category
          • count - the number of parts cataloged for this category
    • Example:
      <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>
  2. Indetifying the make of the vehicle:
    • URL: <domain>/catalog-1/category/<category>
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-makes-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
              <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
          class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
      • collMakeData - collection of make objects
        • collMakeData.Count - number of make objects
        • collMakeData.Item(n) - method to retreive the n-th make object
        • a make object has the following properties:
          • id - unique, web friendly indentifier for the current make ( also used in the url)
          • logo - the image related to this make ( usually the make's logo)
          • label - the name of this make ( Audi, Ford, Honda etc.)
          • count - the number of parts cataloged for the <category> <make> combination
    • Example:
      <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>                    
  3. Display available parts for the selected category and make
    • URL: <domain>/catalog-1/category/<category>/<make>
    • Main Template:
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-category-one-column.ww - facets displayed in tabs above the part listing ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-category-two-columns.ww - facets displayed as list to the left of the part listing ( controlled by user's choice)
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-selector.wws - displayed when a vehicle is not yet selected ( make, year, model)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-ok.wws - displayed when a vehicle is selected
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-filter-parts.wws - alerts the user to use the facets to further filter the data set
      • <shared-template-path>\e-catalog\catalog\afmkt\part-listing-keyword-search.wws - keyword search module
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-year-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-make-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-subcategory-list.wws - subcategory facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-parttype-list.wws - part type facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-manufacurer.wws - manufacturer facet
      • <shared-template-path>\e-catalog\catalog\afmkt\paging.wws -paging module for part listing
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-grid.wws -displayes parts in a grid view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-list.wws -displayes parts in a list view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-phone.wws -displayes parts when the site is accessd via a smart phone device
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
      • collPartsData - collection of part objects
      • collYearsData - collection of Year Facets
      • collModelsData - collection of Models Facets
      • colSubCategoriesData - collection of Subcategory Facets
      • collPartTypesData - collection of Part Type Facets
      • collMfgNamesData - collection of Manufacturer (Brand) Facets

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).

 

  1. Indetifying the subcategory:
    • URL: <domain>/catalog-1/subcategory
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-subcategories-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('subcategory-item-link'),oSubcategoryData.id)%>" 
          class="thumbnail" title="<%=oSubcategoryData.label%>"><%=Upper(oSubcategoryData.label)%></a>
      • collSubategoryData - collection of subcategory objects
        • collSubategoryData.Count - number of subcategory objects
        • collSubategoryData.Item(n) - method to retreive the n-th subcategory object
        • a subcategory object has the following properties:
          • id - unique, web friendly indentifier for the current subcategory ( also used in the url)
          • logo - the image related to this subcategory
          • label - the name of this subcategory
          • count - the number of parts cataloged for this subcategory
    • Example:
      <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>
  2. Indetifying the make of the vehicle:
    • URL: <domain>/catalog-1/subcategory/<subcategory>
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-makes-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
          class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
      • collMakeData - collection of make objects
        • collMakeData.Count - number of make objects
        • collMakeData.Item(n) - method to retreive the n-th make object
        • a make object has the following properties:
          • id - unique, web friendly indentifier for the current make ( also used in the url)
          • logo - the image related to this make ( usually the make's logo)
          • label - the name of this make ( Audi, Ford, Honda etc.)
          • count - the number of parts cataloged for the <subcategory> <make> combination
    • Example:
      <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>                    
  3. Display available parts for the selected subcategory and make
    • URL: <domain>/catalog-1/subcategory/<subcategory>/<make>
    • Main Template:
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-subcategory-one-column.ww - facets displayed in tabs above the part listing ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-subcategory-two-columns.ww - facets displayed as list to the left of the part listing ( controlled by user's choice)
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-selector.wws - displayed when a vehicle is not yet selected ( make, year, model)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-ok.wws - displayed when a vehicle is selected
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-filter-parts.wws - alerts the user to use the facets to further filter the data set
      • <shared-template-path>\e-catalog\catalog\afmkt\part-listing-keyword-search.wws - keyword search module
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-year-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-make-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-category-list.wws - category facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-parttype-list.wws - part type facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-manufacurer.wws - manufacturer facet
      • <shared-template-path>\e-catalog\catalog\afmkt\paging.wws -paging module for part listing
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-grid.wws -displayes parts in a grid view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-list.wws -displayes parts in a list view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-phone.wws -displayes parts when the site is accessd via a smart phone device
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
      • collPartsData - collection of part objects
      • collYearsData - collection of Year Facets
      • collModelsData - collection of Models Facets
      • colCategoriesData - collection of Category Facets
      • collPartTypesData - collection of Part Type Facets
      • collMfgNamesData - collection of Manufacturer (Brand) Facets

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).

 

  1. Indetifying the part type:
    • URL: <domain>/catalog-1/parttype
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-parttypes.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('parttype-item-link'),oPartTypeData.id)%>" 
          class="yourclass" title="<%=oPartTypeData.label%>"><%=Upper(oPartTypeData.label)%></a>
      • collPartTypeData - collection of part type objects
        • collPartTypeData.Count - number of part tyeps objects
        • collPartTypeData.Item(n) - method to retreive the n-th part type object
        • a part type object has the following properties:
          • id - unique, web friendly indentifier for the current part type ( also used in the url)
          • label - the name of this part type
          • count - the number of parts cataloged for this part type
    • Example:
      <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>
  2. Indetifying the make of the vehicle:
    • URL: <domain>/catalog-1/parttype/<parttype>
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-makes-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
          class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
      • collMakeData - collection of make objects
        • collMakeData.Count - number of make objects
        • collMakeData.Item(n) - method to retreive the n-th make object
        • a make object has the following properties:
          • id - unique, web friendly indentifier for the current make ( also used in the url)
          • logo - the image related to this make ( usually the make's logo)
          • label - the name of this make ( Audi, Ford, Honda etc.)
          • count - the number of parts cataloged for the <parttype> <make> combination
    • Example:
      <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>                    
  3. Display available parts for the selected part type and make
    • URL: <domain>/catalog-1/parttype/<parttype>/<make>
    • Main Template:
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-parttype-one-column.ww - facets displayed in tabs above the part listing ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-parttype-two-columns.ww - facets displayed as list to the left of the part listing ( controlled by user's choice)
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-selector.wws - displayed when a vehicle is not yet selected ( make, year, model)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-ok.wws - displayed when a vehicle is selected
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-filter-parts.wws - alerts the user to use the facets to further filter the data set
      • <shared-template-path>\e-catalog\catalog\afmkt\part-listing-keyword-search.wws - keyword search module
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-year-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-make-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-category-list.wws - category facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-subcategory-list.wws - subcategory facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-manufacurer.wws - manufacturer facet
      • <shared-template-path>\e-catalog\catalog\afmkt\paging.wws -paging module for part listing
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-grid.wws -displayes parts in a grid view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-list.wws -displayes parts in a list view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-phone.wws -displayes parts when the site is accessd via a smart phone device
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
      • collPartsData - collection of part objects
      • collYearsData - collection of Year Facets
      • collModelsData - collection of Models Facets
      • collCategoriesData - collection of Category Facets
      • collSubCategoriesData - collection of Category Facets
      • collMfgNamesData - collection of Manufacturer (Brand) Facets

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).

 

  1. Indetifying the manufacturer:
    • URL: <domain>/catalog-1/manufacturer
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-manufacturers.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item(mfgname-item-link'),oMfgNameData.id)%>" 
          class="yourclass" title="<%=oMfgNameData.label%>"><%=Upper(oMfgNameData.label)%></a>
      • collMfgNamesData - collection of manufacturer objects
        • collMfgNamesData.Count - number of manufacturer objects
        • collMfgNamesData.Item(n) - method to retreive the n-th manufacturer object
        • a manufacturer object has the following properties:
          • id - unique, web friendly indentifier for the current manufacturer ( also used in the url)
          • label - the name of this manufacturer
          • count - the number of parts cataloged for this manufacturer
    • Example:
      <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>
  2. Indetifying the make of the vehicle:
    • URL: <domain>/catalog-1/manufacturer/<manufacturer>
    • Main Template: <shared-template-path>\e-catalog\catalog\afmkt\list-makes-logo.wws
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
        • To create a make link use this:
          <a href="<%=FormatString(oNavigation.oURLLinks.Item('make-item-link'),oMakeData.id)%>"
          class="yourclass" title="<%=oMakeData.label%>"><%=Upper(oMakeData.label)%></a>
      • collMakeData - collection of make objects
        • collMakeData.Count - number of make objects
        • collMakeData.Item(n) - method to retreive the n-th make object
        • a make object has the following properties:
          • id - unique, web friendly indentifier for the current make ( also used in the url)
          • logo - the image related to this make ( usually the make's logo)
          • label - the name of this make ( Audi, Ford, Honda etc.)
          • count - the number of parts cataloged for the <manufacturer> <make> combination
    • Example:
      <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>                    
  3. Display available parts for the selected manfacturer and make
    • URL: <domain>/catalog-1/manufacturer/<manufacturer>/<make>
    • Main Template:
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-manufacturer-one-column.wws - facets displayed in tabs above the part listing ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\parts-by-manufacturer-two-columns.wws - facets displayed as list to the left of the part listing ( controlled by user's choice)
    • Other Templates:
      • <shared-template-path>\e-catalog\catalog\afmkt\navigation-breadcrumb.wws - constructs the breadcrumb section
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-catalog-error.wws - displayed when an error occurs (e.g no data available)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-selector.wws - displayed when a vehicle is not yet selected ( make, year, model)
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-vehicle-fit-ok.wws - displayed when a vehicle is selected
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-filter-parts.wws - alerts the user to use the facets to further filter the data set
      • <shared-template-path>\e-catalog\catalog\afmkt\part-listing-keyword-search.wws - keyword search module
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-year-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-make-list.wws - year facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-category-list.wws - category facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-subcategory-list.wws - subcategory facet
      • <shared-template-path>\e-catalog\catalog\afmkt\facet-parttype-list.wws - part type facet
      • <shared-template-path>\e-catalog\catalog\afmkt\paging.wws -paging module for part listing
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-grid.wws -displayes parts in a grid view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-list.wws -displayes parts in a list view ( controlled by user's choice)
      • <shared-template-path>\e-catalog\catalog\afmkt\list-parts-phone.wws -displayes parts when the site is accessd via a smart phone device
      • <shared-template-path>\e-catalog\catalog\afmkt\notification-alternate-lookups.wws -displayes alternate choice for the user to locate parts
    • Available Data:
      • oCatalog - the catalog object that drives the application
      • oNavigation - the navigation object that has breadcrumb links and all the navigation links necessary to construct the links on the templates and nagivate the application
      • collPartsData - collection of part objects
      • collYearsData - collection of Year Facets
      • collModelsData - collection of Models Facets
      • collCategoriesData - collection of Category Facets
      • collSubCategoriesData - collection of Category Facets
      • collPartTypesData - collection of Part Type Facets