Skip to content

Commit d7fa228

Browse files
committed
Simplify & initial release
1 parent f76c389 commit d7fa228

File tree

2 files changed

+87
-51
lines changed

2 files changed

+87
-51
lines changed

plugin.php

Lines changed: 51 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<?php
22

33
/*
4-
Plugin Name: WPThumb Retina
5-
Description: Retinafy your images.
6-
Version: 0.1
4+
Plugin Name: WPThumb Srcset
5+
Description: Automatic high resolution retina images using srcset.
6+
Version: 1.0
77
Author: Human Made Limited
88
Author URI: http://hmn.md/
99
*/
@@ -25,78 +25,78 @@
2525
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
2626
*/
2727

28-
class WPThumb_Retina {
28+
class HM_WordPress_Srcset {
2929

30-
private $plugin_url;
31-
private $placeholder;
32-
private $original_images = array();
30+
private $plugin_url;
31+
private $multipliers;
3332

3433
function __construct() {
3534

36-
$this->plugin_url = plugin_dir_url( __FILE__ );
37-
$this->placeholder = $this->plugin_url . 'blank.gif';
35+
$this->plugin_url = plugin_dir_url( __FILE__ );
36+
$this->multipliers = apply_filters( 'hm_wp_srcset', array( 2, 3 ) );
3837

39-
register_activation_hook( __FILE__ , array( $this, 'plugin_activation_check' ) );
38+
register_activation_hook( __FILE__ , array( $this, 'plugin_activation_check' ) );
4039

4140
add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
4241

43-
add_filter( 'image_downsize', array( $this, 'action' ), 100, 3 );
42+
add_filter( 'image_downsize', array( $this, 'image_downsize' ), 100, 3 );
4443

4544
add_filter( 'image_send_to_editor', array( $this, 'image_send_to_editor' ), 100, 8 );
4645
add_filter( 'tiny_mce_before_init', array( $this, 'modify_mce_options' ), 100 );
4746

4847
}
4948

50-
/**
51-
* plugin_activation_check()
52-
*
53-
* Replace "plugin" with the name of your plugin
54-
*/
55-
function plugin_activation_check() {
56-
57-
if ( version_compare( PHP_VERSION, '5.3', '<' ) ) {
49+
/**
50+
* plugin_activation_check()
51+
*
52+
* Replace "plugin" with the name of your plugin
53+
*/
54+
function plugin_activation_check() {
55+
56+
if ( version_compare( PHP_VERSION, '5.4', '<' ) ) {
5857
deactivate_plugins( basename( __FILE__ ) );
59-
wp_die( "PHP 5.3 or higher is required to use this plugin." );
60-
}
58+
wp_die( "PHP 5.3 or higher is required to use this plugin." );
59+
}
6160

6261
if ( ! class_exists( 'WP_Thumb' ) ) {
6362
deactivate_plugins( basename( __FILE__ ) );
64-
wp_die( "WP Thumb is required to use this plugin." );
63+
wp_die( "WP Thumb is required to use this plugin." );
6564
}
6665

67-
}
66+
}
6867

6968
/**
7069
* Enqueue Retina-fy scripts.
7170
*/
7271
function enqueue_scripts() {
7372

7473
wp_enqueue_script( 'wpthumb_srcset', $this->plugin_url . '/srcset-polyfill/build/srcset.min.js', false, false, true );
75-
74+
7675
}
7776

7877

79-
function action( $null, $attachment_id, $size ) {
80-
78+
function image_downsize( $null, $attachment_id, $size ) {
79+
8180
add_filter( 'wp_get_attachment_image_attributes', $closure = function( $attr, $attachment ) use ( $attachment_id, $size, &$closure ) {
8281

8382
remove_filter( 'wp_get_attachment_image_attributes', $closure );
84-
83+
8584
// Prevent firing this filter for all images on the page.
8685
if ( $attachment_id != $attachment->ID )
8786
return $attr;
8887

8988
$requested_image = wp_get_attachment_image_src( $attachment_id, $size );
9089
$size_args = array( 'width' => $requested_image[1], 'height' => $requested_image[2] );
91-
90+
9291
$attr['src'] = $requested_image[0];
93-
92+
9493
$srcset = array();
9594

96-
if ( $src = $this->get_alt_img_src( $attachment_id, $size_args, 2 ) )
95+
if ( $src = $this->get_alt_img_src( $attachment_id, $size_args, 2 ) ) {
9796
array_push( $srcset, sprintf( '%s 2x', $src ) );
98-
99-
$attr['srcset'] = implode( ', ', $srcset );
97+
}
98+
99+
$attr['srcset'] = implode( ', ', $srcset );
100100

101101
return $attr;
102102

@@ -110,45 +110,44 @@ function action( $null, $attachment_id, $size ) {
110110
function image_send_to_editor( $html, $attachment_id, $caption, $title, $align, $url, $size, $alt = '' ) {
111111

112112
$requested_image = wp_get_attachment_image_src( $attachment_id, $size );
113+
$size_args = array( 'width' => $requested_image[1], 'height' => $requested_image[2] );
114+
$srcset = array();
113115

114116
$attr['src'] = $requested_image[0];
115-
116-
$srcset = array();
117117

118-
if ( $src = $this->get_alt_img_src( $attachment_id, $size_args, 2 ) )
118+
if ( $src = $this->get_alt_img_src( $attachment_id, $size_args, 2 ) ) {
119119
array_push( $srcset, sprintf( '%s 2x', $src ) );
120-
120+
}
121+
121122
$html = preg_replace( '/src="\w*"/', 'src="' . $src . '"', $html );
122-
$html = str_replace( '/>', 'srcset=' . implode( ', ', $srcset ) . ' />', $html );
123+
$html = str_replace( '/>', 'srcset="' . implode( ', ', $srcset ) . '" />', $html );
123124

124125
return $html;
125126

126127
}
127128

128129
/**
129130
* Get the src for an alternate sized version of an attachment.
130-
*
131+
*
131132
* @param string/int $attachment_id
132133
* @param Array $size array of width, height args.
133134
* @param int $multiplier return src for image at x times the size.
134135
* @return string src.
135136
*/
136137
function get_alt_img_src( $attachment_id, Array $size, $multiplier ) {
137138

138-
$original_image = @getimagesize( get_attached_file( $attachment_id ) );
139-
140-
$alt_size = array(
141-
'width' => $size['width'] * $multiplier,
142-
'height' => $size['height'] * $multiplier,
139+
$alt_size = array(
140+
$size['width'] * $multiplier,
141+
$size['height'] * $multiplier,
143142
);
144-
145-
if ( $original_image[0] < $alt_size['width'] || $original_image[1] < $alt_size['height'] )
146-
return null;
147143

148-
return wpthumb(
149-
get_attached_file( $attachment_id ),
150-
sprintf( 'width=%d&height=%d&crop=1', $alt_size['width'], $alt_size['height'] )
151-
);
144+
$alt_img = wp_get_attachment_image_src( $attachment_id, $alt_size );
145+
146+
if ( $alt_img[1] != $alt_size[0] && $alt_img[2] != $alt_size[1] ) {
147+
return;
148+
}
149+
150+
return $alt_img[0];
152151

153152
}
154153

@@ -172,8 +171,9 @@ function modify_mce_options( $init ) {
172171
}
173172

174173
return $init;
174+
175175
}
176176

177177
}
178178

179-
$retina = new WPThumb_Retina();
179+
$retina = new HM_WordPress_Srcset();

readme.txt

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
=== WordPress Srcset ===
2+
3+
Contributors: mattheu
4+
Tags: srcset, retina, images, high-res
5+
Requires at least: 4.0
6+
Tested up to: 4.0
7+
Stable tag: 1.0
8+
License: GPLv2 or later
9+
License URI: http://www.gnu.org/licenses/gpl-2.0.html
10+
11+
Very simple plugin to get retina images on your WordPress site. Automatically load high resoloution images using the new srcset attribute.
12+
13+
== Description ==
14+
15+
The new srcset attribute has recently dropped in Chrome and Firefox. It is the simplest way to get retina ready images on your site.
16+
17+
This plugin will automatically add the srcset attribute to your images if a suitable retina sized image can be found.
18+
19+
It also includes a JS polyfill to ensure that this works on all browsers - not just those that support srcset.
20+
21+
Note that this plugin does not handle generation of the alternative images, and this should either be done manually or using another plugin. See installation instructions for more information.
22+
23+
== Installation ==
24+
25+
There are 2 ways to use the plugin:
26+
27+
1. You will either need to manually register image sizes for 2x versions of your images in your theme.
28+
2. Use an on the fly image generation solution such as [WPThumb](https://github.com/humanmade/WPThumb).
29+
30+
Example of how to register high resoloution versions of an image.
31+
`add_image_size( 'small', '100', '100' );
32+
add_image_size( 'small-2x', '200', '200' );`
33+
34+
== Changelog ==
35+
36+
1.0 - Initial release. High res images for WordPress using srcset attribute and srcset-polyfill

0 commit comments

Comments
 (0)