/**
 * @author Sergey Chikuyonok (gonarch@design.ru)
 * @copyright Art.Lebedev Studio (http://www.artlebedev.ru)
 */

var CordContainer = {

	cords_url: '/chain.ihtml',

	/**
	 * @param {String|Element} elem Canvas container
	 * @param {String} page_id Cord set ID
	 */
	init: function(elem, page_id){
		this.ptr = $(elem);
		this.id = page_id;
		this.cords = [];

		this.canvas = new SimpleCanvas(this.ptr[0]);

		this.load(this.cords_url);
	},

	load: function(url){
		var me = this;
		var xml = $.get(url, function(){
			me.parseXml(xml);
			me.draw();
		});
	},

	/**
	 * @param {Element} xml
	 */
	parseXml: function(xml){
		var page = $(xml.responseXML.documentElement).find('page[@id='+this.id+']');
		if(page.length){
			var me = this;
			page.find('CordItem').each(function(){
				me.addCord($(this).attr('controls'));
			});
		}
	},

	addCord: function(coords){
		this.cords.push(new CordItem(coords, this));
	},

	draw: function(){
		var vertex, next_vertex, prev_vertex;
		var cv = this.canvas,  dims = cv.getDimensions(), r = cv.getRenderer(), me = this;
		cv.clear();
		r.reflow();
		var line_prop = {width: 1, color: '#ea701c'};

		for(var j=0; j < this.cords.length; j++){
			var n = this.cords[j];
			var v = n.vertices;
			if(!v.length){
				cv.drawLine(r.vx(n.__start), r.vx(n.__end), line_prop);
				continue;
			}

			prev_vertex = r.vx(n.__start);

			for(var i = 0, length = v.length - 1; i<length; i++){
				vertex = v[i];
				next_vertex = v[i + 1];

				var vx1 = r.vx(vertex);
				var vx2 = r.vx(next_vertex);

				//middle point
				var mvx = {x: (vx1.x+vx2.x)/2, y: (vx1.y+vx2.y)/2};
				cv.drawQuadCurve(prev_vertex, mvx, vx1, line_prop);
				prev_vertex = mvx;
			}

			vertex = r.vx(v[length]);
			r.drawQuadCurve(prev_vertex, r.vx(n.__end), vertex, line_prop);
		}
	},

	_prc: function(p, dims){
		return {x: (p.x / dims.width * 100) + '%', y: (p.y / dims.height * 100) + '%'};
	}
};

function CordItem(node){
	this.init(node);
};

CordItem.prototype = {
	/**
	 * Initiate cord item
	 * @param {String} controls String with cord coordinates
	 */
	init: function(controls){
		this.controls = controls;
		this.parseControls(controls);
	},

	/**
	 * Parse cord node
	 * @param {String} controls
	 */
	parseControls: function(controls){
		this.vertices = [];
		var init_controls = controls.split("|");
		var vertex, control, control_str, point_arr;

		control_str = init_controls.shift()+"";

		point_arr = control_str.split(",");
		control = new ControlPoint(point_arr[0], point_arr[1]);
		this.__start = control;

		control_str = init_controls.pop()+"";
		point_arr = control_str.split(",");
		control = new ControlPoint(point_arr[0], point_arr[1]);
		this.__end = control;

		for(var i = 0, length = init_controls.length; i<length; i++){
			control_str = init_controls[i];
			point_arr = control_str.split(",");
			control = new ControlPoint(point_arr[0], point_arr[1]);
			this.vertices.push(control);
		}
	}
};

/**
 * @constructor
 * @param {String} x
 * @param {String} y
 */
function ControlPoint(x, y){
	this.x = x;
	this.y = y;
};