minor fixes for older-ish browsers

noureddin · Jul 10, 2024 · b5491e2 · b5491e2
1 parent daa3287
commit b5491e2
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 16 deletions.
diff --git a/.scripts.gen.min.js b/.scripts.gen.min.js
diff --git a/Makefile b/Makefile
@@ -32,6 +32,7 @@ index.html: .index.html .scripts.gen.min.js style.min.css .minify.pl
 
 .scripts.gen.min.js: .scripts.js .g.js a.gen.js mappings.js tafsir.js tajlorligilumi.js data.gen.js versligilumi.js res/confetti.min.js javascript.js z.js
 	$P "$<" | perl -CDAS -pe 's/const +say += +console\.log//' | $J | perl -pe 's/;?\s*\Z//' > "$@"
+	# $P "$<" > "$@"
 
 .g.js: .g.ts .g.sh
 	bash .g.sh

diff --git a/a.gen.js b/a.gen.js
@@ -110,8 +110,8 @@ const body_scroll_to_top    = () =>   __scroll_top(el_body)
 const body_scroll_to_bottom = () =>   __scroll_bot(el_body)
 const imla_scroll_to_bottom = () => { __scroll_bot(el_body); __scroll_bot(el_imla_txt) }
 
-const hide_el = (el) => { el.style.visibility = 'hidden';  el.style.opacity =   '0%' }
-const show_el = (el) => { el.style.visibility = 'visible'; el.style.opacity = '100%' }
+const hide_el = (el) => { el.style.visibility = 'hidden';  el.style.opacity = '0' }
+const show_el = (el) => { el.style.visibility = 'visible'; el.style.opacity = '1' }
 
 // tr num & fields() {{{
 // TODO see: https://stackoverflow.com/q/10726638
@@ -416,7 +416,7 @@ function change_mvbtns () {
     mv === 'r' ? 'sidebtns rightside' :
     mv === 'l' ? 'sidebtns leftside'  :
                  ''  /* no class for 'bottom' */
-  el_mvbtns.classList = mv_cls
+  el_mvbtns.className = mv_cls
   el_uthm_txt.classList.toggle('sidebtns', mv_cls)
   el_tl.classList.toggle('right', mv === 'l')
   zz_set('mvbtns', mv)

diff --git a/a.js b/a.js
@@ -41,8 +41,8 @@ const body_scroll_to_top    = () =>   __scroll_top(el_body)
 const body_scroll_to_bottom = () =>   __scroll_bot(el_body)
 const imla_scroll_to_bottom = () => { __scroll_bot(el_body); __scroll_bot(el_imla_txt) }
 
-const hide_el = (el) => { el.style.visibility = 'hidden';  el.style.opacity =   '0%' }
-const show_el = (el) => { el.style.visibility = 'visible'; el.style.opacity = '100%' }
+const hide_el = (el) => { el.style.visibility = 'hidden';  el.style.opacity = '0' }
+const show_el = (el) => { el.style.visibility = 'visible'; el.style.opacity = '1' }
 
 // tr num & fields() {{{
 // TODO see: https://stackoverflow.com/q/10726638
@@ -347,7 +347,7 @@ function change_mvbtns () {
     mv === 'r' ? 'sidebtns rightside' :
     mv === 'l' ? 'sidebtns leftside'  :
                  ''  /* no class for 'bottom' */
-  el_mvbtns.classList = mv_cls
+  el_mvbtns.className = mv_cls
   el_uthm_txt.classList.toggle('sidebtns', mv_cls)
   el_tl.classList.toggle('right', mv === 'l')
   zz_set('mvbtns', mv)

diff --git a/index.html b/index.html
diff --git a/javascript.js b/javascript.js
@@ -531,7 +531,10 @@ onload = function () {
   Qall('details').forEach(el => {
     el.addEventListener('toggle', ev => {
       if (el.open) {
-        el.scrollIntoView({ ...window.scroll_behavior, block: "nearest", inline: "nearest" })
+        if (window.prefers_reduced_motion)
+          el.scrollIntoView({ block: "nearest", inline: "nearest" })
+        else
+          el.scrollIntoView({ behavior: 'smooth', block: "nearest", inline: "nearest" })
       }
     })
   })
@@ -556,8 +559,8 @@ function resize_imlaai_done () {
   el_imla_txt_container.style.height = (all - before - after - 0.1*one_em) + 'px'
 }
 
-if (visualViewport) {
-  visualViewport.addEventListener('resize', (ev) => {
+if (window.visualViewport) {
+  window.visualViewport.addEventListener('resize', (ev) => {
     if (!el_imla_txt_container.hidden) {  // if imlaai mode
       if (el_endmsg.hidden) {  // if currently quizzing
         el_imla_txt_container.style.height =

diff --git a/tafsir.js b/tafsir.js
@@ -25,7 +25,8 @@ const part_num = (i) => sep_ayah.findIndex(a => i <= a)  // assumption: 0 <= i <
 
 function tv (i) {
   const name = el_tafsir.value
-  const title = el_tafsir.Q('[value="'+el_tafsir.value+'"]').innerText
+  // const title = el_tafsir.Q('[value="'+el_tafsir.value+'"]').innerText
+  const title = el_tafsir.innerHTML.match('value="'+el_tafsir.value+'"[^<>]*>([^<>]+)')[1]
   // show tafsir
   el_tvc.style.display = 'block'
   show_el(el_tvc)

diff --git a/tajlorligilumi.js b/tajlorligilumi.js
@@ -163,10 +163,6 @@ function tajlorligilumi () {
   //
   // TODO: add a url param for this '^_^
   window.prefers_reduced_motion = window.matchMedia('(prefers-reduced-motion: reduce)').matches
-  window.scroll_behavior =
-    window.prefers_reduced_motion
-      ? {}
-      : { behavior: 'smooth' }
   //
   if (opts.teacher == null) {
     el_teacher_input.checked = !!S.teacher