HexaBoard

SamplePlayer

<h2>Buffer Functions</h2>
		<form id="bufferFunctionForm" onunload="this.zoom( 1);buPla.prePlay_stop();">
				
		<li class="menu"><a class="button"> Audio File</a>
			<ul>
				<li onclick="GUI.deleteConf();"> New / Reset All</li>
				<li onclick="uploadBuPla = buPla; this.lastElementChild.click();" title="import" accesskey="o">
					Import Audio File
					<input type="file" accept="audio/*" style="visibility:hidden;width:0px;height:0px;position:absolute;" capture onchange="uploadBuPla.handleFileInput( this);" /></li>
				<li onmousedown="JSAX.audio.buffer.download( buPla.buffer, this);" title="export"> Save WAV file</li>
				<li onmousedown="JSAX.audio.buffer.download( buPla.buffer, this, 'BAF');" title="export"> Save BAF file</li>
			</ul>
		</li>

<li class="menu"><a class="button"> Selection</a>
			<ul>
				<li onclick="buPla.form.apply( this.title);" title="zoom"> Zoom 🠕/🠗</li>
				<li onclick="buPla.form.apply( this.title);" title="undo"> Undo Ctrl+Z</li>
				<li onclick="buPla.form.apply( this.title);" title="redo"> Redo Ctrl+Y</li>
				<li onclick="buPla.form.apply( this.title);" title="cut"> Cut Ctrl+X</li>
				<li onclick="buPla.form.apply( this.title);" title="copy"> Copy Ctrl+C</li>
				<li onclick="buPla.form.apply( this.title);" title="paste"> Paste Ctrl+V</li>
				<li onclick="buPla.form.apply( this.title);" title="duplicate"> Duplicate Ctrl+D</li>
				<li onclick="buPla.form.apply( this.title);" title="crop"> Crop ⟻</li>
				<li onclick="buPla.form.apply( this.title);" title="trim"> Trim</li>
				<li onclick="buPla.form.apply( this.title);" title="delete"> Delete Del</li>
			</ul>
		</li>

<li class="menu"><a class="button"> Filters</a>
			<ul>
				<li onclick="buPla.form.apply( 'filter','normalize');"> Normalize</li>
				<li onclick="buPla.form.apply( 'filter','gain');"> gain</li>
				<li onclick="buPla.form.apply( 'filter','limit');"> limit</li>
				<li onclick="buPla.form.apply( 'filter','reversePolarity');"> reversePolarity</li>
				<li onclick="buPla.form.apply( 'filter','backwards');"> Backwards</li>
				<li onclick="buPla.form.apply( 'filter','fadein');"> Fadein</li>
				<li onclick="buPla.form.apply( 'filter','fadeout');"> Fadeout</li>
				<li onclick="buPla.form.apply( 'filter','smooth ends');"> smooth ends</li>
				<li onclick="buPla.form.apply( 'filter','seamless end');"> seamless end</li>
				<li onclick="buPla.form.apply( 'filter','zero');"> zero</li>
				<li><a onclick="buPla.form.apply( 'filter','sine');"> sine</a><ul>
					<li onclick="buPla.form.apply( 'filter','sine',{hz:220});"> 220</li>
					<li onclick="buPla.form.apply( 'filter','sine',{hz:440});"> 440</li>
					<li onclick="buPla.form.apply( 'filter','sine',{hz:880});"> 880</li>
				</ul></li>
				<li><a onclick="buPla.form.apply( 'filter','metronome relative');"> metronome</a><ul>
					<li onclick="buPla.form.apply( 'filter','metronome relative',{beats:2});"> 2</li>
					<li onclick="buPla.form.apply( 'filter','metronome relative',{beats:3});"> 3</li>
					<li onclick="buPla.form.apply( 'filter','metronome relative',{beats:4});"> 4</li>
					<li onclick="buPla.form.apply( 'filter','metronome relative',{beats:5});"> 5</li>
				</ul></li>
			</ul>
		</li>
		
		
		
			<a class="button" onclick="buPla.record();" style="color:darkred;"></a>
			<a class="button" onclick="uploadBuPla = buPla; this.nextSibling.click();">
			</a><input type="file" accept="audio/*" style="visibility:hidden;width:0px;position:absolute;" capture onchange="uploadBuPla.handleFileInput( this);" />
			<a class="button" onmousedown="JSAX.audio.buffer.download( buPla.buffer, this);" title="download"></a>

<label> Play <input name="prePlay" type="checkbox" onchange="this.form.setSelection();" /></label>
			 
			<a class="button" onclick="buPla.form.apply( this.title);" title="zoom"> Zoom</a>
			 
			Duration
			<input name="duration" onchange="this.form.setSelection();" style="width:60px;" value="{duration}" />seconds
			
			<div id="canvasCopy"></div>

Selection
				<input name="selection_start" onchange="this.form.setSelection();" style="width:60px;" />
				<input name="selection_end" onchange="this.form.setSelection();" style="width:60px;" />
				<a class="button hidden_looper" onclick="var b = buPla.form.bufferFragment; console.log( b); if( b)looper.createTrack( b);" title="add"></a>	
				<a class="button" onclick="buPla.form.apply( this.title);" title="cut"></a>
				<a class="button" onclick="buPla.form.apply( this.title);" title="crop"></a>
				<a class="button" onclick="buPla.form.apply( this.title);" title="undo"></a>
				<a class="button" onclick="buPla.form.apply( this.title);" title="redo"></a>
			 
				<input name="add_ms" onchange=";" style="width:60px;" value="50" />
				<a class="button" onclick="buPla.form.apply( this.title);" title="subtract"></a>
				<a class="button" onclick="buPla.form.apply( this.title);" title="add"></a>

<a class="button" onclick="buPla.applyBuffer( JSAX.audio.buffer.normalise( buPla.buffer));" title="normalise"></a>
			 
			 
			
			<code>function( v, i, length, @o){</code>
	<input type="options" placeholder="Functions" style="width:200px;" onkeyup="
showOptions( this, bufferFunctions);
this.preValue = this.value;
" onfocus="this.onkeyup();" onchange="
byId( 'bufferFunctionInput').value = this.data[0];
this.value = '';
" />
			<textarea name="code" id="bufferFunctionInput" style="height: 108px; width: calc( 100% - 20px); margin-left: 20px; font-size:12px;line-height:14px;" onchange="var a = this.value;">
return v *0.5;
</textarea>
<code>}</code> <a class="button" onclick="buPla.form.apply( this.title)" title="logic"> execute</a>
		<div id="bufferFunctionOutput"></div>
		</form>

Loop Start End
Volume Polyphony
Tuning Detune
A D S R

Synth1 Reset

Instances

In-/Export

Volume Polyphony
OSC
A D S R

Detune
Ascend

Filter type
Q
Frequencyhz
Gain

SoundFont

Select Instrument:

by Sergey Surikov
Thank you for all the graat work!

Tuning Reset

MIDI Settings

MIDI In:
MIDI Out:

Refresh Devices
This MIDI functionality is made with jazz-soft.net - Thanks!

MIDI Recorder

Loop
Save/Load Settings
Remvoe Channel 10

<h1>Open File</h1>
	<input>
		Example Files
		<input id="midiFileSelect" name="midi.file" type="options" placeholder="MIDI File" style="width:200px;"
onfocus="
var v = '';
//if( this.preValue)v = this.preValue;
this.value = v;
this.onkeyup();
"
onkeyup="
this.directory = '';
console.log( 'ku', this.directory, this.data);
showOptions( this, GUI.midiFiles);
if( this.value)this.preValue = this.value;
"
onchange="
if( !this.data){
	if( this.value){
		buPla.buffer.name = this.value;
		GUI.applyConf( 'buPla.file', this.value);
		console.log( this.value, this.data);
		this.preValue = this.value;
	}else{
		this.value = this.preValue;
	}
	return;
}
console.log( 'oc', this.directory, this.data);
if( this.data[0].indexOf( '.') == -1){
	showOptions( this, '?call=ls:content/midi/'+this.directory);
	this.directory += this.data[0]+'/';
	return;
}
GUI.midiImportFile( GUI.midiFilesDir+this.directory+this.data[0], this.value);
hideDialog();
"
onblur="
if( this.preValue)this.value = this.preValue;
"
/>
	 
	
	<hr/>
	From Web
	<input value="https://archive.org/details/the-midi-archive/4+Non+Blondes+-+What's+Going+On.mid" style="width:200px;" />
	<input type="button" onclick="var el = this.previousElementSibling; if( !el.value)return el.focus(); GUI.midiImportFile( el.value);" value="Load" />
	 
	
	<hr/>
	
	<img src="images/icons/folder_page.png" alt="" /> open local file
	<input type="file" id="localMidiFileInput" accept="audio/mid,audio/midi,audio/kar,audio/karaoke,audio/x-midi,audio/twap" style="display: none;" size=80
	onchange='GUI.midiImportFile( this);hideDialog();'>

Browser

MIDI Hardware only work on chrome/chromium Browsers at this moment (201810).
Restart the Browser if the connected MIDI device does not show up after Refresh Devices.

Android

Many Devices with Android Version 7 and above offer a MIDI option when USB is connected to a PC or Android with OTG.
Disable the USB MIDI option before unplugging the wire or the device may require a reboot.

Windows

Tobias Erichsens virtual MIDI devices work great on Windows and with HexaBoard. - Thanks!
loopMIDI - connect HexaBoard to other Software on the same device.
rtpMIDI - connect HexaBoard to other devices on the network.

v20201104

HexaBoard info

Presets Tutorial

Keyboard Commands:
Instead of Ctrl you can use Apple's Command key

/ cmd

Developed by Florian Sax
Feel free to join the Discord Server to give feedback.

Credits

MIDI Bridge by jazz-soft.net
WebAudioFont by Sergey Surikov
Tuning Table by instrument-tuner.com
Windows MIDI software tobias-erichsen.de
Thank you for your efforts!

Knob:

Drag vertically to change Value.
Hold 2nd Finger, Shift or Ctrl to change Speed.
Tap quickly twice to enter a manual Value.

Field:

Focus to show option List on the left side.
Into some Fields You can type to filter the List or enter a manual Value.
You have to clear the entered Value to see the full List again.

force refresh debug

Log

Clear

Shift	One Octave Up
Ctrl	One Octave Down
Alt	Two Octaves Down
Ctrl + Shift	Two Octaves Up
Ctrl + Alt	Three Octaves Down

CSS - StyleSheets are not active.

Settings