While working on version 2 of BikeNav, I attempted to make some improvements not only to the app itself, but also to my development and build environment. Streamlining the process of minification was one of the goals I had in mind. The following step-by-step guide illustrates how I integrated YUI Compressor into the BikeNav Xcode project, which in itself is a PhoneGap project. Nevertheless, this can be applied to any mobile web application that stores assets (HTML, CSS and JavaScript) on the device itself.

Step 1: Download YUI Compressor

Obviously we need to download YUI Compressor first. After downloading and extracting the ZIP file, we end up with a folder yuicompressor-[version-number]. I decided to copy that folder into my iOS project folder into a directory tools, that I had created earlier. The final path to the YUI Compressor folder would be:

/Users/komenda/Documents/PhoneGapApps/BikeNav2/tools/yuicompressor-2.4.2

Step 2: Create a Shell Script File

Since YUI Compressor only handles minification for us, we need to make sure that our JavaScript and CSS files are concatenated into one file each before fed to the Compressor. Also, in order to include this step into the iOS build process, we need to point the build settings to some file it can execute. I decided to create another folder in my iOS project directory called scripts in which I created a shell script called bikenav_build.sh which will hold the shell commands to concat the files first and then call YUI Compressor to minify them.

$ pwd
/Users/komenda/Documents/PhoneGapApps/BikeNav2/scripts
$ ls -l
total 8
-rwxrwxrwx@ 1 komenda  _lpoperator  1098 Nov  8 15:51 bikenav_build.sh

Step 3: The Build Script

rsync

In order to be able to do development in the browser before pushing anything on to the iOS Simulator or the device, I had set up my dev environment in such a way that I am serving all the BikeNav code from within my local Apache DocumentRoot (since there is no server-side processing involved, Apache is not even necessary, but because I store all my other projects in there as well, it keeps things nice and tidy). The path and folder structure looks like this:

$ pwd
/Users/komenda/Webroot/BikeNav
$ ls -l
total 264
drwxr-xr-x  18 komenda  _lpoperator     612 Nov  8 16:35 audio
drwxr-xr-x   5 komenda  _lpoperator     170 Oct 24 17:11 css
drwxr-xr-x  27 komenda  _lpoperator     918 Oct 29 16:46 img
-rw-r--r--   1 komenda  _lpoperator   12497 Nov  8 17:48 index.html
drwxr-xr-x  13 komenda  _lpoperator     442 Nov  8 15:49 js
-rw-r--r--   1 komenda  _lpoperator  116575 Aug 17 17:33 phonegap-1.0.0.js

Once I reach a certain point during development where I feel it is time to try things out on simulator or device, I sync this directory with the www directory inside the iOS/PhoneGap project. A great tool to do this is rsync, which already comes with Mac OSX. The following command is how I run rsync when working on BikeNav (from inside the scripts directory in the iOS project). For details on rsync command line options please refer to the documentation.

rsync -avz --exclude 'index.html' --delete ~/Webroot/BikeNav/ ../www/

This is also the first thing I put into the bikenav_build.sh script:

#!/bin/bash

echo "Custom BikeNav build script"
echo "==========================="

echo "Step 1: rsync files from web directory"

rsync -avz --exclude 'index.html' --delete ~/Webroot/BikeNav/ ../www/

Concatenation

As mentioned above, we need to concatenate our JavaScript and CSS files into one single file each before passing it on to the YUI Compressor for minification. For this, we simply use the Unix cat command like so:

cat ../www/js/one.js ../www/js/two.js ../www/js/three.js > ../www/js/combined.js
cat ../www/css/one.css ../www/css/two.css > ../www/css/combined.css

These two commands create two new files, combined.js and combined.css, each holding the contents of the JavaScript and CSS files, respectively. With that, we are now ready to give the YUI Compressor something to…well…compress.

Minification

Now we can send YUI Compressor to work to give us a nicely minified JavaScript and CSS files:

java -jar ../tools/yuicompressor-2.4.2/build/yuicompressor-2.4.2.jar -o ../www/js/bikenav.min.js ../www/js/combined.js
java -jar ../tools/yuicompressor-2.4.2/build/yuicompressor-2.4.2.jar -o ../www/css/bikenav.min.css ../www/css/combined.css

This will create bikenav.min.js and bikenav.min.css in their respective directories, based on the concatenated files created in the previous step. With some additional output and commenting as well as deleting the concatenated files after minification (since we don’t need them any more after that) the final bikenav_build.sh script looks like this:

#!/bin/bash

echo "Custom BikeNav build script"
echo "==========================="

echo "Step 1: rsync files from web directory"

rsync -avz --exclude 'index.html' --delete ~/Webroot/BikeNav/ ../www/

echo "Step 2: minify JavaScript and CSS files"

echo "=== JavaScript ==="
echo "concatinating files"

cat ../www/js/one.js ../www/js/two.js ../www/js/three.js > ../www/js/combined.js

echo "minifying files"

java -jar ../tools/yuicompressor-2.4.2/build/yuicompressor-2.4.2.jar -o ../www/js/bikenav.min.js ../www/js/combined.js

echo "removing combined.js"

rm ../www/js/combined.js

echo "=== CSS ==="
echo "concatinating files"
cat ../www/css/one.css ../www/css/two.css > ../www/css/combined.css

echo "minifying files"

java -jar ../tools/yuicompressor-2.4.2/build/yuicompressor-2.4.2.jar -o ../www/css/bikenav.min.css ../www/css/combined.css

echo "removing combined.css"

rm ../www/css/combined.css

Step 4: Integration into iOS Build Settings

Now that we got our build script ready, we need to integrate it into the build process of our project in Xcode. The following instructions are based on the Xcode 4 user interface.

1. After opening the project, make sure that the “Project Navigator” view is selected
2. Select the top level project, in my case it would be BikeNav
3. In the project editor window, select the target, BikeNav in my case
4. Select “Build Phases”
5. In the lower right corner, select the + sign labeled “Add Build Phase” and select “Add Run Script”

After going through these steps, a new bar in the sequence of Build Phases will show up labeled “Run Script”. Because we want to run our build script before any data is copied onto the simulator or device, we need to move it up in the sequence (I put it right after “Target Dependencies”). Now we only need to specify the path to the build script and how to run it. Therefor, in the text area inside that “Run Script” phase, I put the following:

cd /Users/komenda/Documents/PhoneGapApps/BikeNav2/scripts
./bikenav_build.sh

For better illustration, have a look at this screenshot, showing how that “Build Phase” section should look like after you added our build script.

Step 5: Testing

To test whether everything works correctly, build and run your project either on the iOS Simulator or an actual device. To verify that the script is being run, select the “Log Navigator” in the Xcode UI and then “Build [Projectname]” in the left sidebar. In the “Build target [projectname]” section in the log output you should see an entry “Run custom shell script ‘Run Script’”, which should show the familiar commenting messages we put in the shell script.

As a sidenote, of course in order to use the minified files, these need to be properly referenced in the index.html of your project.

The adventure began with an orientation meeting of the participants with our two guides, Maryanne and Nick, at the REI store in Henderson, NV, about 15 minutes away from the Las Vegas strip by car. While we got to know each other, the guides gave us a run-down of the next 3 days, what to expect and go over the logistics.

One word about the weather: Death Valley is usually associated with sauna-like temperatures and one would not necessarily think that booking a cycling trip to go there is necessarily a pleasant way to spend your free time. While this might be true of the summer months, winter usually presents itself with more moderate temperatures with highs in the mid 70s and lows around freezing at night. This time, it turned out to be a little cooler and a little windier than usual, which luckily in the end did not turn out to be much of a problem. A much colder front had already passed through the area a day before we headed out to start our adventure Friday morning.

Day 1: Drive to Scotty’s Castle, ride to Stovepipe Wells

The whole group (11 participants, 2 guides) met in Henderson at 7am on Friday and we hit the road in the REI van, with our bikes on top (I opted for renting a Giant Defy 2 from REI for $150 for the trip) and our luggage in the trailer in the back. We headed Northwest, past Vegas and Mt Charleston towards the Northeast entrance of Death Valley, with stops in Indian Springs and Beatty. After about 3 hours, we made it to, Scotty’s Castle, our (driving) destination for the day. While Maryanne and Nick prepared our bikes and lunch, we took a tour of the castle. It was ok, although I felt that most people were anxious to finally get on their bikes and ride.

Lunch was quick and once everyone got changed into their bike gear and transformed into “Weekend-Lance-Armstrong-Wannabies”, we were ready to go. This first ride took us over 44 miles of Death Valley vastness and coming here for the first time, it certainly was a great opportunity to take in the scenery with the valley spreading out to the left and right of the road until the plain makes way to the mountain ranges. The ride was mainly downhill with an elevation loss of close to 3,500 feet, with just a few minor uphills in between. With the wind also working in our favor, the ride turned out to be a nice cruise to Stovepipe Wells, where we checked into Stovepipe Wells Village Hotel, our quarters for the next 2 nights. After dinner at the local Toll Road Restaurant, everyone was pretty much ready to hit the pillow and get a good night sleep before day 2 of our adventure.

Day 2: Furnace Creek to Badwater Basin

We started the day by meeting over breakfast at 7am and then driving to Furnace Creek about 30 minutes away, which was our starting point for ride #2. Even though it was less mileage than ride #1, it turned out to be a little bit harder, due to doing a loop through Artist’s drive and up to the viewpoint at Artist’s palette. The rest of the way to Badwater Basin, however, was a blast and supported by tailwind, I reached a max speed of 40 mph on one of the straight downhill sections. Arriving at Badwater was beautiful, with clear skies and the massive salt flat spread out in front with the mountain range holding Dante’s View (which we were supposed to go up the following day) in our backs. As soon as everyone had made it to the Basin, we ventured out into the salt flat, took pictures and relaxed from the 30 mile ride, followed by lunch overlooking the Basin.

Using our trusty support van, we then made our way back to Stovepipe Wells, however stopping at the Mesquite Flat Sand Dunes to play in the sand and have some fun. The wind picked up a bit, so it was not as pleasant as we initially hoped so we could maybe stay until dusk, but we still managed to get a few runs in with the sandboards our guides had brought with them.

Back at the hotel a much needed shower back at our hotel followed by dinner and a drink at the Badwater Saloon concluded day 2 of the trip. Everyone seemed to be a bit sore after 2 days of cycling, however Maryanne and Nick saved the biggest challenge for the last day.

Day 3: Dante’s View

Sunday morning, we got up to an early start, checked out and said goodbye to the Stovepipe Wells Village Hotel and headed back to Furnace Creek for breakfast. The weather forecast wasn’t lying when it had predicted chilling temperatures in the 40s in the morning, however the skies were clear and the sun shining brightly. Not many reasons to complain. We then drove to the junction of Hwy 190 and Furnace Creek Wash Rd, via Zabriskie Point, where Maryanne dropped me and Stefan, a fellow rider, off so we could conquer Dante’s View, a 13 mile stretch with an elevation gain of 3,400 feet. The rest of the group got dropped off at mile 7, so they did not have to do the full length of the way up. Up to their drop off point, the ride was actually pretty mellow with a steady grade of around 4%. After that, however, the incline increased up until mile 12 and for the last 0.7 miles (switchbacks) went up to an intimidating 23%. With a lot of cursing and sweating, I finally reached Dante’s View at 5,475 feet and was greeted with incredible views of Death Valley, Badwater Basin below, snow-covered mountaintops in the East and even Mt Whitney in the distance. Absolutely gorgeous. Certainly the highlight for me on this trip. A speedy descent down the mountain brought us back to where we started and at a close by rest stop area we had lunch before we made our way back to Henderson via Pahrump.

Thoughts on the Trip

When I had initially booked the trip, I was not really sure what to expect apart from the info that one can get from the REI website about the itinerary and the daily mileage. And, of course, the fact that you are going to Death Valley. My experience with REI had always been great each time I walked into one of their stores and the fact that the trip was not exactly cheap, I figured REI will live up to its reputation and deliver. And they did. Very much so.

Maryanne and Nick were fun, energetic, organized, supportive and just great to be around and hang out with. It certainly showed their experience of having done 30+ trips that year alone. The average age of the participants was way above mine, but we all got along pretty well and had fun together while sharing this experience. The rides felt more catered towards leisurely riders as well, however, as one of my fellow participants pointed out, “You can make any ride hard. Just pedal faster.” So from my perspective all 3 rides provided the opportunity for decent workouts, certainly the last one up Dante’s View, and since everyone was allowed to go at their own pace, everyone was able to get out of it whatever he or she wanted to.

To conclude, this trip met and in parts exceeded my expectations, I had a lot of fun and would certainly recommend this trip to others who would like to experience Death Valley not from an air conditioned car but from their bike saddle.

Resources

• Ride 1: Scotty’s Castle to Stovepipe Wells
• Ride 2: Furnace Creek to Badwater Basin
• Ride 3: Dante’s View
• Death Valley Cycling (trip details on REI website)
• Trip photos on Flickr

Ever since picking up road biking a few months ago, I fantasized about doing a multi-day bike tour in the not so distant future. Adventure Cycling and REI (among others) offer a variety of tours with different difficulty levels, lengths and, of course, locations. In order to get in the mood (and training state) for such a trip, I felt it would be good to get a few longer and intense rides under my belt. The combination of great air fares and the fact that I found out that one can actually ride up Haleakalā on Maui, led me into booking a trip to the second-largest of the Hawaiian Islands for mid November. And so I found myself on a beach in Pāʻia in the early morning hours of November 15, in full cycling gear and my Specialized rental bike leaned against a tree nearby—it was time to rock n’ roll.

The following is a description of my own experiences while riding up the volcano, however if you are looking for an even more detailed trip report, I encourage you to visit Mike Jacoubowsky’s definitive guide for riding up Haleakalā.

Starting Out

The adventure started with tipping my toe into the water of the Pacific Ocean, a nice symbolic ritual and it underlines that this ride starts at 0 elevation. After a few pedal strokes, I left the small town of Pāʻia, the official start of the ride. For quite a while, the sides of the road are lined by farmland on one side and little housing and small businesses on the other. But with every minute, the area gets less and less populated. Due to the amount of rainfall this part of the island gets, there is green all around.

After riding for about 6.5 miles and climbing roughly 1,500 feet, I reached the town of Makawao, more than double the size of Pāʻia, with quite some shops and lunch places along Baldwin Ave. After the intersection with Makawao Road, Baldwin Avenue becomes Olinda Road which greeted me right away with a steep 13% climb of around 300 feet in length (which is probably the steepest section of the whole climb, so be relieved to get that out of the way at the beginning).

At the 8 mile marker, I made a right turn onto Hanamu Road, avoiding to continue riding on I-390 and eventually reaching a dead end. So not missing that turn is quite imperative. From Hanamu Road I connected to I-377 (or Haleakala Hwy) via the short Kealaloa Ave. For the next 4 miles, I admired the lush of green to both sides of the road and great views of West Maui, while I was climbing and climbing and climbing…. Conquering that stretch, the area showed signs of civilization again when I reached settlements that are part of the Kula region. The sign for Haleakala National Park, which I have been waiting for finally manifested at mile marker 14 and about 3,400 feet of elevation, directing me onto Crater Road and further up the mountain.

Crater Road

The next 7 miles were what seemed like a never-ending string of switchbacks, first meandering around nice residential areas but only after 2 miles presented me with wide open space. During that 7 mile section, you are climbing up about 2,300 feet and reaching 5,700 feet after a total of around 21 miles. I reached that point after roughly 3 hours (to put that in perspective, the fastest rider in the 2011 Cycle to the Sun bike race was already enjoying the views from up top for 11 minutes at that time).

A pretty much straight climb to 6,500 feet over about 3.3 miles brought me to a right bend with lots of forest and vegetation before reaching another milestone: The Haleakala National Park entrance (where I paid my $5 entrance fee) at 6,700 feet and a total of just over 24 miles. 11 miles and 3,300 feet of climbing to go. You have either the option to fill up your water bottles at the entrance (water hose at the back of the building) or at the Haleakala National Park Headquarters Visitor Center (restrooms with water fountains on the left side of the building), which is about 1 mile up the road from the park entrance.

Above the Clouds

From here on out, there were 8 more turns (stretched switchbacks) between me and the final stretch to the top. The vegetation grew more and more sparse with every feet of elevation and the views more and more gorgeous (above the line of clouds at this point) as I climbed further towards the summit. 7.7 miles of gruel climbing up to 9,200 feet, with rest stops about every 500 feet finally brought me to that last stretch where you feel real close to the top (the operative word is “feel”).

At 9,800 feet your mind might trick you into thinking you are already there (with the parking lot of the Haleakala National Park Visitor Center to the left), but no, there is still a significant stretch to go. Actually it is only about 0.7 miles and a bit over 200 feet of climbing, but having been on the bike for 6 hours and 15 minutes, this felt like a real real hard challenge. Eventually, after a total of 6 hours and 24 minutes, I reached the summit at 10,023 feet, 35 miles away from the beach in Pāʻia where I had started this epic ride.

For about an hour I took in the scenery and surfed the waves of emotions of my accomplishment, it was then time for the equally thrilling downhill ride (for which the regular tourist type has to pay for). Luckily it was not terribly cold at the summit (mid 60s), but nevertheless I put on my arm and leg warmers as well as my wind breaker and long finger gloves and cruised down. The downhill took me about 90 minutes.

Thoughts on the ride

The ride was one of the most strenuous things I have ever attempted and is pretty comparable to hiking up Mount Whitney. Especially after 6,000 feet, the elevation starts to get to you and combined with the fact that you started out from 0 and had covered 20 miles of constant climbing already really affects your performance. At the beginning I had teamed up with another fellow rider, John from Vancouver, B.C., whom I had met in the public parking lot in Pāʻia. Having done a couple of triathlons and Ironmans, I was not really a match for his speed, so we split up after about 1 hour of riding to keep going at my own pace, which was definitely important.

The traffic was surprisingly heavy at the beginning of the ride in the Pāʻia and Makawao area, died down a bit and picked up again fueled by tourists driving up the volcano. In general I found it to be fine, unfortunately with the occasional driver coming a little too close, but luckily it worked out without incident.

As Mike points out in his guide, it is pretty important to pick a nice day for the ride. I had kept a close eye on the forecast when heading to Maui and the day right after I got there turned out to be the best one with sunshine and clear skies pretty much all the way. You certainly want to try to avoid a day with rain or fog.

In terms of food and drinks, I brought multiple energy bars and gels with me, as well as Gatorade powder sticks, which make it real easy to turn regular water into an electrolyte-rich sports drink. There are certainly ways to stock up on food along the way (in Pāʻia or Makawao, as well as the Sunrise Country Market on Crater Rd), but the only time I filled up my 2 25oz Camelbak Podium Big Chill bottles was at the Park Headquarters Visitor Center.

Bike Rental

Instead of bringing my own bike, I ended up renting a Specialized Secteur Comp from Island Biker Maui, which came to a total of $200 for the whole week (which would have included a bike rack, that I did not end up needing since Alamo upgraded me to a minivan). It included a pump, a island biker maui branded water bottle, 2 bottle cages, flat repair tools, a spare tube and a Specialized helmet.

I ended up going with them since I ride a Specialized at home and they turned out to be the cheapest option for a weekly rental. When I did my research, I also found these other options which may or may not suit you better (prices are per December 2011):

• Maui Cyclery (99 Hana Hwy, Paia, HI 96779): Scott Speedster S20 ($45/day, $220/week)
• West Maui Cycles (1087 Limahana Pl, #6, Lahaina, HI 96761): Specialized Performance Road Bike (1 day: $60, 3-6 days: $50/day, $220/week), Auto Bicycle Carrier (1 day: $5, 3-6 days: $3/Day, $15/week)
• Maui Road Bike Rentals by Boss Frog’s (locations in Kihei and Lahaina): Fuji Aero 3.0 SST ($50/day, $200/week), bike rack ($15/week)

Resources

• Ride data on Garmin Connect
• Ride photos on Flickr
• Mike Jacoubowsky’s definitive guide for riding up Haleakalā
• Jeremy vs the Volcano
• Another great ride while on Maui: West Maui Loop

The iSpeech demo page gives you an idea of the power of the API by providing a regular text input and being able to turn any text into spoken words. Let’s have a closer look now as to what is required to make this work in a web application.

Step 1: Sign up for a Developer Account and set up an API key

Signing up for a developer account is a requirement in order to use the API. After creating your account and logging in, you can create a new API key. Fill in the form and select “Desktop, Web, Other” as the application type in order to be able to use iSpeech’s REST API.

Step 2: Trying out the API

After creating an API key, you should find it in your list of available API keys. Clicking on “Settings” leads you to a form where you can set certain parameters for the text-to-speech functionality, like file formats, bit rates and frequency as well as add some more information about the app that uses the key. For this step, we just want to try out the API and get some text converted into speech, so the first thing we need to do is familiarize ourselves with how the API request is constructed. iSpeech provides good documentation on that and gives us the general layout of the request:

http://api.ispeech.org/api/rest?apikey=YOURAPIKEYHERE&action=convert&text=This+is+the+text+I+want+to+convert

Now we only need to replace YOURAPIKEYHERE with the API key we created in Step 1 and copy that request URL to the address bar of our browser or create an HTML5 audio element like the one below to embed in our HTML document.

Step 3: Tweaking the Request Parameters

The attentive reader might have noticed, from looking at the source code of the audio element in step 2, that we need to provide several fallback versions in addition to the MP3 format that the iSpeech API generates by default. This is necessary to satisfy the different codec requirements by modern browsers. To achieve this, the iSpeech API has a format parameter, that lets us specify the format in which we would like the audio piece to be returned to us. A complete list of supported formats can be found in the iSpeech API documentation.

If we want to use the Ogg Vorbis format, we can specify this like this:

http://api.ispeech.org/api/rest?apikey=YOURAPIKEYHERE&action=convert&text=This+is+the+text+I+want+to+convert&format=ogg

We can also specify a different voice using the “voice” parameter:

http://api.ispeech.org/api/rest?apikey=YOURAPIKEYHERE&action=convert&text=This+is+the+text+I+want+to+convert&format=ogg&voice=auenglishfemale

It is also possible to slow down the voice by providing a “speed” parameter with values between -10 (very slow) and 10 (very fast). However I noticed that not all voices provided by iSpeech support this parameter.

http://api.ispeech.org/api/rest?apikey=YOURAPIKEYHERE&action=convert&text=This+is+the+text+I+want+to+convert&format=ogg&speed=-5

Sounds great (literally), but…

By this point it is probably obvious that being able to use this text-to-speech API from within HTML documents using regular web technologies is pretty powerful. However, there is a catch to it in the name of costs. The web API key that we created is free for the first 500 words being transformed to audio by the API (you can check your key’s total word balance on the settings page of the key). If you exceed that limit, you have to pay, $50 for 1000 word credits to be exact, which essentially means that you can only feasibly use this API in some sort of premium app setting where your revenue generated can cover for these costs. While I would love this technology to be free, I can understand that it is not, considering the amount of work that goes into developing such piece of software.

The upside is, however, that iSpeech in addition to the REST API also offers SDKs for pretty much all popular mobile platforms, such as the iPhone, and API keys generated for these do not have any word quota imposed on them. Maybe another good reason to start learning Objective-C.

Step 1: Sign up for a Developer Account and get an API key

CloudMade lets you sign up for a developer account for free. After completing that initial step, access your account and click on the “Get API Key” button. Fill the details into the form presented to you, selecting “Web” as the platform and the “Free” pricing plan. Since we will not use any of the other features the API provides, the free version has more than we need.

Step 2: Create a token from your API key

In order to be able to communicate with CloudMade’s servers, you need to create an access token from your API key. This is done by sending an HTTP POST request to a particular authentication server as noted in their documentation. If you are using PHP, the following code can help you out (using Wez Furlong’s do_post_request function).

$apiKey = 'my-api-key';
$userId = 'your-generated-user-id';

// http://wezfurlong.org/blog/2006/nov/http-post-from-php-without-curl/
function do_post_request($url, $data, $optional_headers = null)
{
  $params = array('http' => array(
              'method' => 'POST',
              'content' => $data
            ));
  if ($optional_headers !== null) {
    $params['http']['header'] = $optional_headers;
  }
  $ctx = stream_context_create($params);
  $fp = @fopen($url, 'rb', false, $ctx);
  if (!$fp) {
    throw new Exception("Problem with $url, $php_errormsg");
  }
  $response = @stream_get_contents($fp);
  if ($response === false) {
    throw new Exception("Problem reading data from $url, $php_errormsg");
  }
  return $response;
}
$token =  do_post_request('http://auth.cloudmade.com/token/' . $apiKey . '?userid=' . $userId, '');

echo "generated token: " . $token;

Step 3: Requesting POI data along a given route

Equipped with the token from Step 2, we can now try to retrieve POIs along the route. The following example would do a search along the route for a maximum of 20 points of interest of type “cafe” from my place to Cupertino, within a radius of 1 kilometer and returning the data in JSONP format.

http://geocoding.cloudmade.com/[APIKEY]/geocoding/v2/find.js?token=[TOKEN]&object_type=cafe&along=37.36721,-122.03533,37.36756,-122.0354,37.36752,-122.03662,37.36672,-122.03607,37.36642,-122.03648,37.36429,-122.03288,37.33911,-122.03241,37.33763,-122.03239,37.32283,-122.03241&distance=1000&results=20&callback=mySuperCallback

The find method of the Local Search API lets you pass in various parameters, which are well documented. For the purpose of this article, the following are the most important ones:

• object_type: the API lets you choose from an extensive list of point-of-interest types
• along: vector of the route your are traveling along, i.e. a comma separated list of lat/long pairs
• distance: radius of the search are in meters
• results: number of results to return
• callback: signaling the server to return the response in JSONP format and specifying a publicly accessible JavaScript function to execute, passing in the response data

The result from the above request will come back as JSONP and look similar to the following:

mySuperCallback({
    "found": "3",
    "bounds": [{
        "json": ["37.33155", "-122.03642"]
    }, {
        "json": ["37.36805", "-122.03266"]
    }],
    "features": [{
        "id": "7367785",
        "centroid": {
            "type": "POINT",
            "coordinates": ["37.36768", "-122.03642"]
        },
        "bounds": [{
            "json": ["37.36768", "-122.03642"]
        }, {
            "json": ["37.36768", "-122.03642"]
        }],
        "properties": {
            "operator": "Starbucks",
            "osm_element": "node",
            "amenity": "cafe",
            "synthesized_name": "Cafe",
            "osm_id": "266625630"
        },
        "type": "Feature"
    }, {
        "id": "26073213",
        "centroid": {
            "type": "POINT",
            "coordinates": ["37.33155", "-122.03266"]
        },
        "bounds": [{
            "json": ["37.33155", "-122.03266"]
        }, {
            "json": ["37.33155", "-122.03266"]
        }],
        "properties": {
            "osm_element": "node",
            "amenity": "cafe",
            "name": "Bagel Street Cafe",
            "osm_id": "957085286"
        },
        "type": "Feature"
    }, {
        "id": "14342531",
        "centroid": {
            "type": "POINT",
            "coordinates": ["37.36805", "-122.03338"]
        },
        "bounds": [{
            "json": ["37.36805", "-122.03338"]
        }, {
            "json": ["37.36805", "-122.03338"]
        }],
        "properties": {
            "osm_element": "node",
            "amenity": "cafe",
            "name": "Peet's Coffee",
            "osm_id": "441987522"
        },
        "type": "Feature"
    }],
    "type": "FeatureCollection",
    "crs": {
        "type": "EPSG",
        "properties": {
            "code": "4326",
            "coordinate_order": ["0", "1"]
        }
    }
});

In our mySuperCallback function we can then use this data to e.g. plot each of the returned points of interest on a map, in addition to the given route.

Be aware of long routes

Attentive readers will notice that there is a slight flaw in the way the request is constructed. If you have a long route with a lot of waypoints that you are passing along in the request to the search API, at some point you will reach the limit of the maximum amount of characters you can pass along in a URL. One way to mitigate this is to drop every other entry from the array of waypoints if the number exceeds a certain limit. That way, the search will still be somewhat accurate (since you are only taking out points in between instead of cutting them off at the beginning or the end). A JavaScript example code could look like this:

maxWaypoints = 160; // a good threshold that I noticed works well for BikeNav
waypoints = [ ... ]; // array where each entry represents a waypoint along the route
no_of_waypoints = waypoints.length;

if (no_of_waypoints > maxWaypoints) {
    while (waypoints.length > maxWaypoints) {
        for (var i = 0, len = waypoints.length; i < len; i++) {
            waypoints.splice(i + 2, 1);
        }
    }
}

A couple of weeks ago I got contacted by someone from Bicycling Magazine, which has been providing the bike community with bike gear and equipment reviews, training plans, maintenance how-to’s and more for 47 years, that they would like to feature my application in their December issue. This was great news and really the best thing that could have happened, considering the state the development process was in. I had hit some technical difficulties when working on an update version of the application back in May and combined with higher load at work and less free time, I had lost interest a bit in improving the application. The interest from the magazine, combined with the news that the piece will be contributed by Ray Maker (whose blog should be your #1 destination if you are interested in any kinds of gear reviews when it comes to outdoor and endurance sports), gave me the spark that I needed to continue working and improving the app.

Motivated by this attention that I had received, I spent huge chunks of my spare time since to improve the app, which led to the release of version 2 of BikeNav on pretty much the same date—incidentally—as the publish date of the December issue of Bicycling Magazine. And just today I was able to pick up a copy and found, with great joy, a little paragraph about my app in the upper right hand corner on page 20. Nothing big. Nothing fancy. But still something.

BikeNav 2.0: The tech details

What was holding me back a little bit since the release of version 1 was that I was an earlier adopter of jQuery Mobile, having used their first alpha release for my initial version. The upgrade to a more stable version always seemed too painful and time consuming and so I kept adding hack after hack on top of an understandably buggy (in parts) version of the framework. In addition, I was also using a 0.9.x release of phoneGap to power BikeNav.

With version 2, both of the frameworks were upgraded to their most recent version. In addition, I also gave the application a bit of a UI overhaul, abandoning the black & white look from the initial version and introducing a new splash screen, updating the logo to feature a blue color tone instead of black and cleaning up the interface in general. I also introduced new features, like the ability to search for points of interests along a route using the CloudMade’s Local Search API and being able to add custom location pins to the map.

The attention that I got from the magazine and from the occasional user who emails with his feedback certainly motivates me to keep working on BikeNav. In addition to being a very useful app for bicyclists, it is also a great playground for me to see how far I can get with the hybrid mobile application approach, where the majority of the heavy lifting is done using web technologies.

So if you are a cyclist and haven’t checked out my app, please do so. And after you are done, feel free to send me feedback.

Start early

Trying to beat traffic and warm weather, I arrived at the “start” at the junction of Diablo Rd and Mt Diablo Scenic Blvd around 9am. I made my way up the mountain just after a group of 10 to 15 riders (presumably from a local bike club, judging by their matching outfits) had passed the parking area and were zooming up the road. The first mile or so leads the rider through a residential area with the road surface being unworthy of this great ride. One has to dodge manhole-sized potholes and you wonder whether you should have brought your mountain bike instead of your lightweight road machine with skinny tires. But after this weird start, the surface gets smoother and the long uphill climb begins.

After climbing up for about 3.6 miles and enjoying views of the East Bay on the right, you reach the South Gate Checkin Station of Mount Diablo State Park, which you pass on the right and where you will also find an opportunity to fill up on water. The path flattens a bit and you continue on South Gate Road for 3.1 miles, passing the large sandstone formations of Rock City along the way and the views getting more and more beautiful the higher up you go.

A popular resting spot to give you some time to relax your muscles and prepare you for the last stretch to the summit is Junction Ranger Station at 6.7 miles. On a nice weekend day and great conditions for riding up the mountain, this place is buzzing with people. The rangers are also trying to make an effort to make you aware of your duties as a bicyclist when going up on this multipurpose road to the summit with a display window filled with signs like: “220. The number of curves on the paved roads of Mount Diablo State Park. Don’t pass on one of them or you may be the next accident.”.

Home Stretch

[...] that killer section at the very end is a religious experience!

Mike Jacoubowsky, Chain Reaction Bicycles

The grade picks up a bit now on what is called Summit Road, with a few flatter passages in between while you are passing several campground parking lots as well as scenic overlooks for folks who like to conquer the mountain by car. Eventually, after being teased by views of the summit for quite some time, you will reach the last, steep stretch of road, about 700 feet long, which will shoot up your heart rate and suck the last bits of energy out of your body. Pat yourself on the back at the top if you made it up there without stopping, catch your breath and enjoy the magnificent views at the top.

While you are up there, lean your bike against one of the railings and check out the Summit Museum to stand on the actual summit of Mount Diablo and learn a bit about its history and wildlife. Should you feel inclined to financially support the park, there is also a small store inside the museum building.

Logistics

I parked at the Athenian School, which is right off of Mt Diablo Scenic Blvd and has a nice big parking lot right across from the soccer field next to the entrance. It is also the location where the annual Mount Diablo Challenge starts.

It is advisable to not do this ride in the midst of Summer, since the road is pretty much exposed to full sunlight the whole way. I started around 9.30 in the morning and while it was sunny, the temperature was in the mid 70s with a slight breeze when getting further up the mountain. I carried 2 water bottles (16 oz. and 20 oz.) and emptied both of them on my way up, however there are options to fill up on water along the way at either the South Gate Checkin Station (at 3.6 mi) or the Junction Ranger Station (at 6.7 mi). A good idea is also to bring a bottle of sunscreen, maybe a clif bar or two and a light jacket to wear on the descent.

Resources

• Ride data on Garmin Connect
• Ride pictures on Flickr
• Mount Diablo Challenge road race
• Trip report from Mike from Chain Reaction Bicycles

Vancouver fan

I fell in love with the city of Vancouver well before I ever set foot on Canadian soil for the first time. Being constantly mentioned as one of the cities with the highest quality of living and featured in many travel magazines, I wanted to visit this place ever since I was a teenager. The portrayal of Canada being the underdog compared to its neighbor USA and Canadians being nice and friendly folks in the media (in Austria, at least) certainly sparked some of that interest.

In 2005, after interning in NYC for 6 months, I finally got to see Canada’s eigth-largest city. And one thing that I noticed right away was that, even though it was August and the hockey season well over, hockey was still dominating the headlines. Incidentally, I got there right at the time when then-Canucks winger Todd Bertuzzi was allowed to lace up his skates again after initially being suspended indefinitely by the league for his behavior during the Steve Moore incident. And the fact that, in the mid of summer, hockey made front page of both The Province and Vancouver Sun, was a clear indication as to how crazy this town really is about hockey. After touring GM Place (which would later be renamed to Rogers Arena), I was pretty much set that if I am going to support one NHL team, it will be the Canucks.

I was fortunate enough to come back to visit “Rain City” (Vancouver averages about 1200mm of rain per year) a couple of times after that and catch a few regular season games, since when would you ever get a chance to see NHL hockey up close in personal when living in Europe. When I moved to California end of 2008 however, I was able to start following the game much more closely than from overseas. I still can’t quite fathom why people would want to play hockey in places like San Jose or Phoenix (cause neither place has seen or ever will see a natural outdoor pond frozen over), but nevertheless, I still find hockey the most interesting of all major North American sports.

Stanley Cup Final 2011, Game 5

Fast forward to June 2011: Vancouver made its incredible run to reach the Stanley Cup Final and I had decided to visit my good friend Preet to watch game 5 at one of the many public viewing areas downtown. By some luck and the help of craigslist, I was able to score an actual ticket for the final, which did cost me quite some money, but in the end I felt that the chance of going to a Stanley Cup Final game might not come around again that often.

The atmosphere at the game was phenomenal, goose-bump-inducing in fact as you might be able to tell from the photos and videos I posted on Flickr. “I have been to 5 playoff home games so far, and each time the Canucks won” Michael, the guy in the seat next to me told me. Interestingly, he, a Victoria native, also got his ticket on short notice from craigslist on that very day. And Michael proved the be the lucky charm again this time with Maxim Lapierre scoring the only goal in the contest 4:35 into the third period. Needless to say, the city went crazy after the victory and my hands hurting the next day from high-fiving dozens of other Vancouver fans around the stadium and in downtown.

Despite all the optimism amongst Canucks supporters however, this turned out to be the last win for Vancouver in the final and Boston snatching the series 4-3.

Looking forward

All of this, nevertheless, is history now.

The new season has just started with Vancouver losing their first game against the Pittsburgh Penguins, EA Sports’ pick to hoist the cup in June 2012, in a shootout. Can the Canucks do what they did last year plus one more win? From what I have read, very few experts have Vancouver on their list of favorites for winning the cup. Does that mean they can’t do it? Of course not, but it will arguably be hard to top what the team accomplished last year in the regular season with winning the Western Conference, the President’s Trophy and Daniel Sedin winning the Art Ross Trophy. What can be learned from the past though is that the regular season means…close to nothing. So I guess we will have to wait until April 2012 when the playoffs start to see what the Canucks are capable of this time around. Assuming the Canucks will actually make the playoffs…but that is pretty much guaranteed, right? Right?

If the climbs featured in the rest of the East Bay rides just haven’t been steep enough or long enough for you, then you should really consider a trip to good old Mount Diablo, the tallest park in this region known for its leg-crushingly steep climbs.

Skye Kraft in his book on mountainbiking in the San Francisco Bay Area

I had neglected my mountain bike for the past couple of months ever since I got bitten by the road riding bug that has led me to do some memorable rides. This weekend, however, I decided it was time to give the heavy guy a spin. The challenge: Mount Diablo, the Eagle Peak Loop to be precise, a ride which I had picked from Skye Krafts exceptional mountain bike guide book.

The drive in the morning from the South Bay to the Mitchell Canyon entrance of Mount Diablo State Park took me about 1.5 hours. Considering that the guide book says that weekend trail traffic can be quite high and the fact that the weather forecast predicted high 80s temperatures in the afternoon, I decided to go early and got there around 9:45am. Usage fees had apparently doubled to $6 per car since Skye last visited the park, but I find it still incredibly cheap considering the size of it.

Easy Start

Before heading up the mountain, I noticed some event noise from the main parking area (I had parked in the equestrian lot apparently) and found out that there was a trail run event going on. On my way up Mitchell Canyon Fire Road, I encountered several runners coming down the mountain, some of which I tried to encourage by noting “Almost there! Only about a mile left!”.

The first part of the ride was pretty relaxed with only a few very moderate climbs, but after about 3 miles I got to the steeper sections, most of them, luckily and thanks to the still rather early hour, were shaded and not as hot as they probably would have been in the afternoon sun. I have to admit that I stopped a couple of times, primarily because I was out of breath and second to snap a few pictures of the great scenery. A humorous park ranger, who passed me in his off-road vehicle, remarked that, like salmon, I was heading the wrong way (compared to the runners who were heading down the mountain). You gotta love your park officials.

After about an hour of riding, I reached Deer Flat, a small plateau at 2120 feet. “The worst must be over”, or so I thought. Boy, was I wrong. The steepest parts of the ride were yet to come. After conquering the first one, I simply ran out of traction on my rear wheel on the dirt road terrain and a grade of about 12%. It took me a couple of tries to get going again without having to put me feet down immediately. Eventually I made it and stopped, abandoned my bike for a few minutes and hiked to the top of a little sister peak of Eagle Peak. Great views and astonishingly great visibility.

Downhill Thrill

“Coming down [the trail] must be fun!” one of the runners had said to me on my way up. Since I was pretty much at the highest point of the ride, that very downhill came up next. Something I always look forward to (duh, who doesn’t). The way down was actually pretty challenging and 2 hikers even warned me (in a way) of some steeper sections coming up ahead by saying “Good luck down there!”.

Finally, I managed to come all the way down, with lots of rear wheel skidding, but no falling down. Needless to say I got so excited by the downhill, that I went too far on Donner Creek Road, that I “missed” my exit, so to speak (the poor signage in that part of the park added to my confusion). Ultimately, I found my way back to the parking lot only to find a piece of paper pinned underneath my windshield wipers. Not a ticket, but a flyer advertising upcoming Street Scramble events. Maybe I should try that next time…

Resources

• Ride data on Garmin Connect
• Ride photos on Flickr
• Mountain Bike! San Francisco and the Bay Area by Skye Kraft

We had set the alarm clocks for 6:30am, with the intention to be the first ones at the complimentary breakfast and then embarking on our adventure. Considering we stayed at a rather cheap motel close to the California/Nevada state line, I was not expecting much, but a (styrofoam) bowl of cereal, a cup of orange juice and a banana would have had to suffice. And so, at 7:37am, we started into the fresh morning air and with the circumvention of Big Blue.

Tires roll

“Definitely cold!”, my friend Ethan noted and yes, compared to the night before, when we had arrived at Lake Tahoe, temperatures had dropped significantly and showed about 45 Fahrenheit by 7am. But preparation is everything, and prepared we were with windbreakers and mittens. The forecast for Saturday had not looked that promising initially, but we started with partly cloudy skies literally no wind. The 20% chance of precipitation were just too low to take serious, we decided.

About 20 minutes into the ride, we took a right turn, leaving Hwy 50 behind us and making our way towards Emerald Bay, the first of two significant climbs along the route, as I had meticulously noted on my to-scale map/sketch of the route. Halfway between the turning point and Emerald Bay, we got overtaken by a fellow cyclists, who greeted us with a brisk but collegial “Morning!” between bikers. All dressed in Lance Armstrongs LIVESTRONG gear from head to toe and quadriceps the size probably comparable to Lance’s, he passed us with seemingly no effort. However, he turned around and went back the other way shortly after and so we were on our own heading up and then down to Emerald Bay, only to have to climb back up again for the descent towards Meeks Bay. By that time, we had already gotten rid of all the other layers that we had put on and were just riding in shorts and short-sleeved jerseys.

Cruising along

Apart from a little climb at the Rubicon Park Estates, the road was now relatively flat and we were cruising along Hwy 89. Then the first beach view at Chambers Landing, an invitation we decided to postpone until after the ride and time for a little break. 2 hours and 20 minutes and 52 km (32 miles) into the ride, we arrived at the junction of Hwy 89 and 28, where we watched water flowing out of the lake at its only outlet at the Lake Tahoe Dam. Being on the road for 2 hours and 45 minutes and pretty much halfway around the lake, we took a well-deserved lunch break on a pebble beach at Carnelian Bay. While we indulged ourselves on Clif Bars, Gatorade and GU Energy Gels, we enjoyed beautiful vistas of the lake, in almost spotless sunny skies, while people were out paddle boarding or playing with their dogs on the beach. “Holy cow, we are lucky with the weather so far”, I commented on our pretty fortunate situation at this moment.

Relaxing felt good, but after resting out muscles for about an hour, we continued our journey, passing through Tahoe Vista and Kings Beach and reached the California/Nevada border on a climb at Crystal Bay. We were welcomed not only by great views of the bay itself, but by casino establishments right, left and center. Reaching the other side of the bay, we noticed really for the first time the cleanliness of the water in the lake, luring us into jumping in. But no no, we had something to finish first.

Hurtin’ in Nevada

Lake Tahoe Nevada State Park, which we passed through shortly after while still on Hwy 28, presented us with lake views of unbelievable beauty, hidden, tucked away beaches with water so clear that you would think you are on some island in the Caribbean. Stopped briefly at an overlook with restrooms and a chance to fill up on water, we mentally prepared ourselves for the second big climb yet to come, up towards the junction with Hwy 50. Not really knowing what to expect, the climb proved to be steady and not too steep, but stretched over 8 km (5 miles), an elevation gain of roughly 200 meters (656 feet), with a dip in between. After 87 km (54 miles) on the bike, ascending that much in the mid-day sun, totally exposed turned out to be more difficult than I had anticipated. My body, starting from my lower back downwards, was hurting and my hamstrings were cursing at me for not having warmed them up properly in the cool morning.

Just about halfway up the climb I got sunscreen in my left eye, which was burning like hell, so I stopped and got passed by Ethan with a “See ya at the top!”. After some stretching, water and some energy drink, I was back on the bike and soon caught up with Ethan again to head up to Spooner Lake/Summit, where the climb finally ended. Thank god.

We didn’t know it then, but the best part was yet to come. Reaching the highest point of our tour at 2153 meters (7063 feet) meant there was nowhere to go but down. And down we went. And epic descent down Hwy 50, reaching top speeds of about 55 km/h (40 mph), even blasting through the short Cave Rock Tunnel, we were on the final stretches of our ride. However, some rolling hills were still in the way between us and the finish line, and every climb at this point was like poison for our legs. But we had to keep going, no matter what.

Climbing up one of the last ascents at Zephyr Cove meant literally turning around the corner for the home stretch towards the state border and the checkered flag. Once I saw the casinos, which I remembered from when we started, I knew that we were only minutes away. And there it was, the state line, and soon thereafter, after being out there for 6 hours and 22 minutes, we pulled in the driveway of our motel. Tired, exhausted, but happy. If only our motel room hadn’t been on the third floor with no elevator…

Trip planning

Just a few organizational aspects that are worth sharing for folks who want to do this great ride as well.

Ride logistics

We both carried two 20 oz. bike bottles with us, I had, in addition to that, my 80 oz. camelbak with me, almost filled to the top. If you are just concerned about staying hydrated, than bringing the camelbak is not really necessary, because there are plenty of options to refill the bottles along the way. I mainly wanted the some convenient way to carry clothing layers, as well as Clif bars, snacks and bike repair/maintenance stuff with me.

As can be easily figured out from the report, we did the loop clockwise, mainly because I figured that being on the side closer to the lake would account for better views and thus being able to easily stop and take pictures.

Because we had anticipated chilling temperatures in the morning, we both started out with wearing a wind breaker bike jacked, with a short sleeved jersey underneath, bike mittens and bike shorts. In addition, I was wearing a short sleeved base layer underneath. It certainly helped at the beginning, but as mentioned above, with the first climb, sun coming out and temperatures rising, we continued in shorts and jersey.

Accommodation

Coming from the San Francisco Bay Area, it was simply most convenient, i.e. closer, to stay at the southern tip of the lake, meaning in South Lake Tahoe. I picked a motel with a low price (it came out to $80 per night) and with decent reviews on TripAdvisor. Any motel will do, really.

Weather etc.

Since July and August are historically the hottest in the Tahoe Area, June or September are good alternatives with more welcoming temperatures if you are exercising outside for multiple hours. For this specific trip, which we did beginning of September, the weather turned out to be nearly perfect, with colder temperatures in the morning (44 Fahrenheit), warming up to around 72 Fahrenheit during the day and pretty much sunny up until the last hour of the ride. In the afternoon as well as the next day, thunderstorm clouds rolled in, which brought showers and cooler temperatures. So even though the temperatures get more accommodating, the weather can, unfortunately, also be a little bit more unpredictable. Before you head out to Tahoe, check the weather forecast. If you consider to take the ride as more of a stroll along the lake, with not paying attention to time too much, be sure to check how much daylight you have available and plan accordingly.

Things to do after the ride

Since we did the loop on a Saturday and were planning on heading back to the Bay Area on Sunday, there was still some time left to explore other things in the South Lake Tahoe area. If you are up for another physically demanding challenge, you can hike up Mount Tallac (from South Lake Tahoe, north on Hwy 89 three miles, left onto Fallen Leaf Lake Road. Turn right at “T” and continue to the Glen Alpine Trailhead sign and turn left). If you want to take it a little easier (like we did), you can take a ride with the Heavenly Gondola up to the top of the resort, where you can enjoy great views of the lake and the surrounding mountains. Although with prices starting at $32 for the return trip, the gondola ride might seem equally steep.

Resources

• Ride data on Garmin Connect
• Photo set on Flickr
• Another ride description on roadbikerides.com
• Tour de Tahoe: Annual organized bike ride
• South Lake Tahoe: current conditions with average temperatures per month