Conditionally change button text on USB connect

 - Change the text in the UI button for selecting a filesystem
   mount point based on platform.  Putting the pathname on the
   filesystem could be confusing for Windows or ChromeOS users
   where they don't have the concept of a single filesystem
   tree the way *NIX filesystems are used to.

Author: ericzundel

index.html

@@ -308,7 +308,7 @@ <h1>Select Serial Device</h1>
                     <h1>Select USB Host Folder</h1>
                     <p>Select the root folder of your device. This is typically the CIRCUITPY Drive on your computer unless you renamed it. If your device does not appear as a drive on your computer, it will need to have the USB Host functionality enabled.</p>
                     <p>
-                        <button class="purple-button hidden" id="useHostFolder">Use <span id="workingFolder"></span></button>
+                        <button class="purple-button hidden" id="useHostFolder"><span id="workingFolder"></span></button>
                         <button class="purple-button first-item" id="selectHostFolder">Select New Folder</button>
                     </p>
                 </div>

js/common/utilities.js

@@ -56,6 +56,25 @@ function isLocal() {
     return (isMdns() || location.hostname == "localhost" || isIp()) && (location.pathname == "/code/");
 }
 
+// Test to see if browser is running on Microsoft Windows OS
+function isMicrosoftWindows() {
+    // Newer test on Chromium
+    if (navigator.userAgentData?.platform === "Windows") {
+        return true;
+    } else if (navigator.userAgent.includes("Windows")) {
+        return true;
+    }
+    return false;
+}
+
+// Test to see if browser is running on Microsoft Windows OS
+function isChromeOs() {
+    if (navigator.userAgent.includes("CrOS")) {
+        return true;
+    }
+    return false;
+}
+
 // Parse out the url parameters from the current url
 function getUrlParams() {
     // This should look for and validate very specific values
@@ -146,6 +165,8 @@ export {
     isMdns,
     isIp,
     isLocal,
+    isMicrosoftWindows,
+    isChromeOs,
     getUrlParams,
     getUrlParam,
     timeout,

js/workflows/usb.js

@@ -4,6 +4,7 @@ import {GenericModal, DeviceInfoModal} from '../common/dialogs.js';
 import {FileOps} from '@adafruit/circuitpython-repl-js'; // Use this to determine which FileTransferClient to load
 import {FileTransferClient as ReplFileTransferClient} from '../common/repl-file-transfer.js';
 import {FileTransferClient as FSAPIFileTransferClient} from '../common/fsapi-file-transfer.js';
+import { isChromeOs, isMicrosoftWindows } from '../common/utilities.js';
 
 let btnRequestSerialDevice, btnSelectHostFolder, btnUseHostFolder, lblWorkingfolder;
 
@@ -247,7 +248,11 @@ class USBWorkflow extends Workflow {
         console.log("New folder name:", folderName);
         if (folderName) {
             // Set the working folder label
-            lblWorkingfolder.innerHTML = folderName;
+            if (isMicrosoftWindows() || isChromeOs()) {
+                lblWorkingfolder.innerHTML = "OK";
+            } else {
+                lblWorkingfolder.innerHTML = `Use ${folderName}`;
+            }
             btnUseHostFolder.classList.remove("hidden");
             btnSelectHostFolder.innerHTML = "Select Different Folder";
             btnSelectHostFolder.classList.add("inverted");