Add file:// detection tip to camera-based basics samples

Show a non-blocking yellow banner when opened via file:// suggesting
the user serve the page from a web server for the best experience.

Author: Tom-Dynamsoft

basics/hello-world.html

@@ -23,6 +23,15 @@ <h1 class="barcode-scanner-title">
   <div class="barcode-scanner-view" style="width: 100%; height: 70vh;"></div>
   <div class="result-view" style="width: 100%; height: calc(30vh - 80px); padding: 10px;overflow: auto;"></div>
   <script>
+    // Detect file:// protocol and show a helpful tip
+    if (location.protocol === "file:") {
+      const tip = document.createElement("div");
+      tip.style.cssText = "background:#fff3cd;border:1px solid #ffc107;color:#856404;padding:12px 16px;margin:8px;border-radius:6px;font:14px/1.5 sans-serif;text-align:center;";
+      tip.innerHTML = '<strong>Tip:</strong> This page works via <code>file://</code>, but for the best experience, '
+        + 'serve it from a web server (e.g. HTTPS or localhost).';
+      document.body.insertBefore(tip, document.body.firstChild);
+    }
+
     const resultView = document.querySelector(".result-view");
 
     /** LICENSE ALERT - README

basics/scan-a-single-barcode.html

@@ -23,6 +23,15 @@ <h1 class="barcode-scanner-title">
   <!-- This div will host the barcode scanner's camera view -->
   <div class="barcode-scanner-view"></div>
   <script>
+    // Detect file:// protocol and show a helpful tip
+    if (location.protocol === "file:") {
+      const tip = document.createElement("div");
+      tip.style.cssText = "background:#fff3cd;border:1px solid #ffc107;color:#856404;padding:12px 16px;margin:8px;border-radius:6px;font:14px/1.5 sans-serif;text-align:center;";
+      tip.innerHTML = '<strong>Tip:</strong> This page works via <code>file://</code>, but for the best experience, '
+        + 'serve it from a web server (e.g. HTTPS or localhost).';
+      document.body.insertBefore(tip, document.body.firstChild);
+    }
+
     /** LICENSE ALERT - README
      * To use the library, you need to first specify a license key.
      *