Skip to content

Instantly share code, notes, and snippets.

@renatoargh
Last active April 16, 2024 03:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save renatoargh/5299841365db3f2dca48995a9f655e58 to your computer and use it in GitHub Desktop.
Save renatoargh/5299841365db3f2dca48995a9f655e58 to your computer and use it in GitHub Desktop.
Piano Study Helper
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body style="margin: 0px;">
<script type="text/javascript">
// Behringer Keys
const KEYS = ['C', 'Db', 'D', 'Eb', 'E', 'F', 'F#', 'G', 'Ab', 'A', 'Bb', 'B'];
const maxKeys = KEYS.length
let lastKeys = [];
function getRandomKey() {
return KEYS[Math.floor(Math.random() * KEYS.length)];
}
const div = document.createElement('div')
document.body.onclick = () => {
if (lastKeys.length >= maxKeys) {
lastKeys = []
}
let newKey = getRandomKey()
while (lastKeys.includes(newKey)) {
newKey = getRandomKey()
}
lastKeys.push(newKey)
div.innerHTML = newKey
div.style.textAlign = 'center'
div.style.lineHeight = '94vh'
div.style.width = '100vw'
div.style.height = '100vh'
div.style.fontSize = '15em'
div.style.backgroundColor = 'lightgrey'
}
document.body.onclick()
document.body.append(div)
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment