{literal}
<script>

function do_toggle(id)
{
	document.getElementById('form').style.display="block";

	if (id == 'do_login') 
	{
		document.getElementById('loginButtonToggle').style.display="block";
		document.getElementById('paymentOptionsToggle').style.display="none";
		document.orderform.login.value='login';
		document.getElementById('do_login').style.display='block';
		document.getElementById('billing').style.display='none';
	}
	else 
	{
		document.getElementById('paymentOptionsToggle').style.display="block";
		document.getElementById('loginButtonToggle').style.display="none";
		document.orderform.login.value='';
		document.getElementById('do_login').style.display='block';
		document.getElementById('billing').style.display='block';
	}
}

function showPaymentOptions(id)
{
	reveal('paymentOptions','paymentOptionsToggle');
	//document.location.href="#paymentOptions";
}

</script>
<style>
li a
{
	text-decoration:underline;
}
	
</style>
{/literal}

</div>
</div>
</div>
</div>
</tr>
</tr>
</tr>
</tr>
</tr>
</div>
</div>
</div>
</div>
</div>
</table>
</table>
</table>
</table>

<center><!-- old reliable -->

{php}
//print_pre($_SESSION);
{/php}

{* $smarty.session.user.id *}

	{if !$LOGGED_IN}
		<div class="blueHeader" style="width:720px">Before you continue, please choose one of the following:</div>
		<div id="options" style="width:720px;clear:both;text-align:center;margin-bottom:30px;margin-top:10px">
			<button type="button" onclick="javascript:do_toggle('do_login')" style="color:darkgreen">I have ordered here before</button>
			<button type="button" onclick="javascript:do_toggle('billing')" style="color:darkgreen">I am ordering for the first time</button>
		</div>
	{/if}

	{* stuff:{$email} || {$valid_password} || {$LOGGED_IN} !{$email_error} !{$password_error} *}
<div id="form" style="width:720px;{if $LOGGED_IN}display:none{/if}">
		<div class="greyHeader" style="width:720px;">Billing Account Information</div>
			<input type="hidden" class="hidden" name="login" value="">
	{if $smarty.session.user.id && !$email_error && !$password_error}
		<script>
			document.getElementById('do_login').style.display='block'
			document.getElementById('form').style.display='block'
		</script>
		<h2>Current Account Details</h2>
		<div class="formLabel">Email Address</div>
			<div class="element"><b>{$email}</b></div><br />

		<div class="formLabel">Password</div>
			<div class="element"><b>&laquo;hidden&raquo;</b></div><br />

		<input type="hidden" class="hidden" name="user[email]" value="{$email}">
		<input type="hidden" class="hidden" name="user[password]" value="{$password}">
		<input type="hidden" class="hidden" name="user[id]" value="{$id}">

		{if $id && $uniq_id}
		<input type="hidden" class="hidden" name="uniq_id" value="{$uniq_id}">
		{/if}

		{else}
			<br />
			<div id="do_login">
				<div class="formLabel">Email Address</div>
					<div class="element"><input type="text" class="{$error_email}" name="user[email]" maxlength="255" size="30" value="{$email}"></div><br />
				<div class="formLabel">Password</div>
					<div class="element"><input type="password" class="{$error_password}" name="user[password]" maxlength="255" size="30" value="{$password}"></div>
				<div id="loginButtonToggle" style="width:400px;float:left;display:none;clear:both">

					<button class="btn" type="button" style="background:lightgrey;float:left" onclick="window.open('index.php?page=lost_password&nohead=1','lostPassword','location=no,menubar=no,status=no,top=200,left=200,width=400,height=200,scrollbars=no,status=no');">I Lost my password</button>
					<button class="btn" type="submit" style="background:lightgreen;padding-right:30px;margin-right:30px;float:right">Login &gt;</button>
				</div>
			</div><br />
		{/if}

			<div id="billing" {if $valid_passwd}style="display:none;"{/if}>
				<div class="formLabel">First Name</div>
					<div class="element"><input type="text" class="{$error_firstname}" name="user[firstname]" maxlength="255" size="30" value="{$firstname}"></div> <sup>(As it appears on your credit card)</sup><br />
				<div class="formLabel">Last Name</div>
					<div class="element"><input type="text" class="{$error_lastname}" name="user[lastname]" maxlength="255" size="30" value="{$lastname}"></div>
				<sup>(As it appears on your credit card)</sup><br />
				<div class="formLabel">Address</div>
					<div class="element"><input type="text" class="{$error_address}" name="user[address]" maxlength="255" size="30" value="{$address}"></div><br />
				<div class="formLabel">City</div>
					<div class="element"><input type="text"  class="{$error_city}" name="user[city]" maxlength="255" size="30" value="{$city}"></div><br />

				<div class="formLabel">State</div>
					<div class="element">
						<select name="user[state]" class="{$error_state}">
						<option value="">[Your State]</option>
						{state_select selected=$state}
						</select>
					</div><br />
				<div class="formLabel">Zipcode</div>
						<div class="element"><input type="text" class="{$error_zipcode}" name="user[zipcode]" style="width:130px" maxlength="255" size="30" value="{$zipcode}"></div><br />
				<div class="formLabel">Country</div>
					<div class="element">
						<select name="user[country]" class="{$error_country}">
						<option value="">[Your Country]</option>
						{country_select selected=$country}
					</select></div><br />
				<div class="formLabel">Contact Phone</div>	
					<div class="element"><input type="text" class="{$error_phone}"  name="user[phone]" maxlength="255" size="30" value="{$phone}"></div><br />
			<br />

			<div id="paymentOptionsToggle">
				<button class="btn" type="button" style="background:lightblue" onclick="showPaymentOptions('paymentOptions');return(false);">Choose Payment Options &gt;</button>
			</div>
		</div>

<script>
	newUser = '{$newUser}';
	if (newUser) do_toggle('billing');
</script>