@web-atoms/web-controls 2.6.2 → 2.6.3

package/src/mobile/pages/PageFrameViewModel.ts

@@ -1,144 +0,0 @@
-import { Atom } from "@web-atoms/core/dist/Atom.js";
-import { AtomBinder } from "@web-atoms/core/dist/core/AtomBinder.js";
-import { AtomUri } from "@web-atoms/core/dist/core/AtomUri.js";
-import { CancelToken } from "@web-atoms/core/dist/core/types.js";
-import { Inject } from "@web-atoms/core/dist/di/Inject.js";
-import { NavigationService } from "@web-atoms/core/dist/services/NavigationService.js";
-import { AtomViewModel, Receive, Watch } from "@web-atoms/core/dist/view-model/AtomViewModel.js";
-import bindUrlParameter from "@web-atoms/core/dist/view-model/bindUrlParameter.js";
-import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
-
-declare var dotNet: any;
-
-export default class PageFrameViewModel extends AtomViewModel {
-
-    public owner: any = null;
-
-    @Watch
-    public get canGoBack(): boolean {
-        if (!this.owner) {
-            return false;
-        }
-        return this.owner.stack.length > 0;
-    }
-
-    public title: string = "Mobile Page";
-
-    @Inject
-    public navigationService: NavigationService;
-
-    public cancelToken: CancelToken;
-
-    private mUrl: string;
-    public get url(): string {
-        return this.mUrl;
-    }
-    public set url(value: string) {
-        if (value === this.mUrl) {
-            return;
-        }
-        this.mUrl = value;
-        this.owner.pushUrl(value);
-
-        if  (this.app.url.hash.url !== value) {
-            this.app.url.hash.url = value;
-            history.pushState({}, document.title, this.app.url.toString());
-        }
-
-        this.refresh("url");
-    }
-
-    public async init(): Promise<void> {
-        await Atom.delay(1);
-        if (!this.owner.name) {
-            return;
-        }
-        // bindUrlParameter(this, "url", this.owner.name);
-
-        if (this.owner.url) {
-            this.app.url.hash.url = this.owner.url;
-            this.mUrl = this.owner.url;
-            history.pushState({}, document.title, this.app.url.toString());
-        } else {
-            const url = this.app.url ? (this.app.url.query.url  || this.app.url.query.url) : null;
-            if (url) {
-                this.url = url.toString();
-            }
-        }
-
-        // watch for window popstate...
-
-        if (typeof dotNet === "undefined") {
-            (this.owner as AtomControl).bindEvent(
-                window as any,
-                "popstate",
-                () => this.onPopState());
-        } else {
-            window.addEventListener("backButton", (ce: CustomEvent<Function>) => {
-                const { detail } = ce;
-                ce.preventDefault();
-                this.app.runAsync(async () => {
-                    if (this.owner.stack.length) {
-                        await this.iconClick();
-                    } else {
-                        detail();
-                    }
-                });
-            });
-        }
-    }
-
-    @Receive("root-page-go-back")
-    public async iconClick(): Promise<void> {
-
-        if (this.cancelToken) {
-            this.cancelToken.cancel();
-            this.cancelToken = null;
-            return;
-        }
-
-        if (this.owner.keepStack && this.owner.stack.length) {
-            const p = this.owner.backCommand();
-            if (p && p.then && p.catch) {
-                await p;
-            }
-            setTimeout(() => {
-                // this.canGoBack = this.owner.stack.length;
-                AtomBinder.refreshValue(this, "canGoBack");
-            }, 500);
-            return;
-        }
-
-        if (!this.owner.menuUrl) {
-            return;
-        }
-
-        this.cancelToken = new CancelToken();
-
-        // not awaiting on this promise because
-        // button click will not work till the promise
-        // finishes
-        this.navigationService.openPage(this.owner.menuUrl, null, { cancelToken: this.cancelToken })
-            .then(() => this.cancelToken = null)
-            .catch(() => this.cancelToken = null);
-    }
-
-    private onPopState() {
-        // do nothing if the top is same...
-
-        this.app.url = new AtomUri(location.href);
-        const url = this.app.url.hash.url || this.app.url.query.url;
-        if (url === this.mUrl) {
-            return;
-        }
-
-        const stack = this.owner.stack;
-        if (stack.length && stack[stack.length - 1].url === url) {
-            this.owner.backCommand();
-            return;
-        }
-
-        this.owner.url = url;
-    }
-
-}

package/src/mobile/pages/TitleTemplate.tsx

@@ -1,21 +0,0 @@
-import Bind from "@web-atoms/core/dist/core/Bind.js";
-import XNode from "@web-atoms/core/dist/core/XNode.js";
-import {AtomControl} from "@web-atoms/core/dist/web/controls/AtomControl.js";
-
-export default class TitleTemplate extends AtomControl {
-
-	constructor(a?: any, e: any = document.createElement("span")) {
-		super(a, e);
-	}
-
-	public create(): void {
-		this.render(
-		<span
-			text={Bind.oneWay(
-				() => (this.localViewModel.owner
-					&& this.localViewModel.owner.current
-					? this.localViewModel.owner.current.title : undefined)
-					|| this.localViewModel.title)}
-			></span>);
-	}
-}

package/src/time-field/AtomTimeField.tsx

@@ -1,107 +0,0 @@
-import Bind from "@web-atoms/core/dist/core/Bind.js";
-import { BindableProperty } from "@web-atoms/core/dist/core/BindableProperty.js";
-import { PropertyBinding } from "@web-atoms/core/dist/core/PropertyBinding.js";
-import XNode from "@web-atoms/core/dist/core/XNode.js";
-import { AtomViewModel } from "@web-atoms/core/dist/view-model/AtomViewModel.js";
-import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
-import { AtomToggleButtonBar } from "@web-atoms/core/dist/web/controls/AtomToggleButtonBar.js";
-import DateTime from "@web-atoms/date-time/dist/DateTime.js";
-import TimeSpan from "@web-atoms/date-time/dist/TimeSpan.js";
-import AtomTimeFieldStyle from "./AtomTimeFieldStyle.js";
-
-const zones = [
-    { label: "AM", value: "AM" },
-    { label: "PM", value: "PM" }
-];
-
-function toTimeString(ts: ITimeInfo) {
-    const h = ts.zone === "AM" ? ts.hour : ts.hour + 12;
-    const t = new TimeSpan(0, h , ts.minutes);
-    return t.toString(true);
-}
-
-function fromTimeString(t: string, ti: ITimeInfo): ITimeInfo {
-    if (!t) {
-        return ti;
-    }
-    const ts = TimeSpan.parse(t);
-    const isMorning = ts.totalMinutes < 12 * 60;
-    ti = ti || {} as any;
-    ti.hour = isMorning ? ts.hours : ts.hours - 12;
-    ti.minutes = ts.minutes;
-    ti.zone = isMorning ? "AM" : "PM";
-    return ti;
-}
-
-export interface ITimeInfo {
-    hour: number;
-    minutes: number;
-    zone: string;
-}
-
-export default class AtomTimeField extends AtomControl {
-
-    @BindableProperty
-    public time: string;
-
-    @BindableProperty
-    public hour: number;
-
-    @BindableProperty
-    public minutes: number;
-
-    @BindableProperty
-    public zone: string;
-
-    @BindableProperty
-    public ts: ITimeInfo;
-
-    public preCreate() {
-        super.preCreate();
-
-        this.defaultControlStyle = AtomTimeFieldStyle;
-
-        this.registerDisposable(
-            new PropertyBinding(
-                this,
-                this.element,
-                "time",
-            [["this", "ts"]],
-            true, {
-                fromSource: (v) => toTimeString(v),
-                fromTarget: (v) => fromTimeString(v, this.ts)
-            }, this
-            )
-        );
-    }
-
-    public create() {
-        this.render(<div
-            class={this.controlStyle.name}
-            time={Bind.oneWay(() => this.changed(this.ts.hour, this.ts.minutes, this.ts.zone))}
-            >
-            <input
-                class="hour"
-                type="number"
-                max="12"
-                min="0"
-                value={Bind.twoWaysImmediate(() => this.ts.hour)}
-                />
-            <input
-                class="minutes"
-                type="number"
-                min="0"
-                max="59"
-                value={Bind.twoWaysImmediate(() => this.ts.minutes)} />
-            <AtomToggleButtonBar
-                items={zones}
-                value={Bind.twoWays(() => this.ts.zone)}
-                />
-        </div>);
-    }
-
-    private changed(hour: number, minutes: number, zone: string): string {
-        const n = { hour, minutes, zone};
-        return toTimeString(n);
-    }
-}

package/src/time-field/AtomTimeFieldStyle.ts

@@ -1,18 +0,0 @@
-import { AtomStyle } from "@web-atoms/core/dist/web/styles/AtomStyle.js";
-import { IStyleDeclaration } from "@web-atoms/core/dist/web/styles/IStyleDeclaration.js";
-
-export default class AtomTimeFieldStyle extends AtomStyle {
-
-    public get root(): IStyleDeclaration {
-        return {
-            subclasses: {
-                " .minutes": {
-                    maxWidth: "50px"
-                },
-                " .hour": {
-                    maxWidth: "50px"
-                }
-            }
-        };
-    }
-}