Docs update

This commit is contained in:
Francisco Hodge
2018-10-30 23:33:29 -04:00
parent 288fcf3507
commit e7284b0e38
16 changed files with 136331 additions and 113895 deletions
+67 -16
View File
@@ -105,6 +105,31 @@ class SimpleKeyboard {
this.options.theme = this.options.theme || "hg-theme-default";
this.options.inputName = this.options.inputName || "default";
/**
* Module namespace
*/
this.modules = {};
/**
* Bindings
*/
this.handleButtonClicked = this.handleButtonClicked.bind(this);
this.syncInstanceInputs = this.syncInstanceInputs.bind(this);
this.clearInput = this.clearInput.bind(this);
this.getInput = this.getInput.bind(this);
this.setInput = this.setInput.bind(this);
this.replaceInput = this.replaceInput.bind(this);
this.clear = this.clear.bind(this);
this.dispatch = this.dispatch.bind(this);
this.addButtonTheme = this.addButtonTheme.bind(this);
this.removeButtonTheme = this.removeButtonTheme.bind(this);
this.getButtonElement = this.getButtonElement.bind(this);
this.handleCaret = this.handleCaret.bind(this);
this.caretEventHandler = this.caretEventHandler.bind(this);
this.onInit = this.onInit.bind(this);
this.onRender = this.onRender.bind(this);
this.render = this.render.bind(this);
/**
* simple-keyboard uses a non-persistent internal input to keep track of the entered string (the variable `keyboard.input`).
* This removes any dependency to input DOM elements. You can type and directly display the value in a div element, for example.
@@ -160,7 +185,7 @@ class SimpleKeyboard {
* Handles clicks made to keyboard buttons
* @param {string} button The button's layout name.
*/
handleButtonClicked = (button) => {
handleButtonClicked(button){
let debug = this.options.debug;
/**
@@ -215,7 +240,7 @@ class SimpleKeyboard {
/**
* Send a command to all simple-keyboard instances (if you have several instances).
*/
syncInstanceInputs = () => {
syncInstanceInputs(){
this.dispatch((instance) => {
instance.replaceInput(this.input);
});
@@ -225,7 +250,7 @@ class SimpleKeyboard {
* Clear the keyboard’s input.
* @param {string} [inputName] optional - the internal input to select
*/
clearInput = (inputName) => {
clearInput(inputName){
inputName = inputName || this.options.inputName;
this.input[this.options.inputName] = '';
@@ -240,7 +265,7 @@ class SimpleKeyboard {
* Get the keyboard’s input (You can also get it from the onChange prop).
* @param {string} [inputName] optional - the internal input to select
*/
getInput = (inputName) => {
getInput(inputName){
inputName = inputName || this.options.inputName;
/**
@@ -257,7 +282,7 @@ class SimpleKeyboard {
* @param {string} input the input value
* @param {string} inputName optional - the internal input to select
*/
setInput = (input, inputName) => {
setInput(input, inputName){
inputName = inputName || this.options.inputName;
this.input[inputName] = input;
@@ -272,7 +297,7 @@ class SimpleKeyboard {
* Replace the input object (`keyboard.input`)
* @param {object} inputObj The input object
*/
replaceInput = (inputObj) => {
replaceInput(inputObj){
this.input = inputObj;
}
@@ -290,7 +315,7 @@ class SimpleKeyboard {
* Remove all keyboard rows and reset keyboard values.
* Used interally between re-renders.
*/
clear = () => {
clear(){
this.keyboardDOM.innerHTML = '';
this.keyboardDOM.className = this.keyboardDOMClass;
this.buttonElements = {};
@@ -300,7 +325,7 @@ class SimpleKeyboard {
* Send a command to all simple-keyboard instances at once (if you have multiple instances).
* @param {function(instance: object, key: string)} callback Function to run on every instance
*/
dispatch = (callback) => {
dispatch(callback){
if(!window['SimpleKeyboardInstances']){
console.warn(`SimpleKeyboardInstances is not defined. Dispatch cannot be called.`);
throw new Error("INSTANCES_VAR_ERROR");
@@ -316,7 +341,7 @@ class SimpleKeyboard {
* @param {string} buttons List of buttons to select (separated by a space).
* @param {string} className Classes to give to the selected buttons (separated by space).
*/
addButtonTheme = (buttons, className) => {
addButtonTheme(buttons, className){
if(!className || !buttons)
return false;
@@ -366,7 +391,7 @@ class SimpleKeyboard {
* @param {string} buttons List of buttons to select (separated by a space).
* @param {string} className Classes to give to the selected buttons (separated by space).
*/
removeButtonTheme = (buttons, className) => {
removeButtonTheme(buttons, className){
/**
* When called with empty parameters, remove all button themes
*/
@@ -418,7 +443,7 @@ class SimpleKeyboard {
* Get the DOM Element of a button. If there are several buttons with the same name, an array of the DOM Elements is returned.
* @param {string} button The button layout name to select
*/
getButtonElement = (button) => {
getButtonElement(button){
let output;
let buttonArr = this.buttonElements[button];
@@ -436,7 +461,7 @@ class SimpleKeyboard {
/**
* Retrieves the current cursor position within a input or textarea (if any)
*/
handleCaret = () => {
handleCaret(){
if(this.options.debug){
console.log("Caret handling started");
}
@@ -449,7 +474,7 @@ class SimpleKeyboard {
/**
* Called by {@link handleCaret} when an event that warrants a cursor position update is triggered
*/
caretEventHandler = (event) => {
caretEventHandler(event){
let targetTagName = event.target.tagName.toLowerCase();
if(
@@ -471,7 +496,7 @@ class SimpleKeyboard {
/**
* Executes the callback function once simple-keyboard is rendered for the first time (on initialization).
*/
onInit = () => {
onInit(){
if(this.options.debug){
console.log("Initialized");
}
@@ -488,15 +513,41 @@ class SimpleKeyboard {
/**
* Executes the callback function every time simple-keyboard is rendered (e.g: when you change layouts).
*/
onRender = () => {
onRender(){
if(typeof this.options.onRender === "function")
this.options.onRender();
}
/**
* Register module
*/
registerModule = (name, initCallback) => {
this.modules[name] = {};
initCallback(this.modules[name]);
}
/**
* Get module prop
*/
getModuleProp = (name, prop) => {
if(!this.modules[name])
return false;
return this.modules[name][prop];
}
/**
* getModulesList
*/
getModulesList = () => {
return Object.keys(this.modules);
}
/**
* Renders rows and buttons as per options
*/
render = () => {
render(){
/**
* Clear keyboard
*/