Readme file update
This commit is contained in:
91
ReadMe.md
91
ReadMe.md
@@ -2,6 +2,97 @@
|
|||||||
|
|
||||||
Collection of Javascript functions. This will build into a single js file that was formaly known as "edit.js" (edit.jq.js).
|
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 "\<br\>"
|
||||||
|
|
||||||
|
### UniqIdGenerators.mjs
|
||||||
|
|
||||||
|
Simple random id generate methods
|
||||||
|
|
||||||
|
### UrlParser.mjs
|
||||||
|
|
||||||
|
Parse URL for looking up entries in the paramegter list
|
||||||
|
|
||||||
## Build
|
## Build
|
||||||
|
|
||||||
Build with the following commands, the output will be stored in "build/js/utilsAll.js" and "build/js/utilsAll.min.js"
|
Build with the following commands, the output will be stored in "build/js/utilsAll.js" and "build/js/utilsAll.min.js"
|
||||||
|
|||||||
@@ -143,6 +143,43 @@ function ClearCall()
|
|||||||
$('#overlayBox').hide();
|
$('#overlayBox').hide();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
The below class will need the following CSS set
|
||||||
|
|
||||||
|
Progress indicator (#indicator):
|
||||||
|
.progress {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
background: rgba(255, 255, 255, 0.6);
|
||||||
|
border: 20px solid rgba(255, 255, 255 ,0.25);
|
||||||
|
border-left-color: rgba(3, 155, 229 ,1);
|
||||||
|
border-top-color: rgba(3, 155, 229 ,1);
|
||||||
|
border-radius: 50%;
|
||||||
|
display: inline-block;
|
||||||
|
animation: progress-move 600ms infinite linear;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
@keyframes progress-move {
|
||||||
|
to {
|
||||||
|
transform: rotate(1turn)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Overlay box darken background (#overlayBox):
|
||||||
|
.overlayBoxElement {
|
||||||
|
background-color: rgba(0, 0, 0, 0.3);
|
||||||
|
height: 100%;
|
||||||
|
left: 0;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 98;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
class ActionIndicatorOverlayBox {
|
class ActionIndicatorOverlayBox {
|
||||||
|
|
||||||
// open overlay boxes counter for z-index
|
// open overlay boxes counter for z-index
|
||||||
|
|||||||
Reference in New Issue
Block a user