BJ Lazy Load - Version 1.0.7

Version Description

Download this release

Release Info

Developer arontornberg
Plugin Icon 128x128 BJ Lazy Load
Version 1.0.7
Comparing to
See all releases

Code changes from version 1.0.6 to 1.0.7

Files changed (9) hide show
  1. bj-lazy-load.php +4 -2
  2. inc/class-bjll-adminpage.php +77 -74
  3. inc/class-bjll-options.php +1 -0
  4. inc/class-bjll.php +15 -2
  5. inc/compat/opera-mini.php +1 -1
  6. inc/scb/AdminPage.php +1 -1
  7. js/bj-lazy-load.js +3 -4
  8. js/bj-lazy-load.min.js +1 -1
  9. readme.txt +11 -2
bj-lazy-load.php CHANGED
@@ -3,8 +3,8 @@
3
  Plugin Name: BJ Lazy Load
4
  Plugin URI: https://wordpress.org/plugins/bj-lazy-load/
5
  Description: Lazy image loading makes your site load faster and saves bandwidth.
6
- Version: 1.0.6
7
- Author: Bjørn Johansen
8
  Author URI: http://twitter.com/bjornjohansen
9
  Text Domain: bj-lazy-load
10
  License: GPL2
@@ -35,6 +35,8 @@ function bj_lazy_load() {
35
 
36
  $bjll_options = new BJLL_Options();
37
  $bjll = new BJLL( $bjll_options );
 
 
38
  }
39
 
40
  add_action( 'plugins_loaded', 'bj_lazy_load' );
3
  Plugin Name: BJ Lazy Load
4
  Plugin URI: https://wordpress.org/plugins/bj-lazy-load/
5
  Description: Lazy image loading makes your site load faster and saves bandwidth.
6
+ Version: 1.0.7
7
+ Author: Bjørn Johansen, Aron Tornberg
8
  Author URI: http://twitter.com/bjornjohansen
9
  Text Domain: bj-lazy-load
10
  License: GPL2
35
 
36
  $bjll_options = new BJLL_Options();
37
  $bjll = new BJLL( $bjll_options );
38
+
39
+ add_image_size( 'tiny-lazy', 30, 30 );
40
  }
41
 
42
  add_action( 'plugins_loaded', 'bj_lazy_load' );
inc/class-bjll-adminpage.php CHANGED
@@ -1,77 +1,80 @@
1
  <?php
2
-
3
-
4
- class BJLL_AdminPage extends scbAdminPage {
5
-
6
- function setup() {
7
- $this->args = array(
8
- 'menu_title' => 'BJ Lazy Load',
9
- 'page_title' => __( 'BJ Lazy Load Options', 'bj-lazy-load' ),
10
- );
11
- }
12
-
13
- function page_content() {
14
-
15
-
16
- $optionfields = array(
17
- array(
18
- 'title' => __( 'Apply to content', 'bj-lazy-load' ),
19
- 'type' => 'radio',
20
- 'name' => 'filter_content',
21
- 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
22
- ),
23
- array(
24
- 'title' => __( 'Apply to text widgets', 'bj-lazy-load' ),
25
- 'type' => 'radio',
26
- 'name' => 'filter_widget_text',
27
- 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
28
- ),
29
- array(
30
- 'title' => __( 'Apply to post thumbnails', 'bj-lazy-load' ),
31
- 'type' => 'radio',
32
- 'name' => 'filter_post_thumbnails',
33
- 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
34
- ),
35
- array(
36
- 'title' => __( 'Apply to gravatars', 'bj-lazy-load' ),
37
- 'type' => 'radio',
38
- 'name' => 'filter_gravatars',
39
- 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
40
- ),
41
- array(
42
- 'title' => __( 'Lazy load images', 'bj-lazy-load' ),
43
- 'type' => 'radio',
44
- 'name' => 'lazy_load_images',
45
- 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
46
- ),
47
- array(
48
- 'title' => __( 'Lazy load iframes', 'bj-lazy-load' ),
49
- 'type' => 'radio',
50
- 'name' => 'lazy_load_iframes',
51
- 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
52
- ),
53
- array(
54
- 'title' => __( 'Placeholder Image URL', 'bj-lazy-load' ),
55
- 'type' => 'text',
56
- 'name' => 'placeholder_url',
57
- 'desc' => sprintf( '<p class="description">%s</p>', __( 'Leave blank for default', 'bj-lazy-load' ) ),
58
- ),
59
- array(
60
- 'title' => __( 'Skip images with classes', 'bj-lazy-load' ),
61
- 'type' => 'text',
62
- 'name' => 'skip_classes',
63
- 'desc' => sprintf( '<p class="description">%s</p>', __( 'Comma separated. Example: "no-lazy, lazy-ignore, image-235"', 'bj-lazy-load' ) ),
64
- ),
65
- array(
66
- 'title' => __( 'Threshold', 'bj-lazy-load' ),
67
- 'type' => 'text',
68
- 'name' => 'threshold',
69
- 'desc' => sprintf( '<p class="description">%s</p>', __( 'How close to the viewport the element should be when we load it. In pixels. Example: 200', 'bj-lazy-load' ) ),
70
- )
71
- );
72
-
73
- echo $this->form_table( $optionfields );
74
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
75
  }
76
-
77
- }
1
  <?php
2
+ if ( ! class_exists( 'BJLL_AdminPage' ) ) {
3
+ class BJLL_AdminPage extends scbAdminPage {
4
+ function setup() {
5
+ $this->args = array(
6
+ 'menu_title' => 'BJ Lazy Load',
7
+ 'page_title' => __( 'BJ Lazy Load Options', 'bj-lazy-load' ),
8
+ );
9
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
10
 
11
+ function page_content() {
12
+
13
+
14
+ $optionfields = array(
15
+ array(
16
+ 'title' => __( 'Apply to content', 'bj-lazy-load' ),
17
+ 'type' => 'radio',
18
+ 'name' => 'filter_content',
19
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
20
+ ),
21
+ array(
22
+ 'title' => __( 'Apply to text widgets', 'bj-lazy-load' ),
23
+ 'type' => 'radio',
24
+ 'name' => 'filter_widget_text',
25
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
26
+ ),
27
+ array(
28
+ 'title' => __( 'Apply to post thumbnails', 'bj-lazy-load' ),
29
+ 'type' => 'radio',
30
+ 'name' => 'filter_post_thumbnails',
31
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
32
+ ),
33
+ array(
34
+ 'title' => __( 'Apply to gravatars', 'bj-lazy-load' ),
35
+ 'type' => 'radio',
36
+ 'name' => 'filter_gravatars',
37
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
38
+ ),
39
+ array(
40
+ 'title' => __( 'Lazy load images', 'bj-lazy-load' ),
41
+ 'type' => 'radio',
42
+ 'name' => 'lazy_load_images',
43
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
44
+ ),
45
+ array(
46
+ 'title' => __( 'Lazy load iframes', 'bj-lazy-load' ),
47
+ 'type' => 'radio',
48
+ 'name' => 'lazy_load_iframes',
49
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
50
+ ),
51
+ array(
52
+ 'title' => __( 'Placeholder Image URL', 'bj-lazy-load' ),
53
+ 'type' => 'text',
54
+ 'name' => 'placeholder_url',
55
+ 'desc' => sprintf( '<p class="description">%s</p>', __( 'Leave blank for default', 'bj-lazy-load' ) ),
56
+ ),
57
+ array(
58
+ 'title' => __( 'Skip images with classes', 'bj-lazy-load' ),
59
+ 'type' => 'text',
60
+ 'name' => 'skip_classes',
61
+ 'desc' => sprintf( '<p class="description">%s</p>', __( 'Comma separated. Example: "no-lazy, lazy-ignore, image-235"', 'bj-lazy-load' ) ),
62
+ ),
63
+ array(
64
+ 'title' => __( 'Threshold', 'bj-lazy-load' ),
65
+ 'type' => 'text',
66
+ 'name' => 'threshold',
67
+ 'desc' => sprintf( '<p class="description">%s</p>', __( 'How close to the viewport the element should be when we load it. In pixels. Example: 200', 'bj-lazy-load' ) ),
68
+ ),
69
+ array(
70
+ 'title' => __( 'Use low-res preview image', 'bj-lazy-load' ),
71
+ 'type' => 'radio',
72
+ 'name' => 'preview',
73
+ 'value' => array( 'yes' => __( 'Yes', 'bj-lazy-load' ), 'no' => __( 'No', 'bj-lazy-load' ) ),
74
+ )
75
+ );
76
+ echo $this->form_table( $optionfields );
77
+
78
+ }
79
  }
80
+ }
 
inc/class-bjll-options.php CHANGED
@@ -22,6 +22,7 @@ class BJLL_Options {
22
  'placeholder_url' => '',
23
  'skip_classes' => '',
24
  'threshold' => '200',
 
25
  ) );
26
 
27
  if ( is_admin() ) {
22
  'placeholder_url' => '',
23
  'skip_classes' => '',
24
  'threshold' => '200',
25
+ 'preview' => 'no',
26
  ) );
27
 
28
  if ( is_admin() ) {
inc/class-bjll.php CHANGED
@@ -198,9 +198,20 @@ class BJLL {
198
 
199
  // don't to the replacement if the image is a data-uri
200
  if ( ! preg_match( "/src=['\"]data:image/is", $imgHTML ) ) {
 
 
 
 
 
 
 
 
 
 
 
201
 
202
  // replace the src and add the data-src attribute
203
- $replaceHTML = preg_replace( '/<img(.*?)src=/is', '<img$1src="' . esc_attr( $placeholder_url ) . '" data-lazy-type="image" data-lazy-src=', $imgHTML );
204
 
205
  // also replace the srcset (responsive images)
206
  $replaceHTML = str_replace( 'srcset', 'data-lazy-srcset', $replaceHTML );
@@ -310,7 +321,9 @@ class BJLL {
310
  */
311
  $skip_classes_quoted = array_map( 'preg_quote', $skip_classes );
312
  $skip_classes_ORed = implode( '|', $skip_classes_quoted );
313
- $regex = '/<(\w+)\s[^>]*(?:class|id)\s*=\s*([\'"]).*?[^\-]\b(?:' . $skip_classes_ORed . ')\b[^\-].*?\2[^>]*>.*<\/\\1>/isU';
 
 
314
  return preg_replace( $regex, '', $content );
315
  }
316
 
198
 
199
  // don't to the replacement if the image is a data-uri
200
  if ( ! preg_match( "/src=['\"]data:image/is", $imgHTML ) ) {
201
+
202
+ $placeholder_url_used = $placeholder_url;
203
+ // use low res preview image as placeholder if applicable
204
+ if ( 'yes' == self::_get_option('preview') ) {
205
+ if( preg_match( '/class=["\'].*?wp-image-([0-9]*)/is', $imgHTML, $id_matches ) ) {
206
+ $img_id = intval($id_matches[1]);
207
+ $tiny_img_data = wp_get_attachment_image_src( $img_id, 'tiny-lazy' );
208
+ $tiny_url = $tiny_img_data[0];
209
+ $placeholder_url_used = $tiny_url;
210
+ }
211
+ }
212
 
213
  // replace the src and add the data-src attribute
214
+ $replaceHTML = preg_replace( '/<img(.*?)src=/is', '<img$1src="' . esc_attr( $placeholder_url_used ) . '" data-lazy-type="image" data-lazy-src=', $imgHTML );
215
 
216
  // also replace the srcset (responsive images)
217
  $replaceHTML = str_replace( 'srcset', 'data-lazy-srcset', $replaceHTML );
321
  */
322
  $skip_classes_quoted = array_map( 'preg_quote', $skip_classes );
323
  $skip_classes_ORed = implode( '|', $skip_classes_quoted );
324
+
325
+ $regex = '/<\s*\w*\s*class\s*=\s*[\'"]?(|.*\s)?' . $skip_classes_ORed . '(|\s.*)?[\'"]?.*?>/isU';
326
+
327
  return preg_replace( $regex, '', $content );
328
  }
329
 
inc/compat/opera-mini.php CHANGED
@@ -1,7 +1,7 @@
1
  <?php
2
 
3
  function bjll_compat_operamini() {
4
- if ( false !== strpos( $_SERVER['HTTP_USER_AGENT'], 'Opera Mini' ) ) {
5
  add_filter( 'bjll/enabled', '__return_false' );
6
  }
7
  }
1
  <?php
2
 
3
  function bjll_compat_operamini() {
4
+ if ( isset( $_SERVER['HTTP_USER_AGENT'] ) && false !== strpos( $_SERVER['HTTP_USER_AGENT'], 'Opera Mini' ) ) {
5
  add_filter( 'bjll/enabled', '__return_false' );
6
  }
7
  }
inc/scb/AdminPage.php CHANGED
@@ -242,7 +242,7 @@ abstract class scbAdminPage {
242
  *
243
  * @return string
244
  */
245
- function submit_button( $value = '', $action = 'submit', $class = 'button' ) {
246
 
247
  $args = is_array( $value ) ? $value : compact( 'value', 'action', 'class' );
248
  $args = wp_parse_args( $args, array(
242
  *
243
  * @return string
244
  */
245
+ function submit_button( $value = '', $action = 'submit', $class = 'button button-primary' ) {
246
 
247
  $args = is_array( $value ) ? $value : compact( 'value', 'action', 'class' );
248
  $args = wp_parse_args( $args, array(
js/bj-lazy-load.js CHANGED
@@ -45,10 +45,9 @@ var BJLL = {
45
  },
46
 
47
  show: function( el ) {
48
-
49
  el.className = el.className.replace( /(?:^|\s)lazy-hidden(?!\S)/g , '' );
50
-
51
  el.addEventListener( 'load', function() {
 
52
  BJLL.customEvent( el, 'lazyloaded' );
53
  }, false );
54
 
@@ -56,8 +55,8 @@ var BJLL = {
56
 
57
  if ( 'image' == type ) {
58
  el.setAttribute( 'src', el.getAttribute('data-lazy-src') );
59
- if ( null != el.getAttribute('data-srcset') ) {
60
- el.setAttribute( 'srcset', el.getAttribute('data-srcset') );
61
  }
62
  } else if ( 'iframe' == type ) {
63
  var s = el.getAttribute('data-lazy-src'),
45
  },
46
 
47
  show: function( el ) {
 
48
  el.className = el.className.replace( /(?:^|\s)lazy-hidden(?!\S)/g , '' );
 
49
  el.addEventListener( 'load', function() {
50
+ el.className += " lazy-loaded";
51
  BJLL.customEvent( el, 'lazyloaded' );
52
  }, false );
53
 
55
 
56
  if ( 'image' == type ) {
57
  el.setAttribute( 'src', el.getAttribute('data-lazy-src') );
58
+ if ( null != el.getAttribute('data-lazy-srcset') ) {
59
+ el.setAttribute( 'srcset', el.getAttribute('data-lazy-srcset') );
60
  }
61
  } else if ( 'iframe' == type ) {
62
  var s = el.getAttribute('data-lazy-src'),
js/bj-lazy-load.min.js CHANGED
@@ -1 +1 @@
1
- "use strict";var BJLL_options=BJLL_options||{},BJLL={_ticking:!1,check:function(){if(!BJLL._ticking){BJLL._ticking=!0,"undefined"==typeof BJLL.threshold&&(BJLL.threshold="undefined"!=typeof BJLL_options.threshold?parseInt(BJLL_options.threshold):200);var winH=document.documentElement.clientHeight||body.clientHeight,updated=!1,els=document.getElementsByClassName("lazy-hidden");[].forEach.call(els,function(el){var elemRect=el.getBoundingClientRect();winH-elemRect.top+BJLL.threshold>0&&(BJLL.show(el),updated=!0)}),BJLL._ticking=!1,updated&&BJLL.check()}},show:function(el){el.className=el.className.replace(/(?:^|\s)lazy-hidden(?!\S)/g,""),el.addEventListener("load",function(){BJLL.customEvent(el,"lazyloaded")},!1);var type=el.getAttribute("data-lazy-type");if("image"==type)el.setAttribute("src",el.getAttribute("data-lazy-src")),null!=el.getAttribute("data-srcset")&&el.setAttribute("srcset",el.getAttribute("data-srcset"));else if("iframe"==type){var s=el.getAttribute("data-lazy-src"),div=document.createElement("div");div.innerHTML=s;var iframe=div.firstChild;el.parentNode.replaceChild(iframe,el)}},customEvent:function(el,eventName){var event;document.createEvent?(event=document.createEvent("HTMLEvents"),event.initEvent(eventName,!0,!0)):(event=document.createEventObject(),event.eventType=eventName),event.eventName=eventName,document.createEvent?el.dispatchEvent(event):el.fireEvent("on"+event.eventType,event)}};window.addEventListener("load",BJLL.check,!1),window.addEventListener("scroll",BJLL.check,!1),window.addEventListener("resize",BJLL.check,!1),document.getElementsByTagName("body").item(0).addEventListener("post-load",BJLL.check,!1);
1
+ "use strict";var BJLL_options=BJLL_options||{},BJLL={_ticking:!1,check:function(){if(!BJLL._ticking){BJLL._ticking=!0,"undefined"==typeof BJLL.threshold&&("undefined"!=typeof BJLL_options.threshold?BJLL.threshold=parseInt(BJLL_options.threshold):BJLL.threshold=200);var a=document.documentElement.clientHeight||body.clientHeight,b=!1,c=document.getElementsByClassName("lazy-hidden");[].forEach.call(c,function(c,d,e){var f=c.getBoundingClientRect();a-f.top+BJLL.threshold>0&&(BJLL.show(c),b=!0)}),BJLL._ticking=!1,b&&BJLL.check()}},show:function(a){a.className=a.className.replace(/(?:^|\s)lazy-hidden(?!\S)/g,""),a.addEventListener("load",function(){a.className+=" lazy-loaded",BJLL.customEvent(a,"lazyloaded")},!1);var b=a.getAttribute("data-lazy-type");if("image"==b)a.setAttribute("src",a.getAttribute("data-lazy-src")),null!=a.getAttribute("data-lazy-srcset")&&a.setAttribute("srcset",a.getAttribute("data-lazy-srcset"));else if("iframe"==b){var c=a.getAttribute("data-lazy-src"),d=document.createElement("div");d.innerHTML=c;var e=d.firstChild;a.parentNode.replaceChild(e,a)}},customEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("HTMLEvents"),c.initEvent(b,!0,!0)):(c=document.createEventObject(),c.eventType=b),c.eventName=b,document.createEvent?a.dispatchEvent(c):a.fireEvent("on"+c.eventType,c)}};window.addEventListener("load",BJLL.check,!1),window.addEventListener("scroll",BJLL.check,!1),window.addEventListener("resize",BJLL.check,!1),document.getElementsByTagName("body").item(0).addEventListener("post-load",BJLL.check,!1);
readme.txt CHANGED
@@ -1,11 +1,11 @@
1
  === BJ Lazy Load ===
2
- Contributors: bjornjohansen
3
  Donate link: http://www.kiva.org/
4
  Tags: images, iframes, lazy loading, javascript, optimize, performance, bandwidth
5
  Author URI: http://twitter.com/bjornjohansen
6
  Requires at least: 3.5
7
  Tested up to: 4.3
8
- Stable tag: 1.0.6
9
 
10
  Lazy loading for images and iframes makes your site load faster and saves bandwidth. Uses no external JS libraries and degrades gracefully for non-js users.
11
 
@@ -62,6 +62,15 @@ Check your HTML source or see the magic at work in Web Inspector, FireBug or sim
62
 
63
  == Changelog ==
64
 
 
 
 
 
 
 
 
 
 
65
  = Version 1.0.6 =
66
  * Fixed bug when multiple iframes was on the same line of HTML code
67
 
1
  === BJ Lazy Load ===
2
+ Contributors: bjornjohansen, arontornberg
3
  Donate link: http://www.kiva.org/
4
  Tags: images, iframes, lazy loading, javascript, optimize, performance, bandwidth
5
  Author URI: http://twitter.com/bjornjohansen
6
  Requires at least: 3.5
7
  Tested up to: 4.3
8
+ Stable tag: 1.0.7
9
 
10
  Lazy loading for images and iframes makes your site load faster and saves bandwidth. Uses no external JS libraries and degrades gracefully for non-js users.
11
 
62
 
63
  == Changelog ==
64
 
65
+ = Version 1.0.7 =
66
+ * Update sponsored by Bonnier Tidskrifter
67
+ * Fixed issue with srcset not lazy loading (by krispy1298)
68
+ * Compatibility with BadgeOS plugin (by rohitmanglik)
69
+ * WP's theme style for submit button. (by odie2)
70
+ * Images will now get the lazy-loaded class onload
71
+ * Added optional rudimentary LQIP solution
72
+ * Added working regex for selecting elements to skip
73
+
74
  = Version 1.0.6 =
75
  * Fixed bug when multiple iframes was on the same line of HTML code
76