simple-virtual-keyboard - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

build/index.js

@@ -1,1 +0,1 @@
-!function(){"use strict";var o={d:function(t,e){for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o:function(o,t){return Object.prototype.hasOwnProperty.call(o,t)},r:function(o){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(o,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(o,"__esModule",{value:!0})}},t={};o.r(t),o.d(t,{DefaultKeyboardLayout:function(){return d},default:function(){return f}});var e=function(o,t){o&&Object.assign(o.style,t)};function n(o,t){for(var e=0;e<t.length;e++){var n=t[e];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(o,n.key,n)}}var i=function(){function o(t,e){!function(o,t){if(!(o instanceof t))throw new TypeError("Cannot call a class as a function")}(this,o),this.config=t,this.style=e,this.element=null,this.handler=null}var t,i;return t=o,(i=[{key:"code",get:function(){return this.config.code}},{key:"content",get:function(){return this.config.content}},{key:"shiftContent",get:function(){var o;return null!==(o=this.config.shiftContent)&&void 0!==o?o:null}},{key:"isBackspace",get:function(){var o;return null!==(o=this.config.isBackspace)&&void 0!==o&&o}},{key:"isTab",get:function(){var o;return null!==(o=this.config.isTab)&&void 0!==o&&o}},{key:"isCaps",get:function(){var o;return null!==(o=this.config.isCaps)&&void 0!==o&&o}},{key:"isEnter",get:function(){var o;return null!==(o=this.config.isEnter)&&void 0!==o&&o}},{key:"isShift",get:function(){var o;return null!==(o=this.config.isShift)&&void 0!==o&&o}},{key:"isSpace",get:function(){var o;return null!==(o=this.config.isSpace)&&void 0!==o&&o}},{key:"isMeta",get:function(){return this.isBackspace||this.isTab||this.isCaps||this.isEnter||this.isShift||this.isSpace}},{key:"setHandler",value:function(o){this.handler=o}},{key:"toggleCase",value:function(o){this.isMeta||(this.config.content=o?this.content.toUpperCase():this.content.toLowerCase())}},{key:"render",value:function(){var o=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=document.createElement("div");return t.classList.add("a-virtual-keyboard__button"),t.innerText=o&&this.config.shiftContent||this.config.content,e(t,{gridColumn:"".concat(this.config.columnPosition," / span ").concat(this.config.columnSize),gridRow:"".concat(this.config.rowPosition," / span ").concat(this.config.rowSize),justifySelf:"center",alignSelf:"center",background:this.style.background,borderRadius:this.style.borderRadius}),this.element=t,t}},{key:"press",value:function(){var o=this;if(!this.element)throw new Error("Button is not rendered");this.push(),window.setTimeout((function(){return o.unPush()}),this.style.pressDuration)}},{key:"push",value:function(){e(this.element,{background:this.style.pressBackground})}},{key:"unPush",value:function(){e(this.element,{background:this.style.background})}}])&&n(t.prototype,i),o}();function r(o,t){var e=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),e.push.apply(e,n)}return e}function c(o,t,e){return t in o?Object.defineProperty(o,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):o[t]=e,o}function s(o,t){for(var e=0;e<t.length;e++){var n=t[e];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(o,n.key,n)}}function u(o,t){var e=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),e.push.apply(e,n)}return e}function l(o){for(var t=1;t<arguments.length;t++){var e=null!=arguments[t]?arguments[t]:{};t%2?u(Object(e),!0).forEach((function(t){a(o,t,e[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(e)):u(Object(e)).forEach((function(t){Object.defineProperty(o,t,Object.getOwnPropertyDescriptor(e,t))}))}return o}function a(o,t,e){return t in o?Object.defineProperty(o,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):o[t]=e,o}var d=function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){},t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return l({columnsCount:15,rowsCount:5,columnGap:"5px",rowGap:"8px",additionalStyles:{maxWidth:"1300px"},onButtonClick:o,style:{padding:"10px",background:"#4cbefa",borderTop:"1px solid #7acffb",borderBottom:"1px solid #49a9db",button:{minWidth:"35px",minHeight:"50px",background:"#78e2aa",border:"1px solid #a1ebc4",borderRadius:"5px",pressDuration:150,pressBackground:"blue"}},buttons:[{columnSize:1,rowSize:1,columnPosition:1,rowPosition:1,code:"Backquote",content:"`",shiftContent:"~"},{columnSize:1,rowSize:1,columnPosition:2,rowPosition:1,code:"Digit1",content:"1",shiftContent:"!"},{columnSize:1,rowSize:1,columnPosition:3,rowPosition:1,code:"Digit2",content:"2",shiftContent:"@"},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:1,code:"Digit3",content:"3",shiftContent:"#"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:1,code:"Digit4",content:"4",shiftContent:"$"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:1,code:"Digit5",content:"5",shiftContent:"%"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:1,code:"Digit6",content:"6",shiftContent:"^"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:1,code:"Digit7",content:"7",shiftContent:"7"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:1,code:"Digit8",content:"8",shiftContent:"*"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:1,code:"Digit9",content:"9",shiftContent:"("},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:1,code:"Digit0",content:"0",shiftContent:")"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:1,code:"Minus",content:"-",shiftContent:"_"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:1,code:"Equal",content:"=",shiftContent:"+"},{columnSize:2,rowSize:1,columnPosition:14,rowPosition:1,code:"Backspace",content:"<-",isBackspace:!0},{columnSize:2,rowSize:1,columnPosition:1,rowPosition:2,code:"Tab",content:"TAB",isTab:!0},{columnSize:1,rowSize:1,columnPosition:3,rowPosition:2,code:"KeyQ",content:"Q"},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:2,code:"KeyW",content:"W"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:2,code:"KeyE",content:"E"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:2,code:"KeyR",content:"R"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:2,code:"KeyT",content:"T"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:2,code:"KeyY",content:"Y"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:2,code:"KeyU",content:"U"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:2,code:"KeyI",content:"I"},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:2,code:"KeyO",content:"O"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:2,code:"KeyP",content:"P"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:2,code:"BracketLeft",content:"[",shiftContent:"{"},{columnSize:1,rowSize:1,columnPosition:14,rowPosition:2,code:"BracketRight",content:"]",shiftContent:"}"},{columnSize:1,rowSize:1,columnPosition:15,rowPosition:2,code:"Backslash",content:"\\",shiftContent:"|"},{columnSize:2,rowSize:1,columnPosition:1,rowPosition:3,code:"CapsLock",content:"CAPS",isCaps:!0},{columnSize:1,rowSize:1,columnPosition:3,rowPosition:3,code:"KeyA",content:"A"},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:3,code:"KeyS",content:"S"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:3,code:"KeyD",content:"D"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:3,code:"KeyF",content:"F"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:3,code:"KeyG",content:"G"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:3,code:"KeyH",content:"H"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:3,code:"KeyJ",content:"J"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:3,code:"KeyK",content:"K"},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:3,code:"KeyL",content:"L"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:3,code:"Semicolon",content:";",shiftContent:":"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:3,code:"Quote",content:"'",shiftContent:'"'},{columnSize:2,rowSize:1,columnPosition:14,rowPosition:3,code:"Enter",content:"ENTER",isEnter:!0},{columnSize:3,rowSize:1,columnPosition:1,rowPosition:4,code:"ShiftLeft",content:"SHIFT",isShift:!0},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:4,code:"KeyZ",content:"Z"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:4,code:"KeyX",content:"X"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:4,code:"KeyC",content:"C"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:4,code:"KeyV",content:"V"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:4,code:"KeyB",content:"B"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:4,code:"KeyN",content:"N"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:4,code:"KeyM",content:"M"},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:4,code:"Comma",content:",",shiftContent:"<"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:4,code:"Period",content:".",shiftContent:">"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:4,code:"Slash",content:"/",shiftContent:"?"},{columnSize:2,rowSize:1,columnPosition:14,rowPosition:4,code:"ShiftRight",content:"SHIFT",isShift:!0},{columnSize:8,rowSize:1,columnPosition:5,rowPosition:5,code:"Space",content:"",isSpace:!0}]},t)},f=function(){function o(t){!function(o,t){if(!(o instanceof t))throw new TypeError("Cannot call a class as a function")}(this,o),this.config=t,this.rendered=document.createElement("div"),this.renderedButtons=[],this.capsMode=!1,this.init()}var t,n;return t=o,(n=[{key:"init",value:function(){var o=this;this.rendered.classList.add("a-virtual-keyboard"),e(this.rendered,{width:this.config.width,height:this.config.height}),this.renderLayout(),this.renderButtons(),document.addEventListener("keydown",this.onButtonAction(void 0)),document.addEventListener("keydown",(function(t){t.shiftKey&&o.enableShiftMode(t.code)})),document.addEventListener("keyup",(function(t){"ShiftRight"!==t.code&&"ShiftLeft"!==t.code||o.disableShiftMode(t.code)}))}},{key:"mount",value:function(o){var t=document.querySelector(o);t&&t.appendChild(this.rendered)}},{key:"destroy",value:function(){this.destroyButtons(),this.rendered.remove()}},{key:"renderLayout",value:function(){e(this.rendered,function(o){for(var t=1;t<arguments.length;t++){var e=null!=arguments[t]?arguments[t]:{};t%2?r(Object(e),!0).forEach((function(t){c(o,t,e[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(e)):r(Object(e)).forEach((function(t){Object.defineProperty(o,t,Object.getOwnPropertyDescriptor(e,t))}))}return o}({display:"grid",gridTemplateColumns:"repeat(".concat(this.config.layout.columnsCount,", minmax(").concat(this.config.layout.style.button.minWidth,", 1fr))"),gridTemplateRows:"repeat(".concat(this.config.layout.rowsCount,", minmax(").concat(this.config.layout.style.button.minHeight,", 1fr))"),rowGap:this.config.layout.rowGap,columnGap:this.config.layout.columnGap,padding:this.config.layout.style.padding,background:this.config.layout.style.background,borderTop:this.config.layout.style.borderTop,borderBottom:this.config.layout.style.borderBottom,borderLeft:this.config.layout.style.borderLeft,borderRight:this.config.layout.style.borderRight,border:this.config.layout.style.border},this.config.layout.additionalStyles))}},{key:"enableShiftMode",value:function(o){this.renderedButtons.forEach((function(t){t.isShift&&o===t.code&&t.push()})),this.enableCapsMode()}},{key:"disableShiftMode",value:function(o){this.renderedButtons.forEach((function(t){t.isShift&&o===t.code&&t.unPush()})),this.capsMode&&this.disableCapsMode()}},{key:"onButtonAction",value:function(o){var t=this;return function(e){var n=o;e instanceof KeyboardEvent&&(n=null==e?void 0:e.code);var i=t.renderedButtons.find((function(o){return o.code===n}));if(i){if(null==e||e.preventDefault(),i.isCaps)return void t.toggleCapsMode();i.isShift||i.press(),e instanceof KeyboardEvent&&null!=e&&e.key&&(isNaN(parseFloat(e.key))||!isFinite(e.key))&&((null==e?void 0:e.key)===i.content.toLowerCase()&&t.disableCapsMode(),(null==e?void 0:e.key)===i.content.toUpperCase()&&t.enableCapsMode());var r=i.content;null!=e&&e.shiftKey&&i.shiftContent&&(r=i.shiftContent),t.config.layout.onButtonClick(i.code,r,i.isBackspace,i.isTab,i.isEnter,i.isSpace,i.isShift)}}}},{key:"toggleCapsMode",value:function(){this.capsMode=!this.capsMode,this.rerenderButtons()}},{key:"enableCapsMode",value:function(){this.capsMode||(this.capsMode=!0,this.rerenderButtons(!1,!0))}},{key:"disableCapsMode",value:function(){this.capsMode&&(this.capsMode=!1,this.rerenderButtons(!1))}},{key:"rerenderButtons",value:function(){var o=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];this.destroyButtons(),this.renderButtons(o,t)}},{key:"destroyButtons",value:function(){this.renderedButtons.map((function(o){var t;return null===(t=o.element)||void 0===t?void 0:t.removeEventListener("click",o.handler)})),this.renderedButtons=[],this.rendered.innerHTML=""}},{key:"renderButtons",value:function(){var o=this,t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];this.config.layout.buttons.forEach((function(n){var r=new i(n,o.config.layout.style.button);r.toggleCase(o.capsMode);var c=r.render(e);if(!o.config.listenMode){var s=o.onButtonAction(r.code);r.setHandler(s),c.addEventListener("click",s)}t&&r.isCaps&&r.press(),o.renderedButtons.push(r),o.rendered.appendChild(c)}))}}])&&s(t.prototype,n),o}();module.exports["simple-virtual-keyboard"]=t}();
+define("simple-virtual-keyboard",[],(function(){return function(){"use strict";var o={d:function(t,e){for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o:function(o,t){return Object.prototype.hasOwnProperty.call(o,t)},r:function(o){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(o,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(o,"__esModule",{value:!0})}},t={};o.r(t),o.d(t,{DefaultKeyboardLayout:function(){return d},default:function(){return f}});var e=function(o,t){o&&Object.assign(o.style,t)};function n(o,t){for(var e=0;e<t.length;e++){var n=t[e];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(o,n.key,n)}}var i=function(){function o(t,e){!function(o,t){if(!(o instanceof t))throw new TypeError("Cannot call a class as a function")}(this,o),this.config=t,this.style=e,this.element=null,this.handler=null}var t,i;return t=o,(i=[{key:"code",get:function(){return this.config.code}},{key:"content",get:function(){return this.config.content}},{key:"shiftContent",get:function(){var o;return null!==(o=this.config.shiftContent)&&void 0!==o?o:null}},{key:"isBackspace",get:function(){var o;return null!==(o=this.config.isBackspace)&&void 0!==o&&o}},{key:"isTab",get:function(){var o;return null!==(o=this.config.isTab)&&void 0!==o&&o}},{key:"isCaps",get:function(){var o;return null!==(o=this.config.isCaps)&&void 0!==o&&o}},{key:"isEnter",get:function(){var o;return null!==(o=this.config.isEnter)&&void 0!==o&&o}},{key:"isShift",get:function(){var o;return null!==(o=this.config.isShift)&&void 0!==o&&o}},{key:"isSpace",get:function(){var o;return null!==(o=this.config.isSpace)&&void 0!==o&&o}},{key:"isMeta",get:function(){return this.isBackspace||this.isTab||this.isCaps||this.isEnter||this.isShift||this.isSpace}},{key:"setHandler",value:function(o){this.handler=o}},{key:"toggleCase",value:function(o){this.isMeta||(this.config.content=o?this.content.toUpperCase():this.content.toLowerCase())}},{key:"render",value:function(){var o=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=document.createElement("div");return t.classList.add("a-virtual-keyboard__button"),t.innerText=o&&this.config.shiftContent||this.config.content,e(t,{gridColumn:"".concat(this.config.columnPosition," / span ").concat(this.config.columnSize),gridRow:"".concat(this.config.rowPosition," / span ").concat(this.config.rowSize),justifySelf:"center",alignSelf:"center",background:this.style.background,borderRadius:this.style.borderRadius}),this.element=t,t}},{key:"press",value:function(){var o=this;if(!this.element)throw new Error("Button is not rendered");this.push(),window.setTimeout((function(){return o.unPush()}),this.style.pressDuration)}},{key:"push",value:function(){e(this.element,{background:this.style.pressBackground})}},{key:"unPush",value:function(){e(this.element,{background:this.style.background})}}])&&n(t.prototype,i),o}();function r(o,t){var e=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),e.push.apply(e,n)}return e}function c(o,t,e){return t in o?Object.defineProperty(o,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):o[t]=e,o}function s(o,t){for(var e=0;e<t.length;e++){var n=t[e];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(o,n.key,n)}}function u(o,t){var e=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),e.push.apply(e,n)}return e}function l(o){for(var t=1;t<arguments.length;t++){var e=null!=arguments[t]?arguments[t]:{};t%2?u(Object(e),!0).forEach((function(t){a(o,t,e[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(e)):u(Object(e)).forEach((function(t){Object.defineProperty(o,t,Object.getOwnPropertyDescriptor(e,t))}))}return o}function a(o,t,e){return t in o?Object.defineProperty(o,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):o[t]=e,o}var d=function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){},t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return l({columnsCount:15,rowsCount:5,columnGap:"5px",rowGap:"8px",additionalStyles:{maxWidth:"1300px"},onButtonClick:o,style:{padding:"10px",background:"#4cbefa",borderTop:"1px solid #7acffb",borderBottom:"1px solid #49a9db",button:{minWidth:"35px",minHeight:"50px",background:"#78e2aa",border:"1px solid #a1ebc4",borderRadius:"5px",pressDuration:150,pressBackground:"blue"}},buttons:[{columnSize:1,rowSize:1,columnPosition:1,rowPosition:1,code:"Backquote",content:"`",shiftContent:"~"},{columnSize:1,rowSize:1,columnPosition:2,rowPosition:1,code:"Digit1",content:"1",shiftContent:"!"},{columnSize:1,rowSize:1,columnPosition:3,rowPosition:1,code:"Digit2",content:"2",shiftContent:"@"},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:1,code:"Digit3",content:"3",shiftContent:"#"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:1,code:"Digit4",content:"4",shiftContent:"$"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:1,code:"Digit5",content:"5",shiftContent:"%"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:1,code:"Digit6",content:"6",shiftContent:"^"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:1,code:"Digit7",content:"7",shiftContent:"7"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:1,code:"Digit8",content:"8",shiftContent:"*"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:1,code:"Digit9",content:"9",shiftContent:"("},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:1,code:"Digit0",content:"0",shiftContent:")"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:1,code:"Minus",content:"-",shiftContent:"_"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:1,code:"Equal",content:"=",shiftContent:"+"},{columnSize:2,rowSize:1,columnPosition:14,rowPosition:1,code:"Backspace",content:"<-",isBackspace:!0},{columnSize:2,rowSize:1,columnPosition:1,rowPosition:2,code:"Tab",content:"TAB",isTab:!0},{columnSize:1,rowSize:1,columnPosition:3,rowPosition:2,code:"KeyQ",content:"Q"},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:2,code:"KeyW",content:"W"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:2,code:"KeyE",content:"E"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:2,code:"KeyR",content:"R"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:2,code:"KeyT",content:"T"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:2,code:"KeyY",content:"Y"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:2,code:"KeyU",content:"U"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:2,code:"KeyI",content:"I"},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:2,code:"KeyO",content:"O"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:2,code:"KeyP",content:"P"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:2,code:"BracketLeft",content:"[",shiftContent:"{"},{columnSize:1,rowSize:1,columnPosition:14,rowPosition:2,code:"BracketRight",content:"]",shiftContent:"}"},{columnSize:1,rowSize:1,columnPosition:15,rowPosition:2,code:"Backslash",content:"\\",shiftContent:"|"},{columnSize:2,rowSize:1,columnPosition:1,rowPosition:3,code:"CapsLock",content:"CAPS",isCaps:!0},{columnSize:1,rowSize:1,columnPosition:3,rowPosition:3,code:"KeyA",content:"A"},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:3,code:"KeyS",content:"S"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:3,code:"KeyD",content:"D"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:3,code:"KeyF",content:"F"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:3,code:"KeyG",content:"G"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:3,code:"KeyH",content:"H"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:3,code:"KeyJ",content:"J"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:3,code:"KeyK",content:"K"},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:3,code:"KeyL",content:"L"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:3,code:"Semicolon",content:";",shiftContent:":"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:3,code:"Quote",content:"'",shiftContent:'"'},{columnSize:2,rowSize:1,columnPosition:14,rowPosition:3,code:"Enter",content:"ENTER",isEnter:!0},{columnSize:3,rowSize:1,columnPosition:1,rowPosition:4,code:"ShiftLeft",content:"SHIFT",isShift:!0},{columnSize:1,rowSize:1,columnPosition:4,rowPosition:4,code:"KeyZ",content:"Z"},{columnSize:1,rowSize:1,columnPosition:5,rowPosition:4,code:"KeyX",content:"X"},{columnSize:1,rowSize:1,columnPosition:6,rowPosition:4,code:"KeyC",content:"C"},{columnSize:1,rowSize:1,columnPosition:7,rowPosition:4,code:"KeyV",content:"V"},{columnSize:1,rowSize:1,columnPosition:8,rowPosition:4,code:"KeyB",content:"B"},{columnSize:1,rowSize:1,columnPosition:9,rowPosition:4,code:"KeyN",content:"N"},{columnSize:1,rowSize:1,columnPosition:10,rowPosition:4,code:"KeyM",content:"M"},{columnSize:1,rowSize:1,columnPosition:11,rowPosition:4,code:"Comma",content:",",shiftContent:"<"},{columnSize:1,rowSize:1,columnPosition:12,rowPosition:4,code:"Period",content:".",shiftContent:">"},{columnSize:1,rowSize:1,columnPosition:13,rowPosition:4,code:"Slash",content:"/",shiftContent:"?"},{columnSize:2,rowSize:1,columnPosition:14,rowPosition:4,code:"ShiftRight",content:"SHIFT",isShift:!0},{columnSize:8,rowSize:1,columnPosition:5,rowPosition:5,code:"Space",content:"",isSpace:!0}]},t)},f=function(){function o(t){!function(o,t){if(!(o instanceof t))throw new TypeError("Cannot call a class as a function")}(this,o),this.config=t,this.rendered=document.createElement("div"),this.renderedButtons=[],this.capsMode=!1,this.init()}var t,n;return t=o,(n=[{key:"init",value:function(){var o=this;this.rendered.classList.add("a-virtual-keyboard"),e(this.rendered,{width:this.config.width,height:this.config.height}),this.renderLayout(),this.renderButtons(),document.addEventListener("keydown",this.onButtonAction(void 0)),document.addEventListener("keydown",(function(t){t.shiftKey&&o.enableShiftMode(t.code)})),document.addEventListener("keyup",(function(t){"ShiftRight"!==t.code&&"ShiftLeft"!==t.code||o.disableShiftMode(t.code)}))}},{key:"mount",value:function(o){var t=document.querySelector(o);t&&t.appendChild(this.rendered)}},{key:"destroy",value:function(){this.destroyButtons(),this.rendered.remove()}},{key:"renderLayout",value:function(){e(this.rendered,function(o){for(var t=1;t<arguments.length;t++){var e=null!=arguments[t]?arguments[t]:{};t%2?r(Object(e),!0).forEach((function(t){c(o,t,e[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(e)):r(Object(e)).forEach((function(t){Object.defineProperty(o,t,Object.getOwnPropertyDescriptor(e,t))}))}return o}({display:"grid",gridTemplateColumns:"repeat(".concat(this.config.layout.columnsCount,", minmax(").concat(this.config.layout.style.button.minWidth,", 1fr))"),gridTemplateRows:"repeat(".concat(this.config.layout.rowsCount,", minmax(").concat(this.config.layout.style.button.minHeight,", 1fr))"),rowGap:this.config.layout.rowGap,columnGap:this.config.layout.columnGap,padding:this.config.layout.style.padding,background:this.config.layout.style.background,borderTop:this.config.layout.style.borderTop,borderBottom:this.config.layout.style.borderBottom,borderLeft:this.config.layout.style.borderLeft,borderRight:this.config.layout.style.borderRight,border:this.config.layout.style.border},this.config.layout.additionalStyles))}},{key:"enableShiftMode",value:function(o){this.renderedButtons.forEach((function(t){t.isShift&&o===t.code&&t.push()})),this.enableCapsMode()}},{key:"disableShiftMode",value:function(o){this.renderedButtons.forEach((function(t){t.isShift&&o===t.code&&t.unPush()})),this.capsMode&&this.disableCapsMode()}},{key:"onButtonAction",value:function(o){var t=this;return function(e){var n=o;e instanceof KeyboardEvent&&(n=null==e?void 0:e.code);var i=t.renderedButtons.find((function(o){return o.code===n}));if(i){if(null==e||e.preventDefault(),i.isCaps)return void t.toggleCapsMode();i.isShift||i.press(),e instanceof KeyboardEvent&&null!=e&&e.key&&(isNaN(parseFloat(e.key))||!isFinite(e.key))&&((null==e?void 0:e.key)===i.content.toLowerCase()&&t.disableCapsMode(),(null==e?void 0:e.key)===i.content.toUpperCase()&&t.enableCapsMode());var r=i.content;null!=e&&e.shiftKey&&i.shiftContent&&(r=i.shiftContent),t.config.layout.onButtonClick(i.code,r,i.isBackspace,i.isTab,i.isEnter,i.isSpace,i.isShift)}}}},{key:"toggleCapsMode",value:function(){this.capsMode=!this.capsMode,this.rerenderButtons()}},{key:"enableCapsMode",value:function(){this.capsMode||(this.capsMode=!0,this.rerenderButtons(!1,!0))}},{key:"disableCapsMode",value:function(){this.capsMode&&(this.capsMode=!1,this.rerenderButtons(!1))}},{key:"rerenderButtons",value:function(){var o=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];this.destroyButtons(),this.renderButtons(o,t)}},{key:"destroyButtons",value:function(){this.renderedButtons.map((function(o){var t;return null===(t=o.element)||void 0===t?void 0:t.removeEventListener("click",o.handler)})),this.renderedButtons=[],this.rendered.innerHTML=""}},{key:"renderButtons",value:function(){var o=this,t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];this.config.layout.buttons.forEach((function(n){var r=new i(n,o.config.layout.style.button);r.toggleCase(o.capsMode);var c=r.render(e);if(!o.config.listenMode){var s=o.onButtonAction(r.code);r.setHandler(s),c.addEventListener("click",s)}t&&r.isCaps&&r.press(),o.renderedButtons.push(r),o.rendered.appendChild(c)}))}}])&&s(t.prototype,n),o}();return t}()}));

package.json

 {
   "name": "simple-virtual-keyboard",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Virtual keyboard",
@@ -5,0 +5,0 @@ "main": "./build/index.js",

tsconfig.json

@@ -5,3 +5,3 @@ {
     "outDir": "build/types",
-    "module": "es6",
+    "module": "amd",
     "target": "es6",
@@ -8,0 +8,0 @@ "allowJs": true,

webpack.config.js

@@ -15,3 +15,3 @@ const path = require("path")
     library: "simple-virtual-keyboard",
-    libraryTarget: "commonjs2"
+    libraryTarget: "amd"
   },
@@ -18,0 +18,0 @@ resolve: {

No alert changes

Improved metrics

Total package byte prevSize

45219

increased by0.04%

No dependency changes