implab/implabjs-djx Commit - r19:8f4d5e2c719a

Added DjxFragment...

cin -

r19:8f4d5e2c719a v1.0.0-rc8 default

parent child

Context file:

r19:8f4d5e2c719a

Collapse all files

src/main/ts/tsx/DjxFragment.ts created 644 +23 0

@@ -0,0 +1,23
	1	import { _Widget } from "./WidgetContext";
	2	import { MapOf } from "@implab/core-amd/interfaces";
	3
	4	/** Special widget used to create a document fragment */
	5	export class DjxFragment implements _Widget {
	6
	7	domNode: Node;
	8
	9	containerNode?: Node;
	10
	11	constructor() {
	12	this.domNode = this.containerNode = document.createDocumentFragment();
	13	}
	14
	15	get(attr: string) {
	16	return undefined;
	17	}
	18	set(attr: string, value: any): void;
	19	set(attrs: MapOf<any>): void;
	20	set() {
	21	/* do nothing */
	22	}
	23	} No newline at end of file

src/main/ts/dom-inject.ts +2 0

             import { id as mid } from "module";
             import { TraceSource } from "@implab/core-amd/log/TraceSource";
             import { MapOf } from "@implab/core-amd/interfaces";
             import { mixin } from "@implab/core-amd/safe";
             const trace = TraceSource.get(mid);
             function on<T extends keyof HTMLElementEventMap>(node: HTMLElement, eventName: T, handler: (this: HTMLElement, ev: HTMLElementEventMap[T]) => any): () => void {
                 // Add an event listener to a DOM node
                 node.addEventListener(eventName, handler, false);
                 return () => node.removeEventListener(eventName, handler, false);
             }
             interface NodeLoadResult {
                 node: HTMLElement;
             }
             class DomInject {
                 injectionPoint = document.head;
                 injectBefore = document.head.firstChild;
                 _map: MapOf<Promise<NodeLoadResult>> = {};
                 _inject<T extends keyof HTMLElementTagNameMap>(name: T, attr: Partial<HTMLElementTagNameMap[T]>) {
                     const node = document.createElement(name);
                     return new Promise<NodeLoadResult>((ok, fail) => {
                         const cleanup = () => {
                             noerr();
                             noload();
                         };
                         const noload = on(node, "load", () => {
                             ok({ node });
                             cleanup();
                         });
                         const noerr = on(node, "error", e => {
                             fail({
                                 erorr: e,
                                 node
                             });
                             cleanup();
                         });
                         mixin(node, attr);
                         this.injectionPoint.insertBefore(node, this.injectBefore);
                     });
                 }
                 async injectScript(url: string) {
                     let d = this._map[url];
                     if (!d) {
                         trace.log("js {0}", url);
                         d = this._inject("script", {
                             type: "text/javascript",
                             charset: "utf-8",
                             src: url
                         });
                         this._map[url] = d;
                     }
                     try {
                         await d;
                         trace.log("done {0}", url);
                     } catch (e) {
                         trace.error("failed {0}: {1}", url, e);
+                        throw e;
                     }
                 }
                 async injectStylesheet(url: string) {
                     let d = this._map[url];
                     if (!d) {
                         trace.log("js {0}", url);
                         d = this._inject("link", {
                             type: "text/css",
                             rel: "stylesheet",
                             href: url
                         });
                         this._map[url] = d;
                     }
                     try {
                         await d;
                         trace.log("done {0}", url);
                     } catch (e) {
                         trace.error("failed {0}: {1}", url, e);
+                        throw e;
                     }
                 }
             };
             const instance = new DomInject();
             export = instance;

src/main/ts/tsx/BuildContextBase.ts +10 -5

-            import { isNull, mixin, argumentNotNull } from "@implab/core-amd/safe";
+            import { isNull, mixin } from "@implab/core-amd/safe";
             import { isPlainObject, isNode, isBuildContext, DojoNodePosition, BuildContext } from "./traits";
             import dom = require("dojo/dom-construct");
             export abstract class BuildContextBase implements BuildContext {
                 _attrs = {};
                 _children = new Array();
                 _created: boolean = false;
                 visitNext(v: any) {
                     if (isNull(v))
                         return;
                     if (isPlainObject(v)) {
                         if (this._created)
                             this._setAttrs(v);
                         else
                             mixin(this._attrs, v);
                     } else if (v instanceof Array) {
                         v.forEach(x => this._addChild(x));
                     } else {
                         if (this._created)
                             this._addChild(v);
                         else
                             this._children.push(v);
                     }
                 }
                 getChildDom(v: any) {
                     const tv = typeof v;
                     if (tv === "string" || tv === "number" || tv === "boolean" || v instanceof RegExp || v instanceof Date) {
                         return document.createTextNode(v.toString());
                     } else if (isNode(v)) {
                         return v;
                     } else if (isBuildContext(v)) {
-                        return v.getDomElement();
+                        return v.getDomNode();
                     } else {
                         throw new Error("Invalid parameter");
                     }
                 }
-                abstract _getDomElement(): HTMLElement;
+                abstract _getDomNode(): Node;
                 ensureCreated() {
                     if (!this._created) {
                         this._create(this._attrs, this._children);
                         this._children = [];
                         this._attrs = {};
                         this._created = true;
                     }
                 }
+                /** @deprecated use getDomNode() */
                 getDomElement() {
+                    return this.getDomNode();
+                }
+                getDomNode() {
                     this.ensureCreated();
-                    return this._getDomElement();
+                    return this._getDomNode();
                 }
                 placeAt(refNode: string | Node, position?: DojoNodePosition) {
-                    dom.place(this.getDomElement(), refNode, position);
+                    dom.place(this.getDomNode(), refNode, position);
                 }
                 abstract _addChild(child: any): void;
                 abstract _setAttrs(attrs: object): void;
                 abstract _create(attrs: object, children: any[]): void;
             }

src/main/ts/tsx/DjxWidgetBase.ts +1 -1

             import { djbase, djclass } from "../declare";
             import _WidgetBase = require("dijit/_WidgetBase");
             import _AttachMixin = require("dijit/_AttachMixin");
             import { BuildContext, isNode } from "./traits";
             import registry = require("dijit/registry");
             import { Handle } from "dojo/interfaces";
             // type Handle = dojo.Handle;
             @djclass
             export abstract class DjxWidgetBase extends djbase(_WidgetBase, _AttachMixin) {
                 buildRendering() {
-                    this.domNode = this.render().getDomElement();
+                    this.domNode = this.render().getDomNode();
                     super.buildRendering();
                 }
                 abstract render(): BuildContext;
                 _processTemplateNode<T extends (Element | Node | _WidgetBase)>(
                     baseNode: T,
                     getAttrFunc: (baseNode: T, attr: string) => string,
                     // tslint:disable-next-line: ban-types
                     attachFunc: (node: T, type: string, func?: Function) => Handle
                 ): boolean {
                     if (isNode(baseNode)) {
                         const w = registry.byNode(baseNode);
                         if (w) {
                             // from dijit/_WidgetsInTemplateMixin
                             this._processTemplateNode(w,
                                 (n, p) => n.get(p), // callback to get a property of a widget
                                 (widget, type, callback) => {
                                     if (!callback)
                                         throw new Error("The callback must be specified");
                                     // callback to do data-dojo-attach-event to a widget
                                     if (type in widget) {
                                         // back-compat, remove for 2.0
                                         return widget.connect(widget, type, callback as EventListener);
                                     } else {
                                         // 1.x may never hit this branch, but it's the default for 2.0
                                         return widget.on(type, callback);
                                     }
                                 });
                             // don't process widgets internals
                             return false;
                         }
                     }
                     return super._processTemplateNode(baseNode, getAttrFunc, attachFunc);
                 }
             }

src/main/ts/tsx/HtmlElementContext.ts +1 -1

             import dom = require("dojo/dom-construct");
             import attr = require("dojo/dom-attr");
             import { argumentNotEmptyString } from "@implab/core-amd/safe";
             import { BuildContextBase } from "./BuildContextBase";
             export class HtmlElementContext extends BuildContextBase {
                 elementType: string;
                 _element: HTMLElement | undefined;
                 constructor(elementType: string) {
                     argumentNotEmptyString(elementType, "elementType");
                     super();
                     this.elementType = elementType;
                 }
                 _addChild(child: any): void {
                     if (!this._element)
                         throw new Error("The HTML element isn't created");
                     dom.place(this.getChildDom(child), this._element);
                 }
                 _setAttrs(attrs: object): void {
                     if (!this._element)
                         throw new Error("The HTML element isn't created");
                     attr.set(this._element, attrs);
                 }
                 _create(attrs: object, children: any[]) {
                     this._element = dom.create(this.elementType, attrs);
                     if (children)
                         children.forEach(v => this._addChild(v));
                 }
-                _getDomElement() {
+                _getDomNode() {
                     if (!this._element)
                         throw new Error("The HTML element isn't created");
                     return this._element;
                 }
             }

src/main/ts/tsx/WidgetContext.ts +18 -6

             import dom = require("dojo/dom-construct");
             import { argumentNotNull } from "@implab/core-amd/safe";
-            import _WidgetBase = require("dijit/_WidgetBase");
             import { BuildContextBase } from "./BuildContextBase";
+            import { MapOf } from "@implab/core-amd/interfaces";
-            type _WidgetBaseConstructor = typeof _WidgetBase;
+            // tslint:disable-next-line: class-name
+            export interface _Widget {
+                domNode: Node;
+                get(attr: string): any;
+                set(attr: string, value: any): void;
+                set(attrs: MapOf<any>): void;
+                containerNode?: Node
+            }
+            export type _WidgetCtor = new (attrs: any, srcNode?: string | Node) => _Widget;
             export class WidgetContext extends BuildContextBase {
-                widgetClass: _WidgetBaseConstructor;
+                widgetClass: _WidgetCtor;
-                _instance: _WidgetBase | undefined;
+                _instance: _Widget | undefined;
-                constructor(widgetClass: _WidgetBaseConstructor) {
+                constructor(widgetClass: _WidgetCtor) {
                     super();
                     argumentNotNull(widgetClass, "widgetClass");
                     this.widgetClass = widgetClass;
                 }
                 _addChild(child: any): void {
                     if (!this._instance || !this._instance.containerNode)
                         throw new Error("Widget doesn't support adding children");
                     dom.place(this.getChildDom(child), this._instance.containerNode);
                 }
                 _setAttrs(attrs: object): void {
                     this._instance?.set(attrs);
                 }
                 _create(attrs: object, children: any[]) {
                     this._instance = new this.widgetClass(this._attrs);
                     if (children)
                         children.forEach(x => this._addChild(x));
                 }
-                _getDomElement() {
+                _getDomNode() {
                     if (!this._instance)
                         throw new Error("The instance of the widget isn't created");
                     return this._instance.domNode;
                 }
             }

src/main/ts/tsx/traits.ts +30 -2

             import _WidgetBase = require("dijit/_WidgetBase");
             type _WidgetBaseConstructor = typeof _WidgetBase;
             export type DojoNodePosition = "first" | "after" | "before" | "last" | "replace" | "only" | number;
             export interface BuildContext {
-                getDomElement(): HTMLElement;
+                getDomNode(): Node;
                 placeAt(refNode: string | Node, position?: DojoNodePosition): void;
             }
-            export function isNode(el: any): el is HTMLElement {
+            export function isNode(el: any): el is Node {
                 return el && el.nodeName && el.nodeType;
             }
+            export function isElementNode(el: any): el is Element {
+                return isNode(el) && el.nodeType === 1;
+            }
+            export function isTextNode(el: any): el is Text {
+                return isNode(el) && el.nodeType === 3;
+            }
+            export function isProcessingInstructionNode(el: any): el is ProcessingInstruction {
+                return isNode(el) && el.nodeType === 7;
+            }
+            export function isCommentNode(el: any): el is Comment {
+                return isNode(el) && el.nodeType === 8;
+            }
+            export function isDocumentNode(el: any): el is Document {
+                return isNode(el) && el.nodeType === 9;
+            }
+            export function isDocumentTypeNode(el: any): el is DocumentType {
+                return isNode(el) && el.nodeType === 10;
+            }
+            export function isDocumentFragmentNode(el: any): el is DocumentFragment {
+                return isNode(el) && el.nodeType === 11;
+            }
             export function isWidget(v: any): v is _WidgetBase {
                 return v && "domNode" in v;
             }
             export function isBuildContext(v: any): v is BuildContext {
                 return typeof v === "object" && typeof v.getDomElement === "function";
             }
             export function isPlainObject(v: object) {
                 if (typeof v !== "object")
                     return false;
                 const vp = Object.getPrototypeOf(v);
                 return !vp || vp === Object.prototype;
             }
             export function isWidgetConstructor(v: any): v is _WidgetBaseConstructor {
                 return typeof v === "function" && v.prototype && "domNode" in v.prototype;
             }

General Comments 0

Write
Preview

You need to be logged in to leave comments. Login now

No TODOs yet

	Site-wide shortcuts
/	Use quick search box
g h	Goto home page
g g	Goto my private gists page
g G	Goto my public gists page
g 0-9	Goto bookmarked items from 0-9
n r	New repository page
n g	New gist page

	Repositories
g s	Goto summary page
g c	Goto changelog page
g f	Goto files page
g F	Goto files page with file search activated
g p	Goto pull requests page
g o	Goto repository settings
g O	Goto repository access permissions settings
t s	Toggle sidebar on some pages