nativescript-angular
Version:
An Angular renderer that lets you build mobile apps with NativeScript.
440 lines • 19.9 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var view_1 = require("tns-core-modules/ui/core/view");
var application_1 = require("tns-core-modules/application");
var profiling_1 = require("tns-core-modules/profiling");
var platform_providers_1 = require("./platform-providers");
var view_util_1 = require("./view-util");
var element_registry_1 = require("./element-registry");
var trace_1 = require("./trace");
// CONTENT_ATTR not exported from NativeScript_renderer - we need it for styles application.
var COMPONENT_REGEX = /%COMP%/g;
exports.COMPONENT_VARIABLE = "%COMP%";
exports.HOST_ATTR = "_nghost-" + exports.COMPONENT_VARIABLE;
exports.CONTENT_ATTR = "_ngcontent-" + exports.COMPONENT_VARIABLE;
var ATTR_SANITIZER = /-/g;
var NativeScriptRendererFactory = /** @class */ (function () {
function NativeScriptRendererFactory(rootView, device, zone) {
this.zone = zone;
this.componentRenderers = new Map();
this.viewUtil = new view_util_1.ViewUtil(device);
this.setRootNgView(rootView);
this.defaultRenderer = new NativeScriptRenderer(this.rootNgView, zone, this.viewUtil);
}
NativeScriptRendererFactory.prototype.setRootNgView = function (rootView) {
if (!rootView) {
rootView = platform_providers_1.getRootPage();
}
rootView.nodeName = "NONE";
this.rootNgView = rootView;
};
NativeScriptRendererFactory.prototype.createRenderer = function (element, type) {
if (!element || !type) {
return this.defaultRenderer;
}
var renderer = this.componentRenderers.get(type.id);
if (renderer) {
return renderer;
}
if (type.encapsulation === core_1.ViewEncapsulation.None) {
type.styles.map(function (s) { return s.toString(); }).forEach(addStyleToCss);
renderer = this.defaultRenderer;
}
else {
renderer = new EmulatedRenderer(type, this.rootNgView, this.zone, this.viewUtil);
renderer.applyToHost(element);
}
this.componentRenderers.set(type.id, renderer);
return renderer;
};
NativeScriptRendererFactory.prototype.ngOnDestroy = function () {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRendererFactory.ngOnDestroy()");
}
while (this.rootNgView && this.rootNgView.firstChild) {
this.viewUtil.removeChild(this.rootNgView, this.rootNgView.firstChild);
}
};
NativeScriptRendererFactory = __decorate([
core_1.Injectable(),
__param(0, core_1.Optional()), __param(0, core_1.Inject(platform_providers_1.APP_ROOT_VIEW)),
__param(1, core_1.Inject(platform_providers_1.DEVICE)),
__metadata("design:paramtypes", [view_1.View, Object, core_1.NgZone])
], NativeScriptRendererFactory);
return NativeScriptRendererFactory;
}());
exports.NativeScriptRendererFactory = NativeScriptRendererFactory;
var NativeScriptRenderer = /** @class */ (function (_super) {
__extends(NativeScriptRenderer, _super);
function NativeScriptRenderer(rootView, zone, viewUtil) {
var _this = _super.call(this) || this;
_this.rootView = rootView;
_this.zone = zone;
_this.viewUtil = viewUtil;
_this.data = Object.create(null);
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer created");
}
return _this;
}
NativeScriptRenderer.prototype.appendChild = function (parent, newChild) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.appendChild child: " + newChild + " parent: " + parent);
}
this.viewUtil.insertChild(parent, newChild);
};
NativeScriptRenderer.prototype.insertBefore = function (parent, newChild, _a) {
var previous = _a.previous, next = _a.next;
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.insertBefore child: " + newChild + " " +
("parent: " + parent + " previous: " + previous + " next: " + next));
}
this.viewUtil.insertChild(parent, newChild, previous, next);
};
NativeScriptRenderer.prototype.removeChild = function (parent, oldChild) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.removeChild child: " + oldChild + " parent: " + parent);
}
this.viewUtil.removeChild(parent, oldChild);
};
NativeScriptRenderer.prototype.selectRootElement = function (selector) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.selectRootElement: " + selector);
}
if (selector && selector[0] === "#") {
var result = view_1.getViewById(this.rootView, selector.slice(1));
return (result || this.rootView);
}
return this.rootView;
};
NativeScriptRenderer.prototype.parentNode = function (node) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.parentNode for node: " + node + " is " + node.parentNode);
}
return node.parentNode;
};
NativeScriptRenderer.prototype.nextSibling = function (node) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.nextSibling of " + node + " is " + node.nextSibling);
}
return {
previous: node,
next: node.nextSibling,
};
};
NativeScriptRenderer.prototype.createComment = function (_value) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.createComment " + _value);
}
return this.viewUtil.createComment();
};
NativeScriptRenderer.prototype.createElement = function (name, _namespace) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.createElement: " + name);
}
return this.viewUtil.createView(name);
};
NativeScriptRenderer.prototype.createText = function (_value) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.createText " + _value);
}
return this.viewUtil.createText();
};
NativeScriptRenderer.prototype.createViewRoot = function (hostElement) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.createViewRoot " + hostElement.nodeName);
}
return hostElement;
};
NativeScriptRenderer.prototype.projectNodes = function (parentElement, nodes) {
var _this = this;
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.projectNodes");
}
nodes.forEach(function (node) { return _this.viewUtil.insertChild(parentElement, node); });
};
NativeScriptRenderer.prototype.destroy = function () {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.destroy");
}
// Seems to be called on component dispose only (router outlet)
// TODO: handle this when we resolve routing and navigation.
};
NativeScriptRenderer.prototype.setAttribute = function (view, name, value, namespace) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.setAttribute " + view + " : " + name + " = " + value + ", namespace: " + namespace);
}
return this.viewUtil.setProperty(view, name, value, namespace);
};
NativeScriptRenderer.prototype.removeAttribute = function (_el, _name) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.removeAttribute " + _el + ": " + _name);
}
};
NativeScriptRenderer.prototype.setProperty = function (view, name, value) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.setProperty " + view + " : " + name + " = " + value);
}
return this.viewUtil.setProperty(view, name, value);
};
NativeScriptRenderer.prototype.addClass = function (view, name) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.addClass " + name);
}
this.viewUtil.addClass(view, name);
};
NativeScriptRenderer.prototype.removeClass = function (view, name) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.removeClass " + name);
}
this.viewUtil.removeClass(view, name);
};
NativeScriptRenderer.prototype.setStyle = function (view, styleName, value, _flags) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.setStyle: " + styleName + " = " + value);
}
this.viewUtil.setStyle(view, styleName, value);
};
NativeScriptRenderer.prototype.removeStyle = function (view, styleName, _flags) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.removeStyle: ${styleName}");
}
this.viewUtil.removeStyle(view, styleName);
};
// Used only in debug mode to serialize property changes to comment nodes,
// such as <template> placeholders.
NativeScriptRenderer.prototype.setBindingDebugInfo = function (renderElement, propertyName, propertyValue) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.setBindingDebugInfo: " + renderElement + ", " + propertyName + " = " + propertyValue);
}
};
NativeScriptRenderer.prototype.setElementDebugInfo = function (renderElement, _info /*RenderDebugInfo*/) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.setElementDebugInfo: " + renderElement);
}
};
NativeScriptRenderer.prototype.invokeElementMethod = function (_renderElement, methodName, args) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.invokeElementMethod " + methodName + " " + args);
}
};
NativeScriptRenderer.prototype.setValue = function (_renderNode, _value) {
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.setValue renderNode: " + _renderNode + ", value: " + _value);
}
};
NativeScriptRenderer.prototype.listen = function (renderElement, eventName, callback) {
var _this = this;
if (trace_1.isLogEnabled()) {
trace_1.rendererLog("NativeScriptRenderer.listen: " + eventName);
}
// Explicitly wrap in zone
var zonedCallback = function () {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
_this.zone.run(function () {
callback.apply(undefined, args);
});
};
renderElement.on(eventName, zonedCallback);
if (eventName === view_1.View.loadedEvent && renderElement.isLoaded) {
var notifyData = { eventName: view_1.View.loadedEvent, object: renderElement };
zonedCallback(notifyData);
}
return function () { return renderElement.off(eventName, zonedCallback); };
};
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, Object]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "appendChild", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, Object, Object]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "insertBefore", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, Object]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "removeChild", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [String]),
__metadata("design:returntype", Object)
], NativeScriptRenderer.prototype, "selectRootElement", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", Object)
], NativeScriptRenderer.prototype, "parentNode", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", Object)
], NativeScriptRenderer.prototype, "nextSibling", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", element_registry_1.InvisibleNode)
], NativeScriptRenderer.prototype, "createComment", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String]),
__metadata("design:returntype", Object)
], NativeScriptRenderer.prototype, "createElement", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [String]),
__metadata("design:returntype", element_registry_1.InvisibleNode)
], NativeScriptRenderer.prototype, "createText", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", Object)
], NativeScriptRenderer.prototype, "createViewRoot", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, Array]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "projectNodes", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", []),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "destroy", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, String, String]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "setAttribute", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "removeAttribute", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, Object]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "setProperty", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "addClass", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "removeClass", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, Object, Number]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "setStyle", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, Number]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "removeStyle", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, String]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "setBindingDebugInfo", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, Object]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "setElementDebugInfo", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, Array]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "invokeElementMethod", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String]),
__metadata("design:returntype", void 0)
], NativeScriptRenderer.prototype, "setValue", null);
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object, String, Function]),
__metadata("design:returntype", Function)
], NativeScriptRenderer.prototype, "listen", null);
return NativeScriptRenderer;
}(core_1.Renderer2));
exports.NativeScriptRenderer = NativeScriptRenderer;
var EmulatedRenderer = /** @class */ (function (_super) {
__extends(EmulatedRenderer, _super);
function EmulatedRenderer(component, rootView, zone, viewUtil) {
var _this = _super.call(this, rootView, zone, viewUtil) || this;
var componentId = component.id.replace(ATTR_SANITIZER, "_");
_this.contentAttr = replaceNgAttribute(exports.CONTENT_ATTR, componentId);
_this.hostAttr = replaceNgAttribute(exports.HOST_ATTR, componentId);
_this.addStyles(component.styles, componentId);
return _this;
}
EmulatedRenderer.prototype.applyToHost = function (view) {
_super.prototype.setAttribute.call(this, view, this.hostAttr, "");
};
EmulatedRenderer.prototype.appendChild = function (parent, newChild) {
_super.prototype.appendChild.call(this, parent, newChild);
};
EmulatedRenderer.prototype.createElement = function (parent, name) {
var view = _super.prototype.createElement.call(this, parent, name);
// Set an attribute to the view to scope component-specific css.
// The property name is pre-generated by Angular.
_super.prototype.setAttribute.call(this, view, this.contentAttr, "");
return view;
};
EmulatedRenderer.prototype.addStyles = function (styles, componentId) {
styles.map(function (s) { return s.toString(); })
.map(function (s) { return replaceNgAttribute(s, componentId); })
.forEach(addStyleToCss);
};
__decorate([
profiling_1.profile,
__metadata("design:type", Function),
__metadata("design:paramtypes", [Array, String]),
__metadata("design:returntype", void 0)
], EmulatedRenderer.prototype, "addStyles", null);
return EmulatedRenderer;
}(NativeScriptRenderer));
var ɵ0 = function addStyleToCss(style) {
application_1.addCss(style);
};
exports.ɵ0 = ɵ0;
// tslint:disable-next-line
var addStyleToCss = profiling_1.profile('"renderer".addStyleToCss', ɵ0);
function replaceNgAttribute(input, componentId) {
return input.replace(COMPONENT_REGEX, componentId);
}
//# sourceMappingURL=renderer.js.map