| @@ -1,41 +1,47 @@ | ||
| 1 | 1 | <?php |
| 2 | +if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly | |
| 3 | + | |
| 2 | 4 | /** |
| 3 | 5 | * Media component for the settings page |
| 4 | 6 | */ |
| 5 | 7 | |
| 6 | -$key_option = sanitize_key( $data['name'] ); | |
| 7 | - | |
| 8 | -if( isset( $key_option, $_POST[ $key_option ] ) ) { | |
| 9 | - update_option( $key_option, sanitize_text_field( $_POST[ $key_option ] ) ); | |
| 8 | +$quickwebp_key_option = sanitize_key( $data['name'] ); | |
| 9 | +//phpcs:ignore WordPress.Security.NonceVerification.Missing | |
| 10 | +if( isset( $quickwebp_key_option, $_POST[ $quickwebp_key_option ] ) ) { | |
| 11 | + //phpcs:ignore WordPress.Security.NonceVerification.Missing | |
| 12 | + $quickwebp_raw_value = sanitize_text_field( wp_unslash( $_POST[ $quickwebp_key_option ] ) ); | |
| 13 | + $quickwebp_media_ids = array_filter( array_map( 'absint', explode( ',', $quickwebp_raw_value ) ) ); | |
| 14 | + update_option( $quickwebp_key_option, implode( ',', $quickwebp_media_ids ) ); | |
| 10 | 15 | } |
| 11 | 16 | |
| 12 | 17 | wp_enqueue_media(); |
| 13 | -$is_multiple = isset( $data['multiple'] ) && $data['multiple'] === true ? 'true' : 'false'; | |
| 14 | -$image_preview_template = '<img src="%s" title="%s" class="media-preview-image">'; | |
| 18 | +$quickwebp_is_multiple = isset( $data['multiple'] ) && $data['multiple'] === true ? 'true' : 'false'; | |
| 19 | +$quickwebp_image_preview_template = '<img src="%1$s" title="%2$s" class="media-preview-image">'; | |
| 15 | 20 | |
| 16 | -$medias_string = isset( $key_option ) ? get_option( $key_option, '' ) : ''; | |
| 17 | -$medias = $medias_string ? explode( ',', $medias_string ) : array(); | |
| 21 | +$quickwebp_medias_string = isset( $quickwebp_key_option ) ? get_option( $quickwebp_key_option, '' ) : ''; | |
| 22 | +$quickwebp_medias = $quickwebp_medias_string ? explode( ',', $quickwebp_medias_string ) : array(); | |
| 18 | 23 | ?> |
| 19 | 24 | <div class="quickwebp-media-input-container"> |
| 20 | - <div id="<?php echo esc_attr( $key_option ?? '' ); ?>_is_empty" class="quickwebp-media-input--is-empty" style="display: <?php echo !empty($medias) ? 'none' : 'block'; ?>"> | |
| 21 | - <?php _e( 'No image selected', QUICKWEBP_TEXT_DOMAIN ); ?> | |
| 25 | + <div id="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>_is_empty" class="quickwebp-media-input--is-empty" style="display: <?php echo esc_attr( ! empty( $quickwebp_medias ) ? 'none' : 'block' ); ?>"> | |
| 26 | + <?php esc_html_e( 'No image selected', 'quickwebp' ); ?> | |
| 22 | 27 | </div> |
| 23 | 28 | <input |
| 24 | 29 | type="hidden" |
| 25 | - name="<?php echo esc_attr( $key_option ?? '' ); ?>" | |
| 26 | - id="<?php echo esc_attr( $key_option ?? '' ); ?>" | |
| 27 | - value="<?php echo esc_attr( $medias_string ); ?>" | |
| 30 | + name="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>" | |
| 31 | + id="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>" | |
| 32 | + value="<?php echo esc_attr( $quickwebp_medias_string ); ?>" | |
| 28 | 33 | > |
| 29 | - <div id="<?php echo esc_attr( $key_option ?? '' ); ?>_medias-selected" class="quickwebp-medias-selected-container"> | |
| 34 | + <div id="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>_medias-selected" class="quickwebp-medias-selected-container"> | |
| 30 | 35 | <?php |
| 31 | - foreach( $medias as $media_id ) { | |
| 32 | - $media = get_post( $media_id ); | |
| 33 | - if( $media ) { | |
| 34 | - if( wp_attachment_is_image( $media_id ) ) { | |
| 35 | - echo wp_kses_post( sprintf( $image_preview_template, wp_get_attachment_image_url( $media_id, 'thumbnail' ), $media->post_title ) ); | |
| 36 | + foreach( $quickwebp_medias as $quickwebp_media_id ) { | |
| 37 | + $quickwebp_media_id = absint( $quickwebp_media_id ); | |
| 38 | + $quickwebp_media = get_post( $quickwebp_media_id ); | |
| 39 | + if( $quickwebp_media ) { | |
| 40 | + if( wp_attachment_is_image( $quickwebp_media_id ) ) { | |
| 41 | + echo wp_kses_post( sprintf( $quickwebp_image_preview_template, esc_url( wp_get_attachment_image_url( $quickwebp_media_id, 'thumbnail' ) ), esc_attr( $quickwebp_media->post_title ) ) ); | |
| 36 | 42 | } else { |
| 37 | - echo wp_kses_post( sprintf( $image_preview_template, wp_mime_type_icon( $media->post_mime_type ), $media->post_title ) ); | |
| 43 | + echo wp_kses_post( sprintf( $quickwebp_image_preview_template, esc_url( wp_mime_type_icon( $quickwebp_media->post_mime_type ) ), esc_attr( $quickwebp_media->post_title ) ) ); | |
| 38 | 44 | } |
| 39 | 45 | } |
| 40 | 46 | } |
| 41 | 47 | ?> |
| @@ -40,31 +46,31 @@ | ||
| 40 | 46 | } |
| 41 | 47 | ?> |
| 42 | 48 | </div> |
| 43 | 49 | <input type="button" |
| 44 | - name="<?php echo esc_attr( $key_option ?? '' ); ?>_button" | |
| 45 | - id="<?php echo esc_attr( $key_option ?? '' ); ?>_button" | |
| 50 | + name="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>_button" | |
| 51 | + id="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>_button" | |
| 46 | 52 | class="button button-secondary" |
| 47 | - value="<?php echo esc_attr( $data['button_text'] ?? __( 'Select media', QUICKWEBP_TEXT_DOMAIN ) ); ?>" | |
| 53 | + value="<?php echo esc_attr( $data['button_text'] ?? __( 'Select media', 'quickwebp' ) ); ?>" | |
| 48 | 54 | > |
| 49 | 55 | <input type="button" |
| 50 | - name="<?php echo esc_attr( $key_option ?? '' ); ?>_remove_button" | |
| 51 | - id="<?php echo esc_attr( $key_option ?? '' ); ?>_remove_button" | |
| 56 | + name="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>_remove_button" | |
| 57 | + id="<?php echo esc_attr( $quickwebp_key_option ?? '' ); ?>_remove_button" | |
| 52 | 58 | class="button button-secondary button-remove-media" |
| 53 | - value="<?php echo esc_attr( $data['remove_button_text'] ?? __( 'Remove medias', QUICKWEBP_TEXT_DOMAIN ) ); ?>" | |
| 54 | - <?php echo empty( $medias ) ? 'disabled' : ''; ?> | |
| 59 | + value="<?php echo esc_attr( $data['remove_button_text'] ?? __( 'Remove medias', 'quickwebp' ) ); ?>" | |
| 60 | + <?php echo empty( $quickwebp_medias ) ? 'disabled' : ''; ?> | |
| 55 | 61 | > |
| 56 | 62 | </div> |
| 57 | 63 | |
| 58 | 64 | <script type="text/javascript"> |
| 59 | 65 | jQuery(document).ready(function($){ |
| 60 | - const id = '<?php echo esc_attr( $key_option ?? '' ); ?>'; | |
| 61 | - const media_template_preview = '<?php echo wp_kses_post($image_preview_template); ?>'; | |
| 66 | + const id = <?php echo wp_json_encode( $quickwebp_key_option ?? '' ); ?>; | |
| 67 | + const media_template_preview = <?php echo wp_json_encode( $quickwebp_image_preview_template ); ?>; | |
| 62 | 68 | jQuery( "#" + id + "_button" ).click(function(e) { |
| 63 | 69 | e.preventDefault(); |
| 64 | 70 | var image = wp.media({ |
| 65 | - title: '<?php echo esc_attr( $data['button_text'] ?? __( 'Select media', QUICKWEBP_TEXT_DOMAIN ) ); ?>', | |
| 66 | - multiple: <?php echo esc_attr( $is_multiple ); ?> | |
| 71 | + title: <?php echo wp_json_encode( $data['button_text'] ?? __( 'Select media', 'quickwebp' ) ); ?>, | |
| 72 | + multiple: <?php echo esc_attr( $quickwebp_is_multiple ); ?> | |
| 67 | 73 | }) |
| 68 | 74 | |
| 69 | 75 | image.on('select', function(e){ |
| 70 | 76 | const medias = image.state().get('selection').toJSON(); |
