Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Josefine 27 posts 139 karma points
    Aug 28, 2020 @ 07:14
    Josefine
    0

    Help me understand Image Cropper

    I have created an image cropper for mobile.

    Once I have set how I want the image for "smartphone" it is nice in mobile devices but it takes the same cropping on my "desktop image" as well.

    But if I go back to the Umbraco backoffice and set focal point, the "desktop image" is also nice.

    How do I remove the crop that my "desktop image" should not have, so I do not have to go back to Umbraco and set focal point?

    enter image description here

    The url for "desktop image" before set image cropper for "smartphone":

    flowerpower.jpg?anchor=center&mode=crop&width=1440&height=334&rnd=132430781512630000
    

    The url after set image cropper:

    flowerpower.jpg?crop=0,0,0.8240427927927928,0.84750375375375375&cropmode=percentage&width=1440&height=334&rnd=132430782508730000
    

    The url when I go back to Umbraco backoffice and set focal point:

    flowerpower.jpg?center=0.52266666666666661,0.5&mode=crop&width=1440&height=334&rnd=132430784295270000
    

    Thanks, Josefine

  • Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib
    Sep 03, 2020 @ 20:12
    Marc Goodson
    0

    Hi Josefine

    How are you setting the crop for your mobile version in the first place - are you moving the focal point dot, or are you clicking on the crop and using the crop specific controls that appear to zoom and position the image for mobile?

    You should be able to set the crop for the mobile version independently of the main crop.

    When you use GetCropUrl for an Umbraco image if it has no focal point crop information it will default to 'center' - once the focal point is moved and the image saved the url changes to reflect the position of the saved focal point.

    If you are not touching the focal point at all when setting your mobile crop, then this feels like it might be a bug!

    If this is a bug then I guess a workaround would be to create an additional crop called 'desktop' - that could work independently from the mobile crop... but again if you are moving the focal point to try and set and individual crop, be aware t will affect both crops!

    regards

    Marc

  • Josefine 27 posts 139 karma points
    Sep 04, 2020 @ 12:48
    Josefine
    0

    Hi Marc!

    I do not move the focus point, I just click on the crop and use the crop specification controls and then save.

    Thanks for the help. I found this "preferFocalPoint: true" in GetCropUrl that worked. Now I dont need to set the focus point after cropping "smartphone"

     .GetCropUrl (width: 1440, height: 334, preferFocalPoint: true)
    

    Thanks, Josefine

  • Marc Goodson 2141 posts 14344 karma points MVP 8x c-trib
    Sep 04, 2020 @ 15:20
    Marc Goodson
    0

    Cool! - I guess it must be thinking in the absence of crop info - that the crop for the mobile version is better than the default 'center' position - I would normally have a 'desktop' crop set in addition to the mobile one, so I haven't experienced this before - but the preferFocalPoint option I guess achieves the same separation!

    regards

    Marc

Please Sign in or register to post replies

Write your reply to:

Draft