var PanelView = Backbone.View.extend({
	el: $('#panel'),
	
	initialize : function(params){
		console.log('initializing the PanelView')
		_.bindAll(this, 'render','propertiesChanged','centerZoom');
		this.map = params.map
		this.sets = params.dataSets;
		this.properties = params.properties;
	//	this.properties.bind('change',this.propertiesChanged); 
		
		
		this.sets.bind('add',this.addDataset);
		this.render();
	},
	
		centerZoom : function(p,newParams){
					var center = this.properties.get('center');
					var zoom = this.properties.get('zoom');
					this.map.centerZoom(center[0],center[1],zoom);
					console.log('centerzoom evetn');
	},
	
	propertiesChanged : function(p){
//		console.log('properties changed');
//		console.log(this.properties.changedAttributes);
		console.log("dim change?"+this.properties.hasChanged('dimmensions'));
		console.log("center change?"+this.properties.hasChanged('center'));
		
		//console.log(p);
	},
	
	addDataset : function(set){
		console.log('view is addind a dataset : '+set.get('id'));
		$(this.el).append('<p>dataset added</p>');
	},
	
	changeSize : function(a){
		console.log(a);
	},
	
	events : {},
	
	render : function(){
		$(this.el).append('<p>This is a test panel.</p>');
		
	}
	
});