window.addEvent('domready', function() {
	var data_url = "data.html";
	//We can use one Request object many times.
	var req = new Request.HTML({onSuccess: function(html) {
			//Clear the text currently inside the results div.
			$('result').set('text', '');
			//Inject the new DOM elements into the results div.
			$('result').adopt(html);
			$$('.work_holder').removeEvents();
			$$('.work_holder').addEvents({
		'click': function(){
			var pic = this.getElement('div.img');
			var pic_hieght = this.getElements('div.img').get('v_height');
			var pic_cord = this.getElements('div.img').get('v_cord');
			var myEffect = new Fx.Morph(pic, {duration: 250, transition: Fx.Transitions.Sine.easeOut});
			
			if (pic.getStyle('height') == '146px'){
				myEffect.start({
					'height':pic_hieght, 
					'background-position':'0 0'
				});
			}else{
				myEffect.start({
					'height':146, 
					'background-position':'0 '+pic_cord
				});
			}
		}
	});
		},
		//Our request will most likely succeed, but just in case, we'll add an
		//onFailure method which will let the user know what happened.
		onFailure: function() {
			$('result').set('text', 'The request failed.');
		}
	});
	
	$$('.sub_menu a').addEvent('click', function() {
		$$('.sub_menu a').setStyle('background-position','-63px 0');
		this.setStyle('background-position','0 0');
		if ( this.get('text') == 'logo' ){data_url="logo/logo.html";};
		if ( this.get('text') == 'print' ){data_url="print/print.html"; };
		if ( this.get('text') == 'web' ){data_url="web/web.html"; };
		if ( this.get('text') == 'all' ){data_url="all.html"; };
		req.send({url:data_url});
	});
	
	$$('.work_holder').addEvents({
		'click': function(){
			var pic = this.getElement('div.img');
			var pic_hieght = this.getElements('div.img').get('v_height');
			var pic_cord = this.getElements('div.img').get('v_cord');
			var myEffect = new Fx.Morph(pic, {duration: 250, transition: Fx.Transitions.Sine.easeOut});
			
			if (pic.getStyle('height') == '146px'){
				myEffect.start({
					'height':pic_hieght, 
					'background-position':'0 0'
				});
			}else{
				myEffect.start({
					'height':146, 
					'background-position':'0 '+pic_cord
				});
			}
		}
	});
	
	                req.send({url:'web/web.html'});


});