simplyview 2.0.2 → 2.0.3

package/dist/simply.everything.js

@@ -639,8 +639,8 @@ properties for a given parent, keep seperate index for this?
         handleEvents: function() {
             global.addEventListener('popstate', function() {
                 if (route.match(getPath(document.location.pathname + document.location.hash)) === false) {
-					route.match(getPath(document.location.pathname));
-				}
+                    route.match(getPath(document.location.pathname));
+                }
             });
             global.document.addEventListener('click', linkHandler);
         },
@@ -665,22 +665,24 @@ properties for a given parent, keep seperate index for this?
 
             var matches;
             if (!path) {
-				if (route.match(document.location.pathname+document.location.hash)) {
-					return true;
-				} else {
-					return route.match(document.location.pathname);
-				}
+                if (route.match(document.location.pathname+document.location.hash)) {
+                    return true;
+                } else {
+                    return route.match(document.location.pathname);
+                }
             }
             path = getPath(path);
             for ( var i=0; i<routeInfo.length; i++) {
-                if (path && path[path.length-1]!='/') {
-                    matches = routeInfo[i].match.exec(path+'/');
-                    if (matches) {
-                        path+='/';
-                        history.replaceState({}, '', getUrl(path));
+                matches = routeInfo[i].match.exec(path);
+                if (!matches || !matches.length) {
+                    if (path && path[path.length-1]!='/') {
+                        matches = routeInfo[i].match.exec(path+'/');
+                        if (matches) {
+                            path+='/';
+                            history.replaceState({}, '', getUrl(path));
+                        }
                     }
                 }
-                matches = routeInfo[i].match.exec(path);
                 if (matches && matches.length) {
                     var params = {};
                     routeInfo[i].params.forEach(function(key, i) {
@@ -697,9 +699,9 @@ properties for a given parent, keep seperate index for this?
                     args.result = routeInfo[i].action.call(route, params);
                     runListeners('finish', args);
                     return args.result;
-				}
+                }
             }
-			return false;
+            return false;
         },
         goto: function(path) {
             history.pushState({},'',getUrl(path));
@@ -734,7 +736,7 @@ properties for a given parent, keep seperate index for this?
             listeners[action][route] = listeners[action][route].filter(function(listener) {
                 return listener != callback;
             });
-		},
+        },
         init: function(params) {
             if (params.root) {
                 options.root = params.root;
@@ -1125,8 +1127,25 @@ properties for a given parent, keep seperate index for this?
             if (e.target.closest('[data-simply-keyboard]')) {
                 selectedKeyboard = e.target.closest('[data-simply-keyboard]').dataset.simplyKeyboard;
             }
-            if (keys[selectedKeyboard] && keys[selectedKeyboard][e.code]) {
-                keys[selectedKeyboard][e.code].call(app,e);
+            let key = '';
+            if (e.ctrlKey && e.keyCode!=17) {
+                key+='Control+';
+            }
+            if (e.metaKey && e.keyCode!=224) {
+                key+='Meta+';
+            }
+            if (e.altKey && e.keyCode!=18) {
+                key+='Alt+';
+            }
+            if (e.shiftKey && e.keyCode!=16) {
+                key+='Shift+';
+            }
+            key+=e.key;
+
+            if (keys[selectedKeyboard] && keys[selectedKeyboard][key]) {
+                let keyboard = keys[selectedKeyboard]
+                keyboard.app = app;
+                keyboard[key].call(keyboard,e);
             }
         });
 
@@ -1775,7 +1794,7 @@ properties for a given parent, keep seperate index for this?
     'use strict';
 
     var api = {
-		/**
+        /**
          * Returns a Proxy object that translates property access to a URL in the api
          * and method calls to a fetch on that URL.
          * @param options: a list of options for fetch(), 
@@ -1897,27 +1916,27 @@ properties for a given parent, keep seperate index for this?
          */
         getResult: function(response, options) {
             if (response.ok) {
-				switch(options.responseFormat) {
-					case 'text':
-						return response.text();
-					break;
-					case 'formData':
-						return response.formData();
-					break;
-					case 'blob':
-						return response.blob();
-					break;
-					case 'arrayBuffer':
-						return response.arrayBuffer();
-					break;
-					case 'unbuffered':
-						return response.body;
-					break;
-					case 'json':
-					default:
-		                return response.json();
-					break;
-				}
+                switch(options.responseFormat) {
+                    case 'text':
+                        return response.text();
+                    break;
+                    case 'formData':
+                        return response.formData();
+                    break;
+                    case 'blob':
+                        return response.blob();
+                    break;
+                    case 'arrayBuffer':
+                        return response.arrayBuffer();
+                    break;
+                    case 'unbuffered':
+                        return response.body;
+                    break;
+                    case 'json':
+                    default:
+                        return response.json();
+                    break;
+                }
             } else {
                 throw {
                     status: response.status,
@@ -1925,23 +1944,22 @@ properties for a given parent, keep seperate index for this?
                     response: response
                 }
             }
-		},
-
-		logError: function(error, options) {
+        },
+        logError: function(error, options) {
             console.error(error.status, error.message);
-		}
+        }
     }
 
     var defaultOptions = {
-		path: '',
-		responseFormat: 'json',
-		paramsFormat: 'search',
-		verbs: ['get','post'],
-		handlers: {
-			fetch:  api.fetch,
-			result: api.getResult,
-			error:  api.logError
-		}
+        path: '',
+        responseFormat: 'json',
+        paramsFormat: 'search',
+        verbs: ['get','post'],
+        handlers: {
+            fetch:  api.fetch,
+            result: api.getResult,
+            error:  api.logError
+        }
     };
 
     function cd(path, name) {
@@ -1952,20 +1970,20 @@ properties for a given parent, keep seperate index for this?
         return path+encodeURIComponent(name);
     }
 
-	function fetchChain(prop, params) {
-		var options = this;
-		return this.handlers.fetch
-			.call(this, prop, params, options)
-			.then(function(res) {
-				return options.handlers.result.call(options, res, options);
-			})
-			.catch(function(error) {
-				return options.handlers.error.call(options, error, options);
-			});
-	}
+    function fetchChain(prop, params) {
+        var options = this;
+        return this.handlers.fetch
+            .call(this, prop, params, options)
+            .then(function(res) {
+                return options.handlers.result.call(options, res, options);
+            })
+            .catch(function(error) {
+                return options.handlers.error.call(options, error, options);
+            });
+    }
 
     function getApiHandler(options) {
-		options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
+        options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
         options = Object.assign({}, defaultOptions, options);
 
         return {

package/js/simply.api.js

@@ -2,7 +2,7 @@
     'use strict';
 
     var api = {
-		/**
+        /**
          * Returns a Proxy object that translates property access to a URL in the api
          * and method calls to a fetch on that URL.
          * @param options: a list of options for fetch(), 
@@ -124,27 +124,27 @@
          */
         getResult: function(response, options) {
             if (response.ok) {
-				switch(options.responseFormat) {
-					case 'text':
-						return response.text();
-					break;
-					case 'formData':
-						return response.formData();
-					break;
-					case 'blob':
-						return response.blob();
-					break;
-					case 'arrayBuffer':
-						return response.arrayBuffer();
-					break;
-					case 'unbuffered':
-						return response.body;
-					break;
-					case 'json':
-					default:
-		                return response.json();
-					break;
-				}
+                switch(options.responseFormat) {
+                    case 'text':
+                        return response.text();
+                    break;
+                    case 'formData':
+                        return response.formData();
+                    break;
+                    case 'blob':
+                        return response.blob();
+                    break;
+                    case 'arrayBuffer':
+                        return response.arrayBuffer();
+                    break;
+                    case 'unbuffered':
+                        return response.body;
+                    break;
+                    case 'json':
+                    default:
+                        return response.json();
+                    break;
+                }
             } else {
                 throw {
                     status: response.status,
@@ -152,23 +152,22 @@
                     response: response
                 }
             }
-		},
-
-		logError: function(error, options) {
+        },
+        logError: function(error, options) {
             console.error(error.status, error.message);
-		}
+        }
     }
 
     var defaultOptions = {
-		path: '',
-		responseFormat: 'json',
-		paramsFormat: 'search',
-		verbs: ['get','post'],
-		handlers: {
-			fetch:  api.fetch,
-			result: api.getResult,
-			error:  api.logError
-		}
+        path: '',
+        responseFormat: 'json',
+        paramsFormat: 'search',
+        verbs: ['get','post'],
+        handlers: {
+            fetch:  api.fetch,
+            result: api.getResult,
+            error:  api.logError
+        }
     };
 
     function cd(path, name) {
@@ -179,20 +178,20 @@
         return path+encodeURIComponent(name);
     }
 
-	function fetchChain(prop, params) {
-		var options = this;
-		return this.handlers.fetch
-			.call(this, prop, params, options)
-			.then(function(res) {
-				return options.handlers.result.call(options, res, options);
-			})
-			.catch(function(error) {
-				return options.handlers.error.call(options, error, options);
-			});
-	}
+    function fetchChain(prop, params) {
+        var options = this;
+        return this.handlers.fetch
+            .call(this, prop, params, options)
+            .then(function(res) {
+                return options.handlers.result.call(options, res, options);
+            })
+            .catch(function(error) {
+                return options.handlers.error.call(options, error, options);
+            });
+    }
 
     function getApiHandler(options) {
-		options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
+        options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
         options = Object.assign({}, defaultOptions, options);
 
         return {

package/js/simply.keyboard.js

@@ -25,8 +25,25 @@
             if (e.target.closest('[data-simply-keyboard]')) {
                 selectedKeyboard = e.target.closest('[data-simply-keyboard]').dataset.simplyKeyboard;
             }
-            if (keys[selectedKeyboard] && keys[selectedKeyboard][e.code]) {
-                keys[selectedKeyboard][e.code].call(app,e);
+            let key = '';
+            if (e.ctrlKey && e.keyCode!=17) {
+                key+='Control+';
+            }
+            if (e.metaKey && e.keyCode!=224) {
+                key+='Meta+';
+            }
+            if (e.altKey && e.keyCode!=18) {
+                key+='Alt+';
+            }
+            if (e.shiftKey && e.keyCode!=16) {
+                key+='Shift+';
+            }
+            key+=e.key;
+
+            if (keys[selectedKeyboard] && keys[selectedKeyboard][key]) {
+                let keyboard = keys[selectedKeyboard]
+                keyboard.app = app;
+                keyboard[key].call(keyboard,e);
             }
         });
 

package/js/simply.route.js

@@ -118,8 +118,8 @@
         handleEvents: function() {
             global.addEventListener('popstate', function() {
                 if (route.match(getPath(document.location.pathname + document.location.hash)) === false) {
-					route.match(getPath(document.location.pathname));
-				}
+                    route.match(getPath(document.location.pathname));
+                }
             });
             global.document.addEventListener('click', linkHandler);
         },
@@ -144,22 +144,24 @@
 
             var matches;
             if (!path) {
-				if (route.match(document.location.pathname+document.location.hash)) {
-					return true;
-				} else {
-					return route.match(document.location.pathname);
-				}
+                if (route.match(document.location.pathname+document.location.hash)) {
+                    return true;
+                } else {
+                    return route.match(document.location.pathname);
+                }
             }
             path = getPath(path);
             for ( var i=0; i<routeInfo.length; i++) {
-                if (path && path[path.length-1]!='/') {
-                    matches = routeInfo[i].match.exec(path+'/');
-                    if (matches) {
-                        path+='/';
-                        history.replaceState({}, '', getUrl(path));
+                matches = routeInfo[i].match.exec(path);
+                if (!matches || !matches.length) {
+                    if (path && path[path.length-1]!='/') {
+                        matches = routeInfo[i].match.exec(path+'/');
+                        if (matches) {
+                            path+='/';
+                            history.replaceState({}, '', getUrl(path));
+                        }
                     }
                 }
-                matches = routeInfo[i].match.exec(path);
                 if (matches && matches.length) {
                     var params = {};
                     routeInfo[i].params.forEach(function(key, i) {
@@ -176,9 +178,9 @@
                     args.result = routeInfo[i].action.call(route, params);
                     runListeners('finish', args);
                     return args.result;
-				}
+                }
             }
-			return false;
+            return false;
         },
         goto: function(path) {
             history.pushState({},'',getUrl(path));
@@ -213,7 +215,7 @@
             listeners[action][route] = listeners[action][route].filter(function(listener) {
                 return listener != callback;
             });
-		},
+        },
         init: function(params) {
             if (params.root) {
                 options.root = params.root;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "simplyview",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Library to rapidly build UI components, using declarative tools",
   "main": "dist/simply.everything.js",
   "directories": {

package/examples/githubv4.html

@@ -1,107 +0,0 @@
-<!doctype html>
-<meta charset="utf-8">
-<pre id="output"></pre>
-<script src="../dist/simply.everything.js"></script>
-<script src="../js/simply.api.js"></script>
-<h1>Github repo browser</h1>
-<form data-simply-command="showRepo">
-	<label>Owner
-		<input type="text" name="owner">
-	</label>
-	<label>Repository
-		<input type="text" name="repo">
-	</label>
-	<label>Application token
-		<input type="text" name="token">
-	</label>
-	<button type="submit">OK</button>
-</form>
-<main>
-	<h2 data-simply-field="repo.name"></h2>
-	<div data-simply-field="repo.description"></div>
-	<ul data-simply-list="repo.files.entries">
-		<template>
-			<li><span data-simply-field="name"></span></li>
-		</template>
-	</ul>
-</main>
-<script>
-	simply.bind = false;
-	document.addEventListener('simply-content-loaded', function() {
-	 	editor.pageData.repo = {
-			name: "foo",
-			files: {
-				entries: [
-					{
-						name: 'barf'
-					}
-				]
-			}
-		};
-		return;
-	});
-
-
-    var githubURL = 'https://api.github.com/graphql';
-    var githubToken = 'af948d67c63a2f9f940e0b0be7a2d5ff3446327f';
-    var github = {
-        repository: simply.api.graphqlQuery(
-        	githubURL, 
-        	`query($owner:String!, $repo:String!) {
-			 	repository(name:$repo, owner:$owner) {
-			 		id
-			 		name
-			 		description
-			 		files: object(expression: "master:") {
-			 			... on Tree {
-			 				entries {
-			 					oid
-			 					name
-			 					type
-			 				}
-			 			}
-
-			 		}
-			 	}   
-			}`, 
-			{
-			    headers: { Authorization: 'bearer '+githubToken },
-			    responseResult: 'data.repository',
-			    responseErrors: 'errors'
-			}
-		)
-    };
-/*	
-    github.repository({
-        login: 'poef',
-        repo: 'arc-web'
-    }).then(function(data) {
-        document.getElementById('output').innerText = JSON.stringify(data,
-        null, 4);
-    });
-
-    async function foo() {
-	    var foo = await github.repository({ login: 'poef', repo: 'arc-web'});
-	    console.log(foo);
-	};
-	foo();
-*/
-	var githubBrowser = simply.app({
-		commands: {
-			'showRepo': function(form, values) {
-				if (values.token) {
-					githubToken = values.token;
-				}
-				github.repository({
-					owner: values.owner,
-					repo: values.repo
-				})
-				.then(function(data) {
-					githubBrowser.view.repo = data.data.repository;
-				});
-			}
-		}
-	})
-
-</script>
-<script src="//cdn.simplyedit.io/1/simply-edit.js"></script>

package/examples/graphql.html

@@ -1,51 +0,0 @@
-<!doctype html>
-<ul data-simply-list="vakleergebieden">
-<template>
-  <li><span data-simply-field="title"></span></li>
-</template>
-</ul>
-<script src="//cdn.simplyedit.io/1/simply-edit.js" data-storage="none"></script>
-<script src="../dist/simply.everything.js"></script>
-<script>
-    var baseURL = '//localhost:3000/';
-    
-    var app = simply.app({
-        routes: {
-            '/:*': function() {
-                api.Vakleergebied().then(result => {
-                    app.view.vakleergebieden = result.data.allVakleergebied;
-                });
-            }
-        },
-        view: {
-            vakleergebieden: []
-        }
-    });
-    
-    var api = simply.api.proxy({
-        baseURL: baseURL
-    });
-
-    api.Vakleergebied = simply.api.graphqlQuery(baseURL,
-	'Vakleergebied',
-`fragment NiveauShort on Niveau {
-    id
-    title
-    prefix
-}
-query Vakleergebied($page:Int,$perPage:Int) {
-  allVakleergebied(page:$page,perPage:$perPage,sortField:"title") {
-    id
-    prefix
-    title
-    prefix
-    Niveau {
-      ...NiveauShort
-    }
-  }
-  _allVakleergebiedMeta {
-    count
-  }
-}`);
-
-</script>

package/examples/graphql.html~

@@ -1,35 +0,0 @@
-<!doctype html>
-<script src="//cdn.simplyedit.io/1/simply-edit.js" data-storage="none"></script>
-<script src="../dist/simply.everything.js"></script>
-<script>
-        var baseURL = '//localhost:3000/';
-        
-	var api = simply.api.proxy({
-		baseURL: baseURL
-	});
-
-	api.Vakleergebied = simply.api.graphqlQuery(baseURL,
-	'Vakleergebied',
-`fragment NiveauShort on Niveau {
-    id
-    title
-    prefix
-}
-query Vakleergebied($page:Int,$perPage:Int) {
-  allVakleergebied(page:$page,perPage:$perPage,sortField:"title") {
-    id
-    prefix
-    title
-    prefix
-    Niveau {
-      ...NiveauShort
-    }
-  }
-  _allVakleergebiedMeta {
-    count
-  }
-}`);
-
-	api.Vakleergebied()
-	.then(result => console.log(result));
-</script>

package/examples/keyboard.html

@@ -1,41 +0,0 @@
-<h1>Examples</h1>
-<h2>Keyboard</h2>
-<link rel="stylesheet" href="examples.css">
-
-<div id="myApp">
-    <input type="text" data-simply-field="counter">
-    <button data-simply-command="add1">+</button>
-    <button data-simply-command="sub1">-</button>
-    <div>Counter is now: <span data-simply-field="counter"></span></div>
-</div>
-
-<script src="../dist/simply.everything.js"></script>
-<script src="//cdn.simplyedit.io/1/simply-edit.js"></script>
-<script>
-    var myApp = simply.app({
-        container: document.getElementById('myApp'),
-        keyboard: {
-            default: {
-                ArrowDown: function(e) {
-                    this.view.counter--;
-                    e.preventDefault();
-                },
-                ArrowUp: function(e) {
-                    this.view.counter++;
-                    e.preventDefault();
-                }
-            }
-        },
-        commands: {
-            add1: function(el, value) {
-                this.app.view.counter++;
-            },
-            sub1: function(el, value) {
-                this.app.view.counter--;
-            }
-        },
-        view: {
-            counter: 1
-        }
-    });
-</script>

package/make~

@@ -1,17 +0,0 @@
-#!/bin/bash
-rm dist/simply.everything.js
-cat js/simply.observe.js \
-    js/simply.render.js \
-    js/simply.path.js \
-    js/simply.route.js \
-    js/simply.activate.js \
-    js/simply.collect.js \
-    js/simply.command.js \
-    js/simply.action.js \
-    js/simply.resize.js \
-    js/simply.include.js \
-    js/simply.view.js \
-    js/simply.viewmodel.js \
-    js/simply.api.js \
-    js/simply.app.js > dist/simply.everything.js
-cp js/simply.include.next.js dist/

package/package.json~

@@ -1,31 +0,0 @@
-{
-  "name": "simplyview",
-  "version": "2.0.1",
-  "description": "Library to rapidly build UI components, using declarative tools",
-  "main": "dist/simply.everything.js",
-  "directories": {
-    "example": "examples"
-  },
-  "scripts": {
-    "test": "jest"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/simplyedit/simplyview.git"
-  },
-  "keywords": [
-    "UI",
-    "components",
-    "declarative",
-    "reactive"
-  ],
-  "author": "auke@muze.nl",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/simplyedit/simplyview/issues"
-  },
-  "homepage": "https://github.com/simplyedit/simplyview#readme",
-  "devDependencies": {
-    "jest": "^24.9.0"
-  }
-}