Add a button to reset the focal point

[TheBekker]

With the introduction of Media Picker v3 we can now also create focal points locally on the picker, but we still don't have a way to reset/remove that focal point.

Thinking it could be a simple button or even double clicking the focal point, to reset it.

[nul800sebastiaan]

We've never had a way to reset the focal point before either! 😉

Does it make sense to reset it to the middle though? I've you've changed and saved it, it seems like that would have been intentional. And if you want to change it, as an editor, are you concerned that the focal point is not exactly in the middle? Wouldn't just just want to improve the location?

[nul800sebastiaan]

I'll bring it up with the frontend team and see what they say.

[TheBekker]

And i'll be happy to see if i can't make time to do a PR with a suggestion in the weekend if it helps.

[nul800sebastiaan]

I'll make sure to send you some encouragement based on what they have to say about it :)

[nul800sebastiaan]

@TheBekker Sending encouragement!

From my colleague:

The current convention in the backoffice is to enable the button when the focal point is changed and disable it when you reset it. Then the action is always visible.

If you're up for it, we'd love to see a PR. :)

And for bonus points he says:

We could also implement the same logic to the reset crop button.

[TheBekker]

Awesome, i'll see if i can't whip something up in the weekend.
I'm going to get my 2nd shot, so hopefully that won't take me out :)

[ronaldbarendse]

This would make absolute sense, as the codebase behaves quite differently when the focal point isn't exactly in the middle:

Umbraco-CMS/src/Umbraco.Core/PropertyEditors/ValueConverters/ImageCropperValue.cs

Lines 136 to 137 in 2980ff9

	public bool HasFocalPoint()
	=> FocalPoint != null && (FocalPoint.Left != 0.5m || FocalPoint.Top != 0.5m);

Umbraco-CMS/src/Umbraco.Core/PropertyEditors/ValueConverters/ImageCropperValue.cs

Lines 66 to 75 in 2980ff9

	if (preferFocalPoint && HasFocalPoint()
	|| crop != null && crop.Coordinates == null && HasFocalPoint()
	|| defaultCrop && HasFocalPoint())
	{
	return new ImageUrlGenerationOptions(url) { FocalPoint = new ImageUrlGenerationOptions.FocalPointPosition(FocalPoint.Top, FocalPoint.Left) };
	}
	else if (crop != null && crop.Coordinates != null && preferFocalPoint == false)
	{
	return new ImageUrlGenerationOptions(url) { Crop = new ImageUrlGenerationOptions.CropCoordinates(crop.Coordinates.X1, crop.Coordinates.Y1, crop.Coordinates.X2, crop.Coordinates.Y2) };
	}

---

Just a minor detail in regards to Media Picker v3: when the local focal point is disabled, the code ensures the local focal point is set to null and when merging local crops with the media crops, it will therefore always use the media item one:

Umbraco-CMS/src/Umbraco.Web/PropertyEditors/MediaPicker3Configuration.cs

Lines 94 to 97 in 2980ff9

	if (configuration?.EnableLocalFocalPoint == false)
	{
	imageCropperValue.FocalPoint = null;
	}

Umbraco-CMS/src/Umbraco.Core/PropertyEditors/ValueConverters/ImageCropperValue.cs

Line 178 in 2980ff9

FocalPoint = FocalPoint ?? imageCropperValue?.FocalPoint

But when enabling the local focal point while there is already picked media stored without a focal point, we should ensure it defaults to the middle and doesn't fallback to the media items focal point. Otherwise just opening the picked media and resaving the content would change the focal point from the media item one to the picked media one (I hope this all makes sense) 😃

[TheBekker]

Made PR #10923 .
Since it contains new text, i'm not sure what the requirement are in that regards.

I've added translation for danish and english.
Let me know what you think of this simple suggestion.

[nul800sebastiaan]

This is now merged and will be available in 8.17.0 #10923 👍