From e0956a2cd090ed15537374fc2f7fc8fdb617ff7f Mon Sep 17 00:00:00 2001
From: Kabir Shah <simplecooldude1@gmail.com>
Date: Fri, 3 Feb 2017 18:06:02 -0800
Subject: [PATCH] support for custom keycodes

---
 dist/moon.js              | 55 +++++++++++++++++++++++----------------
 dist/moon.min.js          |  2 +-
 src/directives/default.js | 17 +++++++++++-
 src/global/api.js         |  3 ++-
 src/index.js              |  7 -----
 5 files changed, 51 insertions(+), 33 deletions(-)

diff --git a/dist/moon.js b/dist/moon.js
index 102d9c1b..2911af75 100644
--- a/dist/moon.js
+++ b/dist/moon.js
@@ -17,13 +17,6 @@
     var directives = {};
     var specialDirectives = {};
     var components = {};
-    var eventModifiersCode = {
-      stop: 'event.stopPropagation();',
-      prevent: 'event.preventDefault();',
-      ctrl: 'if(!event.ctrlKey) {return;};',
-      shift: 'if(!event.shiftKey) {return;};',
-      alt: 'if(!event.altKey) {return;};'
-    };
     var id = 0;
     
     /* ======= Global Utilities ======= */
@@ -88,9 +81,9 @@
         if (customCode) {
           compiled = customCode(compiled, match, key, modifiers);
         } else if (isString) {
-          compiled = compiled.replace(match, '" + instance.get("' + key + '")' + modifiers + ' + "');
+          compiled = compiled.replace(match, "\" + instance.get(\"" + key + "\")" + modifiers + " + \"");
         } else {
-          compiled = compiled.replace(match, 'instance.get("' + key + '")' + modifiers);
+          compiled = compiled.replace(match, "instance.get(\"" + key + "\")" + modifiers);
         }
       });
       return compiled;
@@ -104,9 +97,9 @@
      */
     var createCall = function (vnode, metaIsString) {
       if (metaIsString) {
-        return 'h("' + vnode.type + '", ' + JSON.stringify(vnode.props) + ', ' + vnode.meta + ', ' + (vnode.children.join(",") || null) + ')';
+        return "h(\"" + vnode.type + "\", " + JSON.stringify(vnode.props) + ", " + vnode.meta + ", " + (vnode.children.join(",") || null) + ")";
       }
-      return 'h("' + vnode.type + '", ' + JSON.stringify(vnode.props) + ', ' + JSON.stringify(vnode.meta) + ', ' + (vnode.children.join(",") || null) + ')';
+      return "h(\"" + vnode.type + "\", " + JSON.stringify(vnode.props) + ", " + JSON.stringify(vnode.meta) + ", " + (vnode.children.join(",") || null) + ")";
     };
     
     /**
@@ -618,7 +611,7 @@
     var generateEl = function (el) {
       var code = "";
       if (typeof el === "string") {
-        code += '"' + el + '"';
+        code += "\"" + el + "\"";
       } else {
         // Recursively generate code for children
         el.children = el.children.map(generateEl);
@@ -647,7 +640,7 @@
       code = compileTemplate(code, true);
     
       // Escape Newlines
-      code = code.replace(NEWLINE_RE, '" + "\\n" + "');
+      code = code.replace(NEWLINE_RE, "\" + \"\\n\" + \"");
     
       try {
         return new Function("h", code);
@@ -686,14 +679,14 @@
       /* ======= Default Directives ======= */
     
       specialDirectives[Moon.config.prefix + "if"] = function (value, code, vnode) {
-        return '(' + compileTemplate(value, false) + ') ? ' + code + ' : \'\'';
+        return "(" + compileTemplate(value, false) + ") ? " + code + " : ''";
       };
     
       specialDirectives[Moon.config.prefix + "for"] = function (value, code, vnode) {
         var parts = value.split(" in ");
         var aliases = parts[0].split(",");
     
-        var iteratable = 'instance.get("' + parts[1] + '")';
+        var iteratable = "instance.get(\"" + parts[1] + "\")";
     
         var params = aliases.join(",");
     
@@ -701,21 +694,36 @@
           if (aliases.indexOf(key) === -1) {
             return compiled;
           }
-          return compiled.replace(match, '" + ' + key + modifiers + ' + "');
+          return compiled.replace(match, "\" + " + key + modifiers + " + \"");
         };
     
-        return 'instance.renderLoop(' + iteratable + ', function(' + params + ') { return ' + compileTemplate(code, true, customCode) + '; })';
+        return "instance.renderLoop(" + iteratable + ", function(" + params + ") { return " + compileTemplate(code, true, customCode) + "; })";
       };
     
       specialDirectives[Moon.config.prefix + "on"] = function (value, code, vnode) {
+        var eventModifiersCode = {
+          stop: 'event.stopPropagation();',
+          prevent: 'event.preventDefault();',
+          ctrl: 'if(!event.ctrlKey) {return;};',
+          shift: 'if(!event.shiftKey) {return;};',
+          alt: 'if(!event.altKey) {return;};'
+        };
+    
         var splitVal = value.split(":");
         // Extract modifiers and the event
         var rawModifiers = splitVal[0].split(".");
         var eventToCall = rawModifiers[0];
         var modifiers = "";
+    
         rawModifiers.shift();
+    
         for (var i = 0; i < rawModifiers.length; i++) {
-          modifiers += eventModifiersCode[rawModifiers[i]];
+          var rawModifier = rawModifiers[i];
+          if (Moon.config.keyCodes[rawModifier]) {
+            modifiers += "if(event.keyCode !== " + Moon.config.keyCodes[rawModifier] + ") {return;};";
+          } else if (eventModifiersCode[rawModifier]) {
+            modifiers += eventModifiersCode[rawModifier];
+          }
         }
     
         // Extract method to call afterwards
@@ -726,7 +734,7 @@
         if (!params) {
           params = "event";
         }
-        methodToCall += '(' + params + ')';
+        methodToCall += "(" + params + ")";
     
         // Code for all metadata
         var metadataCode = "{";
@@ -751,9 +759,9 @@
           var handlers = [];
           for (var i = 0; i < vnode.meta.eventListeners[eventType].length; i++) {
             var handler = vnode.meta.eventListeners[eventType][i];
-            handlers.push('function(event) {' + handler.modifiers + ' instance.$methods.' + handler.method + '}');
+            handlers.push("function(event) {" + handler.modifiers + " instance.$methods." + handler.method + "}");
           }
-          eventListenersCode += eventType + ': [' + handlers.join(",") + '],';
+          eventListenersCode += eventType + ": [" + handlers.join(",") + "],";
         }
     
         // Remove the ending comma, and close the object
@@ -764,7 +772,7 @@
     
         // Generate code for the metadata
         for (var key in vnode.meta) {
-          metadataCode += key + ': ' + vnode.meta[key] + ',';
+          metadataCode += key + ": " + vnode.meta[key] + ",";
         }
     
         // Remove ending comma, and close meta object
@@ -1022,7 +1030,8 @@
      */
     Moon.config = {
       silent: false,
-      prefix: "m-"
+      prefix: "m-",
+      keyCodes: {}
     };
     
     /**
diff --git a/dist/moon.min.js b/dist/moon.min.js
index ef6a4580..c1576b01 100644
--- a/dist/moon.min.js
+++ b/dist/moon.min.js
@@ -5,4 +5,4 @@
 * Free to use under the MIT license.
 * https://kingpixil.github.io/license
 */
-!function(t,e){"object"==typeof module&&module.exports?module.exports=e():t.Moon=e()}(this,function(){"use strict";function t(r){this.$opts=r||{};var s=this;this.$id=o++,this.$name=this.$opts.name||"root",this.$parent=this.$opts.parent||null,this.$data=this.$opts.data||{},this.$render=this.$opts.render||x,this.$hooks=this.$opts.hooks||{},this.$methods=this.$opts.methods||{},this.$events={},this.$dom={},this.$destroyed=!1,this.$initialRender=!0,this.$queued=!1,n[t.config.prefix+"if"]=function(t,e,n){return"("+p(t,!1)+") ? "+e+" : ''"},n[t.config.prefix+"for"]=function(t,e,n){var r=t.split(" in "),i=r[0].split(","),o='instance.get("'+r[1]+'")',s=i.join(","),u=function(t,e,n,r){return i.indexOf(n)===-1?t:t.replace(e,'" + '+n+r+' + "')};return"instance.renderLoop("+o+", function("+s+") { return "+p(e,!0,u)+"; })"},n[t.config.prefix+"on"]=function(t,e,n){var r=t.split(":"),o=r[0].split("."),s=o[0],u="";o.shift();for(var c=0;c<o.length;c++)u+=i[o[c]];var a=r[1].split("("),p=a[0];a.shift();var f=a.join(",").slice(0,-1);f||(f="event"),p+="("+f+")";var l="{",v="{";n.meta.eventListeners[s]?n.meta.eventListeners[s].push({method:p,modifiers:u}):n.meta.eventListeners[s]=[{method:p,modifiers:u}];for(var d in n.meta.eventListeners){for(var m=[],c=0;c<n.meta.eventListeners[d].length;c++){var y=n.meta.eventListeners[d][c];m.push("function(event) {"+y.modifiers+" instance.$methods."+y.method+"}")}v+=d+": ["+m.join(",")+"],"}v=v.slice(0,-1),v+="}",n.meta.eventListeners=v;for(var $ in n.meta)l+=$+": "+n.meta[$]+",";return l=l.slice(0,-1),l+="}",n.meta=l,h(n,!0)},n[t.config.prefix+"model"]=function(t,e,n){return n.meta.eventListeners.input?n.meta.eventListeners.input.push("__MOON__MODEL__UPDATE__"):n.meta.eventListeners.input=["__MOON__MODEL__UPDATE__"],h(n)},n[t.config.prefix+"once"]=function(t,e,n){return e=p(e,!1,function(t,e,n){return t.replace(e,s.get(n))})},e[t.config.prefix+"model"]=function(t,e,n){t.value=s.get(e)},e[t.config.prefix+"show"]=function(t,e,n){var r=new Function("return "+e);r()?t.style.display="block":t.style.display="none"},e[t.config.prefix+"pre"]=function(t,e,n){n.meta.shouldRender=!1},e[t.config.prefix+"text"]=function(t,e,n){t.textContent=e;for(var r=0;r<n.children.length;r++)n.children[r].meta.shouldRender=!1},e[t.config.prefix+"html"]=function(t,e,n){t.innerHTML=e;for(var r=0;r<n.children.length;r++)n.children[r].meta.shouldRender=!1},e[t.config.prefix+"mask"]=function(t,e,n){},this.init()}var e={},n={},r={},i={stop:"event.stopPropagation();",prevent:"event.preventDefault();",ctrl:"if(!event.ctrlKey) {return;};",shift:"if(!event.shiftKey) {return;};",alt:"if(!event.altKey) {return;};"},o=0,s=function(e){t.config.silent||console.log(e)},u=function(t){console.error("[Moon] ERR: "+t)},c=function(t){var e={};if(!t.attributes)return e;for(var n=t.attributes,r=0;r<n.length;r++)e[n[r].name]=n[r].value;return e},a=function(){return{shouldRender:!0,component:!1,eventListeners:{}}},p=function(t,e,n){var r=/{{([A-Za-z0-9_]+)([A-Za-z0-9_.()\[\]]+)?}}/gi,i=t;return t.replace(r,function(t,r,o){o||(o=""),i=n?n(i,t,r,o):e?i.replace(t,'" + instance.get("'+r+'")'+o+' + "'):i.replace(t,'instance.get("'+r+'")'+o)}),i},h=function(t,e){return e?'h("'+t.type+'", '+JSON.stringify(t.props)+", "+t.meta+", "+(t.children.join(",")||null)+")":'h("'+t.type+'", '+JSON.stringify(t.props)+", "+JSON.stringify(t.meta)+", "+(t.children.join(",")||null)+")"},f=function(t,e,n,r,i){return{type:t,val:e,props:n,children:r,meta:i||a()}},l=function(){for(var t=Array.prototype.slice.call(arguments),e=t.shift(),n=t.shift()||{},r=t.shift()||a(),i=[],o=0;o<t.length;o++){var s=t[o];Array.isArray(s)?i=i.concat(s):"string"==typeof t[o]||null===t[o]?i.push(f("#text",t[o]||"",{},[],r)):i.push(s)}return f(e,i.join(""),n,i,r)},v=function(t,e,n){var r=e.meta.eventListeners;for(var i in r)for(var o=0;o<r[i].length;o++){var s=r[i][o];if("__MOON__MODEL__UPDATE__"===s)return void t.addEventListener("input",function(t){n.set(e.props["m-model"],t.target.value)});n.$events[i]?n.on(i,s):t.addEventListener(i,s)}},d=function(t,e){var n;if("#text"===t.type)n=document.createTextNode(t.val);else{n=document.createElement(t.type);for(var r=t.children.map(function(t){return d(t,e)}),i=0;i<r.length;i++)n.appendChild(r[i]);v(n,t,e)}return m(n,{},t.props,t),n},m=function(t,r,i,o){var s=g(r,i);for(var u in s)!i[u]||e[u]||n[u]?(e[u]&&e[u](t,s[u],o),t.removeAttribute(u)):r[u]&&r[u]===i[u]||t.setAttribute(u,i[u])},y=function(t,e,n,r){var i;if(t&&(i=t.nodeName.toLowerCase()),!e||!e.meta||e.meta.shouldRender)if(t)if(e){if(i!==e.type)n.replaceChild(d(e,r),t);else if("#text"===i&&"#text"===e.type)t.textContent=e.val;else if(e.type){var o=c(t);m(t,o,e.props,e),r.$initialRender&&v(t,e,r);for(var s=0;s<e.children.length||s<t.childNodes.length;s++)y(t.childNodes[s],e.children[s],t,r)}}else n.removeChild(t);else n.appendChild(d(e,r))},$=function(t,e){for(var n in e)t[n]=e[n];return t},g=function(t,e){var n={};for(var r in t)n[r]=t[r];for(var r in e)n[r]=e[r];return n},k=function(t,e){var n=t.$hooks[e];n&&n()},x=function(){},_=function(t,e){var n={input:t,current:0,tokens:[]};return L(n),n.tokens},L=function(t){for(var e=t.input,n=e.length;t.current<n;)"<"===e.charAt(t.current)?"<!--"!==e.substr(t.current,4)?A(t):O(t):b(t)},b=function(t){var e=t.input,n=e.length,r=e.indexOf("<",t.current);return r===-1?(t.tokens.push({type:"text",value:e.slice(t.current)}),void(t.current=n)):void(r!==t.current&&(t.tokens.push({type:"text",value:e.slice(t.current,r)}),t.current=r))},O=function(t){var e=t.input,n=e.length;t.current+=4;var r=e.indexOf("-->",t.current);return r===-1?(t.tokens.push({type:"comment",value:e.slice(t.current)}),void(t.current=n)):(t.tokens.push({type:"comment",value:e.slice(t.current,r)}),void(t.current=r+3))},A=function(t){var e=t.input,n=(e.length,"/"===e.charAt(t.current+1));e.charAt(t.current);t.tokens.push({type:"tagStart",close:n}),t.current+=n?2:1;var r=E(t);M(t);var i="/"===e.charAt(t.current);t.tokens.push({type:"tagEnd",close:!1}),t.current+=i?2:1,i&&(t.tokens.push({type:"tagStart",close:!0}),t.tokens.push({type:"tag",value:r}),t.tokens.push({type:"attribute",value:{}}),t.tokens.push({type:"tagEnd",close:!1}))},E=function(t){for(var e=t.input,n=e.length,r=t.current;r<n;){var i=e.charAt(r);if("/"!==i&&">"!==i&&" "!==i)break;r++}for(var o=r;o<n;){var i=e.charAt(o);if("/"===i||">"===i||" "===i)break;o++}var s=e.slice(r,o);return t.tokens.push({type:"tag",value:s}),t.current=o,s},M=function(t){for(var e=t.input,n=e.length,r=t.current,i={},o="",s=/([^=\s]*)(=?)("[^"]*"|[^\s"]*)/gi;r<n;){var u=e.charAt(r);if(">"===u||"/"===u)break;o+=u,r++}o.replace(s,function(t,e,n,r){var o=r[0],s=r[r.length-1];("'"===o&&"'"===s||'"'===o&&'"'===s)&&(r=r.slice(1,-1)),r||(r=e),e&&r&&(i[e]=r)}),t.current=r,t.tokens.push({type:"attribute",value:i})},N=function(t){for(var e={type:"ROOT",children:[]},n={current:0,tokens:t};n.current<t.length;){var r=T(n);r&&e.children.push(r)}return e},R=function(t,e,n){return{type:t,props:e,children:n}},T=function(t){var e=t.tokens[t.current],n=t.tokens[t.current-1],r=t.tokens[t.current+1],i=t.tokens[t.current+2],o=t.tokens[t.current+3],s=function(o){t.current+=void 0===o?1:o,e=t.tokens[t.current],n=t.tokens[t.current-1],r=t.tokens[t.current+1],i=t.tokens[t.current+2]};if("text"===e.type)return s(),n.value;if("comment"===e.type)return void s();if("tagStart"===e.type&&!e.close&&!o.close){var u=R(r.value,i.value,[]);r.value;s(4);var c=t.current;if(e){for(;"tagStart"!==e.type||"tagStart"===e.type&&!e.close;){var a=T(t);if(a&&u.children.push(a),s(0),!e){t.current=c-1;break}}s()}return u}s()},S=function(t){var e="";if("string"==typeof t)e+='"'+t+'"';else{t.children=t.children.map(S),t.meta||(t.meta=a());var r=h(t);for(var i in t.props)n[i]&&(r=n[i](t.props[i],r,t));e+=r}return e},j=function(t){var e=/\n/g,n=t.children[0],r="var instance = this; return "+S(n);r=p(r,!0),r=r.replace(e,'" + "\\n" + "');try{return new Function("h",r)}catch(t){return u("Could not create render function"),x}},C=function(t){var e=_(t),n=N(e);return j(n)};return t.prototype.get=function(t){return this.$data[t]},t.prototype.set=function(t,e){var n=this;this.$data[t]=e,this.$queued||this.$destroyed||(this.$queued=!0,setTimeout(function(){n.build(),k(n,"updated"),n.$queued=!1},0))},t.prototype.destroy=function(){this.removeEvents(),this.$destroyed=!0,k(this,"destroyed")},t.prototype.callMethod=function(t,e){e=e||[],this.$methods[t].apply(this,e)},t.prototype.on=function(t,e){this.$events[t]?this.$events[t].push(e):this.$events[t]=[e]},t.prototype.off=function(t,e){var n=this.$events[t].indexOf(e);n!==-1&&this.$events[t].splice(n,1)},t.prototype.removeEvents=function(){for(var t in this.$events)this.$events[t]=[]},t.prototype.emit=function(t,e){if(e=e||{},e.type=t,this.$events["*"])for(var n=0;n<this.$events["*"].length;n++){var r=this.$events["*"][n];r(e)}for(var n=0;n<this.$events[t].length;n++){var i=this.$events[t][n];i(e)}},t.prototype.renderLoop=function(t,e){for(var n=[],r=0;r<t.length;r++)n.push(e(t[r],r));return n},t.prototype.mount=function(e){this.$el=document.querySelector(e),this.$destroyed=!1,this.$el||u("Element "+this.$opts.el+" not found"),this.$el.__moon__=this,this.$template=this.$opts.template||this.$el.outerHTML,this.$render===x&&(this.$render=t.compile(this.$template)),this.build(),k(this,"mounted")},t.prototype.render=function(){return this.$render(l)},t.prototype.patch=function(t,e,n){y(t,e,n,this),this.$initialRender=!1},t.prototype.build=function(){this.$dom=this.render(),this.patch(this.$el,this.$dom,this.$el.parentNode)},t.prototype.init=function(){s("======= Moon ======="),k(this,"created"),this.$opts.el&&this.mount(this.$opts.el)},t.config={silent:!1,prefix:"m-"},t.version="0.1.3",t.util={noop:x,error:u,log:s,merge:g,extend:$},t.use=function(e){e.init(t)},t.compile=function(t){return C(t)},t.nextTick=function(t){setTimeout(t,0)},t.directive=function(n,r){e[t.config.prefix+n]=r},t.component=function(e,n){function i(){t.call(this,n)}var o=this;return n.name=e,n.parent=parent,i.prototype=Object.create(o.prototype),i.prototype.constructor=i,i.prototype.init=function(){this.$destroyed=!1,this.$props=this.$opts.props||[],this.$template=this.$opts.template,this.$render===x&&(this.$render=t.compile(this.$template))},i.prototype.build=function(){this.$parent.build()},r[e]=i,i},t});
\ No newline at end of file
+!function(t,e){"object"==typeof module&&module.exports?module.exports=e():t.Moon=e()}(this,function(){"use strict";function t(r){this.$opts=r||{};var o=this;this.$id=i++,this.$name=this.$opts.name||"root",this.$parent=this.$opts.parent||null,this.$data=this.$opts.data||{},this.$render=this.$opts.render||k,this.$hooks=this.$opts.hooks||{},this.$methods=this.$opts.methods||{},this.$events={},this.$dom={},this.$destroyed=!1,this.$initialRender=!0,this.$queued=!1,n[t.config.prefix+"if"]=function(t,e,n){return"("+a(t,!1)+") ? "+e+" : ''"},n[t.config.prefix+"for"]=function(t,e,n){var r=t.split(" in "),i=r[0].split(","),o='instance.get("'+r[1]+'")',s=i.join(","),u=function(t,e,n,r){return i.indexOf(n)===-1?t:t.replace(e,'" + '+n+r+' + "')};return"instance.renderLoop("+o+", function("+s+") { return "+a(e,!0,u)+"; })"},n[t.config.prefix+"on"]=function(e,n,r){var i={stop:"event.stopPropagation();",prevent:"event.preventDefault();",ctrl:"if(!event.ctrlKey) {return;};",shift:"if(!event.shiftKey) {return;};",alt:"if(!event.altKey) {return;};"},o=e.split(":"),s=o[0].split("."),u=s[0],c="";s.shift();for(var a=0;a<s.length;a++){var h=s[a];t.config.keyCodes[h]?c+="if(event.keyCode !== "+t.config.keyCodes[h]+") {return;};":i[h]&&(c+=i[h])}var f=o[1].split("("),l=f[0];f.shift();var v=f.join(",").slice(0,-1);v||(v="event"),l+="("+v+")";var d="{",m="{";r.meta.eventListeners[u]?r.meta.eventListeners[u].push({method:l,modifiers:c}):r.meta.eventListeners[u]=[{method:l,modifiers:c}];for(var y in r.meta.eventListeners){for(var $=[],a=0;a<r.meta.eventListeners[y].length;a++){var g=r.meta.eventListeners[y][a];$.push("function(event) {"+g.modifiers+" instance.$methods."+g.method+"}")}m+=y+": ["+$.join(",")+"],"}m=m.slice(0,-1),m+="}",r.meta.eventListeners=m;for(var k in r.meta)d+=k+": "+r.meta[k]+",";return d=d.slice(0,-1),d+="}",r.meta=d,p(r,!0)},n[t.config.prefix+"model"]=function(t,e,n){return n.meta.eventListeners.input?n.meta.eventListeners.input.push("__MOON__MODEL__UPDATE__"):n.meta.eventListeners.input=["__MOON__MODEL__UPDATE__"],p(n)},n[t.config.prefix+"once"]=function(t,e,n){return e=a(e,!1,function(t,e,n){return t.replace(e,o.get(n))})},e[t.config.prefix+"model"]=function(t,e,n){t.value=o.get(e)},e[t.config.prefix+"show"]=function(t,e,n){var r=new Function("return "+e);r()?t.style.display="block":t.style.display="none"},e[t.config.prefix+"pre"]=function(t,e,n){n.meta.shouldRender=!1},e[t.config.prefix+"text"]=function(t,e,n){t.textContent=e;for(var r=0;r<n.children.length;r++)n.children[r].meta.shouldRender=!1},e[t.config.prefix+"html"]=function(t,e,n){t.innerHTML=e;for(var r=0;r<n.children.length;r++)n.children[r].meta.shouldRender=!1},e[t.config.prefix+"mask"]=function(t,e,n){},this.init()}var e={},n={},r={},i=0,o=function(e){t.config.silent||console.log(e)},s=function(t){console.error("[Moon] ERR: "+t)},u=function(t){var e={};if(!t.attributes)return e;for(var n=t.attributes,r=0;r<n.length;r++)e[n[r].name]=n[r].value;return e},c=function(){return{shouldRender:!0,component:!1,eventListeners:{}}},a=function(t,e,n){var r=/{{([A-Za-z0-9_]+)([A-Za-z0-9_.()\[\]]+)?}}/gi,i=t;return t.replace(r,function(t,r,o){o||(o=""),i=n?n(i,t,r,o):e?i.replace(t,'" + instance.get("'+r+'")'+o+' + "'):i.replace(t,'instance.get("'+r+'")'+o)}),i},p=function(t,e){return e?'h("'+t.type+'", '+JSON.stringify(t.props)+", "+t.meta+", "+(t.children.join(",")||null)+")":'h("'+t.type+'", '+JSON.stringify(t.props)+", "+JSON.stringify(t.meta)+", "+(t.children.join(",")||null)+")"},h=function(t,e,n,r,i){return{type:t,val:e,props:n,children:r,meta:i||c()}},f=function(){for(var t=Array.prototype.slice.call(arguments),e=t.shift(),n=t.shift()||{},r=t.shift()||c(),i=[],o=0;o<t.length;o++){var s=t[o];Array.isArray(s)?i=i.concat(s):"string"==typeof t[o]||null===t[o]?i.push(h("#text",t[o]||"",{},[],r)):i.push(s)}return h(e,i.join(""),n,i,r)},l=function(t,e,n){var r=e.meta.eventListeners;for(var i in r)for(var o=0;o<r[i].length;o++){var s=r[i][o];if("__MOON__MODEL__UPDATE__"===s)return void t.addEventListener("input",function(t){n.set(e.props["m-model"],t.target.value)});n.$events[i]?n.on(i,s):t.addEventListener(i,s)}},v=function(t,e){var n;if("#text"===t.type)n=document.createTextNode(t.val);else{n=document.createElement(t.type);for(var r=t.children.map(function(t){return v(t,e)}),i=0;i<r.length;i++)n.appendChild(r[i]);l(n,t,e)}return d(n,{},t.props,t),n},d=function(t,r,i,o){var s=$(r,i);for(var u in s)!i[u]||e[u]||n[u]?(e[u]&&e[u](t,s[u],o),t.removeAttribute(u)):r[u]&&r[u]===i[u]||t.setAttribute(u,i[u])},m=function(t,e,n,r){var i;if(t&&(i=t.nodeName.toLowerCase()),!e||!e.meta||e.meta.shouldRender)if(t)if(e){if(i!==e.type)n.replaceChild(v(e,r),t);else if("#text"===i&&"#text"===e.type)t.textContent=e.val;else if(e.type){var o=u(t);d(t,o,e.props,e),r.$initialRender&&l(t,e,r);for(var s=0;s<e.children.length||s<t.childNodes.length;s++)m(t.childNodes[s],e.children[s],t,r)}}else n.removeChild(t);else n.appendChild(v(e,r))},y=function(t,e){for(var n in e)t[n]=e[n];return t},$=function(t,e){var n={};for(var r in t)n[r]=t[r];for(var r in e)n[r]=e[r];return n},g=function(t,e){var n=t.$hooks[e];n&&n()},k=function(){},x=function(t,e){var n={input:t,current:0,tokens:[]};return _(n),n.tokens},_=function(t){for(var e=t.input,n=e.length;t.current<n;)"<"===e.charAt(t.current)?"<!--"!==e.substr(t.current,4)?O(t):b(t):L(t)},L=function(t){var e=t.input,n=e.length,r=e.indexOf("<",t.current);return r===-1?(t.tokens.push({type:"text",value:e.slice(t.current)}),void(t.current=n)):void(r!==t.current&&(t.tokens.push({type:"text",value:e.slice(t.current,r)}),t.current=r))},b=function(t){var e=t.input,n=e.length;t.current+=4;var r=e.indexOf("-->",t.current);return r===-1?(t.tokens.push({type:"comment",value:e.slice(t.current)}),void(t.current=n)):(t.tokens.push({type:"comment",value:e.slice(t.current,r)}),void(t.current=r+3))},O=function(t){var e=t.input,n=(e.length,"/"===e.charAt(t.current+1));e.charAt(t.current);t.tokens.push({type:"tagStart",close:n}),t.current+=n?2:1;var r=A(t);E(t);var i="/"===e.charAt(t.current);t.tokens.push({type:"tagEnd",close:!1}),t.current+=i?2:1,i&&(t.tokens.push({type:"tagStart",close:!0}),t.tokens.push({type:"tag",value:r}),t.tokens.push({type:"attribute",value:{}}),t.tokens.push({type:"tagEnd",close:!1}))},A=function(t){for(var e=t.input,n=e.length,r=t.current;r<n;){var i=e.charAt(r);if("/"!==i&&">"!==i&&" "!==i)break;r++}for(var o=r;o<n;){var i=e.charAt(o);if("/"===i||">"===i||" "===i)break;o++}var s=e.slice(r,o);return t.tokens.push({type:"tag",value:s}),t.current=o,s},E=function(t){for(var e=t.input,n=e.length,r=t.current,i={},o="",s=/([^=\s]*)(=?)("[^"]*"|[^\s"]*)/gi;r<n;){var u=e.charAt(r);if(">"===u||"/"===u)break;o+=u,r++}o.replace(s,function(t,e,n,r){var o=r[0],s=r[r.length-1];("'"===o&&"'"===s||'"'===o&&'"'===s)&&(r=r.slice(1,-1)),r||(r=e),e&&r&&(i[e]=r)}),t.current=r,t.tokens.push({type:"attribute",value:i})},C=function(t){for(var e={type:"ROOT",children:[]},n={current:0,tokens:t};n.current<t.length;){var r=N(n);r&&e.children.push(r)}return e},M=function(t,e,n){return{type:t,props:e,children:n}},N=function(t){var e=t.tokens[t.current],n=t.tokens[t.current-1],r=t.tokens[t.current+1],i=t.tokens[t.current+2],o=t.tokens[t.current+3],s=function(o){t.current+=void 0===o?1:o,e=t.tokens[t.current],n=t.tokens[t.current-1],r=t.tokens[t.current+1],i=t.tokens[t.current+2]};if("text"===e.type)return s(),n.value;if("comment"===e.type)return void s();if("tagStart"===e.type&&!e.close&&!o.close){var u=M(r.value,i.value,[]);r.value;s(4);var c=t.current;if(e){for(;"tagStart"!==e.type||"tagStart"===e.type&&!e.close;){var a=N(t);if(a&&u.children.push(a),s(0),!e){t.current=c-1;break}}s()}return u}s()},R=function(t){var e="";if("string"==typeof t)e+='"'+t+'"';else{t.children=t.children.map(R),t.meta||(t.meta=c());var r=p(t);for(var i in t.props)n[i]&&(r=n[i](t.props[i],r,t));e+=r}return e},T=function(t){var e=/\n/g,n=t.children[0],r="var instance = this; return "+R(n);r=a(r,!0),r=r.replace(e,'" + "\\n" + "');try{return new Function("h",r)}catch(t){return s("Could not create render function"),k}},S=function(t){var e=x(t),n=C(e);return T(n)};return t.prototype.get=function(t){return this.$data[t]},t.prototype.set=function(t,e){var n=this;this.$data[t]=e,this.$queued||this.$destroyed||(this.$queued=!0,setTimeout(function(){n.build(),g(n,"updated"),n.$queued=!1},0))},t.prototype.destroy=function(){this.removeEvents(),this.$destroyed=!0,g(this,"destroyed")},t.prototype.callMethod=function(t,e){e=e||[],this.$methods[t].apply(this,e)},t.prototype.on=function(t,e){this.$events[t]?this.$events[t].push(e):this.$events[t]=[e]},t.prototype.off=function(t,e){var n=this.$events[t].indexOf(e);n!==-1&&this.$events[t].splice(n,1)},t.prototype.removeEvents=function(){for(var t in this.$events)this.$events[t]=[]},t.prototype.emit=function(t,e){if(e=e||{},e.type=t,this.$events["*"])for(var n=0;n<this.$events["*"].length;n++){var r=this.$events["*"][n];r(e)}for(var n=0;n<this.$events[t].length;n++){var i=this.$events[t][n];i(e)}},t.prototype.renderLoop=function(t,e){for(var n=[],r=0;r<t.length;r++)n.push(e(t[r],r));return n},t.prototype.mount=function(e){this.$el=document.querySelector(e),this.$destroyed=!1,this.$el||s("Element "+this.$opts.el+" not found"),this.$el.__moon__=this,this.$template=this.$opts.template||this.$el.outerHTML,this.$render===k&&(this.$render=t.compile(this.$template)),this.build(),g(this,"mounted")},t.prototype.render=function(){return this.$render(f)},t.prototype.patch=function(t,e,n){m(t,e,n,this),this.$initialRender=!1},t.prototype.build=function(){this.$dom=this.render(),this.patch(this.$el,this.$dom,this.$el.parentNode)},t.prototype.init=function(){o("======= Moon ======="),g(this,"created"),this.$opts.el&&this.mount(this.$opts.el)},t.config={silent:!1,prefix:"m-",keyCodes:{}},t.version="0.1.3",t.util={noop:k,error:s,log:o,merge:$,extend:y},t.use=function(e){e.init(t)},t.compile=function(t){return S(t)},t.nextTick=function(t){setTimeout(t,0)},t.directive=function(n,r){e[t.config.prefix+n]=r},t.component=function(e,n){function i(){t.call(this,n)}var o=this;return n.name=e,n.parent=parent,i.prototype=Object.create(o.prototype),i.prototype.constructor=i,i.prototype.init=function(){this.$destroyed=!1,this.$props=this.$opts.props||[],this.$template=this.$opts.template,this.$render===k&&(this.$render=t.compile(this.$template))},i.prototype.build=function(){this.$parent.build()},r[e]=i,i},t});
\ No newline at end of file
diff --git a/src/directives/default.js b/src/directives/default.js
index 260f992e..d6706d6a 100644
--- a/src/directives/default.js
+++ b/src/directives/default.js
@@ -23,14 +23,29 @@ specialDirectives[Moon.config.prefix + "for"] = function(value, code, vnode) {
 }
 
 specialDirectives[Moon.config.prefix + "on"] = function(value, code, vnode) {
+  var eventModifiersCode = {
+    stop: 'event.stopPropagation();',
+    prevent: 'event.preventDefault();',
+    ctrl: 'if(!event.ctrlKey) {return;};',
+    shift: 'if(!event.shiftKey) {return;};',
+    alt: 'if(!event.altKey) {return;};'
+  };
+
   var splitVal = value.split(":");
   // Extract modifiers and the event
   var rawModifiers = splitVal[0].split(".");
   var eventToCall = rawModifiers[0];
   var modifiers = "";
+
   rawModifiers.shift();
+
   for(var i = 0; i < rawModifiers.length; i++) {
-    modifiers += eventModifiersCode[rawModifiers[i]];
+    var rawModifier = rawModifiers[i];
+    if(Moon.config.keyCodes[rawModifier]) {
+      modifiers += `if(event.keyCode !== ${Moon.config.keyCodes[rawModifier]}) {return;};`;
+    } else if(eventModifiersCode[rawModifier]) {
+      modifiers += eventModifiersCode[rawModifier];
+    }
   }
 
   // Extract method to call afterwards
diff --git a/src/global/api.js b/src/global/api.js
index 8f7b7d39..fb73b0e2 100644
--- a/src/global/api.js
+++ b/src/global/api.js
@@ -5,7 +5,8 @@
  */
 Moon.config = {
   silent: false,
-  prefix: "m-"
+  prefix: "m-",
+  keyCodes: {}
 }
 
 /**
diff --git a/src/index.js b/src/index.js
index 8df7e8e7..8149ded5 100644
--- a/src/index.js
+++ b/src/index.js
@@ -4,13 +4,6 @@
 var directives = {};
 var specialDirectives = {};
 var components = {};
-var eventModifiersCode = {
-  stop: 'event.stopPropagation();',
-  prevent: 'event.preventDefault();',
-  ctrl: 'if(!event.ctrlKey) {return;};',
-  shift: 'if(!event.shiftKey) {return;};',
-  alt: 'if(!event.altKey) {return;};'
-};
 var id = 0;
 
 //=require util/util.js