Skip to content

Commit 3278d28

Browse files
Merge pull request #1120 from cloudinary/develop
3.3.0 Feedback (from develop to UAT)
2 parents 2c07b1c + d4dc651 commit 3278d28

File tree

7 files changed

+76
-57
lines changed

7 files changed

+76
-57
lines changed

css/cloudinary.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

js/asset-edit.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

languages/cloudinary.pot

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ msgid ""
44
msgstr ""
55
"Project-Id-Version: Cloudinary STABLETAG\n"
66
"Report-Msgid-Bugs-To: https://github.com/cloudinary/cloudinary_wordpress\n"
7-
"POT-Creation-Date: 2026-01-09 13:06:24+00:00\n"
7+
"POT-Creation-Date: 2026-01-14 08:33:58+00:00\n"
88
"MIME-Version: 1.0\n"
99
"Content-Type: text/plain; charset=utf-8\n"
1010
"Content-Transfer-Encoding: 8bit\n"
@@ -559,7 +559,7 @@ msgstr ""
559559

560560
#: php/class-media.php:3219 php/ui/component/class-plan-details.php:119
561561
#: php/ui/component/class-plan-status.php:128
562-
#: ui-definitions/settings-pages.php:567 ui-definitions/settings-sidebar.php:44
562+
#: ui-definitions/settings-pages.php:568 ui-definitions/settings-sidebar.php:44
563563
msgid "Transformations"
564564
msgstr ""
565565

@@ -573,7 +573,7 @@ msgid ""
573573
msgstr ""
574574

575575
#: php/class-media.php:3225 ui-definitions/settings-image.php:174
576-
#: ui-definitions/settings-pages.php:593 ui-definitions/settings-video.php:260
576+
#: ui-definitions/settings-pages.php:594 ui-definitions/settings-video.php:260
577577
msgid "See examples"
578578
msgstr ""
579579

@@ -855,7 +855,7 @@ msgstr ""
855855
#: php/delivery/class-lazy-load.php:424 php/delivery/class-lazy-load.php:534
856856
#: ui-definitions/settings-image.php:27 ui-definitions/settings-image.php:244
857857
#: ui-definitions/settings-pages.php:105 ui-definitions/settings-pages.php:198
858-
#: ui-definitions/settings-pages.php:953 ui-definitions/settings-video.php:27
858+
#: ui-definitions/settings-pages.php:958 ui-definitions/settings-video.php:27
859859
msgid "Preview"
860860
msgstr ""
861861

@@ -1339,8 +1339,8 @@ msgid "Apply Changes"
13391339
msgstr ""
13401340

13411341
#: php/ui/component/class-button.php:36 php/ui/component/class-panel.php:58
1342-
#: ui-definitions/settings-pages.php:603 ui-definitions/settings-pages.php:738
1343-
#: ui-definitions/settings-pages.php:917
1342+
#: ui-definitions/settings-pages.php:604 ui-definitions/settings-pages.php:739
1343+
#: ui-definitions/settings-pages.php:922
13441344
msgid "Save Changes"
13451345
msgstr ""
13461346

@@ -1893,12 +1893,12 @@ msgid ""
18931893
"Media Library%4$s."
18941894
msgstr ""
18951895

1896-
#: ui-definitions/settings-image.php:189 ui-definitions/settings-pages.php:571
1896+
#: ui-definitions/settings-image.php:189 ui-definitions/settings-pages.php:572
18971897
#: ui-definitions/settings-video.php:275
18981898
msgid "What are transformations?"
18991899
msgstr ""
19001900

1901-
#: ui-definitions/settings-image.php:190 ui-definitions/settings-pages.php:572
1901+
#: ui-definitions/settings-image.php:190 ui-definitions/settings-pages.php:573
19021902
#: ui-definitions/settings-video.php:276
19031903
msgid ""
19041904
"A set of parameters included in a Cloudinary URL to programmatically "
@@ -2248,104 +2248,104 @@ msgstr ""
22482248
msgid "Edit asset"
22492249
msgstr ""
22502250

2251-
#: ui-definitions/settings-pages.php:579
2251+
#: ui-definitions/settings-pages.php:580
22522252
msgid "Asset transformations"
22532253
msgstr ""
22542254

2255-
#: ui-definitions/settings-pages.php:585
2255+
#: ui-definitions/settings-pages.php:586
22562256
#. translators: The link to transformation reference.
22572257
msgid ""
22582258
"Specify the asset transformations using Cloudinary URL transformation "
22592259
"syntax. See %1$sreference%2$s for all available transformations and syntax."
22602260
msgstr ""
22612261

2262-
#: ui-definitions/settings-pages.php:618
2263-
msgid "Text Overlay"
2262+
#: ui-definitions/settings-pages.php:619
2263+
msgid "Text overlay"
22642264
msgstr ""
22652265

2266-
#: ui-definitions/settings-pages.php:626
2266+
#: ui-definitions/settings-pages.php:627
22672267
#. Translators: The HTML for opening and closing link tags.
22682268
msgid ""
22692269
"The text overlay feature allows you to place text on top of an asset. Learn "
22702270
"more about %1$stext overlays%2$s and how to use them effectively."
22712271
msgstr ""
22722272

2273-
#: ui-definitions/settings-pages.php:641
2273+
#: ui-definitions/settings-pages.php:642
22742274
msgid "Color"
22752275
msgstr ""
22762276

2277-
#: ui-definitions/settings-pages.php:651
2277+
#: ui-definitions/settings-pages.php:652
22782278
msgid "Font Face"
22792279
msgstr ""
22802280

2281-
#: ui-definitions/settings-pages.php:654
2281+
#: ui-definitions/settings-pages.php:655
22822282
msgid "Arial (sans-serif)"
22832283
msgstr ""
22842284

2285-
#: ui-definitions/settings-pages.php:655
2285+
#: ui-definitions/settings-pages.php:656
22862286
msgid "Verdana (sans-serif)"
22872287
msgstr ""
22882288

2289-
#: ui-definitions/settings-pages.php:656
2289+
#: ui-definitions/settings-pages.php:657
22902290
msgid "Times New Roman (serif)"
22912291
msgstr ""
22922292

2293-
#: ui-definitions/settings-pages.php:657
2293+
#: ui-definitions/settings-pages.php:658
22942294
msgid "Courier New (monospace)"
22952295
msgstr ""
22962296

2297-
#: ui-definitions/settings-pages.php:658
2297+
#: ui-definitions/settings-pages.php:659
22982298
msgid "Georgia (serif)"
22992299
msgstr ""
23002300

2301-
#: ui-definitions/settings-pages.php:666
2301+
#: ui-definitions/settings-pages.php:667
23022302
msgid "Font Size"
23032303
msgstr ""
23042304

2305-
#: ui-definitions/settings-pages.php:682
2305+
#: ui-definitions/settings-pages.php:683
23062306
msgid "Text"
23072307
msgstr ""
23082308

2309-
#: ui-definitions/settings-pages.php:694 ui-definitions/settings-pages.php:873
2309+
#: ui-definitions/settings-pages.php:695 ui-definitions/settings-pages.php:878
23102310
msgid "Position"
23112311
msgstr ""
23122312

2313-
#: ui-definitions/settings-pages.php:719 ui-definitions/settings-pages.php:898
2313+
#: ui-definitions/settings-pages.php:720 ui-definitions/settings-pages.php:903
23142314
msgid "X Offset"
23152315
msgstr ""
23162316

2317-
#: ui-definitions/settings-pages.php:726 ui-definitions/settings-pages.php:905
2317+
#: ui-definitions/settings-pages.php:727 ui-definitions/settings-pages.php:910
23182318
msgid "Y Offset"
23192319
msgstr ""
23202320

2321-
#: ui-definitions/settings-pages.php:752 ui-definitions/settings-pages.php:931
2321+
#: ui-definitions/settings-pages.php:753 ui-definitions/settings-pages.php:936
23222322
msgid "Reset All"
23232323
msgstr ""
23242324

2325-
#: ui-definitions/settings-pages.php:767
2326-
msgid "Image Overlay"
2325+
#: ui-definitions/settings-pages.php:768
2326+
msgid "Image overlay"
23272327
msgstr ""
23282328

2329-
#: ui-definitions/settings-pages.php:775
2329+
#: ui-definitions/settings-pages.php:776
23302330
#. Translators: The HTML for opening and closing link tags.
23312331
msgid ""
23322332
"The image overlay feature allows you to place an image on top of an asset. "
23332333
"Learn more about %1$simage overlays%2$s and how to use them effectively."
23342334
msgstr ""
23352335

2336-
#: ui-definitions/settings-pages.php:794
2336+
#: ui-definitions/settings-pages.php:795
23372337
msgid "Select Image"
23382338
msgstr ""
23392339

2340-
#: ui-definitions/settings-pages.php:839
2340+
#: ui-definitions/settings-pages.php:840
23412341
msgid "Size"
23422342
msgstr ""
23432343

2344-
#: ui-definitions/settings-pages.php:853
2344+
#: ui-definitions/settings-pages.php:856
23452345
msgid "Opacity"
23462346
msgstr ""
23472347

2348-
#: ui-definitions/settings-pages.php:994
2348+
#: ui-definitions/settings-pages.php:999
23492349
msgid "Effects applied successfully!"
23502350
msgstr ""
23512351

php/class-admin.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -298,7 +298,7 @@ public function render() {
298298
$page = $this->get_param( 'current_section' );
299299
}
300300

301-
$this->set_param( 'active_slug', $page['slug'] );
301+
$this->set_param( 'active_slug', isset( $page['slug'] ) ? $page['slug'] : '' );
302302
$setting = $this->init_components( $page, $screen->id );
303303
$this->component = $setting->get_component();
304304
$template = $this->section;

src/css/components/_edit_overlay.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,12 @@
5151
&-offset {
5252
margin-bottom: 20px;
5353

54+
.suffixed {
55+
width: 70%;
56+
position: relative;
57+
top: 5px;
58+
}
59+
5460
.cld-input-text {
5561
margin-bottom: 10px;
5662
}

src/js/asset-edit.js

Lines changed: 25 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -18,25 +18,25 @@ const AssetEdit = {
1818
currentURL: null,
1919

2020
// Transformations Input
21-
transformationsInput: document.getElementById( 'edit_asset.transformations' ),
21+
transformationsInput: document.getElementById( 'edit_asset.edit_affects.transformations' ),
2222

2323
// Text Overlay Inputs
24-
textOverlayColorInput: document.getElementById( 'edit_asset.text_overlay_color' ),
25-
textOverlayFontFaceInput: document.getElementById( 'edit_asset.text_overlay_font_face' ),
26-
textOverlayFontSizeInput: document.getElementById( 'edit_asset.text_overlay_font_size' ),
27-
textOverlayTextInput: document.getElementById( 'edit_asset.text_overlay_text' ),
28-
textOverlayPositionInput: document.getElementById( 'edit_asset.text_overlay_position' ),
29-
textOverlayXOffsetInput: document.getElementById( 'edit_asset.text_overlay_x_offset' ),
30-
textOverlayYOffsetInput: document.getElementById( 'edit_asset.text_overlay_y_offset' ),
24+
textOverlayColorInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_color' ),
25+
textOverlayFontFaceInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_font_face' ),
26+
textOverlayFontSizeInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_font_size' ),
27+
textOverlayTextInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_text' ),
28+
textOverlayPositionInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_position' ),
29+
textOverlayXOffsetInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_x_offset' ),
30+
textOverlayYOffsetInput: document.getElementById( 'edit_asset.edit_affects.text_overlay_y_offset' ),
3131

3232
// Image Overlay Inputs
33-
imageOverlayImageIdInput: document.getElementById( 'edit_asset.image_overlay_image_id' ),
34-
imageOverlayPublicIdInput: document.getElementById( 'edit_asset.image_overlay_public_id' ),
35-
imageOverlaySizeInput: document.getElementById( 'edit_asset.image_overlay_size' ),
36-
imageOverlayOpacityInput: document.getElementById( 'edit_asset.image_overlay_opacity' ),
37-
imageOverlayPositionInput: document.getElementById( 'edit_asset.image_overlay_position' ),
38-
imageOverlayXOffsetInput: document.getElementById( 'edit_asset.image_overlay_x_offset' ),
39-
imageOverlayYOffsetInput: document.getElementById( 'edit_asset.image_overlay_y_offset' ),
33+
imageOverlayImageIdInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_image_id' ),
34+
imageOverlayPublicIdInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_public_id' ),
35+
imageOverlaySizeInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_size' ),
36+
imageOverlayOpacityInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_opacity' ),
37+
imageOverlayPositionInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_position' ),
38+
imageOverlayXOffsetInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_x_offset' ),
39+
imageOverlayYOffsetInput: document.getElementById( 'edit_asset.edit_affects.image_overlay_y_offset' ),
4040

4141
// Buttons
4242
saveButton: document.getElementById( 'cld-asset-edit-save' ),
@@ -376,6 +376,7 @@ const AssetEdit = {
376376
this.textOverlayMap.forEach(({ input, defaultValue }) => {
377377
if (input) {
378378
input.value = defaultValue;
379+
input.dispatchEvent(new Event('change'));
379380
}
380381
});
381382

@@ -393,6 +394,7 @@ const AssetEdit = {
393394
this.imageOverlayMap.forEach(({ input, defaultValue }) => {
394395
if (input) {
395396
input.value = defaultValue;
397+
input.dispatchEvent(new Event('change'));
396398
}
397399
});
398400

@@ -411,6 +413,10 @@ const AssetEdit = {
411413
// Update preview to remove image overlay
412414
this.preview.setSrc(this.buildSrc());
413415
},
416+
getFormattedPercentageValue( value ) {
417+
const val = value / 100;
418+
return val % 1 === 0 ? val.toFixed(1) : val;
419+
},
414420
buildPlacementQualifiers(positionInput, xOffsetInput, yOffsetInput) {
415421
let placementQualifiers = [];
416422

@@ -457,7 +463,7 @@ const AssetEdit = {
457463
this.imageOverlayYOffsetInput
458464
);
459465

460-
return `${imageLayerDefinition}/fl_layer_apply${placementString}`;
466+
return `${imageLayerDefinition}/c_limit,w_1.0,fl_relative/fl_layer_apply${placementString}`;
461467
},
462468
buildTextOverlay() {
463469
if (!this.textOverlayTextInput || !this.textOverlayTextInput.value.trim()) {
@@ -505,7 +511,7 @@ const AssetEdit = {
505511
this.textOverlayYOffsetInput
506512
);
507513

508-
return `${textLayerDefinition}/fl_layer_apply${placementString}`;
514+
return `${textLayerDefinition}/c_limit,w_0.9,fl_relative/fl_layer_apply${placementString}`;
509515
},
510516
buildSrc() {
511517
const transformations = this.transformationsInput.value;
@@ -591,11 +597,13 @@ const AssetEdit = {
591597
map.forEach(({ key, input, defaultValue }) => {
592598
if (input) {
593599
input.value = (data && data[key] !== undefined) ? data[key] : defaultValue;
600+
input.dispatchEvent(new Event('change'));
594601

595602
// Special handling for color input to initialize color picker
596603
if (key === 'color' && input.value) {
597604
jQuery(this.textOverlayColorInput).iris({ color: input.value });
598605
}
606+
599607
if (key === 'imageId' && input.value) {
600608
this.fetchImageById(input.value).then(attachment => {
601609
AssetEdit.renderImageOverlay(attachment);

ui-definitions/settings-pages.php

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -535,6 +535,7 @@
535535
'edit_asset' => array(
536536
'page_title' => __( 'Edit asset', 'cloudinary' ),
537537
'section' => 'edit-asset',
538+
'slug' => 'edit_affects',
538539
'requires_connection' => true,
539540
array(
540541
'type' => 'row',
@@ -615,7 +616,7 @@
615616
array(
616617
'type' => 'panel',
617618
'collapsible' => 'open',
618-
'title' => __( 'Text Overlay', 'cloudinary' ),
619+
'title' => __( 'Text overlay', 'cloudinary' ),
619620
array(
620621
'type' => 'row',
621622
array(
@@ -764,7 +765,7 @@
764765
array(
765766
'type' => 'panel',
766767
'collapsible' => 'open',
767-
'title' => __( 'Image Overlay', 'cloudinary' ),
768+
'title' => __( 'Image overlay', 'cloudinary' ),
768769
array(
769770
'type' => 'row',
770771
array(
@@ -839,9 +840,11 @@
839840
'title' => __( 'Size', 'cloudinary' ),
840841
'default' => 100,
841842
'slug' => 'image_overlay_size',
843+
'suffix' => '@value px',
842844
'attributes' => array(
843-
'min' => 0,
845+
'min' => 1,
844846
'max' => 1000,
847+
'step' => 1,
845848
'type' => 'range',
846849
'class' => array(
847850
'edit-overlay-range-input',
@@ -853,9 +856,11 @@
853856
'title' => __( 'Opacity', 'cloudinary' ),
854857
'default' => 20,
855858
'slug' => 'image_overlay_opacity',
859+
'suffix' => '@value %',
856860
'attributes' => array(
857-
'min' => 0,
861+
'min' => 1,
858862
'max' => 100,
863+
'step' => 1,
859864
'type' => 'range',
860865
'class' => array(
861866
'edit-overlay-range-input',

0 commit comments

Comments
 (0)