WidgetRendition.ts
129 lines
| 4.8 KiB
| video/mp2t
|
TypeScriptLexer
cin
|
r65 | import { argumentNotNull } from "@implab/core-amd/safe"; | ||
|
cin
|
r96 | import { getItemDom, RenditionBase } from "./RenditionBase"; | ||
| import { DojoNodePosition, isElementNode, isInPage, isWidget, placeAt } from "./traits"; | ||||
|
cin
|
r65 | import registry = require("dijit/registry"); | ||
| import ContentPane = require("dijit/layout/ContentPane"); | ||||
|
cin
|
r96 | import { IScope } from "./Scope"; | ||
| import { getScope } from "./Renderer"; | ||||
|
cin
|
r65 | |||
| // tslint:disable-next-line: class-name | ||||
| export interface _Widget { | ||||
| domNode: Node; | ||||
| containerNode?: Node; | ||||
| placeAt?(refNode: string | Node, position?: DojoNodePosition): void; | ||||
| startup?(): void; | ||||
| addChild?(widget: any, index?: number): void; | ||||
| } | ||||
| export type _WidgetCtor = new (attrs: any, srcNode?: string | Node) => _Widget; | ||||
| export class WidgetRendition extends RenditionBase<Node> { | ||||
| readonly widgetClass: _WidgetCtor; | ||||
| _instance: _Widget | undefined; | ||||
| constructor(widgetClass: _WidgetCtor) { | ||||
| super(); | ||||
| argumentNotNull(widgetClass, "widgetClass"); | ||||
| this.widgetClass = widgetClass; | ||||
| } | ||||
|
cin
|
r96 | _addChild(child: any, scope: IScope): void { | ||
|
cin
|
r65 | const instance = this._getInstance(); | ||
| if (instance.addChild) { | ||||
| if (child instanceof WidgetRendition) { | ||||
| // layout containers add custom logic to addChild methods | ||||
|
cin
|
r96 | instance.addChild(child.getWidgetInstance(scope)); | ||
|
cin
|
r65 | } else if (isWidget(child)) { | ||
| instance.addChild(child); | ||||
| } else { | ||||
|
cin
|
r96 | const childDom = getItemDom(child, scope); | ||
|
cin
|
r91 | const w = isElementNode(childDom) ? registry.byNode(childDom) : undefined; | ||
|
cin
|
r65 | |||
|
cin
|
r91 | if (w) { | ||
| instance.addChild(w); | ||||
| } else { | ||||
| if (!instance.containerNode) | ||||
| throw new Error("Failed to add DOM content. The widget doesn't have a containerNode"); | ||||
| // the current widget isn't started, it's children shouldn't start too | ||||
|
cin
|
r96 | placeAt(getItemDom(child,scope), instance.containerNode, "last"); | ||
|
cin
|
r91 | } | ||
|
cin
|
r65 | } | ||
| } else { | ||||
| if (!instance.containerNode) | ||||
| throw new Error("The widget doesn't have neither addChild nor containerNode"); | ||||
| // the current widget isn't started, it's children shouldn't start too | ||||
|
cin
|
r96 | placeAt(getItemDom(child, scope), instance.containerNode, "last"); | ||
|
cin
|
r65 | } | ||
| } | ||||
|
cin
|
r96 | protected _create(attrs: any, children: any[], scope: IScope) { | ||
|
cin
|
r65 | if (this.widgetClass.prototype instanceof ContentPane) { | ||
| // a special case for the ContentPane this is for | ||||
| // the compatibility with this heavy widget, all | ||||
| // regular containers could be easily manipulated | ||||
| // through `containerNode` property or `addChild` method. | ||||
| // render children to the DocumentFragment | ||||
| const content = document.createDocumentFragment(); | ||||
|
cin
|
r96 | children.forEach(child => content.appendChild(getItemDom(child, scope))); | ||
|
cin
|
r65 | |||
| // set the content property to the parameters of the widget | ||||
| const _attrs = { ...attrs, content }; | ||||
| this._instance = new this.widgetClass(_attrs); | ||||
| } else { | ||||
| this._instance = new this.widgetClass(attrs); | ||||
|
cin
|
r96 | children.forEach(x => this._addChild(x, scope)); | ||
|
cin
|
r65 | } | ||
| } | ||||
| private _getInstance() { | ||||
| if (!this._instance) | ||||
| throw new Error("The instance of the widget isn't created"); | ||||
| return this._instance; | ||||
| } | ||||
| protected _getDomNode() { | ||||
| if (!this._instance) | ||||
| throw new Error("The instance of the widget isn't created"); | ||||
| return this._instance.domNode; | ||||
| } | ||||
| /** Overrides default placeAt implementation. Calls placeAt of the | ||||
| * widget and then starts it. | ||||
| * | ||||
| * @param refNode A node or id of the node where the widget should be placed. | ||||
| * @param position A position relative to refNode. | ||||
| */ | ||||
| placeAt(refNode: string | Node, position?: DojoNodePosition) { | ||||
|
cin
|
r96 | this.ensureCreated(getScope()); | ||
|
cin
|
r65 | const instance = this._getInstance(); | ||
| if (typeof instance.placeAt === "function") { | ||||
| instance.placeAt(refNode, position); | ||||
| // fix the dojo startup behavior when the widget is placed | ||||
| // directly to the document and doesn't have any enclosing widgets | ||||
| const parentWidget = instance.domNode.parentNode ? | ||||
|
cin
|
r79 | registry.getEnclosingWidget(instance.domNode.parentNode) : null; | ||
|
cin
|
r65 | if (!parentWidget && isInPage(instance.domNode) && typeof instance.startup === "function") | ||
| instance.startup(); | ||||
| } else { | ||||
| // the widget doesn't have a placeAt method, strange but whatever | ||||
| super.placeAt(refNode, position); | ||||
| } | ||||
| } | ||||
|
cin
|
r96 | getWidgetInstance(scope?: IScope) { | ||
| this.ensureCreated(scope || getScope()); | ||||
|
cin
|
r65 | return this._getInstance(); | ||
| } | ||||
| } | ||||