Skip to content

Commit a9ee7b7

Browse files
aatanasovdevaatanasovdev
committed
Switch to pixels
1 parent a95cea6 commit a9ee7b7

File tree

5 files changed

+30
-49
lines changed

5 files changed

+30
-49
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.

‎src/css/components/_edit_overlay.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
margin-bottom: 20px;
5353

5454
.suffixed {
55-
width: 80%;
55+
width: 70%;
5656
position: relative;
5757
top: 5px;
5858
}

‎src/js/asset-edit.js‎

Lines changed: 19 additions & 19 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' ),
@@ -85,7 +85,7 @@ const AssetEdit = {
8585
this.imageOverlayMap = [
8686
{ key: 'imageId', input: this.imageOverlayImageIdInput, defaultValue: '', event: 'input' },
8787
{ key: 'publicId', input: this.imageOverlayPublicIdInput, defaultValue: '', event: 'input' },
88-
{ key: 'size', input: this.imageOverlaySizeInput, defaultValue: 20, event: 'input' },
88+
{ key: 'size', input: this.imageOverlaySizeInput, defaultValue: 100, event: 'input' },
8989
{ key: 'opacity', input: this.imageOverlayOpacityInput, defaultValue: 20, event: 'input' },
9090
{ key: 'position', input: this.imageOverlayPositionInput, defaultValue: '', event: 'change' },
9191
{ key: 'xOffset', input: this.imageOverlayXOffsetInput, defaultValue: 0, event: 'input' },
@@ -425,11 +425,11 @@ const AssetEdit = {
425425
}
426426

427427
if (xOffsetInput?.value) {
428-
placementQualifiers.push(`x_${this.getFormattedPercentageValue(xOffsetInput.value)}`);
428+
placementQualifiers.push(`x_${xOffsetInput.value}`);
429429
}
430430

431431
if (yOffsetInput?.value) {
432-
placementQualifiers.push(`y_${this.getFormattedPercentageValue(yOffsetInput.value)}`);
432+
placementQualifiers.push(`y_${yOffsetInput.value}`);
433433
}
434434

435435
return placementQualifiers.length > 0 ? ',' + placementQualifiers.join(',') : '';
@@ -446,7 +446,7 @@ const AssetEdit = {
446446
let transformations = [];
447447

448448
if (this.imageOverlaySizeInput?.value) {
449-
transformations.push(`c_scale,w_${this.getFormattedPercentageValue(this.imageOverlaySizeInput.value)}`);
449+
transformations.push(`c_scale,w_${this.imageOverlaySizeInput.value}`);
450450
}
451451

452452
if (this.imageOverlayOpacityInput?.value) {

‎ui-definitions/settings-pages.php‎

Lines changed: 8 additions & 27 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',
@@ -719,24 +720,14 @@
719720
'title' => __( 'X Offset', 'cloudinary' ),
720721
'default' => 0,
721722
'slug' => 'text_overlay_x_offset',
722-
'suffix' => '%',
723-
'attributes' => array(
724-
'max' => 100,
725-
'min' => -100,
726-
'step' => 1,
727-
),
723+
'suffix' => 'px',
728724
),
729725
array(
730726
'type' => 'number',
731727
'title' => __( 'Y Offset', 'cloudinary' ),
732728
'default' => 0,
733729
'slug' => 'text_overlay_y_offset',
734-
'suffix' => '%',
735-
'attributes' => array(
736-
'max' => 100,
737-
'min' => -100,
738-
'step' => 1,
739-
),
730+
'suffix' => 'px',
740731
),
741732
),
742733
),
@@ -847,12 +838,12 @@
847838
array(
848839
'type' => 'text',
849840
'title' => __( 'Size', 'cloudinary' ),
850-
'default' => 20,
841+
'default' => 100,
851842
'slug' => 'image_overlay_size',
852-
'suffix' => '@value %',
843+
'suffix' => '@value px',
853844
'attributes' => array(
854845
'min' => 1,
855-
'max' => 100,
846+
'max' => 1000,
856847
'step' => 1,
857848
'type' => 'range',
858849
'class' => array(
@@ -912,24 +903,14 @@
912903
'title' => __( 'X Offset', 'cloudinary' ),
913904
'default' => 0,
914905
'slug' => 'image_overlay_x_offset',
915-
'suffix' => '%',
916-
'attributes' => array(
917-
'max' => 100,
918-
'min' => -100,
919-
'step' => 1,
920-
),
906+
'suffix' => 'px',
921907
),
922908
array(
923909
'type' => 'number',
924910
'title' => __( 'Y Offset', 'cloudinary' ),
925911
'default' => 0,
926912
'slug' => 'image_overlay_y_offset',
927-
'suffix' => '%',
928-
'attributes' => array(
929-
'max' => 100,
930-
'min' => -100,
931-
'step' => 1,
932-
),
913+
'suffix' => 'px',
933914
),
934915
),
935916
),

0 commit comments

Comments
 (0)