var _IE = false;
if(navigator.appName.indexOf('Microsoft Internet Explorer') != -1) _IE = true;
Event.observe(window, 'load', function() {
	
	// tooltip *****************************************************************
	
	Prototip.Styles = {
		'default': {
			border: 13,
			width:240,
		    borderColor: '#000000',
			className: 'default',
			closeButton: false,
			hideOthers:true,
			radius: 6,
			hideAfter: 7,
			hideOn: false,
			showOn: 'click',
			stem: { height: 12, width: 15 }
		}
	};
	
	if ($('about')) {
		new Tip($('about'), '<span style="line-height: 15px; font-size: 16px; vertical-align: 90%; "><b>interactive designer, for hire.</b></span><br><span>I\'m thoroughly passionate about design and user experience. Combining the two, creating an approachable and effective experience, is what I do best.<br></span><div><span><a href="chrishenslin_resume.pdf" style="color: #999999; ">&#8594; check out my resume</a></span></div>' , {
			hook: { target: 'topMiddle', tip: 'bottomMiddle' },
			offset: { x: 0, y: -2 },
			stem: 'bottomMiddle'
		});
	}

	if ($('contact')) {
		new Tip($('contact'), '<span style="line-height: 23px; font-size: 14px; "><b>email:</b></span> <a href="mailto:inquiries@chrishenslin.com" style="color: #999999; ">inquiries@chrishenslin.com</a><br><span style="line-height: 23px; font-size: 14px; "><b>twitter:</b></span> <a href="http://twitter.com/henslin" style="color: #999999; ">@henslin</a><br><span style="line-height: 23px; font-size: 14px; "><b>resume:</b></span> <a href="chrishenslin_resume.pdf" style="color: #999999; ">view</a><br><span style="line-height: 23px; font-size: 14px; "><b>vCard:</b></span> <a href="chrishenslin_vCard.zip" style="color: #999999; ">download</a></span>' , {
			hook: { target: 'topMiddle', tip: 'bottomMiddle' },
			offset: { x: 0, y: -2 },
			stem: 'bottomMiddle'
		});
	}
	
	// link color **************************************************************
	_duration = .7
	$$('a').each(function(_link){
		_link.onmouseover = function(){
			new Effect.Morph(_link, {
				style: {'color': '#000000'},
				duration: _duration
			});
		};
		_link.onmouseout = function(){
			new Effect.Morph(_link, {
				style: {'color': '#575757'},
				duration: _duration
			});
		};
	});
	if (!window.attachEvent || window.opera){
		$$('#gallery li').each(function(li){
			var _span = li.select('span')[0];
			var _effect = false;
			_span.setStyle({
				'opacity': '0',
				'top':'0'
			});
			li.onmouseover = function(){
				if (_effect) _effect.cancel();
				_effect = new Effect.Morph(_span, {
					style: {'opacity': '1'},
					duration: _duration
				});
			};
			li.onmouseout = function(){
				if (_effect) _effect.cancel();
				_effect = new Effect.Morph(_span, {
					style: {'opacity': '0'},
					duration: _duration
				});
			};
		});
	}
});
Event.observe(window, 'load', function(){
	$$('#footer span, #footer a').each(function(_el){
		var _text = _el.innerHTML;
		_el.style.position = 'relative';
		_el.innerHTML = '<span class="orign-text">'+_text+'</span><span class="shadow">'+_text+'</span>';
		
	});
	var _duration = (_IE)?0:0.7;
	$$('div.header-hold .logo a').each(function(_el){
		var _text = _el.innerHTML;
		_el.style.position = 'relative';
		_el.innerHTML = '<span class="orign-text">'+_text+'</span><span class="shadow">'+_text+'</span>';
		var _el1 = _el.select('span.orign-text')[0];
		var _el2 = _el.select('span.shadow')[0];
		_el2.setOpacity(0);
		_el.onmouseover = function(){
			new Effect.Opacity(_el2, {to: 1, duration: _duration});
		}
		_el.onmouseout = function(){
			new Effect.Opacity(_el2, {to: 0, duration: _duration});
		}
	});
});