/**
 * Styling File Inputs - AKA 'FileUI'
 * @author: Marc Grabanski
 * @sdoc: http://marcgrabanski.com/code/style-file-input
 */

//path = path ? path : null;
var FileUI = 
{
	disableText : false,
	imgPath : null,
	imgPathOver : null,
	textOnly : null,
	spanClass : 'inputFile',
	
	init : function () 
	{
		var spans = document.getElementsByTagName('span');
		for (var i = 0; i < spans.length; i++)
		{
			if (spans[i].className.indexOf(this.spanClass) != -1)
			{
				this.style( spans[i], spans[i].getElementsByTagName('input')[0] );
			}
		}
	},
	style : function (span, input)
	{
		setStyle = (navigator.appVersion.indexOf("MSIE")!=-1) ? 'cssText' : 'style';
		this.setStyle(span, 'position: relative; border: 1px solid transparent; float:left; left: -1px; top: -1px; margin: 0 0 17px; ');
		this.setStyle(input, 'position: absolute; top: 0; margin: 0 0 0 40px; z-index: 200; -moz-opacity: 0; filter: alpha(opacity:0); opacity: 0;');
		
		var txtInput = document.createElement('input');
		txtInputWidth = 219;
		txtInput.type = 'text';
		txtInput.value = 'Browse to Attach Resume';
		this.setStyle(txtInput, 
			'width:' + txtInputWidth + 'px;position:absolute;top:0px;left:0px;z-index:10');
		input.onchange = function () {
			txtInput.value = input.value;
		}
		txtInput.disabled = 'disabled';
		span.appendChild(txtInput);
		
		var link = document.createElement('a');
		//linkLeft = txtInputWidth + 8;
		this.setStyle(link, 'position: absolute; top: -3px; left: 207px; z-index: 190;'); //left:' + linkLeft + 'px;'
		if (this.textOnly === null) {
			var img = document.createElement('img');
			img.src = this.imgPath;
			link.appendChild(img);
			if (this.imgPathOver != null) {
				input.onmouseover = function () { img.src = FileUI.imgPathOver; }
				input.onmouseout = function () { img.src = FileUI.imgPath; }
			}
		} else {
			link.innerHTML = this.textOnly;
			link.href = "#";
			link.onclick = function () { return false; }
			input.onmouseover = function () { link.className = 'over'; }
			input.onmouseout = function () { link.className = ''; }
		}
		span.appendChild(link);
	},
	setStyle : function (object, styleText) { 
		if( object.style.setAttribute ) { object.style.setAttribute("cssText", styleText ); } 
		else { object.setAttribute("style", styleText ); } 
	}
}