##// END OF EJS Templates
implab » implabjs-djx
RSS
Added Renderer, WatchRendition
Added Renderer, WatchRendition
cin - - Load All Authors

File last commit:

r93:d99e2014cea4 default
r94:131e369d1143 default
Show More
MyWidget.tsx
69 lines | 1.7 KiB | text/x-typescript | TypeScriptLexer
/ djx / src / test / ts / view / MyWidget.tsx
History | Annotation | Raw |Copy content |Copy permalink
import { djbase, djclass, bind, prototype, AbstractConstructor } from "../declare";
import { DjxWidgetBase } from "../tsx/DjxWidgetBase";
import { createElement, on } from "../tsx";
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")
private _onCounterInc(evt: Event & { detail: number; x?: number; }) {
}
@on("click", "keydown")
protected _onClick(event: MouseEvent | KeyboardEvent) {
}
}