{{append . "moreStyles" "ui-lightness/jquery-ui-1.7.2.custom.css"}}
{{append . "moreScripts" "js/jquery-ui-1.7.2.custom.min.js"}}
{{template "header.html" .}}

<h1>Book hotel</h1>

<form method="POST" action="{{url "Hotels.Book" .hotel.HotelId}}">
  <p>
    <strong>Name:</strong> {{.hotel.Name}}
  </p>
  <p>
    <strong>Address:</strong> {{.hotel.Address}}
  </p>
  <p>
    <strong>City:</strong> {{.hotel.City}}
  </p>
  <p>
    <strong>State:</strong> {{.hotel.State}}
  </p>
  <p>
    <strong>Zip:</strong> {{.hotel.Zip}}
  </p>
  <p>
    <strong>Country:</strong> {{.hotel.Country}}
  </p>
  <p>
    <strong>Nightly rate:</strong> {{.hotel.Price}}
  </p>
  {{with $field := field "booking.CheckInDate" .}}
    <p class="{{$field.ErrorClass}}">
      <strong>Check In Date:</strong>
      <input type="text" size="10" name="{{$field.Name}}" class="datepicker" value="{{$field.Flash}}">
      * <span class="error">{{$field.Error}}</span>
    </p>
  {{end}}
  {{with $field := field "booking.CheckOutDate" .}}
    <p class="{{$field.ErrorClass}}">
      <strong>Check Out Date:</strong>
      <input type="text" size="10" name="{{$field.Name}}" class="datepicker" value="{{$field.Flash}}">
      * <span class="error">{{$field.Error}}</span>
    </p>
  {{end}}
  <p>
    <strong>Room preference:</strong>
    {{with $field := field "booking.Beds" .}}
    <select name="{{$field.Name}}">
      {{option $field "1" "One king-size bed"}}
      {{option $field "2" "Two double beds"}}
      {{option $field "3" "Three beds"}}
    </select>
    {{end}}
  </p>
  <p>
    <strong>Smoking preference:</strong>
    {{with $field := field "booking.Smoking" .}}
      {{radio $field "true"}} Smoking
      {{radio $field "false"}} Non smoking
    {{end}}
  </p>
  {{with $field := field "booking.CardNumber" .}}
    <p class="{{$field.ErrorClass}}">
      <strong>Credit Card #:</strong>
      <input type="text" name="{{$field.Name}}" size="16" value="{{$field.Flash}}">
      * <span class="error">{{$field.Error}}</span>
    </p>
  {{end}}
  {{with $field := field "booking.NameOnCard" .}}
    <p class="{{$field.ErrorClass}}">
      <strong>Credit Card Name:</strong>
      <input type="text" name="{{$field.Name}}" size="16" value="{{$field.Flash}}">
      * <span class="error">{{$field.Error}}</span>
    </p>
  {{end}}
  <p>
    <strong>Credit Card Expiry:</strong>
    {{with $field := field "booking.CardExpMonth" .}}
    <select name="{{$field.Name}}">
      {{option $field "1" "Jan"}}
      {{option $field "2" "Feb"}}
      {{option $field "3" "Mar"}}
      {{option $field "4" "Apr"}}
      {{option $field "5" "May"}}
      {{option $field "6" "Jun"}}
      {{option $field "7" "Jul"}}
      {{option $field "8" "Aug"}}
      {{option $field "9" "Sep"}}
      {{option $field "10" "Oct"}}
      {{option $field "11" "Nov"}}
      {{option $field "12" "Dec"}}
    </select>
    {{end}}
    {{with $field := field "booking.CardExpYear" .}}
    <select name="{{$field.Name}}">
      {{option $field "2008" "2008"}}
      {{option $field "2009" "2009"}}
      {{option $field "2010" "2010"}}
      {{option $field "2011" "2011"}}
      {{option $field "2012" "2012"}}
    </select>
    {{end}}
  </p>
  <p class="buttons">
    <input type="submit" value="Proceed">
    <a href="{{url "Hotels.Show" .hotel.HotelId}}">Cancel</a>
  </p>
</form>

<script type="text/javascript" charset="utf-8">
$(function() {
  $(".datepicker").datepicker({dateFormat: 'yy-mm-dd'});
});
</script>

{{template "footer.html" .}}
