<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

<h:form>
<h:panelGrid align="top" columns="1" border="0" cellpadding="0" cellspacing="0" width="100%" rowClasses="reRow1Class" columnClasses="reColumn1Class" styleClass="reStyle1Class">
	<h:panelGroup>
		<h:graphicImage width="115" height="55" url="images/chinese/ReservationTitle.gif"></h:graphicImage>
		<h:graphicImage width="270" height="55" url="images/title-r.gif"></h:graphicImage>
	</h:panelGroup>
	
	<h:panelGroup>
		<h:outputLink value="price.html" >
			<h:graphicImage border="0" height="25" width="85" align="center" url="images/chinese/b-fjb.gif"></h:graphicImage>
		</h:outputLink>
		<h:outputLink value="guestRoom.html" >
			<h:graphicImage border="0" height="25" width="56" align="center" url="images/chinese/b-kf.gif"></h:graphicImage>
		</h:outputLink>
	</h:panelGroup>
	
	<h:panelGrid columns="3" width="90%" border="0" cellpadding="0" cellspacing="0" rowClasses="reRow2Class" columnClasses="reColumn2Class" styleClass="reStyle2Class">
		<h:graphicImage height="489" width="20" url="images/tb-l.gif"></h:graphicImage>
		
		<h:panelGrid columns="2" width="95%" border="0" cellpadding="0" cellspacing="0" headerClass="header3Class" rowClasses="reRow3Class" columnClasses="reColumn3Class" styleClass="reStyle3Class">
			<f:facet name="header">
					<h:outputText value="[reservation room]"></h:outputText>
			</f:facet>
			
			<h:outputLabel for="name" value="name:"></h:outputLabel>
			<h:panelGroup>
				<h:inputText id="name" value="#{customerBean.name}" required="true"></h:inputText>
				<h:message for="name"></h:message>
			</h:panelGroup>
			
			<h:outputLabel for="sex" value="sex:"></h:outputLabel>
			<h:panelGroup>
				<h:selectOneRadio id="sex" value="#{customerBean.sex}" required="true">
					<f:selectItem itemValue="Male"></f:selectItem>
					<f:selectItem itemValue="Female"></f:selectItem>
				</h:selectOneRadio>
				<h:message for="sex"></h:message>
			</h:panelGroup>
			
			<h:outputLabel for="telNum" value="telNum:"></h:outputLabel>
			<h:panelGroup>
				<h:inputText id="telNum" value="#{customerBean.telNum}" maxlength="11" required="true"></h:inputText>
				<h:message for="telNum"></h:message>
			</h:panelGroup>
			
			<h:outputLabel for="from" value="Arrival Date(yyyy-mm-dd):" style="font-size:12pt;"></h:outputLabel>
			<h:panelGroup>
				<h:inputText id="from" value="#{customerBean.checkinDate}" onfocus="setday(this) readOnly">
					<f:convertDateTime pattern="yyyy-MM-dd"></f:convertDateTime>
				</h:inputText>
				<h:message for="from"></h:message>
			</h:panelGroup>
			
			<h:outputLabel for="to" value="Departure Date(yyyy-mm-dd):" style="font-size:12pt;"></h:outputLabel>
			<h:panelGroup>
				<h:inputText id="to" value="#{customerBean.checkoutDate}" onfocus="setday(this) readOnly">
					<f:convertDateTime pattern="yyyy-MM-dd"></f:convertDateTime>
				</h:inputText>
				<h:message for="to"></h:message>
			</h:panelGroup>
			
			<h:outputLabel for="roomNum" value="Numbers of Room:"></h:outputLabel>
			<h:panelGroup>
				<h:inputText id="roomNum" value="#{customerBean.bookNum}">
					<f:convertNumber minIntegerDigits="1"></f:convertNumber>
				</h:inputText>
				<h:message for="roomNum"></h:message>
			</h:panelGroup>
			
			<h:outputLabel for="roomType" value="roomType:"></h:outputLabel>
			<h:panelGroup>
				<h:selectOneMenu id="roomType" value="#{customerBean.roomType}">
					<f:selectItems value="#{customerBean.roomTypeListItems}"></f:selectItems>
				</h:selectOneMenu>
			</h:panelGroup>
			
			
			<h:outputLabel for="sepcialDesc" value="sepcialDesc:"></h:outputLabel>
			<h:panelGroup>
				<h:inputTextarea id="sepcialDesc" rows="4" cols="30" value="#{customerBean.specialDesc}"></h:inputTextarea>
			</h:panelGroup>
			
			<h:commandButton value="submit" action="#{customerBean.submitOrderAction}"></h:commandButton>
			<h:commandButton value="reset" type="reset"></h:commandButton>
		</h:panelGrid>
		
		<h:graphicImage height="489" width="20" url="images/tb-r.gif"></h:graphicImage>
	</h:panelGrid>
</h:panelGrid>
		</h:form>