x4js 1.4.20 → 1.4.24

package/src/button.ts

@@ -31,6 +31,7 @@
 import { Component, CProps, CEventMap, HtmlString } from './component'
 import { EventCallback, EvClick, EvChange } from './x4events'
 
+import { Action } from './action'
 import { Icon, IconID } from './icon'
 import { Label } from './label'
 import { Menu, MenuItem, MenuOrSep } from './menu'
@@ -57,8 +58,9 @@ interface ButtonProps<E extends ButtonEventMap = ButtonEventMap> extends CProps<
 	align?: 'center' | 'left' | 'right';	// text alignment
 	autoRepeat?: number; // time in ms or 0/undefined for none
 	menu?: MenuOrSep[] | MenuCallBack;
-
 	click?: EventCallback<EvClick>;	// shortcut to events: { click: ... }
+
+	action?: Action;
 }
 
 
@@ -83,11 +85,26 @@ export class BaseButton<P extends ButtonProps = ButtonProps, E extends ButtonEve
 
 	render(props: ButtonProps) {
 
-		let icon = props.icon ? new Icon({ icon: props.icon, cls: 'left', ref: 'l_icon' }) : null;
-		let label = new Label({ flex: 1, text: props.text ?? '', align: props.align, ref: 'label' });
-		let ricon = props.rightIcon ? new Icon({ icon: props.rightIcon, cls: 'right', ref: 'r_icon' }) : null;
+		const action = props.action;
+		
+		let icon = props.icon;
+		let text = props.text;
+		
+		if( action ) {
+			if( !icon && action.props.icon ) {
+				icon = action.props.icon;
+			}
+
+			if( text===undefined && action.props.text ) {
+				text = action.props.text;
+			}
+		}
 
-		this.setContent([icon, label, ricon]);
+		const ui_icon = icon ? new Icon({ icon, cls: 'left', ref: 'l_icon' }) : null;
+		const ui_label = new Label({ flex: 1, text: text ?? '', align: props.align, ref: 'label' });
+		const ui_ricon = props.rightIcon ? new Icon({ icon: props.rightIcon, cls: 'right', ref: 'r_icon' }) : null;
+
+		this.setContent([ui_icon, ui_label, ui_ricon]);
 		this._setTabIndex(props.tabIndex);
 	}
 
@@ -164,6 +181,9 @@ export class BaseButton<P extends ButtonProps = ButtonProps, E extends ButtonEve
 		}
 		else {
 			this.emit('click', EvClick());
+			if( this.m_props.action ) {
+				this.m_props.action.fire( );
+			}
 		}
 	}
 

package/src/component.ts

@@ -41,6 +41,7 @@ import { _tr } from './i18n';
 import { BasicEvent, EventCallback } from './x4events';
 import { BaseComponent, BaseComponentProps, BaseComponentEventMap } from './base_component';
 import { IDOMEvents, X4ElementEventMap } from './dom_events';
+import { IconID } from 'x4js';
 
 export { HtmlString, isHtmlString, html } from './tools'
 
@@ -1143,15 +1144,6 @@ export class Component<P extends CProps<BaseComponentEventMap> = CProps<BaseComp
 		}
 	}
 
-	public mapPropEvents<N extends keyof E>(props: P, ...elements: N[] ) {
-		elements.forEach( name => {
-			const n = name as string;
-			if (props[n]) {
-				this._on(n, props[n]);
-			}
-		})
-	}
-
 	/**
 	 * 
 	 * @param name 
@@ -2333,4 +2325,6 @@ export class Container<P extends ContainerProps = ContainerProps, E extends Cont
 	}
 }
 
-export type ComponentConstructor<T> = new (props: CProps) => T;
+export type ComponentConstructor<T> = new (props: CProps) => T;
+
+

package/src/icon.ts

@@ -100,10 +100,15 @@ class Loader extends EventSource<LoadingEventMap> {
 					const r = await fetch( url );
 					if( r.ok ) {
 						const svg = await r.text();
-						this.svgs.set( url, svg );
-
-						//console.log( 'signal=', url );
-						this.signal( 'loaded', EvLoaded(url,svg) );
+						// check response, must be svg
+						if( !svg.startsWith("<svg") ) {
+							console.error( "svg loading error: ", svg );
+							this.signal( 'loaded', EvLoaded(url,"") );
+						}
+						else {
+							this.svgs.set( url, svg );
+							this.signal( 'loaded', EvLoaded(url,svg) );
+						}
 					}
 				}
 			}

package/src/menu.ts

@@ -32,6 +32,8 @@ import { x4document } from './x4dom'
 import { CEventMap, Component, CProps } from './component'
 import { EvClick, EventCallback } from './x4events'
 
+import { Action } from './action'
+
 import { Popup, PopupProps } from './popup'
 import { Icon, IconID } from './icon'
 import { Label } from './label'
@@ -244,8 +246,9 @@ export interface MenuItemProps extends CProps {
 	items?: MenuOrSep[];
 	checked?: boolean;
 	cls?: string;
-
 	click?: EventCallback<EvClick>;	// shortcut to events: { click ... }
+	
+	action?: Action;
 }
 
 
@@ -254,12 +257,21 @@ export class MenuItem extends Component<MenuItemProps, MenuItemEventMap> {
 
 	private m_menu: Menu;
 	private m_isOpen: boolean;
+	private m_action: Action;
 
+	constructor( action: Action );
 	constructor( text: string, click: EventCallback<EvClick> );
 	constructor( props: MenuItemProps);
 	constructor( a, b? ) {
 
-		if( isString(a) ) {
+		if( a instanceof Action ) {
+			super( {
+				click: ( ) => { a.fire(); }
+			});
+
+			this.m_action = a;
+		}
+		else if( isString(a) ) {
 			super( {
 				text: a,
 				click: b
@@ -288,6 +300,16 @@ export class MenuItem extends Component<MenuItemProps, MenuItemEventMap> {
 			icon = props.checked ? 'cls(far fa-check)' : 0;	//todo: use stylesheet
 		}
 
+		if( this.m_action ) {
+			if( !icon ) {
+				icon = this.m_action.props.icon;
+			}
+
+			if( text===undefined ) {
+				text = this.m_action.props.text;
+			}
+		}
+
 		let popIco = null;
 		if (this.isPopup) {
 			this.addClass('@popup-menu-item');

package/src/settings.ts

@@ -27,8 +27,6 @@
 * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 **/
 
-import { host } from './hosts/host';
-
 export class Settings {
 
 	private m_data: any;
@@ -52,7 +50,7 @@ export class Settings {
 
 	private _save( ) {
 		let data = JSON.stringify(this.m_data);
-		host.writeLocalStorage( this.m_name, data );
+		localStorage.setItem( this.m_name, data );
 	}
 
 	private _load( ) {
@@ -62,7 +60,7 @@ export class Settings {
 
 		this.m_data = {};
 
-		let data = host.readLocalStorage( this.m_name );
+		let data = localStorage.getItem( this.m_name );
 		if( data!==null ) {
 			data = JSON.parse( data );
 			if( data ) {

package/tsconfig.json

@@ -13,8 +13,6 @@
 		"./src/*",
 	],
 	"exclude": [
-		"src/hosts/nwjs_types.ts",
-		"src/hosts/nwjs.ts",
 		"src/texthiliter.ts",
 		"src/smartedit.ts"
 	],

package/src/hosts/electron.ts

@@ -1,164 +0,0 @@
-/**
-* @file host/electron.ts
-* @author Etienne Cochard 
-* @license
-* Copyright (c) 2019-2021 R-libre ingenierie
-*
-* This program is free software; you can redistribute it and/or modify
-* it under the terms of the GNU General Public License as published by
-* the Free Software Foundation; either version 3 of the License, or
-* (at your option) any later version.
-*
-* This program is distributed in the hope that it will be useful,
-* but WITHOUT ANY WARRANTY; without even the implied warranty of
-* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-* GNU General Public License for more details.
-*
-* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
-**/
-
-import { x4document } from '../dom-gen'
-import { FileStat, PathType, PartType, Host } from './host'
-
-export * from './host';
-
-declare const require;
-declare const host_require;
-
-if( !globalThis.host_require ) {
-	globalThis.host_require = require;
-}
-
-export const fs 		= host_require( 'fs' );
-export const process 	= host_require( 'process' );
-export const electron  	= host_require( 'electron' );
-export const path  		= host_require( 'path' );
-
-//import * as path from 'node:path';	
-
-export class ElectronHost extends Host {
-
-	makePath( ...els: string[] ) {
-		return path.join( ...els );
-	}
-
-	readBinary( path: string ): Promise<Uint8Array> {
-		return new Promise( ( resolve, reject ) => {
-			fs.readFile( path, ( err, buff ) => {
-				if( err ) { reject( err ); }
-				else { resolve( buff ); }
-			} );
-		} );
-	}
-
-	writeBinary( path: string, data: Uint8Array ): Promise<boolean> {
-		return new Promise( ( resolve, reject ) => {
-			fs.writeFile( path, data, ( err ) => {
-				if( err ) { reject(err); }
-				else { resolve( true ); }
-			} );
-		} );
-	}
-
-	readUtf8( path: string ): Promise<string> {
-		return new Promise( ( resolve, reject ) => {
-			fs.readFile( path, { encoding: 'utf8' }, ( err, buff ) => {
-				if( err ) { reject( err ); }
-				else { resolve( buff.toString() ); }
-			} );
-		} );
-	}
-
-	writeUtf8( path: string, data: string ): Promise<boolean> {
-		return new Promise( ( resolve, reject ) => {
-			fs.writeFile( path, data, {encoding: 'utf8'}, ( err ) => {
-				if( err ) { reject(err); }
-				else { resolve( true ); }
-			} );
-		} );
-	}
-
-	compress( data: Uint8Array ): Promise<Uint8Array> {
-		return new Promise( (resolve, reject ) => {
-			let zlib = this.require('zlib');
-			zlib.gzip( data, ( err, Uint8Array ) => {
-				if( err ) { reject( err); }
-				else { resolve( Uint8Array); }
-			} );
-		} );
-	}
-
-	decompress( data: Uint8Array ): Promise<Uint8Array> {
-		return new Promise( (resolve, reject ) => {
-			let zlib = this.require('zlib');
-			zlib.gunzip( data, ( err, Uint8Array ) => {
-				if( err ) { reject( err); }
-				else { resolve( Uint8Array); }
-			} );
-		} );
-	}
-
-	readLocalStorage( name: string ): string {
-		return localStorage.getItem( name );
-	}
-
-	writeLocalStorage( name: string, data: string ): void {
-		localStorage.setItem( name, data );
-	}
-
-	stat( name: string ): FileStat {
-		let stat = fs.statSync( name );
-		if( !stat ) {
-			return null;
-		}
-
-		return {
-			atime: stat.atimeMs,
-			isDir: stat.isDirectory()
-		}
-	}
-
-	readDir( path: string ): Promise<string[]> {
-		return new Promise( ( resolve, reject ) => {
-			fs.readdir( path, ( err, files ) => {
-				if( err ) { reject(err); }
-				else { resolve(files); }
-			});		
-		});
-	}	
-
-	require( name: string ): any {
-		return host_require( name );
-	} 
-
-	cwd( ): string {
-		return process.cwd( );
-	}
-
-	get ipc( ) {
-		return electron.ipcRenderer;
-	}
-
-	getPath( type: PathType ) : string {
-		return this.ipc.sendSync( 'getPath', type );
-	}
-
-	getPathPart( pth: string, type: PartType ) : string {
-	
-		let els = path.parse( pth );
-		switch ( type ) {
-			case 'dirname': return els.dir;
-			case 'basename': return els.base;
-			case 'filename': return els.name;
-			case 'extname': return els.ext;
-		}
-		
-		return '';
-	}
-
-	createCanvas = ( ) => {
-		return x4document.createElement('canvas');
-	}
-}
-
-new ElectronHost( );

package/src/hosts/host.ts

@@ -1,100 +0,0 @@
-/**
-* @file host.ts
-* @author Etienne Cochard 
-* @license
-* Copyright (c) 2019-2021 R-libre ingenierie
-*
-* This program is free software; you can redistribute it and/or modify
-* it under the terms of the GNU General Public License as published by
-* the Free Software Foundation; either version 3 of the License, or
-* (at your option) any later version.
-*
-* This program is distributed in the hope that it will be useful,
-* but WITHOUT ANY WARRANTY; without even the implied warranty of
-* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-* GNU General Public License for more details.
-*
-* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
-**/
-
-export interface FileStat {
-	atime: number;
-	isDir: boolean;
-}
-
-export type PathType = 'home' | 'appData' | 'userData' | 'cache' | 'temp' | 'exe' | 'desktop' | 'documents' | 'downloads' | 'music'
-						| 'pictures'| 'videos' | 'recent' | 'logs' | 'crashDumps';
-
-export type PartType = 'filename' | 'extname' | 'basename' | 'dirname';
-
-export abstract class Host {
-
-	constructor( ) {
-		host = this;
-	}
-
-	makePath( ...els: string[] ) {
-		return els.join( '/' );
-	}
-
-	readBinary( path: string ): Promise<Uint8Array> {
-		return Promise.reject( 'not imp' );	
-	}
-
-	writeBinary( path: string, data: Uint8Array ): Promise<boolean> {
-		return Promise.reject( 'not imp' );
-	}
-
-	readUtf8( path: string ): Promise<string> {
-		return Promise.reject( 'not imp' );
-	}
-
-	writeUtf8( path: string, data: string ): Promise<boolean> {
-		return Promise.reject( 'not imp' );
-	}
-
-	compress( data: Uint8Array ): Promise<Uint8Array> {
-		return Promise.reject( 'not imp' );
-	}
-
-	decompress( data: Uint8Array ): Promise<Uint8Array> {
-		return Promise.reject( 'not imp' );
-	}
-
-	readLocalStorage( name: string ): string {
-		return localStorage.getItem( name );
-	}
-
-	writeLocalStorage( name: string, data: string ): void {
-		localStorage.setItem( name, data );
-	}
-
-	stat( name: string ): FileStat {
-		throw 'not imp';
-	}
-
-	readDir( path: string ): Promise<string[]> {
-		throw 'not imp';
-	}
-
-	require( name: string ): any {
-		throw 'not imp';
-	}
-
-	cwd( ): string {
-		throw 'not imp';
-	}
-
-	getPath( type: PathType ) : string {
-		throw 'not imp';
-	}
-
-	getPathPart( path: string, type: PartType ) : string {
-		throw 'not imp';
-	}
-
-	abstract createCanvas( );
-}
-
-
-export let host: Host = null;

package/src/hosts/nwjs.ts

@@ -1,141 +0,0 @@
-/**
-* @file host/nwjs.ts
-* @author Etienne Cochard 
-* @license
-* Copyright (c) 2019-2021 R-libre ingenierie
-*
-* This program is free software; you can redistribute it and/or modify
-* it under the terms of the GNU General Public License as published by
-* the Free Software Foundation; either version 3 of the License, or
-* (at your option) any later version.
-*
-* This program is distributed in the hope that it will be useful,
-* but WITHOUT ANY WARRANTY; without even the implied warranty of
-* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-* GNU General Public License for more details.
-*
-* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
-**/
-
-import { FileStat, PathType, Host } from './host'
-
-export * from './host';
-
-// to deal with amd modules (that are not comletely compatible with nodejs)
-// globalThis.node_require must be set to require BEFORE polyfill code of amd module.
-// ie. globalThis.node_require = require;
-
-declare const host_require;
-if( !globalThis.host_require ) {
-	globalThis.host_require = require;
-}
-
-const fs = host_require( 'fs' );
-const process = host_require( 'process' );
-const path  	= host_require( 'path' );
-
-
-
-export class NWJSHost implements Host {
-
-	makePath( ...els: string[] ) {
-		return path.join( ...els );
-	}
-
-	readBinary( path: string ): Promise<Uint8Array> {
-		return new Promise( ( resolve, reject ) => {
-			fs.readFile( path, ( err, buff ) => {
-				if( err ) { reject( err ); }
-				else { resolve( buff ); }
-			} );
-		} );
-	}
-
-	writeBinary( path: string, data: Uint8Array ): Promise<boolean> {
-		return new Promise( ( resolve, reject ) => {
-			fs.writeFile( path, data, ( err ) => {
-				if( err ) { reject(err); }
-				else { resolve( true ); }
-			} );
-		} );
-	}
-
-	readUtf8( path: string ): Promise<string> {
-		return new Promise( ( resolve, reject ) => {
-			fs.readFile( path, { encoding: 'utf8' }, ( err, buff ) => {
-				if( err ) { reject( err ); }
-				else { resolve( buff.toString() ); }
-			} );
-		} );
-	}
-
-	writeUtf8( path: string, data: string ): Promise<boolean> {
-		return new Promise( ( resolve, reject ) => {
-			fs.writeFile( path, data, {encoding: 'utf8'}, ( err ) => {
-				if( err ) { reject(err); }
-				else { resolve( true ); }
-			} );
-		} );
-	}
-
-	compress( data: Uint8Array ): Promise<Uint8Array> {
-		return new Promise( (resolve, reject ) => {
-			let zlib = host_require('zlib');
-			zlib.gzip( data, ( err, Uint8Array ) => {
-				if( err ) { reject( err); }
-				else { resolve( Uint8Array); }
-			} );
-		} );
-	}
-
-	decompress( data: Uint8Array ): Promise<Uint8Array> {
-		return new Promise( (resolve, reject ) => {
-			let zlib = host_require('zlib');
-			zlib.gunzip( data, ( err, Uint8Array ) => {
-				if( err ) { reject( err); }
-				else { resolve( Uint8Array); }
-			} );
-		} );
-	}
-
-	readLocalStorage( name: string ): string {
-		return localStorage.getItem( name );
-	}
-
-	writeLocalStorage( name: string, data: string ): void {
-		localStorage.setItem( name, data );
-	}
-
-	stat( name: string ): FileStat {
-		let stat = fs.statSync( name );
-		if( !stat ) {
-			return null;
-		}
-
-		return {
-			atime: stat.atimeMs
-		}
-	}
-
-	readDir( path: string ): Promise<string[]> {
-		return new Promise( ( resolve, reject ) => {
-			fs.readdir( path, ( err, files ) => {
-				if( err ) { reject(err); }
-				else { resolve(files); }
-			});		
-		});
-	}	
-
-	require( name: string ): any {
-		// your amd module must define window.node_require = require;
-		return host_require( name );
-	} 
-
-	cwd( ): string {
-		return process.cwd( );
-	}
-
-	getPath( type: PathType ) : string {
-		throw 'not imp';
-	}
-}