Skip to content

Instantly share code, notes, and snippets.

@davepermen
Created April 17, 2013 16:32
Show Gist options
  • Save davepermen/5405730 to your computer and use it in GitHub Desktop.
Save davepermen/5405730 to your computer and use it in GitHub Desktop.
More modular version of mini Sammyjs without jQuery, now with the Routing extracted and independent, for further usage outside of the window.history part.
Path.setup(new Route(function () {
this.get('/yadda', function () {
document.querySelector('h1').innerHTML = "OMG";
});
this.get('/yaddaweeehhh', function () {
document.querySelector('h1').innerHTML = "<a href='/yaddaNEW'>NEW LINK!!!!</a>";
});
this.get('/yaddaNEW', function () {
document.querySelector('h1').innerHTML = "OMG!!";
});
this.get('/blog/##/##/##', function (year, month, day) {
document.querySelector('#content').innerHTML = "blog entry from " + year + "-" + month + "-" + day;
});
this.get('/blog/##', function (year, month, day) {
document.querySelector('#content').innerHTML = "blog entry from " + year + "-" + month + "-" + day;
});
this.get('/', function () {
});
this.all(function () {
document.querySelector('p').innerHTML = this.path;
console.log(this.path);
});
}));
var Path = function () {
var refreshLinks = function () {
[].forEach.call(document.querySelectorAll('a[href^="/"]'), function (link) {
if (link.getAttribute('data-routed') !== '') {
link.setAttribute('data-routed', '');
link.addEventListener('click', function (event) {
Path.go(link.getAttribute('href'));
event.preventDefault();
});
}
});
};
var handler = undefined;
var callHandler = function (path) {
handler(path);
refreshLinks();
};
return {
go: function (path) {
if (history.pushState !== undefined) {
history.isActive = true;
history.pushState(null, null, path);
callHandler(path);
} else {
location.pathname = path;
}
},
setup: function (routeHandler) {
handler = routeHandler;
window.addEventListener('load', function () { callHandler(location.pathname); });
if (history.pushState !== undefined) {
window.addEventListener('popstate', function () { history.isActive && callHandler(location.pathname); });
refreshLinks();
}
}
};
}();
var Route = function (routeHandler) {
return function (path) {
routeHandler.call({
get: function (route, handler) {
if (route.exec !== undefined) {
// regex way
var params = route.exec(path);
if (params !== null) {
handler.apply({ path: path }, params.slice(1));
}
} else if (route.indexOf('##') >= 0) {
// doublehash (replaces doubledash with finding tokens till the ending '/'s, and make sure it's the full path)
var params = new RegExp('^' + route.replace(/##/g, '([^/]+)') + '$').exec(path);
if (params !== null) {
handler.apply({ path: path }, params.slice(1));
}
} else if (route === path || (route === '/' && path === '')) {
// static route
handler.call({ path: path });
}
},
all: function (handler) {
handler.call({ path: path });
}
});
};
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment