#264 preparing client side to call upvote API

GanjooRazor/Pages/Index.cshtml.cs

@@ -199,10 +199,13 @@ namespace GanjooRazor.Pages
         {
             return new _AudioPlayerPartialModel()
             {
+                LoggedIn = LoggedIn,
                 Recitations = recitations
             };
         }
 
+        
+
         public async Task<ActionResult> OnPostReply(string replyCommentText, int refPoemId, int refCommentId)
         {
             return await OnPostComment(replyCommentText, refPoemId, refCommentId, -1);
@@ -833,5 +836,20 @@ namespace GanjooRazor.Pages
             }
             return new OkObjectResult(false);
         }
+
+        public async Task<ActionResult> OnPostSwitchRecitationUpVoteAsync(int id)
+        {
+            using (HttpClient secureClient = new HttpClient())
+            {
+                if (await GanjoorSessionChecker.PrepareClient(secureClient, Request, Response))
+                {
+                    return new OkObjectResult(true);
+                }
+                else
+                {
+                    return new BadRequestObjectResult("لطفا از گنجور خارج و مجددا به آن وارد شوید.");
+                }
+            }
+        }
     }
 }

GanjooRazor/Pages/_AudioPlayerPartial.cshtml

@@ -20,6 +20,10 @@
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" href="@($"/AudioClip/?a={recitaion.Id}")" onclick="wpopen(this.href); return false"><i class="recitation-icons recitation-download"></i><span class="w3tooltiptext">دریافت خوانش</span></a>
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" onclick="switchPlayerScrollLock()"><i class="recitation-icons recitation-scrollunlock"></i><span class="w3tooltiptext">قفل متن روی خوانش</span></a>
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" href="@($"/ReportRecitation/?a={recitaion.Id}")" onclick="wpopen(this.href); return false"><i class="recitation-icons recitation-report"></i><span class="w3tooltiptext">گزارش خطا</span></a>
+                @if(Model.LoggedIn)
+                {
+                    <a role="button" class="w3tooltip cursor-pointer recitation-button" onclick="switchRecitationVote(@recitaion.Id)"><i class="recitation-icons recitation-novote" id="@($"recitaion-{recitaion.Id}")"></i><span class="w3tooltiptext">رأی به خوانش</span></a>
+                }
             </div>
             <script>
                 document.getElementById('audio-@(nRecitationIndex + 1)').addEventListener('play', () => {

GanjooRazor/Pages/_AudioPlayerPartial.cshtml.cs

@@ -5,6 +5,7 @@ namespace GanjooRazor.Pages
 {
     public class _AudioPlayerPartialModel : PageModel
     {
+        public bool LoggedIn { get; set; }
         public PublicRecitationViewModel[] Recitations { get; set; }
 
         public string getAudioDesc(PublicRecitationViewModel recitation, bool contributionLink = false)

GanjooRazor/wwwroot/css/p8.css

@@ -1266,6 +1266,15 @@ ol {
     content: 'lock';
 }
 
+.recitation-novote::after {
+    content: 'favorite_border';
+}
+
+.recitation-vote::after {
+    content: 'favorite';
+}
+
+
 audio{
     width:100%;
 }

GanjooRazor/wwwroot/js/bk.js

@@ -835,4 +835,31 @@ function switch_section(sectionId, buttonId){
         document.getElementById(sectionId).style.display = 'none';
         document.getElementById(buttonId).style.transform = 'none';
     }
+}
+
+function switchRecitationVote(recitationId) {
+    $.ajax({
+        type: "POST",
+        url: '?Handler=SwitchRecitationUpVote',
+        data: {
+            id: recitationId
+        },
+        success: function (upVote) {
+            if (upVote) {
+                document.getElementById('recitaion-' + String(recitationId)).classList.remove('recitation-novote');
+                document.getElementById('recitaion-' + String(recitationId)).classList.add('recitation-vote');
+            }
+            else {
+                document.getElementById('recitaion-' + String(recitationId)).classList.remove('recitation-vote');
+                document.getElementById('recitaion-' + String(recitationId)).classList.add('recitation-novote');
+            }
+            
+        },
+        error: function (e) {
+            if (e.responseText == null)
+                alert(e);
+            else
+                alert(e.responseText);
+        },
+    });
 }