From 0ebd6d1ab43043388272885bdf80fb5d2c653b8b Mon Sep 17 00:00:00 2001
From: MattMo <matt@montoyatech.com>
Date: Sun, 9 Jul 2023 22:24:33 -0700
Subject: [PATCH] Cleaned up code and fixed a bug where parameters were not
taking into consideration with routes that are not root based.
---
ignite-html-router.js | 39 ++++++++++++++++++++++-----------------
1 file changed, 22 insertions(+), 17 deletions(-)
diff --git a/ignite-html-router.js b/ignite-html-router.js
index e397849..4918a42 100644
--- a/ignite-html-router.js
+++ b/ignite-html-router.js
@@ -1,7 +1,7 @@
import { IgniteHtml, IgniteRendering } from "../ignite-html/ignite-html.js";
import { IgniteElement } from "../ignite-html/ignite-element.js";
import { IgniteTemplate, slot, div, html } from "../ignite-html/ignite-template.js";
-import { IgniteCallback, IgniteProperty} from "../ignite-html/ignite-html.js";
+import { IgniteCallback, IgniteProperty } from "../ignite-html/ignite-html.js";
/**
* Creates a route listener that runs when a route is switched. The listener will run on construct the first time and update the state.
@@ -13,7 +13,7 @@ import { IgniteCallback, IgniteProperty} from "../ignite-html/ignite-html.js";
* @param {Boolean} strict If true all routes must match before running the callback. Default is false.
* @returns {IgniteTemplate} This ignite template.
*/
-IgniteTemplate.prototype.route = function(routes, showCallback = null, hideCallback = null, strict = false) {
+IgniteTemplate.prototype.route = function (routes, showCallback = null, hideCallback = null, strict = false) {
//If routes is not an array, wrap it.
if (!Array.isArray(routes)) {
routes = [routes];
@@ -21,7 +21,7 @@ IgniteTemplate.prototype.route = function(routes, showCallback = null, hideCallb
//By default hide this route.
this.element.style.setProperty("display", "none", "important");
-
+
//Create an update method that will be used to check and see if the route is met.
var update = (event) => {
var routeMatches = false;
@@ -93,7 +93,7 @@ IgniteTemplate.prototype.route = function(routes, showCallback = null, hideCallb
* @param {Boolean|IgniteProperty|Function} keepQuery Whether or not to keep the current url query, default is false.
* @returns {IgniteTemplate} This ignite template.
*/
-IgniteTemplate.prototype.navigate = function(route, data = null, refresh = false, keepQuery = false) {
+IgniteTemplate.prototype.navigate = function (route, data = null, refresh = false, keepQuery = false) {
return this.onClick((e) => {
Router.navigate(
(route instanceof IgniteProperty ? route.value : (route instanceof Function ? route() : route)),
@@ -338,7 +338,7 @@ class Router {
* @param {String} fallback The fallback route incase there is no history, default is null.
* @param {Boolean} refresh Whether or not to refresh the page, default is false.
*/
- static back(fallback = null, refresh = false) {
+ static back(fallback = null, refresh = false) {
if (Router.states && Router.states.length > 1) {
Router.states.pop(); //Pop the current state.
Router.navigate(Router.states.pop(), null, refresh); //Navigate to the previous state.
@@ -354,7 +354,7 @@ class Router {
window.history.back();
}
}
- }
+ }
/**
* Returns whether or not the current location matches a given route.
@@ -371,7 +371,7 @@ class Router {
//If hash mode is set and we have a hash location, get it and split it.
if (Router.hashMode && window.location.hash && window.location.hash.length > 0) {
- var path = window.location.hash.substr(1);
+ var path = window.location.hash.substring(1);
//If the path contains ? then remove the query.
if (path.includes("?")) {
@@ -392,11 +392,12 @@ class Router {
var fromRoot = (route.trim().startsWith("/"));
var routeParts = (fromRoot ? route.trim().split("/").splice(1) : route.trim().split("/"));
- //Check to see if we have a trailing route part, if so, remove it.
+ //Remove trailing parts
if (pathParts.length > 0 && pathParts[pathParts.length - 1] == "") {
pathParts.pop();
}
+ //Remove trailing parts
if (routeParts.length > 0 && routeParts[routeParts.length - 1] == "") {
routeParts.pop();
}
@@ -405,7 +406,7 @@ class Router {
if (pathParts.length == 0 && routeParts.length == 0) {
return true;
}
- //If path parts is 0, and the route part is ** then this is a match.
+ //If path parts is 0, and the route part is a wildcard then this is a match.
else if (pathParts.length == 0 && routeParts.length == 1 && (routeParts[0] == "**" || routeParts[0] == "*")) {
return true;
}
@@ -413,7 +414,7 @@ class Router {
else if (pathParts.length == 0 && routeParts.length == 1 && routeParts[0].startsWith("!")) {
return true;
}
- //If the path parts is 0 and the route is !*/** then this is a match
+ //If the path parts is 0 and the route is an exclude wildcard then this is a match
else if (pathParts.length == 0 && routeParts.length == 2 && routeParts[0].startsWith("!") && routeParts[1] == "**") {
return true;
}
@@ -446,16 +447,20 @@ class Router {
}
} else {
for (var offset = 0; offset < pathParts.length; offset++) {
- for (var i = 0; i < max; i++) {
- if (i + offset >= pathParts.length) {
+ for (var i = 0; i <= max; i++) {
+ if (i == max) {
+ return true;
+ } else if (i + offset >= pathParts.length) {
return false;
- }
- else if (routeParts[i].startsWith("!") && pathParts[i + offset] == routeParts[i].substring(1)) {
+ } else if (routeParts[i].startsWith("{") && routeParts[i].endsWith("}")) {
+ if (data) {
+ data[routeParts[i].substring(1, routeParts[i].length - 1)] = pathParts[i + offset];
+ }
+ } else if (routeParts[i].startsWith("!") && pathParts[i + offset] == routeParts[i].substring(1)) {
break;
} else if (routeParts[i] == "**") {
return true;
- }
- else if (routeParts[i] != pathParts[i + offset] && routeParts[i] != "*" && !routeParts[i].startsWith("!")) {
+ } else if (routeParts[i] != pathParts[i + offset] && routeParts[i] != "*" && !routeParts[i].startsWith("!")) {
break;
} else if (i + 1 == routeParts.length && offset + routeParts.length == pathParts.length) {
return true;
@@ -477,7 +482,7 @@ class Router {
static getParameter(name) {
if (Router.hashMode) {
var params = new URLSearchParams(window.location.hash.includes("?") ? "?" + window.location.hash.split("?")[1] : "");
- return (params.has(name) ? params.get(name) : null);
+ return (params.has(name) ? params.get(name) : null);
} else {
var params = new URLSearchParams(window.location.search);
return (params.has(name) ? params.get(name) : null);