<?php
if ( ! class_exists( 'Kayla_Widget_About_Me' ) ) {
    class Kayla_Widget_About_Me extends WP_Widget
    {
    	public function __construct()
        {
            add_action('admin_enqueue_scripts', array( $this, 'widget_scripts' ));
    		$widget_ops = array('classname' => 'widget_about_me');
    		parent::__construct('widget_about_me', __('Kayla: About Me', 'kayla'), $widget_ops);
    	}
    
        public function widget_scripts() {
            wp_enqueue_media();
            wp_enqueue_script('kayla-widget-about-me', get_template_directory_uri() . '/assets/js/widget-about.js', false, '1.0', true);
        }
    
    	public function widget($args, $instance)
        {
    		$title = apply_filters('widget_title', empty($instance['title']) ? __('About Me', 'kayla') : $instance['title'], $instance, $this->id_base);
    		echo wp_kses_post($args['before_widget']);
            if ( $title ) echo wp_kses_post( $args['before_title'] . $title . $args['after_title'] ); ?>
            <div class="about-widget widget-content">
                <?php if ( isset( $instance['image_uri'] ) && !empty( $instance['image_uri'] ) ) : ?>
                <div class="about-img">
                    <img src="<?php echo esc_url( $instance['image_uri'] ); ?>" alt="About Me"/>
                </div>
                <?php endif; ?>
                <?php if ( isset( $instance['about_title'] ) && !empty( $instance['about_title'] ) ) : ?>
                <h3 class="about-title"><?php echo esc_html( $instance['about_title'] ); ?></h3>
                <?php endif; ?>
                <?php if ( isset( $instance['short_desciption'] ) && !empty( $instance['short_desciption'] ) ) : ?>
                <p><?php echo esc_html( $instance['short_desciption'] ); ?></p>
                <?php endif; ?>
            </div><?php
            echo wp_kses_post($args['after_widget']);
    	}
    
    	public function update($new_instance, $old_instance)
        {
    		$instance = $old_instance;
    		$instance['title']              = sanitize_text_field($new_instance['title']);
            $instance['about_title']        = sanitize_text_field($new_instance['about_title']);
            $instance['short_desciption']   = wp_kses_post($new_instance['short_desciption']);
            $instance['image_uri']          = esc_url_raw($new_instance['image_uri']);
    		return $instance;
    	}
    
    	public function form($instance)
        {
    		//Defaults
            $default = array(
                'title' => '',
                'about_title' => '',
                'short_desciption' => '',
                'image_uri' => ''
            );
    		$instance           = wp_parse_args((array)$instance, $default);
            $title              = $instance['title'];
            $about_title        = $instance['about_title'];
            $short_desciption   = $instance['short_desciption'];
            $image_uri          = $instance['image_uri']; ?>
            <p>
            	<label for="<?php echo esc_attr($this->get_field_id('title')); ?>">Title:</label>
            	<input class="widefat" id="<?php echo esc_attr($this->get_field_id('title')); ?>" name="<?php echo esc_attr($this->get_field_name('title')); ?>" type="text" value="<?php echo esc_attr($title); ?>" /></p>
            <p>
            <p>
            	<label for="<?php echo esc_attr($this->get_field_id('about_title')); ?>">Sub title:</label>
            	<input class="widefat" id="<?php echo esc_attr($this->get_field_id('about_title')); ?>" name="<?php echo esc_attr($this->get_field_name('about_title')); ?>" type="text" value="<?php echo esc_attr($about_title); ?>" /></p>
            <p>
            <p>
                <label for="<?php echo esc_attr($this->get_field_name('short_desciption')); ?>">About me text:</label>
                <textarea rows="8" class="widefat" id="<?php echo esc_attr($this->get_field_id('short_desciption')); ?>" name="<?php echo esc_attr($this->get_field_name('short_desciption')); ?>"><?php echo wp_kses_post($short_desciption); ?></textarea>
            </p>
            <p>
                <label for="<?php echo esc_attr($this->get_field_id('image_uri')); ?>">Image:</label><br />
                <img class="custom_media_image widefat" src="<?php echo esc_url($image_uri); ?>" style="margin:0;padding:0;max-width:100px;float:left;display:inline-block" />
                <input type="text" class="widefat custom_media_url" name="<?php echo esc_attr( $this->get_field_name('image_uri') ); ?>" id="<?php echo esc_attr($this->get_field_id('image_uri')); ?>" value="<?php echo esc_attr($instance['image_uri']); ?>" style="margin-top:5px;"/>
                <input type="button" class="button button-primary custom_media_button" id="custom_media_button" name="<?php echo esc_attr($this->get_field_name('image_uri')); ?>" value="<?php echo esc_attr__('Upload Image', 'kayla');?>" style="margin-top:5px;" />
            </p><?php
    	}
    }

    if ( ! function_exists( 'kayla_about_me_init' ) ) {
        function kayla_about_me_init() {
            register_widget('Kayla_Widget_About_Me');
        }
        add_action('widgets_init', 'kayla_about_me_init');
    }
}
