BEA Logo BEA WebLogic Commerce Server Release Beta

  Corporate Info  |  News  |  Solutions  |  Products  |  Partners  |  Services  |  Events  |  Download  |  How To Buy

 

   WebLogic Commerce Server Doc Home   |   Tour of the JSP Templates   |   Previous Topic   |   Next Topic   |   Contents   |   Index

Example of Customizing the Templates

 

In previous sections of the tour, when you clicked the Add to Cart link, WebLogic Commerce Server displayed shoppingcart.jsp to prompt you to check out. Yet, your business model might encourage users to continue shopping by returning them to the product catalog after they click Add to Cart.

You can change the behavior of the Add to Cart link by changing only a single line in the webflow.properties file, but before you change the line, you need background information to understand which line to modify and why. This section of the tour takes you along the following path:

 


Step 1: Understand the Add to Cart Link

Instead of specifying a static filename as a URL, link anchors in WebLogic Commerce Server invoke the Webflow mechanism to determine the destination resource. The link anchor for the Add to Cart link (illustrated in Listing 6-1) is in the include file $WL_COMMERCE_HOME/server/webapps/wlcs/commerce/catalog/includes/itemdetails.jsp. For more information on itemdetails.jsp, see "The Catalog JSP Templates" in Product Catalog Management.

Listing 6-1 Add to Cart Anchor


<a href="<%= WebflowJSPHelper.createWebflowURL(pageContext, "itemdetails.jsp", "link(add)", "&" + HttpRequestConstants.CATALOG_ITEM_SKU + "=" + productItem.getKey().getIdentifier(), true) %>">

<img src="<%=com.beasys.commerce.webflow.WebflowJSPHelper.createGIFURL(request, response, "/commerce/images/btn_addcart.gif")%>" border="0" alt="Add to Shopping Cart"></a>


This step of the tour describes the following actions:

How the Link Anchor Invokes Webflow

The anchor uses the WebflowJSPHelper.createWebflowURL( ) method to pass data to Webflow. Note the following two data items that WebflowJSPHelper.createWebflowURL( ) passes to Webflow:

For more information about WebflowJSPHelper.createWebflowURL( ) method, see "Customizing Webflow and Pipelines" in Webflow and Pipeline Management.

After sending this data through one or more Pipelines, Webflow returns a URL that resolves the link.

How Webflow Resolves the Link

When the WebflowJSPHelper.createWebflowURL() method sends data to Webflow, Webflow opens the $WL_COMMERCE_HOME/webflow.properties file to find instructions for processing the data.

Listing 6-2 shows that webflow.properties directs the data it receives from link(add) to the AddProductItemToShoppingCart.inputprocessor input processor. (In webflow.properties, anything to the left of an equals sign is sending data to an input processor, Pipeline, Pipeline component, or other service, and anything to the right of an equals sign is receiving data.)

Listing 6-2 The Add to Cart Link in webflow.properties


########################################################################### 
Handle add to shopping cart.
##########################################################################

# On the add link, extract parameters for the add to shopping cart pipeline
*.jsp.link(add)=AddProductItemToShoppingCart.inputprocessor


Note: The *.jsp.link(add) construct indicates that Webflow applies this property to any link named link(add) on any JSP.

Listing 6-3 (which continues the webflow.properties excerpt started in Listing 6-2) shows that the input processor sends the link output into a pipeline named AddProductItemToShoppingCart.pipeline. After this pipeline processes data from the link output, it sends data to another pipeline named RefreshSavedList.pipeline.

Listing 6-3 Sending Data from Input Processor to Pipelines


# Execute the add to shopping cart pipeline
AddProductItemToShoppingCart.inputprocessor.success=AddProductItemToShoppingCart.pipeline

# If add operation succeeded, we want to make sure the saved list is refreshed before 

#  going to shopping cart screen
AddProductItemToShoppingCart.pipeline.success=RefreshSavedList.pipeline


To find out how Webflow specifies which JSP to display after you click Add to Cart, you must continue following the Webflow trail to see where RefreshSavedList.pipeline directs its output.

The next instance of the RefreshSavedList.pipeline string, displayed in Listing 6-4, shows the pipeline receiving data from another input processor; this represents another path for sending data into the pipeline. However, we are interested in seeing where the pipeline sends data, so we must search for an instance of the RefreshSavedList.pipeline string that is on the left side of an equals sign.

In this case, the RefreshSavedList.pipeline= string is located only three lines later in the file. It specifies that when the RefreshSavedList.pipeline pipeline succeeds, WebLogic Commerce Server displays shoppingcart.jsp.

Listing 6-4 Resolving the Link


###############################################################################

# Handle view shopping cart.

###############################################################################

# First call InitShoppingCarts to make sure the pipeline session is initialized
*.jsp.link(shoppingcart)=customerhome_InitShoppingCart.inputprocessor
*.jsp.link(viewShoppingCart)=customerhome_InitShoppingCart.inputprocessor

# On success, execute the RefreshSavedList pipeline
customerhome_InitShoppingCart.inputprocessor.success=RefreshSavedList.pipeline

# if the pipeline succeeds go to shopping cart screen
RefreshSavedList.pipeline.success=commerce/shoppingcart.jsp


 


Step 2: Modify Add to Cart

After locating the Webflow property that determines the user-visible behavior of Add to Cart, you can modify it to direct users to the top level of the catalog.

Recall from New User Buys a Product, that the top level of the product catalog is displayed in main.jsp. But changing the output of RefreshSavedList.pipeline.success from commerce/shoppingcart.jsp to commerce/main.jsp would not produce desirable results.

main.jsp, does not contain the standard HTML tags that Web browsers can render. Instead, the file contains JSP tags.

If you were to change the output of RefreshSavedList.pipeline.success to display main.jsp directly, the Web browser would display an empty page. Instead, you must invoke an input processor named GetTopCategories.inputprocessor, which gathers data about categories in the product catalog and displays it in main.jsp.

For more information on how WebLogic Commerce Server populates main.jsp with data, see "The Product Catalog JSP Templates and Tag Library" in Product Catalog Management.

Directing the Output of the GetTopCategories Input Processor

To direct output from RefreshSavedList.pipeline to GetTopCategories.inputprocessor, open $WL_COMMERCE_HOME/webflow.properties and change the value on the right side of the equals sign as illustrated in Listing 6-5. You can change the previous property to a comment line, making it easy to return to your previous configuration.

Listing 6-5 Modifying webflow.properties


# if the pipeline succeeds go to shopping cart screen
# RefreshSavedList.pipeline.success=commerce/shoppingcart.jsp
RefreshSavedList.pipeline.success=GetTopCategories.inputprocessor


 


Step 3: Verify the Modification

After you save your modifications to webflow.properties, you can see the results by clicking the Add to Cart link from details.jsp (see Figure 6-1). You do not need to restart WebLogic Commerce Server.

Figure 6-1 Click Add to Cart in details.jsp

When you click Add to Cart, WebLogic Commerce Server displays the top level of the product catalog in main.jsp.

To verify that WebLogic Commerce Server added your item to the shopping cart, do the following from main.jsp:

  1. Click View Cart in the header.

  2. If WebLogic Commerce Server prompts you to log in, enter the username and password you set up in the previous sections of the tour.

When you click View Cart, WebLogic Commerce Server displays shoppingcart.jsp, which contains the item you added to the cart (see Figure 6-2).

Figure 6-2 The Shopping Cart

What's Next?

This concludes the tour. To learn more about the WebLogic Commerce Server JSP templates, Webflow, Pipeline, the product catalog, and the other concepts introduced in the tour, refer to the following documents: