diff options
| author | Jules Laplace <jules@okfoc.us> | 2016-09-14 12:37:11 -0400 |
|---|---|---|
| committer | Jules Laplace <jules@okfoc.us> | 2016-09-14 12:37:11 -0400 |
| commit | fa5defe301cf43409b0c86c306cddd2ef70cca64 (patch) | |
| tree | d510579cc423b6189fdceaba583fde2eb424db6e | |
| parent | 5dd0bbbf6630e524c14865bd92dbf5aa1734e7d3 (diff) | |
| parent | 46990e203362793d71871b23e91af8a4ac6958e8 (diff) | |
Merge branch 'master' of ghghgh.us:harp
| -rw-r--r-- | env.js | 45 | ||||
| -rw-r--r-- | index.html | 8 |
2 files changed, 43 insertions, 10 deletions
@@ -42,6 +42,7 @@ var environment = (function(){ environment.build = function(){ environment.scale() environment.duration() + environment.set_intervals() snap = new Snap (window.innerWidth, window.innerHeight - $("#controls").height()) dot_grid = new DotGrid () @@ -111,6 +112,7 @@ var environment = (function(){ $("#tet").on("input", environment.scale) $("#root").on("input", environment.scale) $("#interval").on("input", environment.scale) + $("#intervals").on("input", environment.set_intervals) $("#duration").on("input", environment.duration) $("#use_scale").on("change", environment.use_scale) if (is_mobile) { @@ -134,6 +136,32 @@ var environment = (function(){ environment.use_scale = function(){ use_scale = $("#use_scale").get(0).checked } + environment.set_intervals = function(){ + root = parseFloat( $("#root").val() ) + var intervals = $("#intervals").val().split(/\s/).map(function(v){ + if (v.indexOf("/") !== -1) return parseInterval(v) // intervals + if (v.indexOf("f") !== -1) return parseFloat(v) // pure frequencies + return parseFloat(v) + }).filter(function(v){ + return !! v + }) + if (! intervals.length) return + var last_interval = intervals[ intervals.length-1 ] + if (last_interval > 20) { + interval = last_interval / intervals[0] + } + else { + interval = intervals.pop() + } + scale = intervals.map(function(v){ + if (v < 20) { + return v * root + } + else { + return v + } + }) + } environment.check_drawing = function(){ drawing = ! drawing $("#draw").html( drawing ? "drawing" : "playing" ) @@ -255,7 +283,7 @@ var environment = (function(){ var ratio, n tet = parseFloat( $("#tet").val() ) root = parseFloat( $("#root").val() ) - interval = parseInterval( $("#interval").val() ) + interval = intervals[ intervals.length - 1 ] ratio = Math.pow( interval, 1/tet ) n = root scale = [n] @@ -291,12 +319,15 @@ var environment = (function(){ return scale_f } environment.quantize_index = function(index){ - return mod(index, scale.length-1)|0 + return mod(index-1, scale.length)|0 } environment.index_to_frequency = function(index){ - var f = scale[ mod(index, scale.length-1)|0 ] - var pow = Math.floor(norm(index, 0, scale.length-1)) - 2 - f *= Math.pow(interval, pow) + var f = scale[ mod(index, scale.length)|0 ] +// if (f < 20) { + var pow = Math.floor(norm(index-1, 0, scale.length)) - 2 + f *= Math.pow(interval, pow) +// } + // console.log(index, f, pow) // console.log(index, scale.length, pow, f) return f } @@ -433,7 +464,8 @@ var environment = (function(){ } Wire.prototype.updateColor = function(should_set){ var index = this.index() - var color = Snap.hsl(mod(index / tet * 240 + 180, 360), 100, 50) + // console.log(index, scale.length, index / scale.length) + var color = Snap.hsl(mod(index / scale.length * 240 + 180, 360), 100, 50) if (should_set) { this.path.attr({ stroke: color, @@ -514,7 +546,6 @@ var environment = (function(){ if (isNaN(num)) return 2 if (isNaN(den) || den == 0) return num if (num == den) return 2 - if (num < den) return den/num return num / den } @@ -36,7 +36,9 @@ input[type=text] { width: 30px } text-align: center; line-height: 80px; } - +#intervals { + width: 200px; +} </style> </head> <body class="loading"> @@ -60,10 +62,10 @@ input[type=text] { width: 30px } <input id="tet" type="number" min="2" max="500" step="1" value="12"> <label for="root">root</label> <input id="root" type="number" min="20" max="20000" value="440"> - <label for="interval">interval</label> - <input id="interval" type="text" value="2/1"> <label for="duration">duration</label> <input id="duration" type="number" min="0" max="5000" step="50" value="1250"> + <label for="intervals">intervals</label> + <input id="intervals" type="text" value="1/1 9/8 5/4 4/3 3/2 5/3 15/8 2/1"> <label for="use_scale">use scale</label> <input id="use_scale" type="checkbox" checked> <div id="mobile_controls"> |