function getViewportSize() {
	var res = [0, 0];
	if ('undefined' != typeof window.innerWidth) {
		// standards compliant browsers
		res[0] = window.innerWidth;
		res[1] = window.innerHeight;
	} else {
		// IE6 uses either documentElement or document's body
		var d = document.documentElement;
		if ('undefined' == typeof document.documentElement) {
			d = document.getElementsByTagName('body')[0];
		}
		res[0] = d.clientWidth;
		res[1] = d.clientHeight;
	}

	return res;
}

function wrapDialog(dlg) {
	dlg = $(dlg);
	if (dlg.hasClassName('dialog')) return;
	dlg.addClassName('dialog');
	var container = $(document.createElement('div')).addClassName('content');
	container.appendChild($(document.createElement('div')).addClassName('t'));
	while (dlg.firstChild) container.appendChild(dlg.removeChild(dlg.firstChild));
	dlg.appendChild(container);
	var t = document.createElement('div');
	t.style.clear = 'both';
	container.appendChild(t);
	var bottom = $(document.createElement('div')).addClassName('b');
	bottom.appendChild(document.createElement('div'));
	dlg.appendChild(bottom);
}

function init() {
	var vs = getViewportSize();

	var dlg = $('dlg');
	$('step2').hide();
	wrapDialog(dlg);
	Event.observe('b_start', 'click', nextStep);
	Event.observe('b_finish', 'click', function() { $('theform').submit(); });
	var dim = dlg.getDimensions();
	dlg.setStyle({left: (vs[0] - dim.width)/2 + 'px', top: (vs[1] - dim.height)/2 + 'px'});

	$$('input.lined').each(function(e) {
		Event.observe(e, 'keypress', resizeBox);
		Event.observe(e, 'focus', resizeBox);
		resizeBox(null, e);
	});
}

function nextStep() {
	var inputs = $$('#step1 input.required');
	for (var i = 0; i < inputs.length; i++) {
		if (!inputs[i].value) {
			alert('Please fill in all of the fields');
			return;
		}
	}
	$('step1').hide();
	$('step2').show();
}

function resizeBox(evt, e) {
	var t = e ? e : Event.element(evt);
	var l = t.value.length;
	var sz = t.size;
	if (l < 12) sz = 20; else sz = l + 8;
	if (sz < 40) {
		t.size = sz;
	}
}

onload = init;