<?php \Laravel\Section::start('container'); ?>
<h3>Compare Prices</h3>
<!-- the tabs -->
<ul class="tabs">
	<li><a id="monday" class='day-tab'>Monday</a></li>
	<li><a id="tuesday" class='day-tab'>Tuesday</a></li>
	<li><a id="wednesday" class='day-tab'>Wednesday</a></li>
    <li><a id="thursday" class='day-tab'>Thursday</a></li>
	<li><a id="friday" class='day-tab'>Friday</a></li>
	<li><a id="saturday" class='day-tab'>Saturday</a></li>
    <li><a id="sunday" class='day-tab'>Sunday</a></li>
</ul>

<div id="monday-table" class='day-table' style='display:none'>
<table class="sortable">
<thead>
  <tr>
    <th>Venue</th>
    <th>Pint  </th>
    <th>Vodka and Coke</th>
    <th>Entry</th>
    <th class="sorttable_nosort">Guestlist</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Bamboo</td>
    <td>£2.00</td>
    <td>£2.20</td>
    <td>£5.00</td>
    <td><a class="button nyroModal" onclick="loadGuestListForm('Bamboo', 'Monday')" href="#test">Guestlist</a></td>
  </tr>
  <tr>
    <td>Garage</td>
    <td>£3.50</td>
    <td>£3.40</td>
    <td>£6.00</td>
    <td><a class="button" href="http://www.garageglasgow.co.uk">Guestlist</a></td>
  </tr>
  <tr>
    <td>Kushion</td>
    <td>£3.70</td>
    <td>£6.00</td>
    <td>£4.00</td>
    <td><a class="button" href="http://www.kushionglasgow.co.uk">Guestlist</a></td>
  </tr>
  <tr>
    <td>Sugarcube</td>
    <td>£2.00</td>
    <td>£2.35</td>
    <td>£3.00</td>
    <td><a class="button" href="http://www.sugarcubeglasgow.co.uk">Guestlist</a></td>
  </tr>
</tbody>

  <tr>
    <td>Union</td>
    <td>£1.00</td>
    <td>£2.75</td>
    <td>£0.00</td>
    <td><a class="button" href="http://www.garageglasgow.co.uk">Guestlist</a></td>
  </tr>

</table>
</div>

<div id="club-form" style="display: none; width: 600px;">
  Test
</div>
<p>
<a class="nyroModal" href="#test">DOM Element (hidden div)</a>
</p>
<div id="test" style="display: none; width: 300px;">
  <form id="ContactForm" accept-charset="UTF-8" method="POST">
    <div>
    <label for="name">Name:</label>
    
    <input id="name-input"  class ="input" type="text" name="name">
    </div>
    <div>
      <label for="email">Email:</label>
      <input id="email-input" class ="input" type="text" name="email">
    </div>
    
    <div>
      <label for="guest_numbers" class="Heading">Number of Guests:</label>
      <input id="guest_numbers-input" class ="input" type="text" name="guest_numbers">
    </div>

    <div>
      <label for="terms">Accept Terms and Conditions</label>
      <input type="checkbox" id="terms-input" name="terms" value="yes">
    </div>

    <input type="hidden" id="club" name="club" value="">
    <input type="hidden" id="day" name="day" value="">
    <input id="submit-form" class= "button" type="submit" name="submit" value="Submit">
  </form>
</div>
<?php \Laravel\Section::stop(); ?>

<?php \Laravel\Section::start('scripts'); ?>
<script type="text/javascript"> 
Cufon.now();
$(document).ready(function(){
	$('a#monday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#monday').addClass('highlight-day-tab');
		$('div#monday-table').show();
	});
	
	$('a#tuesday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#tuesday').addClass('highlight-day-tab');
		$('div#tuesday-table').show();
	});
	
	$('a#wednesday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#wednesday').addClass('highlight-day-tab');
		$('div#wednesday-table').show();
	});
	
	$('a#thursday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#thursday').addClass('highlight-day-tab');
		$('div#thursday-table').show();
	});
	
	$('a#friday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#friday').addClass('highlight-day-tab');
		$('div#friday-table').show();
	});
	
	$('a#saturday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#saturday').addClass('highlight-day-tab');
		$('div#saturday-table').show();
	});
	
	$('a#sunday').on('click', function(){
		$('div.day-table').hide();
		$('a.day-tab').removeClass('highlight-day-tab');
		$('a#sunday').addClass('highlight-day-tab');
		$('div#sunday-table').show();
	});
	
	var weekday=new Array(7);
	weekday[0]="sunday";
	weekday[1]="monday";
	weekday[2]="tuesday";
	weekday[3]="wednesday";
	weekday[4]="thursday";
	weekday[5]="friday";
	weekday[6]="saturday";
	weekday[0]="sunday";

	var date = new Date();
	dayIndex = date.getDay();
	$('div#'+weekday[dayIndex]+'-table').show();
	$('#'+weekday[dayIndex]).addClass('highlight-day-tab');

	$('a.nyroModal').nyroModal();

  $('input#submit-form').on('click', function(){
    var name = $('input#name-input').val();
    var email = $('input#email-input').val();
    var guest_numbers = $('input#guest_numbers-input').val();
    var terms = $('input#terms-input').val();
    
    var formvalues = {
      'name' : name,
      'email' : email,
      'guest_numbers' : guest_numbers,
      'terms' : terms
    }
    $.ajax({
        url: "send-email.php",
        type: "POST",
        data: {
          'name' : name,
          'email' : email,
          'guest_numbers' : guest_numbers,
          'terms' : terms
        },
        datatype: "json",
        success: function (json) {
            if (json.msg) {
                //alert a failure message
                alert(json.msg);
            } else {
                //alert a success message
                alert('success');
            }
        }
    });

  });
});

function loadGuestListForm(club, day)
{
  $('input#club').val(club);
  $('input#day').val(day);
}
</script>
<?php \Laravel\Section::stop(); ?>