var StoreSlide = Class.create();
StoreSlide.prototype = { 
	initialize: function() {
		$("edmarkfamily").hide();
		$("tpsfamily").hide();
		$("wbfamily").hide();
		$("kpxfamily").hide();
		$("hsfamily").hide();
		$("cffamily").hide();
		$("globefamily").hide();
		$("seussfamily").hide();
		$("mavisfamily").hide();
		
		$("edmarkfamily").removeClassName('hidden');
		$("tpsfamily").removeClassName('hidden');
		$("wbfamily").removeClassName('hidden');
		$("kpxfamily").removeClassName('hidden');
		$("hsfamily").removeClassName('hidden');
		$("cffamily").removeClassName('hidden');
		$("globefamily").removeClassName('hidden');
		$("seussfamily").removeClassName('hidden');
		$("mavisfamily").removeClassName('hidden');
		
		Event.observe('edmarkbutton', 'click', this.edmarkArea.bindAsEventListener(this), false);
		Event.observe('tpsbutton', 'click', this.tpsArea.bindAsEventListener(this), false);
		Event.observe('wbbutton', 'click', this.wbArea.bindAsEventListener(this), false);
		Event.observe('kpxbutton', 'click', this.kpxArea.bindAsEventListener(this), false);
		Event.observe('hsbutton', 'click', this.hsArea.bindAsEventListener(this), false);
		Event.observe('cfbutton', 'click', this.cfArea.bindAsEventListener(this), false);
		Event.observe('globebutton', 'click', this.globeArea.bindAsEventListener(this), false);
		Event.observe('seussbutton', 'click', this.seussArea.bindAsEventListener(this), false);
		Event.observe('mavisbutton', 'click', this.mavisArea.bindAsEventListener(this), false);
	},
	edmarkArea: function() {
		Effect.toggle('edmarkfamily', 'slide', {duration:.5, afterFinish: this.edmarkChangeButton.bind(this)}); 
	},
	edmarkChangeButton: function() {
		if ($('edmarkfamily').visible()) $('edmarkbutton').firstChild.src = "images/store/sliding/edmarkopen.jpg";
		else $('edmarkbutton').firstChild.src = "images/store/sliding/edmark.jpg";
	},
	tpsArea: function() {
		Effect.toggle('tpsfamily', 'slide', {duration:.5, afterFinish: this.tpsChangeButton.bind(this)}); 
	},
	tpsChangeButton: function() {
		if ($('tpsfamily').visible()) $('tpsbutton').firstChild.src = "images/store/sliding/tpsopen.jpg";
		else $('tpsbutton').firstChild.src = "images/store/sliding/tps.jpg";
	},
	wbChangeButton: function() {
		if ($('wbfamily').visible()) $('wbbutton').firstChild.src = "images/store/sliding/wbopen.jpg";
		else $('wbbutton').firstChild.src = "images/store/sliding/wb.jpg";
	},
	wbArea: function() {
		Effect.toggle('wbfamily', 'slide', {duration:.5, afterFinish: this.wbChangeButton.bind(this)}); 
	},
	kpxArea: function() {
		Effect.toggle('kpxfamily', 'slide', {duration:.5, afterFinish: this.kpxChangeButton.bind(this)}); 
	},
	kpxChangeButton: function() {
		if ($('kpxfamily').visible()) $('kpxbutton').firstChild.src = "images/store/sliding/kpopen.jpg";
		else $('kpxbutton').firstChild.src = "images/store/sliding/kp.jpg";
	},
	hsArea: function() {
		Effect.toggle('hsfamily', 'slide', {duration:.5, afterFinish: this.hsChangeButton.bind(this)}); 
	},
	hsChangeButton: function() {
		if ($('hsfamily').visible()) $('hsbutton').firstChild.src = "images/store/sliding/hsopen.jpg";
		else $('hsbutton').firstChild.src = "images/store/sliding/hs.jpg";
	},
	cfArea: function() {
		Effect.toggle('cffamily', 'slide', {duration:.5, afterFinish: this.cfChangeButton.bind(this)}); 
	},
	cfChangeButton: function() {
		if ($('cffamily').visible()) $('cfbutton').firstChild.src = "images/store/sliding/cfopen.jpg";
		else $('cfbutton').firstChild.src = "images/store/sliding/cf.jpg";
	},
	globeArea: function() {
		Effect.toggle('globefamily', 'slide', {duration:.5, afterFinish: this.globeChangeButton.bind(this)}); 
	},
	globeChangeButton: function() {
		if ($('globefamily').visible()) $('globebutton').firstChild.src = "images/store/sliding/3dwgopen.jpg";
		else $('globebutton').firstChild.src = "images/store/sliding/3dwg.jpg";
	},
	seussArea: function() {
		Effect.toggle('seussfamily', 'slide', {duration:.5, afterFinish: this.seussChangeButton.bind(this)}); 
	},
	seussChangeButton: function() {
		if ($('seussfamily').visible()) $('seussbutton').firstChild.src = "images/store/sliding/seussopen.jpg";
		else $('seussbutton').firstChild.src = "images/store/sliding/seuss.jpg";
	},
	mavisArea: function() {
		Effect.toggle('mavisfamily', 'slide', {duration:.5, afterFinish: this.mavisChangeButton.bind(this)}); 
	},
	mavisChangeButton: function() {
		if ($('mavisfamily').visible()) $('mavisbutton').firstChild.src = "images/store/sliding/mbopen.jpg";
		else $('mavisbutton').firstChild.src = "images/store/sliding/mb.jpg";
	}
}
function setup() {
	new StoreSlide();
}
Event.observe(window, 'load', setup);