page.js 30 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202
  1. (function (global, factory) {
  2. typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
  3. typeof define === 'function' && define.amd ? define(factory) :
  4. (global.page = factory());
  5. }(this, (function () { 'use strict';
  6. var isarray = Array.isArray || function (arr) {
  7. return Object.prototype.toString.call(arr) == '[object Array]';
  8. };
  9. /**
  10. * Expose `pathToRegexp`.
  11. */
  12. var pathToRegexp_1 = pathToRegexp;
  13. var parse_1 = parse;
  14. var compile_1 = compile;
  15. var tokensToFunction_1 = tokensToFunction;
  16. var tokensToRegExp_1 = tokensToRegExp;
  17. /**
  18. * The main path matching regexp utility.
  19. *
  20. * @type {RegExp}
  21. */
  22. var PATH_REGEXP = new RegExp([
  23. // Match escaped characters that would otherwise appear in future matches.
  24. // This allows the user to escape special characters that won't transform.
  25. '(\\\\.)',
  26. // Match Express-style parameters and un-named parameters with a prefix
  27. // and optional suffixes. Matches appear as:
  28. //
  29. // "/:test(\\d+)?" => ["/", "test", "\d+", undefined, "?", undefined]
  30. // "/route(\\d+)" => [undefined, undefined, undefined, "\d+", undefined, undefined]
  31. // "/*" => ["/", undefined, undefined, undefined, undefined, "*"]
  32. '([\\/.])?(?:(?:\\:(\\w+)(?:\\(((?:\\\\.|[^()])+)\\))?|\\(((?:\\\\.|[^()])+)\\))([+*?])?|(\\*))'
  33. ].join('|'), 'g');
  34. /**
  35. * Parse a string for the raw tokens.
  36. *
  37. * @param {String} str
  38. * @return {Array}
  39. */
  40. function parse (str) {
  41. var tokens = [];
  42. var key = 0;
  43. var index = 0;
  44. var path = '';
  45. var res;
  46. while ((res = PATH_REGEXP.exec(str)) != null) {
  47. var m = res[0];
  48. var escaped = res[1];
  49. var offset = res.index;
  50. path += str.slice(index, offset);
  51. index = offset + m.length;
  52. // Ignore already escaped sequences.
  53. if (escaped) {
  54. path += escaped[1];
  55. continue
  56. }
  57. // Push the current path onto the tokens.
  58. if (path) {
  59. tokens.push(path);
  60. path = '';
  61. }
  62. var prefix = res[2];
  63. var name = res[3];
  64. var capture = res[4];
  65. var group = res[5];
  66. var suffix = res[6];
  67. var asterisk = res[7];
  68. var repeat = suffix === '+' || suffix === '*';
  69. var optional = suffix === '?' || suffix === '*';
  70. var delimiter = prefix || '/';
  71. var pattern = capture || group || (asterisk ? '.*' : '[^' + delimiter + ']+?');
  72. tokens.push({
  73. name: name || key++,
  74. prefix: prefix || '',
  75. delimiter: delimiter,
  76. optional: optional,
  77. repeat: repeat,
  78. pattern: escapeGroup(pattern)
  79. });
  80. }
  81. // Match any characters still remaining.
  82. if (index < str.length) {
  83. path += str.substr(index);
  84. }
  85. // If the path exists, push it onto the end.
  86. if (path) {
  87. tokens.push(path);
  88. }
  89. return tokens
  90. }
  91. /**
  92. * Compile a string to a template function for the path.
  93. *
  94. * @param {String} str
  95. * @return {Function}
  96. */
  97. function compile (str) {
  98. return tokensToFunction(parse(str))
  99. }
  100. /**
  101. * Expose a method for transforming tokens into the path function.
  102. */
  103. function tokensToFunction (tokens) {
  104. // Compile all the tokens into regexps.
  105. var matches = new Array(tokens.length);
  106. // Compile all the patterns before compilation.
  107. for (var i = 0; i < tokens.length; i++) {
  108. if (typeof tokens[i] === 'object') {
  109. matches[i] = new RegExp('^' + tokens[i].pattern + '$');
  110. }
  111. }
  112. return function (obj) {
  113. var path = '';
  114. var data = obj || {};
  115. for (var i = 0; i < tokens.length; i++) {
  116. var token = tokens[i];
  117. if (typeof token === 'string') {
  118. path += token;
  119. continue
  120. }
  121. var value = data[token.name];
  122. var segment;
  123. if (value == null) {
  124. if (token.optional) {
  125. continue
  126. } else {
  127. throw new TypeError('Expected "' + token.name + '" to be defined')
  128. }
  129. }
  130. if (isarray(value)) {
  131. if (!token.repeat) {
  132. throw new TypeError('Expected "' + token.name + '" to not repeat, but received "' + value + '"')
  133. }
  134. if (value.length === 0) {
  135. if (token.optional) {
  136. continue
  137. } else {
  138. throw new TypeError('Expected "' + token.name + '" to not be empty')
  139. }
  140. }
  141. for (var j = 0; j < value.length; j++) {
  142. segment = encodeURIComponent(value[j]);
  143. if (!matches[i].test(segment)) {
  144. throw new TypeError('Expected all "' + token.name + '" to match "' + token.pattern + '", but received "' + segment + '"')
  145. }
  146. path += (j === 0 ? token.prefix : token.delimiter) + segment;
  147. }
  148. continue
  149. }
  150. segment = encodeURIComponent(value);
  151. if (!matches[i].test(segment)) {
  152. throw new TypeError('Expected "' + token.name + '" to match "' + token.pattern + '", but received "' + segment + '"')
  153. }
  154. path += token.prefix + segment;
  155. }
  156. return path
  157. }
  158. }
  159. /**
  160. * Escape a regular expression string.
  161. *
  162. * @param {String} str
  163. * @return {String}
  164. */
  165. function escapeString (str) {
  166. return str.replace(/([.+*?=^!:${}()[\]|\/])/g, '\\$1')
  167. }
  168. /**
  169. * Escape the capturing group by escaping special characters and meaning.
  170. *
  171. * @param {String} group
  172. * @return {String}
  173. */
  174. function escapeGroup (group) {
  175. return group.replace(/([=!:$\/()])/g, '\\$1')
  176. }
  177. /**
  178. * Attach the keys as a property of the regexp.
  179. *
  180. * @param {RegExp} re
  181. * @param {Array} keys
  182. * @return {RegExp}
  183. */
  184. function attachKeys (re, keys) {
  185. re.keys = keys;
  186. return re
  187. }
  188. /**
  189. * Get the flags for a regexp from the options.
  190. *
  191. * @param {Object} options
  192. * @return {String}
  193. */
  194. function flags (options) {
  195. return options.sensitive ? '' : 'i'
  196. }
  197. /**
  198. * Pull out keys from a regexp.
  199. *
  200. * @param {RegExp} path
  201. * @param {Array} keys
  202. * @return {RegExp}
  203. */
  204. function regexpToRegexp (path, keys) {
  205. // Use a negative lookahead to match only capturing groups.
  206. var groups = path.source.match(/\((?!\?)/g);
  207. if (groups) {
  208. for (var i = 0; i < groups.length; i++) {
  209. keys.push({
  210. name: i,
  211. prefix: null,
  212. delimiter: null,
  213. optional: false,
  214. repeat: false,
  215. pattern: null
  216. });
  217. }
  218. }
  219. return attachKeys(path, keys)
  220. }
  221. /**
  222. * Transform an array into a regexp.
  223. *
  224. * @param {Array} path
  225. * @param {Array} keys
  226. * @param {Object} options
  227. * @return {RegExp}
  228. */
  229. function arrayToRegexp (path, keys, options) {
  230. var parts = [];
  231. for (var i = 0; i < path.length; i++) {
  232. parts.push(pathToRegexp(path[i], keys, options).source);
  233. }
  234. var regexp = new RegExp('(?:' + parts.join('|') + ')', flags(options));
  235. return attachKeys(regexp, keys)
  236. }
  237. /**
  238. * Create a path regexp from string input.
  239. *
  240. * @param {String} path
  241. * @param {Array} keys
  242. * @param {Object} options
  243. * @return {RegExp}
  244. */
  245. function stringToRegexp (path, keys, options) {
  246. var tokens = parse(path);
  247. var re = tokensToRegExp(tokens, options);
  248. // Attach keys back to the regexp.
  249. for (var i = 0; i < tokens.length; i++) {
  250. if (typeof tokens[i] !== 'string') {
  251. keys.push(tokens[i]);
  252. }
  253. }
  254. return attachKeys(re, keys)
  255. }
  256. /**
  257. * Expose a function for taking tokens and returning a RegExp.
  258. *
  259. * @param {Array} tokens
  260. * @param {Array} keys
  261. * @param {Object} options
  262. * @return {RegExp}
  263. */
  264. function tokensToRegExp (tokens, options) {
  265. options = options || {};
  266. var strict = options.strict;
  267. var end = options.end !== false;
  268. var route = '';
  269. var lastToken = tokens[tokens.length - 1];
  270. var endsWithSlash = typeof lastToken === 'string' && /\/$/.test(lastToken);
  271. // Iterate over the tokens and create our regexp string.
  272. for (var i = 0; i < tokens.length; i++) {
  273. var token = tokens[i];
  274. if (typeof token === 'string') {
  275. route += escapeString(token);
  276. } else {
  277. var prefix = escapeString(token.prefix);
  278. var capture = token.pattern;
  279. if (token.repeat) {
  280. capture += '(?:' + prefix + capture + ')*';
  281. }
  282. if (token.optional) {
  283. if (prefix) {
  284. capture = '(?:' + prefix + '(' + capture + '))?';
  285. } else {
  286. capture = '(' + capture + ')?';
  287. }
  288. } else {
  289. capture = prefix + '(' + capture + ')';
  290. }
  291. route += capture;
  292. }
  293. }
  294. // In non-strict mode we allow a slash at the end of match. If the path to
  295. // match already ends with a slash, we remove it for consistency. The slash
  296. // is valid at the end of a path match, not in the middle. This is important
  297. // in non-ending mode, where "/test/" shouldn't match "/test//route".
  298. if (!strict) {
  299. route = (endsWithSlash ? route.slice(0, -2) : route) + '(?:\\/(?=$))?';
  300. }
  301. if (end) {
  302. route += '$';
  303. } else {
  304. // In non-ending mode, we need the capturing groups to match as much as
  305. // possible by using a positive lookahead to the end or next path segment.
  306. route += strict && endsWithSlash ? '' : '(?=\\/|$)';
  307. }
  308. return new RegExp('^' + route, flags(options))
  309. }
  310. /**
  311. * Normalize the given path string, returning a regular expression.
  312. *
  313. * An empty array can be passed in for the keys, which will hold the
  314. * placeholder key descriptions. For example, using `/user/:id`, `keys` will
  315. * contain `[{ name: 'id', delimiter: '/', optional: false, repeat: false }]`.
  316. *
  317. * @param {(String|RegExp|Array)} path
  318. * @param {Array} [keys]
  319. * @param {Object} [options]
  320. * @return {RegExp}
  321. */
  322. function pathToRegexp (path, keys, options) {
  323. keys = keys || [];
  324. if (!isarray(keys)) {
  325. options = keys;
  326. keys = [];
  327. } else if (!options) {
  328. options = {};
  329. }
  330. if (path instanceof RegExp) {
  331. return regexpToRegexp(path, keys, options)
  332. }
  333. if (isarray(path)) {
  334. return arrayToRegexp(path, keys, options)
  335. }
  336. return stringToRegexp(path, keys, options)
  337. }
  338. pathToRegexp_1.parse = parse_1;
  339. pathToRegexp_1.compile = compile_1;
  340. pathToRegexp_1.tokensToFunction = tokensToFunction_1;
  341. pathToRegexp_1.tokensToRegExp = tokensToRegExp_1;
  342. /**
  343. * Module dependencies.
  344. */
  345. /**
  346. * Short-cuts for global-object checks
  347. */
  348. var hasDocument = ('undefined' !== typeof document);
  349. var hasWindow = ('undefined' !== typeof window);
  350. var hasHistory = ('undefined' !== typeof history);
  351. var hasProcess = typeof process !== 'undefined';
  352. /**
  353. * Detect click event
  354. */
  355. var clickEvent = hasDocument && document.ontouchstart ? 'touchstart' : 'click';
  356. /**
  357. * To work properly with the URL
  358. * history.location generated polyfill in https://github.com/devote/HTML5-History-API
  359. */
  360. var isLocation = hasWindow && !!(window.history.location || window.location);
  361. /**
  362. * The page instance
  363. * @api private
  364. */
  365. function Page(options) {
  366. // public things
  367. this.callbacks = [];
  368. this.exits = [];
  369. this.current = '';
  370. this.len = 0;
  371. // private things
  372. this._dispatch = true;
  373. this._decodeURLComponents = true;
  374. this._base = '';
  375. this._strict = false;
  376. this._running = false;
  377. this._hashbang = false;
  378. // bound functions
  379. this.clickHandler = this.clickHandler.bind(this);
  380. this._onpopstate = this._onpopstate.bind(this);
  381. this.configure(options);
  382. }
  383. /**
  384. * Configure the instance of page. This can be called multiple times.
  385. *
  386. * @param {Object} options
  387. * @api public
  388. */
  389. Page.prototype.configure = function(options) {
  390. var opts = options || {};
  391. this._window = opts.window || (hasWindow && window);
  392. this._dispatch = opts.dispatch !== false;
  393. this._decodeURLComponents = opts.decodeURLComponents !== false;
  394. this._popstate = opts.popstate !== false && hasWindow;
  395. this._click = opts.click !== false && hasDocument;
  396. this._hashbang = !!opts.hashbang;
  397. var _window = this._window;
  398. if(this._popstate) {
  399. _window.addEventListener('popstate', this._onpopstate, false);
  400. } else if(hasWindow) {
  401. _window.removeEventListener('popstate', this._onpopstate, false);
  402. }
  403. if (this._click) {
  404. _window.document.addEventListener(clickEvent, this.clickHandler, false);
  405. } else if(hasDocument) {
  406. _window.document.removeEventListener(clickEvent, this.clickHandler, false);
  407. }
  408. if(this._hashbang && hasWindow && !hasHistory) {
  409. _window.addEventListener('hashchange', this._onpopstate, false);
  410. } else if(hasWindow) {
  411. _window.removeEventListener('hashchange', this._onpopstate, false);
  412. }
  413. };
  414. /**
  415. * Get or set basepath to `path`.
  416. *
  417. * @param {string} path
  418. * @api public
  419. */
  420. Page.prototype.base = function(path) {
  421. if (0 === arguments.length) return this._base;
  422. this._base = path;
  423. };
  424. /**
  425. * Gets the `base`, which depends on whether we are using History or
  426. * hashbang routing.
  427. * @api private
  428. */
  429. Page.prototype._getBase = function() {
  430. var base = this._base;
  431. if(!!base) return base;
  432. var loc = hasWindow && this._window && this._window.location;
  433. if(hasWindow && this._hashbang && loc && loc.protocol === 'file:') {
  434. base = loc.pathname;
  435. base = base.substring(0, base.lastIndexOf('/'));
  436. }
  437. return base;
  438. };
  439. /**
  440. * Get or set strict path matching to `enable`
  441. *
  442. * @param {boolean} enable
  443. * @api public
  444. */
  445. Page.prototype.strict = function(enable) {
  446. if (0 === arguments.length) return this._strict;
  447. this._strict = enable;
  448. };
  449. /**
  450. * Bind with the given `options`.
  451. *
  452. * Options:
  453. *
  454. * - `click` bind to click events [true]
  455. * - `popstate` bind to popstate [true]
  456. * - `dispatch` perform initial dispatch [true]
  457. *
  458. * @param {Object} options
  459. * @api public
  460. */
  461. Page.prototype.start = function(options) {
  462. this.configure(options);
  463. if (!this._dispatch) return;
  464. this._running = true;
  465. var url;
  466. if(isLocation) {
  467. var window = this._window;
  468. var loc = window.location;
  469. if(this._hashbang && ~loc.hash.indexOf('#!')) {
  470. url = loc.hash.substr(2) + loc.search;
  471. } else if (this._hashbang) {
  472. url = loc.search + loc.hash;
  473. } else {
  474. url = loc.pathname + loc.search + loc.hash;
  475. }
  476. }
  477. this.replace(url, null, true, this._dispatch);
  478. };
  479. /**
  480. * Unbind click and popstate event handlers.
  481. *
  482. * @api public
  483. */
  484. Page.prototype.stop = function() {
  485. if (!this._running) return;
  486. this.current = '';
  487. this.len = 0;
  488. this._running = false;
  489. var window = this._window;
  490. hasDocument && window.document.removeEventListener(clickEvent, this.clickHandler, false);
  491. hasWindow && window.removeEventListener('popstate', this._onpopstate, false);
  492. hasWindow && window.removeEventListener('hashchange', this._onpopstate, false);
  493. };
  494. /**
  495. * Show `path` with optional `state` object.
  496. *
  497. * @param {string} path
  498. * @param {Object=} state
  499. * @param {boolean=} dispatch
  500. * @param {boolean=} push
  501. * @return {!Context}
  502. * @api public
  503. */
  504. Page.prototype.show = function(path, state, dispatch, push) {
  505. var ctx = new Context(path, state, this),
  506. prev = this.prevContext;
  507. this.prevContext = ctx;
  508. this.current = ctx.path;
  509. if (this._dispatch) this.dispatch(ctx, prev);
  510. if (false !== ctx.handled && false !== push) ctx.pushState();
  511. return ctx;
  512. };
  513. /**
  514. * Goes back in the history
  515. * Back should always let the current route push state and then go back.
  516. *
  517. * @param {string} path - fallback path to go back if no more history exists, if undefined defaults to page.base
  518. * @param {Object=} state
  519. * @api public
  520. */
  521. Page.prototype.back = function(path, state) {
  522. var page = this;
  523. if (this.len > 0) {
  524. var window = this._window;
  525. // this may need more testing to see if all browsers
  526. // wait for the next tick to go back in history
  527. hasHistory && window.history.back();
  528. this.len--;
  529. } else if (path) {
  530. setTimeout(function() {
  531. page.show(path, state);
  532. });
  533. } else {
  534. setTimeout(function() {
  535. page.show(page._getBase(), state);
  536. });
  537. }
  538. };
  539. /**
  540. * Register route to redirect from one path to other
  541. * or just redirect to another route
  542. *
  543. * @param {string} from - if param 'to' is undefined redirects to 'from'
  544. * @param {string=} to
  545. * @api public
  546. */
  547. Page.prototype.redirect = function(from, to) {
  548. var inst = this;
  549. // Define route from a path to another
  550. if ('string' === typeof from && 'string' === typeof to) {
  551. page.call(this, from, function(e) {
  552. setTimeout(function() {
  553. inst.replace(/** @type {!string} */ (to));
  554. }, 0);
  555. });
  556. }
  557. // Wait for the push state and replace it with another
  558. if ('string' === typeof from && 'undefined' === typeof to) {
  559. setTimeout(function() {
  560. inst.replace(from);
  561. }, 0);
  562. }
  563. };
  564. /**
  565. * Replace `path` with optional `state` object.
  566. *
  567. * @param {string} path
  568. * @param {Object=} state
  569. * @param {boolean=} init
  570. * @param {boolean=} dispatch
  571. * @return {!Context}
  572. * @api public
  573. */
  574. Page.prototype.replace = function(path, state, init, dispatch) {
  575. var ctx = new Context(path, state, this),
  576. prev = this.prevContext;
  577. this.prevContext = ctx;
  578. this.current = ctx.path;
  579. ctx.init = init;
  580. ctx.save(); // save before dispatching, which may redirect
  581. if (false !== dispatch) this.dispatch(ctx, prev);
  582. return ctx;
  583. };
  584. /**
  585. * Dispatch the given `ctx`.
  586. *
  587. * @param {Context} ctx
  588. * @api private
  589. */
  590. Page.prototype.dispatch = function(ctx, prev) {
  591. var i = 0, j = 0, page = this;
  592. function nextExit() {
  593. var fn = page.exits[j++];
  594. if (!fn) return nextEnter();
  595. fn(prev, nextExit);
  596. }
  597. function nextEnter() {
  598. var fn = page.callbacks[i++];
  599. if (ctx.path !== page.current) {
  600. ctx.handled = false;
  601. return;
  602. }
  603. if (!fn) return unhandled.call(page, ctx);
  604. fn(ctx, nextEnter);
  605. }
  606. if (prev) {
  607. nextExit();
  608. } else {
  609. nextEnter();
  610. }
  611. };
  612. /**
  613. * Register an exit route on `path` with
  614. * callback `fn()`, which will be called
  615. * on the previous context when a new
  616. * page is visited.
  617. */
  618. Page.prototype.exit = function(path, fn) {
  619. if (typeof path === 'function') {
  620. return this.exit('*', path);
  621. }
  622. var route = new Route(path, null, this);
  623. for (var i = 1; i < arguments.length; ++i) {
  624. this.exits.push(route.middleware(arguments[i]));
  625. }
  626. };
  627. /**
  628. * Handle "click" events.
  629. */
  630. /* jshint +W054 */
  631. Page.prototype.clickHandler = function(e) {
  632. if (1 !== this._which(e)) return;
  633. if (e.metaKey || e.ctrlKey || e.shiftKey) return;
  634. if (e.defaultPrevented) return;
  635. // ensure link
  636. // use shadow dom when available if not, fall back to composedPath()
  637. // for browsers that only have shady
  638. var el = e.target;
  639. var eventPath = e.path || (e.composedPath ? e.composedPath() : null);
  640. if(eventPath) {
  641. for (var i = 0; i < eventPath.length; i++) {
  642. if (!eventPath[i].nodeName) continue;
  643. if (eventPath[i].nodeName.toUpperCase() !== 'A') continue;
  644. if (!eventPath[i].href) continue;
  645. el = eventPath[i];
  646. break;
  647. }
  648. }
  649. // continue ensure link
  650. // el.nodeName for svg links are 'a' instead of 'A'
  651. while (el && 'A' !== el.nodeName.toUpperCase()) el = el.parentNode;
  652. if (!el || 'A' !== el.nodeName.toUpperCase()) return;
  653. // check if link is inside an svg
  654. // in this case, both href and target are always inside an object
  655. var svg = (typeof el.href === 'object') && el.href.constructor.name === 'SVGAnimatedString';
  656. // Ignore if tag has
  657. // 1. "download" attribute
  658. // 2. rel="external" attribute
  659. if (el.hasAttribute('download') || el.getAttribute('rel') === 'external') return;
  660. // ensure non-hash for the same path
  661. var link = el.getAttribute('href');
  662. if(!this._hashbang && this._samePath(el) && (el.hash || '#' === link)) return;
  663. // Check for mailto: in the href
  664. if (link && link.indexOf('mailto:') > -1) return;
  665. // check target
  666. // svg target is an object and its desired value is in .baseVal property
  667. if (svg ? el.target.baseVal : el.target) return;
  668. // x-origin
  669. // note: svg links that are not relative don't call click events (and skip page.js)
  670. // consequently, all svg links tested inside page.js are relative and in the same origin
  671. if (!svg && !this.sameOrigin(el.href)) return;
  672. // rebuild path
  673. // There aren't .pathname and .search properties in svg links, so we use href
  674. // Also, svg href is an object and its desired value is in .baseVal property
  675. var path = svg ? el.href.baseVal : (el.pathname + el.search + (el.hash || ''));
  676. path = path[0] !== '/' ? '/' + path : path;
  677. // strip leading "/[drive letter]:" on NW.js on Windows
  678. if (hasProcess && path.match(/^\/[a-zA-Z]:\//)) {
  679. path = path.replace(/^\/[a-zA-Z]:\//, '/');
  680. }
  681. // same page
  682. var orig = path;
  683. var pageBase = this._getBase();
  684. if (path.indexOf(pageBase) === 0) {
  685. path = path.substr(pageBase.length);
  686. }
  687. if (this._hashbang) path = path.replace('#!', '');
  688. if (pageBase && orig === path && (!isLocation || this._window.location.protocol !== 'file:')) {
  689. return;
  690. }
  691. e.preventDefault();
  692. this.show(orig);
  693. };
  694. /**
  695. * Handle "populate" events.
  696. * @api private
  697. */
  698. Page.prototype._onpopstate = (function () {
  699. var loaded = false;
  700. if ( ! hasWindow ) {
  701. return function () {};
  702. }
  703. if (hasDocument && document.readyState === 'complete') {
  704. loaded = true;
  705. } else {
  706. window.addEventListener('load', function() {
  707. setTimeout(function() {
  708. loaded = true;
  709. }, 0);
  710. });
  711. }
  712. return function onpopstate(e) {
  713. if (!loaded) return;
  714. var page = this;
  715. if (e.state) {
  716. var path = e.state.path;
  717. page.replace(path, e.state);
  718. } else if (isLocation) {
  719. var loc = page._window.location;
  720. page.show(loc.pathname + loc.search + loc.hash, undefined, undefined, false);
  721. }
  722. };
  723. })();
  724. /**
  725. * Event button.
  726. */
  727. Page.prototype._which = function(e) {
  728. e = e || (hasWindow && this._window.event);
  729. return null == e.which ? e.button : e.which;
  730. };
  731. /**
  732. * Convert to a URL object
  733. * @api private
  734. */
  735. Page.prototype._toURL = function(href) {
  736. var window = this._window;
  737. if(typeof URL === 'function' && isLocation) {
  738. return new URL(href, window.location.toString());
  739. } else if (hasDocument) {
  740. var anc = window.document.createElement('a');
  741. anc.href = href;
  742. return anc;
  743. }
  744. };
  745. /**
  746. * Check if `href` is the same origin.
  747. * @param {string} href
  748. * @api public
  749. */
  750. Page.prototype.sameOrigin = function(href) {
  751. if(!href || !isLocation) return false;
  752. var url = this._toURL(href);
  753. var window = this._window;
  754. var loc = window.location;
  755. return loc.protocol === url.protocol &&
  756. loc.hostname === url.hostname &&
  757. loc.port === url.port;
  758. };
  759. /**
  760. * @api private
  761. */
  762. Page.prototype._samePath = function(url) {
  763. if(!isLocation) return false;
  764. var window = this._window;
  765. var loc = window.location;
  766. return url.pathname === loc.pathname &&
  767. url.search === loc.search;
  768. };
  769. /**
  770. * Remove URL encoding from the given `str`.
  771. * Accommodates whitespace in both x-www-form-urlencoded
  772. * and regular percent-encoded form.
  773. *
  774. * @param {string} val - URL component to decode
  775. * @api private
  776. */
  777. Page.prototype._decodeURLEncodedURIComponent = function(val) {
  778. if (typeof val !== 'string') { return val; }
  779. return this._decodeURLComponents ? decodeURIComponent(val.replace(/\+/g, ' ')) : val;
  780. };
  781. /**
  782. * Create a new `page` instance and function
  783. */
  784. function createPage(options) {
  785. var pageInstance = new Page();
  786. function pageFn(/* args */) {
  787. return page.apply(pageInstance, arguments);
  788. }
  789. // Copy all of the things over. In 2.0 maybe we use setPrototypeOf
  790. pageFn.callbacks = pageInstance.callbacks;
  791. pageFn.exits = pageInstance.exits;
  792. pageFn.base = pageInstance.base.bind(pageInstance);
  793. pageFn.strict = pageInstance.strict.bind(pageInstance);
  794. pageFn.start = pageInstance.start.bind(pageInstance);
  795. pageFn.stop = pageInstance.stop.bind(pageInstance);
  796. pageFn.show = pageInstance.show.bind(pageInstance);
  797. pageFn.back = pageInstance.back.bind(pageInstance);
  798. pageFn.redirect = pageInstance.redirect.bind(pageInstance);
  799. pageFn.replace = pageInstance.replace.bind(pageInstance);
  800. pageFn.dispatch = pageInstance.dispatch.bind(pageInstance);
  801. pageFn.exit = pageInstance.exit.bind(pageInstance);
  802. pageFn.configure = pageInstance.configure.bind(pageInstance);
  803. pageFn.sameOrigin = pageInstance.sameOrigin.bind(pageInstance);
  804. pageFn.clickHandler = pageInstance.clickHandler.bind(pageInstance);
  805. pageFn.create = createPage;
  806. Object.defineProperty(pageFn, 'len', {
  807. get: function(){
  808. return pageInstance.len;
  809. },
  810. set: function(val) {
  811. pageInstance.len = val;
  812. }
  813. });
  814. Object.defineProperty(pageFn, 'current', {
  815. get: function(){
  816. return pageInstance.current;
  817. },
  818. set: function(val) {
  819. pageInstance.current = val;
  820. }
  821. });
  822. // In 2.0 these can be named exports
  823. pageFn.Context = Context;
  824. pageFn.Route = Route;
  825. return pageFn;
  826. }
  827. /**
  828. * Register `path` with callback `fn()`,
  829. * or route `path`, or redirection,
  830. * or `page.start()`.
  831. *
  832. * page(fn);
  833. * page('*', fn);
  834. * page('/user/:id', load, user);
  835. * page('/user/' + user.id, { some: 'thing' });
  836. * page('/user/' + user.id);
  837. * page('/from', '/to')
  838. * page();
  839. *
  840. * @param {string|!Function|!Object} path
  841. * @param {Function=} fn
  842. * @api public
  843. */
  844. function page(path, fn) {
  845. // <callback>
  846. if ('function' === typeof path) {
  847. return page.call(this, '*', path);
  848. }
  849. // route <path> to <callback ...>
  850. if ('function' === typeof fn) {
  851. var route = new Route(/** @type {string} */ (path), null, this);
  852. for (var i = 1; i < arguments.length; ++i) {
  853. this.callbacks.push(route.middleware(arguments[i]));
  854. }
  855. // show <path> with [state]
  856. } else if ('string' === typeof path) {
  857. this['string' === typeof fn ? 'redirect' : 'show'](path, fn);
  858. // start [options]
  859. } else {
  860. this.start(path);
  861. }
  862. }
  863. /**
  864. * Unhandled `ctx`. When it's not the initial
  865. * popstate then redirect. If you wish to handle
  866. * 404s on your own use `page('*', callback)`.
  867. *
  868. * @param {Context} ctx
  869. * @api private
  870. */
  871. function unhandled(ctx) {
  872. if (ctx.handled) return;
  873. var current;
  874. var page = this;
  875. var window = page._window;
  876. if (page._hashbang) {
  877. current = isLocation && this._getBase() + window.location.hash.replace('#!', '');
  878. } else {
  879. current = isLocation && window.location.pathname + window.location.search;
  880. }
  881. if (current === ctx.canonicalPath) return;
  882. page.stop();
  883. ctx.handled = false;
  884. isLocation && (window.location.href = ctx.canonicalPath);
  885. }
  886. /**
  887. * Initialize a new "request" `Context`
  888. * with the given `path` and optional initial `state`.
  889. *
  890. * @constructor
  891. * @param {string} path
  892. * @param {Object=} state
  893. * @api public
  894. */
  895. function Context(path, state, pageInstance) {
  896. var _page = this.page = pageInstance || page;
  897. var window = _page._window;
  898. var hashbang = _page._hashbang;
  899. var pageBase = _page._getBase();
  900. if ('/' === path[0] && 0 !== path.indexOf(pageBase)) path = pageBase + (hashbang ? '#!' : '') + path;
  901. var i = path.indexOf('?');
  902. this.canonicalPath = path;
  903. this.path = path.replace(pageBase, '') || '/';
  904. if (hashbang) this.path = this.path.replace('#!', '') || '/';
  905. this.title = (hasDocument && window.document.title);
  906. this.state = state || {};
  907. this.state.path = path;
  908. this.querystring = ~i ? _page._decodeURLEncodedURIComponent(path.slice(i + 1)) : '';
  909. this.pathname = _page._decodeURLEncodedURIComponent(~i ? path.slice(0, i) : path);
  910. this.params = {};
  911. // fragment
  912. this.hash = '';
  913. if (!hashbang) {
  914. if (!~this.path.indexOf('#')) return;
  915. var parts = this.path.split('#');
  916. this.path = this.pathname = parts[0];
  917. this.hash = _page._decodeURLEncodedURIComponent(parts[1]) || '';
  918. this.querystring = this.querystring.split('#')[0];
  919. }
  920. }
  921. /**
  922. * Push state.
  923. *
  924. * @api private
  925. */
  926. Context.prototype.pushState = function() {
  927. var page = this.page;
  928. var window = page._window;
  929. var hashbang = page._hashbang;
  930. page.len++;
  931. if (hasHistory) {
  932. window.history.pushState(this.state, this.title,
  933. hashbang && this.path !== '/' ? '#!' + this.path : this.canonicalPath);
  934. }
  935. };
  936. /**
  937. * Save the context state.
  938. *
  939. * @api public
  940. */
  941. Context.prototype.save = function() {
  942. var page = this.page;
  943. if (hasHistory && page._window.location.protocol !== 'file:') {
  944. page._window.history.replaceState(this.state, this.title,
  945. page._hashbang && this.path !== '/' ? '#!' + this.path : this.canonicalPath);
  946. }
  947. };
  948. /**
  949. * Initialize `Route` with the given HTTP `path`,
  950. * and an array of `callbacks` and `options`.
  951. *
  952. * Options:
  953. *
  954. * - `sensitive` enable case-sensitive routes
  955. * - `strict` enable strict matching for trailing slashes
  956. *
  957. * @constructor
  958. * @param {string} path
  959. * @param {Object=} options
  960. * @api private
  961. */
  962. function Route(path, options, page) {
  963. var _page = this.page = page || globalPage;
  964. var opts = options || {};
  965. opts.strict = opts.strict || page._strict;
  966. this.path = (path === '*') ? '(.*)' : path;
  967. this.method = 'GET';
  968. this.regexp = pathToRegexp_1(this.path, this.keys = [], opts);
  969. }
  970. /**
  971. * Return route middleware with
  972. * the given callback `fn()`.
  973. *
  974. * @param {Function} fn
  975. * @return {Function}
  976. * @api public
  977. */
  978. Route.prototype.middleware = function(fn) {
  979. var self = this;
  980. return function(ctx, next) {
  981. if (self.match(ctx.path, ctx.params)) return fn(ctx, next);
  982. next();
  983. };
  984. };
  985. /**
  986. * Check if this route matches `path`, if so
  987. * populate `params`.
  988. *
  989. * @param {string} path
  990. * @param {Object} params
  991. * @return {boolean}
  992. * @api private
  993. */
  994. Route.prototype.match = function(path, params) {
  995. var keys = this.keys,
  996. qsIndex = path.indexOf('?'),
  997. pathname = ~qsIndex ? path.slice(0, qsIndex) : path,
  998. m = this.regexp.exec(decodeURIComponent(pathname));
  999. if (!m) return false;
  1000. for (var i = 1, len = m.length; i < len; ++i) {
  1001. var key = keys[i - 1];
  1002. var val = this.page._decodeURLEncodedURIComponent(m[i]);
  1003. if (val !== undefined || !(hasOwnProperty.call(params, key.name))) {
  1004. params[key.name] = val;
  1005. }
  1006. }
  1007. return true;
  1008. };
  1009. /**
  1010. * Module exports.
  1011. */
  1012. var globalPage = createPage();
  1013. var page_js = globalPage;
  1014. page.default = globalPage;
  1015. return page_js;
  1016. })));