diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/view/sequencer.ts | 36 |
1 files changed, 18 insertions, 18 deletions
diff --git a/src/view/sequencer.ts b/src/view/sequencer.ts index 74eb0ea..bc26e69 100644 --- a/src/view/sequencer.ts +++ b/src/view/sequencer.ts @@ -7,7 +7,7 @@ import * as block from 'view/sequencer/block' export function view() { let index = -1 - let blocks = [{ + let columns = [{ [Sound.Bass]: true, [Sound.Snare]: false, [Sound.HitHatClosed]: false, @@ -17,38 +17,38 @@ export function view() { block.column([ { checked: false, - onCheck: checked => blocks[0][Sound.HitHatClosed] = checked + onCheck: checked => columns[0][Sound.HitHatClosed] = checked }, { checked: false, - onCheck: checked => blocks[0][Sound.Snare] = checked + onCheck: checked => columns[0][Sound.Snare] = checked }, { checked: true, - onCheck: checked => blocks[0][Sound.Bass] = checked + onCheck: checked => columns[0][Sound.Bass] = checked } ]) ) let onNextStep = (sounds: soundsLib.Sounds) => { let oldIndex = index - let newIndex = (index + 1) % blocks.length + let newIndex = (index + 1) % columns.length index = newIndex - let oldBlock = blocksNode.childNodes[oldIndex] as HTMLElement - if (oldBlock !== undefined) oldBlock.classList.remove('g-Sequencer__Block--Beat') + let oldColumn = blocksNode.childNodes[oldIndex] as HTMLElement + if (oldColumn !== undefined) oldColumn.classList.remove('g-Sequencer__Column--Beat') - let newBlock = blocksNode.childNodes[newIndex] as HTMLElement + let newColumn = blocksNode.childNodes[newIndex] as HTMLElement // Trigger reflow between removing and adding the classname. // Allow to re-trigger the animation if there is only one column. // See https://css-tricks.com/restart-css-animation/ - void newBlock.offsetWidth + void newColumn.offsetWidth - newBlock.classList.add('g-Sequencer__Block--Beat') + newColumn.classList.add('g-Sequencer__Column--Beat') soundsLib.all().forEach(sound => { - if (blocks[newIndex][sound]) soundsLib.play(sounds, sound) + if (columns[newIndex][sound]) soundsLib.play(sounds, sound) }) } @@ -56,20 +56,20 @@ export function view() { play.view({ onNextStep, onStop: () => { - let block = blocksNode.childNodes[index] as HTMLElement - block.classList.remove('g-Sequencer__Block--Beat') + let column = blocksNode.childNodes[index] as HTMLElement + column.classList.remove('g-Sequencer__Column--Beat') index = -1 } }), addRemoveBeat.view({ initBeats: 1, onRemove: index => { - let lastBlock = blocksNode.childNodes[index] - blocksNode.removeChild(lastBlock) - blocks.pop() + let lastColumn = blocksNode.childNodes[index] + blocksNode.removeChild(lastColumn) + columns.pop() }, onAdd: index => { - blocks.push({ + columns.push({ [Sound.Bass]: false, [Sound.Snare]: false, [Sound.HitHatClosed]: false, @@ -77,7 +77,7 @@ export function view() { blocksNode.appendChild(block.column( soundsLib.all().map(sound => ({ checked: false, - onCheck: checked => blocks[index][sound] = checked + onCheck: checked => columns[index][sound] = checked })) )) } |