<?php
 class Petcare_Tabular_Food_Menu_Widget extends WP_Widget{
   public function __construct(){
     global $petcare_plugin_name;
   parent::__construct(  'kaya-simple-food-menu',
      __('Petcare -  Tabular Menu (PB)',$petcare_plugin_name),
      array( 'description' => __('Add food menu items with price in table format',$petcare_plugin_name), 'class' => 'kaya_food_menu_widget' )
    );
    }
    public function widget( $args , $instance ){
       global $petcare_plugin_name;
        $instance = wp_parse_args($instance, array(

          'list_box' => '',
          'items_list_box' => '
 <ul>&lt;br&gt;
<li><span>Pet Item - 1</span><span>$20</span></li>&lt;br&gt;
<li><span>Pet Item - 2</span><span>$10</span></li>&lt;br&gt;
<li><span>Pet Item - 3</span><span>$40</span></li>&lt;br&gt;
</ul>',
           'items_list_box_text_color' => '#ffffff',
          'items_list_box_bg_color' => '#333',
          'animation_names' => '',

             )); 
        $rand = rand(1,100);
             ?>
      <style type="text/css">
        .items_list_box<?php echo $rand; ?> ul li{
          color: <?php echo $instance['items_list_box_text_color']; ?>!important;
          background-color: <?php echo $instance['items_list_box_bg_color']; ?>!important;
        }
      </style>
  <?php echo $args['before_widget']; ?>
  <?php 
      $pricing_list_animation = (trim($instance['animation_names'])) ? 'wow '.$instance['animation_names'].' ' : '';
      echo '<div class="'.$pricing_list_animation.'">';

      ?>
  <div class="clear"> </div>
  <?php  
         echo '<div class="items_list_box items_list_box'.$rand.'">';
            echo $instance['items_list_box'];
         echo '</div>';
         echo '</div>';
         echo $args['after_widget'];
    }

    public function form( $instance ){
    global $petcare_plugin_name;  
       $instance = wp_parse_args( $instance, array(

          'list_box' => '',
          'items_list_box_text_color' => '#ffffff',
          'items_list_box_bg_color' => '#333',
          'items_list_box' => __('<ul><li><span>Food Item - 1</span><span>$20</span></li><li><span>Food Item - 2</span><span>$10</span></li><li><span>Food Item - 3</span><span>$40</span></li></ul>',$petcare_plugin_name),
          'animation_names' => '',
        ) );
      ?>
       <script type='text/javascript'>
    jQuery(document).ready(function($) {
      jQuery('.pricinglist_color_pickr').each(function(){
        jQuery(this).wpColorPicker();
      }); 
    });
  </script> 
<div class="input-elements-wrapper">
  <p>
    <label for="<?php echo $this->get_field_id('items_list_box') ?>"> <?php _e('Menu Items List Box',$petcare_plugin_name)?>
    </label>
    <textarea type="text" id="<?php echo $this->get_field_id('items_list_box') ?>" class="widefat" name="<?php echo $this->get_field_name('items_list_box') ?>" value = "<?php echo esc_attr( $instance['items_list_box'] ) ?>" > <?php echo esc_attr( $instance['items_list_box'] ) ?></textarea>
  </p>
 </div>
<div class="input-elements-wrapper">        
  <p class="one_fourth">
    <label for="<?php echo $this->get_field_id('items_list_box_bg_color'); ?>">
    <?php _e('Background Color',$petcare_plugin_name) ?>
    </label>
    <input type="text" name="<?php echo $this->get_field_name('items_list_box_bg_color') ?>" id="<?php echo $this->get_field_id('items_list_box_bg_color') ?>" class="pricinglist_color_pickr" value="<?php echo esc_attr($instance['items_list_box_bg_color']) ?>" />
  </p>
  <p class="one_fourth">
    <label for="<?php echo $this->get_field_id('items_list_box_text_color'); ?>">
    <?php _e('Text Color',$petcare_plugin_name) ?>
    </label>
    <input type="text" name="<?php echo $this->get_field_name('items_list_box_text_color') ?>" id="<?php echo $this->get_field_id('items_list_box_text_color') ?>" class="pricinglist_color_pickr" value="<?php echo esc_attr($instance['items_list_box_text_color']) ?>" />
 </p>
</div>
<div class="input-elements-wrapper">        
  <p>
    <label for="<?php echo $this->get_field_id('animation_names') ?>">  <?php _e('Select Animation Effect',$petcare_plugin_name) ?>  </label>
    <?php animation_effects($this->get_field_name('animation_names'), $instance['animation_names'] ); ?>
  </p>
</div>  
<?php  }
 }
 petcare_kaya_register_widgets('tabular-food-menu', __FILE__);
 ?>