widget-router
Version:
Widget Router is another Typescript (also JavaScript) Router, but this one works better if used in widgets inside HTML
186 lines • 9.99 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var Utilities_1 = require("./Utilities");
var TemplateProvider_1 = require("./TemplateProvider");
var event_handler_manager_1 = require("event-handler-manager");
var WidgetRouter = (function (_super) {
__extends(WidgetRouter, _super);
//public templatesCollection: Object;
function WidgetRouter(containerId, routeConfig, appScope, controllerHelper) {
var _this = _super.call(this) || this;
var currentContainer = document.querySelector(containerId);
if (currentContainer === undefined || currentContainer === null) {
throw new Error(containerId + ' was not found inside document, please set a valid container Id selector.');
}
_this.containerId = containerId;
_this.routeConfig = routeConfig;
_this.appScope = appScope ? appScope : {};
routeConfig.routes.forEach(function (route) {
_this.appScope[route.name] = {};
});
_this.controllerHelper = controllerHelper;
_this.pageIdPrefix = routeConfig.pageIdPrefix !== undefined && routeConfig.pageIdPrefix !== null ? routeConfig.pageIdPrefix : '';
_this.controllersInitiated = {};
_this.routeConfig.routes.forEach(function (route) {
var currentPage = document.querySelector(_this.containerId).querySelector('#' + _this.pageIdPrefix + route.name);
if (currentPage === undefined || currentPage === null) {
document.querySelector(_this.containerId).innerHTML += '<div id="' +
_this.pageIdPrefix +
route.name +
'" style="display:none;"></div>';
}
else {
currentPage.style.display = 'none';
}
});
_this.templateProvider = new TemplateProvider_1.TemplateProvider();
if (_this.routeConfig.usingTemplates) {
if (controllerHelper === undefined && controllerHelper === null) {
controllerHelper = {};
}
controllerHelper.templatesCollection = {};
}
_this.attach(['beforego', 'aftergo']);
return _this;
}
WidgetRouter.prototype.executeController = function (routeName, params, templateContent, initController, currentRouteConfig) {
var _this = this;
var dfd = new Promise(function (resolve, reject) {
var routeResult = {
routeName: routeName,
routeParams: params,
routeScope: _this.appScope[routeName],
router: _this,
controllerHelper: _this.controllerHelper
};
if (_this.routeConfig.usingTemplates) {
if (_this.controllerHelper.templatesCollection === undefined ||
_this.controllerHelper.templatesCollection === null) {
_this.controllerHelper.templatesCollection = {};
}
_this.controllerHelper.templatesCollection[routeName] = templateContent;
}
if (initController && Utilities_1.Utilities.isFunction(currentRouteConfig.controller)) {
(function () {
try {
var controllerResult = currentRouteConfig.controller(routeResult);
if (controllerResult !== undefined && controllerResult !== null && !!controllerResult.then && typeof controllerResult.then === 'function') {
controllerResult.then(function () {
resolve(routeResult);
}).catch(function (err) {
console.error(err);
});
}
else {
_this.controllersInitiated[routeName] = true;
resolve(routeResult);
}
}
catch (e) {
console.error(e);
reject(e);
}
})();
}
else {
resolve(routeResult);
}
});
return dfd;
};
WidgetRouter.prototype.go = function (routeName, params, noCache, initController) {
var _this = this;
var dfd = new Promise(function (resolve, reject) {
_this.trigger('beforego').then(function () {
var currentRouteConfig = _this.routeConfig.routes.find(function (route) {
return route.name === routeName;
});
if (currentRouteConfig === undefined || currentRouteConfig == null) {
throw new Error('Route Configuration not found for that Route Name');
}
_this.routeConfig.afterRouteInitController = _this.routeConfig.afterRouteInitController !== undefined &&
_this.routeConfig.afterRouteInitController !== null
? _this.routeConfig.afterRouteInitController
: true;
initController = initController !== undefined && initController !== null ? initController : _this.routeConfig.afterRouteInitController;
initController = currentRouteConfig.controller !== undefined && currentRouteConfig.controller !== null
? initController
: false;
if (_this.activePage !== undefined && _this.activePage !== null && _this.activePage.trim() !== '') {
var activePage = document.querySelector(_this.containerId).querySelector('#' + _this.pageIdPrefix + _this.activePage);
activePage.style.display = 'none';
}
var newActivePage = document.querySelector(_this.containerId).querySelector('#' + _this.pageIdPrefix + routeName);
if (newActivePage === undefined || newActivePage === null) {
document.querySelector(_this.containerId).innerHTML += '<div id="' + _this.pageIdPrefix + routeName + '">';
newActivePage = document.querySelector(_this.containerId).querySelector('#' + _this.pageIdPrefix + routeName);
}
else {
newActivePage.style.display = 'block';
}
_this.activePage = routeName;
if (currentRouteConfig.templateFile !== undefined &&
currentRouteConfig.templateFile !== null &&
currentRouteConfig.templateFile.trim() !== '') {
_this.getTemplateFromFile(currentRouteConfig.templateFile).then(function (templateContent) {
if (!_this.routeConfig.usingTemplates) {
newActivePage.innerHTML = templateContent;
}
_this.executeController(routeName, params, templateContent, initController, currentRouteConfig).then(function (routeResult) {
_this.trigger('aftergo').then(function () {
resolve(routeResult);
}).catch(function (err) { return reject(err); }).catch(function (err) { return reject(err); });
}).catch(function (err) {
console.error(err);
reject(err);
});
}).catch(function (err) {
console.error(err);
reject(err);
});
}
else {
if (newActivePage !== undefined && newActivePage !== null && currentRouteConfig.template !== undefined && currentRouteConfig.template !== null && currentRouteConfig.template.trim() !== '' && !_this.routeConfig.usingTemplates) {
newActivePage.innerHTML = currentRouteConfig.template;
}
_this.executeController(routeName, params, currentRouteConfig.template, initController, currentRouteConfig).then(function (routeResult) {
_this.trigger('aftergo').then(function () {
resolve(routeResult);
}).catch(function (err) { return reject(err); }).catch(function (err) { return reject(err); });
}).catch(function (err) {
console.error(err);
reject(err);
});
}
}).catch(function (err) {
console.error(err);
});
});
return dfd;
};
WidgetRouter.prototype.getTemplateFromFile = function (templateFile) {
var _this = this;
var dfd = new Promise(function (resolve, reject) {
_this.templateProvider.get(templateFile).then(function (templateContent) {
resolve(templateContent);
}).catch(function (error) {
console.log(error);
reject(error);
});
});
return dfd;
};
return WidgetRouter;
}(event_handler_manager_1.EventHandlerManager));
exports.WidgetRouter = WidgetRouter;
//# sourceMappingURL=WidgetRouter.js.map