x4js 2.0.2 → 2.0.3

package/lib/src/core/core_tools.ts

@@ -1,673 +0,0 @@
-/** 
- *  ___  ___ __
- *  \  \/  /  / _
- *   \    /  /_| |_
- *   /    \____   _|  
- *  /__/\__\   |_|
- * 
- * @file core_tools.ts
- * @author Etienne Cochard 
- * 
- * @copyright (c) 2024 R-libre ingenierie
- *
- * Use of this source code is governed by an MIT-style license 
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
- **/
-
-import { _tr } from "./core_i18n.js";
-
-/**
- * @returns true if object is a string
- */
-export function isString(val: any): val is string {
-	return typeof val === 'string';
-}
-
-/**
- * @returns true if object is a number
- */
-
-export function isNumber( v: any ): v is number {
-	return typeof v === 'number' && isFinite(v);
-}
-
-/**
- * @returns true if object is an array
- */
-export function isArray(val: any): val is any[] {
-	return val instanceof Array;
-}
-
-/**
- * @returns true if object is a function
- */
-
-export function isFunction(val: any): val is Function {
-	return val instanceof Function;
-}
-
-/**
- * generic constructor
- */
-
-export type Constructor<P> = {
-	new(...params: any[]): P;
-};
-
-
-/**
- * a way to explain that the given string may be unsafe but must be treated a sstring
- * @example
- * label.setText( unsafehtml`<b>Bold</b> text` );
- * label.setText( new UnsafeHtml("<b>Bold</b> text`" ) );
- */
-
-export class UnsafeHtml extends String {
-	constructor( value: string ) {
-		super( value );
-	}
-}
-
-export function unsafeHtml( x: string ): UnsafeHtml {
-	return new UnsafeHtml( x );
-}
-
-/**
- * 
- */
-
-export function clamp<T>( v: T, min: T, max: T ) : T {
-	if( v<min ) { return min; }
-	if( v>max ) { return max; }
-	return v;
-}
-
-
-/**
- * generic Rectangle 
- */
-
-export interface IRect {
-	left: number;
-    top: number;
-    height: number;
-    width: number;
-}
-
-/**
- * 
- */
-
-export class Rect implements IRect {
-	left: number;
-	top: number;
-	height: number;
-	width: number;
-
-	constructor( );
-	constructor( l: number, t: number, w: number, h: number );
-	constructor( l: Rect );
-	constructor( l?: number | IRect, t?: number, w?: number, h?: number ) {
-		if( l!==undefined ) {
-			if( isNumber( l ) ) {
-				this.left = l;
-				this.top = t;
-				this.width = w;
-				this.height = h;
-			}
-			else {
-				Object.assign( this, l );
-			}
-		}
-	}
-	
-	get right( ) {
-		return this.left+this.width; 
-	}
-
-	get bottom( ) {
-		return this.top+this.height;
-	}
-}
-
-
-/**
- * generic Point
- */
-
-export interface Point {
-	x: number;
-	y: number;
-}
-
-/**
- * 
- */
-
-export interface IComponentInterface {
-}
-
-// form-element
-export interface IFormElement extends IComponentInterface {
-	getRawValue( ): any;
-	setRawValue( v: any ): void;
-}
-
-/**
- * 
- */
-
-interface Features {
-	eyedropper: 1,
-}
-
-export function isFeatureAvailable( name: keyof Features ): boolean {
-	switch( name ) {
-		case "eyedropper": return "EyeDropper" in window;
-	}
-
-	return false;
-}
-
-export class Timer {
-	
-	protected _timers: Map<string,any>;
-	
-	/**
-	 * 
-	 */
-
-	setTimeout( name: string, time: number, callback: Function ) {
-		if( !this._timers ) {
-			this._timers = new Map( );
-		}
-		else {
-			this.clearTimeout( name );
-		}
-
-		const tm = setTimeout( callback, time );
-		this._timers.set( name, tm );
-
-		return tm;
-	}
-
-	clearTimeout( name: string ) {
-		if( this._timers && this._timers.has(name) ) {
-			clearTimeout( this._timers.get(name) );
-			this._timers.delete( name );
-		}
-	}
-
-	/**
-	 * 
-	 */
-
-	setInterval( name: string, time: number, callback: Function ) {
-		if( !this._timers ) {
-			this._timers = new Map( );
-		}
-		else {
-			this.clearInterval( name );
-		}
-
-		const tm = setInterval( callback, time );
-		this._timers.set( name, tm );
-
-		return tm;
-	}
-
-	clearInterval( name: string ) {
-		if( this._timers && this._timers.has(name) ) {
-			clearInterval( this._timers.get(name) );
-			this._timers.delete( name );
-		}
-	}
-
-	clearAllTimeouts( ) {
-		this._timers?.forEach( t => {
-			clearTimeout( t );
-		} );
-
-		this._timers = null;
-	}
-}
-
-/**
- * 
- */
-
-export function asap( callback: ( ) => void ) {
-	return requestAnimationFrame( callback );
-}
-
-
-// :: STRING UTILS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
-
-
-/**
- * prepend 0 to a value to a given length
- * @param value 
- * @param length 
- */
-
-export function pad(what: any, size: number, ch: string = '0') {
-
-	let value: string;
-
-	if (!isString(what)) {
-		value = '' + what;
-	}
-	else {
-		value = what;
-	}
-
-	if (size > 0) {
-		return value.padEnd(size, ch);
-	}
-	else {
-		return value.padStart(-size, ch);
-	}
-}
-
-/**
- * replace {0..9} by given arguments
- * @param format string
- * @param args 
- * 
- * @example ```ts
- * 
- * console.log( sprintf( 'here is arg 1 {1} and arg 0 {0}', 'argument 0', 'argument 1' ) )
- */
-
-export function sprintf( format: string, ...args:any[] ) {
-	return format.replace(/{(\d+)}/g, function (match, index) {
-		return typeof args[index] != 'undefined' ? args[index] : match;
-	});
-}
-
-/**
- * inverse of camel case
- * theThingToCase -> the-thing-to-case
- * @param {String} str 
- */
-
-export function pascalCase(string: string): string {
-
-	let result = string;
-
-	result = result.replace(/([a-z])([A-Z])/g, "$1 $2");
-	result = result.toLowerCase();
-	result = result.replace(/[^- a-z0-9]+/g, ' ');
-
-	if (result.indexOf(' ') < 0) {
-		return result;
-	}
-
-	result = result.trim();
-	return result.replace(/ /g, '-');
-}
-
-export function camelCase( text: string ) {
-	let result = text.toLowerCase( );
-	result = result.replace( /[^a-zA-Z0-9]+(.)/g, (m,chr) => {
-		return chr.toUpperCase();
-	} );
-	return result;
-}
-
-// :: DATES ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
-
-let cur_locale: string = 'fr-FR';
-
-/**
- * change the current locale for misc translations (date...)
- * @param locale 
- */
-
-export function _date_set_locale(locale: string) {
-	cur_locale = locale;
-}
-
-/**
- * 
- * @param date 
- * @param options 
- * @example
- * let date = new Date( );
- * let options = { day: 'numeric', month: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric' };
- * let text = date_format( date, options );
- */
-
-export function date_format(date: Date, options?: any): string {
-	//return new Intl.DateTimeFormat(cur_locale, options).format( date );
-	return formatIntlDate(date);
-}
-
-/**
- * 
- * @param date 
- * @param options 
- */
-
-export function date_diff(date1: Date, date2: Date, options?: any): string {
-
-	var dt = (date1.getTime() - date2.getTime()) / 1000;
-
-	// seconds
-	let sec = dt;
-	if (sec < 60) {
-		return sprintf(_tr.global.diff_date_seconds, Math.round(sec));
-	}
-
-	// minutes
-	let min = Math.floor(sec / 60);
-	if (min < 60) {
-		return sprintf(_tr.global.diff_date_minutes, Math.round(min));
-	}
-
-	// hours
-	let hrs = Math.floor(min / 60);
-	return sprintf(_tr.global.diff_date_hours, hrs, min % 60);
-}
-
-export function date_to_sql(date: Date, withHours: boolean) {
-
-	if (withHours) {
-		return formatIntlDate(date, 'Y-M-D H:I:S');
-	}
-	else {
-		return formatIntlDate(date, 'Y-M-D');
-	}
-}
-
-/**
- * construct a date from an utc date time (sql format)
- * YYYY-MM-DD HH:MM:SS
- */
-
-export function date_sql_utc(date: string): Date {
-	let result = new Date(date + ' GMT');
-	return result;
-}
-
-
-
-/**
- * return a number that is a representation of the date
- * this number can be compared with another hash
- */
-
-export function date_hash(date: Date): number {
-	return date.getFullYear() << 16 | date.getMonth() << 8 | date.getDate();
-}
-
-/**
- * return a copy of a date
- */
-
-export function date_clone(date: Date): Date {
-	return new Date(date.getTime());
-}
-
-/**
- * return the week number of a date
- */
-
-export function date_calc_weeknum(date: Date): number {
-	const firstDayOfYear = new Date(date.getFullYear(), 0, 1);
-	const pastDaysOfYear = (date.valueOf() - firstDayOfYear.valueOf()) / 86400000;
-	return Math.floor((pastDaysOfYear + firstDayOfYear.getDay() + 1) / 7);
-}
-
-
-
-/**
- * parse a date according to the given format 
- * @param value - string date to parse
- * @param fmts - format list - i18 tranlation by default
- * allowed format specifiers:
- * d or D: date (1 or 2 digits)
- * m or M: month (1 or 2 digits)
- * y or Y: year (2 or 4 digits)
- * h or H: hours (1 or 2 digits)
- * i or I: minutes (1 or 2 digits)
- * s or S: seconds (1 or 2 digits)
- * <space>: 1 or more spaces
- * any other char: <0 or more spaces><the char><0 or more spaces>
- * each specifiers is separated from other by a pipe (|)
- * more specific at first
- * @example
- * 'd/m/y|d m Y|dmy|y-m-d h:i:s|y-m-d'
- */
-
-export function parseIntlDate(value: string, fmts: string = _tr.global.date_input_formats): Date {
-
-	let formats = fmts.split('|');
-	for (let fmatch of formats) {
-
-		//review: could do that only once & keep result
-		//review: add hours, minutes, seconds
-
-		let smatch = '';
-		for (let c of fmatch) {
-
-			if (c == 'd' || c == 'D') {
-				smatch += '(?<day>\\d{1,2})';
-			}
-			else if (c == 'm' || c == 'M') {
-				smatch += '(?<month>\\d{1,2})';
-			}
-			else if (c == 'y' || c == 'Y') {
-				smatch += '(?<year>\\d{1,4})';
-			}
-			else if (c == 'h' || c == 'H') {
-				smatch += '(?<hour>\\d{1,2})';
-			}
-			else if (c == 'i' || c == 'I') {
-				smatch += '(?<min>\\d{1,2})';
-			}
-			else if (c == 's' || c == 'S') {
-				smatch += '(?<sec>\\d{1,2})';
-			}
-			else if (c == ' ') {
-				smatch += '\\s+';
-			}
-			else {
-				smatch += '\\s*\\' + c + '\\s*';
-			}
-		}
-
-		let rematch = new RegExp('^' + smatch + '$', 'm');
-
-		let match = rematch.exec(value);
-
-		if (match) {
-			const now = new Date( );
-
-			let d = parseInt(match.groups.day ?? '1');
-			let m = parseInt(match.groups.month ?? '1');
-			let y = parseInt(match.groups.year ?? now.getFullYear()+'');
-			let h = parseInt(match.groups.hour ?? '0');
-			let i = parseInt(match.groups.min ?? '0');
-			let s = parseInt(match.groups.sec ?? '0');
-
-			if (y > 0 && y < 100) {
-				y += 2000;
-			}
-
-			let result = new Date(y, m - 1, d, h, i, s, 0);
-
-			// we test the vdate validity (without adjustments)
-			// without this test, date ( 0, 0, 0) is accepted and transformed to 1969/11/31 (not fun)
-			let ty = result.getFullYear(),
-				tm = result.getMonth() + 1,
-				td = result.getDate();
-
-			if (ty != y || tm != m || td != d) {
-				//debugger;
-				return null;
-			}
-
-			return result;
-		}
-	}
-
-	return null;
-}
-
-/**
- * format a date as string 
- * @param date - date to format
- * @param fmt - format 
- * format specifiers:
- * d: date (no pad)
- * D: 2 digits date padded with 0
- * j: day of week short mode 'mon'
- * J: day of week long mode 'monday'
- * w: week number
- * m: month (no pad)
- * M: 2 digits month padded with 0
- * o: month short mode 'jan'
- * O: month long mode 'january'
- * y or Y: year
- * h: hour (24 format)
- * H: 2 digits hour (24 format) padded with 0
- * i: minutes
- * I: 2 digits minutes padded with 0
- * s: seconds
- * S: 2 digits seconds padded with 0
- * a: am or pm
- * anything else is inserted
- * if you need to insert some text, put it between {}
- * 
- * @example
- * 
- * 01/01/1970 11:25:00 with '{this is my demo date formatter: }H-i*M'
- * "this is my demo date formatter: 11-25*january"
- */
-
-export function formatIntlDate(date: Date, fmt: string = _tr.global.date_format) {
-
-	if (!date) {
-		return '';
-	}
-
-	let now = {
-		year: date.getFullYear(),
-		month: date.getMonth() + 1,
-		day: date.getDate(),
-		wday: date.getDay(),
-		hours: date.getHours(),
-		minutes: date.getMinutes(),
-		seconds: date.getSeconds(),
-		milli: date.getMilliseconds()
-	};
-
-
-	let result = '';
-	let esc = 0;
-
-	for (let c of fmt) {
-
-		if (c == '{') {
-			if (++esc == 1) {
-				continue;
-			}
-		}
-		else if (c == '}') {
-			if (--esc == 0) {
-				continue;
-			}
-		}
-
-		if (esc) {
-			result += c;
-			continue;
-		}
-
-		if (c == 'd') {
-			result += now.day;
-		}
-		else if (c == 'D') {
-			result += pad(now.day, -2);
-		}
-		else if (c == 'j') { // day short
-			result += _tr.global.day_short[now.wday];
-		}
-		else if (c == 'J') { // day long
-			result += _tr.global.day_long[now.wday];
-		}
-		else if (c == 'w') {	// week
-			result += date_calc_weeknum(date);
-		}
-		else if (c == 'W') {	// week
-			result += pad(date_calc_weeknum(date), -2);
-		}
-		else if (c == 'm') {
-			result += now.month;
-		}
-		else if (c == 'M') {
-			result += pad(now.month, -2);
-		}
-		else if (c == 'o') {	// month short
-			result += _tr.global.month_short[now.month - 1];
-		}
-		else if (c == 'O') {	// month long
-			result += _tr.global.month_long[now.month - 1];
-		}
-		else if (c == 'y' || c == 'Y') {
-			result += pad(now.year, -4);
-		}
-		else if (c == 'a' || c == 'A') {
-			result += now.hours < 12 ? 'am' : 'pm';
-		}
-		else if (c == 'h') {
-			result += now.hours;
-		}
-		else if (c == 'H') {
-			result += pad(now.hours, -2);
-		}
-		else if (c == 'i') {
-			result += now.minutes;
-		}
-		else if (c == 'I') {
-			result += pad(now.minutes, -2);
-		}
-		else if (c == 's') {
-			result += now.seconds;
-		}
-		else if (c == 'S') {
-			result += pad(now.seconds, -2);
-		}
-		else if (c == 'l') {
-			result += now.milli;
-		}
-		else if (c == 'L') {
-			result += pad(now.milli, -3);
-		}
-		else {
-			result += c;
-		}
-	}
-
-	return result;
-}
-
-export function calcAge(birth: Date, ref?: Date) {
-	if (ref === undefined) {
-		ref = new Date();
-	}
-
-	if (!birth) {
-		return 0;
-	}
-
-	let age = ref.getFullYear() - birth.getFullYear();
-	if (ref.getMonth() < birth.getMonth() || (ref.getMonth() == birth.getMonth() && ref.getDate() < birth.getDate())) {
-		age--;
-	}
-
-	return age;
-}
-
-

package/lib/src/demo/assets/house-light.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" fill="currentColor"><!--!Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path d="M298.6 4c-6-5.3-15.1-5.3-21.2 0L5.4 244c-6.6 5.8-7.3 16-1.4 22.6s16 7.3 22.6 1.4L64 235l0 197c0 44.2 35.8 80 80 80l288 0c44.2 0 80-35.8 80-80l0-197 37.4 33c6.6 5.8 16.7 5.2 22.6-1.4s5.2-16.7-1.4-22.6L298.6 4zM96 432l0-225.3L288 37.3 480 206.7 480 432c0 26.5-21.5 48-48 48l-64 0 0-160c0-17.7-14.3-32-32-32l-96 0c-17.7 0-32 14.3-32 32l0 160-64 0c-26.5 0-48-21.5-48-48zm144 48l0-160 96 0 0 160-96 0z"/></svg>

package/lib/src/demo/assets/radio.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 5 5" aria-hidden="true">
-	<circle cx="2.5" cy="2.5" r="2.5" fill="currentColor"></circle>
-	<circle cx="2.5" cy="2.5" r="1.25" fill="white"></circle>
-</svg>

package/lib/src/demo/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <link rel="stylesheet" href="./main.css">
-    </head>
-    <body>
-        <noscript>JavaScript required</noscript>
-        <script src="./main.js"></script>
-    </body>
-</html>

package/lib/src/demo/main.scss

@@ -1,21 +0,0 @@
-/** 
- *  ___  ___ __
- *  \  \/  /  / _
- *   \    /  /_| |_
- *   /    \____   _|  
- *  /__/\__\   |_|
- * 
- * @file main.scss
- * @author Etienne Cochard 
- * 
- * @copyright (c) 2024 R-libre ingenierie
- *
- * Use of this source code is governed by an MIT-style license 
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
- **/
-
-@use "./x4.scss" ;
-
-body {
-	padding: 16px;
-}