# JavaScript Utils Collection of Javascript functions. This will build into a single js file that was formaly known as "edit.js" (edit.jq.js). ## List of modules In alphabetical order ### ActionBox.mjs floating fixed window overlay over page. This is a class that needs to be called as ```js let ab = new ActionBox(new HtmlElementCreator(), new l10nTranslation(translationHashKeyValue)); ``` ### ActionIndicatorOverlayBox.mjs dimmer background calls and spinner for running indicator ### DateTimeHelpers.mjs Date/Time support functions ### DomHelpers.mjs Various support calls like load an element with throwing error or element exists check ### FormatBytes.mjs Format bytes as human readable ### HtmlElementCreator.mjs Create HTML elements as an Object tree and convert to HTML string This is an object ```js let hec = new HtmlElementCreator(); ``` > [!notice] > It is recommended to build all HTML in the backend or in templates ### HtmlHelpers.mjs Build HTML option entries or escape/unescape HTML ### JavaScriptHelpers.mjs JavaScript support like errorCatch calls, various object key lookup, checks and copy, function exections from name ### l10nTranslation.mjs Simpl translation via object key lookup This class named "l10nTranslation" must be called with an Object that has a list of key values ```js var i18n = { "Original": "Translated" }; ``` ### LoginLogout.mjs Function to call the logout action for the CoreLibs LoginAcl class ### LoginNavMenu.mjs Functions to build logout and navigation menu based on the CoreLibs LoginAcl and EditBase classes ### MathHelpers.mjs Various math support functions like rounding with precision or decimal to hex convert ### ResizingAndMove.mjs Calls like getting window size, scroll offset, center an element or scroll to a position ### StringHelpers.mjs Various string format calls, also convert line break to HTML "\" ### UniqIdGenerators.mjs Simple random id generate methods ### UrlParser.mjs Parse URL for looking up entries in the paramegter list ## Build Build with the following commands, the output will be stored in "build/js/output/utils.js" and "build/js/output/utils.min.js" For full not minified version ```sh npm build utils-build ``` For minified build (but keeps the function names as is) ```sh npm build utils-min-build ``` Or build both at the same time ```sh npm build utils-build-all ``` ## Develop Install the core npm modules ```sh npm install ``` Run watch ```sh npm run utils-develop ``` ## Test A simple test script is located in "build/test.html" ### General function tests vitest is used for all usage tests ```sh npx vitest ``` Currently covered: - FormatBytes - MathHelpers - StringHelpers - UniqIdGenerators (Part) - UrlParser TODO: - JavaScriptHelpers