⌈⌋ branch:  Bitrhythm


Hex Artifact Content

Artifact 52ee08afabe25897b3758460b76cc4c27dec66dfc3f28b68e1c8f6b77751988b:


0000: 0a 3c 62 69 74 72 68 79 74 68 6d 3e 0a 0a 3c 64  .<bitrhythm>..<d
0010: 69 76 3e 0a 20 20 20 20 3c 76 73 74 61 63 6b 20  iv>.    <vstack 
0020: 69 64 3d 22 68 65 61 64 65 72 2d 70 6c 61 79 62  id="header-playb
0030: 61 63 6b 22 3e 0a 20 20 20 20 20 20 20 20 3c 68  ack">.        <h
0040: 73 74 61 63 6b 3e 0a 20 20 20 20 20 20 20 20 20  stack>.         
0050: 20 20 20 3c 64 69 76 20 63 6c 61 73 73 3d 22 6d     <div class="m
0060: 6c 2d 32 22 3e 0a 20 20 20 20 20 20 20 20 20 20  l-2">.          
0070: 20 20 20 20 20 20 3c 62 75 74 74 6f 6e 20 74 79        <button ty
0080: 70 65 3d 22 62 75 74 74 6f 6e 22 20 63 6c 61 73  pe="button" clas
0090: 73 3d 22 62 74 6e 20 62 74 6e 2d 70 72 69 6d 61  s="btn btn-prima
00a0: 72 79 20 77 2d 31 2f 31 30 20 6d 6c 2d 32 20 6d  ry w-1/10 ml-2 m
00b0: 74 2d 31 22 20 6f 6e 63 6c 69 63 6b 3d 7b 61 64  t-1" onclick={ad
00c0: 64 44 69 61 6c 7d 3e 2b 20 44 69 61 6c 3c 2f 62  dDial}>+ Dial</b
00d0: 75 74 74 6f 6e 3e 0a 20 20 20 20 20 20 20 20 20  utton>.         
00e0: 20 20 20 20 20 20 20 3c 62 75 74 74 6f 6e 20 74         <button t
00f0: 79 70 65 3d 22 62 75 74 74 6f 6e 22 20 63 6c 61  ype="button" cla
0100: 73 73 3d 22 62 74 6e 20 62 74 6e 2d 70 72 69 6d  ss="btn btn-prim
0110: 61 72 79 20 77 2d 31 2f 31 30 20 6d 6c 2d 32 20  ary w-1/10 ml-2 
0120: 6d 74 2d 31 22 20 6f 6e 63 6c 69 63 6b 3d 7b 61  mt-1" onclick={a
0130: 64 64 4e 75 6d 62 65 72 7d 3e 2b 20 4e 75 6d 62  ddNumber}>+ Numb
0140: 65 72 3c 2f 62 75 74 74 6f 6e 3e 0a 20 20 20 20  er</button>.    
0150: 20 20 20 20 20 20 20 20 20 20 20 20 3c 21 2d 2d              <!--
0160: 20 3c 62 75 74 74 6f 6e 20 74 79 70 65 3d 22 62   <button type="b
0170: 75 74 74 6f 6e 22 20 63 6c 61 73 73 3d 22 62 74  utton" class="bt
0180: 6e 20 62 74 6e 2d 70 72 69 6d 61 72 79 20 77 2d  n btn-primary w-
0190: 31 2f 31 30 20 6d 6c 2d 32 20 6d 74 2d 31 22 20  1/10 ml-2 mt-1" 
01a0: 6f 6e 63 6c 69 63 6b 3d 7b 61 64 64 53 61 6d 70  onclick={addSamp
01b0: 6c 65 7d 3e 2b 20 53 61 6d 70 6c 65 20 46 69 6c  le}>+ Sample Fil
01c0: 65 3c 2f 62 75 74 74 6f 6e 3e 20 2d 2d 3e 0a 20  e</button> -->. 
01d0: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 3c                 <
01e0: 62 75 74 74 6f 6e 20 74 79 70 65 3d 22 62 75 74  button type="but
01f0: 74 6f 6e 22 20 63 6c 61 73 73 3d 22 62 74 6e 20  ton" class="btn 
0200: 62 74 6e 2d 70 72 69 6d 61 72 79 20 77 2d 31 2f  btn-primary w-1/
0210: 31 30 20 6d 6c 2d 32 20 6d 74 2d 31 22 20 6f 6e  10 ml-2 mt-1" on
0220: 63 6c 69 63 6b 3d 7b 61 64 64 53 61 6d 70 6c 65  click={addSample
0230: 55 52 4c 7d 3e 2b 20 53 61 6d 70 6c 65 20 55 52  URL}>+ Sample UR
0240: 4c 3c 2f 62 75 74 74 6f 6e 3e 0a 20 20 20 20 20  L</button>.     
0250: 20 20 20 20 20 20 20 3c 2f 64 69 76 3e 0a 0a 20         </div>.. 
0260: 20 20 20 20 20 20 20 20 20 20 20 3c 64 69 76 20             <div 
0270: 63 6c 61 73 73 3d 22 6d 6c 2d 32 22 20 3e 0a 20  class="ml-2" >. 
0280: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 3c                 <
0290: 6c 61 62 65 6c 20 66 6f 72 3d 22 74 65 6d 70 6f  label for="tempo
02a0: 2d 76 61 6c 75 65 22 3e 54 65 6d 70 6f 20 2f 20  -value">Tempo / 
02b0: 54 69 63 6b 73 3c 2f 6c 61 62 65 6c 3e 3c 62 72  Ticks</label><br
02c0: 3e 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20  >.              
02d0: 20 20 3c 69 6e 70 75 74 20 74 79 70 65 3d 22 74    <input type="t
02e0: 65 78 74 22 20 69 64 3d 22 74 65 6d 70 6f 2d 76  ext" id="tempo-v
02f0: 61 6c 75 65 22 20 76 61 6c 75 65 3d 7b 73 74 61  alue" value={sta
0300: 74 65 2e 74 65 6d 70 6f 7d 20 73 74 79 6c 65 3d  te.tempo} style=
0310: 22 77 69 64 74 68 3a 20 31 35 30 70 78 22 20 6f  "width: 150px" o
0320: 6e 6b 65 79 75 70 3d 7b 20 65 64 69 74 54 65 6d  nkeyup={ editTem
0330: 70 6f 20 7d 2f 3e 0a 20 20 20 20 20 20 20 20 20  po }/>.         
0340: 20 20 20 20 20 20 20 3c 69 6e 70 75 74 20 74 79         <input ty
0350: 70 65 3d 22 74 65 78 74 22 20 20 63 6c 61 73 73  pe="text"  class
0360: 3d 22 6d 74 2d 32 22 20 69 64 3d 22 74 69 63 6b  ="mt-2" id="tick
0370: 2d 76 61 6c 75 65 22 20 76 61 6c 75 65 3d 7b 73  -value" value={s
0380: 74 61 74 65 2e 74 69 63 6b 73 7d 20 73 74 79 6c  tate.ticks} styl
0390: 65 3d 22 77 69 64 74 68 3a 20 31 35 30 70 78 22  e="width: 150px"
03a0: 20 6f 6e 6b 65 79 75 70 3d 7b 65 64 69 74 54 69   onkeyup={editTi
03b0: 63 6b 73 7d 2f 3e 0a 20 20 20 20 20 20 20 20 20  cks}/>.         
03c0: 20 20 20 3c 2f 64 69 76 3e 0a 20 20 20 20 20 20     </div>.      
03d0: 20 20 20 20 20 20 3c 64 69 76 20 63 6c 61 73 73        <div class
03e0: 3d 22 6d 6c 2d 32 22 20 73 74 79 6c 65 3d 22 6d  ="ml-2" style="m
03f0: 69 6e 2d 77 69 64 74 68 3a 20 32 35 30 70 78 3b  in-width: 250px;
0400: 22 3e 0a 20 20 20 20 20 20 20 20 20 20 20 20 20  ">.             
0410: 20 20 20 3c 6c 61 62 65 6c 20 66 6f 72 3d 22 64     <label for="d
0420: 75 72 61 74 69 6f 6e 22 3e 42 61 72 73 20 2f 20  uration">Bars / 
0430: 54 69 63 6b 73 20 2f 20 53 65 63 6f 6e 64 73 3c  Ticks / Seconds<
0440: 2f 6c 61 62 65 6c 3e 3c 62 72 3e 0a 20 20 20 20  /label><br>.    
0450: 20 20 20 20 20 20 20 20 20 20 20 20 3c 64 69 76              <div
0460: 20 69 64 3d 22 64 75 72 61 74 69 6f 6e 22 20 3e   id="duration" >
0470: 3c 2f 64 69 76 3e 0a 20 20 20 20 20 20 20 20 20  </div>.         
0480: 20 20 20 3c 2f 64 69 76 3e 0a 20 20 20 20 20 20     </div>.      
0490: 20 20 3c 2f 68 73 74 61 63 6b 3e 0a 0a 20 20 20    </hstack>..   
04a0: 20 20 20 20 20 3c 64 69 76 20 63 6c 61 73 73 3d       <div class=
04b0: 22 6d 74 2d 32 20 6d 6c 2d 32 22 20 3e 0a 20 20  "mt-2 ml-2" >.  
04c0: 20 20 20 20 20 20 20 20 20 20 3c 62 75 74 74 6f            <butto
04d0: 6e 20 74 79 70 65 3d 22 62 75 74 74 6f 6e 22 20  n type="button" 
04e0: 63 6c 61 73 73 3d 22 62 74 6e 20 62 74 6e 2d 70  class="btn btn-p
04f0: 72 69 6d 61 72 79 20 77 2d 31 2f 31 30 20 6d 6c  rimary w-1/10 ml
0500: 2d 32 20 6d 74 2d 31 22 20 20 6f 6e 63 6c 69 63  -2 mt-1"  onclic
0510: 6b 3d 7b 70 6c 61 79 7d 3e 50 6c 61 79 3c 2f 62  k={play}>Play</b
0520: 75 74 74 6f 6e 3e 0a 20 20 20 20 20 20 20 20 20  utton>.         
0530: 20 20 20 3c 62 75 74 74 6f 6e 20 74 79 70 65 3d     <button type=
0540: 22 62 75 74 74 6f 6e 22 20 63 6c 61 73 73 3d 22  "button" class="
0550: 62 74 6e 20 62 74 6e 2d 70 72 69 6d 61 72 79 20  btn btn-primary 
0560: 6d 6c 2d 32 22 20 6f 6e 63 6c 69 63 6b 3d 7b 73  ml-2" onclick={s
0570: 61 76 65 7d 3e 53 61 76 65 3c 2f 62 75 74 74 6f  ave}>Save</butto
0580: 6e 3e 0a 20 20 20 20 20 20 20 20 20 20 20 20 3c  n>.            <
0590: 62 75 74 74 6f 6e 20 74 79 70 65 3d 22 62 75 74  button type="but
05a0: 74 6f 6e 22 20 63 6c 61 73 73 3d 22 62 74 6e 20  ton" class="btn 
05b0: 62 74 6e 2d 70 72 69 6d 61 72 79 20 6d 6c 2d 32  btn-primary ml-2
05c0: 22 20 6f 6e 63 6c 69 63 6b 3d 7b 72 65 73 65 74  " onclick={reset
05d0: 7d 3e 52 65 73 65 74 3c 2f 62 75 74 74 6f 6e 3e  }>Reset</button>
05e0: 0a 20 20 20 20 20 20 20 20 20 20 20 20 3c 62 75  .            <bu
05f0: 74 74 6f 6e 20 74 79 70 65 3d 22 62 75 74 74 6f  tton type="butto
0600: 6e 22 20 63 6c 61 73 73 3d 22 62 74 6e 20 62 74  n" class="btn bt
0610: 6e 2d 70 72 69 6d 61 72 79 20 6d 6c 2d 32 22 20  n-primary ml-2" 
0620: 6f 6e 63 6c 69 63 6b 3d 7b 72 65 6c 6f 61 64 7d  onclick={reload}
0630: 3e 57 69 6e 64 6f 77 20 52 65 6c 6f 61 64 3c 2f  >Window Reload</
0640: 62 75 74 74 6f 6e 3e 0a 20 20 20 20 20 20 20 20  button>.        
0650: 20 20 20 20 3c 62 75 74 74 6f 6e 20 74 79 70 65      <button type
0660: 3d 22 62 75 74 74 6f 6e 22 20 63 6c 61 73 73 3d  ="button" class=
0670: 22 62 74 6e 20 62 74 6e 2d 70 72 69 6d 61 72 79  "btn btn-primary
0680: 20 6d 6c 2d 32 22 20 6f 6e 63 6c 69 63 6b 3d 7b   ml-2" onclick={
0690: 64 6f 77 6e 6c 6f 61 64 7d 3e 53 61 76 65 20 46  download}>Save F
06a0: 69 6c 65 3c 2f 62 75 74 74 6f 6e 3e 0a 0a 20 20  ile</button>..  
06b0: 20 20 20 20 20 20 20 20 20 20 3c 69 6e 70 75 74            <input
06c0: 20 63 6c 61 73 73 3d 22 6d 6c 2d 31 22 20 6e 61   class="ml-1" na
06d0: 6d 65 3d 22 65 64 69 74 2d 6d 6f 64 65 22 20 69  me="edit-mode" i
06e0: 64 3d 22 65 64 69 74 2d 6d 6f 64 65 22 20 74 79  d="edit-mode" ty
06f0: 70 65 3d 22 63 68 65 63 6b 62 6f 78 22 2f 3e 0a  pe="checkbox"/>.
0700: 20 20 20 20 20 20 20 20 20 20 20 20 3c 6c 61 62              <lab
0710: 65 6c 20 66 6f 72 3d 22 65 64 69 74 2d 6d 6f 64  el for="edit-mod
0720: 65 22 3e 45 64 69 74 3c 2f 6c 61 62 65 6c 3e 0a  e">Edit</label>.
0730: 20 20 20 20 20 20 20 20 20 20 20 20 3c 69 6e 70              <inp
0740: 75 74 20 63 6c 61 73 73 3d 22 6d 6c 2d 31 22 20  ut class="ml-1" 
0750: 6e 61 6d 65 3d 22 6c 6f 61 64 2d 6d 6f 64 65 22  name="load-mode"
0760: 20 69 64 3d 22 6c 6f 61 64 2d 6d 6f 64 65 22 20   id="load-mode" 
0770: 74 79 70 65 3d 22 63 68 65 63 6b 62 6f 78 22 2f  type="checkbox"/
0780: 3e 0a 20 20 20 20 20 20 20 20 20 20 20 20 3c 6c  >.            <l
0790: 61 62 65 6c 20 66 6f 72 3d 22 6c 6f 61 64 2d 6d  abel for="load-m
07a0: 6f 64 65 22 3e 45 78 65 63 75 74 65 20 54 72 61  ode">Execute Tra
07b0: 6e 73 69 74 69 6f 6e 3c 2f 6c 61 62 65 6c 3e 0a  nsition</label>.
07c0: 20 20 20 20 20 20 20 20 20 20 20 20 3c 69 6e 70              <inp
07d0: 75 74 20 63 6c 61 73 73 3d 22 6d 6c 2d 31 22 20  ut class="ml-1" 
07e0: 6e 61 6d 65 3d 22 6c 6f 61 64 2d 6d 6f 64 65 22  name="load-mode"
07f0: 20 69 64 3d 22 72 65 64 6f 22 20 74 79 70 65 3d   id="redo" type=
0800: 22 63 68 65 63 6b 62 6f 78 22 2f 3e 0a 20 20 20  "checkbox"/>.   
0810: 20 20 20 20 20 20 20 20 20 3c 6c 61 62 65 6c 20           <label 
0820: 66 6f 72 3d 22 72 65 64 6f 22 3e 52 65 64 6f 20  for="redo">Redo 
0830: 42 61 72 3c 2f 6c 61 62 65 6c 3e 0a 20 20 20 20  Bar</label>.    
0840: 20 20 20 20 3c 2f 64 69 76 3e 0a 0a 20 20 20 20      </div>..    
0850: 20 20 20 20 3c 76 73 74 61 63 6b 20 69 64 3d 22      <vstack id="
0860: 73 61 6d 70 6c 65 73 2d 62 6c 6f 63 6b 22 3e 0a  samples-block">.
0870: 20 20 20 20 20 20 20 20 20 20 20 20 3c 64 69 76              <div
0880: 20 65 61 63 68 3d 7b 20 6b 65 79 2c 20 69 6e 64   each={ key, ind
0890: 65 78 20 69 6e 20 73 74 61 74 65 2e 73 61 6d 70  ex in state.samp
08a0: 6c 65 73 7d 20 3e 0a 20 20 20 20 20 20 20 20 20  les} >.         
08b0: 20 20 20 20 20 20 20 3c 64 69 76 20 69 66 3d 7b         <div if={
08c0: 20 73 74 61 74 65 2e 73 61 6d 70 6c 65 73 20 26   state.samples &
08d0: 26 20 73 74 61 74 65 2e 73 61 6d 70 6c 65 73 5b  & state.samples[
08e0: 69 6e 64 65 78 5d 20 7d 3e 0a 20 20 20 20 20 20  index] }>.      
08f0: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 3c 73                <s
0900: 61 6d 70 6c 65 20 20 73 65 74 73 61 6d 70 6c 65  ample  setsample
0910: 3d 7b 73 65 74 53 61 6d 70 6c 65 7d 20 72 6d 73  ={setSample} rms
0920: 61 6d 70 6c 65 3d 7b 72 6d 53 61 6d 70 6c 65 7d  ample={rmSample}
0930: 20 73 61 6d 70 6c 65 73 3d 7b 73 74 61 74 65 2e   samples={state.
0940: 73 61 6d 70 6c 65 73 7d 20 74 69 3d 7b 69 6e 64  samples} ti={ind
0950: 65 78 20 2b 20 31 7d 3e 3c 2f 73 61 6d 70 6c 65  ex + 1}></sample
0960: 3e 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20  >.              
0970: 20 20 3c 2f 64 69 76 3e 0a 20 20 20 20 20 20 20    </div>.       
0980: 20 20 20 20 20 3c 2f 64 69 76 3e 0a 20 20 20 20       </div>.    
0990: 20 20 20 20 3c 2f 76 73 74 61 63 6b 3e 0a 0a 20      </vstack>.. 
09a0: 20 20 20 20 20 20 20 3c 68 73 74 61 63 6b 20 73         <hstack s
09b0: 74 79 6c 65 3d 22 6d 61 72 67 69 6e 2d 74 6f 70  tyle="margin-top
09c0: 3a 20 31 36 70 78 22 3e 0a 20 20 20 20 20 20 20  : 16px">.       
09d0: 20 20 20 20 20 3c 64 69 76 20 65 61 63 68 3d 7b       <div each={
09e0: 20 6b 65 79 2c 20 69 6e 64 65 78 20 69 6e 20 73   key, index in s
09f0: 74 61 74 65 2e 64 69 61 6c 73 7d 3e 0a 20 20 20  tate.dials}>.   
0a00: 20 20 20 20 20 20 20 20 20 20 20 20 20 3c 64 69               <di
0a10: 61 6c 20 72 6d 64 69 61 6c 3d 7b 72 6d 44 69 61  al rmdial={rmDia
0a20: 6c 7d 20 20 76 3d 7b 73 74 61 74 65 2e 64 69 61  l}  v={state.dia
0a30: 6c 73 5b 69 6e 64 65 78 5d 7d 20 74 69 3d 7b 69  ls[index]} ti={i
0a40: 6e 64 65 78 20 2b 20 31 7d 3e 3c 2f 64 69 61 6c  ndex + 1}></dial
0a50: 3e 0a 20 20 20 20 20 20 20 20 20 20 20 20 3c 2f  >.            </
0a60: 64 69 76 3e 0a 20 20 20 20 20 20 20 20 3c 2f 68  div>.        </h
0a70: 73 74 61 63 6b 3e 0a 0a 20 20 20 20 20 20 20 20  stack>..        
0a80: 3c 68 73 74 61 63 6b 3e 0a 20 20 20 20 20 20 20  <hstack>.       
0a90: 20 20 20 20 20 3c 64 69 76 20 65 61 63 68 3d 7b       <div each={
0aa0: 20 6b 65 79 2c 20 69 6e 64 65 78 20 69 6e 20 73   key, index in s
0ab0: 74 61 74 65 2e 6e 75 6d 62 65 72 73 7d 3e 0a 20  tate.numbers}>. 
0ac0: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 3c                 <
0ad0: 6e 75 6d 62 65 72 20 72 6d 6e 75 6d 62 65 72 3d  number rmnumber=
0ae0: 7b 72 6d 4e 75 6d 62 65 72 7d 20 76 3d 7b 73 74  {rmNumber} v={st
0af0: 61 74 65 2e 6e 75 6d 62 65 72 73 5b 69 6e 64 65  ate.numbers[inde
0b00: 78 5d 7d 20 74 69 3d 7b 69 6e 64 65 78 20 2b 20  x]} ti={index + 
0b10: 31 7d 3e 3c 2f 6e 75 6d 62 65 72 3e 0a 20 20 20  1}></number>.   
0b20: 20 20 20 20 20 20 20 20 20 3c 2f 64 69 76 3e 0a           </div>.
0b30: 20 20 20 20 20 20 20 20 3c 2f 68 73 74 61 63 6b          </hstack
0b40: 3e 0a 0a 20 20 20 20 3c 2f 76 73 74 61 63 6b 3e  >..    </vstack>
0b50: 0a 0a 20 20 20 20 3c 64 69 76 20 69 64 3d 22 63  ..    <div id="c
0b60: 75 65 64 22 20 63 6c 61 73 73 3d 22 70 2d 32 22  ued" class="p-2"
0b70: 20 73 74 79 6c 65 3d 22 63 6f 6c 6f 72 3a 20 77   style="color: w
0b80: 68 69 74 65 20 21 69 6d 70 6f 72 74 61 6e 74 3b  hite !important;
0b90: 20 68 65 69 67 68 74 3a 20 33 32 70 78 3b 20 66   height: 32px; f
0ba0: 6f 6e 74 2d 73 69 7a 65 3a 20 32 34 70 78 3b 22  ont-size: 24px;"
0bb0: 3e 3c 2f 64 69 76 3e 0a 20 20 20 20 3c 64 69 76  ></div>.    <div
0bc0: 20 69 64 3d 22 65 72 72 6f 72 22 20 63 6c 61 73   id="error" clas
0bd0: 73 3d 22 70 2d 32 22 20 73 74 79 6c 65 3d 22 63  s="p-2" style="c
0be0: 6f 6c 6f 72 3a 20 79 65 6c 6c 6f 77 20 21 69 6d  olor: yellow !im
0bf0: 70 6f 72 74 61 6e 74 3b 20 68 65 69 67 68 74 3a  portant; height:
0c00: 20 33 32 70 78 3b 20 66 6f 6e 74 2d 73 69 7a 65   32px; font-size
0c10: 3a 20 31 32 70 78 3b 22 3e 3c 2f 64 69 76 3e 0a  : 12px;"></div>.
0c20: 20 20 20 20 3c 64 69 76 20 69 64 3d 22 63 61 6e      <div id="can
0c30: 76 61 73 2d 63 6f 6e 74 61 69 6e 65 72 22 20 73  vas-container" s
0c40: 74 79 6c 65 3d 22 70 6f 73 69 74 69 6f 6e 3a 20  tyle="position: 
0c50: 72 65 6c 61 74 69 76 65 3b 22 3e 0a 20 20 20 20  relative;">.    
0c60: 20 20 20 20 3c 64 69 76 20 69 64 3d 22 70 35 22      <div id="p5"
0c70: 20 73 74 79 6c 65 3d 22 70 6f 73 69 74 69 6f 6e   style="position
0c80: 3a 20 61 62 73 6f 6c 75 74 65 3b 20 77 69 64 74  : absolute; widt
0c90: 68 3a 20 31 30 30 25 3b 20 62 61 63 6b 67 72 6f  h: 100%; backgro
0ca0: 75 6e 64 3a 20 62 6c 61 63 6b 22 3e 3c 2f 64 69  und: black"></di
0cb0: 76 3e 0a 20 20 20 20 20 20 20 20 3c 63 61 6e 76  v>.        <canv
0cc0: 61 73 20 69 64 3d 22 76 69 73 75 61 6c 22 20 73  as id="visual" s
0cd0: 74 79 6c 65 3d 22 70 6f 73 69 74 69 6f 6e 3a 20  tyle="position: 
0ce0: 61 62 73 6f 6c 75 74 65 3b 20 77 69 64 74 68 3a  absolute; width:
0cf0: 20 31 30 30 25 3b 20 62 61 63 6b 67 72 6f 75 6e   100%; backgroun
0d00: 64 3a 20 62 6c 61 63 6b 3b 22 3e 3c 2f 63 61 6e  d: black;"></can
0d10: 76 61 73 3e 0a 20 20 20 20 20 20 20 20 3c 64 69  vas>.        <di
0d20: 76 20 69 64 3d 22 63 6f 64 65 22 20 73 74 79 6c  v id="code" styl
0d30: 65 3d 22 70 6f 73 69 74 69 6f 6e 3a 20 61 62 73  e="position: abs
0d40: 6f 6c 75 74 65 3b 22 3e 3c 2f 64 69 76 3e 0a 20  olute;"></div>. 
0d50: 20 20 20 3c 2f 64 69 76 3e 0a 20 20 20 20 0a 3c     </div>.    .<
0d60: 2f 64 69 76 3e 0a 0a 3c 73 74 79 6c 65 3e 0a 3a  /div>..<style>.:
0d70: 68 6f 73 74 20 7b 0a 20 20 20 20 6d 61 72 67 69  host {.    margi
0d80: 6e 2d 74 6f 70 3a 20 34 76 68 3b 0a 7d 0a 3c 2f  n-top: 4vh;.}.</
0d90: 73 74 79 6c 65 3e 0a 0a 3c 73 63 72 69 70 74 3e  style>..<script>
0da0: 0a 76 61 72 20 6f 6c 64 43 6f 64 65 20 3d 20 22  .var oldCode = "
0db0: 22 3b 0a 76 61 72 20 6f 6c 64 50 61 74 74 65 72  ";.var oldPatter
0dc0: 6e 73 20 3d 20 5b 5d 3b 0a 0a 4d 6f 75 73 65 74  ns = [];..Mouset
0dd0: 72 61 70 2e 73 74 6f 70 43 61 6c 6c 62 61 63 6b  rap.stopCallback
0de0: 20 3d 20 66 75 6e 63 74 69 6f 6e 28 65 2c 20 65   = function(e, e
0df0: 6c 65 6d 65 6e 74 2c 20 63 6f 6d 62 6f 29 20 7b  lement, combo) {
0e00: 0a 20 20 20 20 72 65 74 75 72 6e 20 66 61 6c 73  .    return fals
0e10: 65 3b 0a 7d 0a 0a 4d 6f 75 73 65 74 72 61 70 2e  e;.}..Mousetrap.
0e20: 62 69 6e 64 28 5b 27 66 39 27 5d 2c 20 66 75 6e  bind(['f9'], fun
0e30: 63 74 69 6f 6e 28 65 29 20 7b 0a 20 20 20 20 69  ction(e) {.    i
0e40: 66 20 28 64 6f 63 75 6d 65 6e 74 2e 67 65 74 45  f (document.getE
0e50: 6c 65 6d 65 6e 74 42 79 49 64 28 27 65 64 69 74  lementById('edit
0e60: 2d 6d 6f 64 65 27 29 2e 63 68 65 63 6b 65 64 29  -mode').checked)
0e70: 20 7b 0a 20 20 20 20 20 20 20 20 64 6f 63 75 6d   {.        docum
0e80: 65 6e 74 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79  ent.getElementBy
0e90: 49 64 28 27 65 64 69 74 2d 6d 6f 64 65 27 29 2e  Id('edit-mode').
0ea0: 63 68 65 63 6b 65 64 20 3d 20 66 61 6c 73 65 3b  checked = false;
0eb0: 0a 20 20 20 20 7d 20 65 6c 73 65 20 7b 0a 20 20  .    } else {.  
0ec0: 20 20 20 20 20 20 64 6f 63 75 6d 65 6e 74 2e 67        document.g
0ed0: 65 74 45 6c 65 6d 65 6e 74 42 79 49 64 28 27 65  etElementById('e
0ee0: 64 69 74 2d 6d 6f 64 65 27 29 2e 63 68 65 63 6b  dit-mode').check
0ef0: 65 64 20 3d 20 74 72 75 65 3b 0a 20 20 20 20 7d  ed = true;.    }
0f00: 0a 0a 20 20 20 20 72 65 74 75 72 6e 20 66 61 6c  ..    return fal
0f10: 73 65 3b 0a 7d 29 3b 0a 0a 4d 6f 75 73 65 74 72  se;.});..Mousetr
0f20: 61 70 2e 62 69 6e 64 28 5b 27 63 74 72 6c 2b 31  ap.bind(['ctrl+1
0f30: 27 5d 2c 20 66 75 6e 63 74 69 6f 6e 28 65 29 20  '], function(e) 
0f40: 7b 0a 0a 20 20 20 20 69 66 20 28 64 6f 63 75 6d  {..    if (docum
0f50: 65 6e 74 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79  ent.getElementBy
0f60: 49 64 28 27 72 65 64 6f 27 29 2e 63 68 65 63 6b  Id('redo').check
0f70: 65 64 29 20 7b 0a 20 20 20 20 20 20 20 20 64 6f  ed) {.        do
0f80: 63 75 6d 65 6e 74 2e 67 65 74 45 6c 65 6d 65 6e  cument.getElemen
0f90: 74 42 79 49 64 28 27 72 65 64 6f 27 29 2e 63 68  tById('redo').ch
0fa0: 65 63 6b 65 64 20 3d 20 66 61 6c 73 65 3b 0a 20  ecked = false;. 
0fb0: 20 20 20 7d 20 65 6c 73 65 20 7b 0a 20 20 20 20     } else {.    
0fc0: 20 20 20 20 64 6f 63 75 6d 65 6e 74 2e 67 65 74      document.get
0fd0: 45 6c 65 6d 65 6e 74 42 79 49 64 28 27 72 65 64  ElementById('red
0fe0: 6f 27 29 2e 63 68 65 63 6b 65 64 20 3d 20 74 72  o').checked = tr
0ff0: 75 65 3b 0a 20 20 20 20 7d 0a 0a 20 20 20 20 72  ue;.    }..    r
1000: 65 74 75 72 6e 20 66 61 6c 73 65 3b 0a 7d 29 3b  eturn false;.});
1010: 0a 0a 4d 6f 75 73 65 74 72 61 70 2e 62 69 6e 64  ..Mousetrap.bind
1020: 28 5b 27 66 31 30 27 5d 2c 20 66 75 6e 63 74 69  (['f10'], functi
1030: 6f 6e 28 65 29 20 7b 0a 20 20 20 20 69 66 20 28  on(e) {.    if (
1040: 64 6f 63 75 6d 65 6e 74 2e 67 65 74 45 6c 65 6d  document.getElem
1050: 65 6e 74 42 79 49 64 28 27 6c 6f 61 64 2d 6d 6f  entById('load-mo
1060: 64 65 27 29 2e 63 68 65 63 6b 65 64 29 20 7b 0a  de').checked) {.
1070: 20 20 20 20 20 20 20 20 64 6f 63 75 6d 65 6e 74          document
1080: 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79 49 64 28  .getElementById(
1090: 27 6c 6f 61 64 2d 6d 6f 64 65 27 29 2e 63 68 65  'load-mode').che
10a0: 63 6b 65 64 20 3d 20 66 61 6c 73 65 3b 0a 20 20  cked = false;.  
10b0: 20 20 7d 20 65 6c 73 65 20 7b 0a 20 20 20 20 20    } else {.     
10c0: 20 20 20 64 6f 63 75 6d 65 6e 74 2e 67 65 74 45     document.getE
10d0: 6c 65 6d 65 6e 74 42 79 49 64 28 27 6c 6f 61 64  lementById('load
10e0: 2d 6d 6f 64 65 27 29 2e 63 68 65 63 6b 65 64 20  -mode').checked 
10f0: 3d 20 74 72 75 65 3b 0a 20 20 20 20 7d 0a 20 20  = true;.    }.  
1100: 20 20 72 65 74 75 72 6e 20 66 61 6c 73 65 3b 0a    return false;.
1110: 7d 29 3b 0a 0a 4d 6f 75 73 65 74 72 61 70 2e 62  });..Mousetrap.b
1120: 69 6e 64 28 5b 27 63 74 72 6c 2b 30 27 5d 2c 20  ind(['ctrl+0'], 
1130: 66 75 6e 63 74 69 6f 6e 28 65 29 20 7b 0a 20 20  function(e) {.  
1140: 20 20 24 28 22 23 73 61 6d 70 6c 65 73 2d 62 6c    $("#samples-bl
1150: 6f 63 6b 22 29 2e 74 6f 67 67 6c 65 28 29 3b 0a  ock").toggle();.
1160: 20 20 20 20 72 65 74 75 72 6e 20 66 61 6c 73 65      return false
1170: 3b 0a 7d 29 3b 0a 0a 0a 66 6f 72 20 28 6c 65 74  ;.});...for (let
1180: 20 69 20 3d 20 31 3b 20 69 20 3c 3d 20 38 3b 20   i = 1; i <= 8; 
1190: 69 2b 2b 29 20 7b 0a 20 20 20 20 4d 6f 75 73 65  i++) {.    Mouse
11a0: 74 72 61 70 2e 62 69 6e 64 28 5b 27 66 27 20 2b  trap.bind(['f' +
11b0: 20 69 5d 2c 20 66 75 6e 63 74 69 6f 6e 28 65 29   i], function(e)
11c0: 20 7b 0a 20 20 20 20 20 20 20 20 69 66 20 28 69   {.        if (i
11d0: 20 3c 3d 20 73 61 6d 70 6c 65 73 2e 6c 65 6e 67   <= samples.leng
11e0: 74 68 29 20 7b 0a 20 20 20 20 20 20 20 20 20 20  th) {.          
11f0: 20 20 70 28 69 20 2d 20 31 29 3b 0a 20 20 20 20    p(i - 1);.    
1200: 20 20 20 20 7d 0a 20 20 20 20 20 20 20 20 72 65      }.        re
1210: 74 75 72 6e 20 66 61 6c 73 65 3b 0a 20 20 20 20  turn false;.    
1220: 7d 29 3b 0a 7d 0a 0a 2f 2f 20 76 61 72 20 61 75  });.}..// var au
1230: 64 69 6f 20 3d 20 6e 65 77 20 41 75 64 69 6f 28  dio = new Audio(
1240: 29 3b 0a 2f 2f 20 61 75 64 69 6f 2e 6c 6f 6f 70  );.// audio.loop
1250: 20 3d 20 74 72 75 65 3b 0a 63 6f 6e 73 74 20 61   = true;.const a
1260: 63 74 78 20 3d 20 54 6f 6e 65 2e 63 6f 6e 74 65  ctx = Tone.conte
1270: 78 74 3b 0a 63 6f 6e 73 74 20 64 65 73 74 20 3d  xt;.const dest =
1280: 20 61 63 74 78 2e 63 72 65 61 74 65 4d 65 64 69   actx.createMedi
1290: 61 53 74 72 65 61 6d 44 65 73 74 69 6e 61 74 69  aStreamDestinati
12a0: 6f 6e 28 29 3b 0a 63 6f 6e 73 74 20 72 65 63 6f  on();.const reco
12b0: 72 64 65 72 20 3d 20 6e 65 77 20 4d 65 64 69 61  rder = new Media
12c0: 52 65 63 6f 72 64 65 72 28 64 65 73 74 2e 73 74  Recorder(dest.st
12d0: 72 65 61 6d 29 3b 0a 6c 65 74 20 63 68 75 6e 6b  ream);.let chunk
12e0: 73 20 3d 20 5b 5d 3b 0a 76 61 72 20 73 61 6d 70  s = [];.var samp
12f0: 6c 65 55 52 4c 20 3d 20 22 22 3b 0a 76 61 72 20  leURL = "";.var 
1300: 73 61 6d 3b 0a 74 68 69 73 2e 70 72 6f 70 73 20  sam;.this.props 
1310: 3d 20 6f 70 74 73 3b 0a 0a 74 68 69 73 2e 73 74  = opts;..this.st
1320: 61 74 65 20 3d 20 7b 0a 20 20 20 20 6d 65 6d 3a  ate = {.    mem:
1330: 20 7b 7d 2c 0a 20 20 20 20 64 69 61 6c 73 3a 20   {},.    dials: 
1340: 5b 5d 2c 0a 20 20 20 20 6e 75 6d 62 65 72 73 3a  [],.    numbers:
1350: 20 5b 5d 2c 0a 20 20 20 20 73 61 6d 70 6c 65 73   [],.    samples
1360: 3a 20 5b 5d 2c 0a 20 20 20 20 74 65 6d 70 6f 3a  : [],.    tempo:
1370: 20 31 32 30 2c 0a 20 20 20 20 74 69 63 6b 73 3a   120,.    ticks:
1380: 20 31 36 2c 0a 7d 0a 0a 61 73 79 6e 63 20 66 75   16,.}..async fu
1390: 6e 63 74 69 6f 6e 20 63 6f 70 79 54 65 78 74 54  nction copyTextT
13a0: 6f 43 6c 69 70 62 6f 61 72 64 28 74 65 78 74 29  oClipboard(text)
13b0: 20 7b 0a 20 20 20 20 74 72 79 20 7b 20 61 77 61   {.    try { awa
13c0: 69 74 20 6e 61 76 69 67 61 74 6f 72 2e 63 6c 69  it navigator.cli
13d0: 70 62 6f 61 72 64 2e 77 72 69 74 65 54 65 78 74  pboard.writeText
13e0: 28 74 65 78 74 29 3b 20 7d 0a 20 20 20 20 63 61  (text); }.    ca
13f0: 74 63 68 28 65 72 72 29 20 7b 0a 20 20 20 20 20  tch(err) {.     
1400: 20 20 20 61 6c 65 72 74 28 27 45 72 72 6f 72 20     alert('Error 
1410: 69 6e 20 63 6f 70 79 69 6e 67 20 74 65 78 74 3a  in copying text:
1420: 20 27 2c 20 65 72 72 29 3b 0a 20 20 20 20 7d 0a   ', err);.    }.
1430: 7d 0a 0a 73 68 6f 75 6c 64 55 70 64 61 74 65 28  }..shouldUpdate(
1440: 64 61 74 61 2c 20 6e 65 78 74 4f 70 74 73 29 20  data, nextOpts) 
1450: 7b 0a 20 20 20 20 72 65 74 75 72 6e 20 74 72 75  {.    return tru
1460: 65 3b 0a 7d 0a 0a 74 68 69 73 2e 6f 6e 28 27 6d  e;.}..this.on('m
1470: 6f 75 6e 74 27 2c 20 66 75 6e 63 74 69 6f 6e 28  ount', function(
1480: 29 20 7b 0a 20 20 20 20 76 61 72 20 73 65 6c 66  ) {.    var self
1490: 20 3d 20 74 68 69 73 3b 0a 20 20 20 20 24 28 22   = this;.    $("
14a0: 23 6c 6f 61 64 2d 6d 6f 64 65 22 29 2e 63 6c 69  #load-mode").cli
14b0: 63 6b 28 29 3b 0a 20 20 20 20 65 64 69 74 6f 72  ck();.    editor
14c0: 20 3d 20 43 6f 64 65 4d 69 72 72 6f 72 28 64 6f   = CodeMirror(do
14d0: 63 75 6d 65 6e 74 2e 67 65 74 45 6c 65 6d 65 6e  cument.getElemen
14e0: 74 42 79 49 64 28 22 63 6f 64 65 22 29 2c 20 7b  tById("code"), {
14f0: 0a 20 20 20 20 20 20 20 20 6d 6f 64 65 3a 20 22  .        mode: "
1500: 6e 75 6c 6c 22 2c 0a 20 20 20 20 20 20 20 20 73  null",.        s
1510: 70 65 6c 6c 63 68 65 63 6b 3a 20 66 61 6c 73 65  pellcheck: false
1520: 2c 0a 20 20 20 20 20 20 20 20 61 75 74 6f 63 6f  ,.        autoco
1530: 72 72 65 63 74 3a 20 66 61 6c 73 65 2c 0a 20 20  rrect: false,.  
1540: 20 20 20 20 20 20 73 63 72 6f 6c 6c 62 61 72 53        scrollbarS
1550: 74 79 6c 65 3a 20 22 6e 75 6c 6c 22 2c 0a 20 20  tyle: "null",.  
1560: 20 20 20 20 20 20 6c 69 6e 65 57 72 61 70 70 69        lineWrappi
1570: 6e 67 3a 20 66 61 6c 73 65 2c 0a 20 20 20 20 20  ng: false,.     
1580: 20 20 20 6c 69 6e 65 4e 75 6d 62 65 72 73 3a 20     lineNumbers: 
1590: 66 61 6c 73 65 2c 0a 20 20 20 20 20 20 20 20 73  false,.        s
15a0: 74 79 6c 65 41 63 74 69 76 65 4c 69 6e 65 3a 20  tyleActiveLine: 
15b0: 66 61 6c 73 65 2c 0a 20 20 20 20 20 20 20 20 73  false,.        s
15c0: 74 79 6c 65 53 65 6c 65 63 74 65 64 54 65 78 74  tyleSelectedText
15d0: 3a 20 74 72 75 65 2c 0a 20 20 20 20 20 20 20 20  : true,.        
15e0: 6d 61 74 63 68 42 72 61 63 6b 65 74 73 3a 20 66  matchBrackets: f
15f0: 61 6c 73 65 2c 0a 20 20 20 20 20 20 20 20 76 61  alse,.        va
1600: 6c 75 65 3a 20 60 2f 2f 20 74 72 61 63 6b 5f 6e  lue: `// track_n
1610: 6f 2c 20 70 61 74 74 65 72 6e 2c 20 63 75 72 72  o, pattern, curr
1620: 65 6e 74 5f 62 69 74 2c 20 73 61 6d 70 6c 65 73  ent_bit, samples
1630: 2c 20 73 61 6d 70 6c 65 20 61 6e 64 20 54 6f 6e  , sample and Ton
1640: 65 20 61 72 65 20 61 76 61 69 6c 61 62 6c 65 20  e are available 
1650: 61 73 20 67 6c 6f 62 61 6c 73 60 0a 20 20 20 20  as globals`.    
1660: 7d 29 3b 0a 0a 20 20 20 20 65 64 69 74 6f 72 2e  });..    editor.
1670: 73 65 74 53 69 7a 65 28 6e 75 6c 6c 2c 20 77 69  setSize(null, wi
1680: 6e 64 6f 77 2e 69 6e 6e 65 72 48 65 69 67 68 74  ndow.innerHeight
1690: 20 2d 20 64 6f 63 75 6d 65 6e 74 2e 67 65 74 45   - document.getE
16a0: 6c 65 6d 65 6e 74 42 79 49 64 28 22 68 65 61 64  lementById("head
16b0: 65 72 2d 70 6c 61 79 62 61 63 6b 22 29 2e 63 6c  er-playback").cl
16c0: 69 65 6e 74 48 65 69 67 68 74 20 2d 20 31 36 30  ientHeight - 160
16d0: 29 3b 0a 0a 20 20 20 20 69 66 20 28 74 68 69 73  );..    if (this
16e0: 2e 70 72 6f 70 73 2e 73 6f 6e 67 29 20 7b 0a 20  .props.song) {. 
16f0: 20 20 20 20 20 20 20 63 6f 6e 73 74 20 6c 69 62         const lib
1700: 20 3d 20 77 69 6e 64 6f 77 2e 4a 73 6f 6e 55 72   = window.JsonUr
1710: 6c 28 27 6c 7a 6d 61 27 29 3b 0a 20 20 20 20 20  l('lzma');.     
1720: 20 20 20 6c 69 62 2e 64 65 63 6f 6d 70 72 65 73     lib.decompres
1730: 73 28 74 68 69 73 2e 70 72 6f 70 73 2e 73 6f 6e  s(this.props.son
1740: 67 29 2e 74 68 65 6e 28 64 61 74 61 20 3d 3e 20  g).then(data => 
1750: 7b 0a 20 20 20 20 20 20 20 20 20 20 20 20 76 61  {.            va
1760: 72 20 73 61 6d 70 6c 65 5f 6e 61 6d 65 73 20 3d  r sample_names =
1770: 20 64 61 74 61 5b 22 73 61 6d 70 6c 65 5f 6e 61   data["sample_na
1780: 6d 65 73 22 5d 3b 0a 20 20 20 20 20 20 20 20 20  mes"];.         
1790: 20 20 20 76 61 72 20 64 69 61 6c 5f 63 6f 75 6e     var dial_coun
17a0: 74 20 3d 20 64 61 74 61 5b 22 64 69 61 6c 5f 63  t = data["dial_c
17b0: 6f 75 6e 74 22 5d 3b 0a 20 20 20 20 20 20 20 20  ount"];.        
17c0: 20 20 20 20 76 61 72 20 6e 75 6d 62 65 72 73 5f      var numbers_
17d0: 63 6f 75 6e 74 20 3d 20 64 61 74 61 5b 22 6e 75  count = data["nu
17e0: 6d 62 65 72 73 5f 63 6f 75 6e 74 22 5d 3b 0a 20  mbers_count"];. 
17f0: 20 20 20 20 20 20 20 20 20 20 20 64 65 6c 65 74             delet
1800: 65 20 64 61 74 61 5b 22 73 61 6d 70 6c 65 5f 6e  e data["sample_n
1810: 61 6d 65 73 22 5d 3b 0a 20 20 20 20 20 20 20 20  ames"];.        
1820: 20 20 20 20 64 65 6c 65 74 65 20 64 61 74 61 5b      delete data[
1830: 22 64 69 61 6c 5f 63 6f 75 6e 74 22 5d 3b 0a 20  "dial_count"];. 
1840: 20 20 20 20 20 20 20 20 20 20 20 64 65 6c 65 74             delet
1850: 65 20 64 61 74 61 5b 22 6e 75 6d 62 65 72 73 5f  e data["numbers_
1860: 63 6f 75 6e 74 22 5d 3b 0a 20 20 20 20 20 20 20  count"];.       
1870: 20 20 20 20 20 74 68 69 73 2e 73 74 61 74 65 2e       this.state.
1880: 74 65 6d 70 6f 20 3d 20 64 61 74 61 2e 74 65 6d  tempo = data.tem
1890: 70 6f 3b 0a 20 20 20 20 20 20 20 20 20 20 20 20  po;.            
18a0: 74 68 69 73 2e 73 74 61 74 65 2e 74 69 63 6b 73  this.state.ticks
18b0: 20 3d 20 64 61 74 61 2e 74 69 63 6b 73 3b 0a 20   = data.ticks;. 
18c0: 20 20 20 20 20 20 20 20 20 20 20 74 68 69 73 2e             this.
18d0: 73 74 61 74 65 2e 63 6f 64 65 20 3d 20 64 61 74  state.code = dat
18e0: 61 2e 63 6f 64 65 3b 0a 20 20 20 20 20 20 20 20  a.code;.        
18f0: 20 20 20 20 73 61 6d 70 6c 65 5f 6e 61 6d 65 73      sample_names
1900: 2e 6d 61 70 28 66 75 6e 63 74 69 6f 6e 20 28 75  .map(function (u
1910: 72 6c 29 20 7b 0a 20 20 20 20 20 20 20 20 20 20  rl) {.          
1920: 20 20 20 20 20 20 73 65 6c 66 2e 61 64 64 55 52        self.addUR
1930: 4c 28 75 72 6c 29 3b 0a 20 20 20 20 20 20 20 20  L(url);.        
1940: 20 20 20 20 7d 29 3b 0a 20 20 20 20 20 20 20 20      });.        
1950: 20 20 20 20 66 6f 72 20 28 76 61 72 20 69 20 3d      for (var i =
1960: 20 30 3b 20 69 20 3c 20 64 69 61 6c 5f 63 6f 75   0; i < dial_cou
1970: 6e 74 3b 20 69 2b 2b 29 20 7b 0a 20 20 20 20 20  nt; i++) {.     
1980: 20 20 20 20 20 20 20 20 20 20 20 74 68 69 73 2e             this.
1990: 73 74 61 74 65 2e 64 69 61 6c 73 2e 70 75 73 68  state.dials.push
19a0: 28 7b 7d 29 3b 0a 20 20 20 20 20 20 20 20 20 20  ({});.          
19b0: 20 20 7d 0a 20 20 20 20 20 20 20 20 20 20 20 20    }.            
19c0: 66 6f 72 20 28 76 61 72 20 69 20 3d 20 30 3b 20  for (var i = 0; 
19d0: 69 20 3c 20 6e 75 6d 62 65 72 73 5f 63 6f 75 6e  i < numbers_coun
19e0: 74 3b 20 69 2b 2b 29 20 7b 0a 20 20 20 20 20 20  t; i++) {.      
19f0: 20 20 20 20 20 20 20 20 20 20 74 68 69 73 2e 73            this.s
1a00: 74 61 74 65 2e 6e 75 6d 62 65 72 73 2e 70 75 73  tate.numbers.pus
1a10: 68 28 7b 7d 29 3b 0a 20 20 20 20 20 20 20 20 20  h({});.         
1a20: 20 20 20 7d 0a 20 20 20 20 20 20 20 20 20 20 20     }.           
1a30: 20 65 64 69 74 6f 72 2e 73 65 74 56 61 6c 75 65   editor.setValue
1a40: 28 74 68 69 73 2e 73 74 61 74 65 2e 63 6f 64 65  (this.state.code
1a50: 29 3b 0a 20 20 20 20 20 20 20 20 20 20 20 20 74  );.            t
1a60: 68 69 73 2e 75 70 64 61 74 65 28 29 3b 0a 20 20  his.update();.  
1a70: 20 20 20 20 20 20 20 20 20 20 72 69 6f 74 2e 6d            riot.m
1a80: 6f 75 6e 74 28 27 27 29 3b 0a 20 20 20 20 20 20  ount('');.      
1a90: 20 20 7d 29 0a 20 20 20 20 7d 0a 0a 0a 7d 29 3b    }).    }...});
1aa0: 0a 0a 0a 0a 0a 64 6f 77 6e 6c 6f 61 64 28 29 20  .....download() 
1ab0: 7b 0a 20 20 20 20 0a 20 20 20 20 66 75 6e 63 74  {.    .    funct
1ac0: 69 6f 6e 20 64 6f 77 6e 6c 6f 61 64 28 64 61 74  ion download(dat
1ad0: 61 2c 20 66 69 6c 65 6e 61 6d 65 20 3d 20 22 73  a, filename = "s
1ae0: 6f 6e 67 2e 74 78 74 22 2c 20 74 79 70 65 20 3d  ong.txt", type =
1af0: 20 22 74 65 78 74 2f 70 6c 61 69 6e 22 29 20 7b   "text/plain") {
1b00: 0a 20 20 20 20 20 20 20 20 20 20 20 20 76 61 72  .            var
1b10: 20 66 69 6c 65 20 3d 20 6e 65 77 20 42 6c 6f 62   file = new Blob
1b20: 28 5b 64 61 74 61 5d 2c 20 7b 74 79 70 65 3a 20  ([data], {type: 
1b30: 74 79 70 65 7d 29 3b 0a 20 20 20 20 20 20 20 20  type});.        
1b40: 20 20 20 20 76 61 72 20 61 20 3d 20 64 6f 63 75      var a = docu
1b50: 6d 65 6e 74 2e 63 72 65 61 74 65 45 6c 65 6d 65  ment.createEleme
1b60: 6e 74 28 22 61 22 29 2c 0a 20 20 20 20 20 20 20  nt("a"),.       
1b70: 20 20 20 20 20 20 20 20 20 20 20 20 20 75 72 6c               url
1b80: 20 3d 20 55 52 4c 2e 63 72 65 61 74 65 4f 62 6a   = URL.createObj
1b90: 65 63 74 55 52 4c 28 66 69 6c 65 29 3b 0a 20 20  ectURL(file);.  
1ba0: 20 20 20 20 20 20 20 20 20 20 61 2e 68 72 65 66            a.href
1bb0: 20 3d 20 75 72 6c 3b 0a 20 20 20 20 20 20 20 20   = url;.        
1bc0: 20 20 20 20 61 2e 64 6f 77 6e 6c 6f 61 64 20 3d      a.download =
1bd0: 20 66 69 6c 65 6e 61 6d 65 3b 0a 20 20 20 20 20   filename;.     
1be0: 20 20 20 20 20 20 20 64 6f 63 75 6d 65 6e 74 2e         document.
1bf0: 62 6f 64 79 2e 61 70 70 65 6e 64 43 68 69 6c 64  body.appendChild
1c00: 28 61 29 3b 0a 20 20 20 20 20 20 20 20 20 20 20  (a);.           
1c10: 20 61 2e 63 6c 69 63 6b 28 29 3b 0a 20 20 20 20   a.click();.    
1c20: 20 20 20 20 20 20 20 20 73 65 74 54 69 6d 65 6f          setTimeo
1c30: 75 74 28 66 75 6e 63 74 69 6f 6e 28 29 20 7b 0a  ut(function() {.
1c40: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20                  
1c50: 64 6f 63 75 6d 65 6e 74 2e 62 6f 64 79 2e 72 65  document.body.re
1c60: 6d 6f 76 65 43 68 69 6c 64 28 61 29 3b 0a 20 20  moveChild(a);.  
1c70: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 77 69                wi
1c80: 6e 64 6f 77 2e 55 52 4c 2e 72 65 76 6f 6b 65 4f  ndow.URL.revokeO
1c90: 62 6a 65 63 74 55 52 4c 28 75 72 6c 29 3b 20 20  bjectURL(url);  
1ca0: 0a 20 20 20 20 20 20 20 20 20 20 20 20 7d 2c 20  .            }, 
1cb0: 30 29 3b 20 0a 20 20 20 20 7d 0a 20 20 20 20 64  0); .    }.    d
1cc0: 6f 77 6e 6c 6f 61 64 28 65 64 69 74 6f 72 2e 67  ownload(editor.g
1cd0: 65 74 56 61 6c 75 65 28 29 29 0a 7d 0a 0a 73 61  etValue()).}..sa
1ce0: 76 65 28 29 20 7b 0a 20 20 20 20 74 68 69 73 2e  ve() {.    this.
1cf0: 73 74 61 74 65 2e 63 6f 64 65 20 3d 20 65 64 69  state.code = edi
1d00: 74 6f 72 2e 67 65 74 56 61 6c 75 65 28 29 3b 0a  tor.getValue();.
1d10: 20 20 20 20 76 61 72 20 74 65 78 74 20 3d 20 7b      var text = {
1d20: 0a 20 20 20 20 20 20 20 20 74 65 6d 70 6f 3a 20  .        tempo: 
1d30: 74 68 69 73 2e 73 74 61 74 65 2e 74 65 6d 70 6f  this.state.tempo
1d40: 2c 0a 20 20 20 20 20 20 20 20 64 69 61 6c 5f 63  ,.        dial_c
1d50: 6f 75 6e 74 3a 20 74 68 69 73 2e 73 74 61 74 65  ount: this.state
1d60: 2e 64 69 61 6c 73 2e 6c 65 6e 67 74 68 2c 0a 20  .dials.length,. 
1d70: 20 20 20 20 20 20 20 6e 75 6d 62 65 72 73 5f 63         numbers_c
1d80: 6f 75 6e 74 3a 20 74 68 69 73 2e 73 74 61 74 65  ount: this.state
1d90: 2e 6e 75 6d 62 65 72 73 2e 6c 65 6e 67 74 68 2c  .numbers.length,
1da0: 0a 20 20 20 20 20 20 20 20 73 61 6d 70 6c 65 5f  .        sample_
1db0: 6e 61 6d 65 73 3a 20 74 68 69 73 2e 73 74 61 74  names: this.stat
1dc0: 65 2e 73 61 6d 70 6c 65 73 2e 6d 61 70 28 66 75  e.samples.map(fu
1dd0: 6e 63 74 69 6f 6e 20 28 69 74 65 6d 29 20 7b 72  nction (item) {r
1de0: 65 74 75 72 6e 20 69 74 65 6d 5b 22 5f 5f 75 72  eturn item["__ur
1df0: 6c 22 5d 7d 29 2c 0a 20 20 20 20 20 20 20 20 74  l"]}),.        t
1e00: 69 63 6b 73 3a 20 31 36 2c 0a 20 20 20 20 20 20  icks: 16,.      
1e10: 20 20 63 6f 64 65 3a 20 74 68 69 73 2e 73 74 61    code: this.sta
1e20: 74 65 2e 63 6f 64 65 2c 0a 20 20 20 20 7d 3b 0a  te.code,.    };.
1e30: 20 20 20 20 63 6f 6e 73 74 20 6c 69 62 20 3d 20      const lib = 
1e40: 77 69 6e 64 6f 77 2e 4a 73 6f 6e 55 72 6c 28 27  window.JsonUrl('
1e50: 6c 7a 6d 61 27 29 3b 0a 09 6c 69 62 2e 63 6f 6d  lzma');..lib.com
1e60: 70 72 65 73 73 28 74 65 78 74 29 2e 74 68 65 6e  press(text).then
1e70: 28 65 6e 63 6f 64 65 64 44 61 74 61 20 3d 3e 20  (encodedData => 
1e80: 7b 0a 20 20 20 20 20 20 20 20 76 61 72 20 6c 69  {.        var li
1e90: 6e 6b 20 3d 20 22 2f 73 6f 6e 67 2f 22 20 2b 20  nk = "/song/" + 
1ea0: 65 6e 63 6f 64 65 64 44 61 74 61 3b 0a 20 20 20  encodedData;.   
1eb0: 20 20 20 20 20 77 69 6e 64 6f 77 2e 68 69 73 74       window.hist
1ec0: 6f 72 79 2e 70 75 73 68 53 74 61 74 65 28 7b 7d  ory.pushState({}
1ed0: 2c 20 27 42 69 74 72 68 79 74 68 6d 27 2c 20 6c  , 'Bitrhythm', l
1ee0: 69 6e 6b 29 3b 0a 20 20 20 20 20 20 20 20 2f 2f  ink);.        //
1ef0: 77 69 6e 64 6f 77 2e 6f 70 65 6e 28 6c 69 6e 6b  window.open(link
1f00: 2c 20 22 5f 62 6c 61 6e 6b 22 29 3b 0a 20 20 20  , "_blank");.   
1f10: 20 7d 29 3b 0a 7d 0a 0a 72 65 6c 6f 61 64 28 29   });.}..reload()
1f20: 20 7b 0a 20 20 20 20 77 69 6e 64 6f 77 2e 6c 6f   {.    window.lo
1f30: 63 61 74 69 6f 6e 2e 72 65 70 6c 61 63 65 28 20  cation.replace( 
1f40: 22 2f 2f 22 20 2b 20 77 69 6e 64 6f 77 2e 6c 6f  "//" + window.lo
1f50: 63 61 74 69 6f 6e 2e 68 6f 73 74 29 0a 7d 0a 0a  cation.host).}..
1f60: 72 65 73 65 74 28 29 20 7b 0a 0a 20 20 20 20 54  reset() {..    T
1f70: 6f 6e 65 2e 4d 61 73 74 65 72 2e 6d 75 74 65 20  one.Master.mute 
1f80: 3d 20 74 72 75 65 3b 0a 20 20 20 20 54 6f 6e 65  = true;.    Tone
1f90: 2e 54 72 61 6e 73 70 6f 72 74 2e 73 74 6f 70 28  .Transport.stop(
1fa0: 29 3b 0a 20 20 20 20 76 61 72 20 73 65 6c 66 20  );.    var self 
1fb0: 3d 20 74 68 69 73 3b 0a 0a 20 20 20 20 69 66 20  = this;..    if 
1fc0: 28 73 65 6c 66 2e 74 69 6d 65 72 29 20 7b 0a 20  (self.timer) {. 
1fd0: 20 20 20 20 20 20 20 63 6c 65 61 72 49 6e 74 65         clearInte
1fe0: 72 76 61 6c 28 73 65 6c 66 2e 74 69 6d 65 72 29  rval(self.timer)
1ff0: 3b 0a 20 20 20 20 7d 0a 20 20 20 20 64 6f 63 75  ;.    }.    docu
2000: 6d 65 6e 74 2e 67 65 74 45 6c 65 6d 65 6e 74 42  ment.getElementB
2010: 79 49 64 28 27 74 65 6d 70 6f 2d 76 61 6c 75 65  yId('tempo-value
2020: 27 29 2e 64 69 73 61 62 6c 65 64 20 3d 20 66 61  ').disabled = fa
2030: 6c 73 65 3b 0a 20 20 20 20 64 6f 63 75 6d 65 6e  lse;.    documen
2040: 74 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79 49 64  t.getElementById
2050: 28 27 74 69 63 6b 2d 76 61 6c 75 65 27 29 2e 64  ('tick-value').d
2060: 69 73 61 62 6c 65 64 20 3d 20 66 61 6c 73 65 3b  isabled = false;
2070: 0a 20 20 20 20 65 64 69 74 6f 72 2e 73 65 74 56  .    editor.setV
2080: 61 6c 75 65 28 22 22 29 3b 0a 0a 20 20 20 20 74  alue("");..    t
2090: 68 69 73 2e 73 74 61 74 65 20 3d 20 7b 0a 20 20  his.state = {.  
20a0: 20 20 20 20 20 20 6d 65 6d 3a 20 7b 7d 2c 0a 20        mem: {},. 
20b0: 20 20 20 20 20 20 20 64 69 61 6c 73 3a 20 5b 5d         dials: []
20c0: 2c 0a 20 20 20 20 20 20 20 20 73 61 6d 70 6c 65  ,.        sample
20d0: 73 3a 20 5b 5d 2c 0a 20 20 20 20 20 20 20 20 74  s: [],.        t
20e0: 65 6d 70 6f 3a 20 31 32 30 2c 0a 20 20 20 20 20  empo: 120,.     
20f0: 20 20 20 74 69 63 6b 73 3a 20 31 36 2c 0a 20 20     ticks: 16,.  
2100: 20 20 7d 0a 0a 20 20 20 20 74 68 69 73 2e 75 70    }..    this.up
2110: 64 61 74 65 28 29 3b 0a 20 20 20 20 72 69 6f 74  date();.    riot
2120: 2e 6d 6f 75 6e 74 28 27 62 69 74 72 68 79 74 68  .mount('bitrhyth
2130: 6d 27 2c 20 7b 0a 20 20 20 20 20 20 20 20 73 6f  m', {.        so
2140: 6e 67 3a 20 74 68 69 73 2e 70 72 6f 70 73 2e 73  ng: this.props.s
2150: 6f 6e 67 0a 20 20 20 20 7d 29 0a 0a 0a 7d 0a 0a  ong.    })...}..
2160: 65 64 69 74 54 65 6d 70 6f 28 65 29 20 7b 0a 20  editTempo(e) {. 
2170: 20 20 20 74 68 69 73 2e 75 70 64 61 74 65 28 7b     this.update({
2180: 0a 20 20 20 20 20 20 20 20 73 74 61 74 65 3a 20  .        state: 
2190: 7b 0a 20 20 20 20 20 20 20 20 20 20 20 20 2e 2e  {.            ..
21a0: 2e 74 68 69 73 2e 73 74 61 74 65 2c 0a 20 20 20  .this.state,.   
21b0: 20 20 20 20 20 20 20 20 20 74 65 6d 70 6f 3a 20           tempo: 
21c0: 70 61 72 73 65 49 6e 74 28 65 2e 74 61 72 67 65  parseInt(e.targe
21d0: 74 2e 76 61 6c 75 65 29 0a 20 20 20 20 20 20 20  t.value).       
21e0: 20 7d 0a 20 20 20 20 7d 29 0a 7d 0a 0a 65 64 69   }.    }).}..edi
21f0: 74 54 69 63 6b 73 28 65 29 20 7b 0a 20 20 20 20  tTicks(e) {.    
2200: 74 68 69 73 2e 75 70 64 61 74 65 28 7b 0a 20 20  this.update({.  
2210: 20 20 20 20 20 20 73 74 61 74 65 3a 20 7b 0a 20        state: {. 
2220: 20 20 20 20 20 20 20 20 20 20 20 2e 2e 2e 74 68             ...th
2230: 69 73 2e 73 74 61 74 65 2c 0a 20 20 20 20 20 20  is.state,.      
2240: 20 20 20 20 20 20 74 69 63 6b 73 3a 20 65 2e 74        ticks: e.t
2250: 61 72 67 65 74 2e 76 61 6c 75 65 0a 20 20 20 20  arget.value.    
2260: 20 20 20 20 7d 0a 20 20 20 20 7d 29 0a 7d 0a 0a      }.    }).}..
2270: 0a 0a 61 73 79 6e 63 20 70 6c 61 79 28 29 20 7b  ..async play() {
2280: 0a 20 20 20 20 76 61 72 20 73 65 6c 66 20 3d 20  .    var self = 
2290: 74 68 69 73 3b 0a 20 20 20 20 76 61 72 20 63 65  this;.    var ce
22a0: 6c 6c 78 20 3d 20 77 69 6e 64 6f 77 2e 63 65 6c  llx = window.cel
22b0: 6c 78 2e 63 65 6c 6c 78 3b 0a 20 20 20 20 76 61  lx.cellx;.    va
22c0: 72 20 24 20 3d 20 6a 51 75 65 72 79 3b 0a 0a 20  r $ = jQuery;.. 
22d0: 20 20 20 61 77 61 69 74 20 54 6f 6e 65 2e 63 6f     await Tone.co
22e0: 6e 74 65 78 74 2e 72 65 73 75 6d 65 28 29 0a 20  ntext.resume(). 
22f0: 20 20 20 61 77 61 69 74 20 54 6f 6e 65 2e 73 74     await Tone.st
2300: 61 72 74 28 29 3b 0a 20 20 20 20 61 77 61 69 74  art();.    await
2310: 20 54 6f 6e 65 2e 54 72 61 6e 73 70 6f 72 74 2e   Tone.Transport.
2320: 73 74 61 72 74 28 29 3b 0a 20 20 20 20 54 6f 6e  start();.    Ton
2330: 65 2e 54 72 61 6e 73 70 6f 72 74 2e 62 70 6d 2e  e.Transport.bpm.
2340: 76 61 6c 75 65 20 3d 20 74 68 69 73 2e 73 74 61  value = this.sta
2350: 74 65 2e 74 65 6d 70 6f 3b 0a 20 20 20 20 54 6f  te.tempo;.    To
2360: 6e 65 2e 54 72 61 6e 73 70 6f 72 74 2e 73 77 69  ne.Transport.swi
2370: 6e 67 2e 76 61 6c 75 65 20 3d 20 30 3b 0a 0a 20  ng.value = 0;.. 
2380: 20 20 20 77 69 6e 64 6f 77 2e 68 69 74 5f 6d 61     window.hit_ma
2390: 70 20 3d 20 7b 7d 3b 0a 0a 20 20 20 20 76 61 72  p = {};..    var
23a0: 20 74 72 61 6e 73 69 74 69 6f 6e 20 3d 20 66 75   transition = fu
23b0: 6e 63 74 69 6f 6e 20 28 29 20 7b 0a 20 20 20 20  nction () {.    
23c0: 7d 0a 0a 20 20 20 20 76 61 72 20 61 6c 77 61 79  }..    var alway
23d0: 73 20 3d 20 66 75 6e 63 74 69 6f 6e 20 28 29 20  s = function () 
23e0: 7b 0a 20 20 20 20 7d 0a 0a 20 20 20 20 76 61 72  {.    }..    var
23f0: 20 72 65 6e 64 65 72 5f 6c 6f 6f 70 20 3d 20 66   render_loop = f
2400: 75 6e 63 74 69 6f 6e 20 28 29 20 7b 0a 20 20 20  unction () {.   
2410: 20 7d 0a 0a 20 20 20 20 76 61 72 20 61 6e 69 6d   }..    var anim
2420: 61 74 69 6f 6e 20 3d 20 66 75 6e 63 74 69 6f 6e  ation = function
2430: 20 28 29 20 7b 0a 20 20 20 20 20 20 20 20 72 65   () {.        re
2440: 6e 64 65 72 5f 6c 6f 6f 70 28 29 3b 0a 20 20 20  nder_loop();.   
2450: 20 20 20 20 20 77 69 6e 64 6f 77 2e 72 65 71 75       window.requ
2460: 65 73 74 41 6e 69 6d 61 74 69 6f 6e 46 72 61 6d  estAnimationFram
2470: 65 28 61 6e 69 6d 61 74 69 6f 6e 29 0a 20 20 20  e(animation).   
2480: 20 7d 0a 0a 20 20 20 20 54 6f 6e 65 2e 4d 61 73   }..    Tone.Mas
2490: 74 65 72 2e 6d 75 74 65 20 3d 20 66 61 6c 73 65  ter.mute = false
24a0: 3b 0a 20 20 20 20 64 6f 63 75 6d 65 6e 74 2e 67  ;.    document.g
24b0: 65 74 45 6c 65 6d 65 6e 74 42 79 49 64 28 27 74  etElementById('t
24c0: 65 6d 70 6f 2d 76 61 6c 75 65 27 29 2e 64 69 73  empo-value').dis
24d0: 61 62 6c 65 64 20 3d 20 74 72 75 65 3b 0a 20 20  abled = true;.  
24e0: 20 20 64 6f 63 75 6d 65 6e 74 2e 67 65 74 45 6c    document.getEl
24f0: 65 6d 65 6e 74 42 79 49 64 28 27 74 69 63 6b 2d  ementById('tick-
2500: 76 61 6c 75 65 27 29 2e 64 69 73 61 62 6c 65 64  value').disabled
2510: 20 3d 20 74 72 75 65 3b 0a 0a 20 20 20 20 76 61   = true;..    va
2520: 72 20 6d 65 6d 20 3d 20 73 65 6c 66 2e 73 74 61  r mem = self.sta
2530: 74 65 2e 6d 65 6d 3b 0a 20 20 20 20 77 69 6e 64  te.mem;.    wind
2540: 6f 77 2e 6d 65 6d 20 3d 20 6d 65 6d 3b 0a 20 20  ow.mem = mem;.  
2550: 20 20 76 61 72 20 68 61 6e 64 6c 65 72 73 20 3d    var handlers =
2560: 20 7b 7d 3b 0a 20 20 20 20 77 69 6e 64 6f 77 2e   {};.    window.
2570: 63 6f 75 6e 74 20 3d 20 2d 31 3b 0a 0a 20 20 20  count = -1;..   
2580: 20 76 61 72 20 74 65 78 74 20 3d 20 65 64 69 74   var text = edit
2590: 6f 72 2e 67 65 74 56 61 6c 75 65 28 29 3b 0a 0a  or.getValue();..
25a0: 20 20 20 20 65 64 69 74 6f 72 2e 6f 6e 28 22 63      editor.on("c
25b0: 68 61 6e 67 65 22 2c 20 66 75 6e 63 74 69 6f 6e  hange", function
25c0: 20 28 29 20 7b 0a 20 20 20 20 20 20 20 20 74 65   () {.        te
25d0: 78 74 20 3d 20 65 64 69 74 6f 72 2e 67 65 74 56  xt = editor.getV
25e0: 61 6c 75 65 28 29 3b 0a 20 20 20 20 7d 29 3b 0a  alue();.    });.
25f0: 0a 20 20 20 20 76 61 72 20 70 61 74 74 65 72 6e  .    var pattern
2600: 73 20 3d 20 5b 20 63 65 6c 6c 78 28 22 30 30 30  s = [ cellx("000
2610: 30 22 29 20 5d 3b 20 2f 2f 20 6e 65 65 64 20 74  0") ]; // need t
2620: 68 69 73 20 66 6f 72 20 66 69 72 73 74 20 65 76  his for first ev
2630: 61 6c 0a 0a 20 20 20 20 76 61 72 20 62 61 72 73  al..    var bars
2640: 20 3d 20 30 3b 0a 20 20 20 20 76 61 72 20 74 69   = 0;.    var ti
2650: 63 6b 20 3d 20 30 3b 0a 0a 20 20 20 20 76 61 72  ck = 0;..    var
2660: 20 71 75 61 72 74 65 72 5f 62 65 61 74 5f 6c 65   quarter_beat_le
2670: 6e 67 74 68 20 3d 20 36 30 30 30 30 2e 30 20 2f  ngth = 60000.0 /
2680: 20 74 68 69 73 2e 73 74 61 74 65 2e 74 65 6d 70   this.state.temp
2690: 6f 3b 0a 20 20 20 20 76 61 72 20 62 65 61 74 5f  o;.    var beat_
26a0: 6c 65 6e 67 74 68 20 3d 20 71 75 61 72 74 65 72  length = quarter
26b0: 5f 62 65 61 74 5f 6c 65 6e 67 74 68 20 2a 20 34  _beat_length * 4
26c0: 3b 0a 20 20 20 20 76 61 72 20 64 65 6c 74 61 20  ;.    var delta 
26d0: 3d 20 62 65 61 74 5f 6c 65 6e 67 74 68 20 2f 20  = beat_length / 
26e0: 74 68 69 73 2e 73 74 61 74 65 2e 74 69 63 6b 73  this.state.ticks
26f0: 3b 0a 0a 20 20 20 20 77 69 6e 64 6f 77 2e 73 61  ;..    window.sa
2700: 6d 70 6c 65 73 20 3d 20 74 68 69 73 2e 73 74 61  mples = this.sta
2710: 74 65 2e 73 61 6d 70 6c 65 73 3b 0a 20 20 20 20  te.samples;.    
2720: 76 61 72 20 65 76 61 6c 5f 67 75 61 72 64 20 3d  var eval_guard =
2730: 20 66 61 6c 73 65 3b 0a 20 20 20 20 73 65 6c 66   false;.    self
2740: 2e 74 69 6d 65 72 20 3d 20 73 65 74 49 6e 74 65  .timer = setInte
2750: 72 76 61 6c 28 66 75 6e 63 74 69 6f 6e 20 28 29  rval(function ()
2760: 20 7b 0a 20 20 20 20 63 6f 75 6e 74 20 3d 20 63   {.    count = c
2770: 6f 75 6e 74 20 2b 20 31 3b 0a 20 20 20 20 74 69  ount + 1;.    ti
2780: 63 6b 20 3d 20 28 63 6f 75 6e 74 20 25 20 74 68  ck = (count % th
2790: 69 73 2e 73 74 61 74 65 2e 74 69 63 6b 73 29 3b  is.state.ticks);
27a0: 0a 20 20 20 20 69 66 20 28 74 69 63 6b 20 3d 3d  .    if (tick ==
27b0: 3d 20 30 29 20 2b 2b 62 61 72 73 3b 0a 0a 20 20  = 0) ++bars;..  
27c0: 20 20 24 28 22 23 64 75 72 61 74 69 6f 6e 22 29    $("#duration")
27d0: 2e 68 74 6d 6c 28 22 22 20 2b 20 62 61 72 73 20  .html("" + bars 
27e0: 2b 20 22 2e 22 20 2b 20 74 69 63 6b 20 2b 20 22  + "." + tick + "
27f0: 20 2f 20 22 20 2b 20 63 6f 75 6e 74 20 2b 20 22   / " + count + "
2800: 20 2f 20 22 20 2b 20 77 69 6e 64 6f 77 2e 72 6f   / " + window.ro
2810: 75 6e 64 54 6f 28 54 6f 6e 65 2e 54 72 61 6e 73  undTo(Tone.Trans
2820: 70 6f 72 74 2e 73 65 63 6f 6e 64 73 2c 20 32 29  port.seconds, 2)
2830: 29 3b 0a 20 20 20 20 61 6c 77 61 79 73 28 29 3b  );.    always();
2840: 0a 20 20 20 20 66 6f 72 20 28 76 61 72 20 69 20  .    for (var i 
2850: 3d 20 30 3b 20 69 20 3c 20 70 61 74 74 65 72 6e  = 0; i < pattern
2860: 73 2e 6c 65 6e 67 74 68 3b 20 69 2b 2b 29 20 7b  s.length; i++) {
2870: 0a 20 20 20 20 20 20 20 20 69 66 20 28 69 20 3d  .        if (i =
2880: 3d 20 30 29 20 7b 0a 20 20 20 20 20 20 20 20 20  = 0) {.         
2890: 20 20 20 65 76 61 6c 5f 67 75 61 72 64 20 3d 20     eval_guard = 
28a0: 74 72 75 65 3b 0a 20 20 20 20 20 20 20 20 7d 20  true;.        } 
28b0: 65 6c 73 65 20 7b 0a 20 20 20 20 20 20 20 20 20  else {.         
28c0: 20 20 20 65 76 61 6c 5f 67 75 61 72 64 20 3d 20     eval_guard = 
28d0: 66 61 6c 73 65 3b 0a 0a 20 20 20 20 20 20 20 20  false;..        
28e0: 7d 0a 20 20 20 20 20 20 20 20 76 61 72 20 64 69  }.        var di
28f0: 61 6c 73 20 3d 20 73 65 6c 66 2e 73 74 61 74 65  als = self.state
2900: 2e 64 69 61 6c 73 3b 0a 20 20 20 20 20 20 20 20  .dials;.        
2910: 76 61 72 20 6e 75 6d 62 65 72 73 20 3d 20 73 65  var numbers = se
2920: 6c 66 2e 73 74 61 74 65 2e 6e 75 6d 62 65 72 73  lf.state.numbers
2930: 3b 0a 0a 20 20 20 20 20 20 20 20 69 66 20 28 64  ;..        if (d
2940: 6f 63 75 6d 65 6e 74 2e 67 65 74 45 6c 65 6d 65  ocument.getEleme
2950: 6e 74 42 79 49 64 28 27 65 64 69 74 2d 6d 6f 64  ntById('edit-mod
2960: 65 27 29 2e 63 68 65 63 6b 65 64 29 20 7b 0a 20  e').checked) {. 
2970: 20 20 20 20 20 20 20 20 20 20 20 76 61 72 20 70             var p
2980: 5f 74 65 78 74 20 20 3d 20 6f 6c 64 50 61 74 74  _text  = oldPatt
2990: 65 72 6e 73 5b 69 5d 3b 0a 20 20 20 20 20 20 20  erns[i];.       
29a0: 20 7d 20 65 6c 73 65 20 7b 0a 20 20 20 20 20 20   } else {.      
29b0: 20 20 20 20 20 20 76 61 72 20 70 5f 74 65 78 74        var p_text
29c0: 20 3d 20 70 61 74 74 65 72 6e 73 5b 69 5d 3b 0a   = patterns[i];.
29d0: 20 20 20 20 20 20 20 20 20 20 20 20 6f 6c 64 50              oldP
29e0: 61 74 74 65 72 6e 73 5b 69 5d 20 3d 20 70 5f 74  atterns[i] = p_t
29f0: 65 78 74 3b 0a 20 20 20 20 20 20 20 20 7d 0a 20  ext;.        }. 
2a00: 20 20 20 20 20 20 20 69 66 20 28 70 5f 74 65 78         if (p_tex
2a10: 74 28 29 20 26 26 20 70 5f 74 65 78 74 28 29 2e  t() && p_text().
2a20: 6c 65 6e 67 74 68 20 21 3d 3d 20 30 29 20 7b 0a  length !== 0) {.
2a30: 20 20 20 20 20 20 20 20 20 20 20 20 76 61 72 20              var 
2a40: 74 72 61 63 6b 5f 6e 6f 20 3d 20 69 20 2b 20 31  track_no = i + 1
2a50: 3b 0a 20 20 20 20 20 20 20 20 20 20 20 20 76 61  ;.            va
2a60: 72 20 70 61 74 74 65 72 6e 20 3d 20 70 61 74 74  r pattern = patt
2a70: 65 72 6e 5f 70 61 72 73 65 28 70 5f 74 65 78 74  ern_parse(p_text
2a80: 28 29 29 3b 0a 20 20 20 20 20 20 20 20 20 20 20  ());.           
2a90: 20 76 61 72 20 6d 65 74 61 20 3d 20 70 61 74 74   var meta = patt
2aa0: 65 72 6e 5f 6d 65 74 61 28 70 5f 74 65 78 74 28  ern_meta(p_text(
2ab0: 29 29 3b 0a 20 20 20 20 20 20 20 20 20 20 20 20  ));.            
2ac0: 76 61 72 20 69 73 48 69 74 20 3d 20 28 70 61 74  var isHit = (pat
2ad0: 74 65 72 6e 2e 73 70 6c 69 74 28 27 27 29 5b 74  tern.split('')[t
2ae0: 69 63 6b 5d 20 3d 3d 20 22 31 22 29 20 3f 20 74  ick] == "1") ? t
2af0: 72 75 65 20 3a 20 66 61 6c 73 65 3b 0a 0a 20 20  rue : false;..  
2b00: 20 20 20 20 20 20 20 20 20 20 74 72 79 20 7b 0a            try {.
2b10: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20                  
2b20: 69 66 20 28 64 6f 63 75 6d 65 6e 74 2e 67 65 74  if (document.get
2b30: 45 6c 65 6d 65 6e 74 42 79 49 64 28 27 65 64 69  ElementById('edi
2b40: 74 2d 6d 6f 64 65 27 29 2e 63 68 65 63 6b 65 64  t-mode').checked
2b50: 29 20 7b 0a 20 20 20 20 20 20 20 20 20 20 20 20  ) {.            
2b60: 20 20 20 20 20 20 20 20 65 76 61 6c 28 6f 6c 64          eval(old
2b70: 43 6f 64 65 29 3b 0a 20 20 20 20 20 20 20 20 20  Code);.         
2b80: 20 20 20 20 20 20 20 7d 20 65 6c 73 65 20 7b 0a         } else {.
2b90: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20                  
2ba0: 20 20 20 20 65 76 61 6c 28 74 65 78 74 29 3b 0a      eval(text);.
2bb0: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20                  
2bc0: 20 20 20 20 69 66 20 28 64 6f 63 75 6d 65 6e 74      if (document
2bd0: 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79 49 64 28  .getElementById(
2be0: 27 72 65 64 6f 27 29 2e 63 68 65 63 6b 65 64 29  'redo').checked)
2bf0: 20 7b 0a 20 20 20 20 20 20 20 20 20 20 20 20 20   {.             
2c00: 20 20 20 20 20 20 20 20 20 20 20 64 6f 63 75 6d             docum
2c10: 65 6e 74 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79  ent.getElementBy
2c20: 49 64 28 27 72 65 64 6f 27 29 2e 63 68 65 63 6b  Id('redo').check
2c30: 65 64 20 3d 20 66 61 6c 73 65 3b 0a 20 20 20 20  ed = false;.    
2c40: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20                  
2c50: 20 20 20 20 74 69 63 6b 20 3d 20 28 63 6f 75 6e      tick = (coun
2c60: 74 20 25 20 74 68 69 73 2e 73 74 61 74 65 2e 74  t % this.state.t
2c70: 69 63 6b 73 29 3b 0a 20 20 20 20 20 20 20 20 20  icks);.         
2c80: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 63                 c
2c90: 6f 75 6e 74 20 2d 3d 20 74 69 63 6b 20 2b 20 31  ount -= tick + 1
2ca0: 3b 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20  ;.              
2cb0: 20 20 20 20 20 20 20 20 20 20 69 20 3d 20 30 3b            i = 0;
2cc0: 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20  .               
2cd0: 20 20 20 20 20 20 20 20 20 63 6f 6e 74 69 6e 75           continu
2ce0: 65 3b 0a 20 20 20 20 20 20 20 20 20 20 20 20 20  e;.             
2cf0: 20 20 20 20 20 20 20 7d 0a 20 20 20 20 20 20 20         }.       
2d00: 20 20 20 20 20 20 20 20 20 20 20 20 20 69 66 20               if 
2d10: 28 64 6f 63 75 6d 65 6e 74 2e 67 65 74 45 6c 65  (document.getEle
2d20: 6d 65 6e 74 42 79 49 64 28 27 6c 6f 61 64 2d 6d  mentById('load-m
2d30: 6f 64 65 27 29 2e 63 68 65 63 6b 65 64 29 20 7b  ode').checked) {
2d40: 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20  .               
2d50: 20 20 20 20 20 20 20 20 20 64 6f 63 75 6d 65 6e           documen
2d60: 74 2e 67 65 74 45 6c 65 6d 65 6e 74 42 79 49 64  t.getElementById
2d70: 28 27 6c 6f 61 64 2d 6d 6f 64 65 27 29 2e 63 68  ('load-mode').ch
2d80: 65 63 6b 65 64 20 3d 20 66 61 6c 73 65 3b 0a 20  ecked = false;. 
2d90: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20                  
2da0: 20 20 20 20 20 20 20 74 72 61 6e 73 69 74 69 6f         transitio
2db0: 6e 28 29 3b 0a 20 20 20 20 20 20 20 20 20 20 20  n();.           
2dc0: 20 20 20 20 20 20 20 20 20 7d 0a 20 20 20 20 20           }.     
2dd0: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 6f                 o
2de0: 6c 64 43 6f 64 65 20 3d 20 74 65 78 74 3b 0a 20  ldCode = text;. 
2df0: 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20 7d                 }
2e00: 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20 20  .               
2e10: 20 24 28 22 23 65 72 72 6f 72 22 29 2e 68 74 6d   $("#error").htm
2e20: 6c 28 22 22 29 3b 0a 20 20 20 20 20 20 20 20 20  l("");.         
2e30: 20 20 20 7d 20 63 61 74 63 68 20 28 65 78 29 20     } catch (ex) 
2e40: 7b 0a 20 20 20 20 20 20 20 20 20 20 20 20 20 20  {.              
2e50: 20 20 24 28 22 23 65 72 72 6f 72 22 29 2e 68 74    $("#error").ht
2e60: 6d 6c 28 65 78 29 3b 0a 20 20 20 20 20 20 20 20  ml(ex);.        
2e70: 20 20 20 20 20 20 20 20 65 76 61 6c 28 6f 6c 64          eval(old
2e80: 43 6f 64 65 29 3b 0a 20 20 20 20 20 20 20 20 20  Code);.         
2e90: 20 20 20 7d 0a 20 20 20 20 20 20 20 20 7d 0a 20     }.        }. 
2ea0: 20 20 20 7d 0a 20 20 7d 2e 62 69 6e 64 28 74 68     }.  }.bind(th
2eb0: 69 73 29 2c 20 64 65 6c 74 61 29 0a 0a 20 20 77  is), delta)..  w
2ec0: 69 6e 64 6f 77 2e 72 65 71 75 65 73 74 41 6e 69  indow.requestAni
2ed0: 6d 61 74 69 6f 6e 46 72 61 6d 65 28 61 6e 69 6d  mationFrame(anim
2ee0: 61 74 69 6f 6e 29 3b 0a 0a 7d 0a 0a 0a 73 74 61  ation);..}...sta
2ef0: 72 74 28 29 20 7b 0a 20 20 20 20 72 65 63 6f 72  rt() {.    recor
2f00: 64 65 72 2e 73 74 61 72 74 28 29 3b 0a 7d 0a 0a  der.start();.}..
2f10: 73 74 6f 70 28 29 20 7b 0a 20 20 20 20 72 65 63  stop() {.    rec
2f20: 6f 72 64 65 72 2e 73 74 6f 70 28 29 3b 0a 7d 0a  order.stop();.}.
2f30: 0a 61 64 64 44 69 61 6c 28 29 20 7b 0a 20 20 20  .addDial() {.   
2f40: 20 74 68 69 73 2e 73 74 61 74 65 2e 64 69 61 6c   this.state.dial
2f50: 73 2e 70 75 73 68 28 7b 7d 29 3b 0a 20 20 20 20  s.push({});.    
2f60: 74 68 69 73 2e 75 70 64 61 74 65 28 29 3b 0a 7d  this.update();.}
2f70: 0a 0a 61 64 64 4e 75 6d 62 65 72 28 29 20 7b 0a  ..addNumber() {.
2f80: 20 20 20 20 74 68 69 73 2e 73 74 61 74 65 2e 6e      this.state.n
2f90: 75 6d 62 65 72 73 2e 70 75 73 68 28 7b 7d 29 3b  umbers.push({});
2fa0: 0a 20 20 20 20 74 68 69 73 2e 75 70 64 61 74 65  .    this.update
2fb0: 28 29 3b 0a 7d 0a 0a 61 64 64 55 52 4c 28 76 61  ();.}..addURL(va
2fc0: 6c 75 65 29 20 7b 0a 20 20 20 20 76 61 72 20 73  lue) {.    var s
2fd0: 65 6c 66 20 3d 20 74 68 69 73 3b 0a 20 20 20 20  elf = this;.    
2fe0: 74 68 69 73 2e 73 74 61 74 65 2e 73 61 6d 70 6c  this.state.sampl
2ff0: 65 73 2e 70 75 73 68 28 7b 22 5f 5f 6e 61 6d 65  es.push({"__name
3000: 22 3a 20 76 61 6c 75 65 7d 29 3b 0a 20 20 20 20  ": value});.    
3010: 76 61 72 20 73 61 6d 3b 0a 20 20 20 20 73 61 6d  var sam;.    sam
3020: 20 3d 20 6e 65 77 20 54 6f 6e 65 2e 53 61 6d 70   = new Tone.Samp
3030: 6c 65 72 28 7b 0a 20 20 20 20 20 20 20 20 75 72  ler({.        ur
3040: 6c 73 3a 20 20 7b 0a 20 20 20 20 20 20 20 20 20  ls:  {.         
3050: 20 20 20 22 43 33 22 3a 20 76 61 6c 75 65 2c 0a     "C3": value,.
3060: 20 20 20 20 20 20 20 20 7d 0a 20 20 20 20 7d 29          }.    })
3070: 3b 0a 20 20 20 20 73 61 6d 5b 22 5f 5f 6e 61 6d  ;.    sam["__nam
3080: 65 22 5d 20 3d 20 76 61 6c 75 65 3b 0a 20 20 20  e"] = value;.   
3090: 20 73 61 6d 5b 22 5f 5f 75 72 6c 22 5d 20 3d 20   sam["__url"] = 
30a0: 76 61 6c 75 65 3b 0a 20 20 20 20 73 65 6c 66 2e  value;.    self.
30b0: 73 65 74 53 61 6d 70 6c 65 28 73 61 6d 2c 20 73  setSample(sam, s
30c0: 65 6c 66 2e 73 74 61 74 65 2e 73 61 6d 70 6c 65  elf.state.sample
30d0: 73 2e 6c 65 6e 67 74 68 20 2d 20 31 29 3b 0a 7d  s.length - 1);.}
30e0: 0a 0a 61 64 64 53 61 6d 70 6c 65 55 52 4c 28 29  ..addSampleURL()
30f0: 20 7b 0a 20 20 20 20 76 61 72 20 73 65 6c 66 20   {.    var self 
3100: 3d 20 74 68 69 73 3b 0a 20 20 20 20 61 6c 65 72  = this;.    aler
3110: 74 69 66 79 2e 70 72 6f 6d 70 74 28 20 27 45 6e  tify.prompt( 'En
3120: 74 65 72 20 53 61 6d 70 6c 65 20 55 52 4c 27 2c  ter Sample URL',
3130: 20 27 27 2c 20 27 27 0a 20 20 20 20 20 20 20 20   '', ''.        
3140: 2c 20 66 75 6e 63 74 69 6f 6e 28 65 76 74 2c 20  , function(evt, 
3150: 76 61 6c 75 65 29 20 7b 0a 20 20 20 20 20 20 20  value) {.       
3160: 20 20 20 20 20 73 65 6c 66 2e 61 64 64 55 52 4c       self.addURL
3170: 28 76 61 6c 75 65 29 3b 0a 20 20 20 20 20 20 20  (value);.       
3180: 20 7d 0a 20 20 20 20 20 20 20 20 2c 20 66 75 6e   }.        , fun
3190: 63 74 69 6f 6e 28 29 20 7b 0a 20 20 20 20 20 20  ction() {.      
31a0: 20 20 20 20 20 20 61 6c 65 72 74 69 66 79 2e 65        alertify.e
31b0: 72 72 6f 72 28 27 43 61 6e 63 65 6c 27 29 0a 20  rror('Cancel'). 
31c0: 20 20 20 20 20 20 20 7d 0a 20 20 20 20 29 3b 0a         }.    );.
31d0: 7d 0a 0a 61 64 64 53 61 6d 70 6c 65 28 29 20 7b  }..addSample() {
31e0: 0a 20 20 20 20 74 68 69 73 2e 73 74 61 74 65 2e  .    this.state.
31f0: 73 61 6d 70 6c 65 73 2e 70 75 73 68 28 7b 7d 29  samples.push({})
3200: 3b 0a 20 20 20 20 74 68 69 73 2e 75 70 64 61 74  ;.    this.updat
3210: 65 28 29 3b 0a 7d 0a 0a 72 6d 53 61 6d 70 6c 65  e();.}..rmSample
3220: 28 69 6e 64 65 78 29 20 7b 0a 20 20 20 74 68 69  (index) {.   thi
3230: 73 2e 73 74 61 74 65 2e 73 61 6d 70 6c 65 73 2e  s.state.samples.
3240: 73 70 6c 69 63 65 28 69 6e 64 65 78 2c 20 31 29  splice(index, 1)
3250: 3b 0a 20 20 20 74 68 69 73 2e 75 70 64 61 74 65  ;.   this.update
3260: 28 29 3b 0a 7d 0a 0a 72 6d 44 69 61 6c 28 69 6e  ();.}..rmDial(in
3270: 64 65 78 29 20 7b 0a 20 20 20 74 68 69 73 2e 73  dex) {.   this.s
3280: 74 61 74 65 2e 64 69 61 6c 73 2e 73 70 6c 69 63  tate.dials.splic
3290: 65 28 69 6e 64 65 78 2c 20 31 29 3b 0a 20 20 20  e(index, 1);.   
32a0: 74 68 69 73 2e 75 70 64 61 74 65 28 29 3b 0a 7d  this.update();.}
32b0: 0a 0a 72 6d 4e 75 6d 62 65 72 28 69 6e 64 65 78  ..rmNumber(index
32c0: 29 20 7b 0a 20 20 20 74 68 69 73 2e 73 74 61 74  ) {.   this.stat
32d0: 65 2e 6e 75 6d 62 65 72 73 2e 73 70 6c 69 63 65  e.numbers.splice
32e0: 28 69 6e 64 65 78 2c 20 31 29 3b 0a 20 20 20 74  (index, 1);.   t
32f0: 68 69 73 2e 75 70 64 61 74 65 28 29 3b 0a 7d 0a  his.update();.}.
3300: 0a 73 65 74 53 61 6d 70 6c 65 28 65 2c 20 69 29  .setSample(e, i)
3310: 20 7b 0a 20 20 20 20 74 68 69 73 2e 73 74 61 74   {.    this.stat
3320: 65 2e 73 61 6d 70 6c 65 73 5b 69 5d 20 3d 20 65  e.samples[i] = e
3330: 3b 0a 20 20 20 20 74 68 69 73 2e 75 70 64 61 74  ;.    this.updat
3340: 65 28 29 3b 0a 7d 0a 0a 3c 2f 73 63 72 69 70 74  e();.}..</script
3350: 3e 0a 0a 3c 2f 62 69 74 72 68 79 74 68 6d 3e 0a  >..</bitrhythm>.
3360: 0a                                               .