function roll_image() {
	$('img.roll_image').hover(function() {
			var imageSrc = $(this).attr("src");
			imageArr = imageSrc.split(".");
			var newImg = imageArr[0]+"_roll."+imageArr[1];
			$(this).attr("src", newImg);
		}, function() {
			var imageSrc = $(this).attr("src");
			imageArr = imageSrc.split(".");
			var newImageNamePart = imageArr[0].replace("_roll","");
			var newImg = newImageNamePart+"."+imageArr[1];
			$(this).attr("src",newImg);
	});
}

function roll_button() {
	$('.button')
		.hover(
			function() {
				$(this).addClass('button_roll');
			}, 
			function() {
				$(this).removeClass('button_roll');
			})
		.mousedown(
			function() {
				$(this).removeClass('button_roll').addClass('button_act');
			})
		.mouseup(
			function() {
				$(this).removeClass('button_act');
			});
}


//POPUP inner layer

//0=disabled; 1= enabled;
var popupStatus = 0;
var activePopup = ''; 

function loadPopup(popupId){
	activePopup = popupId;
	centerElementOnPage(popupId);
	if(popupStatus==0){
		$("#backgroundPopup").css({
			"opacity": "0.8"
		});
		$("#backgroundPopup").fadeIn();
		$("#"+popupId).fadeIn();
		popupStatus = 1;
	}
}

//close the opened popup layer
function disablePopup(){
	if(popupStatus==1){
		$("#backgroundPopup").fadeOut();
		$("#"+activePopup).fadeOut();
		popupStatus = 0;
	}
}

//center the popuplayer in the client window
function centerElementOnPage(objId) {
	jQuery('#'+objId).vCenter();
	jQuery('#'+objId).hCenter();
	/*var offsetTop = jQuery('#' + objId).css('top');
	if (offsetTop < 0) {
		offsetTop = 0;
		jQuery("#" + objId).css(offset);
	}*/
	jQuery('#'+objId).css('z-index','99');
}

//CONTROLLING EVENTS  for the popup inner layer
$(document).ready(function(){		
	$(".popupClose").click(function(){
		disablePopup('activePopup');
	});
	$("#backgroundPopup").click(function(){
		disablePopup('activePopup');
	});
});