<!DOCTYPE html>
<html lang="en">
	<head>
	    <meta name="viewport" content="width=device-width">
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		<meta name="author" content="https://urbansketcherspune.com/" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
		<title>Urban Sketchers Pune</title>
		<!-- Favicon -->
		<link rel="shortcut icon" href="<?php echo base_url(); ?>assets/images/favicon.png" />
		<!-- font -->
		<link  rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,500,500i,600,700,800,900|Poppins:200,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900">
		<!-- Plugins -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/plugins-css.css" />
		<!-- Typography -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/typography.css" />
		<!-- Shortcodes -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/shortcodes/shortcodes.css" />
		<!-- Style -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/style.css" />
		<!-- shop -->
		<link href="<?php echo base_url(); ?>assets/css/shop.css" rel="stylesheet" type="text/css" /> 
		<!-- Responsive -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/responsive.css" />
		<style type="text/css" id="#jarallax-clip-0">#jarallax-container-0 {
		   clip: rect(0 1311px 466px 0);
		   clip: rect(0, 1311px, 466px, 0);
		}
		
		</style>
		<style>
		.footer .footer-text p{
			color:black !important;
		}
		.footer .footer-text p :hover{
			color:#95bc3f !important;
		}
		.footer .footer-social ul li a {
			color:black !important;
		}

		.footer .footer-social ul li a:hover {
			color:#95bc3f !important;
		}
		
		.header.light .mega-menu .menu-links > li > a:hover {
					color:#95bc3f !important;
		}
		
		.header.light .mega-menu .menu-links > li > a:hover {
					color:#95bc3f !important;
		}
	
		.product .product-image:hover img{
		   -webkit-transform: scale(1.20);
			-moz-transform: scale(1.20);
			-ms-transform: scale(1.20);
			-o-transform: scale(1.20);
			transform: scale(1.13);
		}
		.mb-30 {
			margin-bottom: 10px !important;
		}
		.form-control {
			padding: 10px 18px 10px 30px;
		}
		.form-control {
			width: 100%;
		}
		label {
			max-width: 100%;
		}
		label {
		    display: block;
		}
		.nice-select.wide {
			width: 100%;
		}
		.nice-select{
			height: 40px;
			line-height: 37px;
		}
		@media (max-width: 992px){
            .mega-menu .menu-logo img {
                width: 50px !important;
                height: 50px !important;
            } 
		}
		</style>
		<style>
		    .razorpay-payment-button {
		        background: black;
                padding: 12px 20px;
                font-size: 13px;
                letter-spacing: 1px;
                font-family: 'Montserrat', sans-serif;
                border: 0;
                color: #ffffff;
                text-transform: uppercase;
                font-weight: 400;
                display: inline-block;
                border-radius: 30px;
                text-align: center;
                border: 2px solid #95bc3f;
                width: 49%;
                margin-top:10px;
                float: right!important;
		    }
		    
		    .table>thead>tr>th {
                vertical-align: bottom;
                border: 2px solid #ddd;
            }
            
            .table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th {
                border-top: 2px solid #ddd !important; 
            }
            
            .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {

                vertical-align: middle !important;
                border: 1px solid #ddd;
                text-align: center;
            }
            
            ::-webkit-scrollbar {
              width: 10px;
            }
             
            /* Handle */
            ::-webkit-scrollbar-thumb {
              background: #e41911; 
              border-radius: 10px;
            }
            
            /* Handle on hover */
            ::-webkit-scrollbar-thumb:hover {
              background: black; 
            }
            
            .alignLeft
            {
                text-align: none !important;
            }
            
            .greenSeats {
                font-size: 12px;
                color: green;
                font-weight: bold;
                width: 100%;
            }
            
            .redSeats {
                font-size: 12px;
                color: red;
                font-weight: bold;
                width: 100%;
            }
		</style>
	</head>
	<body>
		<div class="wrapper">
			<!--================================= header -->
			<header id="header" class="header light">
				<!--================================= mega menu -->
				<div class="menu">  
					<!-- menu start -->
					<nav id="menu" class="mega-menu">
						<!-- menu list items container -->
						<section class="menu-list-items">
							<div class="container"> 
								<div class="row"> 
									<div class="col-lg-12 col-md-12"> 
										<!-- menu logo -->
										<ul class="menu-logo" style="padding:0px;">
											<li>
												<a href="#" style="color:green; font-size:30px;"><img id="logo_img" src="<?php echo base_url(); ?>assets/images/logo/urbensketcherspune-logo.jpeg" alt="logo" style="width:100%; height:100%; margin-top: 10px;"><!--Herbal Nector--></a>
											</li>
										</ul>
										<!-- menu links -->
										<div class="menu-bar">
											<ul class="menu-links">
												<?php
												    echo "<li class='hoverTrigger'><a href='#'>Main </a></li>";
												    //echo "<li class='hoverTrigger'><a href=".base_url()."index.php/workshopRegistration/WorkshopRegistrationController>Workshop Registration</a></li>";
												    echo "<li class='hoverTrigger'><a href=".base_url()."index.php/workshopBooking/WorkshopBookingController>Workshop Booking</a></li>";
												    echo "<li class='hoverTrigger active'><a href=".base_url()."index.php/workshopRegistrationWithBooking/WorkshopRegistrationWithBookingController>Workshop Registration With Booking</a></li>";
												?>
											</ul>
										</div>
									</div>
								</div>
							</div>
						</section>
					</nav>
					<!-- menu end -->
				</div>
			</header>
			<!--================================= header -->

            <!--<form action="https://www.example.com/payment/success/" method="POST">-->
            <section class="checkout-page page-section-ptb" style="padding-bottom:10px;">
				<div class="container">
                   <form action="<?php echo base_url(); ?>index.php/workshopRegistrationWithBooking/WorkshopRegistrationWithBookingController/insertWorkshopRegistrationWithBooking" method="POST">
                        <div class="row">
                            <div class="col-lg-12 col-md-12 col-sm-12">
								<h4 class="mb-40" style="margin-top:0px;">
								    <center>
								        Workshop Registration With Booking
								    </center>
								</h4>
								<div class="divider double mb-20"></div>
								<h6 class="mb-20" style="margin-top:0px;">Workshop Registration Details</h6>
								<div class="divider double mb-20"></div>
							</div>
							<div class="col-lg-6 col-md-6 col-sm-6">
								<div class="section-field mb-30">
								   <label class="mb-10">Full Name</label>
								   <input id="txtFullName" type="text" placeholder="" class="form-control"  name="txtFullName" required>
							   </div>
							   <div class="section-field mb-30">
								   <label class="mb-10">Contact Number</label>
								   <input id="txtContactNumber" type="number" placeholder="" class="form-control"  name="txtContactNumber" required>
							   </div>
								<div class="section-field mb-30">
									<label class="mb-10">Email Address</label>
									<input id="txtMailID" type="email" placeholder="" class="form-control"  name="txtMailID" required>
								</div>
							</div>
							<div class="col-lg-6 col-md-6 col-sm-6">
								<div class="section-field mb-30">
									<label class="mb-10">Address</label>
									<!--<input id="txtAddress" type="text" placeholder="" class="form-control"  name="txtAddress" required>-->
									<textarea id="txtAddress" name="txtAddress" rows="5" cols="50" class="form-control" required></textarea>
								</div>
								<div class="section-field mb-30">
									<label class="mb-10">Urban sketcher group branch city</label>
									<input id="txtGroupBranchCity" type="text" placeholder="" class="form-control"  name="txtGroupBranchCity" required>
								</div>
							</div>
							<div class="col-lg-12 col-md-12 col-sm-12">
							    <div class="divider double mt-40 mb-10"></div>
							</div>
							<div class="col-lg-6 col-md-6 col-sm-6">
								<div class="section-field mb-30" style ="margin-left: 20px;">
									<label class="radio mb-10">
										<input type="radio" checked="checked" name="withRegistrationFlag" value='0' id="withRegistrationFlag-without" onclick="withRegistrationFlagEvent(this);">
										<span></span>Only Registration <h6 class="mb-10" style="margin-top:0px;">Registration Charges Rs. 500/- Only</h6>
									</label>
								</div>
								<!--
								<div class="section-field mt-30">
									<h6 class="mb-10" style="margin-top:0px;">Registration Charges : Rs. 500/- Only</h6>
								</div>-->
							</div>
							<div class="col-lg-6 col-md-6 col-sm-6">
								<div class="section-field mb-30" style ="margin-left: 20px;">
									<label class="radio">
										<input type="radio" name="withRegistrationFlag" id="withRegistrationFlag-with" value='1' onclick="withRegistrationFlagEvent(this);">
										<span></span>Registration With Booking    <h6 class="mb-10" style="margin-top:0px;">Registration Charges Rs. 500/- + Rs. 1500/- per workshop</h6>
									</label>
								</div>
							</div>

							<div class="col-lg-12 col-md-12 col-sm-12" id="bookingDetailsSection">
							    <div class="divider double mb-20 mt-20"></div>
							    <h6 class="mb-20" style="margin-top:0px;">Workshop Booking Details (Rs. 1500/- per workshop)</h6>
							    <div class="divider double mb-20"></div>
								<table class="table table-responsive mb-20">
									<thead>
									    <!--
										<tr>
											<th>Instructor Name</th>
											<th>Day 1 (Morning)</th>
											<th>Day 1 (Evening)</th>
											<th>Day 2 (Morning)</th>
											<th>Day 2 (Evening)</th>
											<th>Day 3 (Morning)</th>
											<th>Day 3 (Evening)</th>
											<th>Total No. Of Seats</th>
											<th>Available No. Of Seats</th>
										</tr>-->
										<tr>
											<th rowspan='2'>Instructor Name</th>
											<th colspan='2'>Day 1</th>
											<th colspan='2'>Day 2</th>
											<th colspan='2'>Day 3</th>
										</tr>
										<tr>
											<th>Morning</th>
											<th>Evening</th>
											<th>Morning</th>
											<th>Evening</th>
											<th>Morning</th>
											<!--<th>Evening</th>-->
										</tr>
									</thead>
									<tbody>
										<?php
											$totalAmount = 0;
											
											for($i=0; $i<count($eventDetailsResult); $i++)
											{
										?>
												<tr>
													<td style="text-align: center;"><p><?php echo $eventDetailsResult[$i]['InstructorName']; ?></p></td>
													
													<?php
    													if($eventDetailsResult[$i]['day1Morning'] == '1')
    													{
    												?>
    												        <td>
                                                    <?php
    													        if($eventDetailsResult[$i]['day1MorningAvailableSeats'] > '0')
    													        {
    												?>
    												                <input type="checkbox" class="" name="chk-day1Morning-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" id="chk-day1Morning-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" onclick="priceCalculatorEvent(this);">
                                                                    <span class="greenSeats">Available Seats : <?php echo $eventDetailsResult[$i]['day1MorningAvailableSeats']; ?></span>
                                                    <?php
        													    }
        													    else
        													    {
    												?>
    												                <span class="redSeats">No Seats Available</span>
    												<?php
        													    }
    												?>
                                                            </td>
                                                    <?php
    													}
    													else
    													{
    													    echo "<td></td>";
    													}
    												?>
    												
    												<?php
    													if($eventDetailsResult[$i]['day1Evening'] == '1')
    													{
    												?>
    												        <td>
                                                    <?php
    													        if($eventDetailsResult[$i]['day1EveningAvailableSeats'] > '0')
    													        {
    												?>
    												                <input type="checkbox" class="" name="chk-day1Evening-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" id="chk-day1Evening-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" onclick="priceCalculatorEvent(this);">
                                                                    <span class="greenSeats">Available Seats : <?php echo $eventDetailsResult[$i]['day1EveningAvailableSeats']; ?></span>
                                                    <?php
        													    }
        													    else
        													    {
    												?>
    												                <span class="redSeats">No Seats Available</span>
    												<?php
        													    }
    												?>
                                                            </td>
                                                    <?php
    													}
    													else
    													{
    													    echo "<td></td>";
    													}
    												?>
    												
    												<?php
    													if($eventDetailsResult[$i]['day2Morning'] == '1')
    													{
    												?>
    												        <td>
                                                    <?php
    													        if($eventDetailsResult[$i]['day2MorningAvailableSeats'] > '0')
    													        {
    												?>
    												                <input type="checkbox" class="" name="chk-day1Evening-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" id="chk-day1Evening-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" onclick="priceCalculatorEvent(this);">
                                                                    <span class="greenSeats">Available Seats : <?php echo $eventDetailsResult[$i]['day2MorningAvailableSeats']; ?></span>
                                                    <?php
        													    }
        													    else
        													    {
    												?>
    												                <span class="redSeats">No Seats Available</span>
    												<?php
        													    }
    												?>
                                                            </td>
                                                    <?php
    													}
    													else
    													{
    													    echo "<td></td>";
    													}
    												?>
    												
    												<?php
    													if($eventDetailsResult[$i]['day2Evening'] == '1')
    													{
    												?>
    												        <td>
                                                    <?php
    													        if($eventDetailsResult[$i]['day2EveningAvailableSeats'] > '0')
    													        {
    												?>
    												                <input type="checkbox" class="" name="chk-day2Evening-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" id="chk-day2Evening-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" onclick="priceCalculatorEvent(this);">
                                                                    <span class="greenSeats">Available Seats : <?php echo $eventDetailsResult[$i]['day2EveningAvailableSeats']; ?></span>
                                                    <?php
        													    }
        													    else
        													    {
    												?>
    												                <span class="redSeats">No Seats Available</span>
    												<?php
        													    }
    												?>
                                                            </td>
                                                    <?php
    													}
    													else
    													{
    													    echo "<td></td>";
    													}
    												?>
    												
    												<?php
    													if($eventDetailsResult[$i]['day3Morning'] == '1')
    													{
    												?>
    												        <td>
                                                    <?php
    													        if($eventDetailsResult[$i]['day3MorningAvailableSeats'] > '0')
    													        {
    												?>
    												                <input type="checkbox" class="" name="chk-day3Morning-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" id="chk-day3Morning-<?php echo $eventDetailsResult[$i]['eventDetailsID']; ?>" onclick="priceCalculatorEvent(this);">
                                                                    <span class="greenSeats">Available Seats : <?php echo $eventDetailsResult[$i]['day3MorningAvailableSeats']; ?></span>
                                                    <?php
        													    }
        													    else
        													    {
    												?>
    												                <span class="redSeats">No Seats Available</span>
    												<?php
        													    }
    												?>
                                                            </td>
                                                    <?php
    													}
    													else
    													{
    													    echo "<td></td>";
    													}
    												?>
    												
													<!--<td><p><?php echo $eventDetailsResult[$i]['day1Morning']; ?></p></td>
													<td><p><?php echo $eventDetailsResult[$i]['day1Evening']; ?></p></td>
													<td><p><?php echo $eventDetailsResult[$i]['day2Morning']; ?></p></td>
													<td><p><?php echo $eventDetailsResult[$i]['day2Evening']; ?></p></td>
													<td><p><?php echo $eventDetailsResult[$i]['day3Morning']; ?></p></td>-->
													<!--
													<td><p><?php echo $eventDetailsResult[$i]['day3Evening']; ?></p></td>
													<td><p><?php echo $eventDetailsResult[$i]['totalNoOfSeats']; ?></p></td>
													<td><p><?php echo $eventDetailsResult[$i]['availableNoOfSeats']; ?></p></td>
													<td><p>Rs. <?php echo $eventDetailsResult[$i]['amount']."/-"; ?></p></td>-->
												</tr>
										<?php
											}
										?>
									</tbody>
								</table>
							</div>
							<div class="col-lg-12 col-md-12 col-sm-12">
								<div class="gray-bg  pl-50 pr-50 pt-30 pb-10 mb-10">
									<table class="mb-20">
										<tbody>
											<tr>
												<th class="pl-20"><h4>GRAND TOTAL : </h4> </th>
												<td class="pl-20"><h4 class="totalPrice">Rs. 500/-</h4></td>
											</tr>
											<tr id='discountedPrice'>
												<th class="pl-20"><h4>DISCOUNTED PRICE : </h4> </th>
												<td class="pl-20"><h4 class="discountedPrice">Rs. 500/-</h4></td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<div class="col-lg-12 col-md-12 col-sm-12">
							    <div class="section-field mb-30">
									<input type="submit" class="button btn-block" value="Book Now">
								</div>
							</div>
						</div>
                    </form>
                </div>
            </section>

			<!--================================= Footer -->
			<footer class="footer page-section-pt">
				<div class="copyright">
					<div class="container">
						<div class="row">
							<div class="col-lg-6 col-sm-6">
								<a href="" style="color:green; font-size:30px;"><img class="img-responsive mb-10" id="logo-footer" src="<?php echo base_url(); ?>assets/images/logo/urbensketcherspune-logo.jpeg" alt="logo" style="height:70px;"><!--Herbal Nector--></a>
								<div class="footer-text">
									<p> ©Copyright <span id="copyright"> <script>document.getElementById('copyright').appendChild(document.createTextNode(new Date().getFullYear()))</script></span> <a href="#">Urban Sketchers Pune</a> All Rights Reserved </p>
								</div>
							</div>
							<div class="col-lg-6 col-sm-6">
								<div class="social-icons color-hover pull-right mt-20">
									<ul class="clearfix"> 
										<li class="social-facebook"><a href="#" target="_BLANK"><i class="fa fa-facebook"></i></a></li>
										<li class="social-twitter"><a href="#" target="_BLANK"><i class="fa fa-twitter"></i></a></li>
										<li class="social-dribbble"><a href="#" target="_BLANK"><i class="fa fa-dribbble"></i> </a></li>
										<li class="social-linkedin"><a href="#" target="_BLANK"><i class="fa fa-linkedin"></i> </a></li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</footer>
			<!--================================= Footer -->
 		</div>
		<div id="back-to-top"><a class="top arrow" href="#top"><i class="fa fa-angle-up"></i> <span>TOP</span></a></div>
		<!--================================= jquery -->
		
		<script>
		    
		    document.getElementById('discountedPrice').style.display = "none";
		    
		    var totalPrice=500;
		    var discountedPrice= 0;
		    
		    function priceCalculatorEvent(myFlag) {
                var withRegistrationFlag = myFlag; alert(myFlag.checked);
                
                if(myFlag.checked)
                {
                    totalPrice = totalPrice + 1500;
                }
                else
                {
                    totalPrice = totalPrice - 1500;
                }
                
                if(totalPrice >= 5000)
                {
                    document.getElementById('discountedPrice').style.display = "";
                    discountedPrice = totalPrice -(totalPrice * 0.10);
                    $("h4.discountedPrice").text("Rs. "+discountedPrice+"/-");
                }
                else
                {
                    document.getElementById('discountedPrice').style.display = "none";
                }
                
                $("h4.totalPrice").text("Rs. "+totalPrice+"/-");
            }
            
            document.getElementById('bookingDetailsSection').style.display = "none";
            
            function withRegistrationFlagEvent(myRadio) {
                var withRegistrationFlag = myRadio.value;
                
                if(withRegistrationFlag == 1)
                {
                    document.getElementById('bookingDetailsSection').style.display = "";
                }
                else
                {
                    document.getElementById('bookingDetailsSection').style.display = "none";
                }
            }  
		</script>
		
		
		<!-- jquery -->
		<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/jquery-1.12.4.min.js"></script>
		<!-- plugins-jquery -->
		<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/plugins-jquery.js"></script>
		<!-- plugin_path -->
		<script type="text/javascript">var plugin_path = '<?php echo base_url(); ?>assets/js/';</script>
		<!-- custom -->
		<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/custom.js"></script>
	</body>
</html>
