Skip to content

Commit 2d7da6e

Browse files
committed
Optimize front-end overlays delivery
1 parent f56fb34 commit 2d7da6e

File tree

7 files changed

+50
-28
lines changed

7 files changed

+50
-28
lines changed

php/class-delivery.php

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -286,8 +286,10 @@ public function filter_out_cloudinary( $content ) {
286286
}
287287

288288
$original_url = $urls[ $result['public_id'] ];
289-
if ( ! empty( $result['transformations'] ) ) {
290-
$original_url = str_replace( $result['transformations'] . '/', '/', $original_url );
289+
// Get merged transformations including overlays.
290+
$merged_transformations = Relate::get_transformations( $result['post_id'], true );
291+
if ( ! empty( $merged_transformations ) ) {
292+
$original_url = str_replace( $merged_transformations . '/', '/', $original_url );
291293
}
292294
$size = $this->media->get_size_from_url( $original_url );
293295
$transformations = $this->media->get_transformations_from_string( $original_url );
@@ -427,8 +429,10 @@ public function create_delivery( $attachment_id ) {
427429
$transformations = null;
428430
// Preserve pre-existing transformations.
429431
if ( $relationship instanceof Relationship ) {
430-
$data = $relationship->get_data();
431-
$transformations = isset( $data['transformations'] ) ? $data['transformations'] : null;
432+
$transformations = Relate::get_transformations( $attachment_id, true );
433+
if ( empty( $transformations ) ) {
434+
$transformations = null;
435+
}
432436
}
433437
$this->delete_size_relationship( $attachment_id );
434438
$size = $this->get_sized( $attachment_id );
@@ -1076,7 +1080,9 @@ public function convert_tags( $content, $context = 'view' ) {
10761080

10771081
$base = $type . ':' . $url;
10781082
$public_id = ! is_admin() ? $relation['public_id'] . '.' . $relation['format'] : null;
1079-
$cloudinary_url = $this->media->cloudinary_url( $relation['post_id'], array(), $relation['transformations'], $public_id );
1083+
// Get merged transformations including overlays.
1084+
$merged_transformations = Relate::get_transformations( $relation['post_id'], true );
1085+
$cloudinary_url = $this->media->cloudinary_url( $relation['post_id'], array(), $merged_transformations, $public_id );
10801086
if ( empty( $cloudinary_url ) ) {
10811087
continue;
10821088
}
@@ -1099,14 +1105,16 @@ public function convert_tags( $content, $context = 'view' ) {
10991105
$base = $type . ':' . $url;
11001106
$relation = $this->known[ $url ];
11011107
$public_id = ! is_admin() ? $relation['public_id'] . '.' . $relation['format'] : null;
1108+
// Get merged transformations including overlays.
1109+
$merged_transformations = Relate::get_transformations( $relation['post_id'], true );
11021110
foreach ( $sizes as $size => $file_name ) {
11031111
$local_url = path_join( dirname( $base ), $file_name );
11041112
if ( isset( $cached[ $local_url ] ) ) {
11051113
$aliases[ $local_url ] = $cached[ $local_url ];
11061114
continue;
11071115
}
11081116

1109-
$cloudinary_url = $this->media->cloudinary_url( $relation['post_id'], explode( 'x', $size ), $relation['transformations'], $public_id );
1117+
$cloudinary_url = $this->media->cloudinary_url( $relation['post_id'], explode( 'x', $size ), $merged_transformations, $public_id );
11101118
// The asset is not ready. Carry on.
11111119
if ( empty( $cloudinary_url ) ) {
11121120
continue;
@@ -1524,8 +1532,10 @@ public function parse_element( $element ) {
15241532
$tag_element['context'] = $post_context;
15251533
if ( ! empty( $this->known[ $url ] ) && ! empty( $this->known[ $url ]['public_id'] ) ) {
15261534
$item = $this->known[ $url ];
1527-
if ( ! empty( $item['transformations'] ) ) {
1528-
$tag_element['transformations'] = $this->media->get_transformations_from_string( $item['transformations'], $tag_element['type'] );
1535+
// Get merged transformations including overlays.
1536+
$merged_transformations = Relate::get_transformations( $item['post_id'], true );
1537+
if ( ! empty( $merged_transformations ) ) {
1538+
$tag_element['transformations'] = $this->media->get_transformations_from_string( $merged_transformations, $tag_element['type'] );
15291539
}
15301540
// Get the public ID and append the extension if it's missing.
15311541
$public_id = $item['public_id'];

php/class-media.php

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1434,8 +1434,6 @@ public function cloudinary_url( $attachment_id, $size = array(), $transformation
14341434
}
14351435

14361436
$pre_args['transformation'] = $this->get_transformations( $attachment_id, $transformations, $overwrite_transformations );
1437-
$pre_args['text_overlay'] = $this->get_text_overlay( $attachment_id );
1438-
$pre_args['image_overlay'] = $this->get_image_overlay( $attachment_id );
14391437

14401438
// Make a copy as not to destroy the options in \Cloudinary::cloudinary_url().
14411439
$args = $pre_args;

php/class-relate.php

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -120,17 +120,36 @@ public static function update_transformations_overlay( $attachment_id, $overlay_
120120
* @return array|string
121121
*/
122122
public static function get_transformations( $attachment_id, $as_string = false ) {
123-
static $media;
123+
static $media, $cache = array();
124124
if ( ! $media ) {
125125
$media = get_plugin_instance()->get_component( 'media' );
126126
}
127127

128+
// Create cache key based on attachment ID and return type.
129+
$cache_key = $attachment_id . '_' . ( $as_string ? 'string' : 'array' );
130+
131+
// Return cached value if available.
132+
if ( isset( $cache[ $cache_key ] ) ) {
133+
return $cache[ $cache_key ];
134+
}
135+
128136
$relationship = Relationship::get_relationship( $attachment_id );
129137
$transformations = $relationship->transformations;
138+
139+
$text_overlay = self::get_overlay( $attachment_id, 'text_overlay' );
140+
$image_overlay = self::get_overlay( $attachment_id, 'image_overlay' );
141+
142+
// Merge transformations with overlays.
143+
$parts = array_filter( array( $transformations, $image_overlay, $text_overlay ) );
144+
$transformations = ! empty( $parts ) ? implode( '/', $parts ) : '';
145+
130146
if ( ! $as_string ) {
131147
$transformations = ! empty( $transformations ) ? $media->get_transformations_from_string( $transformations, $relationship->asset_type ) : array();
132148
}
133149

150+
// Cache the result.
151+
$cache[ $cache_key ] = $transformations;
152+
134153
return $transformations;
135154
}
136155

@@ -152,7 +171,7 @@ public static function get_overlay( $attachment_id, $overlay_type ) {
152171
if ( ! empty( $overlay_data ) ) {
153172
$decoded = json_decode( $overlay_data, true );
154173
if ( is_array( $decoded ) && isset( $decoded['transformation'] ) ) {
155-
return rawurlencode( $decoded['transformation'] );
174+
return $decoded['transformation'];
156175
}
157176
}
158177

php/connect/class-api.php

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -369,14 +369,6 @@ public function cloudinary_url( $public_id = null, $args = array(), $size = arra
369369
$url_parts[] = self::generate_transformation_string( $args['transformation'], $args['resource_type'] );
370370
}
371371

372-
if ( ! empty( $args['text_overlay'] ) ) {
373-
$url_parts[] = $args['text_overlay'];
374-
}
375-
376-
if ( ! empty( $args['image_overlay'] ) ) {
377-
$url_parts[] = $args['image_overlay'];
378-
}
379-
380372
if ( $attachment_id ) {
381373
$public_id = $this->get_public_id( $attachment_id, $args, $public_id );
382374
}

php/media/class-global-transformations.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -658,7 +658,7 @@ public function transformations_column_value( $column_name, $attachment_id ) {
658658

659659
$item = $this->media->plugin->get_component( 'assets' )->get_asset( $attachment_id, 'dataset' );
660660
if ( ! empty( $item['data']['public_id'] ) ) {
661-
$text = __( 'Add transformations', 'cloudinary' );
661+
$text = __( 'Add transformation effects', 'cloudinary' );
662662
$transformations = Relate::get_transformations( $attachment_id, true );
663663
$text_overlay = Relate::get_overlay( $attachment_id, 'text_overlay' );
664664
$image_overlay = Relate::get_overlay( $attachment_id, 'image_overlay' );

src/js/asset-edit.js

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -54,9 +54,14 @@ const AssetEdit = {
5454
const item = JSON.parse( this.wrap.dataset.item );
5555
this.id = item.ID;
5656
this.base = item.base + item.size + '/';
57-
this.publicId = item.file;
5857
this.transformationsInput.value = item.transformations ? item.transformations : '';
5958

59+
if(!item?.file) {
60+
return;
61+
}
62+
63+
this.publicId = '/' + item.file.split('/').slice(-2).join('/');
64+
6065
// Set up centralized text overlay mapping as a property
6166
this.textOverlayMap = [
6267
{ key: 'text', input: this.textOverlayTextInput, defaultValue: '', event: 'input' },
@@ -536,10 +541,7 @@ const AssetEdit = {
536541
jQuery(this.textOverlayColorInput).iris({ color: input.value });
537542
}
538543
if (key === 'imageId' && input.value) {
539-
console.log( input.value );
540544
this.fetchImageById(input.value).then(attachment => {
541-
console.log( AssetEdit.renderImageOverlay );
542-
console.log(attachment);
543545
AssetEdit.renderImageOverlay(attachment);
544546
});
545547
}

ui-definitions/settings-pages.php

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -948,12 +948,13 @@
948948
'cld-ui-preview',
949949
),
950950
array(
951-
'type' => 'row',
951+
'type' => 'panel',
952+
'title' => __( 'Preview', 'cloudinary' ),
952953
array(
953-
'type' => 'panel',
954+
'type' => 'row',
954955
'attributes' => array(
955956
'wrap' => array(
956-
'style' => 'width: 100%; display: flex; justify-content: center; align-items: center;',
957+
'style' => 'display: flex; justify-content: center; align-items: center;',
957958
),
958959
),
959960
array(

0 commit comments

Comments
 (0)