dany/antos-frontend
1
0
Fork 0
mirror of https://github.com/lxsang/antos-frontend.git synced 2025-07-19 15:29:51 +02:00
Code Issues 1 Actions Projects Releases Wiki Activity

add more type, all defaults apps are now in typescript

Browse Source
This commit is contained in:
Xuan Sang LE
2020-06-04 17:49:48 +02:00
parent 6e95994892
commit fb462fe31b
50 changed files with 2612 additions and 1734 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/core/BaseApplication.ts
View File

@ -35,7 +35,7 @@ namespace OS {
*/
export abstract class BaseApplication extends BaseModel {
setting: GenericObject<any>;
keycomb: GUI.ShortcutType;
protected keycomb: GUI.ShortcutType;
sysdock: GUI.tag.AppDockTag;
appmenu: GUI.tag.MenuTag;
@ -57,6 +57,12 @@ namespace OS {
SHIFT: {},
META: {},
};
this.subscribe("appregistry", (m) => {
if (m.name === this.name) {
this.applySetting(m.data.m);
}
});
}
/**
@ -70,11 +76,10 @@ namespace OS {
this.on("exit", () => this.quit(false));
// first register some base event to the app
this.on("focus", () => {
console.log("focus");
this.sysdock.selectedApp = this;
this.appmenu.pid = this.pid;
this.appmenu.items= this.baseMenu() || [];
this.appmenu.onmenuselect=(d: GUI.TagEventType): void => {
this.appmenu.onmenuselect=(d: GUI.tag.MenuEventData): void => {
return this.trigger("menuselect", d);
}
if (this.dialog) {
@ -102,26 +107,30 @@ namespace OS {
return this.loadScheme();
}
/**
*
*
* @protected
* @returns {void}
* @memberof BaseApplication
*/
loadScheme(): void {
protected loadScheme(): void {
//now load the scheme
const path = `${this.meta().path}/scheme.html`;
return this.render(path);
}
/**
*
*
* @protected
* @param {Promise<any>} promise
* @returns {Promise<any>}
* @memberof BaseApplication
*/
load(promise: Promise<any>): Promise<any> {
protected load(promise: Promise<any>): Promise<any> {
const q = this._api.mid();
return new Promise(async (resolve, reject) => {
this._api.loading(q, this.name);
@ -136,15 +145,17 @@ namespace OS {
});
}
/**
*
*
* @protected
* @param {string} k
* @param {(e: JQuery.MouseDownEvent) => void} f
* @returns {void}
* @memberof BaseApplication
*/
bindKey(k: string, f: (e: JQuery.MouseDownEvent) => void): void {
protected bindKey(k: string, f: (e: JQuery.MouseDownEvent) => void): void {
const arr = k.split("-");
if (arr.length !== 2) {
return;
@ -157,14 +168,16 @@ namespace OS {
this.keycomb[fnk][c] = f;
}
/**
*
*
* @private
* @param {string} name
* @returns {void}
* @memberof BaseApplication
*/
updateLocale(name: string): void {
protected updateLocale(name: string): void {
const meta = this.meta();
if (!meta || !meta.locales) {
return;
@ -204,35 +217,41 @@ namespace OS {
return false;
}
/**
*
*
* @protected
* @param {string} k
* @memberof BaseApplication
*/
applySetting(k: string): void {}
protected applySetting(k: string): void {}
/**
*
*
* @protected
* @memberof BaseApplication
*/
applyAllSetting(): void {
protected applyAllSetting(): void {
for (let k in this.setting) {
const v = this.setting[k];
this.applySetting(k);
}
}
/**
*
*
* @protected
* @param {string} k
* @param {*} v
* @returns {void}
* @memberof BaseApplication
*/
registry(k: string, v: any): void {
protected registry(k: string, v: any): void {
this.setting[k] = v;
return this.publish("appregistry", k);
}
@ -290,13 +309,15 @@ namespace OS {
return (this.scheme as GUI.tag.WindowTag).apptitle;
}
/**
*
*
* @protected
* @param {BaseEvent} evt
* @memberof BaseApplication
*/
onexit(evt: BaseEvent): void {
protected onexit(evt: BaseEvent): void {
this.cleanup(evt);
if (!evt.prevent) {
if (this.pid === this.appmenu.pid) {
@ -316,13 +337,15 @@ namespace OS {
return application[this.name].meta;
}
/**
*
*
* @returns {BasicItemType[]}
* @protected
* @returns {GUI.BasicItemType[]}
* @memberof BaseApplication
*/
baseMenu(): GUI.BasicItemType[] {
protected baseMenu(): GUI.BasicItemType[] {
let mn: GUI.BasicItemType[] = [
{
text: application[this.name].meta.name,
@ -346,32 +369,29 @@ namespace OS {
//main program
// implement by subclasses
/**
*
*
* @returns {BasicItemType[]}
* @protected
* @returns {GUI.BasicItemType[]}
* @memberof BaseApplication
*/
menu(): GUI.BasicItemType[] {
protected menu(): GUI.BasicItemType[] {
// implement by subclasses
// to add menu to application
return [];
}
/**
*
*
* @memberof BaseApplication
*/
open(): void {}
/**
*
*
* @protected
* @param {BaseEvent} e
* @memberof BaseApplication
*/
cleanup(e: BaseEvent): void {}
protected cleanup(e: BaseEvent): void {}
}
BaseApplication.type = ModelType.Application;

8
src/core/BaseDialog.ts
View File

@ -58,7 +58,7 @@ namespace OS {
const evt = new BaseEvent("exit", false);
this.onexit(evt);
if (!evt.prevent) {
delete this.observable;
delete this._observable;
if (this.scheme) {
$(this.scheme).remove();
}
@ -143,14 +143,16 @@ namespace OS {
this.handle = undefined;
}
/**
*
*
* @protected
* @param {BaseEvent} e
* @returns {void}
* @memberof BaseDialog
*/
onexit(e: BaseEvent): void {
protected onexit(e: BaseEvent): void {
if (this.parent) {
return (this.parent.dialog = undefined);
}
@ -672,7 +674,7 @@ namespace OS {
if (this.data && this.data.data) {
listview.data = this.data.data;
}
const fn = (e: TagEventType) => {
const fn = (e: TagEventType<GUI.tag.ListItemEventData>) => {
const data = listview.selectedItem;
if (!data) {
return this.notify(__("Please select an item"));

100
src/core/BaseModel.ts
View File

@ -34,16 +34,16 @@ namespace OS {
[propName: string]: any;
}
/**
*
*
* @export
* @enum {number}
*/
export enum ModelType {
Application,
Service,
SubWindow
};
*
*
* @export
* @enum {number}
*/
export enum ModelType {
Application,
Service,
SubWindow,
}
/**
*
*
@ -89,14 +89,14 @@ namespace OS {
export abstract class BaseModel {
name: string;
args: AppArgumentsType[];
observable: API.Announcer;
_api: typeof API;
_gui: typeof GUI;
protected _observable: API.Announcer;
protected _api: typeof API;
protected _gui: typeof GUI;
dialog: GUI.BaseDialog;
host: string;
protected host: string;
pid: number;
scheme: HTMLElement;
systemsetting: typeof setting;
protected systemsetting: typeof setting;
birth: number;
static type: ModelType;
static singleton: boolean;
@ -113,23 +113,40 @@ namespace OS {
constructor(name: string, args: AppArgumentsType[]) {
this.name = name;
this.args = args;
this.observable = new API.Announcer();
this._observable = new API.Announcer();
this._api = API;
this._gui = GUI;
this.systemsetting = setting;
this.on("exit", () => this.quit(false));
this.host = this._gui.workspace;
this.dialog = undefined;
this.subscribe("systemlocalechange", (name) => {
this.updateLocale(name);
return this.update();
});
}
get observable(): API.Announcer
{
return this._observable;
}
/**
*
*
* @protected
* @param {string} name
* @memberof BaseModel
*/
protected updateLocale(name: string) {}
/**
*
*
* @protected
* @param {string} p
* @returns {void}
* @memberof BaseModel
*/
render(p: string): void {
protected render(p: string): void {
return GUI.loadScheme(p, this, this.host);
}
@ -145,7 +162,7 @@ namespace OS {
this.onexit(evt);
if (!evt.prevent) {
this.observable.off("*");
delete this.observable;
delete this._observable;
if (this.dialog) {
this.dialog.quit();
}
@ -177,25 +194,27 @@ namespace OS {
}
// call a server side script
/**
*
*
* @protected
* @param {GenericObject<any>} cmd
* @returns {Promise<any>}
* @memberof BaseModel
*/
call(cmd: GenericObject<any>): Promise<any> {
protected call(cmd: GenericObject<any>): Promise<any> {
return this._api.apigateway(cmd, false);
}
// get a stream
/**
*
*
* @protected
* @returns {Promise<WebSocket>}
* @memberof BaseModel
*/
stream(): Promise<WebSocket> {
protected stream(): Promise<WebSocket> {
return this._api.apigateway(null, true) as Promise<WebSocket>;
}
@ -232,58 +251,68 @@ namespace OS {
abstract hide(): void;
//implement by sub class
/**
*
*
* @protected
* @abstract
* @param {BaseEvent} e
* @memberof BaseModel
*/
abstract onexit(e: BaseEvent): void;
protected abstract onexit(e: BaseEvent): void;
//implement by subclass
/**
*
*
* @protected
* @param {string} e
* @param {(d: any) => void} f
* @returns {void}
* @memberof BaseModel
*/
one(e: string, f: (d: any) => void): void {
protected one(e: string, f: (d: any) => void): void {
return this.observable.one(e, f);
}
/**
*
*
* @protected
* @param {string} e
* @param {(d: any) => void} f
* @returns {void}
* @memberof BaseModel
*/
on(e: string, f: (d: any) => void): void {
protected on(e: string, f: (d: any) => void): void {
return this.observable.on(e, f);
}
/**
*
*
* @protected
* @param {string} e
* @param {(d: any) => void} [f]
* @returns {void}
* @memberof BaseModel
*/
off(e: string, f?: (d: any) => void): void {
protected off(e: string, f?: (d: any) => void): void {
if (!f) {
return this.observable.off(e);
}
return this.observable.off(e, f);
}
/**
*
*
* @protected
* @param {string} e
* @param {*} [d]
* @returns {void}
@ -293,9 +322,11 @@ namespace OS {
return this.observable.trigger(e, d);
}
/**
*
*
* @protected
* @param {string} e
* @param {(d: any) => void} f
* @returns {void}
@ -305,10 +336,11 @@ namespace OS {
return announcer.on(e, f, this);
}
/**
*
*
* @param {(BaseDialog | string)} d
* @param {(GUI.BaseDialog | string)} d
* @param {GenericObject<any>} [data]
* @returns {Promise<any>}
* @memberof BaseModel
@ -346,24 +378,30 @@ namespace OS {
/**
*
*
* @protected
* @param {GenericObject<any>} data
* @returns {Promise<any>}
* @memberof BaseModel
*/
ask(data: GenericObject<any>): Promise<any> {
protected ask(data: GenericObject<any>): Promise<any> {
return this._gui.openDialog("YesNoDialog", data);
}
/**
*
*
* @protected
* @param {string} t
* @param {(string | FormatedString)} m
* @param {Error} [e]
* @returns {void}
* @memberof BaseModel
*/
publish(t: string, m: string | FormatedString, e?: Error): void {
protected publish(
t: string,
m: string | FormatedString,
e?: Error
): void {
const mt = this.meta();
let icon: string = undefined;
if (mt.icon) {
@ -452,11 +490,12 @@ namespace OS {
/**
*
*
* @protected
* @param {string} id
* @returns {HTMLElement}
* @memberof BaseModel
*/
find(id: string): HTMLElement {
protected find(id: string): HTMLElement {
if (this.scheme) {
return $(`[data-id='${id}']`, this.scheme)[0];
}
@ -465,11 +504,12 @@ namespace OS {
/**
*
*
* @protected
* @param {string} sel
* @returns {HTMLElement}
* @memberof BaseModel
*/
select(sel: string): HTMLElement {
protected select(sel: string): HTMLElement {
if (this.scheme) {
return $(sel, this.scheme)[0];
}

16
src/core/BaseService.ts
View File

@ -38,7 +38,7 @@ namespace OS {
domel: HTMLElement;
private timer: number;
holder: HTMLElement;
onmenuselect: (d: OS.GUI.TagEventType) => void;
onmenuselect: (d: OS.GUI.TagEventType<GUI.tag.MenuEventData>) => void;
/**
*Creates an instance of BaseService.
@ -105,15 +105,17 @@ namespace OS {
this.holder = h;
}
/**
*
*
* @protected
* @param {number} t
* @param {() => void} f
* @returns {number}
* @memberof BaseService
*/
watch(t: number, f: () => void): number {
protected watch(t: number, f: () => void): number {
var func = () => {
f();
return (this.timer = setTimeout(() => func(), t));
@ -121,14 +123,16 @@ namespace OS {
return func();
}
/**
*
*
* @protected
* @param {BaseEvent} evt
* @returns
* @memberof BaseService
*/
onexit(evt: BaseEvent) {
protected onexit(evt: BaseEvent) {
if (this.timer) {
console.log("clean timer");
}
@ -162,16 +166,18 @@ namespace OS {
* @param {GUI.TagEventType} e
* @memberof BaseService
*/
abstract awake(e: GUI.TagEventType): void;
abstract awake(e: GUI.TagEventType<GUI.tag.MenuEventData>): void;
//implement by user to tart the service
/**
*
*
* @protected
* @param {BaseEvent} evt
* @memberof BaseService
*/
cleanup(evt: BaseEvent) {}
protected cleanup(evt: BaseEvent) {}
}
//implemeted by user
BaseService.type = ModelType.Service;

6
src/core/core.ts
View File

@ -992,14 +992,14 @@ namespace OS {
}
}
/**
*
*
* @export
* @param {*} f
* @returns {Promise<RequestResult>}
*/
export function setting(f: any): Promise<RequestResult> {
export function setting(): Promise<RequestResult> {
return API.handle.setting();
}
@ -1137,7 +1137,7 @@ namespace OS {
* @export
* @returns {*}
*/
export function switcher(): any {
export function switcher(...args: string[]): any {
let k: any, v: any;
const o: any = {};
const p = {};

36
src/core/gui.ts
View File

@ -83,7 +83,7 @@ namespace OS {
}
$(parent as GenericObject<any>).append(scheme);
app.scheme = scheme[0] as HTMLElement;
app.scheme.uify(app.observable);
app.scheme.uify(app.observable, true);
app.main();
app.show();
}
@ -305,12 +305,14 @@ namespace OS {
return launch(app, args);
}
/**
*
*
* @export
* @param {string} app
*/
function unloadApp(app: string): void {
export function unloadApp(app: string): void {
PM.killAll(app, true);
if (app[app] && app[app].style) {
$(app[app].style).remove();
@ -522,22 +524,13 @@ namespace OS {
}
const dock = $("#sysdock")[0] as tag.AppDockTag;
app.init();
return app.one("rendered", function () {
dock.newapp(data);
app.observable.one("rendered", function () {
app.sysdock = dock;
app.appmenu = $(
"[data-id = 'appmenu']",
"#syspanel"
)[0] as tag.MenuTag;
app.subscribe("systemlocalechange", function (name) {
app.updateLocale(name);
return app.update();
});
return app.subscribe("appregistry", function (m) {
if (m.name === app.name) {
return app.applySetting(m.data.m);
}
});
dock.newapp(data);
});
}
@ -598,7 +591,6 @@ namespace OS {
export function attachservice(srv: application.BaseService): void {
($("#syspanel")[0] as tag.SystemPanelTag).attachservice(srv);
srv.init();
return srv.subscribe("systemlocalechange", (name) => srv.update());
}
/**
@ -666,7 +658,7 @@ namespace OS {
* @export
* @param {setting.WPSettingType} obj
*/
export function wallpaper(obj: setting.WPSettingType): void {
export function wallpaper(obj?: setting.WPSettingType): void {
if (obj) {
setting.appearance.wp = obj;
}
@ -851,11 +843,11 @@ namespace OS {
return e.calibrate();
};
desktop.onlistselect = function (d: TagEventType) {
desktop.onlistselect = function (d: TagEventType<tag.ListItemEventData>) {
($("#sysdock")[0] as tag.AppDockTag).selectedApp = null;
};
desktop.onlistdbclick = function (d: TagEventType) {
desktop.onlistdbclick = function (d: TagEventType<tag.ListItemEventData>) {
($("#sysdock")[0] as tag.AppDockTag).selectedApp = null;
const it = desktop.selectedItem;
return openWith(it.data as AppArgumentsType);
@ -900,7 +892,7 @@ namespace OS {
})()
);
m.items = menu;
m.onmenuselect = function (evt: TagEventType) {
m.onmenuselect = function (evt: TagEventType<tag.MenuEventData>) {
if(!evt.data || !evt.data.item) return;
const item = evt.data.item.data;
switch (item.dataid) {
@ -1048,9 +1040,11 @@ namespace OS {
}
return result;
})()
);
return
setting.system.startup.apps.map((a) => launch(a, []));
).then(function(){
setting.system.startup.apps.map((a) => {
launch(a, []);
});
})
});
}
});

2
src/core/handles/RemoteHandle.ts
View File

@ -158,7 +158,7 @@ namespace OS {
export function setting(): Promise<RequestResult> {
const p = `${API.REST}/system/settings`;
return API.post(p, setting);
return API.post(p, OS.setting);
}
export function dbquery(

12
src/core/tags/AppDockTag.ts
View File

@ -28,7 +28,7 @@ namespace OS {
*/
export class AppDockTag extends AFXTag {
private _onappselect: TagEventCallback;
private _onappselect: TagEventCallback<any>;
private _items: AppDockItemType[];
private _selectedApp: application.BaseApplication;
@ -137,11 +137,13 @@ namespace OS {
el.appendTo(this);
el[0].uify(this.observable);
bt.set(item);
bt.data = item.app;
el.attr("tooltip", `cr:${item.app.title()}`);
item.domel = bt;
bt.onbtclick = (e) => {
e.id = this.aid;
e.data.item = item;
//e.data.item = item;
this._onappselect(e);
item.app.show();
};
this.selectedApp = item.app;
@ -182,15 +184,15 @@ namespace OS {
if (e.target === this) {
return;
}
const bt = $(e.target).closest("afx-button");
const app = bt[0].get("app");
const bt = $(e.target).closest("afx-button")[0] as any as ButtonTag;
const app = bt.data;
m.items = [
{ text: "__(Show)", dataid: "show" },
{ text: "__(Hide)", dataid: "hide" },
{ text: "__(Close)", dataid: "quit" },
];
m.onmenuselect = function (evt) {
const item = evt.data.item.get("data");
const item = evt.data.item.data;
if (app[item.dataid]) {
return app[item.dataid]();
}

7
src/core/tags/ButtonTag.ts
View File

@ -8,11 +8,12 @@ namespace OS {
export namespace tag {
export class ButtonTag extends AFXTag {
private _selected: boolean;
private _onbtclick: TagEventCallback;
private _onbtclick: TagEventCallback<JQuery.MouseEventBase>;
data: GenericObject<any>;
constructor() {
super();
}
set onbtclick(v: TagEventCallback)
set onbtclick(v: TagEventCallback<JQuery.MouseEventBase>)
{
this._onbtclick = v;
}
@ -61,7 +62,7 @@ namespace OS {
protected mount() {
$(this.refs.button).click((e) => {
const evt: TagEventType = {
const evt: TagEventType<JQuery.MouseEventBase> = {
id: this.aid,
data: e,
};

6
src/core/tags/CalendarTag.ts
View File

@ -20,7 +20,7 @@ namespace OS {
private _month: number;
private _year: number;
private _selectedDate: Date;
private _ondateselect: TagEventCallback;
private _ondateselect: TagEventCallback<Date>;
/**
*Creates an instance of CalendarTag.
@ -71,7 +71,7 @@ namespace OS {
*
* @memberof CalendarTag
*/
set ondateselect(v: TagEventCallback) {
set ondateselect(v: TagEventCallback<Date>) {
this._ondateselect = v;
}
@ -111,7 +111,7 @@ namespace OS {
* @returns {void}
* @memberof CalendarTag
*/
private dateselect(e: TagEventType): void {
private dateselect(e: TagEventType<TagEventDataType<tag.GridCellPrototype>>): void {
if (!e.data.item) {
return;
}

4
src/core/tags/ColorPickerTag.ts
View File

@ -29,7 +29,7 @@ namespace OS {
*/
export class ColorPickerTag extends AFXTag {
private _selectedColor: ColorType;
private _oncolorselect: TagEventCallback;
private _oncolorselect: TagEventCallback<ColorType>;
/**
*Creates an instance of ColorPickerTag.
@ -73,7 +73,7 @@ namespace OS {
*
* @memberof ColorPickerTag
*/
set oncolorselect(v: TagEventCallback) {
set oncolorselect(v: TagEventCallback<ColorType>) {
this._oncolorselect = v;
}

22
src/core/tags/FileViewTag.ts
View File

@ -14,8 +14,8 @@ namespace OS {
* @extends {AFXTag}
*/
export class FileViewTag extends AFXTag {
private _onfileselect: TagEventCallback;
private _onfileopen: TagEventCallback;
private _onfileselect: TagEventCallback<API.FileInfoType>;
private _onfileopen: TagEventCallback<API.FileInfoType>;
private _selectedFile: API.FileInfoType;
private _data: API.FileInfoType[];
private _path: string;
@ -72,7 +72,7 @@ namespace OS {
*
* @memberof FileViewTag
*/
set onfileselect(e: TagEventCallback) {
set onfileselect(e: TagEventCallback<API.FileInfoType>) {
this._onfileselect = e;
}
@ -81,7 +81,7 @@ namespace OS {
*
* @memberof FileViewTag
*/
set onfileopen(e: TagEventCallback) {
set onfileopen(e: TagEventCallback<API.FileInfoType>) {
this._onfileopen = e;
}
@ -248,7 +248,7 @@ namespace OS {
*
* @memberof FileViewTag
*/
set ondragndrop(v: TagEventCallback) {
set ondragndrop(v: TagEventCallback<DnDEventDataType<TreeViewTag| ListViewItemTag>>) {
(this.refs.treeview as TreeViewTag).ondragndrop = v;
(this.refs.listview as ListViewTag).ondragndrop = v;
}
@ -525,25 +525,25 @@ namespace OS {
list.dragndrop = true;
// even handles
list.onlistselect = (e) => {
this.fileselect(e.data.item.data);
this.fileselect(e.data.item.data as API.FileInfoType);
};
grid.onrowselect = (e) => {
this.fileselect(
$(e.data.item).children()[0].data
$(e.data.item).children()[0].data as API.FileInfoType
);
};
tree.ontreeselect = (e) => {
this.fileselect(e.data.item.data);
this.fileselect(e.data.item.data as API.FileInfoType);
};
// dblclick
list.onlistdbclick = (e) => {
this.filedbclick(e.data.item.data);
this.filedbclick(e.data.item.data as API.FileInfoType);
};
grid.oncelldbclick = (e) => {
this.filedbclick(e.data.item.data);
this.filedbclick(e.data.item.data as API.FileInfoType);
};
tree.ontreedbclick = (e) => {
this.filedbclick(e.data.item.data);
this.filedbclick(e.data.item.data as API.FileInfoType);
};
this.switchView();
}

34
src/core/tags/GridViewTag.ts
View File

@ -27,20 +27,20 @@ namespace OS {
protected calibrate(): void {}
protected reload(d?: any): void {}
}
export type CellEventData = TagEventDataType<GridCellPrototype>;
export abstract class GridCellPrototype extends AFXTag {
private _oncellselect: TagEventCallback;
private _oncelldbclick: TagEventCallback;
private _oncellselect: TagEventCallback<CellEventData>;
private _oncelldbclick: TagEventCallback<CellEventData>;
private _data: GenericObject<any>;
constructor() {
super();
}
set oncellselect(v: TagEventCallback) {
set oncellselect(v: TagEventCallback<CellEventData>) {
this._oncellselect = v;
}
set oncelldbclick(v: TagEventCallback) {
set oncelldbclick(v: TagEventCallback<CellEventData>) {
this._oncelldbclick = v;
}
set data(v: GenericObject<any>) {
@ -77,7 +77,7 @@ namespace OS {
protected mount(): void {
$(this).attr("class", "afx-grid-cell");
this.oncelldbclick = this.oncellselect = (
e: TagEventType
e: TagEventType<GridCellPrototype>
): void => {};
this.selected = false;
$(this).css("display", "block");
@ -91,7 +91,7 @@ namespace OS {
});
}
private cellselect(e: TagEventType, flag: boolean): void {
private cellselect(e: TagEventType<GridCellPrototype>, flag: boolean): void {
const evt = { id: this.aid, data: { item: e.data } };
if (!flag) {
return this._oncellselect(evt);
@ -128,9 +128,9 @@ namespace OS {
private _selectedRow: GridRowTag;
private _selectedRows: GridRowTag[];
private _selectedCell: GridCellPrototype;
private _oncellselect: TagEventCallback;
private _onrowselect: TagEventCallback;
private _oncelldbclick: TagEventCallback;
private _oncellselect: TagEventCallback<CellEventData>;
private _onrowselect: TagEventCallback<CellEventData>;
private _oncelldbclick: TagEventCallback<CellEventData>;
constructor() {
super();
}
@ -143,17 +143,17 @@ namespace OS {
this._selectedRow = undefined;
this._rows = [];
this._oncellselect = this._onrowselect = this._oncelldbclick = (
e: TagEventType
e: TagEventType<CellEventData>
): void => {};
}
protected reload(d?: any): void {}
set oncellselect(v: TagEventCallback) {
set oncellselect(v: TagEventCallback<CellEventData>) {
this._oncellselect = v;
}
set onrowselect(v: TagEventCallback) {
set onrowselect(v: TagEventCallback<CellEventData>) {
this._onrowselect = v;
}
set oncelldbclick(v: TagEventCallback) {
set oncelldbclick(v: TagEventCallback<CellEventData>) {
this._oncelldbclick = v;
}
set headeritem(v: string) {
@ -282,7 +282,7 @@ namespace OS {
this.push(row, true);
}
cellselect(e: TagEventType, flag: boolean): void {
cellselect(e: TagEventType<CellEventData>, flag: boolean): void {
e.id = this.aid;
// return if e.data.item is selectedCell and not flag
if (this.selectedCell) {
@ -300,7 +300,7 @@ namespace OS {
}
}
rowselect(e: TagEventType): void {
rowselect(e: TagEventType<CellEventData>): void {
if (!e.data.item) {
return;
}
@ -311,7 +311,7 @@ namespace OS {
items: [],
},
};
const row = $(e.data.item).parent()[0];
const row = $(e.data.item).parent()[0] as any as GridRowTag;
if (this.multiselect) {
if (this.selectedRows.includes(row)) {
this.selectedRows.splice(

55
src/core/tags/ListViewTag.ts
View File

@ -8,6 +8,7 @@
namespace OS {
export namespace GUI {
export namespace tag {
export type ListItemEventData = TagEventDataType<ListViewItemTag>
/**
*
*
@ -18,11 +19,11 @@ namespace OS {
*/
export abstract class ListViewItemTag extends AFXTag {
private _data: GenericObject<any>;
private _onselect: TagEventCallback;
private _onctxmenu: TagEventCallback;
private _onclick: TagEventCallback;
private _ondbclick: TagEventCallback;
private _onclose: TagEventCallback;
private _onselect: TagEventCallback<ListItemEventData>;
private _onctxmenu: TagEventCallback<ListItemEventData>;
private _onclick: TagEventCallback<ListItemEventData>;
private _ondbclick: TagEventCallback<ListItemEventData>;
private _onclose: TagEventCallback<ListItemEventData>;
/**
*Creates an instance of ListViewItemTag.
@ -56,7 +57,7 @@ namespace OS {
*
* @memberof ListViewItemTag
*/
set onitemselect(v: TagEventCallback) {
set onitemselect(v: TagEventCallback<ListViewItemTag>) {
this._onselect = v;
}
@ -83,7 +84,7 @@ namespace OS {
*
* @memberof ListViewItemTag
*/
set onctxmenu(v: TagEventCallback) {
set onctxmenu(v: TagEventCallback<ListViewItemTag>) {
this._onctxmenu = v;
}
@ -92,7 +93,7 @@ namespace OS {
*
* @memberof ListViewItemTag
*/
set onitemclick(v: TagEventCallback) {
set onitemclick(v: TagEventCallback<ListViewItemTag>) {
this._onclick = v;
}
@ -101,7 +102,7 @@ namespace OS {
*
* @memberof ListViewItemTag
*/
set onitemdbclick(v: TagEventCallback) {
set onitemdbclick(v: TagEventCallback<ListViewItemTag>) {
this._ondbclick = v;
}
@ -110,7 +111,7 @@ namespace OS {
*
* @memberof ListViewItemTag
*/
set onitemclose(v: TagEventCallback) {
set onitemclose(v: TagEventCallback<ListViewItemTag>) {
this._onclose = v;
}
@ -283,10 +284,10 @@ namespace OS {
* @extends {AFXTag}
*/
export class ListViewTag extends AFXTag {
private _onlistselect: TagEventCallback;
private _onlistdbclick: TagEventCallback;
private _ondragndrop: TagEventCallback;
private _onitemclose: (e: TagEventType) => boolean;
private _onlistselect: TagEventCallback<ListItemEventData>;
private _onlistdbclick: TagEventCallback<ListItemEventData>;
private _ondragndrop: TagEventCallback<DnDEventDataType<ListViewItemTag>>;
private _onitemclose: (e: TagEventType<ListItemEventData>) => boolean;
private _onmousedown: (e: JQuery.MouseEventBase) => void;
private _onmouseup: (e: JQuery.MouseEventBase) => void;
private _onmousemove: (e: JQuery.MouseEventBase) => void;
@ -302,9 +303,9 @@ namespace OS {
constructor() {
super();
this._onlistdbclick = this._onlistselect = this._ondragndrop = (
e: TagEventType
e: TagEventType<ListItemEventData>
) => {};
this._onitemclose = (e: TagEventType) => {
this._onitemclose = (e: TagEventType<ListItemEventData>) => {
return true;
};
this._onmousedown = this._onmouseup = this._onmousemove = (
@ -384,7 +385,7 @@ namespace OS {
*
* @memberof ListViewTag
*/
set ondragndrop(v: TagEventCallback) {
set ondragndrop(v: TagEventCallback<DnDEventDataType<ListViewItemTag>>) {
this._ondragndrop = v;
}
@ -393,7 +394,7 @@ namespace OS {
*
* @memberof ListViewTag
*/
set onlistselect(v: TagEventCallback) {
set onlistselect(v: TagEventCallback<ListItemEventData>) {
this._onlistselect = v;
}
@ -402,7 +403,7 @@ namespace OS {
*
* @memberof ListViewTag
*/
set onlistdbclick(v: TagEventCallback) {
set onlistdbclick(v: TagEventCallback<ListItemEventData>) {
this._onlistdbclick = v;
}
@ -411,7 +412,7 @@ namespace OS {
*
* @memberof ListViewTag
*/
set onitemclose(v: (e: TagEventType) => boolean) {
set onitemclose(v: (e: TagEventType<ListItemEventData>) => boolean) {
this._onitemclose = v;
}
@ -500,6 +501,7 @@ namespace OS {
for (let item of v) {
$(this.refs.btlist).show();
const bt = $("<afx-button>").appendTo(this.refs.btlist);
bt[0].uify(this.observable);
(bt[0] as ButtonTag).set(item);
}
}
@ -757,7 +759,7 @@ namespace OS {
v.selected = false;
}
this._selectedItems = [];
return (this._selectedItem = undefined);
this._selectedItem = undefined;
}
/**
@ -769,7 +771,7 @@ namespace OS {
* @returns {void}
* @memberof ListViewTag
*/
private iclick(e: TagEventType, flag: boolean): void {
private iclick(e: TagEventType<ListViewItemTag>, flag: boolean): void {
if (!e.data) {
return;
}
@ -790,8 +792,8 @@ namespace OS {
* @returns
* @memberof ListViewTag
*/
private idbclick(e: TagEventType) {
const evt = { id: this.aid, data: { item: e.data } };
private idbclick(e: TagEventType<ListViewItemTag>) {
const evt: TagEventType<ListItemEventData> = { id: this.aid, data: { item: e.data } };
this._onlistdbclick(evt);
return this.observable.trigger("listdbclick", evt);
}
@ -804,7 +806,7 @@ namespace OS {
* @returns
* @memberof ListViewTag
*/
private iselect(e: TagEventType) {
private iselect(e: TagEventType<ListViewItemTag>) {
if (!e.data) {
return;
}
@ -853,7 +855,6 @@ namespace OS {
label.set(e.data.data);
$(this.refs.mlist).hide();
}
const evt = { id: this.aid, data: edata };
this._onlistselect(evt);
return this.observable.trigger("listselect", evt);
@ -939,7 +940,7 @@ namespace OS {
* @returns {void}
* @memberof ListViewTag
*/
private iclose(e: TagEventType): void {
private iclose(e: TagEventType<ListViewItemTag>): void {
if (!e.data) {
return;
}

23
src/core/tags/MenuTag.ts
View File

@ -8,6 +8,7 @@
namespace OS {
export namespace GUI {
export namespace tag {
export type MenuEventData = TagEventDataType<MenuEntryTag>;
/**
*
*
@ -18,8 +19,8 @@ namespace OS {
*/
export abstract class MenuEntryTag extends AFXTag {
private _data: GenericObject<any>;
private _onmenuselect: TagEventCallback;
private _onchildselect: TagEventCallback;
private _onmenuselect: TagEventCallback<MenuEventData>;
private _onchildselect: TagEventCallback<MenuEventData>;
parent: MenuEntryTag;
root: MenuTag;
@ -30,7 +31,7 @@ namespace OS {
constructor() {
super();
this._onmenuselect = this._onchildselect = (
e: TagEventType
e: TagEventType<MenuEventData>
): void => {};
}
@ -48,7 +49,7 @@ namespace OS {
*
* @memberof MenuEntryTag
*/
set onmenuselect(v: TagEventCallback) {
set onmenuselect(v: TagEventCallback<MenuEventData>) {
this._onmenuselect = v;
}
@ -57,7 +58,7 @@ namespace OS {
*
* @memberof MenuEntryTag
*/
set onchildselect(v: TagEventCallback) {
set onchildselect(v: TagEventCallback<MenuEventData>) {
this._onchildselect = v;
}
@ -67,7 +68,7 @@ namespace OS {
* @type {TagEventCallback}
* @memberof MenuEntryTag
*/
get onchildselect(): TagEventCallback {
get onchildselect(): TagEventCallback<MenuEventData> {
return this._onchildselect;
}
/**
@ -462,7 +463,7 @@ namespace OS {
parent: MenuEntryTag;
root: MenuTag;
pid: number;
private _onmenuselect: TagEventCallback;
private _onmenuselect: TagEventCallback<MenuEventData>;
private _items: GenericObject<any>[];
/**
@ -483,7 +484,7 @@ namespace OS {
this.contentag = "afx-menu-entry";
this.context = false;
this._items = [];
this._onmenuselect = (e: TagEventType): void => {};
this._onmenuselect = (e: TagEventType<MenuEventData>): void => {};
}
/**
@ -554,7 +555,7 @@ namespace OS {
*
* @memberof MenuTag
*/
set onmenuselect(v: TagEventCallback) {
set onmenuselect(v: TagEventCallback<MenuEventData>) {
this._onmenuselect = v;
}
@ -584,7 +585,7 @@ namespace OS {
* @type {TagEventCallback}
* @memberof MenuTag
*/
get onmenuitemselect(): TagEventCallback {
get onmenuitemselect(): TagEventCallback<MenuEventData> {
return this.handleselect;
}
@ -595,7 +596,7 @@ namespace OS {
* @param {TagEventType} e
* @memberof MenuTag
*/
private handleselect(e: TagEventType): void {
private handleselect(e: TagEventType<MenuEventData>): void {
if (this.context) {
$(this).hide();
}

4
src/core/tags/NSpinnerTag.ts
View File

@ -15,7 +15,7 @@ namespace OS {
* @extends {AFXTag}
*/
export class NSpinnerTag extends AFXTag {
private _onchange: TagEventCallback;
private _onchange: TagEventCallback<number>;
private _value: number;
step: number;
@ -50,7 +50,7 @@ namespace OS {
*
* @memberof NSpinnerTag
*/
set onvaluechange(f: TagEventCallback) {
set onvaluechange(f: TagEventCallback<number>) {
this._onchange = f;
}

8
src/core/tags/SliderTag.ts
View File

@ -15,8 +15,8 @@ namespace OS {
class SliderTag extends AFXTag {
private _max: number;
private _value: number;
private _onchange: TagEventCallback;
private _onchanging: TagEventCallback;
private _onchange: TagEventCallback<number>;
private _onchanging: TagEventCallback<number>;
/**
*Creates an instance of SliderTag.
@ -53,7 +53,7 @@ namespace OS {
*
* @memberof SliderTag
*/
set onvaluechange(f: TagEventCallback) {
set onvaluechange(f: TagEventCallback<number>) {
this._onchange = f;
}
@ -62,7 +62,7 @@ namespace OS {
*
* @memberof SliderTag
*/
set onvaluechanging(f: TagEventCallback) {
set onvaluechanging(f: TagEventCallback<number>) {
this._onchanging = f;
}

6
src/core/tags/SwitchTag.ts
View File

@ -7,8 +7,8 @@ namespace OS {
export namespace GUI {
export namespace tag {
export class SwitchTag extends AFXTag {
private _onchange: TagEventCallback;
private _onchanging: TagEventCallback;
private _onchange: TagEventCallback<boolean>;
private _onchanging: TagEventCallback<boolean>;
constructor() {
super();
@ -34,7 +34,7 @@ namespace OS {
return this.hasattr("enable");
}
set onswchange(v: TagEventCallback) {
set onswchange(v: TagEventCallback<boolean>) {
this._onchange = v;
}

10
src/core/tags/TabBarTag.ts
View File

@ -7,7 +7,7 @@
namespace OS {
export namespace GUI {
export namespace tag {
type TabEventData = TagEventDataType<ListViewItemTag>;
/**
*
*
@ -17,8 +17,8 @@ namespace OS {
*/
export class TabBarTag extends AFXTag {
private _selected: number;
private _ontabclose: (e: TagEventType) => boolean;
private _ontabselect: TagEventCallback;
private _ontabclose: (e: TagEventType<TabEventData>) => boolean;
private _ontabselect: TagEventCallback<TabEventData>;
/**
*Creates an instance of TabBarTag.
@ -146,7 +146,7 @@ namespace OS {
*
* @memberof TabBarTag
*/
set ontabclose(v: (e: TagEventType) => boolean) {
set ontabclose(v: (e: TagEventType<TabEventData>) => boolean) {
this._ontabclose = v;
}
@ -155,7 +155,7 @@ namespace OS {
*
* @memberof TabBarTag
*/
set ontabselect(v: TagEventCallback) {
set ontabselect(v: TagEventCallback<TabEventData>) {
this._ontabselect = v;
}

44
src/core/tags/TabContainerTag.ts
View File

@ -19,7 +19,7 @@ namespace OS {
*/
export class TabContainerTag extends AFXTag {
private _selectedTab: TabContainerTabType;
private _ontabselect: TagEventCallback;
private _ontabselect: TagEventCallback<TabContainerTabType>;
/**
*Creates an instance of TabContainerTag.
@ -27,7 +27,6 @@ namespace OS {
*/
constructor() {
super();
this.dir = "column"; // or row
this._ontabselect = (e) => {};
}
@ -38,7 +37,9 @@ namespace OS {
* @protected
* @memberof TabContainerTag
*/
protected init(): void {}
protected init(): void {
this.dir = "column"; // or row
}
/**
*
@ -54,7 +55,7 @@ namespace OS {
*
* @memberof TabContainerTag
*/
set ontabselect(f: TagEventCallback) {
set ontabselect(f: TagEventCallback<TabContainerTabType>) {
this._ontabselect = f;
}
@ -145,22 +146,25 @@ namespace OS {
this.selectedTab = data;
return this._ontabselect({ data: data, id: this.aid });
};
$(this.children).each((i, e) => {
const item = {} as GenericObject<any>;
if ($(e).attr("tabname")) {
item.text = $(e).attr("tabname");
}
if ($(e).attr("icon")) {
item.icon = $(e).attr("icon");
}
if ($(e).attr("iconclass")) {
item.iconclass = $(e).attr("iconclass");
}
item.container = e;
$(e).css("width", "100%").css("height", "100%");
const el = (this.refs.bar as TabBarTag).push(item);
el.selected = true;
});
this.observable.one("mounted", (id)=>{
$(this.refs.yield).children().each((i, e) => {
const item = {} as GenericObject<any>;
if ($(e).attr("tabname")) {
item.text = $(e).attr("tabname");
}
if ($(e).attr("icon")) {
item.icon = $(e).attr("icon");
}
if ($(e).attr("iconclass")) {
item.iconclass = $(e).attr("iconclass");
}
item.container = e;
$(e).css("width", "100%").css("height", "100%").hide();
const el = (this.refs.bar as TabBarTag).push(item);
el.selected = true;
});
})
this.observable.on("resize", (e) => this.calibrate());
this.calibrate();
}

18
src/core/tags/TreeViewTag.ts
View File

@ -21,7 +21,7 @@ namespace OS {
selected?: boolean;
[propName: string]: any;
}
export type TreeItemEventData = TagEventDataType<TreeViewItemPrototype>;
/**
*
*
@ -31,7 +31,7 @@ namespace OS {
export abstract class TreeViewItemPrototype extends AFXTag {
private _data: TreeViewDataType;
private _indent: number;
private _evt: TagEventType;
private _evt: TagEventType<TreeItemEventData>;
treeroot: TreeViewTag;
treepath: string;
parent: TreeViewTag;
@ -418,9 +418,9 @@ namespace OS {
*/
export class TreeViewTag extends AFXTag {
private _selectedItem: TreeViewItemPrototype;
private _ontreeselect: TagEventCallback;
private _ontreedbclick: TagEventCallback;
private _ondragndrop: TagEventCallback;
private _ontreeselect: TagEventCallback<TreeItemEventData>;
private _ontreedbclick: TagEventCallback<TreeItemEventData>;
private _ondragndrop: TagEventCallback<DnDEventDataType<TreeViewTag>>;
private _data: TreeViewDataType;
private _treemousedown: (e: JQuery.MouseEventBase) => void;
private _treemouseup: (e: JQuery.MouseEventBase) => void;
@ -504,7 +504,7 @@ namespace OS {
*
* @memberof TreeViewTag
*/
set ontreeselect(v: TagEventCallback) {
set ontreeselect(v: TagEventCallback<TreeItemEventData>) {
this._ontreeselect = v;
}
@ -513,7 +513,7 @@ namespace OS {
*
* @memberof TreeViewTag
*/
set ontreedbclick(v: TagEventCallback) {
set ontreedbclick(v: TagEventCallback<TreeItemEventData>) {
this._ontreedbclick = v;
}
@ -605,7 +605,7 @@ namespace OS {
* @returns {void}
* @memberof TreeViewTag
*/
itemclick(e: TagEventType): void {
itemclick(e: TagEventType<TreeItemEventData>): void {
if (!e || !e.data) {
return;
}
@ -656,7 +656,7 @@ namespace OS {
*
* @memberof TreeViewTag
*/
set ondragndrop(v: TagEventCallback) {
set ondragndrop(v: TagEventCallback<DnDEventDataType<TreeViewTag>>) {
this._ondragndrop = v;
}

22
src/core/tags/tag.ts
View File

@ -9,7 +9,7 @@ interface HTMLElement {
contextmenuHandle(e: JQuery.MouseEventBase, m: OS.GUI.tag.MenuTag): void;
sync(): void;
afxml(o: OS.API.Announcer): void;
uify(o: OS.API.Announcer): void;
uify(o: OS.API.Announcer, flag?: boolean): void;
mozRequestFullScreen: any;
webkitRequestFullscreen: any;
msRequestFullscreen: any;
@ -32,12 +32,21 @@ namespace OS {
width?: number;
height?: number;
}
export interface TagEventType {
export interface TagEventDataType<T> {
item?: T,
[propName:string]: any;
}
export interface TagEventType<T>{
id: number | string;
data: any;
data: T;
}
export type TagEventCallback = (e: TagEventType) => void;
export interface DnDEventDataType<T> {
from: T;
to: T;
}
export type TagEventCallback<T> = (e: TagEventType<T>) => void;
export var zindex: number = 10;
export abstract class AFXTag extends HTMLElement {
@ -91,7 +100,6 @@ namespace OS {
return;
}
this._mounted = true;
// reflect attributes
this.mount();
super.sync();
}
@ -221,9 +229,11 @@ namespace OS {
return this.afxml(o);
});
}
HTMLElement.prototype.uify = function(o: API.Announcer): void {
HTMLElement.prototype.uify = function(o: API.Announcer, toplevel?: boolean): void {
this.afxml(o);
this.sync();
if(o && toplevel)
o.trigger("mounted", this.aid);
}
export namespace tag {

12
src/core/vfs.ts
View File

@ -134,6 +134,7 @@ namespace OS {
basename: string;
info: FileInfoType;
ext: string;
type: string;
/**
*Creates an instance of BaseFileHandle.
* @param {string} path
@ -187,13 +188,22 @@ namespace OS {
* @returns {string}
* @memberof BaseFileHandle
*/
filename(): string {
get filename(): string {
if (!this.basename) {
return "Untitled";
}
return this.basename;
}
/**
*
*
* @memberof BaseFileHandle
*/
set filename(v: string)
{
this.basename = v;
}
/**
*
*