implab/implabjs-djx Files · djx/src/main/ts/tsx/WidgetRendition.ts

Added test widgets to the playground

cin - - Load All Authors

File last commit:

r98:12074cb11473 v1.3


                r100:ff52224a63f0

v1.3

Download file

             WidgetRendition.ts
        
                    129 lines
            
             | 4.8 KiB
            
                | video/mp2t
            
             |
                TypeScriptLexer
            
             / djx / src / main / ts / tsx / WidgetRendition.ts
          
                    History
                
                 |
                  Source
                 | Raw
                 |Copy content
                 |Copy permalink

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
      import { argumentNotNull } from "@implab/core-amd/safe";

        cin
    
Added playground project

              r97
            
      import { RenditionBase } from "./RenditionBase";

        cin
    
refactoring, adding scope to rendering methods

              r96
            
      import { DojoNodePosition, isElementNode, isInPage, isWidget, placeAt } from "./traits";

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
      import registry = require("dijit/registry");

      import ContentPane = require("dijit/layout/ContentPane");

        cin
    
refactoring, adding scope to rendering methods

              r96
            
      import { IScope } from "./Scope";

        cin
    
file rename

              r98
            
      import { getItemDom, getScope } from "./render";

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
refactoring, adding scope to rendering methods

              r96
            
          _addChild(child: any, scope: IScope): void {

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
              const instance = this._getInstance();

              if (instance.addChild) {

                  if (child instanceof WidgetRendition) {

                      // layout containers add custom logic to addChild methods

        cin
    
refactoring, adding scope to rendering methods

              r96
            
                      instance.addChild(child.getWidgetInstance(scope));

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
                  } else if (isWidget(child)) {

                      instance.addChild(child);

                  } else {

        cin
    
refactoring, adding scope to rendering methods

              r96
            
                      const childDom = getItemDom(child, scope);

        cin
    
Corrected _addChild behavior for WidgetRendition when the content is FunctionRendition which returns a widget instance

              r91
            
                      const w = isElementNode(childDom) ? registry.byNode(childDom) : undefined;

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
        cin
    
Corrected _addChild behavior for WidgetRendition when the content is FunctionRendition which returns a widget instance

              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
    
refactoring, adding scope to rendering methods

              r96
            
                          placeAt(getItemDom(child,scope), instance.containerNode, "last");

        cin
    
Corrected _addChild behavior for WidgetRendition when the content is FunctionRendition which returns a widget instance

              r91
            
                      }

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
refactoring, adding scope to rendering methods

              r96
            
                  placeAt(getItemDom(child, scope), instance.containerNode, "last");

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
              }

          }

        cin
    
refactoring, adding scope to rendering methods

              r96
            
          protected _create(attrs: any, children: any[], scope: IScope) {

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
refactoring, adding scope to rendering methods

              r96
            
                  children.forEach(child => content.appendChild(getItemDom(child, scope)));

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
refactoring, adding scope to rendering methods

              r96
            
                  children.forEach(x => this._addChild(x, scope));

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
refactoring, adding scope to rendering methods

              r96
            
              this.ensureCreated(getScope());

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
fixed tslint errors, added support for private methods to @on() decorator

              r79
            
                      registry.getEnclosingWidget(instance.domNode.parentNode) : null;

        cin
    
Converted to subproject djx, removed dojo-typings

              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
    
refactoring, adding scope to rendering methods

              r96
            
          getWidgetInstance(scope?: IScope) {

              this.ensureCreated(scope || getScope());

        cin
    
Converted to subproject djx, removed dojo-typings

              r65
            
              return this._getInstance();

          }

      }

	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

cin Converted to subproject djx, removed dojo-typings	r65	import { argumentNotNull } from "@implab/core-amd/safe";
cin Added playground project	r97	import { RenditionBase } from "./RenditionBase";
cin refactoring, adding scope to rendering methods	r96	import { DojoNodePosition, isElementNode, isInPage, isWidget, placeAt } from "./traits";
cin Converted to subproject djx, removed dojo-typings	r65	import registry = require("dijit/registry");
		import ContentPane = require("dijit/layout/ContentPane");
cin refactoring, adding scope to rendering methods	r96	import { IScope } from "./Scope";
cin file rename	r98	import { getItemDom, getScope } from "./render";
cin Converted to subproject djx, removed dojo-typings	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 refactoring, adding scope to rendering methods	r96	_addChild(child: any, scope: IScope): void {
cin Converted to subproject djx, removed dojo-typings	r65	const instance = this._getInstance();

		if (instance.addChild) {
		if (child instanceof WidgetRendition) {
		// layout containers add custom logic to addChild methods
cin refactoring, adding scope to rendering methods	r96	instance.addChild(child.getWidgetInstance(scope));
cin Converted to subproject djx, removed dojo-typings	r65	} else if (isWidget(child)) {
		instance.addChild(child);
		} else {
cin refactoring, adding scope to rendering methods	r96	const childDom = getItemDom(child, scope);
cin Corrected _addChild behavior for WidgetRendition when the content is FunctionRendition which returns a widget instance	r91	const w = isElementNode(childDom) ? registry.byNode(childDom) : undefined;
cin Converted to subproject djx, removed dojo-typings	r65
cin Corrected _addChild behavior for WidgetRendition when the content is FunctionRendition which returns a widget instance	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 refactoring, adding scope to rendering methods	r96	placeAt(getItemDom(child,scope), instance.containerNode, "last");
cin Corrected _addChild behavior for WidgetRendition when the content is FunctionRendition which returns a widget instance	r91	}
cin Converted to subproject djx, removed dojo-typings	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 refactoring, adding scope to rendering methods	r96	placeAt(getItemDom(child, scope), instance.containerNode, "last");
cin Converted to subproject djx, removed dojo-typings	r65	}
		}

cin refactoring, adding scope to rendering methods	r96	protected _create(attrs: any, children: any[], scope: IScope) {
cin Converted to subproject djx, removed dojo-typings	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 refactoring, adding scope to rendering methods	r96	children.forEach(child => content.appendChild(getItemDom(child, scope)));
cin Converted to subproject djx, removed dojo-typings	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 refactoring, adding scope to rendering methods	r96	children.forEach(x => this._addChild(x, scope));
cin Converted to subproject djx, removed dojo-typings	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 refactoring, adding scope to rendering methods	r96	this.ensureCreated(getScope());
cin Converted to subproject djx, removed dojo-typings	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 fixed tslint errors, added support for private methods to @on() decorator	r79	registry.getEnclosingWidget(instance.domNode.parentNode) : null;
cin Converted to subproject djx, removed dojo-typings	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 refactoring, adding scope to rendering methods	r96	getWidgetInstance(scope?: IScope) {
		this.ensureCreated(scope \|\| getScope());
cin Converted to subproject djx, removed dojo-typings	r65	return this._getInstance();
		}

		}