There are multiple places in the mobile application where lists of products are displayed in a slider.
Page | Slider(s) | Notes |
|---|---|---|
Home Page | Promotions slider (top slider) | Object Type: Rendered in: Created in: |
Promotion’s products slider (bottom slider) | Rendered in: Created in: | |
Product Details Page | Related Items slider | Object Type: Rendered in: Created in: products.js - |
Recently Viewed Items slider | Object Type: Rendered in: Created in: cart.js - | |
Empty Cart Page | Featured Items slider | Object Type: Rendered in: Created in: |
Recently Viewed Items slider | Object Type: Rendered in: Created in: | |
Category Landing Page | Featured Items slider | Object Type: Rendered in: Created in: |
Brand Landing Page | Featured Items slider | Object Type: Rendered in: Created in: |
productsHorizontalList.jsp
The productsHorizontalList.jsp extracts product information and adds it to the slider in the correct format, by itinerating over the list of products provided to it based on the object type.
This JSP also helps centralize and encapsulate the logic behind displaying products in a slider, which helps remove unneeded code, simplifies the jsps, and makes them more readable.
parameters
productsHorizontalList.jsp expects the following input parameters:
Parameters | Description | Required |
|---|---|---|
products | This parameter contains a list of any of the product objects. The page will then process the objects and display them based on their type, either GSAItem or Endeca record. | Yes |
index | Specifies the index of the slider on the page. This is needed only when there is more than one slider on the page. In that case where there is only one slider on the page, the including page can leave out this parameter and it will be defaulted to one. | No |
Any page that needed to show a slider would include productsHorizontalList.jsp and specify these parameters. For example:
<dsp:include page="${mobileStorePrefix}/global/gadgets/productsHorizontalList.jsp">
<dsp:param name="products" value="${contentItem.records}" />
</dsp:include>To adapt to this centralized approach, the following pages include productsHorizontalList.jsp:
productDetails.jspproductDetailsContainer.jspemptyCart.jsprecentelyViewed.jspHorizontalResultList.jsp
Note: relatedProducts.jsp has been removed as it is no longer used.
Supporting JavaScript code
A single JS function:
(initHorizontalListSlider())
is used for creating the sliders in the app, except for the home page sliders.
