var TransformParameter = function(instr, tDefinition, parent, transform, twist, onChange) {
	var self = this;
	var refreshable = false;
	var changeFunc;
	var initval = true;
	var definition = {};
	var randomiseAllowed = true;
	var visible = true;
	
	if (parent) {
		Object.assign(definition, tDefinition);
	} else {
		definition = tDefinition;
	}
	
	if (definition.channel == "applymode") {
		randomiseAllowed = false;
	}
	
	if (definition.hasOwnProperty("preset")) {
		var save = {};
		for (var s of ["dfault", "name", "channel", "automatable", "description"]) {					
			if (definition.hasOwnProperty(s)) {
				save[s] = definition[s];
			}
		}
			
		if (definition.preset == "amp") {
			Object.assign(definition, {name: "Amplitude", channel: "amp", description: "Amplitude", dfault: 1, min: 0, max: 1});
		} else if (definition.preset == "pvslock") {
			Object.assign(definition, {name: "Peak lock", channel: "pvslock", description: "Lock frequencies around peaks", step: 1, dfault: 0});					
		} else if (definition.preset == "fftsize") {					
			Object.assign(definition, {name: "FFT size", channel: "fftsize", description: "FFT size", options: [256, 512, 1024, 2048, 4096, 8192, 16384, 32768, 65535], dfault: 2, asvalue: true, automatable: false, lagHint: -1});						
		} else if (definition.preset == "wave") {
			Object.assign(definition, {name: "Wave", description: "Wave shape to use", options: ["Sine", "Square", "Saw", "Pulse", "Triangle"], dfault: 0, channel: "wave"});
		} else if (definition.preset == "wintype") {
			Object.assign(definition, {name: "Window type", channel: "wintype", description: "Window shape", options: ["Hanning", "Hamming", "Half sine"], dfault: 0, automatable: false});
		
		} else if (definition.preset == "instanceloop") {
			Object.assign(definition, {name: "Cross instance loop type", channel: "otlooptype", description: "Loop type of other instance", options: ["None", "Forward", "Backward", "Ping-pong"], dfault: 0});
		
		} else if (definition.preset == "applymode") {
			Object.assign(definition, {name: "Apply mode", channel: "applymode", absolutechannel: true, description: "Apply mode", automatable: false, options: ["Replace", "Mix", "Modulate", "Demodulate"], dfault: 0});
		} else if (definition.preset == "note") {
			var notes = {};
			for (var i = 21; i < 128; i++) {
				var v = twist.noteData.data.notes[i];
				notes[v[0]] = v[1];
			}
			Object.assign(definition, {name: "Note", channel: "note", description: "Note to use", options: notes, dfault: 69, automatable: true});
		} else if (definition.preset == "instance") {
			var c = (!definition.channel) ? "ot" : definition.channel;
			initval = false;
			if (transform) transform.refreshable = true;
			refreshable = true;
			Object.assign(definition, {
				name: "Instance", description: "Other wave to use", channel: instr + "_" + "instance",
				options: twist.otherInstanceNames,
				automatable: false
			});
			changeFunc = function(index) {
				var s = twist.waveforms[index].selected;
				app.setControlChannel(instr + "_" + "inststart", s[0]);
				app.setControlChannel(instr + "_" + "instend", s[1]);
				app.setControlChannel(instr + "_" + "instchan", s[2]);
			};
		}
		if (save) {
			Object.assign(definition, save);
		}
	} // if preset
	
	var type;
							
	if (definition.hasOwnProperty("conditions") && !parent) {
		refreshable = true;
		if (transform) transform.refreshable = refreshable;
	}
	
	var channel = "";
	if (!definition.hasOwnProperty("absolutechannel")) {
		channel = (parent) ? parent.channel : instr + "_";
	}
	
	if (definition.hasOwnProperty("channel")) {
		channel += definition.channel;
	} else {
		channel += definition.name.toLowerCase();
	}

	var elContainer = $("<div />");
	var elValueLabel = $("<div />");
	var elValueInput;
	var elModulations;
	var elInput;
	var elRow;
	var elModSelect;
	var automation = [];
	
	this.definition = definition;
	this.modulation = null;
	this.automation = null;
	this.channel = channel;
	this.modulationParameters = null;
	
	this.setPlaying = async function(state) {
		if (definition.automatable || definition.hidden) return;
		if (elValueInput) {
			elValueInput.prop("disabled", state);
			elValueInput.css("opacity", (state) ? 0.8 : 1);
		}
		
		if (elInput) {
			elInput.prop("disabled", state);
			elInput.css("opacity", (state) ? 0.8 : 1);
		}
	};
	
	
	if (!definition.hasOwnProperty("hidden")) {
		definition.hidden = false;
	}
	
	if (!definition.hasOwnProperty("step")) {
		definition.step = 0.0000001;
	}
	
	if (!definition.hasOwnProperty("min")) {
		definition.min = 0;
	}
	
	if (!definition.hasOwnProperty("max")) {
		definition.max = 1;
	}
	
	if (!definition.hasOwnProperty("fireChanges")) {
		definition.fireChanges = true;
	}
	
	if (!definition.hasOwnProperty("dfault")) {
		definition.dfault = 1;
	}
	
	if (parent) {
		if (definition.hostrange) { 
			var items = ["step", "min", "max", "options", "conditions", "hostrange"];
			if (definition.dfault == "hostrangemin") {
				definition.dfault = parent.definition.min;
			} else if (definition.dfault == "hostrangemax") {
				definition.dfault = parent.definition.max;
			} else {
				items.push("dfault");
			}
			for (let o of items) {
				if (parent.definition.hasOwnProperty(o)) {
					definition[o] = parent.definition[o];
				}
			}
		} else if (definition.preset == "hostrangemin") {
			definition.min = definition.max = definition.dfault = parent.definition.min;
		} else if (definition.preset == "hostrangemax") {
			definition.min = definition.max = definition.dfault = parent.definition.max;
		}
	}
	
	if (definition.hasOwnProperty("options")) {
		type = "select";
	} else if (definition.hasOwnProperty("type")) {
		type = definition.type;
	} else if (definition.min == 0 && definition.max == 1 && definition.step == 1) {
		type = "checkbox";
	} else {
		type = "range";
	}
	
	if (!definition.hasOwnProperty("automatable")) {
		definition.automatable = ((type == "range" || type == "checkbox") && !parent);
	}
	
	this.getLagHint = function() {
		if (!definition.lagHint || !visible) return;
		var lagHint;
		if (typeof(definition.lagHint) == "object") {
			lagHint = "setting <i>" + definition.name + "</i> to <i>"
				+ definition.options[definition.lagHint.option] + "</i>";
		} else {
			lagHint = ((definition.lagHint < 0) ? "reducing" : "increasing")
				+ " <i>" + definition.name + "</i>";
		}
		return lagHint;
	};
	
	this.setRawValue = function(val) {
		if (type == "checkbox") {
			elInput[0].checked = (val == 0) ? false : true;
		} else {
			elInput.val(val);
		}
		elInput.trigger("change");
	}
	
	this.getRawValue = function() {
		return elInput.val();
	}
	
	this.getValue = function() {
		var val;
		if (type == "range" || type == "string") {
			val = elInput.val();
		} else if (type == "select") {
			val = (definition.asvalue) ? elInput.find("option:selected").text() : elInput.val();
		} else if (type == "checkbox") {
			val = (elInput[0].checked) ? 1 : 0;
		}
		return val;
	};

	this.reset = function() {
		self.setRawValue(definition.dfault);
		if (automationActive) disableAutomation();
		if (self.automation) {
			delete self.automation;
			self.automation = null;
		}
		if (elSpline) {
			elSpline.remove();
			delete elSpline;
		}
		if (modulationShown) hideModulations();
	};
	
	this.randomise = function() {
		if (!randomiseAllowed) return;
		var val;
		if (definition.automatable) {
			if (Math.random() >= 0.5) {
				modButton.el.click();
			}
		}
		
		if (type == "select") {
			val = Math.round(Math.random() * (definition.options.length - 1));
		} else if (type == "range") {
			val = (Math.random() * (definition.max - definition.min)) + definition.min;
			if (definition.step == 1) {
				val = Math.round(val);
			} else {
				val = Math.ceil((val - definition.min) / definition.step) * definition.step + definition.min;
			}				
		} else if (type = "checkbox") {
			val = (Math.round(Math.random()));
		}
		self.setRawValue(val);
		
		if (self.modulationParameters) {
			// 4 = just the non-crossadaptive ones
			elModSelect.val(Math.round(Math.random() * 4)).trigger("change");
			for (let mp in self.modulationParameters) {
				self.modulationParameters[mp].randomise();
			}
		}
	};
	
	
	this.refresh = function() {
		if (!refreshable || !transform) {
			return;
		}
		if (definition.preset == "instance") {
			createSelectOptions(elInput, twist.otherInstanceNames);
		}
		for (var k in definition.conditions) {
			var c = definition.conditions[k];
			var val = transform.parameters[transform.instr + "_" + c.channel].getValue();
			if (
				(c.operator == "eq" && val != c.value) ||
				(c.operator == "neq" && val == c.value) ||
				(c.operator == "lt" && val >= c.value) ||
				(c.operator == "gt" && val <= c.value) ||
				(c.operator == "le" && val > c.value) ||
				(c.operator == "ge" && val < c.value)
			) {
				visible = false;
				return elRow.hide();
			}
		}
		visible = true;
		elRow.show();
	};
	
	function createSelectOptions(elSelect, options) {
		var selected = elInput.val();
		elSelect.empty();
		for (var x in options) {
			var opt = $("<option />").text(options[x]).val(x).appendTo(elSelect);
			if (x == selected) {
				opt.attr("selected", "1");
				if (changeFunc) changeFunc(x);
			}
		}
		definition.min = 0;
		definition.max = (Array.isArray(options)) ? options.length - 1 : Object.keys(options).length - 1;
	}
	
	function updateLabel() {
		if (elValueInput) {
			var val = self.getValue();
			updateinput = false;
			rounding = 10000;
			val = Math.round(val * rounding) / rounding;
			elValueInput.val(val);
			updateinput = true;
		}
	}
	
	if (type == "select") {
		elInput = $("<select />");
		elInput.change(function(){
			var val = self.getValue();
			if (transform) transform.refresh();
			if (definition.fireChanges) {
				if (changeFunc) changeFunc(val);
				app.setControlChannel(channel, val);
			}
			if (onChange) {
				onChange(val);
			}
		});
		
		var options = (definition.hostrange && parent) ? parent.definitions.options : definition.options;
		createSelectOptions(elInput, options);
		
	} else if (type == "string") {
		elInput = $("<input />").change(function() {
			if (transform) transform.refresh();
			var val = self.getValue();
			if (definition.fireChanges) {
				app.setStringChannel(channel, val);
			}
			if (onChange) {
				onChange(val);
			}
		});
		
	} else if (type == "checkbox") {
		elInput = $("<input />").addClass("tp_checkbox").attr("type", "checkbox").on("change", function() {
			if (transform) transform.refresh();
			var val = self.getValue();
			if (definition.fireChanges) {
				app.setControlChannel(channel, val);
			}
			if (onChange) {
				onChange(val);
			}
		});
	} else if (type == "range") {
		var updateinput = true;
		var max = definition.max;
		var min = definition.min;
		var step = definition.step;
		var dfault = definition.dfault;
	
		elInput = $("<input />").addClass("tp_slider").attr("type", "range").on("input", function() {
			updateLabel();
			if (definition.fireChanges) {
				app.setControlChannel(channel, self.getValue());
			}
		}).change(function() {
			updateLabel();
			if (transform) transform.refresh();
			var val = self.getValue();
			if (definition.fireChanges) {
				app.setControlChannel(channel, val);
			}
			if (onChange) {
				onChange(val);
			}
		}).attr("min", min).attr("max", max).attr("step", step).val(dfault);
		
		elValueInput = $("<input />").attr("type", "number").attr("min", min).attr("max", max).attr("step", step).addClass("transparentinput").appendTo(elValueLabel).change(function() {
			if (updateinput) {
				elInput.val($(this).val()).trigger("change").trigger("input");
			}
		});
	}
	
	elContainer.append(elInput);
	if (initval) {
		self.setRawValue(definition.dfault);
		if (definition.fireChanges) {
			elInput.trigger("change");
		}
	}
	
	
	this.setDefault = function() {
		elInput.val(definition.dfault).trigger("change"); 
		//app.setControlChannel(channel, definition.dfault);
	};
	
	this.remove = function() {
		elRow.remove();
		if (elSpline) {
			elSpline.remove();
		}
		if (self.modulation) {
			self.modulation = null;
		}
		if (self.automation) {
			self.automation = null;
		}
	};
	
	this.getAutomationData = function(start, end) {
		if (self.modulation) {
			var m = twist.appdata.modulations[self.modulation];
			return {type: "modulation", data: [m.instr, self.channel]};
		} else if (automationActive && self.automation) {
			return {type: "automation", channel: self.channel, data: self.automation.getLinsegData(start, end, twist.waveform.getRegion())};
		}
	};
	
	var resetButton = twirl.createIcon({
		label: "Reset parameter",
		icon: "reset",
		click: function() {
			self.reset();
		}
	});
	
	var randomiseButton = twirl.createIcon({
		label: "Include in randomisation",
		icon: "randomise",
		click: function(obj) {						
			randomiseAllowed = !randomiseAllowed;
			var opacity = (randomiseAllowed) ? 1 : 0.4;
			obj.el.css("opacity", opacity);
		}
	});
	if (!randomiseAllowed) {
		randomiseButton.el.css("opacity", 0.4);
	}
	
	var elSpline;
	var editAutomationButton = twirl.createIcon({
		label: "Select",
		icon: "show",
		click: function() {
			if (!transform) return;
			if (elSpline) {
				automationShown = true;
				transform.showAutomation(definition.name, elSpline);
			}
		}
	});
	editAutomationButton.el.hide();
	
	var automationButton = twirl.createIcon({
		label: "Automate",
		label2: "Close automation",
		icon: "automate",
		icon2: "close",
		click: function() {
			if (elSpline && automationActive) {
				disableAutomation();
			} else {
				showAutomation();
			}
		}
	});
	
	var automationActive = false;
	var automationShown = false;	
	
	this.hideAutomation = function() {
		if (!transform) return;
		automationShown = false;
		if (elSpline) {
			transform.hideAutomation(definition.name);
		}
	}
	
	function disableAutomation() {
		if (!transform) return;
		automationActive = false;
		automationShown = false;
		app.setControlChannel(channel, self.getValue());
		elValueLabel.show();
		elInput.show();
		modButton.el.show();
		automationButton.setState(true);
		editAutomationButton.el.hide();
		self.hideAutomation();
	}
	
	this.redraw = function(region) {
		if (self.automation) {
			if (region && region[0] != null && region[1] != null) {
				self.automation.setRange(region[0], region[1]);
			} else {
				self.automation.redraw();
			}
		}
	};
	
	function showAutomation() {
		if (!transform) return;
		var colour = "rgb(" + (Math.round(Math.random() * 50) + 205) + ","
			+ (Math.round(Math.random() * 50) + 205) + ","
			+ (Math.round(Math.random() * 50) + 205) + ")";
		automationShown = true;	
		automationActive = true;
		
		if (!elSpline) {
			elSpline = $("<div />").attr("id", "spl_" + channel).css({
				position: "absolute", width: "100%", height: "100%", overflow: "hidden"
			});
		}
		
		transform.showAutomation(definition.name, elSpline);
		
		if (!self.automation) {
			self.automation = new SplineEdit(
				elSpline, colour, 
				twist.waveform.getDuration,
				[definition.min, definition.max, self.getValue(), definition.step],
				definition.name
			);
		}
		
		elValueLabel.hide();
		elInput.hide();
		modButton.el.hide();
		elSpline.show();
		editAutomationButton.el.show(); //.css("background-color", colour);
		automationButton.setState(false);
	}
	
	
	elModulations = $("<div />").addClass("tfv_container").hide().appendTo(elContainer);
	var modulationShown = false;
	
	
	var modButton = twirl.createIcon({
		label: "Modulate",
		label2: "Close modulation",
		icon: "modulate",
		icon2: "close",
		click: function() {
			if (elModulations && modulationShown) {
				hideModulations();
			} else {
				showModulations();
			}
		}
	});
			
	function hideModulations() {
		app.setControlChannel(channel, self.getValue());
		modulationShown = false;
		elValueLabel.show();
		elInput.show();
		automationButton.el.show();
		self.modulation = null;
		modButton.setState(true);
		if (elModulations) {
			elModulations.hide();
		}
	}
		
	function showModulations() {
		if (!transform) return;
		modulationShown = true;
		elValueLabel.hide();
		elInput.hide();
		automationButton.el.hide();
		elModulations.show();
		modButton.setState(false);
		if (elModulations.children().length != 0) {
			elModSelect.val(0).trigger("change");
			return;
		}
		var tb = $("<tbody />");
		function buildModulation(i) {
			tb.empty();
			self.modulationParameters = {};
			self.modulation = i;
			let m = twist.appdata.modulations[i];
			for (let x of m.parameters) {
				var tp = new TransformParameter(m.instr, x, self, transform, twist);
				self.modulationParameters[tp.channel] = tp;
				tb.append(tp.getElementRow(true)); // hmm modulate the modulation with false 
			}
		}
		var selecttb = $("<tbody />").appendTo($("<table />)").appendTo(elModulations));
		var row = $("<tr />").append($("<td />").text("Modulation type")).appendTo(selecttb);
		var elConditionalOptions = [];
		
		twist.onInstanceChangeds.push(function(){
			for (let o of elConditionalOptions) {
				if (twist.waveforms.length == 1) {
					o.prop("disabled", true);
				} else {
					o.prop("disabled", false);
				}
			}
		});
		
		elModSelect = $("<select />").change(function() {
			self.modulation = $(this).val();
			buildModulation(self.modulation);
		}).appendTo($("<td />").appendTo(row));
		$("<table />").append(tb).appendTo(elModulations);
		
		for (let i in twist.appdata.modulations) {
			var m = twist.appdata.modulations[i];
			var o = $("<option />").text(m.name).val(i).appendTo(elModSelect);
			if (m.inputs > 1) {
				elConditionalOptions.push(o);
				if (twist.waveforms.length == 1) {
					o.prop("disabled", true);
				}
			}
		}
		elModSelect.val(0).trigger("change");
	}
	
	this.getElementRow = function(nocontrols) {
		if (definition.hidden) {
			return null;
		};
		if (elRow) {
			return elRow;
		}
		elRow = $("<tr />");	
		var name = $("<td />").addClass("tfv_cell_text").text(definition.name).appendTo(elRow);
		if (definition.description) {
			name.on("mouseover", function(event){
				twirl.tooltip.show(event, definition.description);
			}).on("mouseout", function(){
				twirl.tooltip.hide();
			});
		}
		
		$("<td />").addClass("tfv_cell").append(elContainer).appendTo(elRow);
		$("<td />").addClass("tfv_cellfixed").append(elValueLabel).appendTo(elRow);
		if (!nocontrols) {						
			for (let b of [resetButton, randomiseButton]) $("<td />").addClass("tfv_cell_plainbg").append(b.el).appendTo(elRow);
			
			if (definition.automatable) {
				for (let b of [automationButton, editAutomationButton, modButton]) $("<td />").addClass("tfv_cell_plainbg").append(b.el).appendTo(elRow);
			}

		}
		return elRow;
	};
};



function getTransformContainer(nameOrElement) {
	var el = $("<div />").addClass("tfv_header");
	if (typeof(nameOrElement) == "string") {
		el.text(nameOrElement);
	} else {
		el.append(nameOrElement);
	}
	return $("<div />").addClass("tfv_container").append(el);
}

var Transform = function(target, def, twist) {
	var self = this;
	var elTb;
	var pAddOdd = true;
	this.instr = def.instr;
	this.refreshable = false;
	var elSplineOverlay;
	var hideAutomationButton;
	this.parameters = {};
	
	var automationEls = {};
	this.showAutomation = function(name, el) {
		if (!elSplineOverlay) {
			elSplineOverlay = $("<div />").addClass("spline_overlay").appendTo($("#twist_splines"));
		}
		for (var e in automationEls) {
			automationEls[e].css({"z-index": 23, opacity: 0.4});
		}
		if (!el) {
			el = automationEls[name];
		} else {
			automationEls[name] = el;
		}
		el.css({"z-index": 24, opacity: 1}).show();
		hideAutomationButton.el.show();
		elSplineOverlay.show();
		if (el.parents(elSplineOverlay).length == 0) {
			elSplineOverlay.append(el);
		}
		$("#twist_splines").show();
	};
	
	this.getLagHints = function() {
		var lagHints = [];
		for (let i in self.parameters) {
			var p = self.parameters[i];
			var lagHint = p.getLagHint();
			if (lagHint) lagHints.push(lagHint);
		}
		var lagHintHtml;
		if (lagHints.length != 0) {
			lagHintHtml = "Try ";
			for (var i in lagHints) {
				lagHintHtml += lagHints[i];
				if (i != lagHints.length - 1) {
					lagHintHtml += ((i == lagHints.length - 2) ? " or " : ", ");
				}
			}
		}
		return lagHintHtml;
	};
	
	this.hideAutomation = function(name) {
		if (automationEls[name]) {
			automationEls[name].hide();
			delete automationEls[name];
			if (Object.keys(automationEls).length == 0) {
				elSplineOverlay.hide();
				hideAutomationButton.el.hide();
				$("#twist_splines").hide();
			}
		}
	}
	
	this.hideAllAutomation = function(name) {
		for (let p in self.parameters) {
			self.parameters[p].hideAutomation();
		}				
	};
	
	this.redraw = function(region) {
		for (let p in self.parameters) {
			self.parameters[p].redraw(region);
		}
	};
	
	this.refresh = function() {
		if (!self.refreshable) {
			return;
		}
		for (var k in self.parameters) {
			self.parameters[k].refresh();
		}
	};
	
	this.getAutomationData = function(start, end) {
		var automations = [];
		for (var k in self.parameters) {
			var data = self.parameters[k].getAutomationData(start, end);
			if (data) {
				automations.push(data);
			}
		}
		return automations;
	};
	
	this.getState = async function() {
		var data = {instr: def.instr, channels: {}};
		var value;
		for (let chan in self.parameters) {
			value = await app.getControlChannel(chan);
			data.channels[chan] = value;
			if (self.parameters[chan].modulationParameters) {
				for (let modchan in self.parameters[chan].modulationParameters) {
					value = await app.getControlChannel(modchan);
					data.channels[modchan] = value;
				}
			}
		}
		return data;
	};
	
	
	this.reset = function() {
		for (let p in self.parameters) {
			self.parameters[p].reset();
		}
	};
	
	this.randomise = function() {
		for (let p in self.parameters) {
			self.parameters[p].randomise();
			if (self.parameters[p].modulationParameters) {
				for (let mp in self.parameters[p].modulationParameters) {
					self.parameters[p].modulationParameters[mp].randomise();
				}
			}
		}
	};
	
	this.saveState = function() {
		var state = {};
		for (let p in self.parameters) {
			state[p] = self.parameters[p].getRawValue();
		}
		if (!twist.storage.transforms) {
			twist.storage.transforms = {};
		}
		twist.storage.transforms[def.instr] = state;
		twist.saveStorage();
	};
	
	this.remove = function() {
		self.saveState();
		for (let p in self.parameters) {
			self.parameters[p].remove();
		}
		if (elSplineOverlay) {
			elSplineOverlay.remove();
		}
	}
	
	this.removeParameter = function(channel) {
		if (self.parameters.hasOwnProperty(channel)) {
			self.parameters[channel].remove();
			delete self.parameters[channel]
		}
	};
	
	function addParameter(pdef) {
		var tp = new TransformParameter(def.instr, pdef, null, self, twist);
		self.parameters[tp.channel] = tp;
		var er = tp.getElementRow();
		if (er) {
			elTb.append(er.addClass("tfv_row_" + ((pAddOdd) ? "odd" : "even")));
			pAddOdd = !pAddOdd;
		};
	};
	
	this.setPlaying = function(state) {
		for (let i in self.parameters) {
			self.parameters[i].setPlaying(state);
		}
	};
	
	function namePrepend(name, pdef) {
		if (!pdef.hasOwnProperty("nameprepend")) return name;
		name = pdef.nameprepend + " " + name;
		return name[0] + name.substr(1).toLowerCase()
	}
	
	this.addParameter = function(pdef) {
		if (!pdef.hasOwnProperty("presetgroup")) {
			return addParameter(pdef);
		}
		var name;
		var conditions;
		var groupParameters = [];
		var channelPrepend = (pdef.hasOwnProperty("channelprepend")) ? pdef.channelprepend : "";
		
		if (pdef.presetgroup == "pvsynth") {
			var dfaultMode = (pdef.hasOwnProperty("dfault")) ? pdef.dfault : 0;
			conditions = [
				{channel: channelPrepend + "pvresmode", operator: "eq", value: 1}
			];
			groupParameters = [
				{name: namePrepend("Resynth mode", pdef), channel: channelPrepend + "pvresmode", description: "Type of FFT resynthesis used", dfault: dfaultMode, options: ["Overlap-add", "Additive"], automatable: false},
				{name: namePrepend("Oscillator spread", pdef), channel: channelPrepend + "pvaoscnum", description: "Number of oscillators used", automatable: false, conditions: conditions, lagHint: -1},
				{name: namePrepend("Frequency modulation", pdef), channel: channelPrepend + "pvafreqmod", description: "Frequency modulation", dfault: 1, min: 0.01, max: 2, conditions: conditions},
				{name: namePrepend("Oscillator offset", pdef), channel: channelPrepend + "pvabinoffset", description: "Oscillator bin offset", automatable: false, conditions: conditions, dfault: 0, lagHint: 1},
				{name: namePrepend("Oscillator increment", pdef), channel: channelPrepend + "pvabinincr", description: "Oscillator bin increment", min: 1, max: 8, dfault: 1, step: 1, automatable: false, conditions: conditions, lagHint: -1}
			];
		} else if (pdef.presetgroup == "pvanal") {
			groupParameters = [
				{preset: "fftsize"},
				{preset: "pvslock"},
				{name: "Overlap decimation", min: 4, max: 16, step: 1, dfault: 4, channel: "pvsdecimation", automatable: false, lagHint: -1},
				{name: "Window size multiplier", min: 1, max: 4, dfaut: 1, step :1, channel: "pvswinsizem", automatable: false, lagHint: -1},
				{name: "Window type", options: ["Hamming", "Von Hann", "Kaiser"], dfault: 1, automatable: false}
			];
		} else if (pdef.presetgroup == "pitchscale") {
			groupParameters = [
				{name: namePrepend("Pitch scale mode", pdef), channel: channelPrepend + "pitchscalemode", options: ["Ratio", "Semitone"], dfault: 0},
				{name: namePrepend("Pitch scale", pdef), channel: channelPrepend + "pitchscale", description: "Pitch scaling", dfault: 1, min: 0.01, max: 10, conditions: [{channel: channelPrepend + "pitchscalemode", operator: "eq", value: 0}]},
				{name: namePrepend("Semitones", pdef), channel: channelPrepend + "pitchsemitones", min: -24, max: 24, step: 1, dfault: 0, conditions: [{channel: channelPrepend + "pitchscalemode", operator: "eq", value: 1}]}
			];
		
		} else if (pdef.presetgroup == "notefreq") {
			var base = {name: namePrepend("Frequency mode", pdef), channel: channelPrepend + "freqmode", description: "Frequency mode", options: ["Frequency", "Note"], dfault: 0};
			if (pdef.hasOwnProperty("conditions")) {
				base["conditions"] = pdef.conditions;
			}
			groupParameters.push(base);
			
			conditions = [{channel: channelPrepend + "freqmode", operator: "eq", value: 0}];
			if (pdef.hasOwnProperty("conditions")) {
				Array.prototype.push.apply(conditions, pdef.conditions);
			}
			
			var dfaultFreq = (pdef.hasOwnProperty("dfault")) ? pdef.dfault : 440;
			
			var freq = {name: namePrepend("Frequency", pdef), channel: channelPrepend + "freq", description: "Frequency", dfault: dfaultFreq, min: 20, max: 22000, conditions: conditions}
			if (pdef.hasOwnProperty("lagHint")) {
				freq.lagHint = pdef.lagHint;
			}
			groupParameters.push(freq);
			
			conditions = [{channel: channelPrepend + "freqmode", operator: "eq", value: 1}];
			if (pdef.hasOwnProperty("conditions")) {
				Array.prototype.push.apply(conditions, pdef.conditions);
			}
			var note = {preset: "note", name: namePrepend("Note", pdef), conditions: conditions, channel: channelPrepend + "note"};
			if (pdef.hasOwnProperty("lagHint")) {
				note.lagHint = pdef.lagHint;
			}
			groupParameters.push(note);
			
		}
		for (let gp of groupParameters) {
			if (pdef.hasOwnProperty("automatable")) {
				gp.automatable = pdef.automatable;
			}
			addParameter(gp);
		}
	}
	
	function build() {
		target.empty();
		var elContainer = $("<div />").addClass("tfv_container").appendTo(target);
		hideAutomationButton = twirl.createIcon({label: "Hide automation", icon: "hide", click: function() {
			self.hideAllAutomation();
		}});
		hideAutomationButton.el.hide();
		
		app.setControlChannel("applymode", 0); // not all transforms will set this
		var el = $("<div />");
		var header = $("<div />").text(def.name).appendTo(el);
		
		if (def.description) {
			header.on("mouseover", function(event){
				twirl.tooltip.show(event, def.description);
			}).on("mouseout", function(){
				twirl.tooltip.hide();
			});
		}
							
		$("<div />").css({"float": "right"}).append(
			hideAutomationButton.el
		).append(
			twirl.createIcon({
				label: "Randomise parameters",
				icon: "randomise",
				click: function() {
					self.randomise();
				}
			}).el
		).append(
			twirl.createIcon({
				label: "Reset parameters",
				icon: "reset",
				click: function() {
					self.reset();
				}
			}).el
		).appendTo(el);
		
		$("<div />").addClass("tfv_container").append(
			$("<div />").addClass("tfv_header").append(el)
		).appendTo(elContainer);
		
		//getTransformContainer(el).appendTo(elContainer);					
		var tbl = $("<table />").appendTo(elContainer);
		elTb = $("<tbody />").appendTo(tbl);
		
		for (let p of def.parameters) {
			self.addParameter(p);
		}
		
		if (twist.storage && twist.storage.transforms && twist.storage.transforms[def.instr]) {
			var state = twist.storage.transforms[def.instr];
			for (var p in state) {
				self.parameters[p].setRawValue(state[p]);
			}
		}					
		self.refresh();
	}
	build();
};

var TransformsTreeView = function(options, twist) {
	var self = this;
	var elTarget = $("#" + options.target);
	
	
	function recurse(items, descended) {
		items = (items) ? items : options.items;
		var ul = $("<ul />").css({"border-bottom": "1px solid #878787", "padding-inline-start": 10}).addClass((descended) ? "nested" : "treelist");
		
		for (let k in items) {
			var li = $("<li />");
			if (items[k].hasOwnProperty("contents")) {
				$("<span />").addClass("caret").text(items[k].name).click(function() {
					$(this).parent().children(".nested").toggleClass("active");
					$(this).toggleClass("caret-down");
				}).appendTo(li);
				var subitems = recurse(items[k].contents, true);
				li.append(subitems);

			} else {
				li.text(items[k].name).css("cursor", "pointer").click(function(){
					if (twist.currentTransform) {
						twist.currentTransform.remove();
					}
					twist.currentTransform = new Transform($("#twist_controls"), items[k], twist);
				});
			}
			ul.append(li);
		}
		elTarget.append(ul);
		return ul;
	}
	
	elTarget.append(recurse());
};