Web: bug - wallpapers aren't placed correctly in saved image

[owocki]

see this screencast:

acceptance criteria:

• fix this bug

[owocki]

@Dgilliams @kuhnchris any interest in this one? if not, ill bounty it

[kuhnchris]

Sure, but, @owocki i noticed this during development: this is very hard depending on the view port set on the new background. Is this one of the new ones?

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__This issue now has a funding of 0.3 ETH (63.27 USD @ $210.89/ETH) attached to it.__

• If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
  
  
  
  • Want to chip in? Add your own contribution here.
  
  
  • Questions? Checkout Gitcoin Help or the Gitcoin Slack
  
  
  • $53,662.72 more funded OSS Work available on the Gitcoin Issue Explorer
  
  

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__Work has been started__.

These users each claimed they can complete the work by 8 months from now.
Please review their action plans below:

1) kuhnchris has started work.

Analyzing the viewport / issue with the background

Learn more on the Gitcoin Issue Details page.

[owocki]

@kuhnchris having any luck? or are you still blocked by docker stuff..

[kuhnchris]

yes and yes, I'll try to setup a local docker now if that works...

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__Work for 0.3 ETH (39.93 USD @ $133.1/ETH) has been submitted by__:

1. @kuhnchris

@owocki please take a look at the submitted work:

• PR by @kuhnchris

---

• Learn more on the Gitcoin Issue Details page
• Want to chip in? Add your own contribution here.
• Questions? Checkout Gitcoin Help or the Gitcoin Slack
• $37,999.42 more funded OSS Work available on the Gitcoin Issue Explorer

[gitcoinbot]

⚡️ A *Always Shipping* Kudos has been sent to @kuhnchris for this issue from @owocki. ⚡️ Nice work @kuhnchris! Your Kudos has automatically been sent in the ETH address we have on file.

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__The funding of 0.3 ETH (33.71 USD @ $112.37/ETH) attached to this issue has been approved & issued to @kuhnchris.__

• Learn more on the Gitcoin Issue Details page
• Questions? Checkout Gitcoin Help or the Gitcoin Slack
• $33,666.54 more funded OSS Work available on the Gitcoin Issue Explorer

[owocki]

hey @kuhnchris i'm seeing this on the new mask feature that was developed... see https://c.gitcoin.co/avatars/dc4a2fb8fee84af6492f66e068d192d7/owocki.svg

any chance your fix for wallpapers could apply to the mask feature? will happily tip if so

[kuhnchris]

Most likely this should work. It depends on how the mask is sized. If the mask-feature is live I can take a look at the test instance if you want.

[kuhnchris]

Just tested - after a couple of adaption also I can be a kawaii anime girl

And regarding spongebob's starfish face man:

diff --git a/app/avatar/utils.py b/app/avatar/utils.py
index 7ef066a7a..f0dcffbdc 100644
--- a/app/avatar/utils.py
+++ b/app/avatar/utils.py
@@ -246,22 +246,29 @@ def build_avatar_component(path, icon_size=None, avatar_size=None):
     scale_factor = icon_size[1] / avatar_component_size[1]
     x_to_center = (icon_size[0] / 2) - ((avatar_component_size[0] * scale_factor) / 2)
     svg = SVG(f'{COMPONENT_BASE}{path}')
-    if path.startswith('Wallpaper'):
+    if path.startswith('Wallpaper') or path.startswith('Makeup'):
         src = transform.fromfile(f'{COMPONENT_BASE}{path}')
-
+
         #       TODO: Consider width aswell...
-        #        if src.width != None:
-        #            src_width = float(re.sub('[^0-9]','', src.width))
-        #        else:
-        #            src_width = 900
+        if src.width is not None:
+            src_width = float(re.sub('[^0-9]','', src.width))
+        else:
+            src_width = 900

         if src.height is not None:
             src_height = float(re.sub('[^0-9]', '', src.height))
         else:
             src_height = 1415
         scale_factor = icon_size[1] / src_height
+        if path.startswith('Makeup'):
+            scale_factor = scale_factor / 2
+
         svg = svg.scale(scale_factor)
-    if not path.startswith('Wallpaper'):
+        if path.startswith('Makeup'):
+            x_to_center = (icon_size[0] / 2) - ((src_width * scale_factor) / 2)
+            svg = svg.move(x_to_center, src_height * scale_factor / 2)
+
+    if not path.startswith('Wallpaper') and not path.startswith('Makeup'):
         svg = svg.scale(scale_factor)
         svg = svg.move(x_to_center, 0)
     return svg

[owocki]

thanks @kuhnchris -- mind submitting a PR with that patch?