simplyview 1.0.0 → 2.0.2

package/js/simply.app.js

@@ -1,5 +1,7 @@
-this.simply = (function(simply, global) {
-    simply.app = function(options) {
+(function(global) {
+    'use strict';
+
+    var app = function(options) {
         if (!options) {
             options = {};
         }
@@ -13,12 +15,22 @@ this.simply = (function(simply, global) {
             }
             if ( options.routes ) {
                 simply.route.load(options.routes);
+                if (options.routeEvents) {
+                    Object.keys(options.routeEvents).forEach(function(action) {
+                        Object.keys(options.routeEvents[action]).forEach(function(route) {
+                            options.routeEvents[action][route].forEach(function(callback) {
+                                simply.route.addListener(action, route, callback);
+                            });
+                        });
+                    });
+                }
                 simply.route.handleEvents();
                 global.setTimeout(function() {
-                    simply.route.match(global.location.pathname);
+                    simply.route.match(global.location.pathname+global.location.hash);
                 });
             }
-            this.container = options.container  || document.body;
+            this.container = options.container || document.body;
+            this.keyboard  = simply.keyboard ? simply.keyboard(this, options.keyboard || {}) : false;
             this.actions   = simply.action ? simply.action(this, options.actions) : false;
             this.commands  = simply.command ? simply.command(this, options.commands) : false;
             this.resize    = simply.resize ? simply.resize(this, options.resize) : false;
@@ -36,10 +48,16 @@ this.simply = (function(simply, global) {
             return this.container.querySelector('[data-simply-id='+id+']') || document.getElementById(id);
         };
 
-        var app = new simplyApp(options);
-
-        return app;
+        return new simplyApp(options);
     };
 
-    return simply;
-})(this.simply || {}, this);
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = app;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.app = app;
+    }
+
+})(this);

package/js/simply.collect.js

@@ -1,8 +1,9 @@
-this.simply = (function(simply, global) {
+(function(global) {
+    'use strict';
 
     var knownCollections = {};
     
-    simply.collect = {
+    var collect = {
         addListener: function(name, callback) {
             if (!knownCollections[name]) {
                 knownCollections[name] = [];
@@ -35,7 +36,7 @@ this.simply = (function(simply, global) {
         return el;
     }
     
-    document.addEventListener('change', function(evt) {
+    global.addEventListener('change', function(evt) {
         var root = null;
         var name = '';
         if (evt.target.dataset.simplyElement) {
@@ -59,6 +60,13 @@ this.simply = (function(simply, global) {
         }
     }, true);
 
-    return simply;
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = collect;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.collect = collect;
+    }
 
-})(this.simply || {}, this);
+})(this);

package/js/simply.command.js

@@ -1,4 +1,5 @@
-this.simply = (function(simply, global) {
+(function(global) {
+    'use strict';
 
     var defaultCommands = {
         'simply-hide': function(el, value) {
@@ -44,6 +45,16 @@ this.simply = (function(simply, global) {
         {
             match: 'input,select,textarea',
             get: function(el) {
+                if (el.tagName==='SELECT' && el.multiple) {
+                    var values = [], opt;
+                    for (var i=0,l=el.options.length;i<l;i++) {
+                        var opt = el.options[i];
+                        if (opt.selected) {
+                            values.push(opt.value);
+                        }
+                    }
+                    return values;
+                }
                 return el.dataset.simplyValue || el.value;
             },
             check: function(el, evt) {
@@ -64,7 +75,19 @@ this.simply = (function(simply, global) {
             get: function(el) {
                 var data = {};
                 [].forEach.call(el.elements, function(el) {
-                    data[el.name] = el.value;
+                    if (el.tagName=='INPUT' && (el.type=='checkbox' || el.type=='radio')) {
+                        if (!el.checked) {
+                            return;
+                        }
+                    }
+                    if (data[el.name] && !Array.isArray(data[el.name])) {
+                        data[el.name] = [data[el.name]];
+                    }
+                    if (Array.isArray(data[el.name])) {
+                        data[el.name].push(el.value);
+                    } else {
+                        data[el.name] = el.value;
+                    }
                 });
                 return data;//new FormData(el);
             },
@@ -110,7 +133,7 @@ this.simply = (function(simply, global) {
         return null;
     }
 
-    simply.command = function(app, inCommands) {
+    var command = function(app, inCommands) {
 
         var commands = Object.create(defaultCommands);
         for (var i in inCommands) {
@@ -161,6 +184,13 @@ this.simply = (function(simply, global) {
         return commands;
     };
 
-    return simply;
-    
-})(this.simply || {}, this);
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = command;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.command = command;
+    }
+ 
+})(this);

package/js/simply.include.js

@@ -1,4 +1,5 @@
-this.simply = (function (simply, global) {
+(function (global) {
+    'use strict';
 
     var throttle = function( callbackFunction, intervalTime ) {
         var eventId = 0;
@@ -45,8 +46,19 @@ this.simply = (function (simply, global) {
     };
 
     var observer, loaded = {};
-    var head = document.documentElement.querySelector('head');
-    var currentScript = document.currentScript;
+    var head = global.document.querySelector('head');
+    var currentScript = global.document.currentScript;
+    if (!currentScript) {
+        var getScriptURL = (function() {
+            var scripts = document.getElementsByTagName('script');
+            var index = scripts.length - 1;
+            var myScript = scripts[index];
+            return function() { return myScript.src; };
+        })();
+        var currentScriptURL = getScriptURL();
+    } else {
+        var currentScriptURL = currentScript.src;
+    }
 
     var waitForPreviousScripts = function() {
         // because of the async=false attribute, this script will run after
@@ -54,10 +66,10 @@ this.simply = (function (simply, global) {
         // simply.include.next.js only fires the simply-next-script event
         // that triggers the Promise.resolve method
         return new Promise(function(resolve) {
-            var next = document.createElement('script');
-            next.src = rebaseHref('simply.include.next.js', currentScript.src);
+            var next = global.document.createElement('script');
+            next.src = rebaseHref('simply.include.next.js', currentScriptURL);
             next.async = false;
-            document.addEventListener('simply-include-next', function() {
+            global.document.addEventListener('simply-include-next', function() {
                 head.removeChild(next);
                 resolve();
             }, { once: true, passive: true});
@@ -67,7 +79,7 @@ this.simply = (function (simply, global) {
 
     var scriptLocations = [];
 
-    simply.include = {
+    var include = {
         scripts: function(scripts, base) {
             var arr = [];
             for(var i = scripts.length; i--; arr.unshift(scripts[i]));
@@ -79,9 +91,9 @@ this.simply = (function (simply, global) {
                 var attrs  = [].map.call(script.attributes, function(attr) {
                     return attr.name;
                 });
-                var clone  = document.createElement('script');
+                var clone  = global.document.createElement('script');
                 attrs.forEach(function(attr) {
-                    clone.setAttribute(attr, script[attr]);
+                    clone.setAttribute(attr, script.getAttribute(attr));
                 });
                 clone.removeAttribute('data-simply-location');
                 if (!clone.src) {
@@ -111,7 +123,7 @@ this.simply = (function (simply, global) {
             }
         },
         html: function(html, link) {
-            var fragment = document.createRange().createContextualFragment(html);
+            var fragment = global.document.createRange().createContextualFragment(html);
             var stylesheets = fragment.querySelectorAll('link[rel="stylesheet"],style');
             // add all stylesheets to head
             [].forEach.call(stylesheets, function(stylesheet) {
@@ -122,12 +134,12 @@ this.simply = (function (simply, global) {
             });
             // remove the scripts from the fragment, as they will not run in the
             // order in which they are defined
-            var scriptsFragment = document.createDocumentFragment();
+            var scriptsFragment = global.document.createDocumentFragment();
             // FIXME: this loses the original position of the script
             // should add a placeholder so we can reinsert the clone
             var scripts = fragment.querySelectorAll('script');
             [].forEach.call(scripts, function(script) {
-                var placeholder = document.createComment(script.src || 'inline script');
+                var placeholder = global.document.createComment(script.src || 'inline script');
                 script.parentNode.insertBefore(placeholder, script);
                 script.dataset.simplyLocation = scriptLocations.length;
                 scriptLocations.push(placeholder);
@@ -138,7 +150,7 @@ this.simply = (function (simply, global) {
             global.setTimeout(function() {
                 if (global.editor && global.editor.data && fragment.querySelector('[data-simply-field],[data-simply-list]')) {
                     //TODO: remove this dependency and let simply.bind listen for dom node insertions (and simply-edit.js use simply.bind)
-                    global.editor.data.apply(editor.currentData, document);
+                    global.editor.data.apply(global.editor.currentData, global.document);
                 }
                 simply.include.scripts(scriptsFragment.childNodes, link ? link.href : global.location.href );
             }, 10);
@@ -183,7 +195,7 @@ this.simply = (function (simply, global) {
 
     var handleChanges = throttle(function() {
         runWhenIdle(function() {
-            var links = document.querySelectorAll('link[rel="simply-include"],link[rel="simply-include-once"]');
+            var links = global.document.querySelectorAll('link[rel="simply-include"],link[rel="simply-include-once"]');
             if (links.length) {
                 includeLinks(links);
             }
@@ -192,14 +204,23 @@ this.simply = (function (simply, global) {
 
     var observe = function() {
         observer = new MutationObserver(handleChanges);
-        observer.observe(document, {
+        observer.observe(global.document, {
             subtree: true,
             childList: true,
         });
     };
 
     observe();
+    handleChanges(); // check if there are include links in the dom already
+
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = include;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.include = include;
+    }
 
-    return simply;
 
-})(this.simply || {}, this);
+})(this);

package/js/simply.keyboard.js

@@ -0,0 +1,45 @@
+(function(global) {
+    'use strict';
+
+    function keyboard(app, config) {
+        var keys = config;
+
+        if (!app) {
+            app = {};
+        }
+        if (!app.container) {
+            app.container = document.body;
+        }
+        app.container.addEventListener('keydown', (e) => {
+            if (e.isComposing || e.keyCode === 229) {
+                return;
+            }
+            if (e.defaultPrevented) {
+                return;
+            }
+            if (!e.target) {
+                return;
+            }
+
+            let selectedKeyboard = 'default';
+            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);
+            }
+        });
+
+        return keys;
+    }
+
+
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = keyboard;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.keyboard = keyboard;
+    }
+})(this);

package/js/simply.modules.js

@@ -0,0 +1,22 @@
+(function() {
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        var simply = {
+            command: require('simply.command.js'),
+            action:  require('simply.action.js'),
+            route:   require('simply.route.js'),
+            view:    require('simply.view.js'),
+			viewmodel: require('simply.viewmodel.js'),
+            resize:  require('simply.resize.js'),
+            activate:require('simply.active.js'),
+            include: require('simply.include.js'),
+            render:  require('simply.render.js'),
+            observe: require('simply.observe.js'),
+            bind:    require('simply.bind.js'),
+            app:     require('simply.app.js'),
+            collect: require('simply.collect.js'),
+            path:    require('simply.path.js')
+        }
+
+        module.exports = simply;
+    }
+})();

package/js/simply.observe.js

@@ -39,7 +39,9 @@
 properties for a given parent, keep seperate index for this?
  */
 
-this.simply = (function (simply, global) {
+(function (global) {
+    'use strict';
+
     var changeListeners = new WeakMap();
     var parentListeners = new WeakMap();
     var childListeners = new WeakMap();
@@ -315,7 +317,7 @@ this.simply = (function (simply, global) {
     // model.foo = { }
     // model.foo.bar = 'zab'; // this should trigger the observer but doesn't
 
-    simply.observe = function(model, path, callback, options) {
+    var observe = function(model, path, callback, options) {
         if (!path) {
             var keys = Object.keys(model);
             keys.forEach(function(key) {
@@ -336,5 +338,12 @@ this.simply = (function (simply, global) {
         }
     };
 
-    return simply;
-})(this.simply || {}, this);
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = observe;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.observe = observe;
+    }
+})(this);

package/js/simply.path.js

@@ -1,6 +1,7 @@
-this.simply = (function(simply) {
+(function(global) {
+    'us strict';
 
-    simply.path = {
+    var path = {
         get: function(model, path) {
             if (!path) {
                 return model;
@@ -36,5 +37,12 @@ this.simply = (function(simply) {
         }
     };
 
-    return simply;
-})(this.simply || {});
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = path;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.path = path;
+    }
+})(this);

package/js/simply.render.js

@@ -1,8 +1,7 @@
-this.simply = (function(simply, global) {
+(function(global) {
+    'use strict';
 
-//    var templates = new WeakMap();
-
-    simply.render = function(options) {
+    var render = function(options) {
         if (!options) {
             options = {};
         }
@@ -115,5 +114,12 @@ this.simply = (function(simply, global) {
         return options;
     };
 
-    return simply;
-})(this.simply || {}, this);
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = render;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.render = render;
+    }
+})(this);

package/js/simply.resize.js

@@ -1,18 +1,19 @@
-this.simply = (function(simply, global) {
+(function(global) {
+    'use strict';
 
-	simply.resize = function(app, config) {
-		if (!config) {
-			config = {};
-		}
-		if (!config.sizes) {
-        	config.sizes     = {
-	            'simply-tiny'   : 0,
-	            'simply-xsmall' : 480,
-	            'simply-small'  : 768,
-	            'simply-medium' : 992,
-	            'simply-large'  : 1200
-	        };
-		}
+    var resize = function(app, config) {
+        if (!config) {
+            config = {};
+        }
+        if (!config.sizes) {
+            config.sizes     = {
+                'simply-tiny'   : 0,
+                'simply-xsmall' : 480,
+                'simply-small'  : 768,
+                'simply-medium' : 992,
+                'simply-large'  : 1200
+            };
+        }
 
         var lastSize = 0;
         function resizeSniffer() {
@@ -31,6 +32,7 @@ this.simply = (function(simply, global) {
                 } else {
                     if ( !app.container.classList.contains(match) ) {
                         app.container.classList.add(match);
+                        match = sizes.pop(); // skip to next match to remove these
                     }
                     break;
                 }
@@ -40,7 +42,7 @@ this.simply = (function(simply, global) {
                 if ( app.container.classList.contains(match)) {
                     app.container.classList.remove(match);
                 }
-                match=sizes.pop();
+                match = sizes.pop();
             }
             var toolbars = app.container.querySelectorAll('.simply-toolbar');
             [].forEach.call(toolbars, function(toolbar) {
@@ -64,9 +66,15 @@ this.simply = (function(simply, global) {
             });
         }
 
-		return resizeSniffer;
-	};
+        return resizeSniffer;
+    };
 
-	return simply;
-
-})(this.simply || {}, this);
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = resize;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.resize = resize;
+    }
+})(this);