149 lines
5.6 KiB
HTML
149 lines
5.6 KiB
HTML
<!-- Components -->
|
|
<link rel="import" href="../../bower_components/polymer/polymer.html">
|
|
<link rel="import" href="../../bower_components/app-route/app-location.html">
|
|
<link rel="import" href="../../bower_components/app-route/app-route.html">
|
|
|
|
<dom-module id="c-app-routing">
|
|
<template>
|
|
<!-- Routing -->
|
|
<app-location use-hash-as-path="[[useHashAsPath]]" route="{{route}}"></app-location>
|
|
<app-route route="{{route}}" data="{{routeData}}" tail="{{routeTail}}" pattern="/:page"></app-route>
|
|
</template>
|
|
|
|
<script>
|
|
Polymer({
|
|
<!-- Settings -->
|
|
is: "c-app-routing",
|
|
|
|
<!-- Properties -->
|
|
properties: {
|
|
useHashAsPath: {
|
|
type: Boolean
|
|
},
|
|
authValid: {
|
|
type: Boolean
|
|
},
|
|
loginPage: {
|
|
type: String,
|
|
value: "login"
|
|
},
|
|
exposedPages: {
|
|
type: Array,
|
|
value: []
|
|
},
|
|
returnPath: {
|
|
type: String
|
|
},
|
|
page: {
|
|
type: String,
|
|
notify: true
|
|
},
|
|
path: {
|
|
type: String
|
|
},
|
|
routeData: {
|
|
type: Object,
|
|
notify: true
|
|
},
|
|
routeTail: {
|
|
type: Object,
|
|
notify: true
|
|
}
|
|
},
|
|
|
|
<!-- Observers -->
|
|
observers: [
|
|
"observeRouteData(routeData)",
|
|
"observeRoutePath(route.path)",
|
|
"redirectApp(path, authValid)"
|
|
],
|
|
|
|
computeDefaultPage: function (userConfig) {
|
|
if (userConfig == null)
|
|
return "inspector";
|
|
|
|
Strolch.setUserConfig(userConfig);
|
|
|
|
if (Strolch.hasRole("StrolchAdmin")) {
|
|
return "demo-locations";
|
|
} else {
|
|
return "demo-books";
|
|
}
|
|
},
|
|
|
|
observeRouteData: function (routeData) {
|
|
// redirect to login or default if there is no page
|
|
if (!routeData.page) {
|
|
var firstPage = this.authValid ? this.computeDefaultPage(Strolch.getUserConfig()) : this.loginPage;
|
|
this.replaceCurrentPage(firstPage);
|
|
} else {
|
|
// this debounces multiple page changes by the app route component
|
|
this.set("page", routeData.page);
|
|
}
|
|
},
|
|
observeRoutePath: function (routePath) {
|
|
// this debounces multiple path changes by the app route component
|
|
this.set("path", routePath);
|
|
},
|
|
redirectApp: function (path, authValid) {
|
|
// find the base of the path
|
|
var pathBase = path.split("/")[1];
|
|
|
|
// prevent navigation to login if the auth is still valid
|
|
if (pathBase === this.loginPage && authValid) {
|
|
// instead return to a path that was tried to access before login or the default page
|
|
if (this.returnPath) {
|
|
this.replaceCurrentPath(this.returnPath);
|
|
} else {
|
|
this.replaceCurrentPage(this.computeDefaultPage(Strolch.getUserConfig()));
|
|
}
|
|
}
|
|
|
|
// prevent navigation to any page but exposed pages if the auth is invalid
|
|
var accessesExposedPage = (pathBase === this.loginPage || this.exposedPages.indexOf(pathBase) !== -1);
|
|
if (!accessesExposedPage && authValid === false) {
|
|
console.log("Not authenticated, navigating from page " + pathBase + " to " + this.loginPage);
|
|
// instead save this path to return after login and go to login
|
|
this.set("returnPath", path);
|
|
this.replaceCurrentPage(this.loginPage);
|
|
}
|
|
},
|
|
|
|
<!-- Functions -->
|
|
replaceCurrentPage: function (currentPage) {
|
|
this.replaceCurrentPath("/" + currentPage);
|
|
},
|
|
replaceCurrentPath: function (currentPath) {
|
|
var _currentPath = (this.useHashAsPath ? "#" : "") + currentPath;
|
|
history.replaceState({}, _currentPath, _currentPath);
|
|
this.updateRoutePath(currentPath);
|
|
},
|
|
pushNextPage: function (nextPage, keepQueryParams) {
|
|
this.pushNextPath("/" + nextPage, keepQueryParams);
|
|
},
|
|
pushNextPath: function (nextPath, keepQueryParams) {
|
|
|
|
if (keepQueryParams) {
|
|
var queryParams = Strolch.getQueryParamsAsString();
|
|
if (Strolch.isNotEmptyString(queryParams)) {
|
|
if (nextPath.endsWith('/'))
|
|
nextPath = nextPath + '?' + queryParams;
|
|
else
|
|
nextPath = nextPath + '/?' + queryParams;
|
|
}
|
|
}
|
|
|
|
var _nextPath = (this.useHashAsPath ? "#" : "") + nextPath;
|
|
history.pushState({}, _nextPath, _nextPath);
|
|
this.updateRoutePath(nextPath);
|
|
},
|
|
updateRoutePath: function (path) {
|
|
if (this.route.path !== path) {
|
|
this.set("route.path", path);
|
|
this.notifyPath("route.path");
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
</dom-module>
|