4.5. Tweaking Ad Appearance

By adding some special attributes to DIVs specified for holding ads, the publisher can tweak how the ads appear inside the DIVs. The tweaks only apply inside the DIV they are added to. The following subsections describe what display properties can be modified, and what the special attributes are.

It should be noted that the special attributes are only handled by the Lat49.AdHelper class. Publishers who request ads using the low level API methods will have to implement similar functionality themselves.

4.5.1. Positioning of Ad Contents

All ads are wrapped in a DIV with a size of 242x133 pixels. The sizes of ad contents within the wrapper DIV vary, though, some being as large as the wrapper, and others smaller. By default, the contents are positioned in the upper-left corner of the wrapper DIV. However, it is possible to specify other locations by creating a "lat49adposition" attribute within the DIV, and setting it to either "upper-left", "lower-left", "upper-right" or "lower-right". This is useful if you want a particular corner of the ads to always be in the same place (for example, if the ads are being shown in the bottom-right corner of the display).

N.B. Certain ads expand out with more information when the client hovers the mouse pointer over the initial ad. These ads expand in the opposite direction to the position set via the "lat49adposition" attribute. For example, when an ad is positioned as "upper-left", expandable ads push out to the lower-right. It is possible for such ads to expand beyond the bottom or right side of a page and affect the layout. This makes setting the "lat49adposition" fairly important. Whether on a map or embedded in HTML, if the ad is positioned close to the bottom or right side of the page, the "lat49adposition" attribute should be set accordingly.

It should also be noted that an ad position of "center" was allowed in the past. Expandable ads currently cannot expand out while staying over the center of the initial ad, so the "center" value will now be ignored (and replaced by the default value of "upper-left"). It might be allowed again sometime in the future, but for now, it should not be used.

Example 4-2. Setting ad positioning

<!-- Create a DIV for ads that are positioned in the upper right corner. -->
<div id="adcontainer" lat49adposition="upper-right">

4.5.2. Debugging Mode for Ads

When testing Lat49 within an application, publishers should enable debugging mode for ads. Debugging mode disables the logging of requests on the ad servers, which keeps the tests from skewing ad statistics. It also makes it easier to verify that requests are working by producing a text message when no ad contents are available for the given location (which can happen fairly often in some geographic areas). Debugging mode is enabled by adding a "lat49debug" attribute to the ad DIV and setting it to "1".

Example 4-3. Enabling Debugging Mode

<!-- Create a DIV that shows information about nonexistent ads. -->
<div id="adcontainer" lat49debug="1">

4.5.3. Notification for Updated Ads

An ad DIV can be set up to call a notification callback whenever the ad is updated. The publisher needs to create the callback method, and then pass its name to the DIV via an "onlat49update" attribute. The callback should accept one boolean argument. The argument will be set to true when the ad has contents, or set to false when it's empty. The following example illustrates how to create a callback and pass its name to the ad DIV.

Example 4-4. Defining a Notification Callback for Updated Ads

<script type='text/javascript'>
  updateCB = function(hasContents) {
    if (hasContents)
      alert("New ad has contents.");
    else
      alert("New ad is empty.");
  }
</script>

<!-- Create a DIV that notifies when ads are updated. -->
<div id="adcontainer" onlat49update="updateCB">

4.5.4. Showing and Hiding Pushpins

In order to access the Lat49 ad's pushpin data, two attributes must be included in the ad DIV: "onlat49pushpin" and "onlat49hidepushpin". When these two attributes are defined, the pushpin control panel will be displayed (Section 3.5).

The "onlat49pushpin" and "onlat49hidepushpin" attributes specify the names of the callback methods where you write your own code that will show and hide pushpins, respectively. The method used to show the pins must include an argument that will be filled with an array of objects. Each object in the array has five properties to describe a pushpin: "lat", "lon", "title", "address", and the "pinurl" (which is used to describe the pushpin graphic). The array of objects returned is ordered by distance from the centre of the region covered by the displayed ad.

The callback functions are triggered when the 'Map it' and 'Clear' buttons are pressed from the pushpin control panel.

Example 4-5. Defining Callbacks for Showing and Hiding Pushpins

<script type='text/javascript'>

/* write code here to display pushpins related to displayed ad. */
function  showPushPin(pindata)
{
   // Write your code here to display pushpins

   for(i=0; i<pindata.length;i++)
   {
     var latitude = pindata[i].lat; 
     var longitude = pindata[i].lon;
     var pin_title = pindata[i].title;
     var pin_address = pindata[i].address;
     var pin_url = pindata[i].pinurl;
     // write code to display the ith pin.
   }
}

function hidePushPin()
{
  // Write your code here to hide Lat49 pushpins.
}
</script>

<!-- Add attributes to the DIV that define the pushpin callbacks. -->
<div id="adcontainer" onlat49pushpin="showPushPin" onlat49hidepushpin="hidePushPin">
</div>