forked from mystiq/hydrogen-web
rename UIView to IView
This commit is contained in:
parent
b71a26b04a
commit
a6bcfac597
6 changed files with 15 additions and 15 deletions
|
@ -15,14 +15,14 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {IMountArgs, ViewNode, UIView} from "./types";
|
import {IMountArgs, ViewNode, IView} from "./types";
|
||||||
|
|
||||||
export interface IObservableValue {
|
export interface IObservableValue {
|
||||||
on?(event: "change", handler: (props?: string[]) => void): void;
|
on?(event: "change", handler: (props?: string[]) => void): void;
|
||||||
off?(event: "change", handler: (props?: string[]) => void): void;
|
off?(event: "change", handler: (props?: string[]) => void): void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export abstract class BaseUpdateView<T extends IObservableValue> implements UIView {
|
export abstract class BaseUpdateView<T extends IObservableValue> implements IView {
|
||||||
protected _value: T
|
protected _value: T
|
||||||
protected _boundUpdateFromValue: ((props?: string[]) => void) | null
|
protected _boundUpdateFromValue: ((props?: string[]) => void) | null
|
||||||
|
|
||||||
|
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
||||||
import {el} from "./html";
|
import {el} from "./html";
|
||||||
import {mountView, insertAt} from "./utils";
|
import {mountView, insertAt} from "./utils";
|
||||||
import {BaseObservableList as ObservableList} from "../../../../observable/list/BaseObservableList.js";
|
import {BaseObservableList as ObservableList} from "../../../../observable/list/BaseObservableList.js";
|
||||||
import {UIView, IMountArgs} from "./types";
|
import {IView, IMountArgs} from "./types";
|
||||||
|
|
||||||
interface IOptions<T, V> {
|
interface IOptions<T, V> {
|
||||||
list: ObservableList<T>,
|
list: ObservableList<T>,
|
||||||
|
@ -29,7 +29,7 @@ interface IOptions<T, V> {
|
||||||
|
|
||||||
type SubscriptionHandle = () => undefined;
|
type SubscriptionHandle = () => undefined;
|
||||||
|
|
||||||
export class ListView<T, V extends UIView> implements UIView {
|
export class ListView<T, V extends IView> implements IView {
|
||||||
|
|
||||||
private _onItemClick?: (childView: V, evt: UIEvent) => void;
|
private _onItemClick?: (childView: V, evt: UIEvent) => void;
|
||||||
private _list: ObservableList<T>;
|
private _list: ObservableList<T>;
|
||||||
|
|
|
@ -169,7 +169,7 @@ export class Popup {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* fake UIView api, so it can be tracked by a template view as a subview */
|
/* fake IView api, so it can be tracked by a template view as a subview */
|
||||||
root() {
|
root() {
|
||||||
return this._fakeRoot;
|
return this._fakeRoot;
|
||||||
}
|
}
|
||||||
|
|
|
@ -18,7 +18,7 @@ limitations under the License.
|
||||||
import { setAttribute, text, isChildren, classNames, TAG_NAMES, HTML_NS, ClassNames, Child} from "./html";
|
import { setAttribute, text, isChildren, classNames, TAG_NAMES, HTML_NS, ClassNames, Child} from "./html";
|
||||||
import {mountView} from "./utils";
|
import {mountView} from "./utils";
|
||||||
import {BaseUpdateView, IObservableValue} from "./BaseUpdateView";
|
import {BaseUpdateView, IObservableValue} from "./BaseUpdateView";
|
||||||
import {IMountArgs, ViewNode, UIView} from "./types";
|
import {IMountArgs, ViewNode, IView} from "./types";
|
||||||
|
|
||||||
function objHasFns(obj: ClassNames<unknown>): obj is { [className: string]: boolean } {
|
function objHasFns(obj: ClassNames<unknown>): obj is { [className: string]: boolean } {
|
||||||
for(const value of Object.values(obj)) {
|
for(const value of Object.values(obj)) {
|
||||||
|
@ -58,7 +58,7 @@ export class TemplateView<T extends IObservableValue> extends BaseUpdateView<T>
|
||||||
private _bindings?: (() => void)[] = undefined;
|
private _bindings?: (() => void)[] = undefined;
|
||||||
private _root?: ViewNode = undefined;
|
private _root?: ViewNode = undefined;
|
||||||
// public because used by TemplateBuilder
|
// public because used by TemplateBuilder
|
||||||
_subViews?: UIView[] = undefined;
|
_subViews?: IView[] = undefined;
|
||||||
|
|
||||||
constructor(value: T, render?: RenderFn<T>) {
|
constructor(value: T, render?: RenderFn<T>) {
|
||||||
super(value);
|
super(value);
|
||||||
|
@ -138,14 +138,14 @@ export class TemplateView<T extends IObservableValue> extends BaseUpdateView<T>
|
||||||
this._bindings.push(bindingFn);
|
this._bindings.push(bindingFn);
|
||||||
}
|
}
|
||||||
|
|
||||||
addSubView(view: UIView): void {
|
addSubView(view: IView): void {
|
||||||
if (!this._subViews) {
|
if (!this._subViews) {
|
||||||
this._subViews = [];
|
this._subViews = [];
|
||||||
}
|
}
|
||||||
this._subViews.push(view);
|
this._subViews.push(view);
|
||||||
}
|
}
|
||||||
|
|
||||||
removeSubView(view: UIView): void {
|
removeSubView(view: IView): void {
|
||||||
if (!this._subViews) { return; }
|
if (!this._subViews) { return; }
|
||||||
const idx = this._subViews.indexOf(view);
|
const idx = this._subViews.indexOf(view);
|
||||||
if (idx !== -1) {
|
if (idx !== -1) {
|
||||||
|
@ -312,13 +312,13 @@ export class TemplateBuilder<T extends IObservableValue> {
|
||||||
|
|
||||||
// this inserts a view, and is not a view factory for `if`, so returns the root element to insert in the template
|
// this inserts a view, and is not a view factory for `if`, so returns the root element to insert in the template
|
||||||
// you should not call t.view() and not use the result (e.g. attach the result to the template DOM tree).
|
// you should not call t.view() and not use the result (e.g. attach the result to the template DOM tree).
|
||||||
view(view: UIView, mountOptions?: IMountArgs): ViewNode {
|
view(view: IView, mountOptions?: IMountArgs): ViewNode {
|
||||||
this._templateView.addSubView(view);
|
this._templateView.addSubView(view);
|
||||||
return mountView(view, mountOptions);
|
return mountView(view, mountOptions);
|
||||||
}
|
}
|
||||||
|
|
||||||
// map a value to a view, every time the value changes
|
// map a value to a view, every time the value changes
|
||||||
mapView<R>(mapFn: (value: T) => R, viewCreator: (mapped: R) => UIView | null): ViewNode {
|
mapView<R>(mapFn: (value: T) => R, viewCreator: (mapped: R) => IView | null): ViewNode {
|
||||||
return this._addReplaceNodeBinding(mapFn, (prevNode) => {
|
return this._addReplaceNodeBinding(mapFn, (prevNode) => {
|
||||||
if (prevNode && prevNode.nodeType !== Node.COMMENT_NODE) {
|
if (prevNode && prevNode.nodeType !== Node.COMMENT_NODE) {
|
||||||
const subViews = this._templateView._subViews;
|
const subViews = this._templateView._subViews;
|
||||||
|
@ -356,7 +356,7 @@ export class TemplateBuilder<T extends IObservableValue> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
ifView(predicate: (value: T) => boolean, viewCreator: (value: T) => UIView): ViewNode {
|
ifView(predicate: (value: T) => boolean, viewCreator: (value: T) => IView): ViewNode {
|
||||||
return this.mapView(
|
return this.mapView(
|
||||||
value => !!predicate(value),
|
value => !!predicate(value),
|
||||||
enabled => enabled ? viewCreator(this._value) : null
|
enabled => enabled ? viewCreator(this._value) : null
|
||||||
|
|
|
@ -22,7 +22,7 @@ export interface IMountArgs {
|
||||||
// Comment nodes can be used as temporary placeholders for Elements, like TemplateView does.
|
// Comment nodes can be used as temporary placeholders for Elements, like TemplateView does.
|
||||||
export type ViewNode = Element | Comment;
|
export type ViewNode = Element | Comment;
|
||||||
|
|
||||||
export interface UIView {
|
export interface IView {
|
||||||
mount(args?: IMountArgs): ViewNode;
|
mount(args?: IMountArgs): ViewNode;
|
||||||
root(): ViewNode | undefined; // should only be called between mount() and unmount()
|
root(): ViewNode | undefined; // should only be called between mount() and unmount()
|
||||||
unmount(): void;
|
unmount(): void;
|
||||||
|
|
|
@ -14,10 +14,10 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {UIView, IMountArgs, ViewNode} from "./types";
|
import {IView, IMountArgs, ViewNode} from "./types";
|
||||||
import {tag} from "./html";
|
import {tag} from "./html";
|
||||||
|
|
||||||
export function mountView(view: UIView, mountArgs?: IMountArgs): ViewNode {
|
export function mountView(view: IView, mountArgs?: IMountArgs): ViewNode {
|
||||||
let node;
|
let node;
|
||||||
try {
|
try {
|
||||||
node = view.mount(mountArgs);
|
node = view.mount(mountArgs);
|
||||||
|
|
Loading…
Reference in a new issue