<?php
/**
 * Widget: About
 *
 * @package WordPress
 * @subpackage Charity
 * @since Charity 1.0
 */
?>
<?php


add_action('widgets_init', function(){return register_widget("wpl_pageproject_widget");});
class wpl_pageproject_widget extends WP_Widget {


	/*-----------------------------------------------------------------------------------*/
	/*	Widget actual processes
	/*-----------------------------------------------------------------------------------*/

	public function __construct() {
		parent::__construct(
	 		'wpl_pageproject_widget',
			__( 'WPL Page (HomePage)', 'charity-wpl' ),
			array( 'description' => __( 'A widget to displaying the page content', 'charity-wpl' ), )
		);
	}


	/*-----------------------------------------------------------------------------------*/
	/*	Outputs the options form on admin
	/*-----------------------------------------------------------------------------------*/

	public function form( $instance ) {

		if ( $instance ) {
			$title = esc_attr( $instance[ 'title' ] );
			$subtitle = esc_attr( $instance[ 'subtitle' ] );
			$email_us_at = esc_attr( $instance[ 'email_us_at' ] );
		}
		else {
			$title = __( 'Sponsor This Entire Project', 'charity-wpl' );
			$subtitle = __( 'Sponsor message', 'charity-wpl' );
			$email_us_at = '';
		}

		if( isset( $instance['page_id'] ) ) {
			$page_id = (int)$instance['page_id'];
		} else {
			$page_id = 0;
		}

		if ( $instance ) {
			$imgsrc1 = esc_attr( $instance[ 'imgsrc1' ] );
		}
		else {
			$imgsrc1 = __( '', 'charity-wpl' );
		}

		if ( $instance ) {
			$imgsrc2 = esc_attr( $instance[ 'imgsrc2' ] );
		}
		else {
			$imgsrc2 = __( '', 'charity-wpl' );
		}

		if ( $instance ) {
			$imgsrc3 = esc_attr( $instance[ 'imgsrc3' ] );
		}
		else {
			$imgsrc3 = __( '', 'charity-wpl' );
		}

		if ( $instance ) {
			$imgsrc4 = esc_attr( $instance[ 'imgsrc4' ] );
		}
		else {
			$imgsrc4 = __( '', 'charity-wpl' );
		}

		?>


			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>"> <?php _e('Title:', 'charity-wpl'); ?> </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_html( $title ); ?>" />
			</p>

			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'subtitle' ) ); ?>"> <?php _e('Subtitle:', 'charity-wpl'); ?> </label>
				<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'subtitle' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'subtitle' ) ); ?>" type="text" value="<?php echo esc_html( $subtitle ); ?>" />
			</p>

			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'email_us_at' ) ); ?>"> <?php _e('Email us at:', 'charity-wpl'); ?> </label>
				<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'email_us_at' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'email_us_at' ) ); ?>" type="text" value="<?php echo esc_html( $email_us_at ); ?>" />
			</p>

			<p>
				<label for="<?php echo esc_attr( $this->get_field_id('pages') ); ?>"> <?php _e('Page:', 'charity-wpl'); ?> </label>

				<?php
				$args = array(
					'id' => $this->get_field_id('page_id'),
					'name' => $this->get_field_name('page_id'),
					'selected' => $page_id
				);
				wp_dropdown_pages( $args );
				?>
			</p>

			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'imgsrc1' ) ); ?>"> <?php _e('Image SRC #1:', 'charity-wpl'); ?> </label>
				<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'imgsrc1' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'imgsrc1' ) ); ?>" type="text" value="<?php echo esc_html( $imgsrc1 ); ?>" />
			</p>


			<?php if ( $imgsrc1 ) { ?>
				<img src="<?php echo esc_url($imgsrc1); ?>" alt="<?php _e('This is a demo image', 'charity-wpl'); ?>" style="width: 50%; height: auto; margin-bottom: 20px;" class="media-picker-image">
			<?php } else {
				echo "No Image, Add the Image SRC.";
			} ?>


			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'imgsrc2' ) ); ?>"> <?php _e('Image SRC #2:', 'charity-wpl'); ?> </label>
				<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'imgsrc2' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'imgsrc2' ) ); ?>" type="text" value="<?php echo esc_html( $imgsrc2 ); ?>" />
			</p>
			<?php if ( $imgsrc2 ) { ?>
				<img src="<?php echo esc_url($imgsrc2); ?>" alt="<?php _e('This is a demo image', 'charity-wpl'); ?>" style="width: 50%; height: auto; margin-bottom: 20px;" class="media-picker-image">
			<?php } else {
				echo "No Image, Add the Image SRC.";
			} ?>

			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'imgsrc3' ) ); ?>"> <?php _e('Image SRC #3:', 'charity-wpl'); ?> </label>
				<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'imgsrc3' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'imgsrc3' ) ); ?>" type="text" value="<?php echo esc_html( $imgsrc3 ); ?>" />
			</p>
			<?php if ( $imgsrc3 ) { ?>
				<img src="<?php echo esc_url($imgsrc3); ?>" alt="<?php _e('This is a demo image', 'charity-wpl'); ?>" style="width: 50%; height: auto; margin-bottom: 20px;" class="media-picker-image">
			<?php } else {
				echo "No Image, Add the Image SRC.";
			} ?>


			<p>
				<label for="<?php echo esc_attr( $this->get_field_id( 'imgsrc4' ) ); ?>"> <?php _e('Image SRC #4:', 'charity-wpl'); ?> </label>
				<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'imgsrc4' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'imgsrc4' ) ); ?>" type="text" value="<?php echo esc_html( $imgsrc4 ); ?>" />
			</p>
			<?php if ( $imgsrc4 ) { ?>
				<img src="<?php echo esc_url($imgsrc4); ?>" alt="<?php _e('This is a demo image', 'charity-wpl'); ?>" style="width: 50%; height: auto; margin-bottom: 20px;" class="media-picker-image">
			<?php } else {
				echo "No Image, Add the Image SRC.";
			} ?>


			<br /><br />
			<p style="font-size: 10px; color: #999; margin: -10px 0 0 0px; padding: 0px;">
				<?php printf( __( 'The ID of this widget is: %1$s %3$s %2$s', 'charity-wpl' ), '<strong>', '</strong>',  '#'.esc_attr( $this->id ) ); ?>
			</p>
			<br />

		<?php
	}


	/*-----------------------------------------------------------------------------------*/
	/*	Processes widget options to be saved
	/*-----------------------------------------------------------------------------------*/

	public function update( $new_instance, $old_instance ) {
		$instance = $old_instance;
		$instance['title'] = sanitize_text_field($new_instance['title']);
		$instance['subtitle'] = sanitize_text_field($new_instance['subtitle']);
		$instance['email_us_at'] = sanitize_text_field($new_instance['email_us_at']);
		$instance['page_id'] = sanitize_text_field($new_instance['page_id']);
		$instance['imgsrc1'] = sanitize_text_field($new_instance['imgsrc1']);
		$instance['imgsrc2'] = sanitize_text_field($new_instance['imgsrc2']);
		$instance['imgsrc3'] = sanitize_text_field($new_instance['imgsrc3']);
		$instance['imgsrc4'] = sanitize_text_field($new_instance['imgsrc4']);
		return $instance;
	}


	/*-----------------------------------------------------------------------------------*/
	/*	Outputs the content of the widget
	/*-----------------------------------------------------------------------------------*/

	public function widget( $args, $instance ) {
		global $post;
		extract( $args );
		$title = apply_filters( 'widget_title', empty($instance['title']) ? '' : $instance['title'], $instance );
		$subtitle = apply_filters( 'widget_title', empty($instance['subtitle']) ? '' : $instance['subtitle'], $instance );
		$email_us_at = apply_filters( 'widget_title', empty($instance['email_us_at']) ? '' : $instance['email_us_at'], $instance );
		$page_id = isset( $instance['page_id'] ) ? esc_attr( $instance['page_id'] ) : '';
		$img1 = apply_filters( 'widget_text', empty( $instance['imgsrc1'] ) ? '' : $instance['imgsrc1'], $instance );
		$img2 = apply_filters( 'widget_text', empty( $instance['imgsrc2'] ) ? '' : $instance['imgsrc2'], $instance );
		$img3 = apply_filters( 'widget_text', empty( $instance['imgsrc3'] ) ? '' : $instance['imgsrc3'], $instance );
		$img4 = apply_filters( 'widget_text', empty( $instance['imgsrc4'] ) ? '' : $instance['imgsrc4'], $instance );

		// WP_Query arguments
		$args = array (
			'page_id'                => $page_id,
			'post_status'            => 'publish',
			'pagination'             => false,
		);

		// The Query
		$swp_about_page = new WP_Query( $args );
		$swp_about_page_gallery = get_post_gallery( $page_id, false );
		$swp_about_page_gallery_ids = explode( ",", $swp_about_page_gallery['ids'] );
		if ( $swp_about_page->have_posts() ) : while ( $swp_about_page->have_posts() ) : $swp_about_page->the_post();
	?>
<div class="grid-container fluid full">
	<div class="grid-x">
		<div class="cell">
			<section class="wpl-section-sponsor">

				<div class="slider-sponsor">
					<div class="slider-clip">
						<ul class="slides owl-carousel">
							<?php if ($img1) { ?>
								<li class="slide item#1">
									<div class="slide-image fullscreener">
										<img src="<?php echo $img1; ?>" />
									</div><!-- /.slide-image -->
								</li><!-- /.slide -->
							<?php } ?>

							<?php if ($img2) { ?>
								<li class="slide item#2">
									<div class="slide-image fullscreener">
										<img src="<?php echo $img2; ?>" />
									</div><!-- /.slide-image -->
								</li><!-- /.slide -->
							<?php } ?>

							<?php if ($img3) { ?>
								<li class="slide item#3">
									<div class="slide-image fullscreener">
										<img src="<?php echo $img3; ?>" />
									</div><!-- /.slide-image -->
								</li><!-- /.slide -->
							<?php } ?>

							<?php if ($img4) { ?>
								<li class="slide item#4">
									<div class="slide-image fullscreener">
										<img src="<?php echo $img4; ?>" />
									</div><!-- /.slide-image -->
								</li><!-- /.slide -->
							<?php } ?>

						</ul><!-- /.slides -->
					</div><!-- /.slider-clip -->

					<div class="slider-actions"></div><!-- /.slider-actions -->
				</div><!-- /.slider-sponsor -->

				<div class="grid-container">
					<div class="grid-x grid-margin-x">
						<div class="cell large-6 large-offset-6">
							<div class="section-inner">
								<header class="section-head">
									<h4><?php echo esc_html( $title ); ?></h4>

									<h2 class="section-title"><?php the_title(); ?></h2><!-- /.section-title -->

									<p><?php echo esc_html( $subtitle ); ?></p>
								</header><!-- /.section-head -->

								<div class="section-body">
									<?php the_content( '', FALSE, '' ); ?>
								</div><!-- /.section-body -->

								<div class="section-foot">
									<a href="<?php the_permalink(); ?>" class="button"><?php _e('Learn More', 'charity-wpl') ?></a>
									<?php if ( $email_us_at !='' && is_email($email_us_at) ) : ?>
										<span class="section-foot-separator"><?php _e('Or', 'charity-wpl'); ?></span>
										<div class="section-foot-contacts">
											<span><?php _e('Email Us At', 'charity-wpl') ?></span>

											<a href="mailto:<?php echo esc_attr( $email_us_at ); ?>"><?php echo esc_attr( $email_us_at ); ?></a>
										</div><!-- /.section-foot-contacts -->
									<?php endif; ?>
								</div><!-- /.section-foot -->
							</div><!-- /.section-inner -->
						</div><!-- /.cell large-6 large-offset-6 -->
					</div><!-- /.grid-x grid-margin-x -->
				</div><!-- /.grid-container -->

			</section><!-- /.wpl-section-sponsor <?php echo esc_attr($this->id); ?> -->
		</div>
	</div><!-- /.grid-x grid-margin-x -->
</div><!-- /.grid-container -->
		<?php endwhile; endif; wp_reset_postdata(); ?>
		<?php
	}
}
?>
