Created
April 10, 2012 10:44
-
-
Save hoatle/2350352 to your computer and use it in GitHub Desktop.
JavaScript Router using underscore, requirejs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* The routing controller object. | |
* | |
* Usage: | |
* + Define the routing table by controller.map(valueRegex, callback); | |
* the callback will be called and passed the value as the first argument. | |
* + Routing action by: controller.route(definedValue). If no definedValue matches, do nothing. | |
*/ | |
define( | |
function() { | |
var mappings = []; | |
return { | |
/** | |
* Defines mapping rules. | |
* | |
* @param valueRegex the javascript regular expression object | |
* @param callback the callback function | |
*/ | |
map: function(valueRegex, callback) { | |
if (mapRegistered(valueRegex)) { | |
$.log(valueRegex + ' was already mapped, no override map supported (yet)!'); | |
return; | |
} else { | |
mappings.push({ | |
'key': valueRegex, | |
'value': callback | |
}); | |
} | |
}, | |
/** | |
* Routes the matched callback registered from {@link #map(String, String)}. | |
* | |
* @param value the value to check | |
*/ | |
route: function(value, noMatchCallback) { | |
var callback = getMatchedCallback(value); | |
if (callback) { | |
callback(value); | |
return; | |
} | |
noMatchCallback(value); | |
} | |
}; | |
//private methods | |
function mapRegistered(valueRegex) { | |
var matched = false; | |
_.each(mappings, function(mapObj) { | |
if (matched) { | |
return; | |
} | |
if (_.isEqual(mapObj['key'], valueRegex)) { | |
matched = true; | |
return; | |
} | |
}); | |
return matched; | |
} | |
function getMatchedCallback(value) { | |
var callback = null; | |
_.each(mappings, function(mapObj) { | |
if (callback) { | |
return callback; | |
} | |
if (value.match(mapObj['key'])) { | |
callback = mapObj['value']; | |
} | |
}); | |
return callback; | |
} | |
} | |
); | |
//Test (require jquery log) | |
require( | |
['controller'], | |
function(controller) { | |
var commonRegexp = /#(\w+)/i; | |
var projectRegexp = /#work\/([^\/]+)/i; | |
var projectWithImageRegexp = /#work\/([^\/]+)\/gallery\/(\d+)/i; | |
var projectWithFilter = /#work\/filter\/(\d+)/i; | |
//controller mapping | |
controller.map(commonRegexp, function(value) { | |
$.log('common matched', value); | |
}); | |
controller.map(projectRegexp, function(value) { | |
$.log('project matched', value); | |
}); | |
controller.map(projectWithImageRegexp, function(value) { | |
$.log('project with image matched', value); | |
}); | |
controller.map(projectWithFilter, function(value) { | |
$.log('project with filter matched', value); | |
}); | |
controller.route('/#work', function(routeValue) { | |
$.log('no match router, this will be called'); | |
}); | |
} | |
); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment