feat(sample): provide an example SAP

the example app is in ./docs/mvc

this closes #1

.env.test

@@ -1,2 +1,4 @@
 # PLEASE READ COMMENTS IN ./config/config.dump.mjs
-IS_UNDER_TEST=true
+IS_UNDER_TEST=true
+IS_LOG_SILENT=true
+IS_LOG_VERBOSE=false

.vscode/launch.json

@@ -0,0 +1,77 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "chrome",
+            "request": "attach",
+            "name": "Attach to Chrome",
+            "port": 9222,
+            "webRoot": "${workspaceFolder}/docs"
+        },
+
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "test-odla-special",
+            "program": "${workspaceFolder}/test/lib/OpenDataLogicAgent.special.test.mjs",
+            "runtimeArgs": [
+                "--experimental-modules"
+            ],
+            "args": [
+                "test/lib/OpenDataLogicAgent.special.test.mjs "
+            ],
+            "console": "internalConsole"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "esm-odla-special",
+            "program": "${workspaceFolder}/test/lib/OpenDataLogicAgent.special.test.esm.js",
+            "runtimeArgs": ["-r", "esm"],
+            "args": [
+                "test/lib/OpenDataLogicAgent.special.test.mjs "
+            ],
+            "env": {
+                "NODE_ENV": "test"
+            },
+            "console": "internalConsole"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "esm-odla",
+            "program": "${workspaceFolder}/test/lib/OpenDataLogicAgent.test.esm.js",
+            "runtimeArgs": ["-r", "esm"],
+            "args": [
+                "test/lib/OpenDataLogicAgent.test.mjs "
+            ],
+            "env": {
+                "NODE_ENV": "test"
+            },
+            "console": "internalConsole"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "esm-log",
+            "program": "${workspaceFolder}/test/log/log.esm.js",
+            "runtimeArgs": ["-r", "esm"],
+            "args": [
+                "test/log/log.test.mjs "
+            ],
+            "env": {
+                "NODE_ENV": "test"
+            },
+            "console": "internalConsole"
+        },
+        {
+            "type": "node",
+            "request": "attach",
+            "name": "repl-test-debug",
+            "port": 9229
+        }    
+    ]
+}

CHANGELOG.md

@@ -1,7 +1,21 @@
-# 1.0.1 
-## 1.0.1 BUG FIX
+# 1.1.0 
+## Include sample web app 
+In the ./docs.mvc folder an essential example application is now available.
+In response to the [issue #1](https://github.com/rondinif/phytojs/issues/1) the example show how to use PhytoJS in a vanilla ES6 web browser SPA; this particular example Will work in your browser in these cases:
+- Safari 10.1.
+- Chrome 61.
+- Firefox 54 – behind the dom.moduleScripts.enabled setting in about:config.
+- Edge 15 – behind the Experimental JavaScript Features setting in about:flags.  
+
+
+## Logging 
+- all `log.trace(` are replare with `log.trace(` beacause of the meaning of `log.trace` was misunderstood
+## SDLC
+- changed `rollup.config.js` to avoid too much warnings 
+
+## 1.0.1 BUG HOTFIX
 ### fixed CORS disabled in Chrome breaks the operation od the service
-`src/lib/OpenDataLogicAgent.mjs::getPromiseOfWikiDataApiActionQuerySearchByName` now has support for `cors` and fixes
+`src/lib/OpenDataLogicAgent.mjs::getPromiseOfWikiDataApiActionQuerySearchByName` now has support for `cors`  this fix errors in browser such as: 
 ```
 has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
 ```

README.md

@@ -22,13 +22,23 @@ npm i
 
 ### Build
 ``` bash
-npm run prepare
+npm run clean:prepare:cover
 ```
+<!-- TODO add postprocessing to fix import in `umd/phyto.js` to fix import to ./ (current dir) instead of ../esm -->
 
 ### Unit tests
 ``` bash
 npm test
+# to execute specific test suites: 
+npm run test-index
+npm run test-config
+npm run test-config-stubbed
+npm run test-odla
+npm run test-odla-special
+npm run test-odla-stubbed
+npm run test-odla-sandboxed
 ```
+
 <!--
 ### Linting
 
@@ -37,19 +47,11 @@ Run `npm run lint`
 ## Why
 -->
 
-### Examples
-#### UMD (Universal Module Definition) sample
-`AMD` and `CJS` (`CommonJS`) are both compatible with `UMD`.
-
-##### run UMD example that uses `require`.
-``` bash 
-node  ./samples/index.umd.js
-```
-##### run UMD example that uses `import`.
-``` bash 
-node  -r esm ./samples/index.umd.esm.js
-```
-##### run ESM example.
-``` bash 
-node  -r esm ./samples/index.esm.js
-```
+## Examples
+# [PhytoJS Samples for NodeJS](https://github.com/rondinif/phytojs/samples) 
+There are examples that use both `require` and `import` to reference the PhytoJS servive module. 
+- UMD (Universal Module Definition)
+    - `AMD` and `CJS` (`CommonJS`) are both compatible with `UMD`
+- ESM / ES6 (ECMAScript.next and TC39 Module Definition)
+# [PhytoJS Samples for the browser](https://github.com/rondinif/docs)
+## Live [Demo of PhytoJS running in the browser](https://rondinif.github.io/rondinif/phytojs)

docs/README.md

@@ -0,0 +1,54 @@
+# PhytoJS Samples for the web browser
+[./docs](../docs) has *use-cases* for the web browser, if you're looking for examples to run in nodejs please look at the [./docs](../docs folder; if you're looking for the documentation of the PhytoJS service component please look at the project [./README.md](../readme.md)  
+
+## Vanillajs (ECMAScript.next) MVC Example
+[Live Demo](https://rondinif.github.io/rondinif/phytojs)
+[demo sources](./docs/mvc)
+``` bash 
+# this demo require http-server; if you haven't install it `npm i http-server -g`
+npm start 
+# then navigate to http://localhost:8080 
+```
+
+
+
+<!--
+## JS 
+./bootstrap.js
+    - ./helpers.js
+    - ./app.js 
+        - ./phyto.js ( from witch import {updatePhyto} in app.js )
+            - :=[has a]=> docs/view.js (bind + render = abstracts away the browser's DOM completely) 
+                - phytoList
+                - phytoItemCounter
+                - newPhyto
+                    ( instantiated with a ./template.js )
+                      render(viewCmd, parameter) <<## riceve i vari diversi comandi dal controller 
+
+                        - defaultTemplate
+                        - show(data) - binds data to the template and shows (return) as a view
+                        - clearCompletedButton(phyta)
+                        - itemCounter
+            - :=[has a]=> Store initiated with a name ( see store.js )
+                - methods to manage local storage data:{ plsnts}
+            - :=[has a]=> Model that receive the Store when instantiated
+                :=[has a]=> Store initiate with a name ( see store.js )
+                - create(entityId, callback)  save the new entityId into the Store ##> used by controller.addItem
+                - read(query, callback) -- query the storage ##> used by controller.showAll, showCompleted
+                - update(id, data, callback)
+                - remove(id, callback)
+                - removeAll
+                - getCount
+            - :=[has + => Controller initiated with  (model, view)
+                - uses read/write to the storage by the model 
+                - send render commands to the view
+ 
+
+## CSS
+./app.css
+./pytoapp.css
+    - todpapp       phytoapp
+    - new-todo      new-phyto  
+    - todo-list     phyto-list
+
+-->

docs/mvc/app.css

@@ -0,0 +1,20 @@
+.toggle-graph {
+  float: left;
+  margin-left: 16px;
+  cursor: pointer;
+  position: relative;
+  z-index: 1;
+}
+.toggle-graph svg {
+  height: 20px;
+  width: 20px;
+}
+.toggle-graph svg path {
+  fill: #777;
+}
+
+.toggle-graph.active svg path,
+.toggle-graph:hover svg path,
+.toggle-graph:focus svg path {
+  fill: black;
+}

docs/mvc/app.js

@@ -0,0 +1,5 @@
+import {updatePhyto} from './phyto.js'
+
+export function onLoad() { // eslint-disable-line import/prefer-default-export
+  updatePhyto()
+}

docs/mvc/bootstrap.js

@@ -0,0 +1,11 @@
+/* eslint no-console:0 */
+// import {install as offlineInstall} from 'offline-plugin/runtime'
+import {onLoad} from './app.js'
+import {$on} from './helpers.js'
+
+
+$on(window, 'load', onLoad)
+$on(window, 'hashchange', onLoad)
+// if (process.env.NODE_ENV === 'production') {
+//   offlineInstall()
+// }