<div class="section coupons-area coupons-area-grid">

	<header class="page-control panel ptb-15 prl-20 pos-r mb-30">

		<!-- List Control View -->
		<ul class="list-control-view list-inline">
			<li><a href="#" id="coupon_list_view"><i class="fa fa-bars"></i></a>
			</li>
			<li><a href="#" id="coupon_grid_view"><i class="fa fa-th"></i></a>
			</li>
		</ul>
		<!-- End List Control View -->
	</header>
	<div class="row row-masnory row-tb-20">
		<?php 

		$count = 0; ?>
		<?php if (have_posts()) : while (have_posts()) : the_post();	?>
		<?php
		$out = ''; 
		$blog_thumbnail= wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "froday-portfolio-thumb" );
		$blog_image= wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "full" );				 
		$image = froday_resize( $blog_image[0], 457, 393, true, true, true );
		
		$expiry_date = get_post_meta( get_the_ID(), 'expiry_date', true );
		$coupon_amount = get_post_meta( get_the_ID(), 'coupon_amount', true );
		$destination_url = get_post_meta( get_the_ID(), 'klb_coupon_destination_url', true );
		
		$out .= '<div class="klb-coupon-item col-sm-6 col-md-3 pdtop-20 pdbtm-20">';
		$out .= '<div class="coupon-single panel t-center">';
		$out .= '<div class="row">';
		$out .= '<div class="col-xs-12">';
		$out .= '<div class="text-center p-20">';
		$out .= '<img class="store-logo" src="'.esc_url($blog_thumbnail[0]).'" alt="'.esc_attr__('storelogo','froday').'">';
		$out .= '</div>';
		$out .= '</div>';

		$out .= '<div class="col-xs-12">';
		$out .= '<div class="panel-body">';
		$out .= '<ul class="deal-meta list-inline mb-10">';
		$out .= froday_location_name();
		$out .= '<li class="color-muted"><i class="ico lnr lnr-store mr-5"></i>'.froday_store_title().'</li>';
		$out .= '</ul>';
		$out .= '<h4 class="color-green mb-10 t-uppercase">'.$coupon_amount.'% OFF</h4>';
		$out .= '<h5 class="deal-title mb-10">';
		$out .= '<a href="#">'.get_the_excerpt().'</a>';
		$out .= '</h5>';
		if($expiry_date){
		$out .= '<p class="mb-15 color-muted mb-20 font-12"><i class="lnr lnr-clock mr-10"></i>'.esc_html__('Expires On','froday').' '.$expiry_date.'</p>';
		}
		$out .= '<div class="showcode">';
		$out .= '<button class="show-code btn btn-sm btn-block" data-toggle="modal" data-target="#'.get_the_title().'">'.esc_html__('Get Coupon Code','froday').'</button>';
		$out .= '<div class="coupon-hide">'.get_the_title().'</div>';
		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>';

		$titleid = get_the_title();

		$strid = str_replace("-","",$titleid);

?>

<script>
function frodayCopy_<?php echo esc_html($count); ?>() {
  var copyText = document.getElementById("<?php echo esc_attr($strid); ?><?php echo esc_html($count); ?>");
  copyText.select();
  document.execCommand("copy");
  <?php if($destination_url){ ?>
	window.open('<?php echo esc_url($destination_url); ?>','_blank');
  <?php } ?>
}
</script>

<?php
		$out .= '<div class="modal fade get-coupon-area" tabindex="-1" role="dialog" id="'.get_the_title().'">';
		$out .= '<div class="modal-dialog">';
		$out .= '<div class="modal-content panel">';
		$out .= '<div class="modal-body">';
		$out .= '<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>';
		$out .= '<div class="row row-v-10">';
		$out .= '<div class="col-md-10 col-md-offset-1">';
		$out .= froday_store_thumbnail();
		$out .= '<h3 class="mb-20">'.get_the_excerpt().'</h3>';
		$out .= get_the_content();
		$out .= '</div>';
		$out .= '<div class="col-md-10 col-md-offset-1">';
		$out .= '<h6 class="color-mid t-uppercase">'.esc_html__('Click below to get your coupon code','froday').'</h6>';

		$out .= '<div class="copy-coupon-wrap">';
		$out .= '<input type="text" value="'.get_the_title().'" id="'.esc_attr($strid).esc_attr($count).'" class="coupon-code">
		<button onclick="frodayCopy_'.$count.'()">'.esc_html__('Copy text','froday').'</button>';
		$out .= '</div>';

		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>';
		$out .= '<div class="modal-footer footer-info t-center ptb-40 prl-30">';
		$out .= '<h4 class="mb-15">'.esc_html(ot_get_option('froday_coupon_subscribe_title')).'</h4>';
		$out .= '<p class="color-mid mb-20">'.esc_html(ot_get_option('froday_coupon_subscribe_subtitle')).'</p>';
		$out .= do_shortcode('[mc4wp_form id="'.ot_get_option('froday_coupon_subscribe_form_id').'"]');
		
		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>';
		$out .= '</div>'; 
		
		$out_escaped = $out;
		echo $out_escaped;
		$count++;
		?>
		<?php endwhile; ?>
		<div class="col-md-12">
			<?php get_template_part( 'post-format/pagination' ); ?>
		</div>
		<?php else : ?>
		<div class="col-md-12">
			<h2><?php esc_html_e('No Coupon Found', 'froday') ?></h2>
		</div>
		<?php endif; ?>
	</div>
</div>