var howtoDivider = $('howto-divider');

Element.extend({
  visible: function() {
    return this.style.display != 'none';
  },

  toggle: function() {
    this[this.visible() ? 'hide' : 'show']();
    return this;
  },

  hide: function() {
    this.style.display = 'none';
    return this;
  },

  show: function() {
    this.style.display = '';
    return this;
  }
});

function showPre() {
	$('howto-during').hide();
	$('howto-post').hide();
	
	$('howto-pre').show();
	
	$('howto-divider').style.backgroundImage = 'url(/images/barbershop/advice/pre-divider.gif)';

	$ES('img').addEvents({
		'mouseover' : function() {
			if (this.src.indexOf('-over.gif') == -1) {
				this.src = new String(this.src).replace(/.gif/, '-over.gif');
			}
		},
		'mouseout': function() {
			if (this.src.indexOf('-over.gif') != -1) {
				this.src = new String(this.src).replace(/-over.gif/, '.gif');
			}
		}
	});
	
}

function showDuring() {
	$('howto-pre').hide();
	$('howto-post').hide();
	
	$('howto-during').show();
	
	$('howto-divider').style.backgroundImage = 'url(/images/barbershop/advice/during-divider.gif)';
}

function showPost() {
	$('howto-pre').hide();
	$('howto-during').hide();
	
	$('howto-post').show();
	
	$('howto-divider').style.backgroundImage = 'url(/images/barbershop/advice/post-divider.gif)';
}

window.addEvent('load', showPre);