MadClouds

MapQuest JavaScript API 5.3 – SSL Access

Monday, May 18th, 2009 | Technology | No Comments

MapQuest has just updated their JavaScript API 5.3 to allow SSL access. The lack of SSL support was causing an immense hurdle for us here at 24 Hour Fitness.  We had to implement some undesired conditionals to switch between the interactive JavaScript maps and the static Java maps depending on the type of access, http or https.  I stumbled upon this gem about a week ago when I randomly called up MapQuest’s technical support line (800-873-2418) to discuss SSL access for their Flex API (supported).  The tech rep informed me that they made the change that very morning.  It took me a while to get some time to correct our workaround.

No additional code is needed to enable SSL access for the JavaScript maps.  As long as you’re reference version API version 5.3 you have SSL access.  Make sure you include any https pages that will be utilizing the SSL maps in your MapQuest account under the referrers list.

This afternoon I was able to make the changes necessary to utilize MapQuest’s SSL changes which will go live within the next few weeks.

Tags: API, Job, Mapquest

MapQuest Flash/Flex API – Customize POI

Monday, May 11th, 2009 | Technology, Tutorials | No Comments

Changing the default POI in the MapQuest Flash/Flex API is pretty easy.  The MapQuest POI API has built in methods to replace the default POI icon image, as well as a few other properties like the size, location and label of that POI.  We’ll our company wanted to really customize the POI to show a dynamic label that changed with our results.  I have successfully achieved this result with MapQuest’s JavaScript API on our jsp pages, but recently I’ve been working on a new Flex project that uses MapQuest’s services to show our clubs.  The MapQuest documentation doesn’t provide a lot of insight on how to customize the POI label and the forums doesn’t explicitly tell you how to achieve this.  So after a little tinkering I was able to get the desired results.  It all comes down to overloading the POI class.

Inside our Flex project I created a new Action Script class called “POIExtended.as” which extends the Poi class:

public class POIExtended extends Poi
{
public function POIExtended(latLng:IPointLL, mapIcon:MapIcon=null)
{
super(latLng, mapIcon);
}

Inside this class I overrode the “setLabel()” method:

override public function setLabel(label:String, format:TextFormat = null): void {

var textField:TextField;

var mapIcon:MapIcon = this.getIcon();

textField = new TextField();
textField.text = label;
textField.width=30;
textField.height=30;
textField.y = 4;
textField.x = 3;
textField.mouseEnabled = false;

if (format) {
textField.setTextFormat(format);
}

mapIcon.addChild(textField);

}

This code moves the label assigned to the POI to the center of the icon.  I ran into a problem where the mouse over area on the POI was too big, causing a huge area that targeted the POI.  By limiting the height and width to a size just smaller then the POI icon image and disabling the mouse, it fixed this problem.

Tags: API, flex, Job, Mapquest

MapQuest AS3/Flex Club Finder

Tuesday, May 5th, 2009 | Technology, Tutorials, Web Design, Work | No Comments

This past release Erich C. and I have been working on a new AS3/Flex Club Finder.  We currently have 2 different club finders on our website seen here:

Flash Club Finder:

24 hour fitness flash club finder

JSP Club Finder:

24 hour fitness jsp club finder

This new project is meant to allow our members to set their favorite clubs in their profile.  This would allow them to quickly access the club’s resources, such as group X class schedules, phone numbers, amenities, ect.  We were given one release cycle to duplicate the basic functionality our previous club finders delivered.  What a challenge! This is what we achieved:

24 hour fitness flex club finder

This was a very beneficial project for me because I was to help build it from scratch. We overcame some very technically confusing challenges (such as loading an unsecured swf application inside another secure swf application). I got a lot of exposure to Flex’s event driven architecture and enjoyed learning a ton about laying out components with Flex.

I’ll make another post about the specific challenges and how we resolved them.

Tags: flex, Job, Mapquest