---
layout: post-plain
title:  "Sequencer"
date:   2020-02-09 09:16 +0800
categories: toys
---
{% asset sequencer.css %}
{% asset sequencer.coffee %}

<audio>This browser does not support audio</audio>
<audio id="row1" src="{% asset CB.WAV @path %}" type="audio/wav" preload="auto"></audio>
<audio id="row2" src="{% asset CH.WAV @path %}" type="audio/wav" preload="auto"></audio>
<audio id="row3" src="{% asset CL.WAV @path %}" type="audio/wav" preload="auto"></audio>
<audio id="row4" src="{% asset CP.WAV @path %}" type="audio/wav" preload="auto"></audio>

<div class="sequencer-baseline" >
	<div class="sequencer-wrapper" >
		<div class="sequencer" >
			{% for y in (1..4) %}
				{% for x in (1..8) %}
					<input class="sequencer-button" row="{{y}}" col="{{x}}" type="checkbox"/>
				{% endfor %}
			{% endfor %}
		</div>
	</div>
</div>
{% asset "Neon_Cube_01_190513_v01-01.jpg"
	@optim
	srcset:width=900
	srcset:width=500
	srcset:width=300
 %}
<div style="display: none">{% asset "Neon_Cube_01_200209_v02-02.png" %}</div>