<?php
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

$all_category = get_option('awl_portfolio_filter_gallery_categories');
	if(isset($pf_gallery_settings['image-ids'])) {
		$pf_total_images = count($pf_gallery_settings['image-ids']);
	} else {
		$pf_total_images = 0;
	}
	if(isset($pf_gallery_settings['filter-image'])) {
		$filter_image = $pf_gallery_settings['filter-image'];
	} else {
		$filter_image = '';
	}
	
	// collect all selected filters assigned on images
	$all_selected_filters = array();
	foreach ($filters as $filters_key => $filters_value) {
		if(is_array($filters_value)) {
			$all_selected_filters = array_merge($all_selected_filters, $filters_value);
		}
	}
	if($filter_position == 'center') {
		$column = 'col-lg-12 col-md-12 col-xs-12 text-center';
	}
	if($filter_position == 'right') {
		$column = 'col-lg-12 col-md-12 col-xs-12 text-right';
	}
	if($filter_position == 'left') {
		$column = 'col-lg-12 col-md-12 col-xs-12';
	}
	
		if($pfg_filter_style != 'pfg_filter_style4') { ?>
		<div class=" <?php echo $column; ?>" style="padding:0">
			<ul id="all-simplefilter-<?php echo $pf_gallery_id; ?>" class="filtr-control-<?php echo $pf_gallery_id; ?> simplefilter simplefilter_<?php echo $pf_gallery_id; ?>">
				<?php
				if($hide_all_button == 0) {
					if ( $multi_filters == 1 ) { ?>
					<li id="filter-all" class="filtr-controls-<?php echo $pf_gallery_id; ?> filter-active" data-multifilter="all"><?php _e($all_txt, PFG_TXTDM); ?></li>
					<?php } else { ?>
					<li id="all" class="active filtr-controls-<?php echo $pf_gallery_id; ?>" data-filter="all" ><?php _e($all_txt, PFG_TXTDM); ?></li>
					<?php }
				} ?>
			</ul>
			<ul id="f-simplefilter-<?php echo $pf_gallery_id; ?>" class="filtr-control-<?php echo $pf_gallery_id; ?> simplefilter simplefilter_<?php echo $pf_gallery_id; ?>">
				<?php
				if(is_array($all_selected_filters) && count($all_selected_filters)) {
					$all_selected_filters = array_unique($all_selected_filters ); // remove same key
					sort($all_selected_filters);
					foreach ($all_selected_filters as $filter_key) {
						if ( $all_category[$filter_key] != "") {
							if ( $multi_filters == 1 ) { ?>
							<li class="filtr-controls-<?php echo $pf_gallery_id; ?> filter-<?php echo $filter_key; ?> " value="<?php echo $filter_key; ?>" data-multifilter="<?php echo $filter_key; ?>"><?php  _e(stripcslashes($all_category[$filter_key]), PFG_TXTDM); ?></li>
							<?php } else { ?>
							<li id="<?php echo $filter_key ?>" class="filtr-controls-<?php echo $pf_gallery_id; ?>" value="<?php echo $filter_key; ?>" data-filter="<?php echo $filter_key; ?>"><?php  _e(stripcslashes($all_category[$filter_key]), PFG_TXTDM); ?></li>
							<?php }
						}
					}
				} ?>
			</ul>
		</div>
		<?php } else { ?>
		<div class="col-md-2 filter-wrap">
			<div id="filterbox" class="wrapper-dropdown-5" tabindex="1"><span class="fil-head"><?php _e('Filter', PFG_TXTDM); ?></span>
				<ul id="f-simplefilter-<?php echo $pf_gallery_id; ?>" class="filtr-control-<?php echo $pf_gallery_id; ?> dropdown">
				<?php
				$all_category_val = $all_category[0];
				if($hide_all_button == 0) {
					if ( $multi_filters == 1 ) { ?>
					<li id="filter-all" class="filter-active"><?php _e($all_txt, PFG_TXTDM); ?></li>
					<?php } else { ?>
						<li id="all" class="active filtr-controls-<?php echo $pf_gallery_id; ?>" data-filter="all"><?php _e($all_txt, PFG_TXTDM); ?></li>
					<?php }
				}
				if(is_array($all_selected_filters) && count($all_selected_filters)) {
					$all_selected_filters = array_unique($all_selected_filters ); // remove same key
					sort($all_selected_filters);
					foreach ($all_selected_filters as $filter_key) {
						if ( $multi_filters == 1 ) { ?>
						<li class="filter-<?php echo $filter_key; ?>" data-multifilter="<?php echo $filter_key; ?>"><?php  _e($all_category[$filter_key], PFG_TXTDM); ?></li>
						<?php } else { ?>
						<li id="<?php echo $filter_key ?>" class="filtr-controls-<?php echo $pf_gallery_id; ?>" value="<?php echo $filter_key; ?>" data-filter="<?php echo $filter_key; ?>"><?php  _e(stripcslashes($all_category[$filter_key]), PFG_TXTDM); ?></li>
						<?php }
					}
				} ?>
				</ul>
			</div>
		</div>
		<?php } ?>
		<div id ="seacrh_shuffle" class="" style="padding:0">
			<?php
			if($shuffle || $ascending || $descending) { ?>
				<div id="filtersorting" class="wrapper-dropdown-5" tabindex="1"><?php _e('Sort', PFG_TXTDM); ?>
					<ul class="filtr-control-<?php echo $pf_gallery_id; ?> dropdown sortandshuffle sortandshuffle_<?php echo $pf_gallery_id; ?>">
						<?php if($ascending) { ?>
						<li class="filtr-controls-<?php echo $pf_gallery_id; ?> sort-btn sort_btn_<?php echo $pf_gallery_id; ?>  active" data-sortAsc=""><?php if($asc_txt) echo ucwords($asc_txt); else echo 'Asc'; ?></li>
						<?php } ?>
						<?php if($descending) { ?>
						<li class="filtr-controls-<?php echo $pf_gallery_id; ?> sort-btn sort_btn_<?php echo $pf_gallery_id; ?>" data-sortDesc=""><?php if($desc_txt) echo ucwords($desc_txt); else echo 'Desc'; ?></li>
						<?php } ?>
						<?php if($shuffle) { ?>
						<li class="filtr-controls-<?php echo $pf_gallery_id; ?> shuffle-btn shuffle_btn_<?php echo $pf_gallery_id; ?>" data-shuffle=""><?php if($shuffle_txt) echo ucwords($shuffle_txt); else echo 'Shuffle'; ?></li>
						<?php } ?>
					</ul>
				</div>
				<?php 
			} ?>
			<!-- Shuffle & Sort Controls -->
			<?php 
			if($search_box) { ?>
				<input type="text" class="filtr-controls-<?php echo $pf_gallery_id; ?> filtr_search filtr_search_<?php echo $pf_gallery_id; ?>" name="filtr-search" placeholder="<?php if($search_txt) echo ucwords($search_txt); else echo 'Search Images'; ?>" data-search></li>
				<?php 
			} ?>
		</div>
	<!-- progress button -->
	<div class="loader_img pw-loader-wrapper" style="">
		<section class="pf_loader page page--mover">
			<div class="la-square-loader"><div></div></div>
		</section>
	</div>
	<!-- progress-button -->
<script>
	function DropDown(el) {
		this.filtersorting = el;
		this.initEvents();
	}
	DropDown.prototype = {
		initEvents : function() {
			var obj = this;
			obj.filtersorting.on('click', function(event){
				jQuery(this).toggleClass('active');
				event.stopPropagation();
			});
		}
	}
	jQuery(function() {
		var filtersorting = new DropDown(jQuery('#filtersorting') );
		jQuery(document).click(function() {
			// all dropdowns
			jQuery('.wrapper-dropdown-5').removeClass('active');
		});
	});
	jQuery(function() {
		var filterbox = new DropDown(jQuery('#filterbox') );
		jQuery(document).click(function() {
			// all dropdowns
			jQuery('.wrapper-dropdown-5').removeClass('active');
		});
	});
	jQuery('[data-filter]').click(function() {
		var targetFilterhtml = jQuery(this).html();
		//console.log(targetFilter);
		jQuery('.fil-head').text(targetFilterhtml);
	});
</script>