github/simple-keyboard
github/simple-keyboard
4
0
Fork 0
mirror of https://github.com/hodgef/simple-keyboard.git synced 2025-04-25 22:52:31 +08:00
Code Issues Packages Projects Releases Wiki Activity

Precise Button element identifiers

Browse Source
This commit is contained in:
Francisco Hodge 2018-10-06 02:25:04 -04:00
parent c980024e71
commit 5e5c1c4abe
1 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/lib/components/Keyboard.js
View File

@ -285,7 +285,7 @@ class SimpleKeyboard {
/** /**
* Iterating through each row * Iterating through each row
*/ */
layout[this.options.layoutName].forEach((row) => { layout[this.options.layoutName].forEach((row, rIndex) => {
let rowArray = row.split(' '); let rowArray = row.split(' ');
/** /**
@ -297,6 +297,7 @@ class SimpleKeyboard {
/** /**
* Iterating through each button in row * Iterating through each button in row
*/ */
rowArray.forEach((button, bIndex) => {
let fctBtnClass = this.utilities.getButtonClass(button); let fctBtnClass = this.utilities.getButtonClass(button);
let buttonThemeClass = buttonThemesParsed[button]; let buttonThemeClass = buttonThemesParsed[button];
let buttonDisplayName = this.utilities.getButtonDisplayName(button, this.options.display, this.options.mergeDisplay); let buttonDisplayName = this.utilities.getButtonDisplayName(button, this.options.display, this.options.mergeDisplay);
@ -308,6 +309,18 @@ class SimpleKeyboard {
buttonDOM.className += `hg-button ${fctBtnClass}${buttonThemeClass ? " "+buttonThemeClass : ""}`; buttonDOM.className += `hg-button ${fctBtnClass}${buttonThemeClass ? " "+buttonThemeClass : ""}`;
buttonDOM.onclick = () => this.handleButtonClicked(button); buttonDOM.onclick = () => this.handleButtonClicked(button);
/**
* Adding identifier
*/
buttonDOM.setAttribute("data-skBtn", button);
/**
* Adding unique id
* Since there's no limit on spawning same buttons, the unique id ensures you can style every button
*/
let buttonUID = `${this.options.layoutName}-r${rIndex}b${bIndex}`;
buttonDOM.setAttribute("data-skBtnUID", buttonUID);
/** /**
* Adding button label to button * Adding button label to button
*/ */
@ -324,10 +337,9 @@ class SimpleKeyboard {
this.buttonElements[button].push(buttonDOM); this.buttonElements[button].push(buttonDOM);
/** /**
* Calling onInit * Appending button to row
*/ */
if(typeof this.options.onInit === "function") rowDOM.appendChild(buttonDOM);
this.options.onInit();
}); });