make creating avatar ✨better✨

OpenVK · Mar 7, 2025 · 04d24aa · 04d24aa
1 parent 77c8e12
commit 04d24aa
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 15 deletions.
diff --git a/Web/Presenters/templates/Group/View.xml b/Web/Presenters/templates/Group/View.xml
@@ -129,13 +129,15 @@
     {var $avatarLink = ((is_null($avatarPhoto) ? FALSE : $avatarPhoto->isAnonymous()) ? "/photo" . ("s/" . base_convert((string) $avatarPhoto->getId(), 10, 32)) : $club->getAvatarLink())}
     <div class="avatar_block" style="position:relative;" data-club="{$club->getId()}">
         {if $thisUser && $club->canBeModifiedBy($thisUser)}
-            <a {if $avatarPhoto}style="display:none"{/if} class="add_image_text" id="add_image">{_add_image}</a>
-            <div {if !$avatarPhoto}style="display:none"{/if} class="avatar_controls">
-                <div class="avatarDelete hoverable"></div>
-                <div class="avatar_variants">
-                    <a class="_add_image hoverable" id="add_image"><span>{_upload_new_picture}</span></a>
-                </div>
-            </div>
+			<div class="avatar_controls">
+				<div {if !$hasAvatar}style="display:none"{/if} class="avatarDelete hoverable"></div>
+				<div class="avatar_variants">
+					<a {if $hasAvatar}style="display:none"{/if} class="_add_image hoverable upload_image" id="add_image">
+					<span>{_add_image}</span></a>
+					<a {if !$hasAvatar}style="display:none"{/if} class="_add_image hoverable set_image" id="add_image">
+					<span>{_upload_new_picture}</span></a>
+				</div>
+			</div>
         {/if}
 
         <a href="{$avatarLink|nocheck}">

diff --git a/Web/Presenters/templates/User/View.xml b/Web/Presenters/templates/User/View.xml
@@ -73,11 +73,13 @@
             {var $hasAvatar = !str_contains($user->getAvatarUrl('miniscule'), "/assets/packages/static/openvk/img/camera_200.png")}
 
             {if $thisUser && $user->getId() == $thisUser->getId()}
-                <a {if $hasAvatar}style="display:none"{/if} class="add_image_text" id="add_image">{_add_image}</a>
-                <div {if !$hasAvatar}style="display:none"{/if} class="avatar_controls">
-                    <div class="avatarDelete hoverable"></div>
+                <div class="avatar_controls">
+                    <div {if !$hasAvatar}style="display:none"{/if} class="avatarDelete hoverable"></div>
                     <div class="avatar_variants">
-                        <a class="_add_image hoverable" id="add_image"><span>{_upload_new_picture}</span></a>
+                        <a {if $hasAvatar}style="display:none"{/if} class="_add_image hoverable upload_image" id="add_image">
+						<span>{_add_image}</span></a>
+                        <a {if !$hasAvatar}style="display:none"{/if} class="_add_image hoverable set_image" id="add_image">
+						<span>{_upload_new_picture}</span></a>
                     </div>
                 </div>
             {/if}

diff --git a/Web/static/js/al_wall.js b/Web/static/js/al_wall.js
@@ -2179,9 +2179,11 @@ $(document).on("click", "#add_image", (e) => {
 
                         document.querySelector("#bigAvatar").src = response.url
                         document.querySelector("#bigAvatar").parentNode.href = "/photo" + response.new_photo
-
-                        document.querySelector(".add_image_text").style.display = "none"
+
                         document.querySelector(".avatar_controls").style.display = "block"
+                        document.querySelector(".avatar_controls .set_image").style.display = "block"
+						document.querySelector(".avatar_controls .avatarDelete").style.display = "block"
+                        document.querySelector(".avatar_controls .upload_image").style.display = "none"
                     }
                 })
             })
@@ -2314,8 +2316,9 @@ $(document).on("click", ".avatarDelete", (e) => {
                     document.querySelector("#bigAvatar").parentNode.href = response.new_photo ? ("/photo" + response.new_photo) : "javascript:void(0)"
 
                     if(!response.has_new_photo) {
-                        document.querySelector(".avatar_controls").style.display = "none"
-                        document.querySelector(".add_image_text").style.display = "block"
+                        document.querySelector(".avatar_controls .set_image").style.display = "none"
+						document.querySelector(".avatar_controls .avatarDelete").style.display = "none"
+                        document.querySelector(".avatar_controls .upload_image").style.display = "block"
                     }
                 }
             })