var ChateauPreview = new Class({
		
	initialize: function(id, options){
		this.Element = new Element('div', {
			'id': id,
			'html' : this.test_html,
			'class' : 'chateau-preview previewbox'
		});
		
		this.test_vars = new Hash(this.test_vars);
		
		this.refresh.bind(this);
		//this.test_connect.bind(this);
		//this.test_connect('img.vignette@src', '/images/vignettes/pt_default.jpg');
		/*$each(this.test_vars, function(){
			this.test_connect();
		}).bind(this);*/
		
		//this.refresh();
	},
	
	test_vars: {
		'img.vignette@src' : 'pt_default.jpg',
		'h4' : 'Chateau',
		'ul@html' : '<li>1</li><li>2</li>'
	},
	
	refresh: function(){
		this.test_vars.each(function(value, key){
			this.test_connect(key, value);
		}, this);
	},
	
	test_html: '<div class="container"><div class="body"><img class="vignette" src="" /><h4></h4><ul class="simple"></ul></div></div><div class="bottom"><!-- --></div>',
	
	connect: function(var_selector, value){
		if (var_selector.contains("@")){
			var selector = var_selector.split("@").shift();
			var var_name = var_selector.split("@").pop();
			
			//alert(selector);
		}
		else {
			var selector = var_selector;
			var var_name = 'text';
		}
		
		var el = this.Element.getElement(selector);
		//alert(var_name);
		switch (var_name){
			case 'text':
			case 'html':
				el.empty().set(var_name, value);
			break;
			
			case 'src':
			case 'width':
			case 'height':
				//alert(el.get('class'));
				el.set(var_name, value);
			break;
		}
	}
});