<?php

$slect_styledata = get_post_meta($post->ID, "slect_styledata", true) ? get_post_meta($post->ID, "slect_styledata", true): ' ';
$slect_styleanimation = get_post_meta($post->ID, "slect_styleanimation", true) ? get_post_meta($post->ID, "slect_styleanimation", true): ' ';
$slect_prot_erp_rw = get_post_meta($post->ID, "slect_prot_erp_rw", true) ? get_post_meta($post->ID, "slect_prot_erp_rw", true): 'col-2';
$slect_butondata = get_post_meta($post->ID, "slect_butondata", true) ? get_post_meta($post->ID, "slect_butondata", true): ' ';
$el_fi_gridbg = get_post_meta($post->ID, "el_fi_gridbg", true) ? get_post_meta($post->ID, "el_fi_gridbg", true): ' ';
$el_fi_gridbg_2 = get_post_meta($post->ID, "el_fi_gridbg_2", true);
$fancyMetabtn_align = get_post_meta($post->ID, "fancyMetabtn_align", true) ? get_post_meta($post->ID, "fancyMetabtn_align", true): 'left';


$fancy_metabtn_ac_bg = get_post_meta($post->ID, "fancy_metabtn_ac_bg", true);



$fancy_metabtn_bg = get_post_meta($post->ID, "fancy_metabtn_bg", true) ? get_post_meta($post->ID, "fancy_metabtn_bg", true): '#81d742';

$fancy_metabtn_clor = get_post_meta($post->ID, "fancy_metabtn_clor", true) ? get_post_meta($post->ID, "fancy_metabtn_clor", true): '#2d2d2d';



$facncy_portfolios = get_terms(array (
   'taxonomy'     => 'fl_portfolio',
   'hide_empty'   => true,
   'orderby'      => 'none',
));

   if ($facncy_portfolios)
   {

    $html .= '<li class="mtfgfancy ksfjdutry"><p class="metaitem_title"><label for="facncy_portfolios">Choose Portfolio Categories: </label></p></li><li  class="mtfgfancy_select"><select id="facncy_portfolios"  name="facncy_portfolios[]" multiple="multiple" class="yoo_display_option">';
    foreach ($facncy_portfolios as $el_category)
    {
        $selected = (is_array($appended_posts) && in_array($el_category->term_id, $appended_posts)) ? ' selected="selected"' : '';
        $html .= '<option value="' . $el_category->term_id . '" ' . $selected . '>' .$el_category->name. '</option>';
    }
    $html .= '</select></li>';

    $html .= '<li  class="mtfgfancy_selectsd"><label class="fancymetagrid"> Choose Grid Style</label>

  <select class="item_slct"  name="slect_styledata">
     <option value="st-free" ' . selected('st-free', $slect_styledata, false) . '>'.esc_html('Free Style', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style One (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Two (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Three (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Four (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Five (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Six (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Seven (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Eight (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Nine (Pro)', 'fancy-fiter').'</option>
     <option class="prodataver">'.esc_html('Style Ten (Pro)', 'fancy-fiter').'</option>
  </select></li>
  <li  class="mtfgfancy_selectsd"><label class="fancymetagrid"> Animation Effects</label><select class="item_slct" name="slect_styleanimation" id="id_free_method" >

  <option value="fancyfilter_pro-free-item--eff1" ' . selected('fancyfilter_pro-free-item--eff1', $slect_styleanimation, false) . '>'.esc_html('Effect 1', 'fancy-fiter').'</option>  
  <option value="fancyfilter_pro-free-item--eff2" ' . selected('fancyfilter_pro-free-item--eff2', $slect_styleanimation, false) . '>'.esc_html('Effect 2', 'fancy-fiter').'</option>  
  <option value="fancyfilter_pro-free-item--eff3" ' . selected('fancyfilter_pro-free-item--eff3', $slect_styleanimation, false) . '>'.esc_html('Effect 3', 'fancy-fiter').'</option>  
  <option value="fancyfilter_pro-free-item--eff4" ' . selected('fancyfilter_pro-free-item--eff4', $slect_styleanimation, false) . '>'.esc_html('Effect 4', 'fancy-fiter').'</option>  </select></li>
  <li   class="mtfgfancy_selectsd"><label class="fancymetagrid">Background One</label>
  <input type="text" name="el_fi_gridbg" value="'.$el_fi_gridbg.'" class="fancyfilter_color" data-alpha-enabled="true">
  </li><li  class="mtfgfancy_selectsd">
  <label class="fancymetagrid">Background Two(For Gradient)</label>
  <input type="text" name="el_fi_gridbg_2" value="'.$el_fi_gridbg_2.'" class="fancyfilter_color" data-alpha-enabled="true" >
    <div><em>Not Applicable for Grid Style 4</em></div>
  </li> ' ;

    $html .= '<li  class="mtfgfancy_selectsd"><label class="fancymetagrid"> Column Per Row</label>

  <select class="item_slct"  name="slect_prot_erp_rw">
     <option value="col-1" ' . selected('col-1', $slect_prot_erp_rw, false) . '>'.esc_html('Two Column', 'fancy-fiter').'</option>
     <option value="col-2"  ' . selected('col-2', $slect_prot_erp_rw, false) . '>'.esc_html('Three Column', 'fancy-fiter').'</option>
     <option value="col-3"  ' . selected('col-3', $slect_prot_erp_rw, false) . '>'.esc_html('Four Column', 'fancy-fiter').'</option>
  </select></li>' ;
  $html .= '<li  class="mtfgfancy_selectsd"><label class="fancymetagrid">Choose Filter Button Style</label>
  <select  name="slect_butondata" id="id_application_method">
     <option value="btnsyle-no" ' . selected('btnsyle-no', $slect_butondata, false) . '>'.esc_html('None', 'fancy-fiter').'</option>
     <option value="btnsyle-1" ' . selected('btnsyle-1', $slect_butondata, false) . '>'.esc_html('Style 1 ', 'fancy-fiter').'</option>
     <option value="btnsyle-2" ' . selected('btnsyle-2', $slect_butondata, false) . '>'.esc_html('Style 2 ', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 3 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 4 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 5 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 6 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 7 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 8 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 9 (Pro)', 'fancy-fiter').'</option>
      <    
      <option class="prodataver">'.esc_html('Style 10 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 11 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 12 (Pro)', 'fancy-fiter').'</option>
      <option class="prodataver">'.esc_html('Style 13 (Pro)', 'fancy-fiter').'</option>
     </select></li>
  <li  class="mtfgfancy_selectsd">
  <label class="fancymetagrid">Button Align</label>
  <select  name="fancyMetabtn_align"  class="item_slct" >
     <option value="left" ' . selected('left', $fancyMetabtn_align, false) . '>'.esc_html('Left', 'fancy-fiter').'</option>
     <option value="center" ' . selected('center', $fancyMetabtn_align, false) . '>'.esc_html('Center', 'fancy-fiter').'</option>
     <option value="right" ' . selected('right', $fancyMetabtn_align, false) . '>'.esc_html('Right', 'fancy-fiter').'</option>
  </select></li>

  </li><li   class="mtfgfancy_selectsd">
  <label class="fancymetagrid">Button Label Color</label>
  <input type="text" name="fancy_metabtn_clor" value="'.$fancy_metabtn_clor.'" class="fancyfilter_color" data-alpha-enabled="true">
  </li>
    <li   class="mtfgfancy_selectsd">
    <label class="fancymetagrid">Button Background</label>
    <input type="text" name="fancy_metabtn_ac_bg" value="'.$fancy_metabtn_ac_bg.'" class="fancyfilter_color" data-alpha-enabled="true">
    <div><em>Applies only to button styles 3,4,6,8,10,13</em></div>
    </li>
  <li   class="mtfgfancy_selectsd">
  <label class="fancymetagrid">Active Color</label>
  <input type="text" name="fancy_metabtn_bg" value="'.$fancy_metabtn_bg.'" class="fancyfilter_color" data-alpha-enabled="true">
  </li>


  ';
}
else{
    
    echo "Please create an item by attaching a category first <a href='".esc_url(admin_url('/'))."edit.php?post_type=fancyfilter'>Click here</a>";

}
   

$html .= '</ul>';

 $allowed_html = array(
    'ul' => array(
        'id'    => array(),
        'class'    => array(),
        'style'    => array(),

    ),
    'li' => array(
        'id'    => array(),
        'class'    => array(),
        'style'    => array(),
    ),
    'label' => array(
        'id'    => array(),
        'class'    => array(),
        'for'    => array(),
    ),
    'input' => array(
        'type'  => array(),
        'id'    => array(),
        'class'    => array(),
        'name'  => array(),
        'value' => array(),
        'checked'  => array(), 
     ),
    'select' => array(
        'class'    => array(),
        'id'    => array(),
        'name'  => array(),
        'multiple'  => array(),

     ),
        'option'  => array(
        'value' => array(),
        'class'    => array(),
        'id'    => array(),
        'selected'  => array(),        
        ),
        'div'  => array(
        'class'    => array(),
        'id'    => array(),
        'style'    => array(),
        ),
        'strong'  => array(
        'class'    => array(),
        'id'    => array(),
        ),
        'table'  => array(
        'class'    => array(),
        'id'    => array(),
        ),
        'tr'  => array(
        'class'    => array(),
        'id'    => array(),
        ),
        'tbody'  => array(
        'class'    => array(),
        'id'    => array(),
        ),
        'th'  => array(
        'class'    => array(),
        'id'    => array(),
        ),
        'td'  => array(
        'class'    => array(),
        'id'    => array(),
        ),
        'span' => array(
        'id'    => array(),
        'class'    => array(),
        'style'    => array(),
    ),
        'em' => array(
        'id'    => array(),
        'class'    => array(),
        'style'    => array(),
    ),
);



echo wp_kses($html,$allowed_html );

if (!empty($appended_posts))
{

echo '<div class="shortcode_display">
        <h4>Shortcode</h4>
        <em><p>To display the frontend, copy the code below and paste it in the desired location</p></em>
        <p class="dynashorcde">
        [fancyfilter_portfolio id ="'.esc_attr($post->ID).'" grid_style = "'. esc_attr($slect_styledata).'" button="'.esc_attr($slect_butondata).'" col_1="'.esc_attr($el_fi_gridbg).'" col_2="'.esc_attr($el_fi_gridbg_2).'" align="'.esc_attr($fancyMetabtn_align).'" btn_act="'.esc_attr($fancy_metabtn_bg).'" btnclr="'.esc_attr($fancy_metabtn_clor).'" btnbg="'.esc_attr($fancy_metabtn_ac_bg).'" layout="'.esc_attr($slect_prot_erp_rw).'" animation="'.esc_attr($slect_styleanimation).'"]
        </p></div>';

}