WordPress.org
Get WordPress

Plugin Directory

Changeset 2179781


Ignore:
Timestamp:
10/25/2019 05:26:14 AM (6 years ago)
Author:
cloudimageio
Message:

Add version 2.1.0

Location:
cloudimage/trunk
Files:
45 added
7 edited

Legend:

Unmodified
Added
Removed

  • cloudimage/trunk/README.txt

    r2178616 r2179781  
    11=== Plugin Name ===
    2 Cloudimage - Responsive Images as a Service and Image CDN
     2Cloudimage - Fast and Responsive Images as a Service
    33Contributors: @cloudimage
    4 Tags: image CDN, WordPress acceleration, image resizing, image optimisation, image optimization, image acceleration, responsive images
     4Tags: CDN, speed, image resizing, image, SEO, resize, fast, compression, optimize
    55Requires at least: 4.8
    66Tested up to: 5.2.4
    … …  
    1414== Description ==
    1515
    16 = Did you know ? =
     16** Did you know ? **
    1717Faster images increase conversion and thus revenue.
    1818
    19 Cloudimage resizes, optimises, compresses and distributes your images lightning fast on any device around the world over CDN. Apply image filters, custom transformations and watermarks to get the most out of your images and convert more users thanks to beautiful and fast images. Embeds lazyloading and progressive loading effect for best user experience.
    20 
    21 No need to upload your images anywhere, Cloudimage fetches WordPress images on-the-fly, optimises and delivers them over CDN lightning fast.
     19Cloudimage resizes, optimises, compresses and distributes your images lightning fast on any device around the world. Apply image filters, custom transformations and watermarks to get the most out of your images and convert more users thanks to beautiful and fast images. Embeds lazyloading and progressive loading effect for best user experience.
    2220
    2321The Cloudimage Wordpress plugin leverages the Cloudimage v7 API and offers 2 options for making images responsive on your theme:
    … …  
    27252. Using the powerful [Cloudimage Responsive JS Plugin](https://scaleflex.github.io/js-cloudimage-responsive/). The plugin smartly identifies the image container width and delivers the optimal image size. No need for your Theme to support responsive images. It also adds lazyloading and progressive loading effect to your images for best user experience.
    2826
    29 [youtube https://www.youtube.com/watch?v=JFZSE1vYb0k]
     27**No development needed, it's plug-and-play!**
    3028
    31 = No development needed, it's plug-and-play! =
    32 
    33 Simply [register](https://www.cloudimage.io/register_page) for a free Cloudimage account and enjoy fast and responsive images.
     29Simply [register](https://www.cloudimage.io/register_page) for a free Cloudimage account and enjoy fast and responsive images.**
    3430
    3531<a href="http://www.youtube.com/watch?feature=player_embedded&v=JFZSE1vYb0k
    36 " target="_blank"><img src="http://img.youtube.com/vi/JFZSE1vYb0k/0.jpg" 
     32" target="_blank"><img src="http://img.youtube.com/vi/JFZSE1vYb0k/0.jpg"
    3733alt="Cloudimage resizes and optimises your images" width="360" height="270" border="1"/></a>
    3834
    … …  
    4137More information on our paid plans [here](https://www.cloudimage.io/pricing).
    4238
    43 = How does it work =
     39** How does it work **
    4440The Cloudimage plugin will rewrite the WordPress image URLs and replace them with Cloudimage URLs. Your origin images will be downloaded from your storage (WordPress media gallery, S3 bucket, ...), resized by Cloudimage and distributed over CDN. **No development needed**.
    4541
    46 = Coming soon =
     42** Coming soon **
    4743
    4844If you have suggestions for new features, feel free to email us at [[email protected]](mailto:[email protected])
    … …  
    109105* Added option to disable lazyloading if handled by another plugin
    110106
     107= 2.1.0 =
     108* BlurHash implementation of progressive loading as alternative. Newly uploaded images and existing images on updated articles will load with the BlurHash progressive loading effect. See demo (link to blurhash demo page).
     109
     110
    111111== Upgrade Notice ==
    112112

  • cloudimage/trunk/admin/class-cloudimage-admin.php

    r2177313 r2179781  
    170170        $valid['cloudimage_use_responsive_js'] = $input['use_responsive_js'] ? 1 : 0;
    171171        $valid['cloudimage_use_lazy_loading'] = $input['use_lazy_loading'] ? 1 : 0;
     172        $valid['cloudimage_use_blurhash'] = $input['use_blurhash'] ? 1 : 0;
    172173
    173174        return $valid;

  • cloudimage/trunk/admin/css/cloudimage-admin.css

    r2176976 r2179781  
    107107
    108108.cloudimg-box .content-container .form-table:last-of-type th {
    109     width: 280px;
     109    width: 260px;
    110110}
    111111
    … …  
    270270}
    271271
    272 .cloudimage-link, .cloudimage-link:hover {
     272.cloudimage-link, .cloudimage-link:hover, .cloudimage-link:active {
    273273    color: #ffffff;
    274274}

  • cloudimage/trunk/admin/partials/cloudimage-admin-display.php

    r2177313 r2179781  
    2121$use_responsive_js = $options['cloudimage_use_responsive_js'];
    2222$use_lazy_loading = $options['cloudimage_use_lazy_loading'];
     23$use_blurhash = $options['cloudimage_use_blurhash'];
     24
    2325?>
    2426
    … …  
    148150                            </td>
    149151                        </tr>
     152
     153                        <!-- Use blur hash -->
     154                        <tr valign="top" id="blurhash-section" style="display: none;">
     155                            <th scope="row" class="titledesc">
     156                                <label for="<?php echo $this->plugin_name; ?>-use_blurhash">
     157                                    <?php esc_attr_e('Enable BlurHash: ', 'cloudimage'); ?>
     158                                    <div class="tooltip">?
     159                                        <span class="tooltiptext"><?php esc_attr_e('The BlurHash algorithm allows beautiful user experience for progressive loading (* recommended)', 'cloudimage') ?></span>
     160                                    </div>
     161                                    <a href="https://cdn.scaleflex.it/plugins/js-cloudimage-responsive/demo/blur-hash/index.html" class="cloudimage-link" target="_blank" title="BlurHash demo">demo</a>
     162                                </label>
     163
     164                            </th>
     165
     166                            <td class="forminp forminp-text">
     167                                <input type="checkbox" id="<?php echo $this->plugin_name; ?>-use_blurhash"
     168                                       name="<?php echo $this->plugin_name; ?>[use_blurhash]" <?php checked($use_blurhash, 1); ?> >
     169                            </td>
     170                        </tr>
     171
    150172                        </tbody>
    151173                    </table>
    … …  
    177199        var lazy_loading_section = jQuery('#lazy-loading-section');
    178200        var cloudimage_use_lazy_loading = jQuery('#cloudimage-use_lazy_loading');
     201        var blurhash_section = jQuery('#blurhash-section');
     202        var cloudimage_blurhash_checkbox = jQuery('#cloudimage-use_blurhash');
    179203
    180204        //Check if JavaScript is enabled to display lazy loading section
    181205        if (cloudimage_use_responsive_js.is(':checked')) {
    182206            lazy_loading_section.css("display", "table-row");
     207            blurhash_section.css("display", "table-row");
    183208        } else {
    184209            lazy_loading_section.css("display", "none");
     210            blurhash_section.css("display", "none");
    185211        }
    186212
    … …  
    190216                //If checked - show additional table row with checkbox
    191217                lazy_loading_section.css("display", "table-row");
     218                blurhash_section.css("display", "table-row");
    192219            } else {
    193220                //If turned off - hide the additional table row and unmark the checkbox
    194221                lazy_loading_section.css("display", "none");
     222                blurhash_section.css("display", "none");
     223
    195224                cloudimage_use_lazy_loading.prop("checked", false);
     225                cloudimage_blurhash_checkbox.prop("checked", false);
    196226            }
    197227        });

  • cloudimage/trunk/cloudimage.php

    r2178550 r2179781  
    22
    33/**
    4  * Cloudimage - Responsive Images as a Service and Image CDN
     4 * Cloudimage - Responsive Images as a Service
    55 *
    66 *
    … …  
    1010 *
    1111 * @wordpress-plugin
    12  * Plugin Name:       Cloudimage - Responsive Images as a Service and Image CDN
     12 * Plugin Name:       Cloudimage - Responsive Images as a Service
    1313 * Description:       The easiest way to <strong>deliver lightning fast images</strong> to your users.
    14  * Version:           2.0.5
     14 * Version:           2.1.0
    1515 * Author:            Cloudimage
    1616 * Author URI:        https://cloudimage.io
    … …  
    3131 * Rename this for your plugin and update it as you release new versions.
    3232 */
    33 define( 'CLOUDIMAGE_VERSION', '2.0.5' );
     33define( 'CLOUDIMAGE_VERSION', '2.1.0' );
    3434
    3535/**
    … …  
    6161
    6262/**
     63 * Install composer dependencies
     64 */
     65require_once plugin_dir_path(__FILE__) . 'vendor/autoload.php';
     66
     67/**
    6368 * Begins execution of the plugin.
    6469 *

  • cloudimage/trunk/includes/class-cloudimage.php

    r2177313 r2179781  
    8383            $this->version = CLOUDIMAGE_VERSION;
    8484        } else {
    85             $this->version = '2.0.5';
     85            $this->version = '2.1.0';
    8686        }
    8787        $this->plugin_name = 'cloudimage';

  • cloudimage/trunk/public/class-cloudimage-public.php

    r2177313 r2179781  
    2121 * @author     Cloudimage <[email protected]>
    2222 */
     23
     24use kornrunner\Blurhash\Blurhash;
     25
    2326class Cloudimage_Public
    2427{
    … …  
    7073
    7174    /**
     75     * Check for using blur hash function
     76     *
     77     * @since    2.0.6
     78     * @access   private
     79     * @var      string $cloudimage_use_blurhash 0 or 1 regarding is we have to use blurhash
     80     */
     81    private $cloudimage_use_blurhash;
     82
     83    /**
    7284     * Define all the classes you want to skip - only used in $cloudimage_use_responsive_js
    7385     * TODO: Not fiished to implemetended
    … …  
    125137        $this->cloudimage_add_default_low_quality = $this->cloudimage_options['cloudimage_add_default_low_quality'];
    126138        $this->cloudimage_placeholder_url = $this->cloudimage_options['cloudimage_placeholder_url'];
     139        $this->cloudimage_use_blurhash = $this->cloudimage_options['cloudimage_use_blurhash'];
    127140    }
    128141
    … …  
    282295                    && !preg_match("/ci-src=['\"].*['\"]/is", $imgHTML)) {
    283296                    $image_src = '';
     297                    $image_blurhash = '';
    284298
    285299                    if ($this->cloudimage_add_default_low_quality) {
    … …  
    296310                    }
    297311
     312                    //If blurhash is actived, search for attachment ID and get calculated value
     313                    if ($this->cloudimage_use_blurhash) {
     314                        if (preg_match('/class=["\'].*?wp-image-([0-9]*)/is', $imgHTML, $id_matches)) {
     315                            $img_id = intval($id_matches[1]);
     316                            //Check if id is image
     317                            if (wp_attachment_is_image($img_id)) {
     318                                $image_blurhash = wp_get_attachment_metadata($img_id);
     319                                $image_blurhash = isset($image_blurhash['image_meta']['blurhash']) ? $image_blurhash['image_meta']['blurhash'] : '';
     320                            }
     321                        }
     322                        $image_blurhash =  isset($image_blurhash) ? 'ci-blur-hash="' . esc_attr($image_blurhash) . '" ' : '';
     323                    }
     324
    298325                    // replace the src and add the data-src attribute
    299326                    $replaceHTML = preg_replace('/<img(.*?)src=/is', '<img$1' . $image_src . ' ci-src=', $imgHTML);
    … …  
    301328                    // also replace the srcset (responsive images)
    302329                    $replaceHTML = str_replace('srcset', 'ci-srcset', $replaceHTML);
     330
    303331                    // replace sizes to avoid w3c errors for missing srcset
    304332                    $replaceHTML = str_replace('sizes', 'ci-sizes', $replaceHTML);
    305333
     334                    //Add blurhash option before the class, we attached to static and generic piece of HTML
     335                    $replaceHTML = str_replace('class', $image_blurhash . 'class', $replaceHTML);
    306336
    307337                    // In case of No JS put back the correct tag
    … …  
    400430        $width = isset($size_meta['width']) ? $size_meta['width'] : 0;
    401431        $height = isset($size_meta['height']) ? $size_meta['height'] : 0;
     432
     433        //Calculate blurhash only if we have thumb, checkbox is switched on and we dont't have already calculated value
     434        if (isset($meta['sizes']['thumbnail']['file']) && $this->cloudimage_use_blurhash && !isset($meta['image_meta']['blurhash'])) {
     435            //Get file path including upload dir
     436            $pathinfo = pathinfo($meta['file']);
     437
     438            //Get main upload dir
     439            $wp_upload_dir = wp_upload_dir();
     440
     441            //Get basedir
     442            $upload_dir = $wp_upload_dir['basedir'];
     443
     444            //Clear of the path if organizing by year and month is not turned on
     445            $dir_name = ($pathinfo['dirname'] === ".") ? '/' : '/' . $pathinfo['dirname'] . '/';
     446
     447            //Return 0 if the WordPress uploads directory does not exist or attachment is not image
     448            if (!is_dir($upload_dir) || !wp_attachment_is_image($id)) {
     449                return 0;
     450            }
     451
     452            //Construct full path to file
     453            $full_file_path = $upload_dir . $dir_name . $meta['sizes']['thumbnail']['file'];
     454
     455            //Calculate the blurhash for the image from thumbnail
     456            $blurhash = $this->calculate_blurhash($full_file_path);
     457
     458            //Only update fields if we have blurhash, different from zero
     459            if ($blurhash !== 0)
     460            {
     461                //Add in array of meta data new field - blurhash
     462                $meta['image_meta']['blurhash'] = $blurhash;
     463
     464                //Update the attachment with the new information in the database
     465                wp_update_attachment_metadata($id, $meta);
     466            }
     467        }
    402468
    403469        return [
    … …  
    434500
    435501        //Only make URLs rewriting if we dont't want to use JavaScript responsive plugin. Otherwise the JS should handle all the responsive optimization.
    436         if (!$this->cloudimage_use_responsive_js) {
    437             if (substr($img_url, 0, strlen('https://' . $domain . '/v7/')) !== 'https://' . $domain . '/v7/') {
    438                 $url = 'https://' . $domain . '/v7/' . $img_url;
    439             }
    440 
    441             if (strpos($url, '?') === false) {
    442                 $url .= '?';
    443             }
    444 
    445             if ($img_func) {
    446                 $url .= '&func=' . $img_func;
    447             }
    448 
    449             if ($img_size) {
    450                 if (isset($img_size['w']) && $img_size['w'] > 0) {
    451                     $url .= '&w=' . $img_size['w'];
    452                 }
    453 
    454                 if (isset($img_size['h']) && $img_size['h'] > 0) {
    455                     $url .= '&h=' . $img_size['h'];
    456                 }
    457             }
    458 
    459             if ($img_filters) {
    460                 foreach ($img_filters as $filter_name => $filter_value) {
    461                     $url .= '&' . $filter_name ($filter_value ? '=' . $filter_value : '');
    462                 }
    463             }
    464 
    465             $url = str_replace('?&', '?', $url);
    466 
    467             $url = trim($url, '?');
    468         }
     502        if ($this->cloudimage_use_responsive_js) {
     503            return $url;
     504        }
     505
     506        if (substr($img_url, 0, strlen('https://' . $domain . '/v7/')) !== 'https://' . $domain . '/v7/') {
     507            $url = 'https://' . $domain . '/v7/' . $img_url;
     508        }
     509
     510        if (strpos($url, '?') === false) {
     511            $url .= '?';
     512        }
     513
     514        if ($img_func) {
     515            $url .= '&func=' . $img_func;
     516        }
     517
     518        if ($img_size) {
     519            if (isset($img_size['w']) && $img_size['w'] > 0) {
     520                $url .= '&w=' . $img_size['w'];
     521            }
     522
     523            if (isset($img_size['h']) && $img_size['h'] > 0) {
     524                $url .= '&h=' . $img_size['h'];
     525            }
     526        }
     527
     528        if ($img_filters) {
     529            foreach ($img_filters as $filter_name => $filter_value) {
     530                $url .= '&' . $filter_name ($filter_value ? '=' . $filter_value : '');
     531            }
     532        }
     533
     534        $url = str_replace('?&', '?', $url);
     535
     536        $url = trim($url, '?');
    469537
    470538
    … …  
    510578        // Update $size_meta in the function if we sizes asked are bigger than original
    511579        $size = $this->cloudimage_get_size($size_meta, $meta);
    512 
    513580
    514581        return [
    … …  
    603670    private function cloudimage_get_size(&$size_array, $meta)
    604671    {
     672        //Check if we have not set width and height
     673        if (!isset($meta['width']) && !isset($meta['height']))
     674        {
     675            return [
     676                'w' => 0,
     677                'h' => 0,
     678            ];
     679        }
     680
    605681        // use min not to resize the images to bigger size than original one
    606682        $size_array['width'] = min($size_array['width'], $meta['width']);
    … …  
    792868    }
    793869
     870    /**
     871     * @param $file_path string The full path to file
     872     * @return int|string Return calculation of blurhash or 0 in case of error
     873     */
     874    private function calculate_blurhash($file_path)
     875    {
     876
     877        //Return 0 if file path is not correct
     878        if (!is_readable($file_path)) {
     879            return 0;
     880        }
     881
     882        list($width, $height) = getimagesize($file_path);
     883
     884        //Blurhash script doesn't work for big images for now
     885        if ($width > 550) {
     886            return 0;
     887        }
     888
     889        //Get image object from file path
     890        $image = $this->get_image_matrix($file_path);
     891
     892        //Bits operation of Blurhash algorithm
     893        $pixels = [];
     894        for ($y = 0; $y < $height; ++$y) {
     895            $row = [];
     896
     897            for ($x = 0; $x < $width; ++$x) {
     898                $rgb = imagecolorat($image, $x, $y);
     899
     900                $r = ($rgb >> 16) & 0xFF;
     901                $g = ($rgb >> 8) & 0xFF;
     902                $b = $rgb & 0xFF;
     903
     904                $row[] = [$r, $g, $b];
     905            }
     906            $pixels[] = $row;
     907        }
     908
     909        $components_x = 4;
     910        $components_y = 3;
     911
     912        //Get the Blurhash from the external class
     913        $blurhash = Blurhash::encode($pixels, $components_x, $components_y);
     914
     915        return $blurhash;
     916    }
     917
     918    /**
     919     * Get image from path with PHP builted in methods
     920     *
     921     * @param $full_file_path string Full path to file
     922     * @return bool|false|resource
     923     */
     924    private function get_image_matrix($full_file_path)
     925    {
     926        //Check with exif_imagetype with byte method for additional validation
     927        $file_type = exif_imagetype($full_file_path); //Reference to exif_imagetype: https://www.php.net/manual/en/function.exif-imagetype.php
     928
     929        //Allowed types of images, additionally can add more
     930        $allowed_img_types = array(
     931            1,  // [] gif
     932            2,  // [] jpg
     933            3,  // [] png
     934        );
     935
     936        //Check if it is allowed type
     937        if (!in_array($file_type, $allowed_img_types)) {
     938            return false;
     939        }
     940
     941        //Choose the right one build in PHP method for create new image
     942        switch ($file_type) {
     943            case 1 :
     944                $image = imagecreatefromgif($full_file_path);
     945                break;
     946            case 2 :
     947                $image = imagecreatefromjpeg($full_file_path);
     948                break;
     949            case 3 :
     950                $image = imagecreatefrompng($full_file_path);
     951                break;
     952        }
     953        return $image;
     954    }
    794955}
Note: See TracChangeset for help on using the changeset viewer.