-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathrouter.js
353 lines (328 loc) · 13.3 KB
/
router.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
AmorphicRouter =
{
location: (typeof(document) != 'undefined') ? document.location : {pathname: '', search: '', hash: ''},
history: (typeof(window) != 'undefined' && window.history ? window.history : null),
paths: {}, // List of routes by paths
routesById: {}, // List of routes by Id
routes:{}, // Root of the routes
currentRoute: null,
hasPushState: !!(typeof(window) != 'undefined' && window.history && history.pushState),
pushedRoutes: [],
/**
* Set up routing
*
* @param controller - a Bindster controller
* @param routeIn - a routing definitions
* @param options - options
*/
route: function(controller, routeIn, options)
{
this.controller = controller;
options = options || {};
this.options = options;
var self = this;
this.routes = function () {
var callArgs = [self.routes];
for (var ix = 0; ix < arguments.length; ix++)
callArgs.push(arguments[ix]);
self._goTo.apply(self, callArgs);
}
this._parseRoute(this.routes, routeIn, {}, '', '');
// Check regularly to see if path appears in location.href
var self = this;
setInterval(function () {self._checkURL()}, options.interval || 500);
return this.routes;
},
/**
* Called internally when going from route to the other but may
* be called externally from say a windows.unload event
*/
leave: function ()
{
if (this.currentRoute)
for (var ix = 0; ix < this.currentRoute.__exit.length; ++ix)
this.currentRoute.__exit[ix].call(this.controller, this.currentRoute);
this.currentRoute = null;
},
/*
* Called internally from goTo or when a route appears in location.href
* but may be called to enter a route without it appearing in the address
* bar or creating history
*/
arrive: function (route, parsed)
{
if (route.__nested)
this.pushedRoutes.push(this.currentRoute);
else
this.leave();
this.currentRoute = route;
for (var key in route.__parameters)
if (parsed && parsed.parameters[key])
this.controller.bindSet(route.__parameters[key].bind, parsed.parameters[key]);
var callArgs = [route];
if (this.pendingParameters)
for (var ix = 0; ix < this.pendingParameters.arguments.length; ++ix)
callArgs.push(this.pendingParameters.arguments[ix]);
this.executedGoTo = false;
for (var ix = 0; ix < this.currentRoute.__enter.length; ++ix) {
if (this.pendingParameters && this.pendingParameters.route == route && ix == (this.currentRoute.__enter.length - 1))
this.currentRoute.__enter[ix].apply(this.controller, callArgs);
else
this.currentRoute.__enter[ix].call(this.controller, this.currentRoute);
if (this.executedGoTo)
break;
}
this.pendingParameters = null;
if (!this.executedGoTo) {
this.controller.arrive(route);
this.controller.refresh();
}
},
popRoute: function() {
this.leave();
this.currentRoute = this.pushedRoutes.pop();
this._updateURL(this.currentRoute);
},
getRoute: function () {
return this.currentRoute;
},
/**
* Go to a location based on a path (same invoking a route as a function admin.tickets());
* @param path
*/
goTo: function (path) {
var route = this.paths[path.substr(0, 1) == '/' ? path : '/' + path];
if (route) {
var callArgs=[route];
for (var ix = 1; ix < arguments.length; ix++)
callArgs.push(arguments[ix]);
this._goTo.apply(this, callArgs);
}
},
/**
* Go to a location based on id returned from route.getId();
* @param path
*/
goToById: function (id) {
var route = this.routesById[id];
if (route) {
var callArgs=[route];
for (var ix = 1; ix < arguments.length; ix++)
callArgs.push(arguments[ix]);
this._goTo.apply(this, callArgs);
}
},
/**
* Set a new route as active. The route is a leaf in the routing definition tree
* It is called internally by each leaf's goTo function. History is created
* for the route and it will appear in the address bar. It may or may not load
* a new page depending on the load boolean in the leaf.
* @param route
*/
_goTo: function (route)
{
// Prepare pending parameters
this.pendingParameters = {route: route, arguments: []};
for (var ix = 1; ix < arguments.length; ix++)
this.pendingParameters.arguments.push(arguments[ix]);
this._updateURL(route);
if (route.__nested)
this.arrive(route);
else {
this._checkURL();
this.executedGoTo = true;
}
},
_updateURL: function (route) {
{
route = route || {__path: ''}
var prefix = (this.options.usePushState && this.hasPushState) ?
route.__prefix : route.__prefix.replace(/-/, '');
switch(route.__prefix) {
// Non-pushState handling
case '/':
this.location.href = '/' + this._encodeURL(route, route.__path, false);
break;
case '#':
this.location.hash = '#' + this._encodeURL(route, route.__path, true);
break;
case '/#':
if (this.location.pathname != '/')
this.location.href = '/#'+ this._encodeURL(route, route.__path, true);
else
this.location.hash = '#' + this._encodeURL(route, route.__path, true);
break;
case '-/':
//this.location.hash = '';
this.history.pushState(route.__path, route.__title ? route.__title : null, '/' + this._encodeURL(route, route.__path, false));
break;
case '-#':
this.history.pushState(route.__path, route.__title ? route.__title : null, '#' + this._encodeURL(route, route.__path, false));
break;
case '-/#':
//this.location.hash = '';
this.history.pushState(route.__path, route.__title ? route.__title : null, '/#' + this._encodeURL(route, route.__path, false));
break;
}
}
},
/* Internal functions */
/**
* Split of current URL and determine if a path has been defined for it.
* If so arrive at that path
*
* @private
*/
_checkURL: function()
{
// Break apart URL which consists of path ? search # hash
// into component parts of a path and individual parameters
// both of which are first taken from the path/search and
// then may be overridden by the hash. This let's subsequent
// routes for an SPA be defined through a hash even through
// the initial one came in as a path ? search.
var parsed = {parameters: {}, path: '/'};
var hash = this.location.hash.replace(/^#/, '');
var search = this.location.search.replace(/^\?/, '');
if (this.location.pathname)
parsed = this._parseURL(this.location.pathname + '?' + search);
if (hash) {
if (hash.match(/##(.*)/)) {
search = RegExp.$1;
hash = hash.replace(/##.*/, '');
}
parsed = this._parseURL(decodeURIComponent(hash) + '?' + search, parsed);
}
// Grab the route from paths extracted from routeIn and signal arrival
var route = this.paths[parsed.path] || this.paths['/*'];
if (route && route != this.currentRoute)
this.arrive(route, parsed);
},
/**
* Parse a path?search URL into a structure, overriding previous values in
* that structure in the structure is pased in
*
* @param str
* @param parsed (optional)
* @returns {*|{path: String, parmeters: {}}}
* @private
*/
_parseURL: function(str, parsed)
{
parsed = parsed || {parameters: {}};
var parts = str.split('?');
parsed.path = parts[0].substr(0, 1) == "/" ? parts[0] : '/' + parts[0];
if (parts.length > 1) {
var pairs = parts[1].split('&');
for (var ix = 0; ix < pairs.length; ++ix) {
var keyValue = pairs[ix].split('=');
parsed.parameters[keyValue[0]] = decodeURIComponent(keyValue.length > 1 ? keyValue[1] : '');
}
}
return parsed;
},
/**
* Encode a URL into a search string with key=value pairs separated by & signs and starting with a ?
*
* @param route
* @returns {*}
* @private
*/
_encodeURL: function (route, url, isHash)
{
url = url.replace(/^\//, '');
var separator = isHash ? '##' : '?';
for (var key in route.__parameters) {
if (!(route.__parameters[key].encode === false)) {
url += separator + key + '=' + encodeURIComponent(this.controller.bindGet(route.__parameters[key].bind));
separator = '&';
}
}
return url;
},
/**
* Parse a route definition leaf calling _parseRoute recursively
*
* @param route - A route leaf to be populated from ...
* @param routeIn - A route leaf definition
* @param inherited - augmented by inherited properties
* @param currPath - and previous parts of a path
* @param prop
* @param parentRoute
* @private
*/
_parseRoute: function (route, routeIn, inherited, currPath, prop, parentRoute)
{
// Merge based on the path specified in leaf or the property as a path segment
var pathSegment = typeof(routeIn.path) != 'undefined' ? routeIn.path : prop;
route.__prefix = this.options.defaultPrefix ? this.options.defaultPrefix : "";
if (pathSegment.match(/^([-#\/]*)/))
route.__prefix += RegExp.$1;
while (pathSegment.match(/^[-#\/]/))
pathSegment = pathSegment.replace(/^[-#\/]/, '');
if (!route.__prefix)
route.__prefix = '#';
if (this.options.usePushState == false)
route.__prefix = route.__prefix.replace(/-/, '');
currPath = pathSegment ? currPath + '/' + pathSegment : currPath;
this.paths[(currPath ? currPath : '/')] = route;
route.__path = currPath.substr(0,1) == '/' ? currPath : '/' + currPath;
// Create route that has merged properties
route.__enter = [];
route.__exit = [];
route.__parameters = {};
route.__route = prop;
route.__nested = routeIn.nested;
// Manage the id which is a concatenation of properties in the heirarchy
route.__id = parentRoute ? (parentRoute.__id ? parentRoute.__id + "." + prop : prop) : "";
route.getId = function () {return this.__id};
this.routesById[route.__id] = route;
// Pull in all of the array parameters from interited (which is a route type structure)
for (var prop in {__enter: 1, __exit: 1, __parameters: 1})
if (inherited[prop])
for (var ix = 0; ix < inherited[prop].length; ++ix)
route[prop].push(inherited[prop][ix])
if (inherited.__parameters)
for (var param in inherited.__parameters)
route.__parameters[param] = inherited.__parameters[param]
// Then for the arrays layer on the one in the current leaf
var self = this;
if (routeIn.enter)
route.__enter.push(function (route) {
var callArgs = [route];
for (var ix = 1; ix < arguments.length; ix++)
callArgs.push(arguments[ix]);
routeIn.enter.apply(self.controller, callArgs)
});
if (routeIn.exit)
route.__exit.push(function (route){routeIn.exit.call(self.controller, route)});
if (routeIn.parameters)
for (var param in routeIn.parameters)
route.__parameters[param] = routeIn.parameters[param];
// Now merge in the user defined properties
function processProp (source) {
for (var prop in source)
if (!prop.match(/^enter$|^exit$|^parameters$|^routes$|^path$|^nested$/) && !prop.match(/^__/))
route[prop] = source[prop];
}
processProp(inherited);
processProp(routeIn);
// Add sub-routes
if (routeIn.routes)
for (var prop in routeIn.routes) {
var self = this;
(function () {
var closureProp = prop;
route[prop] = function () {
var callArgs=[route[closureProp]];
for (var ix = 0; ix < arguments.length; ix++)
callArgs.push(arguments[ix]);
self._goTo.apply(self, callArgs);
}
})();
this._parseRoute(route[prop], routeIn.routes[prop], route, currPath, prop, route);
}
}
}
if (typeof(window) == 'undefined')
module.exports = AmorphicRouter;