/* eslint-disable no-var */
/* globals svgEditor, svgCanvas, $ */
/*
 * ext-polygon.js
 *
 *
 * Copyright(c) 2010 CloudCanvas, Inc.
 * All rights reserved
 *
 */
svgEditor.addExtension('polygon', function (S) {
	'use strict';

	var // NS = svgedit.NS,
		// svgcontent = S.svgcontent,
		// addElem = S.addSvgElementFromJson,
		selElems,
		editingitex = false,
		// svgdoc = S.svgroot.parentNode.ownerDocument,
		// newFOG, newFOGParent, newDef, newImageName, newMaskID, modeChangeG,
		// edg = 0,
		// undoCommand = 'Not image';
		started, newFO;

	// var ccZoom;
	// var wEl, hEl;
	// var wOffset, hOffset;
	// var ccRBG;
	// var ccOpacity;
	// var brushW, brushH;

	// var ccDebug = document.getElementById('debugpanel');

	/* var properlySourceSizeTextArea = function(){
	 // TODO: remove magic numbers here and get values from CSS
	 var height = $('#svg_source_container').height() - 80;
	 $('#svg_source_textarea').css('height', height);
	 }; */
	function showPanel (on) {
		var fcRules = $('#fc_rules');
		if (!fcRules.length) {
			fcRules = $('<style id="fc_rules"></style>').appendTo('head');
		}
		fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
		$('#polygon_panel').toggle(on);
	}

	/*
	function toggleSourceButtons(on){
		$('#tool_source_save, #tool_source_cancel').toggle(!on);
		$('#polygon_save, #polygon_cancel').toggle(on);
	}
	*/

	function setAttr (attr, val) {
		svgCanvas.changeSelectedAttribute(attr, val);
		S.call('changed', selElems);
	}

	function cot (n) {
		return 1 / Math.tan(n);
	}

	function sec (n) {
		return 1 / Math.cos(n);
	}

	/**
	* Obtained from http://code.google.com/p/passenger-top/source/browse/instiki/public/svg-edit/editor/extensions/ext-itex.js?r=3
	* This function sets the content of of the currently-selected foreignObject element,
	*   based on the itex contained in string.
	* @param {string} tex The itex text.
	* @returns This function returns false if the set was unsuccessful, true otherwise.
	*/
	/*
	function setItexString(tex) {
		var mathns = 'http://www.w3.org/1998/Math/MathML',
			xmlnsns = 'http://www.w3.org/2000/xmlns/',
			ajaxEndpoint = '../../itex';
		var elt = selElems[0];
		try {
			var math = svgdoc.createElementNS(mathns, 'math');
			math.setAttributeNS(xmlnsns, 'xmlns', mathns);
			math.setAttribute('display', 'inline');
			var semantics = document.createElementNS(mathns, 'semantics');
			var annotation = document.createElementNS(mathns, 'annotation');
			annotation.setAttribute('encoding', 'application/x-tex');
			annotation.textContent = tex;
			var mrow = document.createElementNS(mathns, 'mrow');
			semantics.appendChild(mrow);
			semantics.appendChild(annotation);
			math.appendChild(semantics);
			// make an AJAX request to the server, to get the MathML
			$.post(ajaxEndpoint, {'tex': tex, 'display': 'inline'}, function(data){
				var children = data.documentElement.childNodes;
				while (children.length > 0) {
					 mrow.appendChild(svgdoc.adoptNode(children[0], true));
				}
				S.sanitizeSvg(math);
				S.call('changed', [elt]);
			});
			elt.replaceChild(math, elt.firstChild);
			S.call('changed', [elt]);
			svgCanvas.clearSelection();
		} catch(e) {
			console.log(e);
			return false;
		}

		return true;
	}
	*/
	return {
		name: 'polygon',
		svgicons: svgEditor.curConfig.extPath + 'polygon-icons.svg',
		buttons: [{
			id: 'tool_polygon',
			type: 'mode',
			title: 'Polygon Tool',
			position: 11,
			events: {
				'click': function () {
					svgCanvas.setMode('polygon');
					showPanel(true);
				}
			}
		}],

		context_tools: [{
			type: 'input',
			panel: 'polygon_panel',
			title: 'Number of Sides',
			id: 'polySides',
			label: 'sides',
			size: 3,
			defval: 5,
			events: {
				change: function () {
					setAttr('sides', this.value);
				}
			}
		}],

		callback: function () {
			$('#polygon_panel').hide();

			var endChanges = function () {
			};

			// TODO: Needs to be done after orig icon loads
			setTimeout(function () {
				// Create source save/cancel buttons
				/* var save = */ $('#tool_source_save').clone().hide().attr('id', 'polygon_save').unbind().appendTo('#tool_source_back').click(function () {
					if (!editingitex) {
						return;
					}
					// Todo: Uncomment the setItexString() function above and handle ajaxEndpoint?
					/*
					if (!setItexString($('#svg_source_textarea').val())) {
						$.confirm('Errors found. Revert to original?', function (ok) {
							if (!ok) {
								return false;
							}
							endChanges();
						});
					} else { */
					endChanges();
					// }
					// setSelectMode();
				});

				/* var cancel = */ $('#tool_source_cancel').clone().hide().attr('id', 'polygon_cancel').unbind().appendTo('#tool_source_back').click(function () {
					endChanges();
				});
			}, 3000);
		},
		mouseDown: function (opts) {
			// var e = opts.event;
			var rgb = svgCanvas.getColor('fill');
			// var ccRgbEl = rgb.substring(1, rgb.length);
			var sRgb = svgCanvas.getColor('stroke');
			// ccSRgbEl = sRgb.substring(1, rgb.length);
			var sWidth = svgCanvas.getStrokeWidth();

			if (svgCanvas.getMode() === 'polygon') {
				started = true;

				newFO = S.addSvgElementFromJson({
					'element': 'polygon',
					'attr': {
						'cx': opts.start_x,
						'cy': opts.start_y,
						'id': S.getNextId(),
						'shape': 'regularPoly',
						'sides': document.getElementById('polySides').value,
						'orient': 'x',
						'edge': 0,
						'fill': rgb,
						'strokecolor': sRgb,
						'strokeWidth': sWidth
					}
				});

				return {
					started: true
				};
			}
		},
		mouseMove: function (opts) {
			if (!started) {
				return;
			}
			if (svgCanvas.getMode() === 'polygon') {
				// var e = opts.event;
				var x = opts.mouse_x;
				var y = opts.mouse_y;
				var c = $(newFO).attr(['cx', 'cy', 'sides', 'orient', 'fill', 'strokecolor', 'strokeWidth']);
				var cx = c.cx, cy = c.cy, fill = c.fill, strokecolor = c.strokecolor, strokewidth = c.strokeWidth, sides = c.sides,
					// orient = c.orient,
					edg = (Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy))) / 1.5;
				newFO.setAttributeNS(null, 'edge', edg);

				var inradius = (edg / 2) * cot(Math.PI / sides);
				var circumradius = inradius * sec(Math.PI / sides);
				var points = '';
				var s;
				for (s = 0; sides >= s; s++) {
					var angle = 2.0 * Math.PI * s / sides;
					x = (circumradius * Math.cos(angle)) + cx;
					y = (circumradius * Math.sin(angle)) + cy;

					points += x + ',' + y + ' ';
				}

				// var poly = newFO.createElementNS(NS.SVG, 'polygon');
				newFO.setAttributeNS(null, 'points', points);
				newFO.setAttributeNS(null, 'fill', fill);
				newFO.setAttributeNS(null, 'stroke', strokecolor);
				newFO.setAttributeNS(null, 'stroke-width', strokewidth);
				// newFO.setAttributeNS(null, 'transform', 'rotate(-90)');
				// var shape = newFO.getAttributeNS(null, 'shape');
				// newFO.appendChild(poly);
				// DrawPoly(cx, cy, sides, edg, orient);
				return {
					started: true
				};
			}
		},

		mouseUp: function (opts) {
			if (svgCanvas.getMode() === 'polygon') {
				var attrs = $(newFO).attr('edge');
				var keep = (attrs.edge !== '0');
				// svgCanvas.addToSelection([newFO], true);
				return {
					keep: keep,
					element: newFO
				};
			}
		},
		selectedChanged: function (opts) {
			// Use this to update the current selected elements
			selElems = opts.elems;

			var i = selElems.length;

			while (i--) {
				var elem = selElems[i];
				if (elem && elem.getAttributeNS(null, 'shape') === 'regularPoly') {
					if (opts.selectedElement && !opts.multiselected) {
						$('#polySides').val(elem.getAttribute('sides'));

						showPanel(true);
					} else {
						showPanel(false);
					}
				} else {
					showPanel(false);
				}
			}
		},
		elementChanged: function (opts) {
			// var elem = opts.elems[0];
		}
	};
});