haithembelhaj / slim-router Goto Github PK
View Code? Open in Web Editor NEWA Javascript Router based on History.js
A Javascript Router based on History.js
Hi,
In my app I am using Historyjs to delegate link navigation to History js, like so.
$(document.body).delegate("a", "click", function (event) {
var
$this = $(this),
url = $this.attr('href'),
title = $this.attr('title')||null;
if ( event.which == 2 || event.metaKey ) { return true; }
History.pushState(null,title,url);
event.preventDefault();
return false;
});
I found a peculiar bug that when these link have a title attribute the route does not fire. I modified the example to demonstrate this.
https://gist.github.com/2861682
Thanks.
Thanks for routerjs. What a breath of fresh air after trying to learn some of the more complicated frameworks. I do have a problem though. I want to send my index.html regardless of the request and then navigate using window.location.pathname.
I assume the following doesn't work because there isn't a statechange.
$(document).ready(function() {
router.navigate(window.location.pathname);
...
However, this is a workaround.
$(document).ready(function() {
var pathname = window.location.pathname;
router.navigate('/route/to/heaven', true, false);
router.navigate(pathname);
...
Is this the best option considering what I want to do, or am I missing something.
Make router.js available for easier bower installation.
E.g.
router.route('/route/*path?sort=', function(path, sort){ console.log(path + sort)});
Hey,
Just to let you know the url to history.js in the index.html 404's.
Cheers,
Ian
Hi,
I just noticed a small issue in one of my tests. Routing works perfectly until you use History.back. Once you have gone back if you then navigate to a new url, the handler doesn't get triggered. I recreated this in a jasmine test case.
describe("Testing RouterJs", function () {
var router;
beforeEach(function () {
router = new Router();
router.route('/route1/:id', function(id){ console.log(id)});
router.route('/route2/:id', function(path){ console.log(path)});
});
it("should call first handler", function() {
var spy = jasmine.createSpy();
router.route('/route1/:id', spy);
router.navigate("/route1/5");
expect(spy).toHaveBeenCalled();
History.back();
});
it("should call second handler", function() {
var spy = jasmine.createSpy();
// doesn't get called as expected
router.route('/route2/:id', spy);
router.navigate("/route2/5");
expect(spy).toHaveBeenCalled();
History.back();
});
});
After the first test runs the method calls History.back to return the test page to the url it came from. When the second test then runs and navigates to a different url the handler is not called. If you remove the History.back both tests pass.
Any ideas?
Cheers
I've defined a few routes, and if I open up my browser and go to one of them directly, the route handler will not fire off. The route handlers only fire off if I do router.navigate(...)
. Is there a way to fire off the initial page load?
Here's my code:
var router = new Router();
router.route('/test', function() { console.log("test"); });
Now, if I go directly to example.com/test
, I don't see the console.log
trigger. However, if I go directly to example.com/another-route
, then do router.navigate('/test')
, the console.log("test");
will trigger. Thanks!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.