<?php
if (isset($message)) {
	echo '<div class="alert alert-success" role="alert">' . $message . '</div>';
}
if (isset($err_message)) {
	echo '<div class="alert alert-danger" role="alert">' . $err_message . '</div>';
}
?>
<form id="course_permission_form" method="post">
	<div class="row">
		<div class="col-md-12">
			<div class="col-md-4">
				<div class="box box-primary">
					<div class="box-header">
						<h3 class="box-title">Select Files</h3>
					</div>
					<div class="box-body">
						<!--------------->
						<div class="form-group">
							<label for="users">Tags</label>
							<select required class="form-control" multiple id="groups" name="groups">
								<option value="0" selected disabled>--select-tag--</option>
								<?php
								foreach ($groups as $group) {
									echo '<option value="' . $group->id . '">' . $group->tag . '</option>';
								}
								?>
							</select>
						</div>
						<!--------------->
						<div class="form-group">
							<label for="users">Users</label>
							<select required class="form-control" id="users" name="users[]" multiple="multiple">
								<!-- <option value="">--select-user--</option> -->
								<?php
								foreach ($client as $clnt) {
									echo '<option value="' . $clnt->id . '">' . $clnt->id . ' - ' . $clnt->username . '</option>';
								}
								?>
							</select>
						</div>
						<div class="form-group">
							<label for="course">Course</label>
							<select required class="form-control" id="course" name="course">
								<option value="">--select-course--</option>
								<?php
								foreach ($course as $cs) {
									echo '<option value="' . $cs->id . '">' . $cs->course . '</option>';
								}
								?>
							</select>
						</div>
						<div class="form-group">
							<label for="chapter">Start Date</label>
							<input type="datetime-local" value="<?php echo date('Y-m-d\TH:i'); ?>" class="form-control" name="str_dt" required placeholder="Start Date" />
						</div>
						<div class="form-group">
							<label for="chapter">End Date</label>
							<input type="datetime-local" class="form-control" name="end_dt" required placeholder="End Date" />
						</div>

						<div class="form-group">
							<label for="">Video Playback Type</label><br>
							<div class="form-check">
								<input id="offline" class="form-check-input text-bold" value="offline" name="permission_type" type="radio" checked="">
								<label for="offline" class="form-check-label">&nbsp;Offline</label>
							</div>
							<div class="form-check">
								<input id="online" class="form-check-input text-bold" value="online" name="permission_type" type="radio">
								<label for="online" class="form-check-label">&nbsp;Online</label>
							</div>
							<div class="form-check">
								<input id="both" class="form-check-input text-bold" value="both" name="permission_type" type="radio">
								<label for="both" class="form-check-label">&nbsp;Both</label>
							</div>
						</div>

						<div class="form-group">
							<label for="chapter">No.Of_Play</label>
							<input type="number" value="1" class="form-control" name="noofplay" required placeholder="no of play" />
						</div>
					</div>
				</div>
			</div>
			<div class="col-md-8">
				<div class="box box-primary">
					<div class="box-header">
						<h3 class="box-title">Select Files</h3>
					</div>
					<div style="overflow: scroll; height: 537px;" class="box-body">
						<table style=" overflow: auto;" id="example" class="table table-hover table-bordered table-responsive record_table">
							<thead>
								<tr class="info">
									<th><input type="checkbox" id="selecctall" /></th>
									<th>ID</th>
									<th>File</th>
									<th>Name</th>
									<th>Type</th>
								</tr>
							</thead>
							<tbody id="tbl_lecture">
							</tbody>
						</table>
					</div>
				</div>
			</div>
			<!-- Action -->
			<div class="col-md-12">
				<div class="box box-primary">
					<div class="box-header">
						<h3 class="box-title">Actions</h3>
					</div>
					<div class="box-body">
						<button id="regfilebtn" class="btn btn-primary">Register Files</button>
					</div>
				</div>
			</div>
			<!-- End Action-->
		</div>
	</div>
</form>

<!-- Script -->
<script type="text/javascript">
	$(document).ready(function() {

		// course_permission_form Submit
		$("#course_permission_form").submit(function(e) {


			e.preventDefault();
			$.ajax({
				url: "<?php echo base_url(); ?>admin/regfile/course",
				type: 'post',
				data: $("#course_permission_form").serialize(),
				datatype: "html",
				async: true,
				beforeSend: function() {
					$('#response').fadeIn(100);
					$('#regfilebtn').prop('disabled', true);
				},
				success: function(data) {
					$('#response').fadeOut(100);
					$('#regfilebtn').prop('disabled', false);
					window.location = "<?php echo base_url() ?>admin/regfile/course";
				}
			});

		});

		$('#example tbody').on('click', 'tr', function() {
			if (event.target.type !== 'checkbox') {
				$(':checkbox', this).trigger('click');
				//$(this).toggleClass('danger');
			}
		});

		$('#example tbody').on('click', 'input', function() {
			var id = $(this).val();
			$('#tr' + id).toggleClass('danger');
		});

		$('body').on('click', '#selecctall', function() {
			//on click 
			if (this.checked) { // check select status
				$('.checkbox1').each(function() { //loop through each checkbox
					this.checked = true;
					$('#example tbody tr').addClass('danger'); //select all checkboxes with class "checkbox1"               
				});
			} else {
				$('.checkbox1').each(function() { //loop through each checkbox
					this.checked = false;
					$('#example tbody tr').removeClass('danger'); //deselect all checkboxes with class "checkbox1"                       
				});
			}
		});

		$('body').on('change', '#groups', function() {
			$.ajax({
				type: "POST",
				url: "<?php echo base_url('admin/regfile/get_group_users'); ?>",
				datatype: "html",
				beforeSend: function() {
					$('#response').fadeIn(100);
				},
				data: {
					group_id: $(this).val()
				},
				success: function(data) {
					$('#response').fadeOut(100);
					$('#users').empty();
					$('#users').append(data);
				}
			});
		});

		$('body').on('change', '#course', function() {
			$.ajax({
				type: "POST",
				url: "<?php echo base_url('admin/regfile/get_course_video'); ?>",
				datatype: "html",
				beforeSend: function() {
					$('#response').fadeIn(100);
				},
				data: {
					course_id: $(this).val()
				},
				success: function(data) {
					$('#response').fadeOut(100);
					$('#tbl_lecture').empty();
					$('#tbl_lecture').append(data);
				}
			});
		});

		$('body').on('change', '#subject', function() {
			$.ajax({
				type: "POST",
				url: "<?php echo base_url('admin/regfile/get_chapter'); ?>",
				datatype: "html",
				beforeSend: function() {
					$('#response').fadeIn(100);
				},
				data: {
					subject_id: $(this).val()
				},
				success: function(data) {
					$('#response').fadeOut(100);
					$('#chapter').empty();
					$('#chapter').append('<option  value="">--select-chapter--</option>');
					$('#chapter').append(data);
				}
			});
		});

		$('body').on('change', '#chapter', function() {
			$.ajax({
				type: "POST",
				url: "<?php echo base_url('admin/regfile/get_lecture'); ?>",
				datatype: "html",
				beforeSend: function() {
					$('#response').fadeIn(100);
				},
				data: {
					chapter_id: $(this).val()
				},
				success: function(data) {
					$('#response').fadeOut(100);
					$('#tbl_lecture').empty();
					$('#tbl_lecture').append(data);
				}
			});
		});

		$('body').on('change', '#chapter', function() {
			var str = $("#subject option:selected").text() + '_' + $("#chapter option:selected").text();
			$('#file_name').val(str.replace(/\s+/g, ''));
		});

		$('#upload_form').submit(function() {
			$('#response').fadeIn(100);
			return true;
		});
	});
</script>