diff --git a/Makefile b/Makefile
index 21ec242..de1be7f 100644
--- a/Makefile
+++ b/Makefile
@@ -2,7 +2,9 @@
 
 all: js/application.js js/preact.min.js | js
 
-js/application.js : src/main.jsx src/application.jsx src/note_input.jsx src/wave_data.jsx
+SRC = src/main.jsx src/application.jsx src/note_input.jsx src/wave_data.jsx src/utils.js src/input.jsx
+
+js/application.js : $(SRC)
 	esbuild --bundle --jsx-factory=preact.h --jsx-fragment=preact.Fragment --format=esm \
 	src/main.jsx --outfile=js/application.js 
 
diff --git a/src/application.jsx b/src/application.jsx
index e8d8bd0..83464ae 100644
--- a/src/application.jsx
+++ b/src/application.jsx
@@ -1,90 +1,15 @@
 
 // var h = preact.h;
 
+import { calc_sr, calc_shift, log2 } from './utils';
+
 import { NoteInput, NoteFrequency } from './note_input';
 import { RadioGroup } from './radio_group';
 import { WaveData } from './wave_data';
 
-function calc_sr(osc) {
-	// iigs is ~7.14Mhz / 8.  Mirage is 8Mhz / 8
-	// return (28.63636*1000*1000/32) / (osc + 2);
-	return (28_636_360/32) / (osc + 2);
-}
-
-function calc_shift(res,ws) {
-	return res + 9 - ws;
-}
-
-function log2(x) {
-	var y = Math.log2(x);
-	return (y >> 0) === y ? y : false;
-}
+import { Oscillators, WaveSize, Resolution, Frequency, Assembler, WaveShape } from './input';
 
 
-var _onames = [];
-function Oscillators(props) {
-
-	if (!_onames.length) {
-		for (var i = 1; i < 33; ++i) {
-			var x  = (calc_sr(i) / 1000 ).toFixed(2) + " kHz";
-			_onames.push(x)
-		}
-	}
-	var options = _onames.map( (x, ix) => {
-		var i = ix + 1;
-		return <option value={i} key={i}>{i} – {x}</option>
-	});
-	// for (var i = 1; i < 33; ++i) {
-	// 	options.push(<option value={i} key={i}>{i}</option>);
-	// }
-	return <select value={props.value} onChange={props.onChange}>{options}</select>;
-}
-
-function WaveSize(props) {
-
-	var options = []
-	for (var i = 8; i < 16; ++i) {
-		var ext = 1 << i;
-		var int = i - 8;
-		options.push(<option value={int} key={int}>{ext}</option>);
-	}
-	return <select value={props.value} onChange={props.onChange}>{options}</select>;
-}
-
-function Resolution(props) {
-
-	var options = []
-	for (var i = 0; i < 8; ++i) {
-		options.push(<option value={i} key={i}>{i}</option>);
-	}
-	return <select value={props.value} onChange={props.onChange}>{options}</select>;
-}
-
-function Frequency(props) {
-
-	/* number, min, max are not as strict as they ought to be */
-	return <input type="number" min="0" max="65535" value={props.value} onChange={props.onChange} />;
-}
-
-
-
-function Assembler(props) {
-
-	var options = ["Merlin", "ORCA/M", "MPW"].map( (o, ix) => {
-		return <option key={ix} value={ix}>{o}</option>;
-	});
-
-	return <select {...props}>{options}</select>;
-}
-
-function WaveShape(props) {
-
-	var options = ["Sine", "Square", "Triangle", "Sawtooth"].map( (o, ix) => {
-		return <option key={ix} value={ix}>{o}</option>;
-	});
-
-	return <select {...props}>{options}</select>;	
-}
 
 
 function nmultiply(x) {
diff --git a/src/input.jsx b/src/input.jsx
new file mode 100644
index 0000000..b037388
--- /dev/null
+++ b/src/input.jsx
@@ -0,0 +1,67 @@
+
+import { calc_sr } from './utils'
+
+var _onames = [];
+export function Oscillators(props) {
+
+	if (!_onames.length) {
+		for (var i = 1; i < 33; ++i) {
+			var x  = (calc_sr(i) / 1000 ).toFixed(2) + " kHz";
+			_onames.push(x)
+		}
+	}
+	var options = _onames.map( (x, ix) => {
+		var i = ix + 1;
+		return <option value={i} key={i}>{i} – {x}</option>
+	});
+	// for (var i = 1; i < 33; ++i) {
+	// 	options.push(<option value={i} key={i}>{i}</option>);
+	// }
+	return <select value={props.value} onChange={props.onChange}>{options}</select>;
+}
+
+export function WaveSize(props) {
+
+	var options = []
+	for (var i = 8; i < 16; ++i) {
+		var ext = 1 << i;
+		var int = i - 8;
+		options.push(<option value={int} key={int}>{ext}</option>);
+	}
+	return <select value={props.value} onChange={props.onChange}>{options}</select>;
+}
+
+export function Resolution(props) {
+
+	var options = []
+	for (var i = 0; i < 8; ++i) {
+		options.push(<option value={i} key={i}>{i}</option>);
+	}
+	return <select value={props.value} onChange={props.onChange}>{options}</select>;
+}
+
+export function Frequency(props) {
+
+	/* number, min, max are not as strict as they ought to be */
+	return <input type="number" min="0" max="65535" value={props.value} onChange={props.onChange} />;
+}
+
+
+
+export function Assembler(props) {
+
+	var options = ["Merlin", "ORCA/M", "MPW"].map( (o, ix) => {
+		return <option key={ix} value={ix}>{o}</option>;
+	});
+
+	return <select {...props}>{options}</select>;
+}
+
+export function WaveShape(props) {
+
+	var options = ["Sine", "Square", "Triangle", "Sawtooth"].map( (o, ix) => {
+		return <option key={ix} value={ix}>{o}</option>;
+	});
+
+	return <select {...props}>{options}</select>;	
+}
diff --git a/src/utils.js b/src/utils.js
new file mode 100644
index 0000000..6aa5eb3
--- /dev/null
+++ b/src/utils.js
@@ -0,0 +1,15 @@
+
+export function calc_sr(osc) {
+	// iigs is ~7.14Mhz / 8.  Mirage is 8Mhz / 8
+	// return (28.63636*1000*1000/32) / (osc + 2);
+	return (28_636_360/32) / (osc + 2);
+}
+
+export function calc_shift(res,ws) {
+	return res + 9 - ws;
+}
+
+export function log2(x) {
+	var y = Math.log2(x);
+	return (y >> 0) === y ? y : false;
+}