From 70f9bcaa1835e05d16851ff552f59d91f63a0b5c Mon Sep 17 00:00:00 2001
From: Hamid Reza Mohammadi <mohammadi.hr@gmail.com>
Date: Mon, 29 Nov 2021 21:11:36 +0330
Subject: [PATCH] #250 moving audio js code to Index.cshtml

---
 GanjooRazor/Pages/Index.cshtml               | 66 +++++++++++++++++---
 GanjooRazor/Pages/_AudioPlayerPartial.cshtml | 52 +--------------
 2 files changed, 61 insertions(+), 57 deletions(-)

diff --git a/GanjooRazor/Pages/Index.cshtml b/GanjooRazor/Pages/Index.cshtml
index 0fb01f13..c9ea07f1 100644
--- a/GanjooRazor/Pages/Index.cshtml
+++ b/GanjooRazor/Pages/Index.cshtml
@@ -82,6 +82,58 @@
         {
             if (Model.GanjoorPage != null && Model.GanjoorPage.Poem.Recitations.Length > 0)
             {
+                <script>
+                    var currentAudio = null;
+                    var verseStart = [];
+                    var verseEnd = [];
+                    var verseIndex = [];
+                    var nLastHighlight = -1;
+                    var vCount = 0;
+
+                    var _setXml = function (xmlUrl) {
+                        $.ajax({
+                            type: "GET",
+                            url: xmlUrl,
+                            dataType: "xml",
+                            success: function (xml) {
+                                var nOneSecondBugFix = 2000;
+                                $(xml).find('OneSecondBugFix').each(function () {
+                                    nOneSecondBugFix = parseInt($(xml).find('OneSecondBugFix').text());
+                                });
+                                var v = 0;
+                                $(xml).find('SyncInfo').each(function () {
+                                    verseStart[v] = parseInt($(this).find('AudioMiliseconds').text()) / nOneSecondBugFix;
+                                    verseIndex[v] = parseInt($(this).find('VerseOrder').text());
+                                    if (v > 0)
+                                        verseEnd[v - 1] = verseStart[v];
+                                    v++;
+                                });
+                                v--;
+                                if (v > 1)
+                                    verseEnd[v] = verseStart[v] + 2 * (verseEnd[v - 1] - verseStart[v - 1]);
+                                vCount = v;
+                            }
+                        });
+                    }
+
+                    var _trackTimeChanged = function (audio) {
+                        var currentTime = audio.currentTime;
+
+                        if (currentTime > 0) {
+                            for (var i = 0; i <= vCount; i++) {
+                                if (currentTime >= verseStart[i] && currentTime <= verseEnd[i]) {
+                                    hilightverse(verseIndex[i], "red", true, playerScrollLock);
+
+                                    if (nLastHighlight != verseIndex[i] && nLastHighlight != -1)
+                                        hilightverse(nLastHighlight, "black", false, false);
+                                    nLastHighlight = verseIndex[i];
+                                    break;
+                                }
+                            }
+                        }
+                    };
+                </script>
+
                 <script src="/dist/jplayer/jquery.jplayer.min.js"></script>
                 <script src="/dist/add-on/jplayer.playlist.min.js"></script>
                 <script>
@@ -98,13 +150,13 @@
                     @for (int x = 1; x < Model.GanjoorPage.Poem.Recitations.Length; x++)
                     {
                         <text>
-                            addpaudio(@x, jlist,
-                                "@Html.Raw($"{GanjooRazor.APIRoot.InternetUrl}/api/audio/file/{Model.GanjoorPage.Poem.Recitations[x].Id}.xml")",
-                                "@Html.Raw(Model.GanjoorPage.Poem.Recitations[x].AudioTitle)",
-                                "@Html.Raw(Model.getAudioDesc(Model.GanjoorPage.Poem.Recitations[x], false))",
-                                "",
-                                "@Html.Raw(Model.GanjoorPage.Poem.Recitations[x].Mp3Url)"
-                            );
+                                addpaudio(@x, jlist,
+                                    "@Html.Raw($"{GanjooRazor.APIRoot.InternetUrl}/api/audio/file/{Model.GanjoorPage.Poem.Recitations[x].Id}.xml")",
+                                    "@Html.Raw(Model.GanjoorPage.Poem.Recitations[x].AudioTitle)",
+                                    "@Html.Raw(Model.getAudioDesc(Model.GanjoorPage.Poem.Recitations[x], false))",
+                                    "",
+                                    "@Html.Raw(Model.GanjoorPage.Poem.Recitations[x].Mp3Url)"
+                                );
                         </text>
                     }
 
diff --git a/GanjooRazor/Pages/_AudioPlayerPartial.cshtml b/GanjooRazor/Pages/_AudioPlayerPartial.cshtml
index a0401ead..055796da 100644
--- a/GanjooRazor/Pages/_AudioPlayerPartial.cshtml
+++ b/GanjooRazor/Pages/_AudioPlayerPartial.cshtml
@@ -2,56 +2,7 @@
 @using DNTPersianUtils.Core
 @{
 }
-<script>
-    var verseStart = [];
-    var verseEnd = [];
-    var verseIndex = [];
-    var nLastHighlight = -1;
-    var vCount = 0;
 
-    var _setXml = function (xmlUrl) {
-        $.ajax({
-            type: "GET",
-            url: xmlUrl,
-            dataType: "xml",
-            success: function (xml) {
-                var nOneSecondBugFix = 2000;
-                $(xml).find('OneSecondBugFix').each(function () {
-                    nOneSecondBugFix = parseInt($(xml).find('OneSecondBugFix').text());
-                });
-                var v = 0;
-                $(xml).find('SyncInfo').each(function () {
-                    verseStart[v] = parseInt($(this).find('AudioMiliseconds').text()) / nOneSecondBugFix;
-                    verseIndex[v] = parseInt($(this).find('VerseOrder').text());
-                    if (v > 0)
-                        verseEnd[v - 1] = verseStart[v];
-                    v++;
-                });
-                v--;
-                if (v > 1)
-                    verseEnd[v] = verseStart[v] + 2 * (verseEnd[v - 1] - verseStart[v - 1]);
-                vCount = v;
-            }
-        });
-    }
-
-    var _trackTimeChanged = function (audio) {
-        var currentTime = audio.currentTime;
-
-        if (currentTime > 0) {
-            for (var i = 0; i <= vCount; i++) {
-                if (currentTime >= verseStart[i] && currentTime <= verseEnd[i]) {
-                    hilightverse(verseIndex[i], "red", true, playerScrollLock);
-
-                    if (nLastHighlight != verseIndex[i] && nLastHighlight != -1)
-                        hilightverse(nLastHighlight, "black", false, false);
-                    nLastHighlight = verseIndex[i];
-                    break;
-                }
-            }
-        }
-    };
-</script>
 
 <div class="container">
     @for (var nRecitationIndex = 0; nRecitationIndex < Model.Recitations.Length; nRecitationIndex++)
@@ -67,9 +18,10 @@
             </div>
             <script>
                 document.getElementById('audio-@(nRecitationIndex + 1)').addEventListener('play', () => {
+                    currentAudio = document.getElementById('audio-@(nRecitationIndex + 1)');
                     var audioList = document.querySelectorAll('audio');
                     audioList.forEach(function(audioElement) {
-                      if(audioElement != document.getElementById('audio-@(nRecitationIndex + 1)')){
+                      if(audioElement != currentAudio){
                           audioElement.pause();
                       }
                     });