From 12b4f79559d314bcddcf4ec17fce6a33db2b5281 Mon Sep 17 00:00:00 2001
From: Yunus Emre Kalkan <emre.kalkan@volosoft.com>
Date: Mon, 24 Aug 2020 15:36:35 +0300
Subject: [PATCH] cmskit: focus after login improvements

---
 .../Components/Commenting/Default.cshtml      | 10 +++--
 .../Shared/Components/Commenting/default.js   | 38 ++++++++++---------
 2 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/Default.cshtml b/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/Default.cshtml
index c9fee7e7d8..790a66fcd4 100644
--- a/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/Default.cshtml
+++ b/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/Default.cshtml
@@ -60,7 +60,7 @@
                 {
                     @if (CurrentUser.IsAuthenticated)
                     {
-                        <a href="#" class="comment-reply-link" data-reply-id="@id.ToString()">
+                        <a href="#" class="comment-reply-link" data-reply-id="@id.ToString()" id="@($"cms-comment_{Model.EntityType}_{Model.EntityId}_{id}_link")">
                             <i class="fa fa-reply"></i> @L["Reply"]
                         </a>
                     }
@@ -87,7 +87,7 @@
                     </a>
                 }
             </div>
-            <div class="cms-comment-edit-area" data-id="@id.ToString()" style="display:none">
+            <div class="cms-comment-edit-area"  id="@($"cms-comment_{Model.EntityType}_{Model.EntityId}_{id}")" data-id="@id.ToString()" style="display:none">
                 <form class="cms-comment-update-form">
                     <input hidden value="@id.ToString()" name="id"/>
                     <div class="form-group">
@@ -100,7 +100,7 @@
         </div>;
 }
 
-<div class="cms-comment-area" data-entity-type="@Model.EntityType" data-entity-id="@Model.EntityId" id="@($"cms-comment_{Model.EntityType}_{Model.EntityId}")">
+<div class="cms-comment-area" data-entity-type="@Model.EntityType" data-entity-id="@Model.EntityId">
 
     <div class="pl-5 pt-3">
         <h4>
@@ -160,7 +160,9 @@
         <div>
             @if (CurrentUser.IsAuthenticated)
             {
-                @GetCommentArea(null).Invoke(null)
+                <div id="@($"cms-comment_{Model.EntityType}_{Model.EntityId}")">
+                    @GetCommentArea(null).Invoke(null)
+                </div>
             }
             else if (!string.IsNullOrWhiteSpace(Model.LoginUrl))
             {
diff --git a/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/default.js b/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/default.js
index 764a5f74eb..2e6c8e0dac 100644
--- a/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/default.js
+++ b/modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/default.js
@@ -23,8 +23,8 @@
 
                         var commentId = $link.data('id');
 
-                        var $relatedCommentContentArea = $container.find('.cms-comment-content-area[data-id='+ commentId +']');
-                        var $relatedCommentEditFormArea = $container.find('.cms-comment-edit-area[data-id='+ commentId +']');
+                        var $relatedCommentContentArea = $container.find('.cms-comment-content-area[data-id=' + commentId + ']');
+                        var $relatedCommentEditFormArea = $container.find('.cms-comment-edit-area[data-id=' + commentId + ']');
 
                         $relatedCommentContentArea.hide();
                         $relatedCommentEditFormArea.show();
@@ -38,13 +38,13 @@
 
                         var commentId = $button.data('id');
 
-                        var $relatedCommentContentArea = $container.find('.cms-comment-content-area[data-id='+ commentId +']');
-                        var $relatedCommentEditFormArea = $container.find('.cms-comment-edit-area[data-id='+ commentId +']');
-                        var $link = $container.find('.comment-edit-link[data-id='+ commentId +']');
+                        var $relatedCommentContentArea = $container.find('.cms-comment-content-area[data-id=' + commentId + ']');
+                        var $relatedCommentEditFormArea = $container.find('.cms-comment-edit-area[data-id=' + commentId + ']');
+                        var $link = $container.find('.comment-edit-link[data-id=' + commentId + ']');
 
                         $relatedCommentContentArea.show();
                         $relatedCommentEditFormArea.hide();
-                        $link.attr('href','#');
+                        $link.attr('href', '#');
                     });
                 });
             }
@@ -57,9 +57,10 @@
 
                         var replyCommentId = $link.data('reply-id');
 
-                        var $relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id='+ replyCommentId +']');
+                        var $relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id=' + replyCommentId + ']');
 
                         $relatedCommentArea.show();
+                        $relatedCommentArea.find('textarea').focus();
                         $link.removeAttr('href');
                     });
                 });
@@ -70,11 +71,11 @@
 
                         var replyCommentId = $button.data('reply-id');
 
-                        var $relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id='+ replyCommentId +']');
-                        var $replyLink = $container.find('.comment-reply-link[data-reply-id='+ replyCommentId +']');
+                        var $relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id=' + replyCommentId + ']');
+                        var $replyLink = $container.find('.comment-reply-link[data-reply-id=' + replyCommentId + ']');
 
                         $relatedCommentArea.hide();
-                        $replyLink.attr('href','#');
+                        $replyLink.attr('href', '#');
                     });
                 });
             }
@@ -86,7 +87,7 @@
                         e.preventDefault();
 
                         abp.message.confirm(l("MessageDeletionConfirmationMessage"), function (ok) {
-                            if (ok){
+                            if (ok) {
                                 volo.cmsKit.public.comments.commentPublic.delete($link.data('id')
                                 ).then(function () {
                                     widgetManager.refresh($widget);
@@ -136,15 +137,18 @@
             }
 
             function focusOnHash($container) {
-                if (!location.hash.toLowerCase().startsWith('#cms-comment')){
+                if (!location.hash.toLowerCase().startsWith('#cms-comment')) {
                     return;
                 }
 
-                $('html, body').animate(
-                    {
-                        scrollTop: $(location.hash).offset().top + $(this).height() / 2
-                    },
-                    'slow');
+                var $link = $(location.hash + '_link');
+
+                if ($link.length > 0) {
+                    $link.click();
+                }
+                else {
+                    $(location.hash).find('textarea').focus();
+                }
             }
 
             function init() {