implab/implabjs-djx Commit - r79:e5bb5e80ce96

fixed tslint errors, added support for private methods to @on() decorator

cin -

r79:e5bb5e80ce96 v1.2.3 default

parent child

Context file:

r79:e5bb5e80ce96

Collapse all files

djx/.eslintrc.json created 644 +25 0

@@ -0,0 +1,25
	1	{
	2	"env": {
	3	"browser": true,
	4	"amd": true
	5	},
	6	"parserOptions": {
	7	"ecmaFeatures": {
	8	"jsx": true
	9	},
	10	"sourceType": "script"
	11	},
	12	"extends": "eslint:recommended",
	13	"rules": {
	14	"no-const-assign": "warn",
	15	"no-this-before-super": "warn",
	16	"no-undef": "error",
	17	"no-unreachable": "warn",
	18	"no-unused-vars": "warn",
	19	"constructor-super": "warn",
	20	"valid-typeof": "warn",
	21	"semi" : "warn",
	22	"no-invalid-this" : "error",
	23	"no-console": "off"
	24	}
	25	} No newline at end of file

djx/tslint.json created 644 +48 0

@@ -0,0 +1,48
	1	{
	2	"extends": "tslint:recommended",
	3	"defaultSeverity": "warn",
	4	"rules": {
	5	"align": [
	6	true,
	7	"parameters",
	8	"statements"
	9	],
	10	"interface-name": [
	11	false
	12	],
	13	"max-line-length": [
	14	true,
	15	185
	16	],
	17	"quotemark": [true, "double", "avoid-escape"],
	18	"member-access": false,
	19	"semicolon": [true, "always", "ignore-bound-class-methods"],
	20	"no-bitwise": false,
	21	"no-empty": false,
	22	"no-namespace": false,
	23	"ordered-imports": false,
	24	"no-return-await": true,
	25	"no-floating-promises": true,
	26	"one-line": [
	27	true,
	28	"check-open-brace",
	29	"check-catch",
	30	"check-whitespace"
	31	],
	32	"object-literal-sort-keys": false,
	33	"trailing-comma": [
	34	true,
	35	{
	36	"singleline": "never",
	37	"multiline": "never"
	38	}
	39	],
	40	"variable-name": false,
	41	"curly": false,
	42	"array-type": false,
	43	"arrow-parens": [
	44	true,
	45	"ban-single-arg-parens"
	46	]
	47	}
	48	} No newline at end of file

djx/build.gradle +1 0

             plugins {
                 id "org.implab.gradle-typescript" version "1.3.3"
                 id "ivy-publish"
             }
             typescript {
                 compilerOptions {
                     lib = ["es5", "dom", "scripthost", "es2015.promise", "es2015.symbol", "es2015.iterable"]
                     //listFiles = true
                     declaration = true
                     strict = true
                     types = []
                     module = "amd"
                     it.target = "es5"
                     experimentalDecorators = true
+                    noUnusedLocals = true
                     jsx = "react"
                     jsxFactory = "createElement"
                     moduleResolution = "node"
                     // dojo-typings are sick
                     skipLibCheck = true
                     // traceResolution = true
                     // baseUrl = "./"
                     // paths = [ "*": [ "$projectDir/src/typings/*" ] ]
                     // baseUrl = "$projectDir/src/typings"
                     // typeRoots = ["$projectDir/src/typings"]
                 }
                 tscCmd = "$projectDir/node_modules/.bin/tsc"
                 tsLintCmd = "$projectDir/node_modules/.bin/tslint"
             	esLintCmd = "$projectDir/node_modules/.bin/eslint"
             }
             configureTsMain {
                 sourceFiles {
                     from sources.main.typings
                 }
                 compilerOptions {
                     // baseUrl = "$projectDir/src"
                     /*paths = [
                         "dojo/*" : [ "typings/dojo/*" ],
                         "dijit/*" : [ "typings/dijit/*" ]
                     ]*/
                     types = ["requirejs", "@implab/dojo-typings"]
                 }
             }
             configureTsTest {
                 compilerOptions {
                     typeRoots = []
                     types = ["requirejs", sources.main.output.typingsDir.get().toString() ]
                 }
             }
             npmPackMeta {
                 meta {
                     name = "@$npmScope/$project.name"
                 }
             }
             task npmPackTypings(type: Copy) {
                 dependsOn typings
                 npmPackContents.dependsOn it
                 from typescript.typingsDir
                 into npm.packageDir
             }
             task printVersion {
                 doLast {
                     println "packageName: ${npmPackMeta.metadata.get().name}";
                     println "version: $version";
                     println "target: $typescript.compilerOptions.target";
                     println "module: $typescript.compilerOptions.module";
                     println "symbols: $symbols";
                 }
             }

djx/src/main/ts/NlsBundle.ts 0 -8

             import { MapOf, PromiseOrValue } from "@implab/core-amd/interfaces";
             import { argumentNotEmptyString, isPromise, mixin } from "@implab/core-amd/safe";
-            import { id as mid } from "module";
-            import { TraceSource } from "@implab/core-amd/log/TraceSource";
-            const trace = TraceSource.get(mid);
             export type LocaleProvider<T> = () => PromiseOrValue<T | { default: T }>;
             type ResolveCallback<T> = () => PromiseOrValue<T>;
             function when<T, T2>(value: PromiseOrValue<T>, cb: (v: T) => PromiseOrValue<T2>): PromiseOrValue<T2> {
                 return isPromise(value) ?
                     value.then(cb) :
                     cb(value);
             }
             function isCallback<T>(v: ResolveCallback<T> | PromiseOrValue<T>): v is ResolveCallback<T> {
                 return typeof v === "function";
             }
-            function defaultResolver(module: string) {
-                return import(module).then(x => x && x.default ? x.default : x);
             function chainObjects<T extends object>(o1: T, o2: T) {
                 if (!o1)
                     return o2;
                 if (!o2)
                     return o1;
                 return mixin(Object.create(o1) as T, o2);
             }
             export class NlsBundle<T extends object> {
                 private _locales: MapOf<LocaleProvider<Partial<T>>>;
                 private _default: T;
                 private _cache: MapOf<PromiseOrValue<T>>;
                 constructor(defNls: T, locales?: MapOf<LocaleProvider<Partial<T>>>) {
                     this._default = defNls;
                     this._locales = locales || {};
                     this._cache = {};
                 }
                 getLocale(locale: string) {
                     argumentNotEmptyString(locale, "locale");
                     const _loc = locale;
                     // en-US => ["en", "en-US"]
                     const locales = _loc.split(/-|_/).map((x, i, a) => a.slice(0, i + 1).join("-"));
                     return this._resolveLocale(locales);
                 }
                 _resolveLocale(locales: string[]): PromiseOrValue<T> {
                     if (!locales.length)
                         return this._default;
                     const locale = locales.pop();
                     if (!locale)
                         throw new Error("The locale can't be empty");
                     if (this._cache[locale])
                         return this._cache[locale];
                     const data = this._loadPackage(this._locales[locale]);
                     const parent = this._resolveLocale(locales);
                     return this._cache[locale] = when(data, x => {
                         return when(parent, y => this._cache[locale] = chainObjects(y, x));
                     });
                 }
                 _loadPackage(localeData: any) {
                     if (isCallback(localeData))
                         return when(localeData(), data => data && "default" in data ? data.default : data);
                     return localeData;
                 }
             }

djx/src/main/ts/declare.ts +1 -4

             import declare = require("dojo/_base/declare");
             import { each } from "@implab/core-amd/safe";
             import { Constructor } from "@implab/core-amd/interfaces";
-            import dojo = require("dojo/_base/kernel");
             // declare const declare: any;
             type DeclareConstructor<T> = dojo._base.DeclareConstructor<T>;
             export interface AbstractConstructor<T = {}> {
                 prototype: T;
             }
             interface DjMockConstructor<T = {}> {
                 new(...args: any[]): T;
                 mock: boolean;
                 bases: AbstractConstructor[];
             }
             export function djbase<T>(
                 b0?: AbstractConstructor<T>
             ): DeclareConstructor<T>;
             export function djbase<T0, T1>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>
             ): DeclareConstructor<T0 & T1>;
             export function djbase<T0, T1, T2>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>,
                 b2: AbstractConstructor<T2>
             ): DeclareConstructor<T0 & T1 & T2>;
             export function djbase<T0, T1, T2, T3>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>,
                 b2: AbstractConstructor<T2>,
                 b3: AbstractConstructor<T3>
             ): DeclareConstructor<T0 & T1 & T2 & T3>;
             export function djbase<T0, T1, T2, T3, T4>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>,
                 b2: AbstractConstructor<T2>,
                 b3: AbstractConstructor<T3>,
                 b4: AbstractConstructor<T4>
             ): DeclareConstructor<T0 & T1 & T2 & T3 & T4>;
             export function djbase<T0, T1, T2, T3, T4, T5>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>,
                 b2: AbstractConstructor<T2>,
                 b3: AbstractConstructor<T3>,
                 b4: AbstractConstructor<T4>,
                 b5: AbstractConstructor<T5>
             ): DeclareConstructor<T0 & T1 & T2 & T3 & T4 & T5>;
             export function djbase<T0, T1, T2, T3, T4, T5, T6>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>,
                 b2: AbstractConstructor<T2>,
                 b3: AbstractConstructor<T3>,
                 b4: AbstractConstructor<T4>,
                 b5: AbstractConstructor<T5>,
                 b6: AbstractConstructor<T6>
             ): DeclareConstructor<T0 & T1 & T2 & T3 & T4 & T5 & T6>;
             export function djbase<T0, T1, T2, T3, T4, T5, T6, T7>(
                 b0: AbstractConstructor<T0>,
                 b1: AbstractConstructor<T1>,
                 b2: AbstractConstructor<T2>,
                 b3: AbstractConstructor<T3>,
                 b4: AbstractConstructor<T4>,
                 b5: AbstractConstructor<T5>,
                 b6: AbstractConstructor<T6>,
                 b7: AbstractConstructor<T7>
             ): DeclareConstructor<T0 & T1 & T2 & T3 & T4 & T5 & T6 & T7>;
             /** Создает конструктор-заглушку из списка базовых классов, используется
              * для объявления классов при помощи `dojo/_base/declare`.
              *
              * Создает пустой конструктор, с пустым стандартным прототипом, это нужно,
              * поскольку в унаследованном классе конструктор обязательно должен вызвать
              * `super(...)`, таким образом он вызовет пустую функцию.
              *
              * Созданный конструктор хранит в себе список базовых классов, который будет
              * использован декоратором `djclass`, который вернет класс, объявленный при
              * помощи `dojo/_base/declare`.
              *
              * @param bases список базовых классов, от которых требуется унаследовать
              *  новый класс.
              *
              */
             export function djbase(...bases: any[]): Constructor {
                 const t = class {
                     static mock: boolean;
                     static bases: AbstractConstructor[];
                 };
                 t.mock = true;
                 t.bases = bases;
                 return t as any;
             }
             function isMockConstructor<T extends {}>(v: AbstractConstructor<T>): v is DjMockConstructor<T> {
                 return v && "mock" in v;
             }
             /** Создает класс при помощи `dojo/_base/declare`. Для этого исходный класс
              * должен быть унаследован от `djbase(...)`.
              *
              * @param target Класс, который нужно объявить при помощи `dojo/_base/declare`
              */
             export function djclass<T extends AbstractConstructor>(target: T): T {
                 // получаем базовый конструктор и его прототип
                 let bp = target && target.prototype && Object.getPrototypeOf(target.prototype);
                 const bc = bp && bp.constructor;
                 // проверка того, что класс унаследован от специальной заглушки
                 if (isMockConstructor(bc)) {
-                    // t - базовый класс, объявленный при помощи dojo/_base/declare
+                    // bc.bases - базовый класс, объявленный при помощи dojo/_base/declare
-                    const t = bc.bases;
                     const cls = declare<any>(bc.bases, target.prototype);
                     // bc - базовый класс, bc.prototype используется как super
                     // при вызове базовых методов. Нужно создать bc.prototype
                     // таким образом, чтобы он вызывал this.inherited().
                     // создаем новый порототип, он не в цепочке прототипов у текущего
                     // класса, но super.some_method будет использовать именно его.
                     // в этом объекте будут размещены прокси для переопределенных
                     // методов.
                     bp = bc.prototype = Object.create(cls.prototype);
                     bp.constructor = bc;
                     // proxy - фабрика для создания прокси-методов, которые внутри
                     // себя вызовут this.inherited с правильными параметрами.
                     const proxy = (m: (...args: any[]) => any) => function (this: any) {
                         const f = this.getInherited({ callee: m });
                         return f && f.apply(this, arguments);
                         // так сделать можно только dojo 1.15+
                         // return this.inherited(m, arguments);
                     };
                     // у текущего класса прототип содержит методы, объявленные в этом
                     // классе и его конструктор. Нужно пройти по всем методам и
                     // создать для них прокси.
                     // При этом только те, методы, которые есть в базовых классах
                     // могут быть переопределены.
                     each(target.prototype, (m: any, p: string | number | symbol) => {
                         if (typeof m === "function" &&
                             p !== "constructor" &&
                             target.prototype.hasOwnProperty(p)
                         ) {
                             bp[p] = proxy(m);
                         }
                     });
                     // TODO mixin static members
                     return cls as any;
                 } else {
                     return target as any;
                 }
             }
             function makeSetterName(prop: string) {
                 return [
                     "_set",
                     prop.replace(/^./, x => x.toUpperCase()),
                     "Attr"
                 ].join("");
             }
             function makeGetterName(prop: string) {
                 return [
                     "_get",
                     prop.replace(/^./, x => x.toUpperCase()),
                     "Attr"
                 ].join("");
             }
             interface NodeBindSpec {
                 node: string;
                 type: "attribute" | "innerText" | "textContent" | "innerHTML" | "class" | "toggleClass";
                 attribute?: string;
                 className?: string;
             }
             /**
              *  Описание привязки свойства виджета к свойству внутреннего объекта.
              */
             interface MemberBindSpec {
                 /**
                  * Имя свойства со ссылкой на объект, к которому .
                  */
                 member: string;
                 /**
                  * Свойство объекта к которому нужно осуществить привязку.
                  */
                 property: string;
                 /**
                  * Привязка осуществляется не только на запись но и на чтение свойства.
                  */
                 getter?: boolean;
             }
             function isNodeBindSpec(v: any): v is NodeBindSpec {
                 return "node" in v;
             }
             /** Декорирует свойства виджета для привязки их к внутренним членам, либо DOM
              * элементам, либо свойству внутреннего объекта.
              *
              * @param {NodeBindSpec | MemberBindSpec} params Параметры связывания.
              */
             export function bind(params: NodeBindSpec | MemberBindSpec) {
                 if (isNodeBindSpec(params)) {
                     return (target: any, name: string) => {
                         target[makeSetterName(name)] = params;
                     };
                 } else {
                     return (target: any, name: string) => {
                         target[name] = null;
                         target[makeSetterName(name)] = function (v: any) {
                             this._set(name, v);
                             this[params.member].set(params.property, v);
                         };
                         if (params.getter)
                             target[makeGetterName(name)] = function () {
                                 return this[params.member].get(params.property);
                             };
                     };
                 }
             }
             /** Создает в прототипе указанное свойство со значение `undefined`, данный
              * декоратор следует использовать для свойств, у которых нет значения по-умолчанию
              * и они не могут быть `null | undefined`
              */
             export function prototype(): (p: any, name: string) => void;
             /** Создает в прототипе свойство с указанным значением.
              * @param value Значение, которое будет указано в прототипе
              */
             export function prototype<T>(value: T): <P extends { [m in K]: T }, K extends keyof P>(p: P, name: K) => void;
             export function prototype<T>(value?: T) {
                 return <P extends { [m in K]: T }, K extends keyof P>(p: P, name: K) => {
                     p[name] = value as any;
                 };
             }

djx/src/main/ts/dom-inject.ts +1 -1

             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?: HTMLElement;
                 injectAfter?: HTMLElement;
                 _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({
                                 error: e,
                                 node
                             });
                             cleanup();
                         });
                         mixin(node, attr);
                         const _injectionPoint = this.injectionPoint || document.head;
                         const _injectBefore = this.injectAfter ? this.injectAfter.nextSibling : null;
                         _injectionPoint.insertBefore(node, _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 default instance;

djx/src/main/ts/tsx/BuildContextBase.ts +4 -4

             import { RenditionBase } from "./RenditionBase";
             /**
              * @deprecated use RenditionBase instead
              */
-             export type BuildContextBase<TNode extends Node> = RenditionBase<TNode>;
+            export type BuildContextBase<TNode extends Node> = RenditionBase<TNode>;
              /**
-             * @deprecated use RenditionBase instead
+              * @deprecated use RenditionBase instead
-             */
+              */
-             export const BuildContextBase = RenditionBase;
+            export const BuildContextBase = RenditionBase;

djx/src/main/ts/tsx/DjxFragment.ts +1 -1

             /** Special functional component used to create a document fragment */
-            export function DjxFragment({children}: {children?: Node | Node[]}){
+            export function DjxFragment({ children }: { children?: Node | Node[] }) {
                 const fragment = document.createDocumentFragment();
                 if (children)
                     (children instanceof Array ? children : [children]).forEach(child => fragment.appendChild(child));
                 return fragment;
             }

djx/src/main/ts/tsx/DjxWidgetBase.ts +3 -3

-            import { AbstractConstructor, djbase, djclass } from "../declare";
+            import { djbase, djclass } from "../declare";
             import _WidgetBase = require("dijit/_WidgetBase");
             import _AttachMixin = require("dijit/_AttachMixin");
-            import { Rendition, isNode, startupWidgets } from "./traits";
+            import { Rendition, isNode } from "./traits";
             import registry = require("dijit/registry");
             // type Handle = dojo.Handle;
             export interface EventArgs {
                 bubbles?: boolean;
                 cancelable?: boolean;
                 composed?: boolean;
             }
             export interface DjxWidgetBase<Attrs = {}, Events extends { [name in keyof Events]: Event } = {}> extends
                 _WidgetBase<Events> {
                 /** This property is declared only for type inference to work, it is never assigned
                  * and should not be used.
                  */
                 readonly _eventMap: Events & GlobalEventHandlersEventMap;
             }
             type _super = {
                 startup(): void;
+            };
             @djclass
             export abstract class DjxWidgetBase<Attrs = {}, Events = {}> extends djbase<_super, _AttachMixin>(_WidgetBase, _AttachMixin) {
                 /** The list of pairs of event and method names. When the widget is created all methods from
                  * this list will be connected to corresponding events.
                  */
                 _eventHandlers: Array<{
                     eventName: string,
                     handlerMethod: keyof any;
                 }> = [];
                 buildRendering() {
                     this.domNode = this.render().getDomNode();
                     super.buildRendering();
                     // now we should get assigned data-dojo-attach-points
                     // place the contents of the original srcNode to the containerNode
                     const src = this.srcNodeRef;
                     const dest = this.containerNode;
                     // the donNode is constructed now we need to connect event handlers
                     this._connectEventHandlers();
                     if (src && dest) {
                         while (src.firstChild)
                             dest.appendChild(src.firstChild);
                     }
                 }
                 abstract render(): Rendition<HTMLElement>;
                 private _connectEventHandlers() {
                     this._eventHandlers.forEach(({eventName, handlerMethod}) => {
                         const handler = this[handlerMethod as keyof this];
                         if (typeof handler === "function")
                             this.on(eventName, handler.bind(this));
                     });
                 }
                 _processTemplateNode<T extends (Element | Node | _WidgetBase)>(
                     baseNode: T,
                     getAttrFunc: (baseNode: T, attr: string) => any,
                     // tslint:disable-next-line: ban-types
                     attachFunc: (node: T, type: string, func?: Function) => dojo.Handle
                 ): boolean {
                     if (isNode(baseNode)) {
                         const w = registry.byNode(baseNode);
                         if (w) {
                             // from dijit/_WidgetsInTemplateMixin
                             this._processTemplateNode(w,
                                 (n, p) => n.get(p as any), // 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);
                 }
                 /** Starts current widget and all its supporting widgets (placed outside
                  * `containerNode`) and child widgets (placed inside `containerNode`)
                  */
                 startup() {
                     // startup supporting widgets
                     registry.findWidgets(this.domNode, this.containerNode).forEach(w => w.startup());
                     super.startup();
                 }
             }

djx/src/main/ts/tsx/RenditionBase.ts +3 -3

             import { isNull, mixin } from "@implab/core-amd/safe";
             import { isPlainObject, isNode, isRendition, DojoNodePosition, Rendition, isInPage, isWidget, isDocumentFragmentNode, startupWidgets } from "./traits";
             import dom = require("dojo/dom-construct");
             import registry = require("dijit/registry");
             export abstract class RenditionBase<TNode extends Node> implements Rendition<TNode> {
                 private _attrs = {};
                 private _children = new Array();
                 private _created: boolean = false;
                 visitNext(v: any) {
                     if (this._created)
                         throw new Error("The Element is already created");
                     if (isNull(v) || typeof v === "boolean")
                         // skip null, undefined, booleans ( this will work:  {value && <span>{value}</span>} )
                         return;
                     if (isPlainObject(v)) {
                         mixin(this._attrs, v);
                     } else if (v instanceof Array) {
                         v.forEach(x => this.visitNext(x));
                     } else {
                         this._children.push(v);
                     }
                 }
                 protected getItemDom(v: any) {
                     const tv = typeof v;
                     if (tv === "string" || tv === "number" || v instanceof RegExp || v instanceof Date) {
                         // primitive types converted to the text nodes
                         return document.createTextNode(v.toString());
                     } else if (isNode(v)) {
                         // nodes are kept as is
                         return v;
                     } else if (isRendition(v)) {
                         // renditions as instantinated
                         return v.getDomNode();
                     } else if (isWidget(v)) {
                         // widgets are converted to it's markup
                         return v.domNode;
                     } else if (tv === "boolean" || v === null || v === undefined) {
                         // null | undefined | boolean are removed, converted to comments
                         return document.createComment(`[${tv} ${String(v)}]`);
                     } else {
                         // bug: explicit error otherwise
                         throw new Error("Invalid parameter: " + v);
                     }
                 }
                 ensureCreated() {
                     if (!this._created) {
                         this._create(this._attrs, this._children);
                         this._children = [];
                         this._attrs = {};
                         this._created = true;
                     }
                 }
                 /** @deprecated will be removed in 1.0.0, use getDomNode() */
                 getDomElement() {
                     return this.getDomNode();
                 }
                 /** Creates DOM node if not created. No additional actions are taken. */
                 getDomNode() {
                     this.ensureCreated();
                     return this._getDomNode();
                 }
                 /** Creates DOM node if not created, places it to the specified position
                  * and calls startup() method for all widgets contained by this node.
                  *
                  * @param {string | Node} refNode The reference node where the created
                  *   DOM should be placed.
                  * @param {DojoNodePosition} position Optional parameter, specifies the
                  *   position relative to refNode. Default is "last" (i.e. last child).
                  */
                 placeAt(refNode: string | Node, position?: DojoNodePosition) {
                     const domNode = this.getDomNode();
                     const collect = (collection: HTMLCollection) => {
                         const items = [];
                         for (let i = 0, n = collection.length; i < n; i++) {
                             items.push(collection[i]);
                         }
                         return items;
+                    };
                     const startup = (node: Node) => {
                         if (node.parentNode) {
                             const parentWidget = registry.getEnclosingWidget(node.parentNode);
                             if (parentWidget && parentWidget._started)
                                 return startupWidgets(node);
                         }
                         if (isInPage(node))
                             startupWidgets(node);
+                    };
-                    const startupPending = isDocumentFragmentNode(domNode) ? collect(domNode.children) : [domNode]
+                    const startupPending = isDocumentFragmentNode(domNode) ? collect(domNode.children) : [domNode];
                     dom.place(domNode, refNode, position);
                     startupPending.forEach(startup);
                 }
                 protected abstract _create(attrs: object, children: any[]): void;
                 protected abstract _getDomNode(): TNode;
             }

djx/src/main/ts/tsx/WidgetRendition.ts +1 -1

             import dom = require("dojo/dom-construct");
             import { argumentNotNull } from "@implab/core-amd/safe";
             import { RenditionBase } from "./RenditionBase";
             import { DojoNodePosition, isInPage, isWidget } from "./traits";
             import registry = require("dijit/registry");
             import ContentPane = require("dijit/layout/ContentPane");
             // 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;
                 }
                 _addChild(child: any): void {
                     const instance = this._getInstance();
                     if (instance.addChild) {
                         if (child instanceof WidgetRendition) {
                             // layout containers add custom logic to addChild methods
                             instance.addChild(child.getWidgetInstance());
                         } else if (isWidget(child)) {
                             instance.addChild(child);
                         } 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
                             dom.place(this.getItemDom(child), instance.containerNode);
                         }
                     } 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
                         dom.place(this.getItemDom(child), instance.containerNode);
                     }
                 }
                 protected _create(attrs: any, children: any[]) {
                     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();
                         children.forEach(child => content.appendChild(this.getItemDom(child)));
                         // 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);
                         children.forEach(x => this._addChild(x));
                     }
                 }
                 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) {
                     this.ensureCreated();
                     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 ?
-                            registry.getEnclosingWidget(instance.domNode.parentNode) : null
+                            registry.getEnclosingWidget(instance.domNode.parentNode) : null;
                         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);
                     }
                 }
                 getWidgetInstance() {
                     this.ensureCreated();
                     return this._getInstance();
                 }
             }

djx/src/main/ts/tsx/traits.ts +3 -3

             import { IDestroyable, IRemovable } from "@implab/core-amd/interfaces";
             import { isDestroyable } from "@implab/core-amd/safe";
             import _WidgetBase = require("dijit/_WidgetBase");
             import registry = require("dijit/registry");
             import dom = require("dojo/dom-construct");
             import Stateful = require("dojo/Stateful");
             import { FunctionRendition } from "./FunctionRendition";
             import { DjxWidgetBase } from "./DjxWidgetBase";
             type _WidgetBaseConstructor = typeof _WidgetBase;
             export type DojoNodePosition = "first" | "after" | "before" | "last" | "replace" | "only" | number;
             export interface Rendition<TNode extends Node = Node> {
                 getDomNode(): TNode;
                 placeAt(refNode: string | Node, position?: DojoNodePosition): void;
             }
             /**
              * @deprecated use Rendition
              */
             export type BuildContext<TNode extends Node = Node> = Rendition<TNode>;
             export interface IRecursivelyDestroyable {
                 destroyRecursive(): void;
             }
             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 isRendition(v: any): v is Rendition {
                 return typeof v === "object" && typeof v.getDomElement === "function";
             }
             /**
              * @deprecated use isRendition
              */
             export const isBuildContext = isRendition;
             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 ||
                     "buildRendering" in v.prototype
                 );
             }
             /** Tests whether the specified node is placed in visible dom.
              *  @param {Node} node The node to test
              */
             export function isInPage(node: Node) {
                 return (node === document.body) ? false : document.body.contains(node);
             }
             export function isRecursivelyDestroyable(target: any): target is IRecursivelyDestroyable {
                 return target && typeof target.destroyRecursive === "function";
             }
             /** Destroys DOM Node with all contained widgets.
              * If the specified node is the root node of a widget, then the
              * widget will be destroyed.
              *
              * @param target DOM Node or widget to destroy
              */
             export function destroy(target: Node | IDestroyable | IRecursivelyDestroyable) {
                 if (isRecursivelyDestroyable(target)) {
                     target.destroyRecursive();
                 } else if (isDestroyable(target)) {
                     target.destroy();
                 } else if (isNode(target)) {
                     const w = isElementNode(target) ? registry.byNode(target) : undefined;
                     if (w) {
                         w.destroyRecursive();
                     } else {
                         registry.findWidgets(target).forEach(destroy);
                         dom.destroy(target);
                     }
                 }
             }
             /** Empties a content of the specified node and destroys all contained widgets.
              *
              * @param target DOM node to .
              */
             export function emptyNode(target: Node) {
                 registry.findWidgets(target).forEach(destroy);
                 dom.empty(target);
             }
             /** This function starts all widgets inside the DOM node if the target is a node
              * or starts widget itself if the target is the widget. If the specified node
              * associated with the widget that widget will be started.
              *
              * @param target DOM node to find and start widgets or the widget itself.
              */
             export function startupWidgets(target: Node | _WidgetBase, skipNode?: Node) {
                 if (isNode(target)) {
                     const w = isElementNode(target) ? registry.byNode(target) : undefined;
                     if (w) {
                         if (w.startup)
                             w.startup();
                     } else {
                         registry.findWidgets(target, skipNode).forEach(x => x.startup());
                     }
                 } else {
                     if (target.startup)
                         target.startup();
                 }
             }
             type StatefulProps<T> = T extends Stateful<infer A> ? A : never;
             type CleanFn = (instance: IRemovable | IDestroyable) => void;
             /**
              * Observers the property and calls render callback each change.
              *
              * @param target The target object which property will be observed.
              * @param prop The name of the property.
              * @param render The callback which will be called every time the value is changed
              * @param cleanupOrOwner The object with method `own` or an callback to register lifecycle for the observer.
              * @returns Rendition which is created instantly
              */
             export function watch<W extends _WidgetBase, K extends keyof W>(
                 target: W,
                 prop: K,
                 render: (model: W[K]) => any,
                 cleanupOrOwner?: { own: CleanFn } | CleanFn
             ): Rendition;
             /**
              * Observers the property and calls render callback each change.
              *
              * @param target The target object which property will be observed.
              * @param prop The name of the property.
              * @param render The callback which will be called every time the value is changed
              * @param cleanupOrOwner The object with method `own` or an callback to register lifecycle for the observer.
              * @returns Rendition which is created instantly
              */
             export function watch<T extends Stateful, K extends keyof StatefulProps<T>>(
                 target: T,
                 prop: K,
                 render: (model: StatefulProps<T>[K]) => any,
                 cleanupOrOwner?: { own: CleanFn } | CleanFn
             ): Rendition;
             export function watch<T extends Stateful, K extends keyof StatefulProps<T> & string>(
                 target: T,
                 prop: K,
                 render: (model: StatefulProps<T>[K]) => any,
                 cleanupOrOwner: { own: CleanFn } | CleanFn = () => { }
             ) {
                 let rendition = new FunctionRendition(() => render(target.get(prop)));
-                const _own = cleanupOrOwner instanceof Function ? cleanupOrOwner : (x: IRemovable) => cleanupOrOwner.own(x)
+                const _own = cleanupOrOwner instanceof Function ? cleanupOrOwner : (x: IRemovable) => cleanupOrOwner.own(x);
                 _own(target.watch(prop, (_name, oldValue, newValue) => {
                     if (oldValue !== newValue) {
                         const newRendition = new FunctionRendition(() => render(newValue));
                         newRendition.placeAt(rendition.getDomNode(), "replace");
                         destroy(rendition.getDomNode());
                         rendition = newRendition;
                     }
                 }));
                 return rendition;
             }
             /** Decorates the method which will be registered as the handle for the specified event.
              * This decorator can be applied to DjxWidgetBase subclass methods.
              *
              * ```
              *  @on("click")
              *  _onClick(eventObj: MouseEvent) {
              *      // ...
              *  }
              * ```
              */
             export const on = <E extends string>(eventName: E) =>
-                <K extends keyof T,
+                <K extends string,
                     T extends DjxWidgetBase<any, { [p in E]: EV }>,
                     EV extends Event
                 >(
                     target: T,
                     key: K,
-                    descriptor: TypedPropertyDescriptor<(eventObj: EV) => void> | TypedPropertyDescriptor<() => void>
+                    _descriptor: TypedPropertyDescriptor<(eventObj: EV) => void> | TypedPropertyDescriptor<() => void>
                 ): any => {
                     target._eventHandlers.push({ eventName, handlerMethod: key });
                 };

djx/src/test/ts/DeclareTests.ts +2 0

             import { Baz } from "./mock/Baz";
+            // tslint:disable-next-line: no-console
             console.log("Declare tests");
             const baz = new Baz();
             const data: string[] = [];
             baz.writeHello(data);
+            // tslint:disable-next-line: no-console
             console.log(data.join("\n"));

djx/src/test/ts/dummy.ts 0 -1

             import { test } from "./TestTraits";
             import { delay } from "@implab/core-amd/safe";
             import { assert } from "chai";
-            import css = require("@implab/djx/css!my.css");
             test("simple", (ok, fail, log) => {
                 setTimeout(() => {
                     // end should be called after the last assertion
                     ok("async assert");
                 }, 100);
             });
             test("simple", async (log, fail) => {
                 await delay(0);
                 assert.ok(true); // everything is fine
             });

djx/src/test/ts/view/MyWidget.tsx +1 -1

             import { djbase, djclass, bind, prototype, AbstractConstructor } from "../declare";
             import { DjxWidgetBase } from "../tsx/DjxWidgetBase";
             import { createElement } from "../tsx";
             import { on } from "../tsx/traits";
             interface MyWidgetAttrs {
                 title: string;
                 counter: number;
             }
             interface MyWidgetEvents {
                 "count-inc": Event & {
                     detail: number;
                 };
                 "count-dec": Event & {
                     detail: number;
                 };
             }
             @djclass
             export class MyWidget extends djbase(DjxWidgetBase as AbstractConstructor<DjxWidgetBase<MyWidgetAttrs, MyWidgetEvents>>) {
                 @bind({ node: "titleNode", type: "innerHTML" })
                 title = "";
                 @prototype()
                 counter = 0;
                 render() {
                     const Frame = (props: any) => <div>{props.children}</div>;
                     return <div className="myWidget" onsubmit={e => this._onSubmit(e)} tabIndex={3} style={{ alignContent: "center", border: "1px solid" }} >
                         <h1 data-dojo-attach-point="titleNode"></h1>
                         <Frame>
                             <span class="up-button" onclick={e => this._onIncClick(e)}>[+]</span>
                             <span class="down-button" onclick={() => this._onDecClick()}>[-]</span>
                         </Frame>
                     </div>;
                 }
                 postCreate() {
                     super.postCreate();
                     this.on("click", () => {});
                 }
                 _onSubmit(e: Event) {
                 }
                 _onIncClick(e: MouseEvent) {
                     this.set("counter", this.counter + 1);
                     this.emit("count-inc", { bubbles: false });
                 }
                 _onDecClick() {
                     this.emit("count-dec", { bubbles: false, detail: this.counter });
                 }
                 @on("count-inc")
                 _onCounterInc(evt: Event & { detail: number; x?: number; }) {
                 }
                 @on("click")
-                _onClick() {
+                protected _onClick() {
                 }
             }

djx/src/tsconfig.json +2 -1

             {
                 "compilerOptions": {
                     "moduleResolution": "node",
                     "noEmitOnError": true,
                     "strict": true,
                     "types": [],
                     "experimentalDecorators": true,
                     "jsxFactory": "createElement",
                     "target": "ES5",
                     //"skipLibCheck": true,
                     "jsx": "react",
-                    "lib": ["es5", "es2015.promise", "es2015.symbol", "es2015.iterable", "dom", "scripthost"]
+                    "lib": ["es5", "es2015.promise", "es2015.symbol", "es2015.iterable", "dom", "scripthost"],
+                    "noUnusedLocals": true
                 }
             }

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