var DocumentPosition = function(container){
	this.figure = null;
	this.jqdescriptionElement = null;
	this.scale = container.scale;
	this.canvas = container.canvas;
	this.container = container;

	this.width = null;
	this.height = null;
	this.left = null;
	this.top = null;
	this.dataSourceCode = null;
	this.dataSourcePath = null;
	this.id = null;
	this.name = null;
	
	this.selected = false;
	this.sourceType = "defined";
	this.ownFieldType = "text";
	
	this.dataFontSize = null;
	this.dataFontColor = null;
	this.dataFontColor2 = null;
	this.dataFontType = null;
	this.dataAlign = null;

	this.tempId = null;
	this.uuid = Utils.uuid();
};
DocumentPosition.prototype = {
	commonRectangleDefinition: {
		fill: "#DA2",
		opacity: 0.5,
		hasRotatingPoint: false
	},
	ownTypes: {
		"text":"tekst",
		"date":"data",
		"list":"lista",
		"dictionary":"słownik",
		"icd9":"icd9",
		"icd10":"icd10"
	},
	createFigure: function(){
		var figure = new fabric.Rect({
			width: this.width * this.scale,
			height: this.height * this.scale,
			left: this.left * this.scale,
			top: this.top * this.scale
		});
		figure.set(this.commonRectangleDefinition);
		return figure;
	},
	createDescriptionElement: function(){
		this.init();
		var fields = App.getFieldsForDataSource(this.dataSourceCode);
		var mainElement = this.tmplDescriptionOfDocumentPosition({
			documentPosition: this,
			fields: fields,
			ownTypes: this.ownTypes,
			fieldsSize: App.fieldsSize,
			fieldsColors: App.fieldsColors,
			fieldsTypes: App.fieldsTypes,
			fieldsAlign: App.fieldsAlign
		});
		this.jqdescriptionElement = jq(mainElement);
		this.cacheElements();
		this.bindEvents();
		return this.jqdescriptionElement;
	},
	init: function(){
		this.tmplDescriptionOfDocumentPosition = Utils.tmpl("tmpl-descriptionOfDocumentPosition");
	},
	cacheElements: function(){
		//this.jqdescriptionElement;
		this.jqnameInput = this.jqdescriptionElement.find("input[name='name']");
		this.jqdataSourcePathSelet = this.jqdescriptionElement.find("select[name='dataSourcePath']");
		this.jqsourceTypeRadios = this.jqdescriptionElement.find("input:radio[name=sourceType-"+this.uuid+"]");
		this.jqownFieldTypeSelect = this.jqdescriptionElement.find("select[name='ownFieldType']");
		//:checked")
	},
	bindEvents: function(){

	},
	create: function(){

	},
	refreshObjectData: function(){
		this.name = this.jqnameInput.val();
		this.dataSourcePath = this.jqdataSourcePathSelet.val();
		this.dataSourceCode = App.jqdataSourceSelect.val();
		this.top = Math.floor(this.figure.top / this.scale);
		this.left = Math.floor(this.figure.left / this.scale);
		this.height = Math.floor(this.figure.currentHeight / this.scale);
		this.width = Math.floor(this.figure.currentWidth / this.scale);
		this.sourceType = this.jqsourceTypeRadios.filter(":checked").val();
		this.ownFieldType = this.jqownFieldTypeSelect.val();
		this.dataFontSize = this.jqdescriptionElement.find("select[name='dataFontSize']").val();
		this.dataFontColor = this.jqdescriptionElement.find("select[name='dataFontColor']").val();
		this.dataFontColor2 = this.jqdescriptionElement.find("[name='dataFontColor2']").val();
		this.dataFontType = this.jqdescriptionElement.find("select[name='dataFontType']").val();
		this.dataAlign = this.jqdescriptionElement.find("select[name='dataAlign']").val();
	},
	toJson: function(){
		this.refreshObjectData();
		var result = {
			"top": this.top,
			"left": this.left,
			"height": this.height,
			"width": this.width,
			"id": this.id,
			"name": this.name,
			"dataSourceCode": this.dataSourceCode,
			"dataSourcePath": this.dataSourcePath,
			"sourceType": this.sourceType,
			"ownFieldType": this.ownFieldType,
			"dataFontSize": this.dataFontSize,
			"dataFontColor": this.dataFontColor,
			"dataFontColor2": this.dataFontColor2,
			"dataFontType": this.dataFontType,
			"dataAlign":this.dataAlign
		};
		if(!this.id){
			result.tempId = this.uuid;
			delete result.id;
		}
		return result;
	},
	remove: function(){
		this.jqdescriptionElement.remove();
		this.canvas.remove(this.figure);
	},
	onFigureSelect: function(){
		this.container.selectDocumentPosition(this);
	},
	onDescriptionElementSelect: function(){
		this.canvas.setActiveObject(this.figure);
	},
	select: function(){
		this.selected = true;
		this.jqdescriptionElement.addClass('selected');
	},
	unSelect: function(){
		this.selected = false;
		this.jqdescriptionElement.removeClass('selected');
	}
};