On WebUSB page: added note about not running flycast and update link (#199)

On WebUSB page: added note about not running flycast and update link

Author: Tails86

docs/webusb/application.js

@@ -21,6 +21,7 @@
     let selectButton = document.querySelector("#select");
     let selectedDevice = document.querySelector('#selected-device')
     let statusDisplay = document.querySelector('#status');
+    let versionUpdateDisplay = document.querySelector('#versionUpdate');
     let saveButton = document.querySelector('#save');
     let mscCheckbox = document.querySelector('#enable-msc-check');
     let enableWebusbAnnounceCheck = document.querySelector('#enable-webusb-announce-check');
@@ -415,6 +416,14 @@
       if (!selectedPort.name.includes(deviceVersion)) {
         selectedDeviceText += `, ${deviceVersion}`;
       }
+
+      // TODO: make this automatic
+      if (selectedPort.major < 1 || selectedPort.minor < 2 || selectedPort.patch < 1) {
+        versionUpdateDisplay.innerHTML = "<a href='https://github.com/OrangeFox86/DreamPicoPort/releases/tag/v1.2.1'>New version of firmware available</a>";
+      } else {
+        versionUpdateDisplay.innerHTML = "";
+      }
+
       selectedDevice.textContent = selectedDeviceText;
       enableAllControls();
       setStatus("Loading settings...");

docs/webusb/index.html

@@ -14,6 +14,8 @@ <h1>Dream Pico Port Settings</h1>
       <br>
       <b>Version 1.2.0 of firmware or later must be loaded for this page to work.</b>
       <br>
+      <b>Ensure flycast is not running while attempting to activate functions on this page</b>
+      <br>
       See <a href="https://github.com/OrangeFox86/DreamPicoPort" target="_blank">Dream Pico Port GitHub page</a>.
 
       <br>
@@ -22,6 +24,8 @@ <h1>Dream Pico Port Settings</h1>
         <button id="select" class="button black">Select Device</button>
         <span id="selected-device"></span>
         <div id="status">Click Select Device to provide this page permissions to access a Dream Pico Port device</div>
+        <br>
+        <div id="versionUpdate"></div>
       </div>
       <br>
       <br>