From e6bc83ba83152aa8ea24afc905d5f8394081d3f7 Mon Sep 17 00:00:00 2001
From: Ernesto Castellotti <ernesto@castellotti.net>
Date: Fri, 7 Jun 2024 20:59:26 +0200
Subject: Improved UI to make it clear that the browser is not supported (#346)

Some users do not understand that the browser does not support WebSerial because on the page https://hack-gpon.org/ont-huawei-ma5671a-ymodem/ pressing the button opens the flash window, with this PR the button is deactivated if the browser is not supported and the the strikethrough out character is applied to button text
---
 _includes/root_lantiq.html                 | 2 ++
 _includes/ymodem_lantiq.html               | 4 +++-
 _ont/ont-fs-com-gpon-onu-stick-with-mac.md | 3 +--
 _ont/ont-huawei-ma5671a-root-web.md        | 3 +--
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/_includes/root_lantiq.html b/_includes/root_lantiq.html
index fd8912c..4a0bd13 100644
--- a/_includes/root_lantiq.html
+++ b/_includes/root_lantiq.html
@@ -46,6 +46,8 @@
         document.getElementById('start-button').disabled = false;
     } else {
         document.getElementById('browser-error').style.display = 'block';
+        document.getElementById('start-button').disabled = true;
+        document.getElementById('start-button').innerHTML=document.getElementById('start-button').innerText.strike();
     }
     const acontroller = new AbortController();
     const cs = acontroller.signal;
diff --git a/_includes/ymodem_lantiq.html b/_includes/ymodem_lantiq.html
index dffbc32..d8ee215 100644
--- a/_includes/ymodem_lantiq.html
+++ b/_includes/ymodem_lantiq.html
@@ -44,6 +44,8 @@
         document.getElementById('flash-start-button').disabled = false;
     } else {
         document.getElementById('flash-browser-error').style.display = 'block';
+        document.getElementById('flash-start-button').disabled = true;
+        document.getElementById('flash-start-button').innerHTML=document.getElementById('flash-start-button').innerText.strike()
     }
     const acontroller = new AbortController();
     const cs = acontroller.signal;
@@ -202,4 +204,4 @@
             }
         });
     };
-</script>
\ No newline at end of file
+</script>
diff --git a/_ont/ont-fs-com-gpon-onu-stick-with-mac.md b/_ont/ont-fs-com-gpon-onu-stick-with-mac.md
index 9e4b5c5..9894bac 100644
--- a/_ont/ont-fs-com-gpon-onu-stick-with-mac.md
+++ b/_ont/ont-fs-com-gpon-onu-stick-with-mac.md
@@ -147,9 +147,8 @@ When you are ready with everything plugged in you need to press the button below
 
 {: .text-center .fs-6 }
 <button id="start-button" class="btn btn-blue" data-jtd-toggle="modal" data-jtd-target="#root-modal" disabled>Start emergency unlock!</button>
-{% include root_lantiq.html modelName="FS GPON ONU Stick" unlockHuaweiShell=false %}
-
 <div id="browser-error" style="display:none">{% include alert.html content="This browser is not compatible with the emergency unlock procedure. See the <a href='https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API#browser_compatibility'>Browser compatibility</a>" alert="Note"  icon="svg-warning" color="red" %}</div>
+{% include root_lantiq.html modelName="FS GPON ONU Stick" unlockHuaweiShell=false %}
 <noscript>
 {% include alert.html content="Your browser does not support JavaScript!" alert="Note"  icon="svg-warning" color="red" %}
 </noscript>
diff --git a/_ont/ont-huawei-ma5671a-root-web.md b/_ont/ont-huawei-ma5671a-root-web.md
index 99e640d..6a17090 100644
--- a/_ont/ont-huawei-ma5671a-root-web.md
+++ b/_ont/ont-huawei-ma5671a-root-web.md
@@ -28,9 +28,8 @@ Connect the TTL adapter to the computer, once done press the following button. A
 
 {: .text-center .fs-6 }
 <button id="start-button" class="btn btn-blue" data-jtd-toggle="modal" data-jtd-target="#root-modal" disabled>Start root!</button>
-{% include root_lantiq.html modelName="Huawei MA5671A" unlockHuaweiShell=true %}
-
 <div id="browser-error" style="display:none">{% include alert.html content="This browser is not compatible with the web-root procedure. See the <a href='https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API#browser_compatibility'>Browser compatibility</a>" alert="Note"  icon="svg-warning" color="red" %}</div>
+{% include root_lantiq.html modelName="Huawei MA5671A" unlockHuaweiShell=true %}
 <noscript>
 {% include alert.html content="Your browser does not support JavaScript!" alert="Note"  icon="svg-warning" color="red" %}
 </noscript>
-- 
cgit v1.2.3