CoordinatesGridPanel = Ext.extend(Ext.grid.EditorGridPanel, {
	
	constructor : function(config) {
	
		var defaultConfig = {
			cm: new Ext.grid.ColumnModel([
			    {header: 'x', dataIndex: 'x', editor: new Ext.form.TextField({}), allowBlank: false},
                {header: 'y', dataIndex: 'y', editor: new Ext.form.TextField({}), allowBlank: false}
             ]),
             store: new Ext.data.SimpleStore({
            	fields: ['x', 'y']//,
            	//data: [[1,2],[3,4]]
             }),
             height: 200,
             clicksToEdit: 1,
             tbar: [{
                 text: 'Lisa',
                 handler : function(){
            	 	var store = this.getStore();
            	 	var p = new store.recordType({x: '', y: ''});
            	 	this.stopEditing();
            	 	var index = store.getCount();
            	 	store.insert(index, p);
            	 	this.startEditing(index, 0);
                 },
                 scope: this,
                 disabled: true
             },{
                 text: 'Kustuta',
                 handler : function(){
            	 	var indexes = this.getSelectionModel().getSelectedCell();
            	 	this.getStore().remove(this.getStore().getAt(indexes[0]));
                 },
                 scope: this,
                 disabled: true
             },
             '-',{
            	 text: 'Vaata',
            	 handler: function() {
            	 	if (this.feature) {
            	 		map.zoomToExtent(this.feature.geometry.getBounds());
            	 	}
             	},
             	scope: this,
             	disabled: true
             }]
		};
		
		config = Ext.apply(defaultConfig, config);
		CoordinatesGridPanel.superclass.constructor.call(this, config);
		
		this.getStore().on('update', this.updateButtons, this);
		this.getStore().on('remove', this.updateButtons, this);
		this.getStore().on('load', this.updateButtons, this);
		
		this.on('render', function(event) {
			var editorGrid = this;
			var element = this.getEl();
			
			/*element.dom.onbeforepaste = function() {
				var indexes = editorGrid.getSelectionModel().getSelectedCell();
				var firstRow = indexes[0];
				var firstColumn = indexes[1];
				editorGrid.startEditing(firstRow, firstColumn);
				alert('!');
			};*/
			
			element.dom.onpaste = function() {
				
				var indexes = editorGrid.getSelectionModel().getSelectedCell();
				var firstRow = indexes[0];
				var firstColumn = indexes[1];
				var store = editorGrid.getStore();
				
				var task = new Ext.util.DelayedTask(function(){
					
					editorGrid.stopEditing();
					
					var record = store.getAt(firstRow);
					var key = record.fields.keys[firstColumn];
					var text = '' + record.get(key);
					
					//debugger;
					
					//var text = 'A\tB\t';//window.clipboardData.getData('Text');
					var rows = text.split(' '); //text.split('\n');
					for (var i = 0; i < rows.length; i++) {
						var columns = rows[i].split('\t');
						//data[i] = [];
						var record = store.getAt(firstRow + i);
						if (!record) {
							record = new store.recordType({});
							store.insert(firstRow + i, record);
						}
						for (var j = 0; j < columns.length; j++) {
							if (firstColumn + j < columns.length) {
								var key = record.fields.keys[firstColumn + j];
								record.set(key, columns[j].replace(',', '.'));
							}
						}
						record.commit();
					}
					
				}, this);
				
				task.delay(100);
				
				return true;
					
			};
		}, this);
	},
	
	setFeature: function(feature, forceReload) {
		
		if (feature == null) {
			this.feature = null;
			this.geometryClassName = null;
			this.getStore().removeAll();
		}
		
		else if (this.feature != feature | forceReload) {
			this.feature = feature;
			this.geometryClassName = this.feature.geometry.CLASS_NAME;
			var coordinates = getFeatureCoordinates(feature);
			this.getStore().loadData(coordinates);
			
			/*var toolbar = this.getTopToolbar();
			if (feature.geometry.CLASS_NAME == 'OpenLayers.Geometry.Point') {
				toolbar.items.items[0].disable();
				toolbar.items.items[1].disable();
			} else {
				toolbar.items.items[0].enable();
				if (feature.geometry.CLASS_NAME == 'OpenLayers.Geometry.Polygon' && coordinates.length < 4)
					toolbar.items.items[1].disable();
				else
					toolbar.items.items[1].enable();
			}*/
		}
		this.updateButtons();
	},
	
	unSetFeature: function(feature) {
		if (feature == this.feature) {
			this.feature = null;
			this.geometryClassName = null;
			this.getStore().removeAll();
			this.updateButtons();
		}
	},
	
	getFeature: function() {
		
		var points = [];
		var geometry = null;
		var feature = null;
		
		this.getStore().each(function(record) {
			var point = new OpenLayers.Geometry.Point(record.data.y, record.data.x);
			if (parseFloat(record.data.x) && parseFloat(record.data.y))
				points.push(point);
		});
		
		if (this.geometryClassName == 'OpenLayers.Geometry.Point') {
			if (points.length > 0)
				geometry = points[0];
		}
		else {
			if (this.geometryClassName == 'OpenLayers.Geometry.LineString' || this.geometryClassName == 'OpenLayers.Geometry.Curve') {
				if (points.length > 1)
					geometry = new OpenLayers.Geometry.LineString(points);
			}
			else if (this.geometryClassName == 'OpenLayers.Geometry.Polygon')
				if (points.length > 2)
					geometry = new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing(points)]);
		}
		if (geometry) {
			feature = new OpenLayers.Feature.Vector(geometry);
			this.oldFeature = this.feature;
			this.feature = feature;
		}
		return feature;
	},
	
	updateButtons: function() {
		var toolbar = this.getTopToolbar();
		if (this.geometryClassName == null) {
			toolbar.items.items[0].disable();
			toolbar.items.items[1].disable();
			toolbar.items.items[3].disable();
		} else {
			toolbar.items.items[0].enable();
			toolbar.items.items[1].enable();
			toolbar.items.items[3].enable();
		}
		/*var toolbar = this.getTopToolbar();
		if (this.geometryClassName == null) {
			toolbar.items.items[0].disable();
			toolbar.items.items[1].disable();
		}
		else if (this.geometryClassName == 'OpenLayers.Geometry.Point') {
			toolbar.items.items[0].disable();
			toolbar.items.items[1].disable();
		} else {
			toolbar.items.items[0].enable();
			if (this.geometryClassName == 'OpenLayers.Geometry.Polygon' && this.getStore().getCount() < 4)
				toolbar.items.items[1].disable();
			else
				toolbar.items.items[1].enable();
		}*/
		/*var toolbar = this.getTopToolbar();
		if (this.geometryClassName == null) {
			toolbar.items.items[0].disable();
			toolbar.items.items[1].disable();
		} else {
			toolbar.items.items[0].enable();
			toolbar.items.items[1].enable();
		}*/
	},
	
	setGeometryClass: function(geometryClassName) {
		this.geometryClassName = geometryClassName;
		this.updateButtons();
	}
	
});

function getFeatureCoordinates(feature)
{
	var coordinates = [];
	var geometry = feature.geometry;
    var geomType = geometry.CLASS_NAME.replace(/OpenLayers.Geometry./,"");
    if(geomType == "Point")
    {   
    	coordinates.push([geometry.x, geometry.y]);
    }
    else if(geomType == "LineString")
    {   
    	var components = geometry.components;
    	for(var j = 0; j < components.length;j++)
        {
    		coordinates.push([geometry.components[j].x, geometry.components[j].y]);
        }
    }
    else if(geomType == "Polygon")
    {
        var components = geometry.components[0].components;
        for(var i = 0; i < components.length - 1; i++)
        {
        	coordinates.push([components[i].x, components[i].y]);
        }
    }
    
    for(var i = 0; i < coordinates.length; i++)
    {
    	coordinates[i][0] = Math.round(1000 * coordinates[i][0]) / 1000;
    	coordinates[i][1] = Math.round(1000 * coordinates[i][1]) / 1000;
    }
    
    // Reverse the coordinates.
    for(var i = 0; i < coordinates.length; i++) {
    	var x = coordinates[i][0];
    	coordinates[i][0] = coordinates[i][1];
    	coordinates[i][1] = x;
    }
    
    return coordinates;
};

/*function updateFeatureCoordinates(feature, coordinates)
{
	var geometry = feature.geometry;
    var geomType = geometry.CLASS_NAME.replace(/OpenLayers.Geometry./,"");
    if(geomType == "Point")
    {   
    	var x = coordinates[0][0] - geometry.x;
    	var y = coordinates[0][1] - geometry.y;
    	geometry.move(x, y);
    }
    else if(geomType == "LineString")
    {   
    	var components = geometry.components;
    	for (var i = 0; i < components.length; i++)
        {
    		var component = geometry.components[i];
    		var x = coordinates[i][0] - component.x;
        	var y = coordinates[i][1] - component.y;
        	component.move(x, y);
        }
    	for (var i = components.length; i < coordinates.length; i++) {
        	var point = new OpenLayers.Geometry.Point(coordinates[i][0], coordinates[i][1]);
        	components.push(point);
        	point.resetBounds();
        }
    }
    else if(geomType == "Polygon")
    {
        var components = geometry.components[0].components;
        for (var i = 0; i < components.length; i++)
        {
        	var component = components[i];
        	var x = coordinates[i][0] - component.x;
        	var y = coordinates[i][1] - component.y;
        	component.move(x, y);
        }
        for (var i = components.length; i < coordinates.length; i++) {
        	var point = new OpenLayers.Geometry.Point(coordinates[i][0], coordinates[i][1]);
        	components.push(point);
        }
    }
    feature.layer.drawFeature(feature);
};*/

Ext.onReady(function() {
	
	var coordinatesGridPanel = new CoordinatesGridPanel({})
	
	var coordinateWindow = new Ext.Window({
		title: 'Koordinaadid',
		border: false,
		//autoHeight: true,
		layout: 'fit',
		width: 240,
		minHeight: 200,
		closeAction: 'hide',
		items: coordinatesGridPanel,
		autoScroll: true,
        //closable: false,
        x: 220,
        y: 110,
        bbar : [
                {xtype: 'tbtext', text: '<span id="coordinates_text"></span>'}
        ],
        constrainHeader: true
	});
	
	function updateMap(/*store, record*/) {
		
		var selectFeatureControl = map.getControlsByClass('OpenLayers.Control.SelectFeature')[0];
		var modifyFeatureControl = map.getControlsByClass('OpenLayers.Control.ModifyFeature')[0];
		
		var oldFeature = coordinatesGridPanel.feature;
		var newFeature = coordinatesGridPanel.getFeature();
		
		//if (!coordinatesGridPanel.getFeature())
		//	return;
		
		if (newFeature == null)
			return;
		
		// Remove an old feature.
		//var oldFeature = layer.selectedFeatures[0]; //modifyFeatureControl.feature; //
		if (oldFeature) {
			selectFeatureControl.unselect(oldFeature);
			layer.removeFeatures(oldFeature, {silent: true});
		}
		
		// Replace it with a new feature.
		//var newFeature = coordinatesGridPanel.getFeature();
		if (newFeature) {
			layer.addFeatures([newFeature], {silent: true});
			selectFeatureControl.select(newFeature);
		}
	}
	
	coordinatesGridPanel.getStore().on('update', updateMap, this);
	coordinatesGridPanel.getStore().on('remove', updateMap, this);
	
	//coordinateWindow.show();
	
	var layer = map.getLayersByName('editlayer')[0];
	
	layer.events.on({
	    'featureselected': function(feature) {
			//coordinateWindow.show();
			coordinatesGridPanel.setFeature(feature.feature);
	    },
	    'featureunselected': function(feature) {
	    	//coordinateWindow.hide();
	    	coordinatesGridPanel.unSetFeature(feature.feature);
	    	//if (feature != coordinatesGridPanel.oldFeature)
	    	//	coordinatesGridPanel.setFeature(feature);
	    },
	    'featuremodified': function(feature) {
	    	var coordinates = getFeatureCoordinates(feature.feature);
	    	coordinatesGridPanel.setFeature(feature.feature, true);
	    }
	});
	
	var markers = new OpenLayers.Layer.Markers( "Markers", {visibleInExtendedToc: false});
    map.addLayer(markers);
    var marker = null;
    
    coordinatesGridPanel.getSelectionModel().on('selectionchange', function(selectionModel, selection) {
    	if (marker) {
    		markers.removeMarker(marker);
    	}
    	if (selection) {
    		var record = selection.record;
	    	var size = new OpenLayers.Size(16, 16);
	        var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
	        var icon = new OpenLayers.Icon('/geoweb/media/img/marker.png', size,offset);
	        marker = new OpenLayers.Marker(new OpenLayers.LonLat(record.data.y, record.data.x), icon);
	        markers.addMarker(marker);
    	}
    });
    
    toolbar2.items.each(function(item) {
    	if (item.geometryType) {
	    	item.on('toggle', function(button, pressed) {
	    		if (pressed) {
	    			//coordinateWindow.show();
	    			
	    			map.getControlsByClass('OpenLayers.Control.SelectFeature')[0].unselectAll();
	    			
	    			coordinatesGridPanel.setFeature(null);
	    			coordinatesGridPanel.setGeometryClass(button.geometryType);
	    		} /*else
	    			coordinatesGridPanel.setGeometryClass(null);*/
	    	});
    	}
    }, this);
    
    coordinateWindow.on('render', function() {
    	map.addControl(new OpenLayers.Control.MousePosition({
    		element: Ext.fly('coordinates_text').dom,
    		numDigits: 3,
    		formatOutput: function(lonLat) {
	            var digits = parseInt(this.numDigits);
	            var newHtml =
	                this.prefix +
	                lonLat.lat.toFixed(digits) +
	                this.separator + 
	                lonLat.lon.toFixed(digits) +
	                this.suffix;
	            return newHtml;
	         }
    	}));
    });
    
    var button = new Ext.Toolbar.Button({
		handler: function() {coordinateWindow.show();},
		iconCls: 'coordinates_btn',
		tooltip: 'Koordinaadid'
	});
    toolbar2.add('-');
	toolbar2.add(button);
	
	coordinateWindow.show();
	coordinateWindow.hide();
	
});
