docs: #339 fix for the scipt for audio player (forcing auto scroll mode)

This commit is contained in:
Hamid Reza Mohammadi 2022-07-01 18:40:58 +04:30
parent ed2df7ef59
commit cc41293641
10 changed files with 58 additions and 44 deletions

View File

@ -149,7 +149,7 @@
</p>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/js/bk.js?version=29"></script>
<script src="~/js/bk.js?version=30"></script>
<script src="~/js/jplayersupport.js"></script>
<script src="~/js/vaabd.js?version=2"></script>
<script src="~/dist/jplayer/jquery.jplayer.min.js"></script>

View File

@ -104,7 +104,7 @@
</div>
<script src="/lib/jquery/dist/jquery.min.js"></script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
<script src="/js/vaabd.js?version=2"></script>
@if (!string.IsNullOrEmpty(ViewData["GoogleAnalyticsCode"].ToString()))

View File

@ -192,7 +192,7 @@
</div>
<script src="/lib/jquery/dist/jquery.min.js"></script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
<script src="/js/vaabd.js?version=2"></script>
@if (!string.IsNullOrEmpty(ViewData["GoogleAnalyticsCode"].ToString()))

View File

@ -20,7 +20,7 @@
<script>
var playerScrollLock = false;
</script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
@if (Model.GanjoorPage != null && Model.GanjoorPage.NoIndex)
{

View File

@ -19,7 +19,7 @@
<script>
var playerScrollLock = false;
</script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
@if (Model.Poet != null)
{

View File

@ -200,7 +200,7 @@
</div>
<script src="/lib/jquery/dist/jquery.min.js"></script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
<script src="/js/vaabd.js?version=2"></script>
@if (!string.IsNullOrEmpty(ViewData["GoogleAnalyticsCode"].ToString()))

View File

@ -30,7 +30,7 @@
});
</script>
<script src="/lib/diff.js"></script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
</head>
<body>

View File

@ -202,7 +202,7 @@
</div>
<script src="/lib/jquery/dist/jquery.min.js"></script>
<script src="/js/bk.js?version=29"></script>
<script src="/js/bk.js?version=30"></script>
<script src="/js/vaabd.js?version=2"></script>
@if (!string.IsNullOrEmpty(ViewData["GoogleAnalyticsCode"].ToString()))

View File

@ -62,22 +62,16 @@
</div><!-- #hdr2 -->
<div id="fa">
<div id="main-navbar" role="navigation">
@if (Model.LoggedIn)
{
<div class="clear-both">
<div id="main-navbar" role="navigation">
<div class="clear-both">
@if (Model.LoggedIn)
{
<a href="/User" role="button" class="w3tooltip cursor-pointer">
<div class="circled-number">
<i class="noindent-info-button home-icon"></i>
<i class="noindent-info-button user-home-icon"></i>
</div>
<span class="w3tooltiptext">پیشخان</span>
</a>
<a href="/User/MyComments" role="button" class="w3tooltip cursor-pointer">
<div class="circled-number">
<i class="noindent-info-button recitation-comments"></i>
</div>
<span class="w3tooltiptext">حاشیه‌های من</span>
</a>
<a href="/User/MyBookmarks" role="button" class="w3tooltip cursor-pointer">
<div class="circled-number">
<i class="noindent-info-button bookmarking-icon"></i>
@ -90,20 +84,27 @@
</div>
<span class="w3tooltiptext">اعلان‌های من</span>
</a>
<a href="/User/UpVotedRecitations" role="button" class="w3tooltip cursor-pointer">
<div class="circled-number">
<i class="noindent-info-button recitation-listen"></i>
</div>
<span class="w3tooltiptext">خوانش‌های نشان شده</span>
</a>
<a href="/User/History" role="button" class="w3tooltip cursor-pointer">
<div class="circled-number">
<i class="noindent-info-button history-icon"></i>
</div>
<span class="w3tooltiptext">ادامهٔ مطالعه</span>
</a>
</div>
}
<a href="javascript:document.getElementById('logoutform').submit();" role="button" class="w3tooltip cursor-pointer">
<div class="circled-number">
<i class="noindent-info-button logout-icon"></i>
</div>
<span class="w3tooltiptext">خروج</span>
</a>
}
else
{
<a onclick="document.getElementById('id01').style.display='block'" role="button" class="w3tooltip cursor-pointer pagebutton" style="display:inline-table;border: 3px solid black">
ورود کاربر / نام‌نویسی <i class="noindent-info-button account-icon"></i>
</a>
}
</div>
</div>
<div id="maincnt">
@ -321,10 +322,10 @@
<script>
var items = document.querySelectorAll('.menuItem');
for(var i = 0, l = items.length; i < l; i++) {
items[i].style.left = (50 - 35*Math.cos(-0.5 * Math.PI - 2*(1/l)*i*Math.PI)).toFixed(4) + "%";
for (var i = 0, l = items.length; i < l; i++) {
items[i].style.left = (50 - 35 * Math.cos(-0.5 * Math.PI - 2 * (1 / l) * i * Math.PI)).toFixed(4) + "%";
items[i].style.top = (50 + 35*Math.sin(-0.5 * Math.PI - 2*(1/l)*i*Math.PI)).toFixed(4) + "%";
items[i].style.top = (50 + 35 * Math.sin(-0.5 * Math.PI - 2 * (1 / l) * i * Math.PI)).toFixed(4) + "%";
}
</script>
@ -346,18 +347,18 @@
@if (Model.GanjoorPage.Poem.Sections.Where(s => s.SectionType == RMuseum.Models.Ganjoor.PoemSectionType.WholePoem && s.GanjoorMetre != null).Any() || !string.IsNullOrEmpty(Model.GanjoorPage.Poem.OldTag) || !string.IsNullOrEmpty(Model.GanjoorPage.Poem.SourceName))
{
<table>
@if(!Model.MutiPartPoemPage)
@foreach (var s in Model.GanjoorPage.Poem.Sections.Where(s => s.SectionType == RMuseum.Models.Ganjoor.PoemSectionType.WholePoem && s.GanjoorMetre != null).ToList())
{
<tr>
<td>
وزن:
</td>
<td>
<a href="@Html.Raw($"/vazn/?v={Uri.EscapeDataString(s.GanjoorMetre.Rhythm)}&amp;a={Model.GanjoorPage.PoetOrCat.Poet.Id}")">@s.GanjoorMetre.Rhythm</a>
</td>
</tr>
}
@if (!Model.MutiPartPoemPage)
@foreach (var s in Model.GanjoorPage.Poem.Sections.Where(s => s.SectionType == RMuseum.Models.Ganjoor.PoemSectionType.WholePoem && s.GanjoorMetre != null).ToList())
{
<tr>
<td>
وزن:
</td>
<td>
<a href="@Html.Raw($"/vazn/?v={Uri.EscapeDataString(s.GanjoorMetre.Rhythm)}&amp;a={Model.GanjoorPage.PoetOrCat.Poet.Id}")">@s.GanjoorMetre.Rhythm</a>
</td>
</tr>
}
@if (!string.IsNullOrEmpty(Model.GanjoorPage.Poem.OldTag))
{
<tr>

View File

@ -152,6 +152,19 @@ function switchPlayerScrollLock() {
}
function scrollToTargetAdjusted(element) {
var stickyNavbar = document.getElementsByClassName("sticky");
var headerOffset = stickyNavbar.length == 0 ? 0 : document.getElementById('main-navbar').clientHeight;
var elementPosition = element.getBoundingClientRect().top;
var offsetPosition = elementPosition + window.pageYOffset - headerOffset;
window.scrollTo({
top: offsetPosition,
behavior: "smooth"
});
}
function hilightverse(vnum, clr, sc, forceScroll) {
var root = document;
if (typeof root == "string") root = document.getElementById(root);
@ -207,7 +220,7 @@ function hilightverse(vnum, clr, sc, forceScroll) {
if (forceScroll)
if (!!element && element.scrollIntoView) {
element.scrollIntoView();
scrollToTargetAdjusted(element);
}
}
return true;
@ -274,7 +287,7 @@ function hilightverse(vnum, clr, sc, forceScroll) {
if (forceScroll)
if (!!element && element.scrollIntoView) {
element.scrollIntoView();
scrollToTargetAdjusted(element);
}
}
return true;