Get WordPress

Plugin Directory

Changeset 3164521

Timestamp:
10/07/2024 08:28:47 PM (17 months ago)
Author:
adgardner1392
Message:

release: v1.3.1

Location:
webp-image-optimization/trunk
Files:
4 edited

Legend:

Unmodified
Added
Removed

  • webp-image-optimization/trunk/README.txt

    r3163740 r3164521  
    66Tested up to: 6.6.2 
    77Requires PHP: 7.2 
    8 Stable tag: 1.3.0 
     8Stable tag: 1.3.
    99License: GPLv2 or later 
    1010License URI: https://www.gnu.org/licenses/gpl-2.0.html

  • webp-image-optimization/trunk/js/admin.js

    r3162269 r3164521  
     1
     2
    13document.addEventListener('DOMContentLoaded', function() {
    24
    3     // JPEG Quality synchronization
    4     var jpegRangeInput = document.getElementById('jpeg_quality_range');
    5     var jpegNumberInput = document.getElementById('jpeg_quality_number');
    6     var jpegValueDisplay = document.getElementById('jpeg_quality_value');
     5    // Function to synchronize range and number inputs
     6    function syncInputs(rangeId, numberId, valueId) {
     7        var rangeInput = document.getElementById(rangeId);
     8        var numberInput = document.getElementById(numberId);
     9        var valueDisplay = document.getElementById(valueId);
    710
    8     // Set initial value display
    9     jpegValueDisplay.textContent = jpegRangeInput.value;
     11        if (!rangeInput || !numberInput || !valueDisplay) return;
    1012
    11     // Synchronize the values
    12     jpegRangeInput.addEventListener('input', function() {
    13         jpegNumberInput.value = jpegRangeInput.value;
    14         jpegValueDisplay.textContent = jpegRangeInput.value;
    15     });
    16     jpegNumberInput.addEventListener('input', function() {
    17         jpegRangeInput.value = jpegNumberInput.value;
    18         jpegValueDisplay.textContent = jpegNumberInput.value;
    19     });
     13        // Set initial value display
     14        valueDisplay.textContent = rangeInput.value;
    2015
    21     // PNG Compression synchronization
    22     var pngRangeInput = document.getElementById('png_compression_range');
    23     var pngNumberInput = document.getElementById('png_compression_number');
    24     var pngValueDisplay = document.getElementById('png_compression_value');
     16        // Synchronize the values
     17        rangeInput.addEventListener('input', function() {
     18            numberInput.value = rangeInput.value;
     19            valueDisplay.textContent = rangeInput.value;
     20        });
    2521
    26     // Set initial value display
    27     pngValueDisplay.textContent = pngRangeInput.value;
     22        numberInput.addEventListener('input', function() {
     23            rangeInput.value = numberInput.value;
     24            valueDisplay.textContent = numberInput.value;
     25        });
     26    }
    2827
    29     // Synchronize the values
    30     pngRangeInput.addEventListener('input', function() {
    31         pngNumberInput.value = pngRangeInput.value;
    32         pngValueDisplay.textContent = pngRangeInput.value;
    33     });
    34     pngNumberInput.addEventListener('input', function() {
    35         pngRangeInput.value = pngNumberInput.value;
    36         pngValueDisplay.textContent = pngNumberInput.value;
    37     });
     28    // Synchronize JPEG Quality
     29    syncInputs('jpeg_quality_range', 'jpeg_quality_number', 'jpeg_quality_value');
    3830
     31
     32
     33
     34
     35
    3936});

  • webp-image-optimization/trunk/js/media.js

    r3163740 r3164521  
    1 document.addEventListener('DOMContentLoaded', function () {
    2     // Handle the Convert to WebP button click using event delegation
    3     document.addEventListener('click', function (e) {
    4         // Check if the clicked element has the ID 'convert-to-webp'
    5         // or is a child of an element with that ID
    6         const button = e.target.closest('#convert-to-webp');
    7         if (!button) return; // Exit if the clicked element is not the button
     1// js/media.js
    82
     3
     4
     5
     6
     7
    98        e.preventDefault();
    109
    11         const attachmentId = button.dataset.attachmentId;
     10        var button = $(this);
     11        var attachmentId = button.data('attachment-id');
    1212
    1313        if (!attachmentId) {
    … …  
    1717
    1818        // Disable the button to prevent multiple clicks and update its text
    19         button.disabled = true;
    20         const originalButtonText = button.textContent;
    21         button.textContent = 'Converting...';
     19        button.;
     20        ;
     21        button.text;
    2222
    2323        // Prepare the data to be sent in the POST request
    24         const data = new URLSearchParams();
    25         data.append('action', 'webp_convert_attachment');
    26         data.append('nonce', webpImageOptimization.nonce);
    27         data.append('attachment_id', attachmentId);
     24        var data = {
     25            action: 'webp_convert_attachment',
     26            nonce: webpImageOptimization.nonce,
     27            attachment_id: attachmentId
     28        };
    2829
    29         // Send AJAX POST request using fetch
    30         fetch(webpImageOptimization.ajax_url, {
    31             method: 'POST',
    32             headers: {
    33                 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
    34             },
    35             body: data.toString()
    36         })
    37         .then(response => response.json())
    38         .then(response => {
     30        // Send AJAX POST request using jQuery
     31        $.post(webpImageOptimization.ajax_url, data, function(response) {
    3932            if (response.success) {
    40                 alert('Image successfully converted to WebP. The original image has NOT been deleted from your server. Please refresh to view.');
    41 
    42                 // Optionally, update the attachment's image preview to the WebP version
    43                 // This depends on how your Media Library displays images
    44                 // For example:
    45                 const mediaItem = document.getElementById('attachment-' + attachmentId);
    46                 if (mediaItem) {
    47                     const img = mediaItem.querySelector('img');
    48                     if (img && response.data.webp_url) {
    49                         img.src = response.data.webp_url;
    50                     }
    51                 }
    52 
    53                 // Replace the button with a "WebP" label
    54                 const label = document.createElement('span');
    55                 label.className = 'webp-image-optimization__label';
    56                 label.style.color = 'green';
    57                 label.style.fontWeight = 'bold';
    58                 label.textContent = 'WebP conversion succesful, refresh to view.';
    59                 button.parentNode.replaceChild(label, button);
     33                alert('Image successfully converted to WebP.');
     34                // Optionally, refresh the page or update the image preview
     35                location.reload(); // Refresh to see changes
    6036            } else {
    6137                alert('Conversion failed: ' + response.data);
    6238                // Re-enable the button in case of failure
    63                 button.disabled = false;
    64                 button.textContent = originalButtonText;
     39                button.;
     40                button.text;
    6541            }
    66         })
    67         .catch(error => {
     42        }).fail(function(xhr, status, error) {
    6843            alert('An error occurred: ' + error);
    6944            // Re-enable the button in case of error
    70             button.disabled = false;
    71             button.textContent = originalButtonText;
     45            button.;
     46            button.text;
    7247        });
    7348    });

  • webp-image-optimization/trunk/webp-image-optimization.php

    r3163740 r3164521  
    33Plugin Name: WebP Image Optimization
    44Plugin URI: https://github.com/adgardner1392/webp-image-optimization
    5 Description: Automatically converts uploaded images to WebP format and resizes them. Also allows manual conversion from the Media Library.
    6 Version: 1.3.0
     5Description: Automatically converts uploaded images to WebP format and resizes them. Also allows manual conversion from the Media Library.
     6Version: 1.3.
    77Author: Adam Gardner
    88Author URI: https://github.com/adgardner1392
    … …  
    2727            plugin_dir_url( __FILE__ ) . 'css/admin.css',
    2828            array(),
    29             '1.0'
     29            '1.'
    3030        );
    3131
    … …  
    3535            plugin_dir_url( __FILE__ ) . 'js/admin.js',
    3636            array( 'jquery' ),
    37             '1.0',
     37            '1.',
    3838            true
    3939        );
    … …  
    5353            plugin_dir_url( __FILE__ ) . 'js/media.js',
    5454            array( 'jquery' ),
    55             '1.0',
     55            '1.',
    5656            true
    5757        );
    … …  
    239239function webp_image_optimization_max_width_render() {
    240240    $options = get_option( 'webp_image_optimization_settings' );
    241     $max_width = isset( $options['max_width'] ) ? esc_attr( $options['max_width'] ) : '';
    242     echo '<input type="number" name="webp_image_optimization_settings[max_width]" value="' . esc_attr( $max_width ) . '" />';
     241    $max_width = isset( $options['max_width'] ) ? esc_attr( $options['max_width'] ) : '';
     242    echo '<input type="number" name="webp_image_optimization_settings[max_width]" value="' . esc_attr( $max_width ) . '" />';
    243243}
    244244
    … …  
    248248function webp_image_optimization_max_height_render() {
    249249    $options = get_option( 'webp_image_optimization_settings' );
    250     $max_height = isset( $options['max_height'] ) ? esc_attr( $options['max_height'] ) : '';
    251     echo '<input type="number" name="webp_image_optimization_settings[max_height]" value="' . esc_attr( $max_height ) . '" />';
     250    $max_height = isset( $options['max_height'] ) ? esc_attr( $options['max_height'] ) : '';
     251    echo '<input type="number" name="webp_image_optimization_settings[max_height]" value="' . esc_attr( $max_height ) . '" />';
    252252}
    253253
    … …  
    406406    $webp_file = $file_info['dirname'] . '/' . $file_info['filename'] . '.webp';
    407407
     408
     409
     410
     411
     412
    408413    // Determine WebP quality
    409414    $webp_quality = isset( $options['webp_quality'] ) ? intval( $options['webp_quality'] ) : 80;
    … …  
    423428            if ( $image->writeImage( $webp_file ) ) {
    424429                $image->destroy();
     430
    425431                return $webp_file;
    426432            }
    … …  
    464470    if ( imagewebp( $image, $webp_file, $webp_quality ) ) { // Quality set from settings
    465471        imagedestroy( $image );
     472
    466473        return $webp_file;
    467474    }
    … …  
    547554 * Add Convert to WebP button to attachment edit fields
    548555 */
    549 function webp_image_optimization_add_convert_button( $form_fields, $post ) {
     556function webp_image_optimization_add_( $form_fields, $post ) {
    550557    // Check if the attachment is an image
    551558    if ( strpos( $post->post_mime_type, 'image/' ) !== false ) {
    552         // Check if the image is already WebP
    553559        $file_info = pathinfo( get_attached_file( $post->ID ) );
    554560        $extension = strtolower( $file_info['extension'] );
     561
    555562        if ( $extension !== 'webp' ) {
     563
    556564            $form_fields['convert_to_webp'] = array(
    557565                'label' => esc_html__( 'Convert to WebP', 'webp-image-optimization' ),
    558566                'input' => 'html',
    559                 'html'  => '<button type="button" class="button" id="convert-to-webp" data-attachment-id="' . esc_attr( $post->ID ) . '">' . esc_html__( 'Convert to WebP', 'webp-image-optimization' ) . '</button>',
     567                'html'  => '<button type="button" class="buttonconvert-to-webp" data-attachment-id="' . esc_attr( $post->ID ) . '">' . esc_html__( 'Convert to WebP', 'webp-image-optimization' ) . '</button>',
    560568            );
    561569        }
    … …  
    563571    return $form_fields;
    564572}
    565 add_filter( 'attachment_fields_to_edit', 'webp_image_optimization_add_convert_button', 10, 2 );
     573add_filter( 'attachment_fields_to_edit', 'webp_image_optimization_add_attachment_buttons', 10, 2 );
     574
    566575
    567576/**
    … …  
    615624    }
    616625
    617     // Get attachment MIME type
    618     $mime_type = get_post_mime_type( $attachment_id );
    619 
    620     // Only process images
    621     if ( strpos( $mime_type, 'image/' ) === false ) {
    622         wp_send_json_error( 'The selected attachment is not an image.' );
    623     }
    624 
    625     // Check if already converted to WebP by checking if the file extension is .webp
    626     $file_info = pathinfo( $original_file );
    627     $extension = strtolower( $file_info['extension'] );
    628     if ( $extension === 'webp' ) {
    629         wp_send_json_error( 'The selected attachment is already a WebP image.' );
    630     }
    631 
    632626    // Perform the conversion using existing function
    633627    $webp_converted_file = webp_image_optimization_convert_to_webp( $original_file );
    … …  
    652646    // Update the attachment's 'guid' and 'post_mime_type'
    653647    wp_update_post( array(
    654         'ID' => $attachment_id,
    655         'guid' => $webp_url,
     648        'ID' => $attachment_id,
     649        'guid' => $webp_url,
    656650        'post_mime_type' => 'image/webp',
    657651    ) );
    658652
    659     // Regenerate attachment metadata for WebP
    660     require_once( ABSPATH . 'wp-admin/includes/image.php' );
    661     $metadata = wp_generate_attachment_metadata( $attachment_id, $webp_converted_file );
    662     if ( ! $metadata ) {
    663         wp_send_json_error( 'Failed to regenerate attachment metadata.' );
    664     }
    665     wp_update_attachment_metadata( $attachment_id, $metadata );
    666 
    667     // Remove association with previous WebP attachment if any
    668     delete_post_meta( $attachment_id, '_webp_image_optimization_webp' );
    669 
    670653    wp_send_json_success( array( 'webp_url' => $webp_url ) );
    671654}
     655
     656
     657
     658
     659
     660
     661
     662
     663
     664
     665
     666
     667
     668
     669
     670
     671
     672
     673
     674
     675
     676
     677
     678
     679
     680
     681
     682
     683
     684
     685
     686
     687
     688
     689
     690
     691
     692
     693
     694
     695
     696
     697
     698
     699
     700
     701
     702
     703
     704
     705
     706
     707
     708
     709
     710
     711
     712
     713
     714
     715
     716
     717
     718
     719
     720
     721
     722
     723
     724
     725
     726
     727
     728
Note: See TracChangeset for help on using the changeset viewer.