<div class="page-margin">
	<div class="wo_main_jobs">
		<h3><?php echo $wo['lang']['jobs'] ?></h3>
		<div class="wo_jobs_search">
			<form action="">
				<div class="form-group">
					<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5" /></svg>
					<input type="text" class="form-control" onkeyup="Wo_SearchJobs(this.value)" placeholder="<?php echo $wo['lang']['search_for_jobs']; ?>" id="product-text">
				</div>
			</form>
		</div> 
	</div>
	<div class="row">
		<div class="col-md-3">
			<?php if ($wo['loggedin'] == true) { ?>
				<?php if ($wo['config']['nearby_business_system'] == 1) { ?>
			<a href="<?php echo($wo['config']['site_url'].'/nearby_business') ?>" data-ajax="?link1=nearby_business" class="btn btn-main btn-block side_mkt_btn"><?php echo $wo['lang']['nearby_business'] ?></a>
			<br>
			<?php } ?>
			<?php } ?>
			<div class="wo_job_main_widget">
				<div class="m_widget_head"><?php echo $wo['lang']['location_dist'];?></div>
				<div class="select-nearby-users-distance wo_select_job_dist">
					<form>
						<input type="range" class="cusrange" id="nearby-users-distance" name="amountRange" onchange="Wo_SearchJobsNearBy();" value="0" min="0" max="300" oninput="this.form.amountInput.value=this.value">
						<input type="number" name="amountInput" min="0" max="400" value="0" oninput="this.form.amountRange.value=this.value" readonly id="cusrange-reader"/> km
					</form>
				</div>
			</div>
			<div class="wo_job_main_widget">
				<div class="m_widget_head"><?php echo $wo['lang']['job_type'];?></div>
				<div class="wjob_categories">
					<ul class="product-category-slider">
						<?php 
						$job_type = array('full_time','part_time','internship','volunteer','contract');
						    $category_id = (!empty($_GET['c_id'])) ? (int) $_GET['c_id'] : 0;
							$type = (!empty($_GET['type'])) ? $_GET['type'] : '';
							foreach ($job_type as $key => $category) {
								$active = ($type == $category) ? 'active' : '';
						?>
							<li class="<?php echo $active?>" data_prodect_type_id="<?php echo($category) ?>"><a href="<?php echo Wo_SeoLink('index.php?link1=jobs');?>?c_id=<?php echo($category_id) ?>&type=<?php echo($category) ?>"><?php echo $wo['lang'][$category];?></a></li>
						<?php } ?>
					</ul>
				</div>
			</div>
			<div class="wo_job_main_widget">
				<div class="m_widget_head"><?php echo $wo['lang']['categories'];?></div>
				<div class="wjob_categories">
					<ul class="product-category-slider">
						<?php 
							$category_id = (!empty($_GET['c_id'])) ? (int) $_GET['c_id'] : 0;
							$type = (!empty($_GET['type'])) ? $_GET['type'] : '';
							foreach ($wo['job_categories'] as $key => $category) {
								$active = ($category_id == $key) ? 'active' : '';
						?>
							<li class="<?php echo $active?>"><a href="<?php echo Wo_SeoLink('index.php?link1=jobs');?>?c_id=<?php echo($key) ?>&type=<?php echo($type) ?>"><?php echo $category;?></a></li>
						<?php } ?>
					</ul>
				</div>
			</div>
		</div>
		
		<div class="col-md-9">
			<div class="latest-products">
				<?php
					$category_name = '';
				$data = array();
				if (!empty($_GET['c_id'])) {
					if (is_numeric($_GET['c_id'])) {
						if (array_key_exists($_GET['c_id'], $wo['job_categories'])) {
							?>
							<input type="hidden" value="<?php echo Wo_Secure($_GET['c_id']); ?>" id="c_id" />
							<?php
							$category_name = $wo['job_categories'][$_GET['c_id']];
							$data['c_id'] = Wo_Secure($_GET['c_id']);
						}
					}
				} else {
					echo '<input type="hidden" value="0" id="c_id" />';
				}

				if (!empty($_GET['type'])) {
						if (in_array($_GET['type'], $job_type)) {
							?>
							<input type="hidden" value="<?php echo Wo_Secure($_GET['type']); ?>" id="job_type" />
							<?php
							$data['type'] = Wo_Secure($_GET['type']);
						}
				} else {
					echo '<input type="hidden" value="" id="job_type" />';
				}
				?>
				<div class="market_bottom">
					<?php
						$data['limit'] = 10;
						$jobs = Wo_GetAllJobs($data);
						if (count($jobs) > 0) {
					?>
					<div id="products">
						<?php
						foreach ($jobs as $key => $wo['job']) {
							echo Wo_LoadPage('jobs/jobs_list'); 
						}
						} else {
							echo '<h5 class="search-filter-center-text empty_state"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-briefcase"><rect x="2" y="7" width="20" height="14" rx="2" ry="2"></rect><path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"></path></svg> ' . $wo['lang']['no_available_jobs'] . '</h5>';
						}
						?>
					</div>
				</div>
			</div> 	
			<div class="posts_load load-produts">
			    <?php if (count($jobs) > 0): ?>
				<div class="load-more">
                    <button class="btn btn-default text-center wo_load_more" onclick="Wo_LoadJobs();">
						<span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></path></svg></span> <?php echo $wo['lang']['load_more_jobs'] ?>
					</button>
                </div>
                <?php endif ?>
			</div>
		<div class="clear"></div>

	</div>
	<div class="clear"></div>
		<br>		
           <?php echo Wo_LoadPage('footer/content'); ?>
</div>
<div class="modal fade" id="delete-job-modal" role="dialog">
	<div class="modal-dialog modal-md">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></span></button>
				<h4 class="modal-title"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg> <?php echo $wo['lang']['delete_job']; ?></h4>
			</div>
			<div class="modal-body">
				<p><?php echo $wo['lang']['confirm_delete_job']; ?></p>
				<input type="hidden" id="delet_job_id">
			</div>
			<div class="modal-footer">
				<div class="ball-pulse"><div></div><div></div><div></div></div>
				<button id="delete-all-post" type="button" onclick="Wo_DeleteJob();" class="btn btn-main"><?php echo $wo['lang']['delete']; ?></button>
			</div>
		</div>
	</div>
</div>
<script>
	function Wo_OpenJobDeleteBox(job_id) {
  $('#delet_job_id').val(job_id);
  var delete_box = $('#delete-job-modal');
  delete_box.modal({
    show: true
  });
}
function Wo_DeleteJob() {
  Wo_CloseLightbox();
  var job_id = $('#delet_job_id').val();
  var delete_box = $('#delete-job-modal');
  $('#delete-job-modal').find('.ball-pulse').fadeIn(100);
  $.get(Wo_Ajax_Requests_File(), {
    f: 'job',
    s: 'delete_job',
    job_id: job_id
  }, function (data) {
    if(data.status == 200) {
      delete_box.modal('hide');
      setTimeout(function () {
        $('#product-' + job_id).slideUp(200, function () {
          $(this).remove();
        });
      }, 300);
    }
    $('#delete-job-modal').find('.ball-pulse').fadeOut(100);
  });
}
function Wo_SearchJobsNearBy() {
	length = $('#cusrange-reader').val();
	text_value = $('#job-text').val();
	var c_id = 0;
	if ($('#c_id').length > 0) {
		c_id = $('#c_id').val();
	}
	var type = '';
	if ($('#job_type').length > 0) {
		type = $('#job_type').val();
	}
	$.post(Wo_Ajax_Requests_File() + '?f=job&s=search_jobs', {value: text_value, c_id:c_id,type:type, length: length}, function (data) {
		if (data.status == 200) {
			if (data.html.length > 0) {
				$('#products').html(data.html);
			} else {
				$('#products').html('<?php echo $wo['lang']['no_available_jobs'] ?>');
			}
		}
	});
}
function Wo_LoadJobs() {
	$('.load-produts').html('<div class="white-loading list-group"><div class="cs-loader"><div class="cs-loader-inner"><label> ●</label><label> ●</label><label> ●</label><label> ●</label><label> ●</label><label> ●</label></div></div></div>');
	var $c_id = $('#c_id').val();
	var text = $('#job-text').val();
	var $last_id = $('.product:last').attr('data-id');
	var price = $('.product:last').attr('data_price');
	var length = $('#distance_val').text();
	var price_sort = $('#PriceSortValue').attr('data_PriceSortType');
	var type = '';
	if ($('#job_type').length > 0) {
		type = $('#job_type').val();
	}
	$.post(Wo_Ajax_Requests_File() + '?f=job&s=search_jobs', {last_id: $last_id, c_id:$c_id,type:type, length: length,price_sort:price_sort,price:price,text:text}, function (data) {
		if (data.status == 200) {
			if (data.html.length > 0) {
				$('.load-produts').html('<div class="load-more"><button class="btn btn-default text-center pointer" onclick="Wo_LoadJobs();"><i class="fa fa-arrow-down progress-icon" data-icon="arrow-down"></i> <?php echo $wo['lang']['load_more_products'] ?></button></div>');
				$('#products').append(data.html);
			} else {
				$('.load-produts').html('<div class="load-more"><button class="btn btn-default text-center pointer" onclick="Wo_LoadJobs();"><?php echo $wo['lang']['no_available_jobs'] ?></button></div>');
			}
		}
	});
}
function Wo_SearchJobs(value) {
	length = $('#distance_val').text();
	var price_sort = $('#PriceSortValue').attr('data_PriceSortType');
	var c_id = 0;
	if ($('#c_id').length > 0) {
		c_id = $('#c_id').val();
	}
	var type = '';
	if ($('#job_type').length > 0) {
		type = $('#job_type').val();
	}
	$.post(Wo_Ajax_Requests_File() + '?f=job&s=search_jobs', {value: value, c_id:c_id,type:type, length: length,price_sort:price_sort}, function (data) {
		if (data.status == 200) {
			if (data.html.length > 0) {
				$('#products').html(data.html);
			} else {
				$('#products').html('<?php echo $wo['lang']['no_available_jobs'] ?>');
			}
		}
	});
}
</script>