Skip to content

Instantly share code, notes, and snippets.

@speier
Last active October 7, 2017 21:58
Show Gist options
  • Save speier/86d5d9e944432f902323e7e6da89017a to your computer and use it in GitHub Desktop.
Save speier/86d5d9e944432f902323e7e6da89017a to your computer and use it in GitHub Desktop.
playing with hyperapp routing
import { app } from 'hyperapp';
import { router } from './router';
import routes from './routes';
import state from './state';
import actions from './actions';
const routable = router(routes);
app(routable)({ state, actions }).init(); // init is just an action, not related to routing
import Home from './views/home';
import About from './views/about';
import NotFound from './views/404';
export default [
['/', Home],
['/about', About],
['*', NotFound]
]
import { h } from 'hyperapp';
export function router(routes) {
return function (app) {
return props => {
return app(enhance(props));
function enhance(props) {
props.state.router = {};
props.actions.router = {
set: (state, actions, data) => {
window.onpopstate = () => actions.set({});
return {
router: data
};
},
go: (state, actions, path) => {
if (location.pathname + location.search !== path) {
history.pushState({}, '', path);
actions.set({ path });
}
}
};
props.view = (state, actions) => {
const m = match(location.pathname, routes);
const v = routes[m.index][1];
return v(state, actions);
}
return props;
}
}
}
}
// just copied from hyperapp/router
function match(pathname, routes) {
var match
var index
var params = {}
for (var i = 0; i < routes.length && !match; i++) {
var route = routes[i][0]
var keys = []
pathname.replace(
RegExp(
route === "*"
? ".*"
: "^" +
route.replace(/\//g, "\\/").replace(/:([\w]+)/g, function (_, key) {
keys.push(key)
return "([-\\.%\\w\\(\\)]+)"
}) +
"/?$",
"g"
),
function () {
for (var j = 1; j < arguments.length - 2;) {
var value = arguments[j++]
try {
value = decodeURI(value)
} catch (_) { }
params[keys.shift()] = value
}
match = route
index = i
}
)
}
return {
match: match,
index: index,
params: params
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment