/* -------------------------- */		
/*            superform       */		
/* -------------------------- */			

var superform = function superform( p = {} ) {

	var superformula = d3.superformula()
	
	var layer = p.layer || 'xsf'
	
	var formparams = p
	formparams.id = p.id || null

	formparams.m = p.m 		|| 12
	formparams.n1 = p.n1	|| .3
	formparams.n2 = p.n2	|| 0
	formparams.n3 = p.n3 	|| 10
	formparams.a = p.a 		|| 1
	formparams.b = p.b 		|| 1
	
	formparams.tx = p.tx || __map.state().config.form.tx || 0						// x translation
	formparams.ty = p.ty || __map.state().config.form.ty ||  0						// y translation
	formparams.rot = p.rot || __map.state().config.form.rot ||  0				// rotation

	formparams.rad = p.rad || __map.state().config.form.rad || 100					// radius
	formparams.segs = p.segs || __map.state().config.form.segs || 256			// segments
	
	formparams.pta = p.pta || __map.state().config.form.pta || 0					// left bracket
	formparams.ptb = p.ptb || __map.state().config.form.ptb || 0					// right bracket
	
	// formparams.c = p.c || __map.state().config.form.c || 69								// fill
	
	var superformula = d3.superformula().formparams(formparams)
	
	var plugin = function plugin() { }		
	
	
	/* 	------------------		redraw 		------------------		*/
	plugin.redraw = function(params) {
	// check other minder params
		var fill = params.fill || __map.state().config.form.fill || "#fff3e6" // "#ddd"	
		var stroke = params.stroke || __map.state().config.form.stroke || "#666"
		var strokeWidth = params.strokeWidth || __map.state().config.form.strokeWidth || "1.5px"
		
		var id = params.id || layer			// xsf id
		
		let p = formparams
		for (let i in params) p[i] = params[i] 			// apply new params
		
			// check fiull color param
			if (p.c !== undefined) {
						fill = __map.state().scales.scales()['c'](p.c)
			} 
	
	
		var superform = superformula.formparams(p)()	// call superformula with all formparmas
			__map.state().consol.redraw(p)
			__map.state().scales.redraw(p)
		
		
		let path = {
			id: id,																					// path id
			fill: fill,																			// fill
			stroke: stroke, 																// stroke
			strokeWidth: strokeWidth, 											// stroke-width
			path: superform,																// superformula path
		}
	
		var formsLayerUpdate = d3.select('svg').selectAll('.' + layer).data([layer])
		var formsLayerEnter = formsLayerUpdate
			.enter().append("g").attr("class", layer)	
			.merge(formsLayerUpdate)
	
			var formElemsUpdate = formsLayerEnter.selectAll('.form').data([path], d => d.id)
				.attr("class", "form")
				.attr("d", d => d.path)
				.style("stroke-width", d => d.strokeWidth)
				.style("fill", d => d.fill)		
				.style("stroke", d => d.stroke)		

			var formElemsEnter = formElemsUpdate
				.enter().append("path")
				.attr("class", "form")
				.attr("d", d => d.path)
				.style("stroke-width", d => d.strokeWidth)
				.style("fill", d => d.fill)		
				.style("stroke", d => d.stroke)		
				.on("click", function(d) {
						__map.state().scales.redraw(params)
							d3.event.stopPropagation();
				})
			}
	
	plugin.clear = function() {
		var formsLayerUpdate = d3.select('svg').selectAll('.' + layer).data([layer])
		var formsLayerEnter = formsLayerUpdate
			.enter().append("g").attr("class", layer)	
			.merge(formsLayerUpdate)
	
		var formElemsUpdate = formsLayerEnter.selectAll('.form').data([])
			formElemsUpdate
				.exit()
				.remove()
				
	}	
	
	plugin.point = function(point) {
		return superformula.point(point)
	}	
	
	plugin.points = function() {
		return superformula.points()
	}	
	
	plugin.shape = function() {
		return superformula()
	}
	
	plugin.formparams = function() {
		return superformula.formparams()
	}
	
	return plugin	
}
;