Improved workbench's formulas' MVC, Added utils, Fixed missing file

Update strings.json, compile.bat, and 6 more files...
This commit is contained in:
2023-08-16 14:58:26 +02:00
parent cd015b43a7
commit 3891f5ce98
8 changed files with 399 additions and 55 deletions

File diff suppressed because one or more lines are too long

View File

@@ -69,8 +69,8 @@ echo -----------------------------
echo Cleaning...
pushd %CD%
cd %~dp0\tools\items\formula-wizard\src\
del *.js
del *.map
del *.js 2>nul
del *.map 2>nul
popd
:formula-wizard-compile
@@ -84,14 +84,15 @@ popd
echo Fixing imports...
pushd %CD%
cd %~dp0\tools\items\formula-wizard\src\
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "decimal" "decimal.min.mjs"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "lang" "lang.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "formulas" "formulas.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "units" "units.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "ui_catalog" "ui_catalog.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "mvc_context" "mvc_context.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "sets" "sets.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js" "mvc_formula" "mvc_formula.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "decimal" "decimal.min.mjs"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "lang" "lang.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "formulas" "formulas.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "units" "units.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "ui_catalog" "ui_catalog.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "mvc_context" "mvc_context.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "sets" "sets.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "mvc_formula" "mvc_formula.js"
call node "%~dp0fix-import-path.js" "formulas.js;lang.js;main.js;units.js;ui_catalog.js;mvc_context.js;sets.js;mvc_formula.js;utils_templates.js" "utils_templates" "utils_templates.js"
popd
:formula-wizard-bundle
@@ -113,6 +114,7 @@ call "%~dp0node_modules\.bin\terser" ui_catalog.js -c -m --toplevel -o ui_catalo
call "%~dp0node_modules\.bin\terser" mvc_context.js -c -m --toplevel -o mvc_context.min.js
call "%~dp0node_modules\.bin\terser" sets.js -c -m --toplevel -o sets.min.js
call "%~dp0node_modules\.bin\terser" mvc_formula.js -c -m --toplevel -o mvc_formula.min.js
call "%~dp0node_modules\.bin\terser" utils_templates.js -c -m --toplevel -o utils_templates.min.js
call "%~dp0node_modules\.bin\terser" formula-wizard.js -c -m --toplevel -o formula-wizard.min.js
popd

View File

@@ -212,7 +212,6 @@ echo(getMainHeader(localize("tool.formula-wizard.workbench"), null, null, null,
</div>
</template>
<div class="m-s mt-xs">
<div class=" border r-s bkgd-grid w-full">
<div class="border border-t-0 border-l-0 border-r-0">

View File

@@ -1,5 +1,5 @@
/*!
* Formula Wizard v0.0.3
* NibblePoker - Formula Wizard
* [Short desc here]
* https://github.com/aziascreations/Web-NibblePoker
* Copyright (c) 2023 Herwin Bozet <herwin.bozet@gmail.com>
@@ -7,7 +7,7 @@
*/
// Preparing some things before the import statements.
const version = [0, 0, 2];
const version = [0, 0, 3];
console.log("Initializing 'Formula Wizard v" + version.join(".") + "'...");
const startTime = new Date().getMilliseconds();
@@ -27,7 +27,7 @@ Decimal.set({ precision: 25, rounding: 8 });
initUnits();
initFormulas();
// Preparing the UI
// Preparing the UI & MVC stuff
initCatalog();
setupWorkbenchContext();
setupWorkbenchFormula();
@@ -35,6 +35,8 @@ setupWorkbenchFormula();
// ???
// Tests
console.log(localize("joe.mama"));
console.log(units);
console.log(formulas);
const endTime = new Date().getMilliseconds();
console.log("Done, took " + (endTime - startTime) + "ms !");

View File

@@ -3,11 +3,12 @@
* [Short desc here]
* https://github.com/aziascreations/Web-NibblePoker
* Copyright (c) 2023 Herwin Bozet <herwin.bozet@gmail.com>
* Unlicense Licence
*/
import {localize} from "./lang";
import {isCatalogInitialized, catalogFormulas} from "./ui_catalog";
import {FormulaValue, FormulaVariant} from "./formulas";
import {retrieveTemplate, makeElementFromFragment, appendToAllIds} from "./utils_templates";
// -----------
// Constants
@@ -18,6 +19,17 @@ const ID_TEMPLATE_FORMULA_VALUE = ID_TEMPLATE_FORMULA + "-value";
const ID_FORMULA_PREFIX = "fw-workbench-formula-";
const ID_FORMULA_SPAWN_POINT = ID_FORMULA_PREFIX + "spawn";
const ID_FORMULA_NAME = ID_FORMULA_PREFIX + "name";
const ID_FORMULA_INPUTS = ID_FORMULA_PREFIX + "inputs";
const ID_FORMULA_OUTPUTS = ID_FORMULA_PREFIX + "outputs";
const ID_FORMULA_VALUE_PREFIX = ID_FORMULA_PREFIX + "value-";
const ID_FORMULA_VALUE_ID = ID_FORMULA_VALUE_PREFIX + "id";
const ID_FORMULA_VALUE_NAME = ID_FORMULA_VALUE_PREFIX + "name";
const ID_FORMULA_VALUE_LINK = ID_FORMULA_VALUE_PREFIX + "link";
const ID_FORMULA_VALUE_TEST_VALUE = ID_FORMULA_VALUE_PREFIX + "test-value";
const ID_FORMULA_VALUE_TEST_SCALE = ID_FORMULA_VALUE_PREFIX + "test-scale";
const ID_FORMULA_VALUE_TEST_VALUE_SET = ID_FORMULA_VALUE_PREFIX + "test-value-set";
//const idWorkbenchFormulaPrefix = "fw-workbench-formula-";
//const idWorkbenchFormulaSpawnPoint = idWorkbenchFormulaPrefix + "spawn";
@@ -40,12 +52,14 @@ const ID_FORMULA_SPAWN_POINT = ID_FORMULA_PREFIX + "spawn";
//const idFormulaValueTestValueSet = idFormulaValuePrefix + "test-value-set";
// ---------
// Globals
// ---------
let eTemplateWorkbenchFormula: HTMLElement | DocumentFragment | null = null;
let eTemplateWorkbenchFormulaValue: HTMLElement | DocumentFragment | null = null;
let eTemplateWorkbenchFormula: DocumentFragment | null = null;
let eTemplateWorkbenchFormulaValue: DocumentFragment | null = null;
export let workbenchFormulas: WorkbenchFormula[] = [];
@@ -56,12 +70,30 @@ export let workbenchFormulas: WorkbenchFormula[] = [];
function deleteWorkbenchFormula(deletedFormula: WorkbenchFormula, removeDom: boolean = true) {
workbenchFormulas = workbenchFormulas.filter(item => item !== deletedFormula);
//if(removeDom) {
// //deletedFormula.uiElement
//}
//if(workbenchContextComponents.length < 1) {
// eContextStatusMessage!.hidden = false;
//}
if(removeDom) {
deletedFormula.uiElement.eRootElement.remove();
}
}
function handleCatalogInsertion(formulaVariant: FormulaVariant, eSpawnPointAnchor: HTMLAnchorElement) {
console.group("Adding new formula to workbench...");
console.debug("Instantiating 'WorkbenchFormula'...");
const newWorkbenchFormula = new WorkbenchFormula(
eTemplateWorkbenchFormula as DocumentFragment,
eTemplateWorkbenchFormulaValue as DocumentFragment,
formulaVariant
);
console.debug("Registering controller...");
workbenchFormulas.push(newWorkbenchFormula);
console.debug("Adding to workbench's DOM...");
eSpawnPointAnchor!.parentNode!.insertBefore(newWorkbenchFormula.uiElement.eRootElement, eSpawnPointAnchor);
console.debug(newWorkbenchFormula);
console.groupEnd();
}
// --------------------
@@ -76,29 +108,90 @@ enum EWorkbenchFormulaValueTypes {
class WorkbenchFormulaValueData {
id: string;
valueType: EWorkbenchFormulaValueTypes
formulaValue: FormulaValue;
constructor(controllerId: string) {
constructor(controllerId: string, valueType: EWorkbenchFormulaValueTypes, formulaValue: FormulaValue) {
this.id = controllerId;
this.valueType = valueType;
this.formulaValue = formulaValue;
}
}
class WorkbenchFormulaValueInterface {
public eRootElement: HTMLElement;
private readonly eFormulaValueId: HTMLInputElement;
private readonly eFormulaValueName: HTMLParagraphElement;
private readonly eFormulaValueLink: HTMLSelectElement;
private readonly eFormulaValueTestValue: HTMLInputElement;
private readonly eFormulaValueTestScale: HTMLSelectElement;
private readonly eFormulaValueTestValueSet: HTMLInputElement;
constructor(eRootFragment: DocumentFragment, setupValueType: EWorkbenchFormulaValueTypes) {
this.eRootElement = makeElementFromFragment(eRootFragment);
// Grabbing references to all the form's fields.
this.eFormulaValueId = this.eRootElement.querySelector(`input#${ID_FORMULA_VALUE_ID}`)!;
this.eFormulaValueName = this.eRootElement.querySelector(`p#${ID_FORMULA_VALUE_NAME}`)!;
this.eFormulaValueLink = this.eRootElement.querySelector(`select#${ID_FORMULA_VALUE_LINK}`)!;
this.eFormulaValueTestValue = this.eRootElement.querySelector(`input#${ID_FORMULA_VALUE_TEST_VALUE}`)!;
this.eFormulaValueTestScale = this.eRootElement.querySelector(`select#${ID_FORMULA_VALUE_TEST_SCALE}`)!;
this.eFormulaValueTestValueSet = this.eRootElement.querySelector(`select#${ID_FORMULA_VALUE_TEST_VALUE_SET}`)!;
if([this.eFormulaValueId, this.eFormulaValueName, this.eFormulaValueLink, this.eFormulaValueTestValue,
this.eFormulaValueTestScale, this.eFormulaValueTestValueSet].some((item) => item === null)) {
alert("error.ui.formula.value.missingElement");
throw Error("error.ui.formula.value.missingElement");
}
//// Adding the relevant scale factors.
//populateScaleSelectForUnit(this.formulaValue.unit, this.eFormulaValueTestScale, this.formulaValue.scaleFactor);
//if(setupValueType === EWorkbenchFormulaValueTypes.INPUT) {
// this.setupInput();
//} else {
// this.setupOutput();
//}
}
toggleField(eFormField: HTMLElement, hidden: boolean) {
// We hide the parent "tr" element.
(eFormField.parentNode!.parentNode! as HTMLElement).hidden = hidden;
}
private setupInput() {
this.toggleField(this.eFormulaValueId, true);
this.eFormulaValueTestValue.value = "0";
//this.eFormulaValueTestValue.onchange = this.onTestFieldChange.bind(this);
//this.eFormulaValueTestScale.onchange = this.onTestFieldChange.bind(this);
}
private setupOutput() {
this.toggleField(this.eFormulaValueLink, true);
//this.eFormulaValueTestValue.readOnly = true;
//this.eFormulaValueTestScale.onchange = this.onTestFieldChange.bind(this);
}
setName(newName: string) {
this.eFormulaValueName.innerText = newName;
}
}
class WorkbenchFormulaValue {
uiElement: WorkbenchFormulaValueInterface;
data: WorkbenchFormulaValueData;
uiElement: WorkbenchFormulaValueInterface;
constructor(uiElement: WorkbenchFormulaValueInterface, data: WorkbenchFormulaValueData) {
this.uiElement = uiElement;
this.data = data;
constructor(eRootFragment: DocumentFragment, valueType: EWorkbenchFormulaValueTypes,
parentAssignedControllerId: string, formulaValue: FormulaValue) {
this.data = new WorkbenchFormulaValueData(parentAssignedControllerId, valueType, formulaValue);
this.uiElement = new WorkbenchFormulaValueInterface(eRootFragment, valueType);
this.setName(`${this.data.formulaValue.unit.name} (${this.data.formulaValue.unit.symbol})`);
}
public static createNew(eRootElement: HTMLElement): WorkbenchFormulaValue {
const id: string = Date.now().toString();
return null!;
setName(newName: string) {
this.uiElement.setName(newName);
}
}
@@ -109,29 +202,88 @@ class WorkbenchFormulaValue {
class WorkbenchFormulaData {
id: string;
formulaVariant: FormulaVariant;
constructor(controllerId: string) {
constructor(controllerId: string, formulaVariant: FormulaVariant) {
this.id = controllerId;
this.formulaVariant = formulaVariant;
}
}
class WorkbenchFormulaInterface {
public eRootElement: HTMLElement;
private readonly eTitle: HTMLParagraphElement;
public readonly eInputsContainer: HTMLDivElement;
public readonly eOutputsContainer: HTMLDivElement;
constructor(eRootFragment: DocumentFragment) {
this.eRootElement = makeElementFromFragment(eRootFragment);
this.eTitle = this.eRootElement.querySelector(`p#${ID_FORMULA_NAME}`)!;
this.eInputsContainer = this.eRootElement.querySelector(`div#${ID_FORMULA_INPUTS}`)!;
this.eOutputsContainer = this.eRootElement.querySelector(`div#${ID_FORMULA_OUTPUTS}`)!;
if([this.eTitle, this.eInputsContainer, this.eOutputsContainer].some((item) => item === null)) {
alert(localize("error.ui.formula.missingElement"));
throw Error(localize("error.ui.formula.missingElement"));
}
}
setTitle(newTitle: string) {
this.eTitle.innerText = newTitle;
}
}
class WorkbenchFormula {
uiElement: WorkbenchFormulaInterface;
data: WorkbenchFormulaData;
constructor(uiElement: WorkbenchFormulaInterface, data: WorkbenchFormulaData) {
this.uiElement = uiElement;
this.data = data;
}
inputControllers: WorkbenchFormulaValue[];
outputControllers: WorkbenchFormulaValue[];
public static createNew(eRootElement: HTMLElement): WorkbenchFormula {
constructor(fragRootElement: DocumentFragment, fragValueElement: DocumentFragment, formulaVariant: FormulaVariant) {
const id: string = Date.now().toString();
return null!;
// Preparing core MVC components.
this.uiElement = new WorkbenchFormulaInterface(fragRootElement);
this.data = new WorkbenchFormulaData(id, formulaVariant);
// Preparing children MVC components.
let valueIdSuffix = 0;
this.inputControllers = this.data.formulaVariant.getInputValuesDefinition().map(
inputFormulaValue => new WorkbenchFormulaValue(
fragValueElement,
EWorkbenchFormulaValueTypes.INPUT,
this.data.id + (valueIdSuffix++).toString(),
inputFormulaValue
)
);
this.outputControllers = [this.data.formulaVariant.getOutputValueDefinition()].map(
outputFormulaValue => new WorkbenchFormulaValue(
fragValueElement,
EWorkbenchFormulaValueTypes.OUTPUT,
this.data.id + (valueIdSuffix++).toString(),
outputFormulaValue
)
);
// Preparing the interface...
this.setTitle(this.data.formulaVariant.parentFormula.name);
// Adding the value elements into their proper container.
this.inputControllers.every(inputController =>
this.uiElement.eInputsContainer.appendChild(inputController.uiElement.eRootElement));
this.outputControllers.every(outputController =>
this.uiElement.eOutputsContainer.appendChild(outputController.uiElement.eRootElement));
// Finalizing the interface by making its IDs unique.
// This is purely a UX thing to ensure proper input selection via the labels.
appendToAllIds(this.uiElement.eRootElement, this.data.id);
}
public setTitle(newTitle: string) {
this.uiElement.setTitle(newTitle);
}
}
@@ -153,16 +305,9 @@ export function setupWorkbenchFormula() {
throw Error(localize("error.ui.workbench.catalog.no-init"));
}
console.debug("Grabbing & processing the templates from the DOM...");
eTemplateWorkbenchFormula = document.getElementById(ID_TEMPLATE_FORMULA);
eTemplateWorkbenchFormulaValue = document.getElementById(ID_TEMPLATE_FORMULA_VALUE);
if(eTemplateWorkbenchFormula === null || eTemplateWorkbenchFormulaValue === null) {
console.groupEnd();
alert(localize("error.ui.workbench.noTemplate"));
throw Error(localize("error.ui.workbench.noTemplate"));
}
eTemplateWorkbenchFormula = (eTemplateWorkbenchFormula.cloneNode(true) as HTMLTemplateElement).content;
eTemplateWorkbenchFormulaValue = (eTemplateWorkbenchFormulaValue.cloneNode(true) as HTMLTemplateElement).content;
console.debug("Grabbing, processing & removing the templates from the DOM...");
eTemplateWorkbenchFormula = retrieveTemplate(ID_TEMPLATE_FORMULA, true);
eTemplateWorkbenchFormulaValue = retrieveTemplate(ID_TEMPLATE_FORMULA_VALUE, true);
console.debug("Grabbing the anchor point for new formulas...");
const eWorkbenchFormulaSpawnPoint: HTMLAnchorElement | null = document.querySelector(`a#${ID_FORMULA_SPAWN_POINT}`);
@@ -172,10 +317,16 @@ export function setupWorkbenchFormula() {
throw Error(localize("error.ui.workbench.noAnchor"));
}
// catalogFormulas
console.debug("Preparing the catalog's buttons actions & inserting them in the DOM");
catalogFormulas.forEach(catalogFormula => {
for(let iVariant = 0; iVariant < catalogFormula.formula.variants.length; iVariant++) {
catalogFormula.eVariantButtons[iVariant].onclick = function (){
handleCatalogInsertion(catalogFormula.formula.variants[iVariant], eWorkbenchFormulaSpawnPoint);
}
}
catalogFormula.insertIntoCategories();
});
isWorkbenchFormulaSetup = true;

View File

@@ -0,0 +1,127 @@
{
"compilerOptions": {
/* Visit https://aka.ms/tsconfig to read more about this file */
/* Projects */
// "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
// "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */
// "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */
// "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */
// "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */
// "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */
/* Language and Environment */
"target": "es2019",
/* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
// "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */
// "jsx": "preserve", /* Specify what JSX code is generated. */
// "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */
// "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */
// "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
// "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
// "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
// "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
// "noLib": true, /* Disable including any library files, including the default lib.d.ts. */
// "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */
// "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */
/* Modules */
"module": "ES6",
/* Specify what module code is generated. */
"rootDir": "./",
/* Specify the root folder within your source files. */
// "moduleResolution": "node10", /* Specify how TypeScript looks up a file from a given module specifier. */
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */
// "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */
// "types": [], /* Specify type package names to be included without being referenced in a source file. */
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
// "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */
// "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
// "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */
// "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */
// "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
// "resolveJsonModule": true, /* Enable importing .json files. */
// "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */
// "noResolve": true, /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
/* JavaScript Support */
// "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
// "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */
// "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
/* Emit */
// "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
// "declarationMap": true, /* Create sourcemaps for d.ts files. */
// "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */
"sourceMap": true,
/* Create source map files for emitted JavaScript files. */
// "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */
//"outFile": "./formula-wizard.js", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
// "outDir": "./", /* Specify an output folder for all emitted files. */
"removeComments": true,
/* Disable emitting comments. */
// "noEmit": true, /* Disable emitting files from a compilation. */
// "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
// "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */
// "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
// "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
// "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */
// "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
// "newLine": "crlf", /* Set the newline character for emitting files. */
// "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
// "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */
// "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */
// "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */
// "declarationDir": "./", /* Specify the output directory for generated declaration files. */
// "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
/* Interop Constraints */
// "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */
// "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
// "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */
"esModuleInterop": true,
/* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
// "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
"forceConsistentCasingInFileNames": true,
/* Ensure that casing is correct in imports. */
/* Type Checking */
"strict": true,
/* Enable all strict type-checking options. */
"noImplicitAny": true,
/* Enable error reporting for expressions and declarations with an implied 'any' type. */
// "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */
// "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */
"noImplicitThis": true,
/* Enable error reporting when 'this' is given the type 'any'. */
// "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */
"alwaysStrict": true,
/* Ensure 'use strict' is always emitted. */
// "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */
// "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */
// "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
// "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */
// "allowUnusedLabels": true, /* Disable error reporting for unused labels. */
// "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */
/* Completeness */
// "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */
"skipLibCheck": true
/* Skip type checking all .d.ts files. */
},
"files": [
"./main.ts"
],
"exclude": [
"../../../../resources/DecimalJs/10.4.3"
]
}

View File

@@ -0,0 +1,63 @@
// TODO: Move into a common lib at some point !
import {localize} from "./lang";
/**
* Retrieves a `template` element from the current document and returns it while optionally removing it from the DOM.
* @param templateId
* @param removeFromDocument
*/
export function retrieveTemplate(templateId: string, removeFromDocument: boolean): DocumentFragment {
const retrievedTemplate = document.querySelector(`template#${templateId}`);
if(retrievedTemplate === null) {
alert(localize("error.templatator.template.404"));
throw Error(localize("error.templatator.template.404"));
}
const templateFragment = (retrievedTemplate.cloneNode(true) as HTMLTemplateElement).content;
if(removeFromDocument) {
retrievedTemplate.remove();
}
return templateFragment;
}
/**
* Converts a given `DocumentFragment` in a cloned `HTMLElement` that can be manipulated and inserted back into the DOM.
* @param fragment
*/
export function makeElementFromFragment(fragment: DocumentFragment): HTMLElement {
return (fragment.cloneNode(true) as DocumentFragment).firstElementChild as HTMLElement;
}
export function wipeAllIds(eRootElement: HTMLElement, doLabels: boolean = true): void {
eRootElement.querySelectorAll(`*`).forEach(eElement => {
if(eElement.hasAttribute("id")) {
eElement.removeAttribute("id");
}
});
if(doLabels) {
eRootElement.querySelectorAll(`label`).forEach(eLabel => {
if (eLabel.hasAttribute("for")) {
eLabel.removeAttribute("for");
}
});
}
}
export function appendToAllIds(eRootElement: HTMLElement, newIdSuffix: string, doLabels: boolean = true): void {
eRootElement.querySelectorAll(`input, select, p, div`).forEach(eElement => {
if(eElement.hasAttribute("id")) {
eElement.setAttribute("id", eElement.getAttribute("id") + newIdSuffix);
}
});
if(doLabels) {
eRootElement.querySelectorAll(`label`).forEach(eLabel => {
if(eLabel.hasAttribute("for")) {
eLabel.setAttribute("for", eLabel.getAttribute("for") + newIdSuffix);
}
});
}
}