genish.js
Version:
116 lines (96 loc) • 3.31 kB
HTML
<html>
<head>
<title>Genish.js Playground</title>
<script src="../node_modules/codemirror/lib/codemirror.js"></script>
<link rel="stylesheet" href="../node_modules/codemirror/lib/codemirror.css">
<link rel="stylesheet" href="../node_modules/codemirror/theme/monokai.css">
<script src="../node_modules/codemirror/mode/javascript/javascript.js"></script>
<script src="../node_modules/codemirror/addon/edit/matchbrackets.js"></script>
<script src="../node_modules/jsdsp/jsdsp_include.js"></script>
<script src="./dat.gui.js"></script>
<script src="../dist/gen.lib.js"></script>
<script src="./environment.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<style>
.CodeMirror-highlight {
background:red
}
body {
margin: 0;
box-sizing:border;
color:#ddd;
font-family: Helvetica Neue, sans-serif;
}
#header {
width:100%;
height:2em;
background:#272822;
border-bottom:1px solid #666;
}
select{
display:inline-block;
background: #222;
color: #ccc;
-webkit-border-radius:0px;
-moz-border-radius:0px;
border-radius:0px;
border-color: #555;
}
h1 {
font-family: monospace;
font-size: 1.5em;
font-weight: normal;
padding-left:.5em;
padding-top:.25em;
padding-right: 3em;
height:1.5em;
vertical-align:middle;
display:inline-block;
margin:0
}
#jsdspHelp { font-size:1.2em ; cursor: pointer; color:white }
#jsdspHelp:hover { color:red }
#header span { font-size: .8em; }
#editor { width:60%; box-sizing: border; display:inline-block; height:calc( 100% - 2em); border-right:1px solid #666 }
#console{ width:40%; box-sizing:border; display:inline-block; background:grey; position:absolute; height:calc( 100% - 2em ); }
.dg { z-index:100 }
#reference a{ color: #ccc ; margin-left: 2em }
.CodeMirror-matchingbracket {
text-decoration:none ;
background: rgba(255,255,255,.25)
}
</style>
</head>
<body>
<div id='header'>
<h1>genish.js</h1>
<span>demos:</span>
<select>
<option>intro & instructions</option>
<option>thereminish - mouse interaction</option>
<option>sequencing and modulating scheduling</option>
<option>hard sync</option>
<option>bit crushing / sample reduction</option>
<option>enveloping</option>
<option>FM feedback -> band-limited saw</option>
<option>biquad filter</option>
<option>zero-delay (virtual analog) filter</option>
<option>zero-delay (virtual analog) ladder filter</option>
<option>slicing the amen break</option>
<option>one delay line</option>
<option>comb filter w/ feedback</option>
<option>schroeder/moorer reverberation (freeverb)</option>
<option>gigaverb</option>
<option>garden of earthly delays</option>
<option>karplus strong</option>
</select>
<!--<span style='position:relative; left:1em'>-->
<!-- use jsdsp:<input type='checkbox' id='jsdsp'>-->
<!-- <span ><a id='jsdspHelp' href="../jsdsp.html">?</a></span>-->
<!--</span>-->
<span id='reference'><a href='../docs/index.html'>reference</a>
</div>
<div id='editor'></div>
<div id='console'></div>
</body>
</html>