Every Nth Item in Handlebars

You’re all jazzed and using your favourite CSS grid but you’ve run into a wall in your Handlebars template. You’ve got a template that outputs a list of books. The problem is after every third book you need to start a new row. You’re stuck. Well… look no further I’ve got just the helper for you, grouped_each. It’s part helper, part convention. Stronger than mere mortal men.

Here’s how it works. It has two parameters. The first is the number items in each group and the second is an array of items. That’s the helper part. Now here’s the convention. Inside the grouped_each block you use the built-in each helper to iterate over this. For example look at the following Handlebars template.

And finally here’s the magic sauce that is the helper.

Integrate Handlebars with Marionette

If you need to use Handlebars with Marionette then today is your luck day! I’ve got just what your looking for. This first attempts to load pre-compiled templates, then by selector, and finally via XHR.

To customize the file extension and location of your templates when loading via XHR just override Marionette.Handlebars

Search using Geolocation data in MySQL

One of the many things brought to the forefront by HTML5 is Geolocation. It’s easy enough to get someones geolocation data using HTML5 but what do you do with it once you have it? Ideally you’d like to search through some sort of database be it store locations, real estate listings or what have your. This is where most people start to get tripped up.

There’s lots of different techniques for achieving this unfortunately they don’t seem to ever be explained very well as they relate to MySQL. Until now… dun dun dun dahhh.

The two most common technique are the Haversine formula and the Spherical Law of Cosines. The method I’ve chosen to use in my example is the Spherical Law of Cosines. The formula is a bit short and uses fewer mathematical functions.

The example is comprised of two parts. The first is the Spherical Law of Cosines. The second part is defining a search radius. Defining this search radius will significantly narrow the scope of our search. This is a good thing.

Alright enough chitchat. Here’s the sample MySQL query. It’s built in PHP below but can easily be converted to your language of preference.

Note: I’m Canadian so the example below is done using kilometers. If you want miles you’ll need to multiple $earths_radius and $surface_distance_coeffient by 0.6214 to convert them to miles.

If your interested in digging deeper into the theory and math behind the Spherical Law of Cosines or the Haversine formula checkout the Movable Type Scrips site they have tons of background information.

How to get Sencha Touch working on non-touch and touch Blackberry devices

When I needed to get Sencha Touch to work on non-touch Blackberry devices I tried the approach documented at

At first this appeared to work correctly. But then I tried the app on a touch Blackberry and the touch elements didn’t work properly any more. So I ditched changes recommended by Resilient Coder and went digging into sencha-touch-debug.js myself.

To get Sencha Touch working on both touch and non-touch Blackberry devices you need to make the following changes.

You need to add || Ext.is.Blackberry to line 18098. This enables clicking on Sench Touch ui elements like buttons and tabs with the thumbpad or trackball. You also need to comment out line 18101 to enable scrolling via touch on Blackberry devices like the Torch. If you don’t comment this line out scrolling via touch doesn’t work properly.

The final piece of the puzzle is to enable scrolling using the thumbpad or trackball. This is really more of a work around. It’s based off the code I found at http://pastebin.com/Mih4Ps12. To use this work around you basically just extend your scrollable panels from Ext.NonTouchCompatibleScrollPanel instead of Ext.Panel.