//  Portfolio Effects
//  author: Steven Killen
//  framework: Mootools 1.2

window.addEvent('domready', function() {
	var btn = $('open');
	var work = $('piece');
	var item = $$('.xgames-img', '.who_is_skillen_v15-img')
	
	var status = { //Possibly null will remove later
		'true': 'open',
		'false': 'close'
	};
	//----------------- Override the css hover properties if javascript is enabled ---------------
	
	var itemPos = item.getStyle('backgroundPosition'); // Get the original background position from the class name

	if($('piece')) { // if the element piece exists
	$('piece').addEvent('mouseenter', function(e) {
		if (work.getStyle('width').toInt() == 800  || work.getStyle('width').toInt() == 110) {
			work.setStyles({
				'width': 110

			});
			item.setStyles({
				'background-position' : itemPos // Reset the hover property using the original bg position
			});
		}
	});
	}
	
	//------------------ Add the expanding tween to #work in portfolio ----------------------------
	
	var myEffects = new Fx.Morph('piece', {duration: 500, transition: Fx.Transitions.Sine.easeOut});

	if ($('open')) {
		$('open').addEvent('click', function(e){
			if (work.getStyle('width').toInt() > 117) {
				//hide
				//alert(itemPos);
				myEffects.start({
					'width': 110,
					'background-position': itemPos // Reset the background position when the image closes
				});
				btn.removeClass('close');
			}
			else {
				//show
				myEffects.start({
					'width': 799,
					'background-position': '0 0'
				});
				btn.addClass('close');
			}
			//toggle classname 
			//btn.toggleClass('close');
			return false;
		});
	}
    //---------------------------------------------------------------------------------------------

});