image-widget.php 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258
  1. <?php
  2. /**
  3. * Module Name: Image Widget
  4. * Module Description: Easily add images to your theme's sidebar.
  5. * Sort Order: 20
  6. * First Introduced: 1.2
  7. */
  8. /**
  9. * Register the widget for use in Appearance -> Widgets
  10. */
  11. add_action( 'widgets_init', 'jetpack_image_widget_init', 11 );
  12. function jetpack_image_widget_init() {
  13. if ( class_exists( 'WP_Widget_Media_Image' ) && Jetpack_Options::get_option( 'image_widget_migration' ) ) {
  14. return;
  15. }
  16. register_widget( 'Jetpack_Image_Widget' );
  17. }
  18. class Jetpack_Image_Widget extends WP_Widget {
  19. /**
  20. * Register widget with WordPress.
  21. */
  22. public function __construct() {
  23. parent::__construct(
  24. 'image',
  25. /** This filter is documented in modules/widgets/facebook-likebox.php */
  26. apply_filters( 'jetpack_widget_name', esc_html__( 'Image', 'jetpack' ) ),
  27. array(
  28. 'classname' => 'widget_image',
  29. 'description' => __( 'Display an image in your sidebar', 'jetpack' ),
  30. 'customize_selective_refresh' => true,
  31. )
  32. );
  33. if ( is_active_widget( false, false, $this->id_base ) || is_active_widget( false, false, 'monster' ) || is_customize_preview() ) {
  34. add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_style' ) );
  35. }
  36. }
  37. /**
  38. * Loads file for front-end widget style.
  39. *
  40. * @uses wp_enqueue_style(), plugins_url()
  41. */
  42. public function enqueue_style() {
  43. wp_enqueue_style( 'jetpack_image_widget', plugins_url( 'image-widget/style.css', __FILE__ ), array(), '20140808' );
  44. }
  45. /**
  46. * Front-end display of widget.
  47. *
  48. * @see WP_Widget::widget()
  49. *
  50. * @param array $args Widget arguments.
  51. * @param array $instance Saved values from database.
  52. */
  53. public function widget( $args, $instance ) {
  54. echo $args['before_widget'];
  55. $instance = wp_parse_args( $instance, array(
  56. 'title' => '',
  57. 'img_url' => ''
  58. ) );
  59. /** This filter is documented in core/src/wp-includes/default-widgets.php */
  60. $title = apply_filters( 'widget_title', $instance['title'] );
  61. if ( $title ) {
  62. echo $args['before_title'] . esc_html( $title ) . $args['after_title'];
  63. }
  64. if ( '' != $instance['img_url'] ) {
  65. $output = '<img src="' . esc_url( $instance['img_url'] ) . '" ';
  66. if ( '' != $instance['alt_text'] ) {
  67. $output .= 'alt="' . esc_attr( $instance['alt_text'] ) .'" ';
  68. }
  69. if ( '' != $instance['img_title'] ) {
  70. $output .= 'title="' . esc_attr( $instance['img_title'] ) .'" ';
  71. }
  72. if ( '' == $instance['caption'] ) {
  73. $output .= 'class="align' . esc_attr( $instance['align'] ) . '" ';
  74. }
  75. if ( '' != $instance['img_width'] ) {
  76. $output .= 'width="' . esc_attr( $instance['img_width'] ) .'" ';
  77. }
  78. if ( '' != $instance['img_height'] ) {
  79. $output .= 'height="' . esc_attr( $instance['img_height'] ) .'" ';
  80. }
  81. $output .= '/>';
  82. if ( class_exists( 'Jetpack_Photon' ) && Jetpack::is_module_active( 'photon' ) ) {
  83. $output = Jetpack_Photon::filter_the_content( $output );
  84. }
  85. if ( '' != $instance['link'] ) {
  86. $target = ! empty( $instance['link_target_blank'] )
  87. ? 'target="_blank"'
  88. : '';
  89. $output = '<a ' . $target . ' href="' . esc_url( $instance['link'] ) . '">' . $output . '</a>';
  90. }
  91. if ( '' != $instance['caption'] ) {
  92. /** This filter is documented in core/src/wp-includes/default-widgets.php */
  93. $caption = apply_filters( 'widget_text', $instance['caption'] );
  94. $img_width = ( ! empty( $instance['img_width'] ) ? 'style="width: ' . esc_attr( $instance['img_width'] ) .'px"' : '' );
  95. $output = '<figure ' . $img_width .' class="wp-caption align' . esc_attr( $instance['align'] ) . '">
  96. ' . $output . '
  97. <figcaption class="wp-caption-text">' . $caption . '</figcaption>
  98. </figure>'; // wp_kses_post caption on update
  99. }
  100. echo '<div class="jetpack-image-container">' . do_shortcode( $output ) . '</div>';
  101. } else {
  102. if ( current_user_can( 'edit_theme_options' ) ) {
  103. echo '<p>' . sprintf( __( 'Image missing or invalid URL. Please check the Image widget URL in your <a href="%s">widget settings</a>.', 'jetpack' ), admin_url( 'widgets.php' ) ) . '</p>';
  104. }
  105. }
  106. echo "\n" . $args['after_widget'];
  107. /** This action is documented in modules/widgets/gravatar-profile.php */
  108. do_action( 'jetpack_stats_extra', 'widget_view', 'image' );
  109. }
  110. /**
  111. * Sanitize widget form values as they are saved.
  112. *
  113. * @see WP_Widget::update()
  114. *
  115. * @param array $new_instance Values just sent to be saved.
  116. * @param array $old_instance Previously saved values from database.
  117. *
  118. * @return array Updated safe values to be saved.
  119. */
  120. public function update( $new_instance, $old_instance ) {
  121. $allowed_caption_html = array(
  122. 'a' => array(
  123. 'href' => array(),
  124. 'title' => array(),
  125. ),
  126. 'b' => array(),
  127. 'em' => array(),
  128. 'i' => array(),
  129. 'p' => array(),
  130. 'strong' => array()
  131. );
  132. $instance = $old_instance;
  133. $instance['title'] = strip_tags( $new_instance['title'] );
  134. $instance['img_url'] = esc_url( trim( $new_instance['img_url'] ) );
  135. $instance['alt_text'] = strip_tags( $new_instance['alt_text'] );
  136. $instance['img_title'] = strip_tags( $new_instance['img_title'] );
  137. $instance['caption'] = wp_kses( stripslashes($new_instance['caption'] ), $allowed_caption_html );
  138. $instance['align'] = $new_instance['align'];
  139. $instance['link'] = esc_url( trim( $new_instance['link'] ) );
  140. $instance['link_target_blank'] = isset( $new_instance['link_target_blank'] ) ? (bool) $new_instance['link_target_blank'] : false;
  141. $new_img_width = absint( $new_instance['img_width'] );
  142. $new_img_height = absint( $new_instance['img_height'] );
  143. if ( ! empty( $instance['img_url'] ) && '' == $new_img_width && '' == $new_img_height ) {
  144. // Download the url to a local temp file and then process it with getimagesize so we can optimize browser layout
  145. $tmp_file = download_url( $instance['img_url'], 10 );
  146. if ( ! is_wp_error( $tmp_file ) ) {
  147. $size = getimagesize( $tmp_file );
  148. $width = $size[0];
  149. $instance['img_width'] = absint( $width );
  150. $height = $size[1];
  151. $instance['img_height'] = absint( $height );
  152. unlink( $tmp_file );
  153. } else {
  154. $instance['img_width'] = $new_img_width;
  155. $instance['img_height'] = $new_img_height;
  156. }
  157. } else {
  158. $instance['img_width'] = $new_img_width;
  159. $instance['img_height'] = $new_img_height;
  160. }
  161. return $instance;
  162. }
  163. /**
  164. * Back end widget form.
  165. *
  166. * @see WP_Widget::form()
  167. *
  168. * @param array $instance Previously saved values from database.
  169. */
  170. public function form( $instance ) {
  171. // Defaults
  172. $instance = wp_parse_args( (array) $instance, array( 'title' => '', 'img_url' => '', 'alt_text' => '', 'img_title' => '', 'caption' => '', 'align' => 'none', 'img_width' => '', 'img_height' => '', 'link' => '', 'link_target_blank' => false ) );
  173. $title = esc_attr( $instance['title'] );
  174. $img_url = esc_url( $instance['img_url'], null, 'display' );
  175. $alt_text = esc_attr( $instance['alt_text'] );
  176. $img_title = esc_attr( $instance['img_title'] );
  177. $caption = esc_textarea( $instance['caption'] );
  178. $align = esc_attr( $instance['align'] );
  179. $img_width = esc_attr( $instance['img_width'] );
  180. $img_height = esc_attr( $instance['img_height'] );
  181. $link_target_blank = checked( $instance['link_target_blank'], true, false );
  182. $link = esc_url( $instance['link'], null, 'display' );
  183. echo '<p><label for="' . $this->get_field_id( 'title' ) . '">' . esc_html__( 'Widget title:', 'jetpack' ) . '
  184. <input class="widefat" id="' . $this->get_field_id( 'title' ) . '" name="' . $this->get_field_name( 'title' ) . '" type="text" value="' . $title . '" />
  185. </label></p>
  186. <p><label for="' . $this->get_field_id( 'img_url' ) . '">' . esc_html__( 'Image URL:', 'jetpack' ) . '
  187. <input class="widefat" id="' . $this->get_field_id( 'img_url' ) . '" name="' . $this->get_field_name( 'img_url' ) . '" type="text" value="' . $img_url . '" />
  188. </label></p>
  189. <p><label for="' . $this->get_field_id( 'alt_text' ) . '">' . esc_html__( 'Alternate text:', 'jetpack' ) . ' <a href="http://support.wordpress.com/widgets/image-widget/#image-widget-alt-text" target="_blank">( ? )</a>
  190. <input class="widefat" id="' . $this->get_field_id( 'alt_text' ) . '" name="' . $this->get_field_name( 'alt_text' ) . '" type="text" value="' . $alt_text . '" />
  191. </label></p>
  192. <p><label for="' . $this->get_field_id( 'img_title' ) . '">' . esc_html__( 'Image title:', 'jetpack' ) . ' <a href="http://support.wordpress.com/widgets/image-widget/#image-widget-title" target="_blank">( ? )</a>
  193. <input class="widefat" id="' . $this->get_field_id( 'img_title' ) . '" name="' . $this->get_field_name( 'img_title' ) . '" type="text" value="' . $img_title . '" />
  194. </label></p>
  195. <p><label for="' . $this->get_field_id( 'caption' ) . '">' . esc_html__( 'Caption:', 'jetpack' ) . ' <a href="http://support.wordpress.com/widgets/image-widget/#image-widget-caption" target="_blank">( ? )</a>
  196. <textarea class="widefat" id="' . $this->get_field_id( 'caption' ) . '" name="' . $this->get_field_name( 'caption' ) . '" rows="2" cols="20">' . $caption . '</textarea>
  197. </label></p>';
  198. $alignments = array(
  199. 'none' => __( 'None', 'jetpack' ),
  200. 'left' => __( 'Left', 'jetpack' ),
  201. 'center' => __( 'Center', 'jetpack' ),
  202. 'right' => __( 'Right', 'jetpack' ),
  203. );
  204. echo '<p><label for="' . $this->get_field_id( 'align' ) . '">' . esc_html__( 'Image Alignment:', 'jetpack' ) . '
  205. <select id="' . $this->get_field_id( 'align' ) . '" name="' . $this->get_field_name( 'align' ) . '">';
  206. foreach ( $alignments as $alignment => $alignment_name ) {
  207. echo '<option value="' . esc_attr( $alignment ) . '" ';
  208. if ( $alignment == $align )
  209. echo 'selected="selected" ';
  210. echo '>' . esc_html($alignment_name) . "</option>\n";
  211. }
  212. echo '</select></label></p>';
  213. echo '<p><label for="' . $this->get_field_id( 'img_width' ) . '">' . esc_html__( 'Width in pixels:', 'jetpack' ) . '
  214. <input size="3" id="' . $this->get_field_id( 'img_width' ) . '" name="' . $this->get_field_name( 'img_width' ) . '" type="text" value="' . $img_width . '" />
  215. </label>
  216. <label for="' . $this->get_field_id( 'img_height' ) . '">' . esc_html__( 'Height in pixels:', 'jetpack' ) . '
  217. <input size="3" id="' . $this->get_field_id( 'img_height' ) . '" name="' . $this->get_field_name( 'img_height' ) . '" type="text" value="' . $img_height . '" />
  218. </label><br />
  219. <small>' . esc_html__( "If empty, we will attempt to determine the image size.", 'jetpack' ) . '</small></p>
  220. <p><label for="' . $this->get_field_id( 'link' ) . '">' . esc_html__( 'Link URL (when the image is clicked):', 'jetpack' ) . '
  221. <input class="widefat" id="' . $this->get_field_id( 'link' ) . '" name="' . $this->get_field_name( 'link' ) . '" type="text" value="' . $link . '" />
  222. </label>
  223. <label for="' . $this->get_field_id( 'link_target_blank' ) . '">
  224. <input type="checkbox" name="' . $this->get_field_name( 'link_target_blank' ) . '" id="' . $this->get_field_id( 'link_target_blank' ) . '" value="1"' . $link_target_blank . '/>
  225. ' . esc_html__( 'Open link in a new window/tab', 'jetpack' ) . '
  226. </label></p>';
  227. }
  228. } // Class Jetpack_Image_Widget