Skip to content

Commit 3ce87e2

Browse files
selulselul
authored
feat: adds exclude by class filter for lazyload mechanism
2 parents 695794e + 96b1936 commit 3ce87e2

File tree

7 files changed

+123
-7
lines changed

7 files changed

+123
-7
lines changed

‎assets/vue/components/filter-control.vue‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,17 @@
4040
</div>
4141
</div>
4242
</div>
43+
<div class="list-item exclusion-filter"
44+
v-for="(item, index) in filters[this.FILTER_TYPES.CLASS]">
45+
<div class="control">
46+
<div class="tags is-centered has-addons">
47+
<a class="tag is-marginless is-link has-text-left"><i>{{strings.exclude_class_desc}}</i>
48+
<strong>{{index}}</strong></a>
49+
<a class="tag is-marginless is-delete"
50+
@click="removeRule(FILTER_TYPES.CLASS,index)"></a>
51+
</div>
52+
</div>
53+
</div>
4354
</div>
4455
</div>
4556

@@ -52,6 +63,7 @@
5263
<option :value="FILTER_TYPES.FILENAME">{{strings.filter_filename}}</option>
5364
<option :value="FILTER_TYPES.EXT">{{strings.filter_ext}}</option>
5465
<option :value="FILTER_TYPES.URL">{{strings.filter_url}}</option>
66+
<option v-if="type === 'lazyload'" :value="FILTER_TYPES.CLASS">{{strings.filter_class}}</option>
5567
</select>
5668
</span>
5769
</p>
@@ -102,7 +114,8 @@
102114
FILTER_TYPES: {
103115
EXT: 'extension',
104116
URL: 'page_url',
105-
FILENAME: 'filename'
117+
FILENAME: 'filename',
118+
CLASS: 'class'
106119
}
107120
}
108121
},
@@ -154,6 +167,10 @@
154167
this.filter_operator = this.strings.filter_operator_contains;
155168
}
156169
170+
if (event.target.value === this.FILTER_TYPES.CLASS) {
171+
this.filter_operator = this.strings.filter_operator_contains;
172+
}
173+
157174
this.selected_filter = event.target.value;
158175
159176
},

‎inc/admin.php‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -611,13 +611,15 @@ private function get_dashboard_strings() {
611611
'filter_filename' => __( 'Image filename', 'optimole-wp' ),
612612
'filter_url' => __( 'Page URL', 'optimole-wp' ),
613613
'filter_ext' => __( 'Image extension', 'optimole-wp' ),
614+
'filter_class' => __( 'Image class', 'optimole-wp' ),
614615
'exclude_title_optimize' => __( 'Don\'t optimize images if', 'optimole-wp' ),
615616
'exclude_title_lazyload' => __( 'Don\'t lazyload images if', 'optimole-wp' ),
616617
'exclude_filename_desc' => __( 'Image filename contains', 'optimole-wp' ),
617618
'exclude_url_desc' => __( 'Page url contains', 'optimole-wp' ),
618619
'exclude_ext_desc' => __( 'Image extension is', 'optimole-wp' ),
619620
'watch_title_lazyload' => __( 'Lazyload background images for selectors:', 'optimole-wp' ),
620621
'watch_desc_lazyload' => __( 'You can add each CSS selector on a new line or separated by comma(,).', 'optimole-wp' ),
622+
'exclude_class_desc' => __( 'Image tag contains class', 'optimole-wp' ),
621623
'hide' => __( 'Hide', 'optimole-wp' ),
622624
'high_q_title' => __( 'High', 'optimole-wp' ),
623625
'medium_q_title' => __( 'Medium', 'optimole-wp' ),

‎inc/app_replacer.php‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -269,7 +269,17 @@ public function init() {
269269
$this->set_properties();
270270

271271
self::$filters = $this->settings->get_filters();
272-
272+
add_filter(
273+
'optml_possible_lazyload_flags',
274+
function( $strings = array() ) {
275+
foreach ( self::$filters[ Optml_Settings::FILTER_TYPE_LAZYLOAD ][ Optml_Settings::FILTER_CLASS ] as $rule_flag => $status ) {
276+
$strings[] = $rule_flag;
277+
}
278+
return $strings;
279+
},
280+
10,
281+
2
282+
);
273283
}
274284

275285

‎inc/compatibilities/revslider.php‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,24 @@ function should_load() {
2222
* Register integration details.
2323
*/
2424
public function register() {
25-
add_filter( 'optml_ignore_data_opt_flag', [ $this, 'add_data_ignore' ], 10, 3 );
26-
add_filter( 'optml_lazyload_bg_classes', [ $this, 'add_bg_class' ], 10, 1 );
25+
26+
add_filter( 'optml_possible_lazyload_flags', [ $this, 'add_lazyflag' ], 10, 2 );
27+
add_filter( 'optml_ignore_data_opt_flag', [$this, 'add_data_ignore'], 10, 3 );
28+
add_filter( 'optml_lazyload_bg_classes', [$this, 'add_bg_class'], 10, 1 );
29+
}
30+
31+
/**
32+
* Add Slider Revolution lazyload flag.
33+
*
34+
* @param array $strings Old strings.
35+
*
36+
* @return array New flags.
37+
*/
38+
function add_lazyflag( $strings = array() ) {
39+
40+
$strings[] = 'rev-slidebg';
41+
42+
return $strings;
2743
}
2844

2945
/**

‎inc/settings.php‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ class Optml_Settings {
88
const FILTER_EXT = 'extension';
99
const FILTER_URL = 'page_url';
1010
const FILTER_FILENAME = 'filename';
11+
const FILTER_CLASS = 'class';
1112
const FILTER_TYPE_LAZYLOAD = 'lazyload';
1213
const FILTER_TYPE_OPTIMIZE = 'optimize';
1314
/**
@@ -103,6 +104,9 @@ public function get_filters() {
103104
if ( ! isset( $filter_rules[ self::FILTER_URL ] ) ) {
104105
$filters[ $filter_key ][ self::FILTER_URL ] = [];
105106
}
107+
if ( ! isset( $filter_rules[ self::FILTER_CLASS ] ) ) {
108+
$filters[ $filter_key ][ self::FILTER_CLASS ] = [];
109+
}
106110
}
107111

108112
return $filters;

‎inc/tag_replacer.php‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,6 @@ public function init() {
5353
add_filter( 'wp_calculate_image_sizes', array( $this, 'filter_sizes_attr' ), 1, 2 );
5454

5555
}
56-
5756
/**
5857
* Called by hook to replace image tags in content.
5958
*
@@ -137,7 +136,6 @@ public function process_image_tags( $content, $images = array() ) {
137136

138137
$image_sizes = self::image_sizes();
139138
$sizes2crop = self::size_to_crop();
140-
141139
foreach ( $images[0] as $index => $tag ) {
142140
$width = $height = false;
143141
$crop = null;
@@ -221,7 +219,7 @@ public function process_image_tags( $content, $images = array() ) {
221219
$image_tag
222220
);
223221

224-
// If the image is in header, we need to do the regular replace.
222+
// If the image is in header or has a class excluded from lazyload, we need to do the regular replace.
225223
if ( $images['in_header'][ $index ] ) {
226224
$image_tag = $this->regular_tag_replace( $image_tag, $images['img_url'][ $index ], $new_url, $optml_args, $is_slashed, $tag );
227225
} else {

‎tests/test-lazyload-class-exclusion.php‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<?php
2+
/**
3+
* WordPress unit test plugin.
4+
*
5+
* @package Optimole-WP
6+
* @subpackage Tests
7+
* @copyright Copyright (c) 2017, ThemeIsle
8+
* @license http://opensource.org/licenses/gpl-2.0.php GNU Public License
9+
*/
10+
11+
/**
12+
* Class Test_Generic.
13+
*/
14+
class Test_Lazyload_Class_Exclusion extends WP_UnitTestCase
15+
{
16+
17+
public static $sample_attachement;
18+
19+
public function setUp()
20+
{
21+
parent::setUp();
22+
$settings = new Optml_Settings();
23+
$settings->update('service_data', [
24+
'cdn_key' => 'test123',
25+
'cdn_secret' => '12345',
26+
'whitelist' => ['example.com'],
27+
]);
28+
29+
$settings->update('lazyload', 'enabled');
30+
$settings->update('filters', array(
31+
Optml_Settings::FILTER_TYPE_LAZYLOAD => array (
32+
Optml_Settings::FILTER_CLASS => array (
33+
'test' => true,
34+
'whatever' => true,
35+
'testing' => true,
36+
)
37+
)));
38+
Optml_Url_Replacer::instance()->init();
39+
Optml_Tag_Replacer::instance()->init();
40+
Optml_Lazyload_Replacer::instance()->init();
41+
Optml_Manager::instance()->init();
42+
43+
self::$sample_attachement = self::factory()->attachment->create_upload_object(OPTML_PATH . 'assets/img/logo.png');
44+
}
45+
46+
public function test_class_exclusions()
47+
{
48+
$content = '<div>
49+
<img class="something another whatever" src="http://example.org/wp-content/uploads/2019/09/Screenshot.png" alt=""/>;
50+
<img class="test" src="http://example.org/wp-content/uploads/2019/09/img.jpg" alt=""/>;
51+
<img class="testing class" src="http://example.org/img.png" alt=""/>;
52+
</div>';
53+
$replaced_content = Optml_Manager::instance()->process_images_from_content($content);
54+
$this->assertEquals( 3, substr_count( $replaced_content, 'i.optimole.com' ) );
55+
$this->assertNotContains('data-opt-src', $replaced_content);
56+
}
57+
public function test_class_exclusions_does_not_affect_regular_replacement()
58+
{
59+
$content = '<div>
60+
<img class="something another code" src="http://example.org/wp-content/uploads/2019/09/Screenshot.png" alt=""/>;
61+
<img class="whatever_code_test" src="http://example.org/img.jpg" alt=""/>;
62+
</div>';
63+
$replaced_content = Optml_Manager::instance()->process_images_from_content($content);
64+
65+
$this->assertEquals( 4, substr_count( $replaced_content, 'i.optimole.com' ) );
66+
$this->assertEquals( 1, substr_count( $replaced_content, 'data-opt-src' ) );
67+
$this->assertEquals( 1, substr_count( $replaced_content, '<noscript>' ) );
68+
}
69+
}

0 commit comments

Comments
 (0)