Commit 654759ad by Ivan Kubota

Update readme

Quality of life feature for DOM: if second argument is not an object — it is treated as children
parent e9411254
...@@ -94,6 +94,16 @@ NS.apply = function(a,b) { ...@@ -94,6 +94,16 @@ NS.apply = function(a,b) {
return type.hook(cfg, ArraySlice.call(arguments, 2)); return type.hook(cfg, ArraySlice.call(arguments, 2));
} }
/* Quality Of life feature
when using `h` function manually — sometimes forget to specify cfg and pass a string that suppose to be a child,
but it explodes into attributes of an element like <div 1="c" 2="a" 3="t"/> instead of <div>cat</div>
*/
var typeOfCfg = typeof cfg; var firstChildArgument = 2;
if(typeOfCfg !== 'undefined' && (typeOfCfg !== 'object' && !Array.isArray(cfg))){
firstChildArgument = 1;
cfg = {};
}
cfg = cfg || {}; cfg = cfg || {};
var cls = cfg.cls || cfg['class'] || cfg.className, var cls = cfg.cls || cfg['class'] || cfg.className,
...@@ -167,7 +177,7 @@ NS.apply = function(a,b) { ...@@ -167,7 +177,7 @@ NS.apply = function(a,b) {
on.hasOwnProperty( i ) && el.addEventListener( i, on[ i ] ); on.hasOwnProperty( i ) && el.addEventListener( i, on[ i ] );
} }
for( i = 2, _i = arguments.length; i < _i; i++ ){ for( i = firstChildArgument, _i = arguments.length; i < _i; i++ ){
var child = arguments[ i ]; var child = arguments[ i ];
D.appendChild( el, child ); D.appendChild( el, child );
} }
......
# DOM
Library for create, and modify DOM elements
Library is implemented in a way similar to `jsx` `h` function.
There is a <a href="https://www.npmjs.com/package/express-react-vanilla-adapter">adapter package</a> that use this library as a jsx templates for express library.
There is a <a href="https://www.npmjs.com/package/cms-tapir">cms-tapir package</a> that implements a web server capable of creating REST requests and also use this library as jsx templates `h` function.
Library is capable of using reactive values.
# Store
Storage that provide reactive values for DOM part. Tests covered. Read docs of above packages for examples.
# Ajax
Simple XMLHttpRequest wrapper.
GET:
```js
Ajax.get( url, data, callback, config );
Ajax.get( url, callback, config );
await Ajax.async.get(url, data);
```
POST, DELETE are implemented in the same way.
# Random.seeded
Extends `Math.random` with `seeded` method.
`mulberry32` is used as the source of seeded random.
`Math.random.seeded.rand([1, 2, 3])` would return one value from the array
`Math.random.seeded.setSeed( someString | someNumber)` set a new seed
`var newSeeded = new Math.random.seeded.constructor()` create a uniq seeded random
<a href="https://blog.form.dev/random/random">Article about random</a>
# Versions
List of old versions are here: <a href="https://form.dev/vanilla">form.dev</a>
{ {
"name": "react-vanilla", "name": "react-vanilla",
"version": "1.1.21", "version": "1.1.22",
"description": "", "description": "",
"main": "DOM.js", "main": "DOM.js",
"scripts": { "scripts": {
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
"type": "git", "type": "git",
"url": "git@gitlab.quokka.pub:Zibx/react-vanilla.git" "url": "git@gitlab.quokka.pub:Zibx/react-vanilla.git"
}, },
"keywords": [], "keywords": ["react-vanilla", "DOM", "reactive", "FRP", "reactive storage", "h function"],
"author": "Zibx", "author": "Zibx",
"license": "MPL-2.0", "license": "MPL-2.0",
"dependencies": { "dependencies": {
...@@ -20,6 +20,7 @@ ...@@ -20,6 +20,7 @@
"devDependencies": { "devDependencies": {
"chai": "^4.2.0", "chai": "^4.2.0",
"mocha": "^8.2.1", "mocha": "^8.2.1",
"nyc": "^15.1.0" "nyc": "^15.1.0",
"express": "*"
} }
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment