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).
|
||||
|
||||
## 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 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();
|
||||
}
|
||||
|
||||
/*
|
||||
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 {
|
||||
|
||||
// open overlay boxes counter for z-index
|
||||
|
||||
Reference in New Issue
Block a user