Every route begins with an origin.
OriginJS is an awesome client side router. It's lightweight, easy to use, and has a lot of very powerful features. If you're building a single page application, and javascript game, or anything else heavy in javascript, OriginJS will make your application more accessible and might even help you code in a more organized way.
OriginJS.bind(route, setupCallback(urisArray, previousUrisArray)[, tearDownCallback(urisArray, previousUrisArray)]);
This method is the cornerstone of this library. It binds your route logic to the routes of your application. To bind a
route you simply call OriginJS.bind()
passing it a route (like /home, /about, etc...), and a setup callback that will
load the content of your route. You can optionally pass a teardown callback as well if you wish to cleanup your loaded
content when a different route is followed. You can think of setupCallback()
and tearDownCallback()
as parellels to the
DOM's onload
and onunload
events.
route
: A route string or an array of route strings. The route can contain dynamic uris such as*
,+
, or:someIdHere
.setupCallback
: A function or array of functions that will be called when the route is followed.tearDownCallback
: Optional. A function or array of functions that will be called when navigating away from the route.
Both the setupCallback()
and the tearDownCallback()
are passed two arguments; A uris array for the current route,
and a uris array from the route followed prior to the current.
Uris arrays contain each uri from the triggering hash url. So if your route is binded to /home/*
and someone navigated
to /home/cake
the uri array would be ['home', 'cake']
.
*
: Wildcard uris will match any uri.:[name]
: Dynamic uris are a colon followed by a key name. Examples:key
,:user
,:cake
. Dynaimc uris will capture the value of the uri they match and attach it to the uris array as a keyed value.:key
becomesurisArray.key
,:user
becomesurisArray.user
,:cake
becomesurisArray.cake
.+
: Catchall uris will match any uri and anything that follows it. It can be used to setup things like 404 pages and other types of catchall pages.
OriginJS.go(url);
At some point you may want to trigger routes or open other pages programatically. This is what OriginJS.go()
is for.
If OriginJS.bind()
is ying, OriginJS.go()
is yang.
url
: Any url you wish to follow. If the url is pointing to a binded route the router will load that route. No need to prefix with/#
. If the url is not pointing to a binded route it will redirect to the url. If the url contains a domain it will open the url in a new tab (or window).
OriginJS.update();
The OriginJS.update()
method is used to trigger force Origin to match the current hash url routes which are defined. You should
call this after your routes are binded in your appication. You should only need to call this function once.
OriginJS.point(route[, ...]).to(route)
OriginJS.point(route[, ...]).at(route)
At some point you may want to setup aliases or redirects. OriginJS.point()
creates aliases and redirects with ease. It
takes any number of route strings, and returns an object with two functions. These functions are at()
and to()
.
at(route)
: Creates an alias from the routes passed topoint()
and points them to aroute
passed.to(route)
: Creates a redirect from the routes passed topoint()
and forwards them to aroute
passed.
I (Robert Hurst) made this to enable me to build more robust applications without wasting time creating a half baked router. I'd like to share it with fellow devs. Feel free to fork this project and make your own changes.