// resize the main panel based on the actual screen width.
function resizePanel() {

	var newWidth=(document.viewport.getWidth() - ($('leftContent').getWidth() + 120));
	$('rightContent').setStyle({width: (newWidth-30)+"px"});
	$('topBridge2').setStyle({width: (newWidth-50)+"px"});
	$('bottomBridge2').setStyle({width: (newWidth-50)+"px"});
	$('headerTopBridge2').setStyle({width: (newWidth-50)+"px"});
	$('headerBottomBridge2').setStyle({width: (newWidth-50)+"px"});
}

drawers=new Array();
drawers[0]='adminDrawer';
drawers[1]='powerDrawer';
drawers[2]='guideDrawer';
drawers[3]='demoDrawer';
drawers[4]='missionArchitectDrawer';
drawers[5]='userDrawer';

function toggleDrawer(drawerName) {

	// close any open drawers.
	for ( key=0; key<drawers.length; key++ ) {
		if ( $(drawers[key]) ) {
			if ( drawers[key] != drawerName && $(drawers[key]).visible() ) {
				Effect.SlideUp(drawers[key], { duration: 0.3 });
			}
		}
	}

	if ( $(drawerName).visible() ) {
		Effect.SlideUp(drawerName, { duration: 0.3 });
	} else {
		Effect.SlideDown(drawerName, { duration: 0.3 });
	}

	return false

}

function toggleSection(name) {

	if ( $(name).visible() ) {
		//Effect.SlideUp(name, { duration: 0.3 });
		$(name).hide();
	} else {
		//Effect.SlideDown(name, { duration: 0.3 });
		$(name).show();
	}

	return false

}

function textCounter(textToCount, countDiv, maxCharacterCount) {
	var amountLeft=parseInt((maxCharacterCount-$(textToCount).value.length));
	if ( amountLeft < 0 ) {
		$(countDiv).innerHTML='<span style="color: #ff0000">'+amountLeft+" characters remaining</span>"
	} else if ( amountLeft == 1 ) {
		$(countDiv).innerHTML='<span style="color: #ff9999">'+amountLeft+" character remaining</span>"
	} else if ( amountLeft < 100 ) {
		$(countDiv).innerHTML='<span style="color: #ff9999">'+amountLeft+" characters remaining</span>"
	} else {
		$(countDiv).innerHTML='<span style="color: #11ff11">'+amountLeft+" characters remaining</span>"
	}
}

var W3CDOM = (document.createElement && document.getElementsByTagName);

// find all elements that are fileuploads alter them so that they appear styled.
// if javascript is turned off or disabled this will result in having just the original inputs.
function initFileUploads(options) {
	if (!W3CDOM) return;

	var elements=$$('div.fileUpload');
	for ( var i=0; i<elements.length; i++ ) {
		elements[i].setStyle({ opacity: 0 });

		// we now need to write another division with the styles on.
		var newDivision=document.createElement('div');
		newDivision.id=elements[i].id + 'Overlay';
		if ( options.uploadClass ) {
			newDivision.className=options.uploadClass;
		}

		// create a new label or text box
		if ( options.label ) {
			var uploadInput=document.createElement('label');
			uploadInput.id=elements[i].id + 'Input';
			if ( options.labelClassname ) {
				uploadInput.className=options.labelClassname;
			}
			newDivision.appendChild(uploadInput);
		} else {
			var uploadInput=document.createElement('input');
			uploadInput.name=elements[i].id + 'Input';
			uploadInput.id=elements[i].id + 'Input';
			if ( options.inputClassname ) {
				uploadInput.className=options.inputClassname;
			}
			newDivision.appendChild(uploadInput);
		}

		// create a new upload button
		if ( options.imageButton ) {
		} else {
			var uploadButton=document.createElement('input');
			uploadButton.type='button';
			uploadButton.name=elements[i].id + 'Button';
			uploadButton.id=elements[i].id + 'Button';
			uploadButton.value='Browse';
			if ( options.buttonClassname ) {
				uploadButton.className=options.buttonClassname;
			}
			newDivision.appendChild(uploadButton);
		}

		uploadButton.relatedElement=elements[i];
		uploadInput.relatedElement=elements[i];
		newDivision.relatedElement=elements[i];

		elements[i].relatedElement=uploadInput;

		//elements[i].observe('change', function (){ this.relatedElement.value=this.value; } );
		elements[i].onchange = function (){ subElements=this.childElements(); this.relatedElement.value=subElements[0].value; };

		// append the upload to the parent container.
		elements[i].parentNode.appendChild(newDivision);

	}

}

Event.observe(window, 'load', function() {
  initFileUploads({ 'text' : true,
  					'uploadClass' : 'fakeFileUpload',
  					'inputClassname' : 'formFileBox',
  					'buttonClassname' : 'formButton',
  					});
});