Skip to content

webix-hub/routie

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

68 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

#Routie

npm version

Routie is a javascript hash routing library. It is designed for scenarios when push state is not an option (IE8 support, static/Github pages, Phonegap, simple sites, etc). It is very tiny (800 bytes gzipped), and should be able to handle all your routing needs.

Difference from the original version

Original version - http://projects.jga.me/routie

Fork adds ability to block hash changes, just return a false from the related controller

##Download

npm i webix-routie

##Basic Usage

There are three ways to call routie:

Here is the most basic way:

routie('users', function() {
	//this gets called when hash == #users
});

If you want to define multiple routes you can pass in an object like this:

routie({
	'users': function() {

	},
	'about': function() {
	}
});

If you want to trigger a route manually, you can call routie like this:

routie('users/bob');  //window.location.hash will be #users/bob

##Regex Routes

Routie also supports regex style routes, so you can do advanced routing like this:

routie('users/:name', function(name) {
    console.log(name);
});
routie('users/bob'); // logs `'bob'`

###Optional Params:

routie('users/:name?', function(name) {
    console.log(name);
});
routie('users/'); // logs `undefined`
routie('users/bob'); // logs `'bob'`

###Wildcard:

routie('users/*', function() {
});
routie('users/12312312');

###Catch All:

routie('*', function() {
});
routie('anything');

##Named Routes

Named routes make it easy to build urls for use in your templates. Instead of re-creating the url, you can just name your url when you define it and then perform a lookup. The name of the route is optional. The syntax is "[name] [route]".

routie('user users/:name', function() {});

then in your template code, you can do:

routie.lookup('user', { name: 'bob'}) // == users/bob

##Dependencies

None

##Supports

Any modern browser and IE8+

Packages

No packages published

Languages

  • JavaScript 90.2%
  • HTML 9.8%