WordPress widget with media uploader.

index.php

<?php
**
 * Featuer Widget
 */


add_action( 'admin_enqueue_scripts', function () {
    wp_enqueue_script('media-upload');
    wp_enqueue_script('thickbox');
    wp_enqueue_script('feature-upload-script', get_template_directory_uri().'/assets/js/media-upload.js', array( 'jquery' )) ;
    wp_enqueue_style('thickbox');
});	



add_action('widgets_init', function() {
	register_widget('ReturningPaint');
});

class ReturningPaint extends WP_Widget {
	public function __construct() {
		$widget_info = array(
			'classname' 	=> 'returning-paint',
			'description' 	=> 'Returning patent widget'
		);

		parent::__construct('returning_paint','Returning Pateint',$widget_info);
	}

	public function widget($arrs, $instance) {
		echo $arrs['before_widget'];
	?>
        <div class="returning-patient">
        		<?php if($instance['image']): ?>
                <div class="widget-image">
                    <img src="<?php echo esc_url($instance['image']); ?>" alt="<?php echo apply_filters( 'widget_title', $instance['title'] ); ?>">
                </div>
            	<?php endif; ?>

                <h3><?php echo apply_filters( 'widget_title', $instance['title'] ); ?></h3>
                <p><?php echo esc_html($instance['description']); ?></p>
                <a href="<?php echo esc_url( $instance['link_url'] ) ?>" class="learn-more"><?php echo esc_html( $instance['link_title'] ) ?></a>
        </div>
     <?php
     echo $arrs['after_widget'];
	}

	public function update($new_instance, $old_instance) {
		return $new_instance;
	}

	public function form($instance) {
		$title = '';

		if(!empty($instance['title'])) {
			$title = $instance['title'];
		}

	    $description = '';
	    if( !empty( $instance['description'] ) ) {
	        $description = $instance['description'];
	    }

	    $link_url = '';
	    if( !empty( $instance['link_url'] ) ) {
	        $link_url = $instance['link_url'];
	    }

	    $link_title = '';
	    if( !empty( $instance['link_title'] ) ) {
	        $link_title = $instance['link_title'];
	    }

	    $image = '';
		if(isset($instance['image']))
		{
		    $image = $instance['image'];
		}

	    ?>

		<p>
		    <label for="<?php echo $this->get_field_name( 'image' ); ?>"><?php _e( 'Image:' ); ?></label>
		    <input name="<?php echo $this->get_field_name( 'image' ); ?>" id="<?php echo $this->get_field_id( 'image' ); ?>" class="widefat ha-media-input" type="text" size="36"  value="<?php echo esc_url( $image ); ?>" />
		    <div class="show-image">
			    <?php if($instance['image']): ?>
					<img src="<?php echo $image; ?>" alt="Show Image" width="100%" height="auto">
			    <?php endif; ?>
			</div>
		    <input class="upload_image_button button" type="button" value="Upload Image"/>
		</p>

	    <p>
	        <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label>
	        <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>" />
	    </p>

	    <p>
	        <label for="<?php echo $this->get_field_id( 'description' ); ?>"><?php _e( 'Description:' ); ?></label>
	        <textarea class="widefat" id="<?php echo $this->get_field_id( 'description' ); ?>" name="<?php echo $this->get_field_name( 'description' ); ?>" type="text" ><?php echo esc_attr( $description ); ?></textarea>
	    </p>

	    <p>
	        <label for="<?php echo $this->get_field_id( 'link_url' ); ?>"><?php _e( 'Link URL:' ); ?></label>
	        <input class="widefat" id="<?php echo $this->get_field_id( 'link_url' ); ?>" name="<?php echo $this->get_field_name( 'link_url' ); ?>" type="text" value="<?php echo esc_attr( $link_url ); ?>" />
	    </p>

	    <p>
	        <label for="<?php echo $this->get_field_id('link_title'); ?>"><?php _e( 'Link Title:' ); ?></label>
	        <input class="widefat" id="<?php echo $this->get_field_id( 'link_title' ); ?>" name="<?php echo $this->get_field_name( 'link_title' ); ?>" type="text" value="<?php echo esc_attr( $link_title ); ?>" />
	    </p>


	<?php }
}

script.js

;(function($){
    $(function() {
        $(document).on("click", ".upload_image_button", function() {

            var el = $('.ha-media-input');
            window.send_to_editor = function(html) {


                    var imgurl = jQuery(html).attr('src');


                if(el != undefined && el != '')
                {
                    el.val(imgurl);
                }

                if($('.show-image img').lenght) {
                    $('.show-image img').attr('src',imgurl);
                }else {
                    $('.show-image').html('<img src="'+imgurl+'" alt="Show Image" width="100%" height="auto">');
                }

                tb_remove();
            };

            tb_show('', 'media-upload.php?type=image&TB_iframe=true');
            return false;
        });
    });
})(jQuery);