Example: Adding a location-based e-Marketing Spot onto a JSP file

Following this example if you want to add a location-based e-Marketing Spot onto JSP file, to be used with location-based services.

Update the JSP file to find out the shopper's current geographical location. You can achieve this using the HTML Geolocation API. For example:


<form id="EFlyerSearchForm" name="EFlyerSearchForm" method="get" action="tEFlyerDisplayView">
   <input type="hidden" name="storeId" value="${storeId}"/>
   <input type="hidden" name="catalogId" value="${catalogId}"/>
   <input type="hidden" name="langId" value="${langId}"/>
   <input type="hidden" name="latitude" value=""/>
   <input type="hidden" name="longitude" value=""/>
   <a onclick="getCurrentPosition()"><fmt:message key="EFlyer_Search_Form_Use_My_Current_Location" bundle="${storeText}"/></a>
</form>

<script type="text/javascript">
   getCurrentPosition = function() {
      navigator.geolocation.getCurrentPosition(
         function(position) {
            var form = document.getElementById("EFlyerSearchForm");
            form.postalCode.value = "";
            form.latitude.value = position.coords.latitude;
            form.longitude.value = position.coords.longitude;
            form.submit();
         },
         function(error) {
            alert(error.message);
         },
         { timeout: 5000 }
      );
   };
</script>

Update the JSP file to find the point of interest corresponding to the geographical location. For example:


<wcf:getData type="com.ibm.commerce.location.facade.datatypes.PointOfInterestType[]" var="pois" expressionBuilder="getPointsOfInterestByProximity">
         <wcf:param name="storeId" value="${storeId}"/>
         <wcf:param name="dataLanguageIds" value="${langId}"/>
         <wcf:param name="poiType" value="Store"/>
         <wcf:param name="latitude" value="${latitude}"/>
         <wcf:param name="longitude" value="${longitude}"/>
         <wcf:param name="radius" value="0"/>
         <wcf:param name="accessProfile" value="IBM_All"/>
      </wcf:getData>

Add a location-based e-Marketing Spot to the JSP file with the point of interest data. When a matching location-based content recommendation exists, this e-Marketing Spot returns the URL of the content. For example:


<c:if test="${!empty pois}">
      <c:set var="poi" value="${pois[0]}" scope="request"/>
      <wcf:getData type="com.ibm.commerce.marketing.facade.datatypes.MarketingSpotDataType" var="marketingSpotData" expressionBuilder="findByMarketingSpotName">
         <wcf:param name="DM_EmsName" value="TabletEFlyerESpot"/>
         <wcf:param name="pointOfInterest" value="${poi.pointOfInterestIdentifier.externalIdentifier.identifier}"/>
         <wcf:param name="region" value="${poi.regionID}"/>
         <wcf:param name="DM_locationContentUrlPrefix" value="${jspStoreDir}tablet/ShoppingArea/EFlyerSection/"/>
         <wcf:param name="DM_locationContentUrlSuffix" value=".jsp"/>
         <wcf:param name="DM_skipLocationContentUrlValidation" value="false"/>
         <wcf:param name="DM_locationContentValidation" value="file"/>
      </wcf:getData>
      <c:forEach var="activityData" items="${marketingSpotData.baseMarketingSpotActivityData}">
         <c:if test="${activityData.dataType == 'UrlContent'}">
            <c:set var="EFlyerURL" value="${activityData.uniqueID}"/>
         </c:if>
      </c:forEach>
   </c:if>

The EFlyerURL JSTL variable should contain the URL to the e-flyer JSP file, if one is found. Then, use markup such as <c:import url="${EFlyerURL}"/> to display the e-flyer JSP file.