From fb17b5e7884a19f760e8e40ae3af544067326a70 Mon Sep 17 00:00:00 2001
From: Corbin Wunderlich <corbin.wunderlich@gmail.com>
Date: Tue, 14 Jan 2025 17:49:31 -0500
Subject: [PATCH] Format all files with format.sh

---
 html5/clipboard.html                    |  98 +++---
 html5/connect.html                      | 401 +++++++-----------------
 html5/crypto.html                       | 262 ++++++++--------
 html5/css/client.css                    |  78 ++++-
 html5/css/menu-skin.css                 |  26 +-
 html5/css/menu.css                      | 101 +++---
 html5/css/simple-keyboard.css           |  21 +-
 html5/css/slick.css                     |  13 +
 html5/css/spinner.css                   |   5 +
 html5/digest.html                       |  66 ++--
 html5/index.html                        | 320 ++++++++++---------
 html5/js/Client.js                      | 301 ++++++++++--------
 html5/js/DecodeWorker.js                |  48 ++-
 html5/js/Keycodes.js                    |   2 +-
 html5/js/MediaSourceUtil.js             |  34 +-
 html5/js/Menu.js                        |  22 +-
 html5/js/MenuCustom.js                  |  16 +-
 html5/js/Notifications.js               |  36 +--
 html5/js/OffscreenDecodeWorker.js       |  25 +-
 html5/js/OffscreenDecodeWorkerHelper.js |   2 +-
 html5/js/PaintWorker.js                 |  14 +-
 html5/js/Protocol.js                    | 193 +++++++-----
 html5/js/Utilities.js                   |  87 +++--
 html5/js/VideoDecoder.js                |   8 +-
 html5/js/WebTransport.js                |  53 ++--
 html5/js/Window.js                      |  35 ++-
 html5/mitm.html                         |  20 +-
 27 files changed, 1199 insertions(+), 1088 deletions(-)
diff --git a/html5/clipboard.html b/html5/clipboard.html
index f69a91d6..2d39036c 100644
--- a/html5/clipboard.html
+++ b/html5/clipboard.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
   <head>
     <!--
 	Copyright (c) 2024 Antoine Martin <antoine@xpra.org>
@@ -18,14 +19,7 @@
 
         <div>
           <label for="input">Input</label>
-          <input
-            title="Input"
-            type="text"
-            class="form-control"
-            id="input"
-            placeholder="Input"
-            maxlength="256"
-          />
+          <input title="Input" type="text" class="form-control" id="input" placeholder="Input" maxlength="256" />
         </div>
 
         <hr />
@@ -33,21 +27,21 @@
         <div>
           <input type="checkbox" id="autofocus" />
           <br />
-          <label for="pasteboard">Pasteboard:</label><br/>
+          <label for="pasteboard">Pasteboard:</label><br />
           <textarea id="pasteboard" readonly></textarea>
         </div>
 
         <hr />
 
         <div>
-          <label for="contents">Contents:</label><br/>
+          <label for="contents">Contents:</label><br />
           <pre id="contents"></pre>
         </div>
 
         <hr />
 
         <div>
-          <label for="info">Events:</label><br/>
+          <label for="info">Events:</label><br />
           <pre id="info"></pre>
         </div>
 
@@ -74,7 +68,7 @@
 
       function update_info(newtext) {
         console.log(newtext);
-        while (lines.length>10) {
+        while (lines.length > 10) {
           lines.shift();
         }
         lines.push(newtext);
@@ -90,7 +84,7 @@
         }
       }
 
-      autofocus.onchange = function () {
+      autofocus.onchange = function() {
         pasteboard.autofocus = autofocus.checked;
         if (autofocus.checked) {
           pasteboard.focus();
@@ -103,62 +97,59 @@
         update_info("`navigator.clipboard` found");
         if (navigator.clipboard.clipboardData) {
           update_info("`navigator.clipboard.clipboardData` found");
-        }
-        else {
+        } else {
           update_info("No `navigator.clipboard.clipboardData`");
         }
-      }
-      else {
+      } else {
         update_info("Error: `navigator.clipboard` is missing!");
       }
 
       function read_clipboard_data(format) {
-        update_info("requesting "+format);
+        update_info("requesting " + format);
         navigator.clipboard.read().then((data) => {
-          update_info("got "+format+" clipboard data: "+data);
-          for (const item of data) {
-            for (const type of item.types) {
-              const item_data = item.getType(type).then((item_data) => {
-                update_info("got "+type+"="+item_data);
-                const fileReader = new FileReader();
-                fileReader.addEventListener("load", (event) => {
-                  update_info("loaded "+type+"="+event+" using "+event.target);
-                  update_info("result="+event.target.result);
-                },
-                (error) => {
-                  update_info("failed to load "+type+" clipboard data: "+error);
-                });
-                fileReader.readAsText(item_data);
-              },
-              (error) => {
-                update_info("failed to get "+type+" clipboard data: "+error);
-              });
+            update_info("got " + format + " clipboard data: " + data);
+            for (const item of data) {
+              for (const type of item.types) {
+                const item_data = item.getType(type).then((item_data) => {
+                    update_info("got " + type + "=" + item_data);
+                    const fileReader = new FileReader();
+                    fileReader.addEventListener("load", (event) => {
+                        update_info("loaded " + type + "=" + event + " using " + event.target);
+                        update_info("result=" + event.target.result);
+                      },
+                      (error) => {
+                        update_info("failed to load " + type + " clipboard data: " + error);
+                      });
+                    fileReader.readAsText(item_data);
+                  },
+                  (error) => {
+                    update_info("failed to get " + type + " clipboard data: " + error);
+                  });
+              }
             }
-          }
-          contents.innerText = data;
-        },
-        (error) => {
-          update_info("failed to read "+format+": "+error);
-        });
+            contents.innerText = data;
+          },
+          (error) => {
+            update_info("failed to read " + format + ": " + error);
+          });
       }
       if (navigator.clipboard.read) {
         read_clipboard_data("text/html");
         read_clipboard_data("text/plain");
-      }
-      else {
+      } else {
         update_info("missing `navigator.clipboard.read`");
       }
 
       function read_clipboard_text() {
         update_info("requesting contents via readText()");
         navigator.clipboard.readText().then((text) => {
-          update_info("readText() clipboard data: '"+text+"'");
-          contents.innerHTML = text;
-          // const clipboard_buffer = unescape(encodeURIComponent(text));
-        },
-        (error) => {
-          update_info("failed to readText(): "+error);
-        });
+            update_info("readText() clipboard data: '" + text + "'");
+            contents.innerHTML = text;
+            // const clipboard_buffer = unescape(encodeURIComponent(text));
+          },
+          (error) => {
+            update_info("failed to readText(): " + error);
+          });
       }
       read_clipboard_text();
 
@@ -185,16 +176,17 @@
       exec_copy.onclick = function(e) {
         input.select();
         const copy = document.execCommand("copy");
-        update_info("copy="+copy);
+        update_info("copy=" + copy);
       }
 
       const exec_paste = document.getElementById("exec-paste");
       exec_paste.onclick = function(e) {
         input.select();
         const paste = document.execCommand("paste");
-        update_info("paste="+paste);
+        update_info("paste=" + paste);
       }
 
     </script>
   </body>
+
 </html>
diff --git a/html5/connect.html b/html5/connect.html
index 5f8809fb..3eabf0a3 100644
--- a/html5/connect.html
+++ b/html5/connect.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
   <head>
     <!--
 	Copyright (c) 2013-2024 Antoine Martin <antoine@xpra.org>
@@ -38,69 +39,26 @@
         <h2 class="form-signin-heading">Xpra HTML5 Client</h2>
         <h5>Version 17 beta</h5>
 
-        <div
-          id="alert-disconnect"
-          class="alert alert-info"
-          role="alert"
-          style="display: none"
-        >
+        <div id="alert-disconnect" class="alert alert-info" role="alert" style="display: none">
           <p>You were disconnected for the following reason:</p>
           <p><span id="disconnect-reason"></span></p>
         </div>
 
         <div class="form-group form-inline">
           <label class="sr-only" for="server">Server</label>
-          <input
-            title="Server"
-            type="text"
-            class="form-control"
-            id="server"
-            placeholder="Server"
-            maxlength="256"
-          />
+          <input title="Server" type="text" class="form-control" id="server" placeholder="Server" maxlength="256" />
           <label class="sr-only" for="port">Port</label>
-          <input
-            title="Port"
-            type="text"
-            class="form-control"
-            id="port"
-            placeholder="Port"
-            size="5"
-            maxlength="5"
-          />
+          <input title="Port" type="text" class="form-control" id="port" placeholder="Port" size="5" maxlength="5" />
           <br />
           <div id="server-info-box">
             <span id="server-info" />
             <br />
           </div>
           <label class="sr-only" for="username">Username</label>
-          <input
-            title="Username"
-            type="text"
-            class="form-control"
-            id="username"
-            autocomplete="username"
-            placeholder="Username"
-            size="16"
-            maxlength="256"
-          />
+          <input title="Username" type="text" class="form-control" id="username" autocomplete="username" placeholder="Username" size="16" maxlength="256" />
           <label class="sr-only" for="password">Password</label>
-          <input
-            title="Password"
-            type="password"
-            class="form-control"
-            id="password"
-            autocomplete="current-password"
-            placeholder="Password"
-            size="16"
-            maxlength="256"
-          />
-          <img
-            id="toggle-password"
-            class="field-icon"
-            src="./icons/eye-slash.png"
-            alt="toggle password visibility"
-          />
+          <input title="Password" type="password" class="form-control" id="password" autocomplete="current-password" placeholder="Password" size="16" maxlength="256" />
+          <img id="toggle-password" class="field-icon" src="./icons/eye-slash.png" alt="toggle password visibility" />
           <br />
           <div class="security-box">
             <span id="ssl-span">
@@ -121,21 +79,8 @@ <h5>Version 17 beta</h5>
               </select>
             </span>
             <span id="encryption-key-span">
-              <input
-                type="password"
-                class="form-control"
-                id="key"
-                autocomplete="on"
-                placeholder="AES-KEY"
-                size="32"
-                maxlength="256"
-              />
-              <img
-                id="toggle-key"
-                class="field-icon"
-                src="./icons/eye-slash.png"
-                alt="toggle encryption key visibility"
-              />
+              <input type="password" class="form-control" id="key" autocomplete="on" placeholder="AES-KEY" size="32" maxlength="256" />
+              <img id="toggle-key" class="field-icon" src="./icons/eye-slash.png" alt="toggle encryption key visibility" />
             </span>
             <br />
             <span id="insecure-span">
@@ -146,150 +91,46 @@ <h5>Version 17 beta</h5>
           <div class="panel-group">
             <ul class="list-style-none action">
               <li id="action_connect_group">
-                <label
-                  ><input
-                    type="radio"
-                    name="action"
-                    class="radiobox"
-                    value="connect"
-                    id="action_connect"
-                    checked="checked"
-                  />
-                  Connect:</label
-                >
-                <input
-                  title="display"
-                  type="text"
-                  class="form-control command"
-                  id="display"
-                  placeholder="Display (optional)"
-                  size="20"
-                  maxlength="256"
-                />
-                <select id="select_display" style="display: none"></select
-                ><span id="select_display_warning" class="warning"></span>
+                <label><input type="radio" name="action" class="radiobox" value="connect" id="action_connect" checked="checked" />
+                  Connect:</label>
+                <input title="display" type="text" class="form-control command" id="display" placeholder="Display (optional)" size="20" maxlength="256" />
+                <select id="select_display" style="display: none"></select><span id="select_display_warning" class="warning"></span>
               </li>
               <li id="action_start_group">
                 <div style="display: inline-block; vertical-align: top">
-                  <label
-                    ><input
-                      type="radio"
-                      name="action"
-                      class="radiobox"
-                      value="start"
-                      id="action_start"
-                      checked="checked"
-                    />
-                    Start Command:</label
-                  >
-                  <input
-                    title="command"
-                    type="text"
-                    class="form-control command"
-                    id="start_command"
-                    placeholder="Command"
-                    size="20"
-                    maxlength="256"
-                  />
+                  <label><input type="radio" name="action" class="radiobox" value="start" id="action_start" checked="checked" />
+                    Start Command:</label>
+                  <input title="command" type="text" class="form-control command" id="start_command" placeholder="Command" size="20" maxlength="256" />
                 </div>
                 <div style="display: inline-block">
                   <select id="command_category" style="display: none"></select>
-                  <img
-                    class="command-icon"
-                    id="command_category_icon"
-                    alt="desktop command category icon"
-                    src="./icons/noicon.png"
-                  />
+                  <img class="command-icon" id="command_category_icon" alt="desktop command category icon" src="./icons/noicon.png" />
                   <br />
                   <select id="command_entry" style="display: none"></select>
-                  <img
-                    class="command-icon"
-                    id="command_entry_icon"
-                    alt="desktop command icon"
-                    src="./icons/noicon.png"
-                  />
+                  <img class="command-icon" id="command_entry_icon" alt="desktop command icon" src="./icons/noicon.png" />
                 </div>
               </li>
               <li id="action_start_desktop_group">
-                <label
-                  ><input
-                    type="radio"
-                    name="action"
-                    class="radiobox"
-                    value="start-desktop"
-                    id="action_start_desktop"
-                    checked="checked"
-                  />
-                  Start Desktop:</label
-                >
-                <input
-                  title="desktop command"
-                  type="text"
-                  class="form-control command"
-                  id="start_desktop_command"
-                  placeholder="Desktop Command"
-                  size="20"
-                  maxlength="256"
-                />
-                <img
-                  class="command-icon"
-                  id="desktop_entry_icon"
-                  alt="desktop command icon"
-                  src="./icons/noicon.png"
-                />
-                <select id="desktop_entry" style="display: none"></select
-                ><span id="desktop_entry_warning" class="warning"></span>
+                <label><input type="radio" name="action" class="radiobox" value="start-desktop" id="action_start_desktop" checked="checked" />
+                  Start Desktop:</label>
+                <input title="desktop command" type="text" class="form-control command" id="start_desktop_command" placeholder="Desktop Command" size="20" maxlength="256" />
+                <img class="command-icon" id="desktop_entry_icon" alt="desktop command icon" src="./icons/noicon.png" />
+                <select id="desktop_entry" style="display: none"></select><span id="desktop_entry_warning" class="warning"></span>
               </li>
               <li id="action_shadow_group">
-                <label
-                  ><input
-                    type="radio"
-                    name="action"
-                    class="radiobox"
-                    value="shadow"
-                    id="action_shadow"
-                    checked="checked"
-                  />
-                  Shadow:</label
-                >
-                <input
-                  title="display"
-                  type="text"
-                  class="form-control command"
-                  id="shadow_display"
-                  placeholder="Display (optional)"
-                  size="20"
-                  maxlength="256"
-                />
-                <select
-                  id="select_shadow_display"
-                  style="display: none"
-                ></select
-                ><span
-                  id="select_shadow_display_warning"
-                  class="warning"
-                ></span>
+                <label><input type="radio" name="action" class="radiobox" value="shadow" id="action_shadow" checked="checked" />
+                  Shadow:</label>
+                <input title="display" type="text" class="form-control command" id="shadow_display" placeholder="Display (optional)" size="20" maxlength="256" />
+                <select id="select_shadow_display" style="display: none"></select><span id="select_shadow_display_warning" class="warning"></span>
               </li>
             </ul>
           </div>
         </div>
 
         <div class="form-group">
-          <a class="btn btn-lg btn-success" role="button" id="main_action_button" onclick="doConnect();"
-            >Connect</a
-          >
-          <a
-            class="btn btn-lg btn-success"
-            role="button"
-            onclick="doConnectURI();"
-            >Client URI</a
-          >
-          <a
-            class="btn btn-lg btn-success"
-            role="button"
-            onclick="downloadConnectionFile();"
-            >Connection File</a
-          >
+          <a class="btn btn-lg btn-success" role="button" id="main_action_button" onclick="doConnect();">Connect</a>
+          <a class="btn btn-lg btn-success" role="button" onclick="doConnectURI();">Client URI</a>
+          <a class="btn btn-lg btn-success" role="button" onclick="downloadConnectionFile();">Connection File</a>
         </div>
 
         <div class="panel-group" role="tablist">
@@ -298,12 +139,7 @@ <h5>Version 17 beta</h5>
               <h4 class="panel-title">Advanced options</h4>
             </div>
 
-            <div
-              id="hiddenopts"
-              class="panel-collapse collapse in"
-              role="tabpanel"
-              style="display: none"
-            >
+            <div id="hiddenopts" class="panel-collapse collapse in" role="tabpanel" style="display: none">
               <ul class="list-group">
                 <li class="list-group-item">
                   <select id="bandwidth_limit">
@@ -501,46 +337,29 @@ <h4 class="panel-title">Advanced options</h4>
                 </li>
                 <li class="list-group-item">
                   <input type="checkbox" id="video" />
-                  <span
-                    >Video
+                  <span>Video
                     <input type="checkbox" id="mediasource_video" /> Native
-                    decoding</span
-                  >
+                    decoding</span>
                 </li>
                 <li class="list-group-item">
                   <span>Server Path:</span>
-                  <input
-                    title="path"
-                    type="text"
-                    class="form-control"
-                    id="path"
-                    placeholder=""
-                    size="16"
-                    maxlength="256"
-                  />
+                  <input title="path" type="text" class="form-control" id="path" placeholder="" size="16" maxlength="256" />
                 </li>
                 <li class="list-group-item">
                   <span>Client Screen Width:</span>
-                  <input
-                    title="override_width"
-                    type="text"
-                    class="form-control"
-                    id="override_width"
-                    size="16"
-                    maxlength="256"
-                  />
+                  <input title="override_width" type="text" class="form-control" id="override_width" size="16" maxlength="256" />
                 </li>
                 <li class="list-group-item">
                   <span>Debugging</span>:<br />
-                  <input type="checkbox" id="debug_main" />       <span>Main</span>,
-                  <input type="checkbox" id="debug_keyboard" />   <span>keyboard</span>,
-                  <input type="checkbox" id="debug_geometry" />   <span>geometry</span>,
-                  <input type="checkbox" id="debug_mouse" />      <span>mouse</span>,
-                  <input type="checkbox" id="debug_clipboard" />  <span>clipboard</span>
-                  <input type="checkbox" id="debug_draw" />       <span>draw</span>,
-                  <input type="checkbox" id="debug_audio" />      <span>audio</span>,
-                  <input type="checkbox" id="debug_network" />    <span>network</span>
-                  <input type="checkbox" id="debug_file" />       <span>file</span>
+                  <input type="checkbox" id="debug_main" /> <span>Main</span>,
+                  <input type="checkbox" id="debug_keyboard" /> <span>keyboard</span>,
+                  <input type="checkbox" id="debug_geometry" /> <span>geometry</span>,
+                  <input type="checkbox" id="debug_mouse" /> <span>mouse</span>,
+                  <input type="checkbox" id="debug_clipboard" /> <span>clipboard</span>
+                  <input type="checkbox" id="debug_draw" /> <span>draw</span>,
+                  <input type="checkbox" id="debug_audio" /> <span>audio</span>,
+                  <input type="checkbox" id="debug_network" /> <span>network</span>
+                  <input type="checkbox" id="debug_file" /> <span>file</span>
                 </li>
               </ul>
             </div>
@@ -635,7 +454,9 @@ <h4 class="panel-title">Advanced options</h4>
         //show the on-screen keyboard by default on mobile:
         DEFAULT_ON.push("keyboard");
       }
-      const FILE_TRANSLATION = { server: "host" };
+      const FILE_TRANSLATION = {
+        server: "host"
+      };
 
       function add_prop(prop, value, first) {
         if (Utilities.hasSessionStorage()) {
@@ -660,11 +481,11 @@ <h4 class="panel-title">Advanced options</h4>
         let url = "./index.html" + add_prop("submit", true, true);
         let i = 0;
         for (const [prop, value] of get_URL_action()) {
-          add_prop(prop, value, i==0);
+          add_prop(prop, value, i == 0);
           i++;
         }
         for (const [prop, value] of get_URL_props(VALUE_PROPERTIES.concat(BOOLEAN_PROPERTIES))) {
-          add_prop(prop, value, i==0);
+          add_prop(prop, value, i == 0);
           i++;
         }
         window.location = url;
@@ -684,7 +505,7 @@ <h4 class="panel-title">Advanced options</h4>
           url += username;
         }
         if (password && is_password_safe()) {
-          url += ":"+password;
+          url += ":" + password;
         }
         if (username || password) {
           url += "@";
@@ -707,7 +528,7 @@ <h4 class="panel-title">Advanced options</h4>
         let i = 0;
         for (const [prop, value] of url_action) {
           if (prop != "display" && prop != "action") {
-            url += do_add_prop(prop, value, i==0);
+            url += do_add_prop(prop, value, i == 0);
             i++;
           }
         }
@@ -718,7 +539,7 @@ <h4 class="panel-title">Advanced options</h4>
         props.delete("password");
         for (const [prop, value] of props) {
           if (!prop.startsWith("debug_")) {
-            url += do_add_prop(prop.replaceAll("_", "-"), value, i==0);
+            url += do_add_prop(prop.replaceAll("_", "-"), value, i == 0);
             i++;
           }
         }
@@ -738,7 +559,7 @@ <h4 class="panel-title">Advanced options</h4>
         const url_action = get_URL_action();
         const display = url_action.get("display");
         if (display) {
-          data += "display="+display+"\n";
+          data += "display=" + display + "\n";
         }
         for (let i = 0; i < FILE_PROPERTIES.length; i++) {
           const prop = FILE_PROPERTIES[i];
@@ -750,8 +571,7 @@ <h4 class="panel-title">Advanced options</h4>
             if (value == default_value) {
               continue;
             }
-          }
-          else {
+          } else {
             value = document.getElementById(prop).value;
           }
           if (value !== "") {
@@ -788,7 +608,9 @@ <h4 class="panel-title">Advanced options</h4>
           data += "debug=" + debug + "\n";
         }
         const filename = (document.getElementById("server").value || "session") + ".xpra";
-        Utilities.saveFile(filename, data, { type: "text/plain" });
+        Utilities.saveFile(filename, data, {
+          type: "text/plain"
+        });
       }
 
       function get_visible_value(entry, select) {
@@ -848,8 +670,7 @@ <h4 class="panel-title">Advanced options</h4>
           let value = "";
           if (BOOLEAN_PROPERTIES.includes(prop)) {
             value = element.checked;
-          }
-          else {
+          } else {
             value = element.value;
             if (value === null || value === "undefined") {
               value = "";
@@ -861,7 +682,7 @@ <h4 class="panel-title">Advanced options</h4>
       }
 
       function fill_form(default_settings) {
-        const getparam = function (prop) {
+        const getparam = function(prop) {
           let v = Utilities.getparam(prop);
           if (v === undefined && prop in default_settings) {
             v = default_settings[prop];
@@ -877,7 +698,7 @@ <h4 class="panel-title">Advanced options</h4>
           return value.replace(re, "");
         }
 
-        const getboolparam = function (prop, default_value) {
+        const getboolparam = function(prop, default_value) {
           let v = Utilities.getparam(prop);
           if (v === undefined && prop in default_settings) {
             v = default_settings[prop];
@@ -891,7 +712,7 @@ <h4 class="panel-title">Advanced options</h4>
             ) !== -1
           );
         };
-        const getintparam = function (prop, default_value) {
+        const getintparam = function(prop, default_value) {
           let v = getparam(prop);
           try {
             v = parseInt(v);
@@ -921,7 +742,7 @@ <h4 class="panel-title">Advanced options</h4>
         if (pathname && pathname == "/") {
           pathname = "";
         }
-        var path = getstrparam("path", ALLOWED_CHARS+"/");
+        var path = getstrparam("path", ALLOWED_CHARS + "/");
         if (path && path.endsWith("/index.html")) {
           path = path.substr(0, path.lastIndexOf("/"));
         }
@@ -933,7 +754,7 @@ <h4 class="panel-title">Advanced options</h4>
         document.getElementById("server").value = getstrparam("server") || link.hostname;
         document.getElementById("port").value = getintparam("port", 0) || link.port || protocol_port;
         document.getElementById("path").value = path || pathname;
-        document.getElementById("username").value = getstrparam("username", ALLOWED_CHARS+"@") || "";
+        document.getElementById("username").value = getstrparam("username", ALLOWED_CHARS + "@") || "";
 
         const override_width = getintparam("override_width", 0);
         if (override_width) {
@@ -959,6 +780,7 @@ <h4 class="panel-title">Advanced options</h4>
         function is_secure_connection() {
           return webtransport_input.checked || ssl_input.checked || aes_input.checked;
         }
+
         function is_password_safe() {
           if (insecure_input.checked) {
             return true;
@@ -983,8 +805,7 @@ <h4 class="panel-title">Advanced options</h4>
           let status_message = "";
           if (offscreen_available) {
             offscreen_label.classList.remove("disabled");
-          }
-          else {
+          } else {
             status_message = "not available in your browser";
             offscreen_label.classList.add("disabled");
           }
@@ -999,14 +820,14 @@ <h4 class="panel-title">Advanced options</h4>
           if (password_input.disabled) {
             password_input.value = "";
             password_input.title = "Typing a password would be insecure with these settings";
-          }
-          else {
+          } else {
             password_input.title = "Session Password";
           }
         }
-        insecure_input.onchange = function () {
+        insecure_input.onchange = function() {
           update_password_input();
         };
+
         function update_insecure() {
           const host = document.getElementById("server").value;
           const safe = is_secure_connection() || Utilities.isSafeHost(host);
@@ -1018,6 +839,7 @@ <h4 class="panel-title">Advanced options</h4>
           }
           update_password_input();
         }
+
         function update_aes() {
           if (aes_input.checked) {
             $("select#encryption").find("option[value='']").remove();
@@ -1047,7 +869,7 @@ <h4 class="panel-title">Advanced options</h4>
             document.getElementById("encryption").value = "AES-" + enc_mode;
           }
         }
-        webtransport_input.onchange = function () {
+        webtransport_input.onchange = function() {
           // disable ssl and aes:
           ssl_input.disabled = webtransport_input.checked;
           aes_input.disabled = webtransport_input.checked;
@@ -1060,7 +882,7 @@ <h4 class="panel-title">Advanced options</h4>
           host_address_changed();
           update_insecure();
         }
-        ssl_input.onchange = function () {
+        ssl_input.onchange = function() {
           if (ssl_input.checked) {
             aes_input.checked = false;
           }
@@ -1075,6 +897,7 @@ <h4 class="panel-title">Advanced options</h4>
         //vrefresh:
         let animation_times = [];
         let vrefresh = -1;
+
         function animation_cb(now) {
           let l = animation_times.push(now);
           if (l > 100) {
@@ -1103,10 +926,10 @@ <h4 class="panel-title">Advanced options</h4>
             return "eye-slash.png";
           }
         }
-        $("#toggle-password").on("click", function () {
+        $("#toggle-password").on("click", function() {
           $("#toggle-password").attr("src", "./icons/" + toggle_reveal("password"));
         });
-        $("#toggle-key").on("click", function () {
+        $("#toggle-key").on("click", function() {
           $("#toggle-key").attr("src", "./icons/" + toggle_reveal("key"));
         });
 
@@ -1124,7 +947,7 @@ <h4 class="panel-title">Advanced options</h4>
         action_elements.set("Connect", action_connect);
         for (const [action_label, action_element] of action_elements) {
           console.log(`${action_label} = ${action_element}`);
-          action_element.addEventListener('click', function(){
+          action_element.addEventListener('click', function() {
             console.log(action_label);
             main_action_button.text = action_label;
           }, false);
@@ -1196,19 +1019,21 @@ <h4 class="panel-title">Advanced options</h4>
         const command_category = document.getElementById("command_category");
         const command_entry_icon = document.getElementById("command_entry_icon");
         const command_entry = document.getElementById("command_entry");
+
         function load_icon(icon, src) {
           const url = get_host_address(true) + src;
-          icon.onload = function () {
+          icon.onload = function() {
             Utilities.log("loaded icon", url);
           };
-          icon.onerror = function (e) {
+          icon.onerror = function(e) {
             Utilities.error("error loading icon", url, ":", e);
           };
-          icon.onabort = function (e) {
+          icon.onabort = function(e) {
             Utilities.error("aborted loading icon", url, ":", e);
           };
           icon.src = url;
         }
+
         function command_entry_changed() {
           var cc = command_category.options[command_category.selectedIndex].innerHTML;
           var c = command_entry.options[command_entry.selectedIndex].innerHTML;
@@ -1217,6 +1042,7 @@ <h4 class="panel-title">Advanced options</h4>
           $("#command_entry_icon").show();
         }
         command_entry.addEventListener("change", command_entry_changed);
+
         function command_category_changed() {
           var cc = command_category.options[command_category.selectedIndex].innerHTML;
           Utilities.log("command_category=", cc);
@@ -1226,17 +1052,19 @@ <h4 class="panel-title">Advanced options</h4>
         command_category.addEventListener("change", command_category_changed);
 
         function safe_command(command) {
-           return Utilities.removeChars('a-zA-Z0-9\\-%_/\\"', command);
+          return Utilities.removeChars('a-zA-Z0-9\\-%_/\\"', command);
         }
+
         function safe_name(name) {
-           return Utilities.removeChars('a-zA-Z0-9\\-%"', name);
+          return Utilities.removeChars('a-zA-Z0-9\\-%"', name);
         }
+
         function init_command_menu() {
           $("#command_category_icon").hide();
           $("#command_entry_icon").hide();
           json_action(
             "Menu",
-            function (xhr, response) {
+            function(xhr, response) {
               let categories = Object.keys(response);
               //find the category matching "start":
               let default_start = start || "xterm";
@@ -1252,6 +1080,7 @@ <h4 class="panel-title">Advanced options</h4>
                   }
                 }
               }
+
               function populate_commands() {
                 let selected_category = command_category.value;
                 let entries = response[selected_category].Entries;
@@ -1262,7 +1091,7 @@ <h4 class="panel-title">Advanced options</h4>
                   const name = safe_name(entry.Name);
                   if (default_start == command_exec) {
                     $("select#command_entry").append(
-                      '<option selected="selected" value="' + command_exec +'">' + name + "</option>"
+                      '<option selected="selected" value="' + command_exec + '">' + name + "</option>"
                     );
                   } else {
                     $("select#command_entry").append(
@@ -1293,7 +1122,7 @@ <h4 class="panel-title">Advanced options</h4>
               populate_commands();
               command_entry_changed();
             },
-            function (error) {
+            function(error) {
               $("select#command_category").hide();
               $("select#command_entry").hide();
               $("#start_command").show();
@@ -1303,6 +1132,7 @@ <h4 class="panel-title">Advanced options</h4>
 
         const desktop_entry_icon = document.getElementById("desktop_entry_icon");
         const desktop_entry = document.getElementById("desktop_entry");
+
         function desktop_entry_changed() {
           var de = desktop_entry.options[desktop_entry.selectedIndex].innerHTML;
           Utilities.log("desktop_session=", de);
@@ -1314,7 +1144,7 @@ <h4 class="panel-title">Advanced options</h4>
           $("#desktop_entry_icon").hide();
           json_action(
             "DesktopMenu",
-            function (xhr, response) {
+            function(xhr, response) {
               var desktop_sessions = Object.keys(response);
               desktop_entry.innerText = null;
               let default_start_desktop = start;
@@ -1353,7 +1183,7 @@ <h4 class="panel-title">Advanced options</h4>
               $("#desktop_entry_icon").show();
               $("#start_desktop_command").hide();
             },
-            function (error) {
+            function(error) {
               $("select#desktop_entry").hide();
               $("#start_desktop_command").show();
             }
@@ -1364,10 +1194,11 @@ <h4 class="panel-title">Advanced options</h4>
           return Utilities.removeChars('a-zA-Z0-9\\:\\-% \\(\\)"', name);
         }
         const display = getstrparam("display") || "";
+
         function init_shadow_display() {
           json_action(
             "Displays",
-            function (xhr, response) {
+            function(xhr, response) {
               var displays = Object.keys(response);
               const select_shadow_display = document.getElementById("select_shadow_display");
               select_shadow_display.innerText = null;
@@ -1396,7 +1227,7 @@ <h4 class="panel-title">Advanced options</h4>
               $("select#select_shadow_display").show();
               $("#shadow_display").hide();
             },
-            function (error) {
+            function(error) {
               $("select#select_shadow_display").hide();
               $("#shadow_display").show();
             }
@@ -1406,7 +1237,7 @@ <h4 class="panel-title">Advanced options</h4>
         function init_connect_display() {
           json_action(
             "Sessions",
-            function (xhr, response) {
+            function(xhr, response) {
               var sessions = Object.keys(response);
               const select_display = document.getElementById("select_display");
               select_display.innerText = null;
@@ -1460,7 +1291,7 @@ <h4 class="panel-title">Advanced options</h4>
               select_display.onchange = display_populate_username;
               display_populate_username();
             },
-            function (error) {
+            function(error) {
               $("select#select_display").hide();
               $("#display").show();
             }
@@ -1475,8 +1306,7 @@ <h4 class="panel-title">Advanced options</h4>
           const got_mode = mode.length > 0;
           if (got_mode > 0) {
             server_info = host_address + " is a '" + mode + "' server";
-          }
-          else {
+          } else {
             server_info = "no information available for " + host_address;
           }
           document.getElementById("server-info").innerText = server_info;
@@ -1504,15 +1334,16 @@ <h4 class="panel-title">Advanced options</h4>
             $("#desktop_entry_icon").hide();
           }
         }
+
         function init_mode() {
           json_action(
             "Info",
-            function (xhr, response) {
+            function(xhr, response) {
               Utilities.log("Info=", response);
               let mode = response.mode || "";
               show_mode(mode);
             },
-            function (error) {
+            function(error) {
               show_mode("");
             }
           );
@@ -1523,12 +1354,14 @@ <h4 class="panel-title">Advanced options</h4>
         let ajax_delay = 2000;
         let watched_elements = ["server", "port", "ssl", "encryption", "aes"];
         var host_address = "";
+
         function cancel_changed_timer() {
           if (target_changed_timer) {
             clearTimeout(target_changed_timer);
             target_changed_timer = 0;
           }
         }
+
         function host_address_changed() {
           cancel_changed_timer();
           const url = get_host_address();
@@ -1541,23 +1374,23 @@ <h4 class="panel-title">Advanced options</h4>
         for (var i = 0, l = watched_elements.length; i < l; i++) {
           let watched_element = watched_elements[i];
           let el = $("#" + watched_element);
-          el.on("change", function () {
+          el.on("change", function() {
             Utilities.log(watched_element, "changed");
             update_password_input();
             host_address_changed();
           });
-          el.on("paste", function () {
+          el.on("paste", function() {
             Utilities.log(watched_element, "pasted");
             update_password_input();
             host_address_changed();
           });
-          el.on("keyup", function () {
+          el.on("keyup", function() {
             Utilities.log(watched_element, "key event");
             update_password_input();
             cancel_changed_timer();
             target_changed_timer = setTimeout(host_address_changed, ajax_delay);
           });
-          el.on("keydown", function () {
+          el.on("keydown", function() {
             update_password_input();
             cancel_changed_timer();
           });
@@ -1574,7 +1407,7 @@ <h4 class="panel-title">Advanced options</h4>
             $("input#exit_with_client").prop("checked", false);
           }
         }
-        $(document).on("click", '[name="action"]', function () {
+        $(document).on("click", '[name="action"]', function() {
           const action = $(this).val();
           set_exit_actions(action == "connect");
         });
@@ -1600,7 +1433,7 @@ <h4 class="panel-title">Advanced options</h4>
           keyboard_layout = Utilities.getKeyboardLayout();
         }
         document.getElementById("keyboard_layout").value = keyboard_layout;
-        json_action("favicon.png?echo-headers", function (xhr, response) {
+        json_action("favicon.png?echo-headers", function(xhr, response) {
           const headers = Utilities.ParseResponseHeaders(xhr.getAllResponseHeaders());
           Utilities.debug("headers:", headers);
           let lang = headers["Echo-Accept-Language"];
@@ -1649,7 +1482,7 @@ <h4 class="panel-title">Advanced options</h4>
           $("input#sound").prop("disabled", true);
         } else {
           //enable sound checkbox if the codec is changed:
-          audio_codec_select.onchange = function () {
+          audio_codec_select.onchange = function() {
             document.getElementById("sound").checked = true;
           };
         }
@@ -1699,6 +1532,7 @@ <h4 class="panel-title">Advanced options</h4>
         toggle_mediasource_video();
 
         const floating_menu_checkbox = $("#floating_menu");
+
         function set_menu_attributes_visibility() {
           if (floating_menu_checkbox.is(":checked")) {
             $("#clock").removeAttr("disabled");
@@ -1720,7 +1554,7 @@ <h4 class="panel-title">Advanced options</h4>
         //this may override default values (ie: terminate flags are off for connect mode):
         set_exit_actions(action == "connect" || action == "");
 
-        $("#expandopts").click(function () {
+        $("#expandopts").click(function() {
           $("#hiddenopts").slideToggle();
         });
         //delete session params:
@@ -1729,6 +1563,7 @@ <h4 class="panel-title">Advanced options</h4>
         } catch (e) {
           //ignore
         }
+
         function submit_if_enter(e) {
           if (!e) {
             const e = window.event;
@@ -1746,20 +1581,22 @@ <h4 class="panel-title">Advanced options</h4>
         }
       }
 
-      $(document).ready(function () {
+      $(document).ready(function() {
         const xhr = new XMLHttpRequest();
         xhr.open("GET", "./default-settings.txt");
-        xhr.onload = function () {
+        xhr.onload = function() {
           fill_form(Utilities.parseINIString(xhr.responseText));
         };
-        xhr.onerror = function () {
+        xhr.onerror = function() {
           fill_form({});
         };
-        xhr.onabort = function () {
+        xhr.onabort = function() {
           fill_form({});
         };
         xhr.send();
       });
+
     </script>
   </body>
+
 </html>
diff --git a/html5/crypto.html b/html5/crypto.html
index 1f813854..bb022ac4 100644
--- a/html5/crypto.html
+++ b/html5/crypto.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
   <head>
     <!--
 	Copyright (c) 2024 Antoine Martin <antoine@xpra.org>
@@ -22,149 +23,152 @@
     </div>
 
     <script>
-        const info = document.getElementById("info");
-        const lines = [];
-
-        function show(newtext) {
-            console.log(newtext);
-            lines.push(newtext);
-            info.innerText = lines.join("\n");
-        }
-
-        const key = "this is our secret";
-        const salt = Utilities.u8("0000000000000000");
-        const key_size = 32;
-        const iterations = 10000;
-        const mode = "CBC";
-        const key_hash = "SHA-1";
-        const usage = "encrypt";
-        const iv = "0000000000000000";
-
-        const params = {
-            name: "AES-"+mode,   //ie: "AES-CBC"
-            iv: Utilities.u8(iv),
-        }
-
-        function cmp(v1, v2) {
-            const a1 = Utilities.u8(v1);
-            const a2 = Utilities.u8(v2);
-            if (a1.length != a2.length) {
-                return false;
-            }
-            return a1.every((v,i) => v === a2[i]);
+      const info = document.getElementById("info");
+      const lines = [];
+
+      function show(newtext) {
+        console.log(newtext);
+        lines.push(newtext);
+        info.innerText = lines.join("\n");
+      }
+
+      const key = "this is our secret";
+      const salt = Utilities.u8("0000000000000000");
+      const key_size = 32;
+      const iterations = 10000;
+      const mode = "CBC";
+      const key_hash = "SHA-1";
+      const usage = "encrypt";
+      const iv = "0000000000000000";
+
+      const params = {
+        name: "AES-" + mode, //ie: "AES-CBC"
+        iv: Utilities.u8(iv),
+      }
+
+      function cmp(v1, v2) {
+        const a1 = Utilities.u8(v1);
+        const a2 = Utilities.u8(v2);
+        if (a1.length != a2.length) {
+          return false;
         }
+        return a1.every((v, i) => v === a2[i]);
+      }
 
-        function verify(expected, actual) {
-            if (!expected) {
-                return;
-            }
-            if (cmp(expected, actual)) {
-                show("             (all "+expected.length+" bytes match the expected value)");
-                return;
-            }
-            const eu8 = Utilities.u8(expected);
-            const au8 = Utilities.u8(actual);
-            show(" mismatch:");
-            show("  expected "+eu8.length+" bytes: " + Utilities.arrayhex(eu8));
-            show("  but got  "+au8.length+" bytes: " + Utilities.arrayhex(au8));
+      function verify(expected, actual) {
+        if (!expected) {
+          return;
         }
-
-        function show_value(what, value) {
-            const u8array = new Uint8Array(value);
-            show(""+what+": "+JSON.stringify(Utilities.ArrayBufferToString(u8array))+" ("+u8array.length+" bytes)");
-        }
-
-        function decrypt(crypto_key, encrypted, expected) {
-            crypto.subtle.decrypt(params, crypto_key, encrypted)
-            .then(decrypted => {
-                show_value("decrypted ", decrypted);
-                verify(expected, decrypted);
-            })
-            .catch(err => show("failed to decrypt "+encrypted.byteLength+" bytes message: "+Utilities.arrayhex(encrypted)));
+        if (cmp(expected, actual)) {
+          show("             (all " + expected.length + " bytes match the expected value)");
+          return;
         }
-
-        function encrypt(crypto_key, message, expected) {
-            show_value("encrypting", message);
-
-            crypto.subtle.encrypt(params, crypto_key, Utilities.u8(message))
-            .then(encrypted => {
-                show_value("encrypted ", encrypted);
-                verify(expected, encrypted);
-                decrypt(crypto_key, encrypted, message);
-            })
-            .catch(err => show("failed to encrypt message"));
-        }
-
-        show("importing key '"+key+"'");
-        crypto.subtle.importKey("raw", Utilities.u8(key), { name: "PBKDF2" }, false, ["deriveKey", "deriveBits"])
+        const eu8 = Utilities.u8(expected);
+        const au8 = Utilities.u8(actual);
+        show(" mismatch:");
+        show("  expected " + eu8.length + " bytes: " + Utilities.arrayhex(eu8));
+        show("  but got  " + au8.length + " bytes: " + Utilities.arrayhex(au8));
+      }
+
+      function show_value(what, value) {
+        const u8array = new Uint8Array(value);
+        show("" + what + ": " + JSON.stringify(Utilities.ArrayBufferToString(u8array)) + " (" + u8array.length + " bytes)");
+      }
+
+      function decrypt(crypto_key, encrypted, expected) {
+        crypto.subtle.decrypt(params, crypto_key, encrypted)
+          .then(decrypted => {
+            show_value("decrypted ", decrypted);
+            verify(expected, decrypted);
+          })
+          .catch(err => show("failed to decrypt " + encrypted.byteLength + " bytes message: " + Utilities.arrayhex(encrypted)));
+      }
+
+      function encrypt(crypto_key, message, expected) {
+        show_value("encrypting", message);
+
+        crypto.subtle.encrypt(params, crypto_key, Utilities.u8(message))
+          .then(encrypted => {
+            show_value("encrypted ", encrypted);
+            verify(expected, encrypted);
+            decrypt(crypto_key, encrypted, message);
+          })
+          .catch(err => show("failed to encrypt message"));
+      }
+
+      show("importing key '" + key + "'");
+      crypto.subtle.importKey("raw", Utilities.u8(key), {
+          name: "PBKDF2"
+        }, false, ["deriveKey", "deriveBits"])
         .then(imported_key => {
-            show("imported key: "+imported_key);
-            show("deriving " + mode + " key");
-            show(" " + iterations + " iterations, " + key_hash + " hash, " + (key_size * 8)+ " bits");
-            show(" salt=" + salt);
-            // now stretch it to get the real key:
-            crypto.subtle.deriveKey(
-                {
-                    name: "PBKDF2",
-                    salt: salt,
-                    iterations: iterations,
-                    hash: {name: key_hash},
-                }, imported_key,
-                {
-                    name: "AES-"+mode,
-                    length: key_size * 8,
-                }, false, ["encrypt", "decrypt"],
-            )
+          show("imported key: " + imported_key);
+          show("deriving " + mode + " key");
+          show(" " + iterations + " iterations, " + key_hash + " hash, " + (key_size * 8) + " bits");
+          show(" salt=" + salt);
+          // now stretch it to get the real key:
+          crypto.subtle.deriveKey({
+              name: "PBKDF2",
+              salt: salt,
+              iterations: iterations,
+              hash: {
+                name: key_hash
+              },
+            }, imported_key, {
+              name: "AES-" + mode,
+              length: key_size * 8,
+            }, false, ["encrypt", "decrypt"], )
             .then(crypto_key => {
-                show("derived key for " + usage + " usage: " + crypto_key);
-
-                show("iv '"+iv+"'");
+              show("derived key for " + usage + " usage: " + crypto_key);
+
+              show("iv '" + iv + "'");
+              show("-------------------------------------");
+
+              let message = "some message1234";
+              encrypt(crypto_key, Utilities.u8(message));
+
+              // try again with hard-coded encrypted message:
+              let encrypted = Utilities.hexarray("6339a0861384e208ed20313a649122980c79458182b8882dbf1cca137a0f88bd");
+              decrypt(crypto_key, encrypted, message);
+
+              function hexdata_test(data, enc_value) {
+                let packet_data = Utilities.hexarray(data);
+                let enc_data = Utilities.hexarray(enc_value);
+                encrypt(crypto_key, packet_data, enc_data);
+              }
+
+              const samples = new Map();
+              samples.set("bd0b0000f42ec28568656c6c6f3c86646967657374cb83786f728b686d61632b7368613531328d686d61632b736861335f3531328d686d61632b736861335f3338348d280058335f3235360e003532348b380016380c00fa303235368b686d61632b7368613232348c686d61632b626c616b6532738c686d61632b626c616b6532628b73616c742d646967657374ca8b686d61632b7368618100443531328d4d000f8f004df6ff8c636f6d70726573736f7273c3836c7a348662726f746c69846e6f6e6588656e636f64657273c28b72656e636f6465706c7573846e6f6e6585666c75736843836c7a346780438662726f746c69678043846e6f6e656780438b72656e636f6465706c75736780438770616464696e6767876f7074696f6e73c186504b43532337856d6f64657367876f7074696f6e73c4834342438347434d8343464283435452877374726574636867876f7074696f6e73c18650424b44463293707974686f6e2d63727970746f6772617068796880438776657273696f6ec3290007846d6f64658c583131207365616d6c6573738c73657373696f6e2d74797065887365616d6c657373847575696436343a306636623537383938303662363763363861363332643237653931396633396163373536383335616165623630646265313434333738346336393666323763318a6d616368696e652d6964a065636238333837356261323234653133393666653763306136613062383263378776657273696f6e83362e328a73746172745f74696d654066fe21e98c63757272656e1200fd23f48c656c61707365645f74696d650a8b7365727665725f747970658e507974686f6e2f67746b2f7831318b7365727665722efa00f20b88686f73746e616d65866665646f72618f726561646f6e6c792d4d002443881100ff07448a7365727665722d6c6f67808a6d616368696e655fd30010045d01f15c5f6e616d6585787465726d8a6b65795f726570656174c20000946b65795f7265706561745f6d6f64696669657273438462656c6c4487637572736f7273448c6465736b746f705f73697a65c23f04a43f059b887864672d6d656e75668b737562636f6d6d616e6473f080853901118d0600f3ff9a2d6465736b746f708d73746172742d6d6f6e69746f7286736861646f778d736861646f772d73637265656e87757067726164658f757067726164652d6465736b746f708f757067726164652d6d6f6e69746f728e757067726164652d736861646f77866174746163688873657373696f6e73886c61756e63686572836775698973746172742d6775698a6275672d7265706f727487746f6f6c626f788561626f7574876578616d706c658664657461636884696e666f8269648776657273696f6e8473746f7084657869748a73637265656e73686f7487636f6e74726f6c857072696e74857368656c6c8973656e642d66696c6589636f6e66696775726585636c65616e8d636c65616e2d736f636b6574738e636c65616e2d646973706c617973896175746f73746172748a73686f77636f6e6669678973657475702d73736c8873686f772d73736c846c6973748d6c6973742d73657373696f6e738c6c6973742d77696e646f777388646973706c61797388656e636f64696e6789706174682d696e666f8568746d6c3584646f6373896c6973742d6d646e73886d646e732d677569906d61785fa70103df01631e003f10e087a300f2fb823a318f636c69656e742d73687574646f776e438773686172696e67448e73686172696e672d746f67676c6544846c6f636b448b6c6f636b2d746f67676c65448777696e646f777343886b6579626f617264438d696e7075742d6465766963657385787465737490706f696e7465722e72656c617469766543876e6574776f726b678f62616e6477696474682d6c696d697400857368656c6c439273746172742d6e65772d636f6d6d616e64734492657869742d776974682d6368696c6472656e44977365727665722d636f6d6d616e64732d7369676e616c73c686534947494e54875349475445524d86534947485550875349474b494c4c87534947555352318753494755535232949403064700f216696e666f4393637572736f722e64656661756c745f73697a65208f637572736f722e6d61785301c23e403e408d726573697a655fef02f3ff7a438c726573697a655f6578616374438c666f7263655f756e6772616243976b6579626f6172642e666173742d737769746368696e67438d776865656c2e707265636973654490706f696e7465722e6f7074696f6e616c438f746f7563687061642d646576696365448c73637265656e2d73697a6573e7c23f1e003f10e0c23f14003f0b40c23f10003f0900c23f0f003f0870c23f0c803f0708c23f0b403f0654c23f0a003f0640c23f0a003f05a0c23f08003f0600c23f07803f05a0c23f07403f0570c23f07003f0540c23f08003f0480c23f07803f04b0c23f07803f0438c23f06403f04b0c23f06903f041ac23f05783f041ac23f06403f0384c23f05003f0400c23f05783f0384c23f05003f03c0c23f05583f0300c23f05003f0320c23f04803f0360c23f05003f02d0c23f04003f0300c23f04003f0240c23f03403f0270c23f03c03f021cc23f03203f0258c23f03603f01e6c23f02803f01e0c23f02d03f0195c23f02d03f0190c23f02803f0190c23f02803f0168c23f02803f015ec23f04a43f059b874201fbb767856772616273438677696e646f776b8d6672616d652d657874656e7473438f636f6e6669677572652e64656c746143877369676e616c73c686534947494e54875349475445524d875349475155495487534947434f4e548753494755535231875349475553523289647261676e64726f704386737461746573c88969636f6e696669656487666f63757365648a66756c6c73637265656e8561626f76658562656c6f7786737469636b798969636f6e6966696564896d6178696d697a65649361637475616cc803f8020f003f087090726f6f745f77696e646f771800f3168a656e6372797074696f6e728663697068657283414553846d6f6465834342438c6d6f646559020e0208978269769030303030300500c4886b65795f73616c7431362f1400040200011c00f134686173688453484131886b65795f73697a65208b6b65795f737472657463688650424b444632936b65795f737472657463682e6f7074696f6e73c18650424b444632966300027d08f30f5f697465726174696f6e733f27108770616464696e6786504b435323378f0f0004c10013c118001491e306f40c5f6b6579636f6465736e857368696674c2c28753686966745f4c000a00f2115200846c6f636bc1c289436170735f4c6f636b0087636f6e74726f6cc2c289430a00625f4c00c289431106f43e5f5200846d6f6431c4c2864d6574615f4c01c285416c745f4c01c200864d6574615f4cc2864d6574615f5201846d6f6432c1c2884e756d5f4c6f636b00846d6f6433c3c28753757065725f4c000a0015520a00f30a4c01846d6f6434c2c28748797065725f4c01c28748797065727800fd0835c2c29049534f5f4c6576656c335f536869667400c2001400f02a9270696e672d6563686f2d736f7572636569644388656e636f64696e67846175746f926175746f5f726566726573685f64656c61793f01f47f",
+                "9080ed5f000fc0efea6148046553745f748a5c83c5732c3bb082ce5e479daeecca56755deec748b443104738ddb928e4005895baf85a0e1f19880ef80524d6c34ff375a4bd2f74a06aae1402a6dfde453d5a45e02893ed2ce808e24c2fa9599e80ffd4fdce1a14603857ced7f38d8f6e85c89ea1e81638c4eed906ebce67ff3f3976ea691e9f35fa528035307fecd4a4a0f38bcfd82eb8fff0d312f762c05b404763e6f91f63ff2c78f4fc8beb6c2a5cceec7a215375ba4638192c401faedea0fe0adce266b8c19fe1f05a4cd435cf17569fcb397693f1e2a5987e71548364ad48cf73a4c31bbee59962d6331d761eabdcb060029af5b98e6c57e2770516cac66a5666e14e9c7e8140f763ec732688d5334557ec2e70e3dc939595938def061ad2f62dcef1964ebc6e436c62596c41cc4e0f83295d3cac2d3f3202eaee1e63d4e49c2527e32bd085a35a63f11f0d8999bb9df67d0aafe1430f3125e0a406507ed55db6207c21e554dc25c446b3da7692b15b790fd355928b62f389ff2cbbdb706aaf6e78b4a4ca575a0fb73b959d5771b017ab070cba9381be091b0fd4bd8deacb57509a2f299ea52fbe74f5ee35e8d66a382a7d15e3c1894877db17d644d29c2ba1a373fe3ae6a515c443295ca4bcbb46f63f42972eefdcf238cbe3436a313f7eec0fe5887cb7ed652b020f595a29e1b67931440166456720a3c1e836b54433e526fdfaee09a70ba8a6f4922e6cff9273f47ecbbea31cb5a7d241072ad32c72178a5713b12768602f90e127820643d3853f8d6b351ba94346f56ad4cf3b36c5b6bff3982f52c7155b64ae50eed30e47f7262f40ae7066e5dbd94630c97e8ff7c418cf40218c18978d5d29775b23fff56fa3d25acd424e89722283880c9dd88a547af275d59cc8935d0e4d59b181413d140ce9ce6a653ca913808b122d21e9bd838035076315476cb78289112d34f8172234f17c301ece9193e2c026e19a29a70b74b0ed4b880d8a7ec7ba937289b864925ff55b1d27d8742fa2eeef7416bb627b7534a5e1d7bc6a654109f400b191aaa8c1e2ddccfa95a3c9d80d01cee23de95a33d0f18e474d9680ea6c87166196ec5813e1b325e531954842d6c7e794eea813b3bd2a6bbb2d0dcc01cd41e7bfb57cd664e8bace03e6faa21721bcb7499d8a279f22a4ec655b9219cfd2584b9081888ae5796973404af30bd54d83bc33636befb52d0ebc8457d254ef3e7ebdaa4aeb6032ef1a3c5b437b06071b6ba1e4080dd2d2fc3fc7a834048e620f4b3833a538cf6f09d077e798398cb55c3fb46fbc3f642ac25b58fddaf1fc51a6496f1effde24e782d56e9b358396fed3925f33ef1ca5aa5e3fc1661b31c195eb1006543c53dd4a7a1f6146ac32045d9f6416f2d65c8a670f1c57c3eee3d305ae0ba9a0052bc9b0e8f4c48a821115519e3286e85b6daeed5b6d434ede450c952b55dac7b8c49f3734c38caf1ce1b44c4b46b92a2010097690e59c0b47db608bb9c61af9a82af81eaafdd25ff44a71176422ae22307d9c08833142408e5f531caeab8619e7862c2d8fb2b6bd5bf33c4b350f9cf6f4b83d12e42aaf68e669259f6b9f6b05a46b15ebecfb760fe3ebba01615714817b8913eea9fa14a6419e1dbc56094eb84ecc88f0ce85c2434bce666ad046fb70ed689132489f1cb651c1495938593d5fb03103eab2bbc1f9861c0e354d9f3787c4d5253774490d2309bf2ba064b0213602dde232149e2dea0f31fd937e7672760d7448970ac985a471aa2e0ed4066185e2265baf716f3ca58ffe5ababfb0826a167d12c50736cfc59e577b7d2092e448ad70a1e4081773eaca13497c74b3bd968aa6206ca7136f564ec2a3aa45aae29d42a83d37a83bf5901b463ff114093cdbf9552decf5f6af2d9e8dc2eba6426bdf221f0485fdad27e73e7f0ca58813d263fe0e9cb0427a04fb309659d2de463a2224381d9f44f62494f6f851b22cd30f57ce26324162e79989d8dde611c622eeb0ab09978db0ff5bfd23bf3f39dcd053fb7ee2250373ca23df1c6e345d280b567c4753ba378249df0eca60ea5a2564b4c49cff56c568a4417e33e1a9a543b0fffb3c92fcb204085d3c9911f0aeb5f0b163f4c05c57ad321fa291e02541f9d170da6574649de56e33cb6670700c1a1c173cdac4918e7176f30871165d700aedf380bb1016dddfa9e334e574b004b81f4ad6b8974ebc26aa1784a523c11d258373ceb5a5183e92843960861d917d1da1b66628969956f6012648695aec15f81cd311cf164d05c11eec03799019bd61975341280d7899f267e9d304f9d558e8a23737ccdd922a18f59413bace67137deee8e540c5b330eb89d66cfa3cf90effd8951e567b8771309fbc6f0061a1949c9b5a329a5a33fbb9ca2d4da721c57ffad659360acb5aa44c8480e556fc03d81826bbf207a4ca5c80b8769fe8628decfed6d1b15264bd262a8bd2cc8bf007324a5417c9bf33e0a886c34e03b192800cfc57796ca6756bfd92631f40abe9819d38a2af2b235ee2bf94264b9f56cd37e4d910422dbcfc39c4e672e0aa858f34e9b9d77cd3a666fe45c285a0cdce5f4b450f1e950d4f110babbb9ce24fe7ad67bcf38cbe13efed3057b2bf90bf2144f0bbe5895d1606670d673f0493e29466b053563ba91090191bcab799c4de818778cdb777e6e388748e2369365e4e384fe653bc26c50221ffcbf61eae4c016489e9248b573b7ae8e78b0bdf0b88d472429a4b55f177a638c00bb67891e67dc88e3377049264f6a34181f60a923006f8ad87f85a654e6084b2ce65eb5b3d8faec06a27194a48aee85817596ae2e35c087826927f70b896059d85a58290c865aa3d43ef1db33d8b87ac5705636af303600a5c9afb5edb7bcda1c7c78e9ce538e567a94ada819f6b9289191cf2c641247acd2b169e1f4206bb7f19bd9e2264f28b8d3ed44b40ae5d0366487f6285514c944f533ab23638c0d3afb5437ee29ad686319f68452cc2f67779e390eb488d561df7711030b6357d250f4b3cd9c25d43e2f16e892340a50746dd895e42117ea8a383326b073262c7ceb99523ebffa4261712f038b9b800e265024899d416ab33391c27e54468431a2f56df635169dd5484835fcba14d56dc8d6d862e610a7cca5ff1d9a37a2746f4f94e97e2861785c66ef6a4337fe88b421579148172e10648f8e18916ad5bdcca19ae27a00ab91b989246f38816e3b76a8c63e5ae6d72e7ec69854bff721dd375474c1cd472a99f043703a45f8e9624130f1f2395d41724388ce6cad2bd82203c285e0bf360707a6ef17dfd240f2e8ee53d376ed414b7c8de9a5ff9daf22e962c57fa6e7acef60b4f795081d477316d7b1738898751c16dde321ac7bed38d262dcf4a1f6e70c51241ce7e5c4e80f50869995ffc1653cca11afa258aa704fbd632ad767d339edfb32359e19a907229f37f4c2fd8bea9ac2acd22b4ef5d0cf3aa662244a3721aa63e307c10f96e93e4334743e69b13bcdcc091ea7cfff2f471b62782f5d93e6868956cf3c64dd4524a02b3d44292e30e64753ee77e0c39b4f244fed9b5d50bfb2f8e4c9c17639e9ee9b738f62a9e7e5fc6567f1995dbbe6d0a3cfce04291c389c5e45f62cfde2569b63c46b96f27510b979d10d795ffe4eb8c8267fa66515e0d60a6082b9fce81710837e7e241d75b3097712806f604df3795015e978af603388001dfb47858224f1bb7777109e9b9c3a105cc05c246bfde0193158c9c0fe57c44b15fd8078c486689a7d4362f35853b142810d3789833e7513cc6b8c5");
+              samples.set("c289656e636f64696e67736789656e636f64696e67736d80c483706e6783726762846a70656789677261797363616c6584636f7265c483706e67857267623234857267623332846a70656787616c6c6f776564c583706e6783726762857267623234857267623332846a706567886c6f73736c657373c383706e678572676232348572676233328a776974685f7370656564c283706e67837267628c776974685f7175616c697479c1846a70656792776974685f6c6f73736c6573735f6d6f6465c183706e67",
+                "8f7c3c358b7853a3a6d8e1ebd326e3b109bb267a40919f73e85ce55438e537237c6741120cf97e615b34aefbd7d3d128cc5d065e2307f74a56e9a7a7130908591276e240c464542b5fbcfee2b3f7e91a689df9f502044a41ed82209c458d1f149605fbfa7b024ebf09274d6d424f23e455a911a21fd8bf46fd6293a565b053b542277e31ea5cddb61dbaeede2a9e083b45712a5d77dd0a1baeb9610d439a4afb6ac5722f93f2a9772d7de4559c716ebf45cb2e47ac0726b28851b7a54e74750b08f949bf5b593b7df7042ba6b41d89ef");
+              samples.set("c88a6e65772d77696e646f770100003f01f33f013c6b857469746c659e616e746f696e65406665646f72613a7e2f70726f6a656374732f787072618e636c6173732d696e7374616e6365c285787465726d85585465726d8b77696e646f772d74797065c1864e4f524d414c9073697a652d636f6e73747261696e74736a89626173652d73697a65c2130489696e6372656d656e74c2060d8767726176697479018c6d696e696d756d2d73697a65c219118669636f6e6963446607",
+                "fc3e3fbd6b2f7c0836e554ad40ed543c008c2be86f12ac0e0f76f7bde1181bbe1b5cad6308a4e6f22f3c5dd1804217d9e3ea56d439a0c49424264d928b6e8a60a20eb810ba0588525673604627d114911d6b97b385a6df078848db2ab5bc978a260e3103ce3af0dcdafa499eae4d88dff9a5d1714d5fd738df3fc4e4cc8aa3f26008fd3ce49992e88c9f2c476b00c441ad0374cba6fea1b4a27dc39c444f52affae4f3640ffe34590935194fb16e147d9c5c0479c5ec5fb3b228006467fe7a1d");
+              samples.set("c38e73657474696e672d6368616e6765887864672d6d656e7566",
+                "0ff97c8e05b7a6e4a3608801cc105f21c18e3b53115c65af35e76732a4396664");
+              samples.set("c190737461727475702d636f6d706c657465",
+                "0c1f485983484a0348a3760616ec4c08848f480a8e2831b3035aa067e7769b18");
+
+              function test_sample() {
                 show("-------------------------------------");
-
-                let message = "some message1234";
-                encrypt(crypto_key, Utilities.u8(message));
-
-                // try again with hard-coded encrypted message:
-                let encrypted = Utilities.hexarray("6339a0861384e208ed20313a649122980c79458182b8882dbf1cca137a0f88bd");
-                decrypt(crypto_key, encrypted, message);
-
-                function hexdata_test(data, enc_value) {
-                    let packet_data = Utilities.hexarray(data);
-                    let enc_data = Utilities.hexarray(enc_value);
-                    encrypt(crypto_key, packet_data, enc_data);
-                }
-
-                const samples = new Map();
-                samples.set("bd0b0000f42ec28568656c6c6f3c86646967657374cb83786f728b686d61632b7368613531328d686d61632b736861335f3531328d686d61632b736861335f3338348d280058335f3235360e003532348b380016380c00fa303235368b686d61632b7368613232348c686d61632b626c616b6532738c686d61632b626c616b6532628b73616c742d646967657374ca8b686d61632b7368618100443531328d4d000f8f004df6ff8c636f6d70726573736f7273c3836c7a348662726f746c69846e6f6e6588656e636f64657273c28b72656e636f6465706c7573846e6f6e6585666c75736843836c7a346780438662726f746c69678043846e6f6e656780438b72656e636f6465706c75736780438770616464696e6767876f7074696f6e73c186504b43532337856d6f64657367876f7074696f6e73c4834342438347434d8343464283435452877374726574636867876f7074696f6e73c18650424b44463293707974686f6e2d63727970746f6772617068796880438776657273696f6ec3290007846d6f64658c583131207365616d6c6573738c73657373696f6e2d74797065887365616d6c657373847575696436343a306636623537383938303662363763363861363332643237653931396633396163373536383335616165623630646265313434333738346336393666323763318a6d616368696e652d6964a065636238333837356261323234653133393666653763306136613062383263378776657273696f6e83362e328a73746172745f74696d654066fe21e98c63757272656e1200fd23f48c656c61707365645f74696d650a8b7365727665725f747970658e507974686f6e2f67746b2f7831318b7365727665722efa00f20b88686f73746e616d65866665646f72618f726561646f6e6c792d4d002443881100ff07448a7365727665722d6c6f67808a6d616368696e655fd30010045d01f15c5f6e616d6585787465726d8a6b65795f726570656174c20000946b65795f7265706561745f6d6f64696669657273438462656c6c4487637572736f7273448c6465736b746f705f73697a65c23f04a43f059b887864672d6d656e75668b737562636f6d6d616e6473f080853901118d0600f3ff9a2d6465736b746f708d73746172742d6d6f6e69746f7286736861646f778d736861646f772d73637265656e87757067726164658f757067726164652d6465736b746f708f757067726164652d6d6f6e69746f728e757067726164652d736861646f77866174746163688873657373696f6e73886c61756e63686572836775698973746172742d6775698a6275672d7265706f727487746f6f6c626f788561626f7574876578616d706c658664657461636884696e666f8269648776657273696f6e8473746f7084657869748a73637265656e73686f7487636f6e74726f6c857072696e74857368656c6c8973656e642d66696c6589636f6e66696775726585636c65616e8d636c65616e2d736f636b6574738e636c65616e2d646973706c617973896175746f73746172748a73686f77636f6e6669678973657475702d73736c8873686f772d73736c846c6973748d6c6973742d73657373696f6e738c6c6973742d77696e646f777388646973706c61797388656e636f64696e6789706174682d696e666f8568746d6c3584646f6373896c6973742d6d646e73886d646e732d677569906d61785fa70103df01631e003f10e087a300f2fb823a318f636c69656e742d73687574646f776e438773686172696e67448e73686172696e672d746f67676c6544846c6f636b448b6c6f636b2d746f67676c65448777696e646f777343886b6579626f617264438d696e7075742d6465766963657385787465737490706f696e7465722e72656c617469766543876e6574776f726b678f62616e6477696474682d6c696d697400857368656c6c439273746172742d6e65772d636f6d6d616e64734492657869742d776974682d6368696c6472656e44977365727665722d636f6d6d616e64732d7369676e616c73c686534947494e54875349475445524d86534947485550875349474b494c4c87534947555352318753494755535232949403064700f216696e666f4393637572736f722e64656661756c745f73697a65208f637572736f722e6d61785301c23e403e408d726573697a655fef02f3ff7a438c726573697a655f6578616374438c666f7263655f756e6772616243976b6579626f6172642e666173742d737769746368696e67438d776865656c2e707265636973654490706f696e7465722e6f7074696f6e616c438f746f7563687061642d646576696365448c73637265656e2d73697a6573e7c23f1e003f10e0c23f14003f0b40c23f10003f0900c23f0f003f0870c23f0c803f0708c23f0b403f0654c23f0a003f0640c23f0a003f05a0c23f08003f0600c23f07803f05a0c23f07403f0570c23f07003f0540c23f08003f0480c23f07803f04b0c23f07803f0438c23f06403f04b0c23f06903f041ac23f05783f041ac23f06403f0384c23f05003f0400c23f05783f0384c23f05003f03c0c23f05583f0300c23f05003f0320c23f04803f0360c23f05003f02d0c23f04003f0300c23f04003f0240c23f03403f0270c23f03c03f021cc23f03203f0258c23f03603f01e6c23f02803f01e0c23f02d03f0195c23f02d03f0190c23f02803f0190c23f02803f0168c23f02803f015ec23f04a43f059b874201fbb767856772616273438677696e646f776b8d6672616d652d657874656e7473438f636f6e6669677572652e64656c746143877369676e616c73c686534947494e54875349475445524d875349475155495487534947434f4e548753494755535231875349475553523289647261676e64726f704386737461746573c88969636f6e696669656487666f63757365648a66756c6c73637265656e8561626f76658562656c6f7786737469636b798969636f6e6966696564896d6178696d697a65649361637475616cc803f8020f003f087090726f6f745f77696e646f771800f3168a656e6372797074696f6e728663697068657283414553846d6f6465834342438c6d6f646559020e0208978269769030303030300500c4886b65795f73616c7431362f1400040200011c00f134686173688453484131886b65795f73697a65208b6b65795f737472657463688650424b444632936b65795f737472657463682e6f7074696f6e73c18650424b444632966300027d08f30f5f697465726174696f6e733f27108770616464696e6786504b435323378f0f0004c10013c118001491e306f40c5f6b6579636f6465736e857368696674c2c28753686966745f4c000a00f2115200846c6f636bc1c289436170735f4c6f636b0087636f6e74726f6cc2c289430a00625f4c00c289431106f43e5f5200846d6f6431c4c2864d6574615f4c01c285416c745f4c01c200864d6574615f4cc2864d6574615f5201846d6f6432c1c2884e756d5f4c6f636b00846d6f6433c3c28753757065725f4c000a0015520a00f30a4c01846d6f6434c2c28748797065725f4c01c28748797065727800fd0835c2c29049534f5f4c6576656c335f536869667400c2001400f02a9270696e672d6563686f2d736f7572636569644388656e636f64696e67846175746f926175746f5f726566726573685f64656c61793f01f47f",
-                            "9080ed5f000fc0efea6148046553745f748a5c83c5732c3bb082ce5e479daeecca56755deec748b443104738ddb928e4005895baf85a0e1f19880ef80524d6c34ff375a4bd2f74a06aae1402a6dfde453d5a45e02893ed2ce808e24c2fa9599e80ffd4fdce1a14603857ced7f38d8f6e85c89ea1e81638c4eed906ebce67ff3f3976ea691e9f35fa528035307fecd4a4a0f38bcfd82eb8fff0d312f762c05b404763e6f91f63ff2c78f4fc8beb6c2a5cceec7a215375ba4638192c401faedea0fe0adce266b8c19fe1f05a4cd435cf17569fcb397693f1e2a5987e71548364ad48cf73a4c31bbee59962d6331d761eabdcb060029af5b98e6c57e2770516cac66a5666e14e9c7e8140f763ec732688d5334557ec2e70e3dc939595938def061ad2f62dcef1964ebc6e436c62596c41cc4e0f83295d3cac2d3f3202eaee1e63d4e49c2527e32bd085a35a63f11f0d8999bb9df67d0aafe1430f3125e0a406507ed55db6207c21e554dc25c446b3da7692b15b790fd355928b62f389ff2cbbdb706aaf6e78b4a4ca575a0fb73b959d5771b017ab070cba9381be091b0fd4bd8deacb57509a2f299ea52fbe74f5ee35e8d66a382a7d15e3c1894877db17d644d29c2ba1a373fe3ae6a515c443295ca4bcbb46f63f42972eefdcf238cbe3436a313f7eec0fe5887cb7ed652b020f595a29e1b67931440166456720a3c1e836b54433e526fdfaee09a70ba8a6f4922e6cff9273f47ecbbea31cb5a7d241072ad32c72178a5713b12768602f90e127820643d3853f8d6b351ba94346f56ad4cf3b36c5b6bff3982f52c7155b64ae50eed30e47f7262f40ae7066e5dbd94630c97e8ff7c418cf40218c18978d5d29775b23fff56fa3d25acd424e89722283880c9dd88a547af275d59cc8935d0e4d59b181413d140ce9ce6a653ca913808b122d21e9bd838035076315476cb78289112d34f8172234f17c301ece9193e2c026e19a29a70b74b0ed4b880d8a7ec7ba937289b864925ff55b1d27d8742fa2eeef7416bb627b7534a5e1d7bc6a654109f400b191aaa8c1e2ddccfa95a3c9d80d01cee23de95a33d0f18e474d9680ea6c87166196ec5813e1b325e531954842d6c7e794eea813b3bd2a6bbb2d0dcc01cd41e7bfb57cd664e8bace03e6faa21721bcb7499d8a279f22a4ec655b9219cfd2584b9081888ae5796973404af30bd54d83bc33636befb52d0ebc8457d254ef3e7ebdaa4aeb6032ef1a3c5b437b06071b6ba1e4080dd2d2fc3fc7a834048e620f4b3833a538cf6f09d077e798398cb55c3fb46fbc3f642ac25b58fddaf1fc51a6496f1effde24e782d56e9b358396fed3925f33ef1ca5aa5e3fc1661b31c195eb1006543c53dd4a7a1f6146ac32045d9f6416f2d65c8a670f1c57c3eee3d305ae0ba9a0052bc9b0e8f4c48a821115519e3286e85b6daeed5b6d434ede450c952b55dac7b8c49f3734c38caf1ce1b44c4b46b92a2010097690e59c0b47db608bb9c61af9a82af81eaafdd25ff44a71176422ae22307d9c08833142408e5f531caeab8619e7862c2d8fb2b6bd5bf33c4b350f9cf6f4b83d12e42aaf68e669259f6b9f6b05a46b15ebecfb760fe3ebba01615714817b8913eea9fa14a6419e1dbc56094eb84ecc88f0ce85c2434bce666ad046fb70ed689132489f1cb651c1495938593d5fb03103eab2bbc1f9861c0e354d9f3787c4d5253774490d2309bf2ba064b0213602dde232149e2dea0f31fd937e7672760d7448970ac985a471aa2e0ed4066185e2265baf716f3ca58ffe5ababfb0826a167d12c50736cfc59e577b7d2092e448ad70a1e4081773eaca13497c74b3bd968aa6206ca7136f564ec2a3aa45aae29d42a83d37a83bf5901b463ff114093cdbf9552decf5f6af2d9e8dc2eba6426bdf221f0485fdad27e73e7f0ca58813d263fe0e9cb0427a04fb309659d2de463a2224381d9f44f62494f6f851b22cd30f57ce26324162e79989d8dde611c622eeb0ab09978db0ff5bfd23bf3f39dcd053fb7ee2250373ca23df1c6e345d280b567c4753ba378249df0eca60ea5a2564b4c49cff56c568a4417e33e1a9a543b0fffb3c92fcb204085d3c9911f0aeb5f0b163f4c05c57ad321fa291e02541f9d170da6574649de56e33cb6670700c1a1c173cdac4918e7176f30871165d700aedf380bb1016dddfa9e334e574b004b81f4ad6b8974ebc26aa1784a523c11d258373ceb5a5183e92843960861d917d1da1b66628969956f6012648695aec15f81cd311cf164d05c11eec03799019bd61975341280d7899f267e9d304f9d558e8a23737ccdd922a18f59413bace67137deee8e540c5b330eb89d66cfa3cf90effd8951e567b8771309fbc6f0061a1949c9b5a329a5a33fbb9ca2d4da721c57ffad659360acb5aa44c8480e556fc03d81826bbf207a4ca5c80b8769fe8628decfed6d1b15264bd262a8bd2cc8bf007324a5417c9bf33e0a886c34e03b192800cfc57796ca6756bfd92631f40abe9819d38a2af2b235ee2bf94264b9f56cd37e4d910422dbcfc39c4e672e0aa858f34e9b9d77cd3a666fe45c285a0cdce5f4b450f1e950d4f110babbb9ce24fe7ad67bcf38cbe13efed3057b2bf90bf2144f0bbe5895d1606670d673f0493e29466b053563ba91090191bcab799c4de818778cdb777e6e388748e2369365e4e384fe653bc26c50221ffcbf61eae4c016489e9248b573b7ae8e78b0bdf0b88d472429a4b55f177a638c00bb67891e67dc88e3377049264f6a34181f60a923006f8ad87f85a654e6084b2ce65eb5b3d8faec06a27194a48aee85817596ae2e35c087826927f70b896059d85a58290c865aa3d43ef1db33d8b87ac5705636af303600a5c9afb5edb7bcda1c7c78e9ce538e567a94ada819f6b9289191cf2c641247acd2b169e1f4206bb7f19bd9e2264f28b8d3ed44b40ae5d0366487f6285514c944f533ab23638c0d3afb5437ee29ad686319f68452cc2f67779e390eb488d561df7711030b6357d250f4b3cd9c25d43e2f16e892340a50746dd895e42117ea8a383326b073262c7ceb99523ebffa4261712f038b9b800e265024899d416ab33391c27e54468431a2f56df635169dd5484835fcba14d56dc8d6d862e610a7cca5ff1d9a37a2746f4f94e97e2861785c66ef6a4337fe88b421579148172e10648f8e18916ad5bdcca19ae27a00ab91b989246f38816e3b76a8c63e5ae6d72e7ec69854bff721dd375474c1cd472a99f043703a45f8e9624130f1f2395d41724388ce6cad2bd82203c285e0bf360707a6ef17dfd240f2e8ee53d376ed414b7c8de9a5ff9daf22e962c57fa6e7acef60b4f795081d477316d7b1738898751c16dde321ac7bed38d262dcf4a1f6e70c51241ce7e5c4e80f50869995ffc1653cca11afa258aa704fbd632ad767d339edfb32359e19a907229f37f4c2fd8bea9ac2acd22b4ef5d0cf3aa662244a3721aa63e307c10f96e93e4334743e69b13bcdcc091ea7cfff2f471b62782f5d93e6868956cf3c64dd4524a02b3d44292e30e64753ee77e0c39b4f244fed9b5d50bfb2f8e4c9c17639e9ee9b738f62a9e7e5fc6567f1995dbbe6d0a3cfce04291c389c5e45f62cfde2569b63c46b96f27510b979d10d795ffe4eb8c8267fa66515e0d60a6082b9fce81710837e7e241d75b3097712806f604df3795015e978af603388001dfb47858224f1bb7777109e9b9c3a105cc05c246bfde0193158c9c0fe57c44b15fd8078c486689a7d4362f35853b142810d3789833e7513cc6b8c5");
-                samples.set("c289656e636f64696e67736789656e636f64696e67736d80c483706e6783726762846a70656789677261797363616c6584636f7265c483706e67857267623234857267623332846a70656787616c6c6f776564c583706e6783726762857267623234857267623332846a706567886c6f73736c657373c383706e678572676232348572676233328a776974685f7370656564c283706e67837267628c776974685f7175616c697479c1846a70656792776974685f6c6f73736c6573735f6d6f6465c183706e67",
-                            "8f7c3c358b7853a3a6d8e1ebd326e3b109bb267a40919f73e85ce55438e537237c6741120cf97e615b34aefbd7d3d128cc5d065e2307f74a56e9a7a7130908591276e240c464542b5fbcfee2b3f7e91a689df9f502044a41ed82209c458d1f149605fbfa7b024ebf09274d6d424f23e455a911a21fd8bf46fd6293a565b053b542277e31ea5cddb61dbaeede2a9e083b45712a5d77dd0a1baeb9610d439a4afb6ac5722f93f2a9772d7de4559c716ebf45cb2e47ac0726b28851b7a54e74750b08f949bf5b593b7df7042ba6b41d89ef");
-                samples.set("c88a6e65772d77696e646f770100003f01f33f013c6b857469746c659e616e746f696e65406665646f72613a7e2f70726f6a656374732f787072618e636c6173732d696e7374616e6365c285787465726d85585465726d8b77696e646f772d74797065c1864e4f524d414c9073697a652d636f6e73747261696e74736a89626173652d73697a65c2130489696e6372656d656e74c2060d8767726176697479018c6d696e696d756d2d73697a65c219118669636f6e6963446607",
-                            "fc3e3fbd6b2f7c0836e554ad40ed543c008c2be86f12ac0e0f76f7bde1181bbe1b5cad6308a4e6f22f3c5dd1804217d9e3ea56d439a0c49424264d928b6e8a60a20eb810ba0588525673604627d114911d6b97b385a6df078848db2ab5bc978a260e3103ce3af0dcdafa499eae4d88dff9a5d1714d5fd738df3fc4e4cc8aa3f26008fd3ce49992e88c9f2c476b00c441ad0374cba6fea1b4a27dc39c444f52affae4f3640ffe34590935194fb16e147d9c5c0479c5ec5fb3b228006467fe7a1d");
-                samples.set("c38e73657474696e672d6368616e6765887864672d6d656e7566",
-                            "0ff97c8e05b7a6e4a3608801cc105f21c18e3b53115c65af35e76732a4396664");
-                samples.set("c190737461727475702d636f6d706c657465",
-                            "0c1f485983484a0348a3760616ec4c08848f480a8e2831b3035aa067e7769b18");
-
-                function test_sample() {
-                    show("-------------------------------------");
-                    const pdata = samples.keys().next().value;
-                    const penc = samples.get(pdata);
-                    samples.delete(pdata);
-                    hexdata_test(pdata, penc);
-                    if (samples.size > 0) {
-                        setTimeout(test_sample, 1000);
-                    }
+                const pdata = samples.keys().next().value;
+                const penc = samples.get(pdata);
+                samples.delete(pdata);
+                hexdata_test(pdata, penc);
+                if (samples.size > 0) {
+                  setTimeout(test_sample, 1000);
                 }
-                setTimeout(test_sample, 1000);
+              }
+              setTimeout(test_sample, 1000);
             })
             .catch(err => {
-                show("failed to derive AES key: "+err);
+              show("failed to derive AES key: " + err);
             });
         })
         .catch(err => {
-            show("failed to import AES key: "+err);
+          show("failed to import AES key: " + err);
         });
+
     </script>
   </body>
+
 </html>
diff --git a/html5/css/client.css b/html5/css/client.css
index 2ea0302f..be50bcbb 100644
--- a/html5/css/client.css
+++ b/html5/css/client.css
@@ -18,7 +18,8 @@ div.window canvas {
 }
 
 div.window canvas.gpu-trigger {
-  transform: transale3d(0,0,0); /* Refer to client.js */
+  transform: transale3d(0, 0, 0);
+  /* Refer to client.js */
 }
 
 body.desktop {
@@ -30,6 +31,7 @@ div#top_bar {
   width: 100%;
   height: 48px;
 }
+
 div#top_bar img {
   width: 48px;
   height: 48px;
@@ -38,9 +40,11 @@ div#top_bar img {
 div#connect_form {
   display: none;
 }
+
 div#disconnect_form {
   display: none;
 }
+
 .overlay {
   background-color: black;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
@@ -54,26 +58,31 @@ div#disconnect_form {
   text-align: center;
   padding-top: 3em;
 }
+
 #progress-label {
   font-size: 1.4em;
   color: white;
   line-height: 2em;
   height: 2em;
 }
+
 #progress-details {
   font-size: 1.2em;
   color: white;
   line-height: 1.5em;
   height: 1.5em;
 }
+
 #progress-bar {
   height: 2em;
 }
+
 canvas {
   border: none;
   padding: 0;
   margin: 0;
 }
+
 #pasteboard {
   position: fixed;
   top: -40px;
@@ -81,29 +90,33 @@ canvas {
   height: 30px;
   left: 1px;
 }
+
 .undecorated {
   position: absolute;
   padding: 0;
   overflow: hidden;
 }
+
 .window {
   border: 1px;
   position: absolute;
   padding: 0;
-  overflow: hidden; /* required for radius clip */
-}
-.window.override-redirect {
+  overflow: hidden;
+  /* required for radius clip */
 }
+
+.window.override-redirect {}
+
 .window.tray {
   position: relative;
   float: left;
 }
+
 .window.desktop {
   box-shadow: none;
 }
 
-.window-NORMAL {
-}
+.window-NORMAL {}
 
 .window.border {
   border-color: grey;
@@ -124,6 +137,7 @@ canvas {
   cursor: default;
   background-color: transparent;
 }
+
 .windowtitle {
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   display: inline-block;
@@ -138,6 +152,7 @@ canvas {
   white-space: nowrap;
   cursor: default;
 }
+
 .windowbuttons {
   display: inline-block;
   position: absolute;
@@ -149,21 +164,26 @@ canvas {
   padding-top: 7px;
   background-color: transparent;
 }
+
 .above {
   z-index: 10000;
 }
+
 .below {
   z-index: 0;
 }
+
 div.windowinfocus {
   z-index: 5000;
 }
+
 .windowhead {
   height: 30px;
   color: #000000;
   background-color: #a0a0a0;
   border-bottom: 1px solid #c0c0c0;
 }
+
 div.windowinfocus div.windowhead {
   background-color: #ffffff;
 }
@@ -171,6 +191,7 @@ div.windowinfocus div.windowhead {
 .modal {
   z-index: 20000;
 }
+
 .spinneroverlay {
   width: 100%;
   height: 100%;
@@ -179,23 +200,28 @@ div.windowinfocus div.windowhead {
   opacity: 0.5;
   position: absolute;
 }
+
 .spinnermiddle {
   display: table-cell;
   vertical-align: middle;
 }
+
 .ui-resizable-helper {
   border: 2px dotted #00f;
   z-index: 30000 !important;
 }
+
 .ui-resizable-handle {
   position: absolute;
   font-size: 0.1px;
   display: block;
 }
+
 .ui-resizable-disabled .ui-resizable-handle,
 .ui-resizable-autohide .ui-resizable-handle {
   display: none;
 }
+
 .ui-resizable-n {
   cursor: n-resize;
   height: 7px;
@@ -203,6 +229,7 @@ div.windowinfocus div.windowhead {
   top: -5px;
   left: 0;
 }
+
 .ui-resizable-s {
   cursor: s-resize;
   height: 7px;
@@ -210,6 +237,7 @@ div.windowinfocus div.windowhead {
   bottom: -5px;
   left: 0;
 }
+
 .ui-resizable-e {
   cursor: e-resize;
   width: 7px;
@@ -217,6 +245,7 @@ div.windowinfocus div.windowhead {
   top: 0;
   height: 100%;
 }
+
 .ui-resizable-w {
   cursor: w-resize;
   width: 7px;
@@ -224,6 +253,7 @@ div.windowinfocus div.windowhead {
   top: 0;
   height: 100%;
 }
+
 .ui-resizable-se {
   cursor: se-resize;
   width: 12px;
@@ -231,6 +261,7 @@ div.windowinfocus div.windowhead {
   right: 1px;
   bottom: 1px;
 }
+
 .ui-resizable-sw {
   cursor: sw-resize;
   width: 9px;
@@ -238,6 +269,7 @@ div.windowinfocus div.windowhead {
   left: -5px;
   bottom: -5px;
 }
+
 .ui-resizable-nw {
   cursor: nw-resize;
   width: 9px;
@@ -245,6 +277,7 @@ div.windowinfocus div.windowhead {
   left: -5px;
   top: -5px;
 }
+
 .ui-resizable-ne {
   cursor: ne-resize;
   width: 9px;
@@ -267,9 +300,11 @@ div.windowinfocus div.windowhead {
   padding: 40px;
   visibility: hidden;
 }
+
 .notifications .alert {
   visibility: visible;
 }
+
 .notification_icon {
   max-width: 128px;
   max-height: 128px;
@@ -277,6 +312,7 @@ div.windowinfocus div.windowhead {
   padding: 0.4rem;
   padding-left: 1rem;
 }
+
 .notification_buttons {
   clear: both;
   margin: 10px 0px 0px auto;
@@ -284,6 +320,7 @@ div.windowinfocus div.windowhead {
   font-size: 1.2rem;
   height: 2em;
 }
+
 .notification_button {
   cursor: pointer;
   float: right;
@@ -294,10 +331,12 @@ div.windowinfocus div.windowhead {
   background-color: #f8f8f8;
   color: #000;
 }
+
 .notification_button:hover {
   background-color: #000;
   color: #ffffff;
 }
+
 @media screen and (max-width: 600px) {
   .notifications {
     bottom: 0;
@@ -305,6 +344,7 @@ div.windowinfocus div.windowhead {
     padding-top: 5rem;
   }
 }
+
 @media screen {
   .notifications .alert {
     box-shadow: 0 1rem 2rem rgba(21, 36, 48, 0.75);
@@ -320,6 +360,7 @@ div.windowinfocus div.windowhead {
     transition: left 0.5s, margin 0.5s, opacity 0.5s, transform 0.5s;
   }
 }
+
 @media screen and (max-width: 600px) {
   .notifications .alert {
     opacity: 0;
@@ -327,6 +368,7 @@ div.windowinfocus div.windowhead {
     transform: translateY(0);
   }
 }
+
 .notifications .alert span {
   display: block;
   padding: 0;
@@ -337,18 +379,22 @@ div.windowinfocus div.windowhead {
   line-height: 1rem;
   max-height: 5rem;
 }
+
 .notifications .alert span.title {
   margin: 1rem;
   font-weight: 600;
   font-size: 1.3rem;
   line-height: 1.3rem;
 }
+
 .notifications .alert span.message {
   text-align: left;
 }
+
 .notifications .alert span a {
   text-decoration: none;
 }
+
 .notifications .alert .dismiss {
   width: 2rem;
   position: absolute;
@@ -376,6 +422,7 @@ div.windowinfocus div.windowhead {
   text-align: center;
   padding: 20px;
 }
+
 #about,
 #sessioninfo,
 #bugreport {
@@ -388,6 +435,7 @@ div.windowinfocus div.windowhead {
   margin-left: -320px;
   margin-top: -140px;
 }
+
 #bugreport {
   text-align: left;
 }
@@ -407,9 +455,11 @@ table#sessiondata {
   width: 90%;
   margin: auto;
 }
+
 table#sessiondata th {
   text-align: left;
 }
+
 table#sessiondata td {
   text-align: right;
 }
@@ -422,10 +472,12 @@ table#sessiondata td {
   position: relative;
   float: left;
 }
+
 .action-events {
   position: relative;
   float: left;
 }
+
 #action-link {
   display: none;
   color: #99f;
@@ -436,6 +488,7 @@ table#sessiondata td {
   float: left;
   padding-left: 100px;
 }
+
 #clock_text {
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   color: #fff;
@@ -463,6 +516,7 @@ table#sessiondata td {
   z-index: 20;
   cursor: pointer;
 }
+
 #login-box {
   height: 320px;
   width: 480px;
@@ -474,6 +528,7 @@ table#sessiondata td {
   border-radius: 20px;
   padding: 20px;
 }
+
 #login-innerbox {
   margin: auto;
   height: 100%;
@@ -482,12 +537,14 @@ table#sessiondata td {
   border-radius: 20px;
   text-align: center;
 }
+
 #login-header {
   font-size: 2em;
   clear: both;
   display: inline-block;
   margin: 0.5em;
 }
+
 #login-innerbox input {
   font-size: 1.5em;
   clear: both;
@@ -497,14 +554,17 @@ table#sessiondata td {
   border: 2px solid #101010;
   border-radius: 4px;
 }
+
 #password-box {
   background: url("../icons/authentication.png") no-repeat;
   margin-left: 2em;
   margin-right: 2em;
 }
+
 #login-buttons {
   margin: 2em;
 }
+
 .login-button {
   margin: 1em;
   padding: 10px 32px;
@@ -525,7 +585,9 @@ table#sessiondata td {
   border: 1px solid transparent;
   border-radius: 4px;
 }
-.login-button:focus, .login-button:hover {
+
+.login-button:focus,
+.login-button:hover {
   background-color: #449d44;
 }
 
@@ -535,12 +597,14 @@ table#sessiondata td {
     opacity: 1;
     transform: translateY(0);
   }
+
   .notifications .alert.hidden {
     overflow: hidden;
     margin-top: -2.125rem;
     z-index: -1;
   }
 }
+
 @media screen and (max-width: 600px) {
   .notifications .alert.hidden {
     transform: translateY(0) translateX(-10rem);
diff --git a/html5/css/menu-skin.css b/html5/css/menu-skin.css
index f70da4fa..af01ad43 100644
--- a/html5/css/menu-skin.css
+++ b/html5/css/menu-skin.css
@@ -48,13 +48,11 @@ SOFTWARE.
   height: 30px;
   padding: 0px 0px 0px 20px;
   z-index: 100000;
-  background: repeating-linear-gradient(
-    90deg,
-    white,
-    white 1px,
-    black 1px,
-    black 2px
-  );
+  background: repeating-linear-gradient(90deg,
+      white,
+      white 1px,
+      black 1px,
+      black 2px);
 
   border-color: grey;
   border-width: 1px;
@@ -108,9 +106,10 @@ SOFTWARE.
 
 /* Foreground */
 .Menu,
-.Menu li.-hasSubmenu > a:after {
+.Menu li.-hasSubmenu>a:after {
   color: black;
-  border-color: black; /* chevron colour */
+  border-color: black;
+  /* chevron colour */
 }
 
 /* Background */
@@ -129,15 +128,18 @@ SOFTWARE.
 .Menu.-floating {
   border-radius: 3px;
 }
-.Menu.-horizontal > li > ul {
+
+.Menu.-horizontal>li>ul {
   border-top-left-radius: 0px;
   border-top-right-radius: 0px;
 }
-.Menu:not(.-alignRight) li > ul,
+
+.Menu:not(.-alignRight) li>ul,
 .Menu.-floating:not(.-alignRight) {
   border-top-left-radius: 0px;
 }
-.Menu.-alignRight li > ul,
+
+.Menu.-alignRight li>ul,
 .Menu.-floating.-alignRight {
   border-top-right-radius: 0px;
 }
diff --git a/html5/css/menu.css b/html5/css/menu.css
index c63067d9..0bb76713 100644
--- a/html5/css/menu.css
+++ b/html5/css/menu.css
@@ -28,6 +28,7 @@ SOFTWARE.
   position: relative;
   z-index: 100000;
 }
+
 /* Three basic menu layouts */
 /* This also enforces that menu is a ul, and that
      * layout modifier is specified
@@ -36,6 +37,7 @@ ul.Menu.-horizontal,
 ul.Menu.-vertical {
   display: inline-block;
 }
+
 ul.Menu.-floating {
   display: block;
   position: absolute;
@@ -44,81 +46,95 @@ ul.Menu.-floating {
 /* Menu and menu-item layout */
 .Menu,
 .Menu li,
-.Menu li > ul {
+.Menu li>ul {
   list-style: none;
   padding: 0px;
   margin: 0px;
 }
+
 .Menu li {
   display: block;
   position: relative;
   white-space: nowrap;
   word-break: keep-all;
 }
-.Menu.-horizontal > li {
+
+.Menu.-horizontal>li {
   display: inline-block;
   float: left;
 }
-.Menu li > * {
+
+.Menu li>* {
   display: block;
   position: relative;
 }
-.Menu li > ul {
+
+.Menu li>ul {
   position: absolute;
   min-width: 100%;
   top: 0px;
   left: 100%;
 }
-.Menu.-horizontal.-alignRight li > ul {
+
+.Menu.-horizontal.-alignRight li>ul {
   left: auto;
   right: 100%;
 }
-.Menu.-horizontal.-alignRight > li > ul {
+
+.Menu.-horizontal.-alignRight>li>ul {
   right: 0px;
 }
-.Menu.-horizontal > li > ul {
+
+.Menu.-horizontal>li>ul {
   top: auto;
   left: auto;
 }
 
 /* Menu behaviour */
-.Menu li > ul,
+.Menu li>ul,
 .Menu.-floating {
   display: none;
 }
-.Menu li > ul.-visible,
+
+.Menu li>ul.-visible,
 ul.Menu.-floating.-visible {
   display: block;
 }
 
 /* Menu animation */
-.Menu li > ul,
-.Menu.-horizontal.-alignRight li > ul,
+.Menu li>ul,
+.Menu.-horizontal.-alignRight li>ul,
 .Menu.-floating {
   opacity: 1;
   transform: scale(1) translateY(0px);
   transform-origin: left top;
 }
-.Menu.-alignRight li > ul,
+
+.Menu.-alignRight li>ul,
 .Menu.-floating.-alignRight {
   transform-origin: right top;
 }
-.Menu li > ul.-animating,
+
+.Menu li>ul.-animating,
 .Menu.-floating.-animating {
   opacity: 0 !important;
   transform: scale(0.96) translateX(-16px);
 }
-.Menu li > ul.-animating {
+
+.Menu li>ul.-animating {
   z-index: -1 !important;
 }
-.Menu.-horizontal > li > ul.-animating {
+
+.Menu.-horizontal>li>ul.-animating {
   transform: scale(0.96) translateY(-16px);
 }
-.Menu.-alignRight li > ul.-animating,
+
+.Menu.-alignRight li>ul.-animating,
 .Menu.-floating.-alignRight.-animating {
   transform: scale(0.96) translateX(16px);
 }
-.Menu.-horizontal.-alignRight > li > ul.-animating {
+
+.Menu.-horizontal.-alignRight>li>ul.-animating {
   transform: scale(0.96) translateY(-16px);
 }
 
@@ -130,20 +146,23 @@ ul.Menu.-floating.-visible {
   bottom: 0px;
   margin: auto 0px;
 }
+
 .Menu .Icon,
 .Menu *[data-icon]:before {
   line-height: inherit;
 }
+
 .Menu .Icon {
   padding: 0px;
 }
+
 .Menu *:empty[data-icon] {
   padding-left: 0px !important;
   padding-right: 0px !important;
 }
 
 /* Submenu chevrons */
-.Menu li.-hasSubmenu > a:after {
+.Menu li.-hasSubmenu>a:after {
   display: block;
   position: absolute;
 
@@ -161,7 +180,8 @@ ul.Menu.-floating.-visible {
 
   content: "";
 }
-.Menu.-horizontal > li.-hasSubmenu > a:after {
+
+.Menu.-horizontal>li.-hasSubmenu>a:after {
   width: 4px;
   height: 4px;
   bottom: 4px;
@@ -172,7 +192,8 @@ ul.Menu.-floating.-visible {
 
   border-style: none solid solid none;
 }
-.Menu li.-hasSubmenu.-noChevron > a:after {
+
+.Menu li.-hasSubmenu.-noChevron>a:after {
   display: none;
 }
 
@@ -184,16 +205,19 @@ ul.Menu.-floating.-visible {
 .Menu {
   line-height: 30px;
 }
+
 .Menu.-horizontal,
 .Menu li,
-.Menu li > :first-child {
+.Menu li> :first-child {
   height: 30px;
 }
+
 .Menu *[data-icon]:before,
 .Menu .Icon {
   width: 30px;
   height: 30px;
 }
+
 .Menu *[data-icon] {
   min-width: 30px;
   min-height: 30px;
@@ -211,10 +235,11 @@ ul.Menu.-floating.-visible {
 .Menu .Icon {
   font-size: 24px;
 }
+
 /* For submenus */
-.Menu > li ul .Icon,
+.Menu>li ul .Icon,
 .Menu.-floating .Icon,
-.Menu > li ul *[data-icon]:before,
+.Menu>li ul *[data-icon]:before,
 .Menu.-floating *[data-icon]:before {
   font-size: 18px;
 }
@@ -222,10 +247,12 @@ ul.Menu.-floating.-visible {
 /* Colouring of menus */
 /* Foreground */
 .Menu,
-.Menu li.-hasSubmenu > a:after {
+.Menu li.-hasSubmenu>a:after {
   color: black;
-  border-color: black; /* chevron colour */
+  border-color: black;
+  /* chevron colour */
 }
+
 /* Background */
 .Menu ul,
 .Menu.-floating {
@@ -233,45 +260,47 @@ ul.Menu.-floating.-visible {
 }
 
 /* Padding for each menu item */
-.Menu li > * {
+.Menu li>* {
   padding: 0px 12px;
 }
+
 /* Indent of chevron */
-.Menu li li.-hasSubmenu > a:after,
-.Menu:not(.-horizontal) > li.-hasSubmenu > a:after {
+.Menu li li.-hasSubmenu>a:after,
+.Menu:not(.-horizontal)>li.-hasSubmenu>a:after {
   right: 12px;
 }
-.Menu li li.-hasSubmenu > a,
-.Menu:not(.-horizontal) > li.-hasSubmenu > a {
+
+.Menu li li.-hasSubmenu>a,
+.Menu:not(.-horizontal)>li.-hasSubmenu>a {
   padding-right: 28px;
 }
 
 /* Minimum width of dropdown menus */
-.Menu.-horizontal li > ul,
+.Menu.-horizontal li>ul,
 .Menu.-floating {
   min-width: 200px;
 }
 
 /* Animation speed of dropdown menus */
-.Menu li > ul,
+.Menu li>ul,
 .Menu.-floating {
   transition: width 0.1s, height 0.1s, transform 0.1s, opacity 0.1s;
 }
 
 /* Styling of hyperlink text */
-.Menu li > a {
+.Menu li>a {
   text-decoration: none;
   color: inherit;
 }
 
 /* Animation speed of :hover shading */
-.Menu li > a:first-child {
+.Menu li>a:first-child {
   transition: background-color 0.2s;
 }
 
 /* Colour of :hover shading */
-.Menu li:hover > a:first-child,
-.Menu li.-active > a:first-child {
+.Menu li:hover>a:first-child,
+.Menu li.-active>a:first-child {
   background-color: rgba(0, 0, 0, 0.1);
 }
 
diff --git a/html5/css/simple-keyboard.css b/html5/css/simple-keyboard.css
index f086dec6..a89ad4c1 100644
--- a/html5/css/simple-keyboard.css
+++ b/html5/css/simple-keyboard.css
@@ -19,14 +19,17 @@
   overflow: hidden;
   touch-action: manipulation;
 }
+
 .hg-theme-default .hg-button span {
   pointer-events: none;
 }
+
 .hg-theme-default button.hg-button {
   border-width: 0;
   outline: 0;
   font-size: inherit;
 }
+
 .hg-theme-default {
   font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue",
     Helvetica, Arial, "Lucida Grande", sans-serif;
@@ -34,26 +37,33 @@
   padding: 5px;
   border-radius: 5px;
 }
+
 .hg-theme-default .hg-button {
   display: inline-block;
   flex-grow: 1;
 }
+
 .hg-theme-default .hg-row {
   display: flex;
 }
+
 .hg-theme-default .hg-row:not(:last-child) {
   margin-bottom: 5px;
 }
+
 .hg-theme-default .hg-row .hg-button-container,
 .hg-theme-default .hg-row .hg-button:not(:last-child) {
   margin-right: 5px;
 }
-.hg-theme-default .hg-row > div:last-child {
+
+.hg-theme-default .hg-row>div:last-child {
   margin-right: 0;
 }
+
 .hg-theme-default .hg-row .hg-button-container {
   display: flex;
 }
+
 .hg-theme-default .hg-button {
   box-shadow: 0 0 3px -1px rgba(0, 0, 0, 0.3);
   height: 40px;
@@ -68,9 +78,11 @@
   justify-content: center;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
+
 .hg-theme-default .hg-button.hg-activeButton {
   background: #efefef;
 }
+
 .hg-theme-default.hg-layout-numeric .hg-button {
   width: 33.3%;
   height: 60px;
@@ -78,26 +90,33 @@
   display: flex;
   justify-content: center;
 }
+
 .hg-theme-default .hg-button.hg-button-numpadadd,
 .hg-theme-default .hg-button.hg-button-numpadenter {
   height: 85px;
 }
+
 .hg-theme-default .hg-button.hg-button-numpad0 {
   width: 105px;
 }
+
 .hg-theme-default .hg-button.hg-button-com {
   max-width: 85px;
 }
+
 .hg-theme-default .hg-button.hg-standardBtn.hg-button-at {
   max-width: 45px;
 }
+
 .hg-theme-default .hg-button.hg-selectedButton {
   background: rgba(5, 25, 70, 0.53);
   color: #fff;
 }
+
 .hg-theme-default .hg-button.hg-standardBtn[data-skbtn=".com"] {
   max-width: 82px;
 }
+
 .hg-theme-default .hg-button.hg-standardBtn[data-skbtn="@"] {
   max-width: 60px;
 }
diff --git a/html5/css/slick.css b/html5/css/slick.css
index 94926c61..0a917ae8 100644
--- a/html5/css/slick.css
+++ b/html5/css/slick.css
@@ -26,9 +26,11 @@
   margin: 0;
   padding: 0;
 }
+
 .slick-list:focus {
   outline: none;
 }
+
 .slick-list.dragging {
   cursor: pointer;
   cursor: hand;
@@ -52,15 +54,18 @@
   margin-left: auto;
   margin-right: auto;
 }
+
 .slick-track:before,
 .slick-track:after {
   display: table;
 
   content: "";
 }
+
 .slick-track:after {
   clear: both;
 }
+
 .slick-loading .slick-track {
   visibility: hidden;
 }
@@ -72,24 +77,31 @@
   height: 100%;
   min-height: 1px;
 }
+
 [dir="rtl"] .slick-slide {
   float: right;
 }
+
 .slick-slide img {
   display: block;
 }
+
 .slick-slide.slick-loading img {
   display: none;
 }
+
 .slick-slide.dragging img {
   pointer-events: none;
 }
+
 .slick-initialized .slick-slide {
   display: block;
 }
+
 .slick-loading .slick-slide {
   visibility: hidden;
 }
+
 .slick-vertical .slick-slide {
   display: block;
 
@@ -97,6 +109,7 @@
 
   border: 1px solid transparent;
 }
+
 .slick-arrow.slick-hidden {
   display: none;
 }
diff --git a/html5/css/spinner.css b/html5/css/spinner.css
index 77a3c08b..5e166f31 100644
--- a/html5/css/spinner.css
+++ b/html5/css/spinner.css
@@ -13,27 +13,32 @@
   -webkit-animation: load8 1.1s infinite linear;
   animation: load8 1.1s infinite linear;
 }
+
 .spinner,
 .spinner:after {
   border-radius: 50%;
   width: 10em;
   height: 10em;
 }
+
 @-webkit-keyframes load8 {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
+
   100% {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
   }
 }
+
 @keyframes load8 {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
+
   100% {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
diff --git a/html5/digest.html b/html5/digest.html
index af980cd2..bfb16442 100644
--- a/html5/digest.html
+++ b/html5/digest.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
   <head>
     <!--
 	Copyright (c) 2024 Antoine Martin <antoine@xpra.org>
@@ -22,59 +23,60 @@
     </div>
 
     <script>
-        const info = document.getElementById("info");
-        const lines = [];
+      const info = document.getElementById("info");
+      const lines = [];
 
-        function show(newtext) {
-            console.log(newtext);
-            lines.push(newtext);
-            info.innerText = lines.join("\n");
-        }
+      function show(newtext) {
+        console.log(newtext);
+        lines.push(newtext);
+        info.innerText = lines.join("\n");
+      }
 
-        function show_digest(digest_name, v1, v2, expected) {
-          Utilities.gendigest(digest_name, v1, v2)
+      function show_digest(digest_name, v1, v2, expected) {
+        Utilities.gendigest(digest_name, v1, v2)
           .then(digest => {
             show("got response: " + Utilities.convertToHex(digest));
             if (expected != undefined && digest != expected) {
-              show("does not match expected value: "+expected);
+              show("does not match expected value: " + expected);
             }
             show("");
           })
           .catch(err => {
             // console.error("digest error: ", err);
-            show("failed to generate "+digest_name+": "+err)
+            show("failed to generate " + digest_name + ": " + err)
             show("");
           });
-        }
+      }
 
-        show_digest("xor", "hello", "foo00", Utilities.hexToString("0e0a035c5f"));
+      show_digest("xor", "hello", "foo00", Utilities.hexToString("0e0a035c5f"));
 
-        show_digest("test-invalid", "", "");
+      show_digest("test-invalid", "", "");
 
-        let password = Utilities.hexToString("4a87629131cdd27f0baa7bdbfa7f53ca7d11fc954937c2f0c025be326c7d8f742624daf578a146d1c7f10e3b0b158a725d6073af111ef517f7f12694fd1ab7cd");
-        let salt = Utilities.hexToString("0aa4ecbebd55488d6a976628616c9170032083a0385feefcde7cd0ecb82ed87c");
-        // show("password=" + password);
-        // show("salt=" + password);
-        show("hex(password)=" + Utilities.convertToHex(password));
-        show("hex(salt)=" + Utilities.convertToHex(password));
+      let password = Utilities.hexToString("4a87629131cdd27f0baa7bdbfa7f53ca7d11fc954937c2f0c025be326c7d8f742624daf578a146d1c7f10e3b0b158a725d6073af111ef517f7f12694fd1ab7cd");
+      let salt = Utilities.hexToString("0aa4ecbebd55488d6a976628616c9170032083a0385feefcde7cd0ecb82ed87c");
+      // show("password=" + password);
+      // show("salt=" + password);
+      show("hex(password)=" + Utilities.convertToHex(password));
+      show("hex(salt)=" + Utilities.convertToHex(password));
 
-        show_digest("hmac+sha512", salt, password);
+      show_digest("hmac+sha512", salt, password);
 
-        // similar to login obfuscation:
-        password = "foobar12";
-        salt = Utilities.hexToString("a54ca3f2777c2ce00090389e328fc9a2249cc1cfe99c84125f6d1d92abc113212bc96c4907f8f9492cf43dd4c22a889c4d170cc7ac62f41b0dcf28d488588f27");
-        Utilities.gendigest("xor", password, salt)
+      // similar to login obfuscation:
+      password = "foobar12";
+      salt = Utilities.hexToString("a54ca3f2777c2ce00090389e328fc9a2249cc1cfe99c84125f6d1d92abc113212bc96c4907f8f9492cf43dd4c22a889c4d170cc7ac62f41b0dcf28d488588f27");
+      Utilities.gendigest("xor", password, salt)
         .then(value => {
-          show("xored password:"+ value);
+          show("xored password:" + value);
           Utilities.gendigest("xor", value, salt)
-          .then(restored => {
-            show("unxored password:"+ restored);
-            if (restored != password) {
-              show("error! xor is not symmetrical!")
-            }
-          });
+            .then(restored => {
+              show("unxored password:" + restored);
+              if (restored != password) {
+                show("error! xor is not symmetrical!")
+              }
+            });
         });
 
     </script>
   </body>
+
 </html>
diff --git a/html5/index.html b/html5/index.html
index d3964022..760afb41 100644
--- a/html5/index.html
+++ b/html5/index.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
   <head>
     <!--
             Copyright (c) 2013-2022 Antoine Martin <antoine@xpra.org>
@@ -81,29 +82,19 @@
     <div id="login-overlay">
       <div id="login-box">
         <form id="login_form">
-        <div id="login-innerbox">
-          <span id="login-header"></span>
-          <br />
-          <input type="text" name="username" id="username" value="" autocomplete="username" style="display: none;">
-          <div id="password-box">
-            <input
-              title="Password"
-              type="password"
-              id="password"
-              autocomplete="current-password"
-              placeholder="Password"
-              size="16"
-              maxlength="256"
-              tabindex="1"
-              required
-            />
-          </div>
-          <br />
-          <div id="login-buttons">
-            <a class="login-button" role="button" tabindex="2" id="login_cancel" onclick="login_cancel();">Cancel</a>
-            <a class="login-button" role="button" tabindex="3" id="login_connect" onclick="login_connect();">Connect</a>
+          <div id="login-innerbox">
+            <span id="login-header"></span>
+            <br />
+            <input type="text" name="username" id="username" value="" autocomplete="username" style="display: none;">
+            <div id="password-box">
+              <input title="Password" type="password" id="password" autocomplete="current-password" placeholder="Password" size="16" maxlength="256" tabindex="1" required />
+            </div>
+            <br />
+            <div id="login-buttons">
+              <a class="login-button" role="button" tabindex="2" id="login_cancel" onclick="login_cancel();">Cancel</a>
+              <a class="login-button" role="button" tabindex="3" id="login_connect" onclick="login_connect();">Connect</a>
+            </div>
           </div>
-        </div>
         </form>
       </div>
     </div>
@@ -258,13 +249,7 @@ <h2>Xpra Bug Report</h2>
       <br />
       <form>
         Summary:
-        <input
-          id="bugreport_summary"
-          type="text"
-          size="48"
-          maxlength="128"
-          value=""
-        />
+        <input id="bugreport_summary" type="text" size="48" maxlength="128" value="" />
         <br />
         Description:
         <br />
@@ -273,33 +258,21 @@ <h2>Xpra Bug Report</h2>
         <button id="bugreport_cancel" type="button" onclick="hide_bugreport()">
           Cancel
         </button>
-        <button
-          id="bugreport_submit"
-          type="button"
-          onclick="generate_bugreport()"
-          disabled
-        >
+        <button id="bugreport_submit" type="button" onclick="generate_bugreport()" disabled>
           Generate Report
         </button>
       </form>
     </div>
 
     <div>
-      <textarea
-        id="pasteboard"
-        readonly
-        style="display: block; position: absolute; left: -99em"
-      ></textarea>
+      <textarea id="pasteboard" readonly style="display: block; position: absolute; left: -99em"></textarea>
     </div>
 
-    <div
-      class="simple-keyboard"
-      style="display: block; position: fixed; bottom: 0; width: 100%"
-    ></div>
+    <div class="simple-keyboard" style="display: block; position: fixed; bottom: 0; width: 100%"></div>
 
     <script>
       const default_settings = {};
-      const getparam = function (prop) {
+      const getparam = function(prop) {
         let v = Utilities.getparam(prop);
         if (v == undefined && prop in default_settings) {
           v = default_settings[prop];
@@ -318,18 +291,18 @@ <h2>Xpra Bug Report</h2>
         return value.replace(re, "");
       }
 
-      const getboolparam = function (prop, default_value) {
+      const getboolparam = function(prop, default_value) {
         const v = getparam(prop);
         return Utilities.stristrue(v, default_value);
       };
-      const getboolautoparam = function (prop, default_value) {
+      const getboolautoparam = function(prop, default_value) {
         const v = getparam(prop);
         if (v == "auto") {
           return "auto";
         }
         return Utilities.stristrue(v, default_value);
       };
-      const getintparam = function (prop, default_value) {
+      const getintparam = function(prop, default_value) {
         let v = getparam(prop);
         try {
           v = parseInt(v);
@@ -341,7 +314,7 @@ <h2>Xpra Bug Report</h2>
         }
         return v;
       };
-      const getfloatparam = function (prop, default_value) {
+      const getfloatparam = function(prop, default_value) {
         let v = getparam(prop);
         try {
           v = parseFloat(v);
@@ -359,10 +332,10 @@ <h2>Xpra Bug Report</h2>
       const float_menu_padding = 20;
       let float_menu_width = float_menu_item_size * float_menu_item_count + float_menu_padding;
 
-      let cdebug = function () {
+      let cdebug = function() {
         Utilities.clog.apply(Utilities, arguments);
       };
-      let clog = function () {
+      let clog = function() {
         Utilities.clog.apply(Utilities, arguments);
       };
 
@@ -370,6 +343,7 @@ <h2>Xpra Bug Report</h2>
       let animation_times = [];
       let fps = -1;
       let vrefresh = -1;
+
       function animation_cb(now) {
         let l = animation_times.push(now);
         if (l > 100) {
@@ -410,6 +384,7 @@ <h2>Xpra Bug Report</h2>
         hide_sessioninfo();
         hide_bugreport();
       }
+
       function connection_established() {
         //this may be a re-connection,
         //so make sure we cleanup any left-overs
@@ -417,6 +392,7 @@ <h2>Xpra Bug Report</h2>
         cleanup_dialogs();
         $("button.menu-button").prop("disabled", false);
       }
+
       function connection_lost() {
         clog("connection-lost");
         cleanup_dialogs();
@@ -425,14 +401,14 @@ <h2>Xpra Bug Report</h2>
       document.addEventListener("connection-established", connection_established);
       document.addEventListener("connection-lost", connection_lost);
 
-      $("body").click(function () {
+      $("body").click(function() {
         $(".menu-content").slideUp();
         $("#about").hide();
         hide_sessioninfo();
       });
 
       function enable_clipboard_autofocus() {
-        $("#pasteboard").blur(function () {
+        $("#pasteboard").blur(function() {
           //force focus back to our capture widget:
           if (client.capture_keyboard) {
             $("#pasteboard").focus();
@@ -442,6 +418,7 @@ <h2>Xpra Bug Report</h2>
         pasteboard_element.prop("autofocus");
         pasteboard_element.focus();
       }
+
       function cancel_clipboard_autofocus() {
         $("#pasteboard").removeAttr("autofocus");
       }
@@ -462,13 +439,14 @@ <h2>Xpra Bug Report</h2>
         client.start_info_timer();
         event.stopPropagation();
       }
+
       function hide_sessioninfo() {
         $("#sessioninfo").hide();
         client.stop_info_timer();
       }
       document.addEventListener(
         "info-response",
-        function (e) {
+        function(e) {
           const info = e.data;
           $("#endpoint").html(client.uri);
           $("#server_display").html(client.server_display);
@@ -478,6 +456,7 @@ <h2>Xpra Bug Report</h2>
           } else {
             $("#server_load").html("" + client.server_load);
           }
+
           function toHHMMSS(t) {
             let s = "";
             const hh = Math.floor(t / 1000 / 60 / 60);
@@ -506,12 +485,14 @@ <h2>Xpra Bug Report</h2>
         $("#bugreport_submit").prop("disabled", false);
         document.removeEventListener("info-response", enable_bugreport_submit);
       }
+
       function hide_bugreport() {
         $("#bugreport").hide();
         if (client.clipboard_enabled) {
           enable_clipboard_autofocus();
         }
       }
+
       function show_bugreport(event) {
         //stop capturing input, so we can interact with the bugreport form:
         client.capture_keyboard = false;
@@ -525,15 +506,16 @@ <h2>Xpra Bug Report</h2>
         document.addEventListener("info-response", enable_bugreport_submit);
         client.send_info_request();
       }
+
       function generate_bugreport() {
         client.capture_keyboard = true;
         const zip = new JSZip();
         zip.file(
           "Summary.txt",
           "" +
-            $("#bugreport_summary").val() +
-            "\n\n" +
-            $("#bugreport_description").val()
+          $("#bugreport_summary").val() +
+          "\n\n" +
+          $("#bugreport_description").val()
         );
         zip.file(
           "Server-Info.txt",
@@ -555,19 +537,23 @@ <h2>Xpra Bug Report</h2>
             Utilities.convertDataURIToBinary(png_base64)
           );
         }
-        zip.generateAsync({ type: "blob" }).then(function (content) {
+        zip.generateAsync({
+          type: "blob"
+        }).then(function(content) {
           saveAs(content, "bugreport.zip");
         });
         hide_bugreport();
       }
       const password_input = document.getElementById("password");
       let login_callback = null;
+
       function login_cancel() {
         $("#login-overlay").fadeOut();
         password_input.removeEventListener("keydown", password_special_keys);
         password_input.value = "";
         login_callback(null);
       }
+
       function login_connect() {
         $("#login-overlay").fadeOut();
         const password = password_input.value;
@@ -575,6 +561,7 @@ <h2>Xpra Bug Report</h2>
         password_input.value = "";
         login_callback(password);
       }
+
       function password_special_keys(e) {
         if (e.keyCode == 13) {
           e.preventDefault();
@@ -585,6 +572,7 @@ <h2>Xpra Bug Report</h2>
           login_cancel();
         }
       }
+
       function password_prompt_fn(heading, callback) {
         login_callback = callback;
         $("#login-overlay").fadeIn();
@@ -599,20 +587,27 @@ <h2>Xpra Bug Report</h2>
         const error = params.get("error");
         if (error) {
           const error_description = params.get("error_description");
-          callback(JSON.stringify({ error, error_description }));
+          callback(JSON.stringify({
+            error,
+            error_description
+          }));
         } else if (!code) {
           window.location.href = url;
         } else {
           history.replaceState({}, "", window.location.pathname);
-          callback(JSON.stringify({ code }));
+          callback(JSON.stringify({
+            code
+          }));
         }
       }
 
       let touchaction_scroll = true;
+
       function toggle_touchaction() {
         touchaction_scroll = !touchaction_scroll;
         set_touchaction();
       }
+
       function set_touchaction() {
         let touchaction, label;
         if (touchaction_scroll) {
@@ -706,12 +701,12 @@ <h2>Xpra Bug Report</h2>
         }
 
         try {
-          Utilities.setSessionStorageValue("password",null);
+          Utilities.setSessionStorageValue("password", null);
         } catch (e) {
           //ignore
         }
         try {
-          Utilities.setSessionStorageValue("token",null);
+          Utilities.setSessionStorageValue("token", null);
         } catch (e) {
           //ignore
         }
@@ -820,16 +815,16 @@ <h2>Xpra Bug Report</h2>
 
         if (debug) {
           //example of client event hooks:
-          client.on_open = function () {
+          client.on_open = function() {
             cdebug("network", "connection open");
           };
-          client.on_connect = function () {
+          client.on_connect = function() {
             cdebug("network", "connection established");
           };
-          client.on_first_ui_event = function () {
+          client.on_first_ui_event = function() {
             cdebug("network", "first ui event");
           };
-          client.on_last_window = function () {
+          client.on_last_window = function() {
             cdebug("network", "last window disappeared");
           };
         }
@@ -858,15 +853,15 @@ <h2>Xpra Bug Report</h2>
           client.set_encoding(encoding);
         }
         for (const key of [
-          "scaling.control",
-          "initial_quality",
-          "initial_speed",
-          "auto_refresh_delay",
-          "speed",
-          "min-speed",
-          "quality",
-          "min-quality",
-        ]) {
+            "scaling.control",
+            "initial_quality",
+            "initial_speed",
+            "auto_refresh_delay",
+            "speed",
+            "min-speed",
+            "quality",
+            "min-quality",
+          ]) {
           const v = getintparam(key, -1);
           if (v >= 0) {
             client.set_encoding_option(key, v);
@@ -937,7 +932,7 @@ <h2>Xpra Bug Report</h2>
         // attach a callback for when client closes
         const debug_main = getboolparam("debug_main", false);
         if (!debug_main) {
-          client.callback_close = function (reason) {
+          client.callback_close = function(reason) {
             clog("closing: ", reason);
             if (!submit) {
               // if we didn't submit through the form, silently redirect to the connect gui
@@ -950,6 +945,7 @@ <h2>Xpra Bug Report</h2>
             }
             let url = "./connect.html";
             const has_session_storage = Utilities.hasSessionStorage();
+
             function add_prop(prop, value) {
               if (has_session_storage) {
                 Utilities.setSessionStorageValue(prop, value);
@@ -962,44 +958,44 @@ <h2>Xpra Bug Report</h2>
             }
             add_prop("disconnect", message);
             const props = {
-                username: username,
-                insecure: insecure,
-                server: server,
-                port: port,
-                ssl: ssl,
-                webtransport: webtransport,
-                path: path,
-                encryption: encryption,
-                encoding: encoding,
-                bandwidth_limit: bandwidth_limit,
-                keyboard_layout: keyboard_layout,
-                swap_keys: swap_keys,
-                scroll_reverse_x: scroll_reverse_x,
-                scroll_reverse_y: scroll_reverse_y,
-                reconnect: reconnect,
-                action: action,
-                display: display,
-                shadow_display: shadow_display,
-                start: start,
-                sound: sound,
-                audio_codec: audio_codec,
-                keyboard: keyboard,
-                clipboard: clipboard,
-                clipboard_poll: clipboard_poll,
-                clipboard_preferred_format: clipboard_preferred_format,
-                printing: printing,
-                file_transfer: file_transfer,
-                exit_with_children: exit_with_children,
-                exit_with_client: exit_with_client,
-                sharing: sharing,
-                steal: steal,
-                video: video,
-                mediasource_video: mediasource_video,
-                remote_logging: remote_logging,
-                ignore_audio_blacklist: ignore_audio_blacklist,
-                floating_menu: floating_menu,
-                toolbar_position: toolbar_position,
-                autohide: autohide,
+              username: username,
+              insecure: insecure,
+              server: server,
+              port: port,
+              ssl: ssl,
+              webtransport: webtransport,
+              path: path,
+              encryption: encryption,
+              encoding: encoding,
+              bandwidth_limit: bandwidth_limit,
+              keyboard_layout: keyboard_layout,
+              swap_keys: swap_keys,
+              scroll_reverse_x: scroll_reverse_x,
+              scroll_reverse_y: scroll_reverse_y,
+              reconnect: reconnect,
+              action: action,
+              display: display,
+              shadow_display: shadow_display,
+              start: start,
+              sound: sound,
+              audio_codec: audio_codec,
+              keyboard: keyboard,
+              clipboard: clipboard,
+              clipboard_poll: clipboard_poll,
+              clipboard_preferred_format: clipboard_preferred_format,
+              printing: printing,
+              file_transfer: file_transfer,
+              exit_with_children: exit_with_children,
+              exit_with_client: exit_with_client,
+              sharing: sharing,
+              steal: steal,
+              video: video,
+              mediasource_video: mediasource_video,
+              remote_logging: remote_logging,
+              ignore_audio_blacklist: ignore_audio_blacklist,
+              floating_menu: floating_menu,
+              toolbar_position: toolbar_position,
+              autohide: autohide,
             };
             for (let i = 0; i < client.debug_categories.length; i++) {
               const category = client.debug_categories[i];
@@ -1007,7 +1003,7 @@ <h2>Xpra Bug Report</h2>
             }
             if (insecure || Utilities.hasSessionStorage()) {
               for (let i = 0; i < passwords.length; i++) {
-                add_prop("password"+i, passwords[i]);
+                add_prop("password" + i, passwords[i]);
               }
             } else {
               props["password"] = "";
@@ -1032,7 +1028,7 @@ <h2>Xpra Bug Report</h2>
       function init_tablet_input(client) {
         //keyboard input for tablets:
         const pasteboard = $("#pasteboard");
-        pasteboard.on("input", function (e) {
+        pasteboard.on("input", function(e) {
           const txt = pasteboard.val();
           pasteboard.val("");
           cdebug("keyboard", "oninput: '" + txt + "'");
@@ -1091,34 +1087,41 @@ <h2>Xpra Bug Report</h2>
         });
         window.kb = kb;
         window.keyboardShifted = false;
+
         function onChange(input) {
           clog("Input changed", input);
         }
+
         function onKeyPress(button) {
           forward_key(true, button);
           if (button == "{shift}" || button == "{lock}") {
             if (window.keyboardShifted) {
-              window.kb.setOptions({ layoutName: "default" });
+              window.kb.setOptions({
+                layoutName: "default"
+              });
             } else {
-              window.kb.setOptions({ layoutName: "shift" });
+              window.kb.setOptions({
+                layoutName: "shift"
+              });
             }
             window.keyboardShifted = !window.keyboardShifted;
           }
         }
+
         function onKeyReleased(button) {
           forward_key(false, button);
         }
+
         function forward_key(pressed, button) {
-          let key =
-            {
-              "{bksp}": "Backspace",
-              "{enter}": "Return",
-              "{space}": "Space",
-              "{tab}": "Tab",
-              "{lock}": "CapsLock",
-              "{shift}": "Shift",
-              ".com": "|",
-            }[button] || button;
+          let key = {
+            "{bksp}": "Backspace",
+            "{enter}": "Return",
+            "{space}": "Space",
+            "{tab}": "Tab",
+            "{lock}": "CapsLock",
+            "{shift}": "Shift",
+            ".com": "|",
+          } [button] || button;
           let e = {
             which: 0,
             keyCode: 0,
@@ -1136,6 +1139,7 @@ <h2>Xpra Bug Report</h2>
           $("#keyboard_button").addClass("icon-toggled");
         }
       }
+
       function toggle_keyboard() {
         $(".simple-keyboard").toggle();
         if ($(".simple-keyboard").is(":visible")) {
@@ -1156,6 +1160,7 @@ <h2>Xpra Bug Report</h2>
           evt.preventDefault();
           client.send_all_files(evt.dataTransfer.files);
         }
+
         function handleDragOver(evt) {
           evt.stopPropagation();
           evt.preventDefault();
@@ -1165,13 +1170,13 @@ <h2>Xpra Bug Report</h2>
         screen.addEventListener("dragover", handleDragOver, false);
         screen.addEventListener("drop", handleFileSelect, false);
 
-        $("#upload").on("change", function (evt) {
+        $("#upload").on("change", function(evt) {
           evt.stopPropagation();
           evt.preventDefault();
           client.send_all_files(this.files);
           return false;
         });
-        $("#upload_form").on("submit", function (evt) {
+        $("#upload_form").on("submit", function(evt) {
           evt.preventDefault();
         });
       }
@@ -1181,6 +1186,7 @@ <h2>Xpra Bug Report</h2>
         if (!enabled) {
           return;
         }
+
         function update_clock() {
           const now = new Date().getTime();
           const server_time =
@@ -1224,7 +1230,7 @@ <h2>Xpra Bug Report</h2>
       }
 
       function init_audio(client) {
-        client.on_audio_state_change = function (newstate, details) {
+        client.on_audio_state_change = function(newstate, details) {
           if (client.audio_state == newstate) {
             return;
           }
@@ -1250,7 +1256,7 @@ <h2>Xpra Bug Report</h2>
           sound_button_element.attr("data-icon", data_icon);
           sound_button_element.attr("title", tooltip);
         };
-        $("#sound_button").click(function () {
+        $("#sound_button").click(function() {
           clog("speaker icon clicked, audio_enabled=", client.audio_enabled);
           if (!client.audio_enabled) {
             client.audio_state = "disabled";
@@ -1352,7 +1358,10 @@ <h2>Xpra Bug Report</h2>
 
         $("#float_menu_arrow").attr("data-icon", "chevron_left");
 
-        $("#float_menu_button").css({ left: "30px", top: "-125px" });
+        $("#float_menu_button").css({
+          left: "30px",
+          top: "-125px"
+        });
 
         float_menu_expanded = true;
       }
@@ -1363,7 +1372,10 @@ <h2>Xpra Bug Report</h2>
 
         $("#float_menu_arrow").attr("data-icon", "chevron_right");
 
-        $("#float_menu_button").css({ left: "0px", top: "70px" });
+        $("#float_menu_button").css({
+          left: "0px",
+          top: "70px"
+        });
 
         float_menu_expanded = false;
       }
@@ -1454,8 +1466,9 @@ <h2>Xpra Bug Report</h2>
           () => {
             clog("onunload()");
             client.close();
-          },
-          { capture: true }
+          }, {
+            capture: true
+          }
         );
 
         addEventListener(
@@ -1468,10 +1481,11 @@ <h2>Xpra Bug Report</h2>
               event.returnValue = "There are file transfers in progress.\nAre you sure you want to leave?";
             }
             return event.returnValue;
-          },
-          { capture: true }
+          }, {
+            capture: true
+          }
         );
-        client.on_connect = function () {
+        client.on_connect = function() {
           init_float_menu();
           if (client.clipboard_enabled) {
             enable_clipboard_autofocus();
@@ -1488,12 +1502,12 @@ <h2>Xpra Bug Report</h2>
 
         //from now on, send log and debug to client function
         //which may forward it to the server once connected:
-        clog = function () {
+        clog = function() {
           if (client) {
             client.log.apply(client, arguments);
           }
         };
-        cdebug = function () {
+        cdebug = function() {
           if (client) {
             client.debug.apply(client, arguments);
           }
@@ -1505,7 +1519,7 @@ <h2>Xpra Bug Report</h2>
         init_keyboard(client);
         init_clock(client, getboolparam("clock", true));
         init_audio(client);
-        document.addEventListener("visibilitychange", function (e) {
+        document.addEventListener("visibilitychange", function(e) {
           const window_ids = Object.keys(client.id_to_window).map(Number);
           clog("visibilitychange hidden=", document.hidden, "connected=", client.connected);
           if (client.connected) {
@@ -1518,19 +1532,19 @@ <h2>Xpra Bug Report</h2>
         });
         client.password_prompt_fn = password_prompt_fn;
         client.keycloak_prompt_fn = keycloak_prompt_fn;
-        $("#fullscreen").on("click", function (e) {
+        $("#fullscreen").on("click", function(e) {
           toggle_fullscreen();
         });
 
-        $("#fullscreen_button").on("click", function (e) {
+        $("#fullscreen_button").on("click", function(e) {
           toggle_fullscreen();
         });
 
-        $("#keyboard_button").on("click", function (e) {
+        $("#keyboard_button").on("click", function(e) {
           toggle_keyboard();
         });
 
-        $("#clipboard_button").on("click", function (e) {
+        $("#clipboard_button").on("click", function(e) {
           client.read_clipboard(e);
         });
 
@@ -1586,7 +1600,7 @@ <h2>Xpra Bug Report</h2>
           });
 
         const screen_change_events = "webkitfullscreenchange mozfullscreenchange fullscreenchange MSFullscreenChange";
-        $(document).on(screen_change_events, function () {
+        $(document).on(screen_change_events, function() {
           const f_el =
             document.fullscreenElement ||
             document.mozFullScreen ||
@@ -1599,7 +1613,7 @@ <h2>Xpra Bug Report</h2>
           }
         });
         // disable right click menu:
-        window.oncontextmenu = function (e) {
+        window.oncontextmenu = function(e) {
           const direction = client.clipboard_direction;
           if (client.clipboard_enabled && (direction === "to-client" || direction === "both")) {
             client._poll_clipboard(e);
@@ -1636,7 +1650,7 @@ <h2>Xpra Bug Report</h2>
       function load_default_settings() {
         const xhr = new XMLHttpRequest();
         xhr.open("GET", "./default-settings.txt");
-        xhr.onload = function () {
+        xhr.onload = function() {
           const tmp_default_settings = Utilities.parseINIString(
             xhr.responseText
           );
@@ -1648,21 +1662,23 @@ <h2>Xpra Bug Report</h2>
           }
           init_page();
         };
-        xhr.onerror = function () {
+        xhr.onerror = function() {
           clog("network", "default settings request failed with code", xhr.status);
           init_page();
         };
-        xhr.onabort = function () {
+        xhr.onabort = function() {
           clog("network", "default settings request aborted");
           init_page();
         };
         xhr.send();
       }
 
-      $(document).ready(function () {
+      $(document).ready(function() {
         clog("document is ready, browser is", navigator.platform, "64-bit:", Utilities.is_64bit());
         load_default_settings();
       });
+
     </script>
   </body>
+
 </html>
diff --git a/html5/js/Client.js b/html5/js/Client.js
index 04a5eb44..87dd9f25 100644
--- a/html5/js/Client.js
+++ b/html5/js/Client.js
@@ -32,15 +32,15 @@ const FLOAT_MENU_SELECTOR = "#float_menu";
 const PASTEBOARD_SELECTOR = "#pasteboard";
 const WINDOW_PREVIEW_SELECTOR = "#window_preview";
 
-const BELL_SOUND =  "data:audio/wav;base64,//uQRAAAAWMSLwUIYAAsYkXgoQwAEaYLWfkWgAI0wWs/ItAAAGDgYtAgAyN+QWaAAihwMWm4G8QQRDiMcCBcH3Cc+CDv/7xA4Tvh9Rz/y8QADBwMWgQAZG/ILNAARQ4GLTcDeIIIhxGOBAuD7hOfBB3/94gcJ3w+o5/5eIAIAAAVwWgQAVQ2ORaIQwEMAJiDg95G4nQL7mQVWI6GwRcfsZAcsKkJvxgxEjzFUgfHoSQ9Qq7KNwqHwuB13MA4a1q/DmBrHgPcmjiGoh//EwC5nGPEmS4RcfkVKOhJf+WOgoxJclFz3kgn//dBA+ya1GhurNn8zb//9NNutNuhz31f////9vt///z+IdAEAAAK4LQIAKobHItEIYCGAExBwe8jcToF9zIKrEdDYIuP2MgOWFSE34wYiR5iqQPj0JIeoVdlG4VD4XA67mAcNa1fhzA1jwHuTRxDUQ//iYBczjHiTJcIuPyKlHQkv/LHQUYkuSi57yQT//uggfZNajQ3Vmz+Zt//+mm3Wm3Q576v////+32///5/EOgAAADVghQAAAAA//uQZAUAB1WI0PZugAAAAAoQwAAAEk3nRd2qAAAAACiDgAAAAAAABCqEEQRLCgwpBGMlJkIz8jKhGvj4k6jzRnqasNKIeoh5gI7BJaC1A1AoNBjJgbyApVS4IDlZgDU5WUAxEKDNmmALHzZp0Fkz1FMTmGFl1FMEyodIavcCAUHDWrKAIA4aa2oCgILEBupZgHvAhEBcZ6joQBxS76AgccrFlczBvKLC0QI2cBoCFvfTDAo7eoOQInqDPBtvrDEZBNYN5xwNwxQRfw8ZQ5wQVLvO8OYU+mHvFLlDh05Mdg7BT6YrRPpCBznMB2r//xKJjyyOh+cImr2/4doscwD6neZjuZR4AgAABYAAAABy1xcdQtxYBYYZdifkUDgzzXaXn98Z0oi9ILU5mBjFANmRwlVJ3/6jYDAmxaiDG3/6xjQQCCKkRb/6kg/wW+kSJ5//rLobkLSiKmqP/0ikJuDaSaSf/6JiLYLEYnW/+kXg1WRVJL/9EmQ1YZIsv/6Qzwy5qk7/+tEU0nkls3/zIUMPKNX/6yZLf+kFgAfgGyLFAUwY//uQZAUABcd5UiNPVXAAAApAAAAAE0VZQKw9ISAAACgAAAAAVQIygIElVrFkBS+Jhi+EAuu+lKAkYUEIsmEAEoMeDmCETMvfSHTGkF5RWH7kz/ESHWPAq/kcCRhqBtMdokPdM7vil7RG98A2sc7zO6ZvTdM7pmOUAZTnJW+NXxqmd41dqJ6mLTXxrPpnV8avaIf5SvL7pndPvPpndJR9Kuu8fePvuiuhorgWjp7Mf/PRjxcFCPDkW31srioCExivv9lcwKEaHsf/7ow2Fl1T/9RkXgEhYElAoCLFtMArxwivDJJ+bR1HTKJdlEoTELCIqgEwVGSQ+hIm0NbK8WXcTEI0UPoa2NbG4y2K00JEWbZavJXkYaqo9CRHS55FcZTjKEk3NKoCYUnSQ0rWxrZbFKbKIhOKPZe1cJKzZSaQrIyULHDZmV5K4xySsDRKWOruanGtjLJXFEmwaIbDLX0hIPBUQPVFVkQkDoUNfSoDgQGKPekoxeGzA4DUvnn4bxzcZrtJyipKfPNy5w+9lnXwgqsiyHNeSVpemw4bWb9psYeq//uQZBoABQt4yMVxYAIAAAkQoAAAHvYpL5m6AAgAACXDAAAAD59jblTirQe9upFsmZbpMudy7Lz1X1DYsxOOSWpfPqNX2WqktK0DMvuGwlbNj44TleLPQ+Gsfb+GOWOKJoIrWb3cIMeeON6lz2umTqMXV8Mj30yWPpjoSa9ujK8SyeJP5y5mOW1D6hvLepeveEAEDo0mgCRClOEgANv3B9a6fikgUSu/DmAMATrGx7nng5p5iimPNZsfQLYB2sDLIkzRKZOHGAaUyDcpFBSLG9MCQALgAIgQs2YunOszLSAyQYPVC2YdGGeHD2dTdJk1pAHGAWDjnkcLKFymS3RQZTInzySoBwMG0QueC3gMsCEYxUqlrcxK6k1LQQcsmyYeQPdC2YfuGPASCBkcVMQQqpVJshui1tkXQJQV0OXGAZMXSOEEBRirXbVRQW7ugq7IM7rPWSZyDlM3IuNEkxzCOJ0ny2ThNkyRai1b6ev//3dzNGzNb//4uAvHT5sURcZCFcuKLhOFs8mLAAEAt4UWAAIABAAAAAB4qbHo0tIjVkUU//uQZAwABfSFz3ZqQAAAAAngwAAAE1HjMp2qAAAAACZDgAAAD5UkTE1UgZEUExqYynN1qZvqIOREEFmBcJQkwdxiFtw0qEOkGYfRDifBui9MQg4QAHAqWtAWHoCxu1Yf4VfWLPIM2mHDFsbQEVGwyqQoQcwnfHeIkNt9YnkiaS1oizycqJrx4KOQjahZxWbcZgztj2c49nKmkId44S71j0c8eV9yDK6uPRzx5X18eDvjvQ6yKo9ZSS6l//8elePK/Lf//IInrOF/FvDoADYAGBMGb7FtErm5MXMlmPAJQVgWta7Zx2go+8xJ0UiCb8LHHdftWyLJE0QIAIsI+UbXu67dZMjmgDGCGl1H+vpF4NSDckSIkk7Vd+sxEhBQMRU8j/12UIRhzSaUdQ+rQU5kGeFxm+hb1oh6pWWmv3uvmReDl0UnvtapVaIzo1jZbf/pD6ElLqSX+rUmOQNpJFa/r+sa4e/pBlAABoAAAAA3CUgShLdGIxsY7AUABPRrgCABdDuQ5GC7DqPQCgbbJUAoRSUj+NIEig0YfyWUho1VBBBA//uQZB4ABZx5zfMakeAAAAmwAAAAF5F3P0w9GtAAACfAAAAAwLhMDmAYWMgVEG1U0FIGCBgXBXAtfMH10000EEEEEECUBYln03TTTdNBDZopopYvrTTdNa325mImNg3TTPV9q3pmY0xoO6bv3r00y+IDGid/9aaaZTGMuj9mpu9Mpio1dXrr5HERTZSmqU36A3CumzN/9Robv/Xx4v9ijkSRSNLQhAWumap82WRSBUqXStV/YcS+XVLnSS+WLDroqArFkMEsAS+eWmrUzrO0oEmE40RlMZ5+ODIkAyKAGUwZ3mVKmcamcJnMW26MRPgUw6j+LkhyHGVGYjSUUKNpuJUQoOIAyDvEyG8S5yfK6dhZc0Tx1KI/gviKL6qvvFs1+bWtaz58uUNnryq6kt5RzOCkPWlVqVX2a/EEBUdU1KrXLf40GoiiFXK///qpoiDXrOgqDR38JB0bw7SoL+ZB9o1RCkQjQ2CBYZKd/+VJxZRRZlqSkKiws0WFxUyCwsKiMy7hUVFhIaCrNQsKkTIsLivwKKigsj8XYlwt/WKi2N4d//uQRCSAAjURNIHpMZBGYiaQPSYyAAABLAAAAAAAACWAAAAApUF/Mg+0aohSIRobBAsMlO//Kk4soosy1JSFRYWaLC4qZBYWFRGZdwqKiwkNBVmoWFSJkWFxX4FFRQWR+LsS4W/rFRb/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////VEFHAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAU291bmRib3kuZGUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMjAwNGh0dHA6Ly93d3cuc291bmRib3kuZGUAAAAAAAAAACU=";
+const BELL_SOUND = "data:audio/wav;base64,//uQRAAAAWMSLwUIYAAsYkXgoQwAEaYLWfkWgAI0wWs/ItAAAGDgYtAgAyN+QWaAAihwMWm4G8QQRDiMcCBcH3Cc+CDv/7xA4Tvh9Rz/y8QADBwMWgQAZG/ILNAARQ4GLTcDeIIIhxGOBAuD7hOfBB3/94gcJ3w+o5/5eIAIAAAVwWgQAVQ2ORaIQwEMAJiDg95G4nQL7mQVWI6GwRcfsZAcsKkJvxgxEjzFUgfHoSQ9Qq7KNwqHwuB13MA4a1q/DmBrHgPcmjiGoh//EwC5nGPEmS4RcfkVKOhJf+WOgoxJclFz3kgn//dBA+ya1GhurNn8zb//9NNutNuhz31f////9vt///z+IdAEAAAK4LQIAKobHItEIYCGAExBwe8jcToF9zIKrEdDYIuP2MgOWFSE34wYiR5iqQPj0JIeoVdlG4VD4XA67mAcNa1fhzA1jwHuTRxDUQ//iYBczjHiTJcIuPyKlHQkv/LHQUYkuSi57yQT//uggfZNajQ3Vmz+Zt//+mm3Wm3Q576v////+32///5/EOgAAADVghQAAAAA//uQZAUAB1WI0PZugAAAAAoQwAAAEk3nRd2qAAAAACiDgAAAAAAABCqEEQRLCgwpBGMlJkIz8jKhGvj4k6jzRnqasNKIeoh5gI7BJaC1A1AoNBjJgbyApVS4IDlZgDU5WUAxEKDNmmALHzZp0Fkz1FMTmGFl1FMEyodIavcCAUHDWrKAIA4aa2oCgILEBupZgHvAhEBcZ6joQBxS76AgccrFlczBvKLC0QI2cBoCFvfTDAo7eoOQInqDPBtvrDEZBNYN5xwNwxQRfw8ZQ5wQVLvO8OYU+mHvFLlDh05Mdg7BT6YrRPpCBznMB2r//xKJjyyOh+cImr2/4doscwD6neZjuZR4AgAABYAAAABy1xcdQtxYBYYZdifkUDgzzXaXn98Z0oi9ILU5mBjFANmRwlVJ3/6jYDAmxaiDG3/6xjQQCCKkRb/6kg/wW+kSJ5//rLobkLSiKmqP/0ikJuDaSaSf/6JiLYLEYnW/+kXg1WRVJL/9EmQ1YZIsv/6Qzwy5qk7/+tEU0nkls3/zIUMPKNX/6yZLf+kFgAfgGyLFAUwY//uQZAUABcd5UiNPVXAAAApAAAAAE0VZQKw9ISAAACgAAAAAVQIygIElVrFkBS+Jhi+EAuu+lKAkYUEIsmEAEoMeDmCETMvfSHTGkF5RWH7kz/ESHWPAq/kcCRhqBtMdokPdM7vil7RG98A2sc7zO6ZvTdM7pmOUAZTnJW+NXxqmd41dqJ6mLTXxrPpnV8avaIf5SvL7pndPvPpndJR9Kuu8fePvuiuhorgWjp7Mf/PRjxcFCPDkW31srioCExivv9lcwKEaHsf/7ow2Fl1T/9RkXgEhYElAoCLFtMArxwivDJJ+bR1HTKJdlEoTELCIqgEwVGSQ+hIm0NbK8WXcTEI0UPoa2NbG4y2K00JEWbZavJXkYaqo9CRHS55FcZTjKEk3NKoCYUnSQ0rWxrZbFKbKIhOKPZe1cJKzZSaQrIyULHDZmV5K4xySsDRKWOruanGtjLJXFEmwaIbDLX0hIPBUQPVFVkQkDoUNfSoDgQGKPekoxeGzA4DUvnn4bxzcZrtJyipKfPNy5w+9lnXwgqsiyHNeSVpemw4bWb9psYeq//uQZBoABQt4yMVxYAIAAAkQoAAAHvYpL5m6AAgAACXDAAAAD59jblTirQe9upFsmZbpMudy7Lz1X1DYsxOOSWpfPqNX2WqktK0DMvuGwlbNj44TleLPQ+Gsfb+GOWOKJoIrWb3cIMeeON6lz2umTqMXV8Mj30yWPpjoSa9ujK8SyeJP5y5mOW1D6hvLepeveEAEDo0mgCRClOEgANv3B9a6fikgUSu/DmAMATrGx7nng5p5iimPNZsfQLYB2sDLIkzRKZOHGAaUyDcpFBSLG9MCQALgAIgQs2YunOszLSAyQYPVC2YdGGeHD2dTdJk1pAHGAWDjnkcLKFymS3RQZTInzySoBwMG0QueC3gMsCEYxUqlrcxK6k1LQQcsmyYeQPdC2YfuGPASCBkcVMQQqpVJshui1tkXQJQV0OXGAZMXSOEEBRirXbVRQW7ugq7IM7rPWSZyDlM3IuNEkxzCOJ0ny2ThNkyRai1b6ev//3dzNGzNb//4uAvHT5sURcZCFcuKLhOFs8mLAAEAt4UWAAIABAAAAAB4qbHo0tIjVkUU//uQZAwABfSFz3ZqQAAAAAngwAAAE1HjMp2qAAAAACZDgAAAD5UkTE1UgZEUExqYynN1qZvqIOREEFmBcJQkwdxiFtw0qEOkGYfRDifBui9MQg4QAHAqWtAWHoCxu1Yf4VfWLPIM2mHDFsbQEVGwyqQoQcwnfHeIkNt9YnkiaS1oizycqJrx4KOQjahZxWbcZgztj2c49nKmkId44S71j0c8eV9yDK6uPRzx5X18eDvjvQ6yKo9ZSS6l//8elePK/Lf//IInrOF/FvDoADYAGBMGb7FtErm5MXMlmPAJQVgWta7Zx2go+8xJ0UiCb8LHHdftWyLJE0QIAIsI+UbXu67dZMjmgDGCGl1H+vpF4NSDckSIkk7Vd+sxEhBQMRU8j/12UIRhzSaUdQ+rQU5kGeFxm+hb1oh6pWWmv3uvmReDl0UnvtapVaIzo1jZbf/pD6ElLqSX+rUmOQNpJFa/r+sa4e/pBlAABoAAAAA3CUgShLdGIxsY7AUABPRrgCABdDuQ5GC7DqPQCgbbJUAoRSUj+NIEig0YfyWUho1VBBBA//uQZB4ABZx5zfMakeAAAAmwAAAAF5F3P0w9GtAAACfAAAAAwLhMDmAYWMgVEG1U0FIGCBgXBXAtfMH10000EEEEEECUBYln03TTTdNBDZopopYvrTTdNa325mImNg3TTPV9q3pmY0xoO6bv3r00y+IDGid/9aaaZTGMuj9mpu9Mpio1dXrr5HERTZSmqU36A3CumzN/9Robv/Xx4v9ijkSRSNLQhAWumap82WRSBUqXStV/YcS+XVLnSS+WLDroqArFkMEsAS+eWmrUzrO0oEmE40RlMZ5+ODIkAyKAGUwZ3mVKmcamcJnMW26MRPgUw6j+LkhyHGVGYjSUUKNpuJUQoOIAyDvEyG8S5yfK6dhZc0Tx1KI/gviKL6qvvFs1+bWtaz58uUNnryq6kt5RzOCkPWlVqVX2a/EEBUdU1KrXLf40GoiiFXK///qpoiDXrOgqDR38JB0bw7SoL+ZB9o1RCkQjQ2CBYZKd/+VJxZRRZlqSkKiws0WFxUyCwsKiMy7hUVFhIaCrNQsKkTIsLivwKKigsj8XYlwt/WKi2N4d//uQRCSAAjURNIHpMZBGYiaQPSYyAAABLAAAAAAAACWAAAAApUF/Mg+0aohSIRobBAsMlO//Kk4soosy1JSFRYWaLC4qZBYWFRGZdwqKiwkNBVmoWFSJkWFxX4FFRQWR+LsS4W/rFRb/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////VEFHAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAU291bmRib3kuZGUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMjAwNGh0dHA6Ly93d3cuc291bmRib3kuZGUAAAAAAAAAACU=";
 
 const METADATA_SUPPORTED = [
-    "fullscreen", "maximized",
-    "iconic", "above", "below",
-    "title", "size-hints",
-    "class-instance", "transient-for", "window-type",
-    "has-alpha", "decorations", "override-redirect",
-    "tray", "modal", "opacity",
+  "fullscreen", "maximized",
+  "iconic", "above", "below",
+  "title", "size-hints",
+  "class-instance", "transient-for", "window-type",
+  "has-alpha", "decorations", "override-redirect",
+  "tray", "modal", "opacity",
 ]
 
 // This option adds the CSS class .gpu-trigger to the windows.
@@ -168,12 +168,14 @@ class XpraClient {
     const video_max_size = [1024, 768];
     this.encoding_options = {
       "": this.encoding,
-      "icons" : {
+      "icons": {
         "max_size": [30, 30],
       },
       "transparency": true,
       "rgb_lz4": (lz4 && lz4.decode != "undefined"),
-      "decoder-speed": { "video": 0 },
+      "decoder-speed": {
+        "video": 0
+      },
       "color-gamut": Utilities.getColorGamut(),
       "video_scaling": true,
       "video_max_size": video_max_size,
@@ -330,14 +332,14 @@ class XpraClient {
     document.getElementById("screen").addEventListener("mousemove", (e) => this.on_mousemove(e));
 
     const div = document.querySelector("#screen");
+
     function on_mousescroll(e) {
       me.on_mousescroll(e);
       return e.preventDefault();
     }
     if (Utilities.isEventSupported("wheel")) {
       div.addEventListener("wheel", on_mousescroll, false);
-    }
-    else {
+    } else {
       this.warn("browser does not support scroll wheel events");
     }
   }
@@ -545,7 +547,7 @@ class XpraClient {
       this.offscreen_api = DECODE_WORKER && XpraOffscreenWorker.isAvailable(this.ssl);
     }
     if (this.offscreen_api) {
-      this.set_encoding_option('video_max_size',[4096, 4096]);
+      this.set_encoding_option('video_max_size', [4096, 4096]);
       this.clog("using offscreen decode worker");
       decode_worker = new Worker("js/OffscreenDecodeWorker.js");
     } else {
@@ -605,10 +607,9 @@ class XpraClient {
   _do_connect(with_worker) {
     if (this.webtransport) {
       this.protocol = new XpraWebTransportProtocol();
-    }
-    else {
-        const use_worker = with_worker && !XPRA_CLIENT_FORCE_NO_WORKER;
-        this.protocol = use_worker ? new XpraProtocolWorkerHost() : new XpraProtocol();
+    } else {
+      const use_worker = with_worker && !XPRA_CLIENT_FORCE_NO_WORKER;
+      this.protocol = use_worker ? new XpraProtocolWorkerHost() : new XpraProtocol();
     }
     this.open_protocol();
   }
@@ -619,20 +620,18 @@ class XpraClient {
     // make uri
     let uri = "";
     if (this.webtransport) {
-        uri = "https";
-    }
-    else {
-        if (this.ssl) {
-            uri = "wss";
-        }
-        else {
-            uri = "ws";
-        }
+      uri = "https";
+    } else {
+      if (this.ssl) {
+        uri = "wss";
+      } else {
+        uri = "ws";
+      }
     }
     uri += "://";
     uri += this.host;
     if (this.port) {
-        uri += `:${this.port}`;
+      uri += `:${this.port}`;
     }
     uri += this.path;
     // do open
@@ -646,7 +645,9 @@ class XpraClient {
     this.send([PACKET_TYPES.buffer_refresh, wid, 0, 100,
       {
         "refresh-now": true,
-        batch: { reset: true },
+        batch: {
+          reset: true
+        },
       },
       {}, //no client_properties
     ]);
@@ -793,9 +794,9 @@ class XpraClient {
           const number_slides = $(".window-preview-item-container").length;
           const current_slide = preview_element.slick("slickCurrentSlide");
           let next_index = current_slide;
-          next_index = e.shiftKey
-            ? (current_slide - 1) % number_slides
-            : (current_slide + 1) % number_slides;
+          next_index = e.shiftKey ?
+            (current_slide - 1) % number_slides :
+            (current_slide + 1) % number_slides;
           preview_element.slick("goTo", next_index, true);
           return e.stopPropagation() || e.preventDefault();
         } else if (e.altKey) {
@@ -1317,9 +1318,13 @@ class XpraClient {
       this._make_hello();
     }
     if (challenge_response) {
-      this._update_capabilities({"challenge_response": challenge_response});
+      this._update_capabilities({
+        "challenge_response": challenge_response
+      });
       if (client_salt) {
-        this._update_capabilities({"challenge_client_salt": client_salt});
+        this._update_capabilities({
+          "challenge_client_salt": client_salt
+        });
       }
     }
     this.clog("sending hello capabilities", this.capabilities);
@@ -1356,14 +1361,16 @@ class XpraClient {
       "mouse.show": true,
       "vrefresh": this.vrefresh,
       "file-chunks": FILE_CHUNKS_SIZE,
-      "setting-change": true,  // Required by v5 servers
-      "xdg-menu-update" : true,
-      "xdg-menu" : true,
+      "setting-change": true, // Required by v5 servers
+      "xdg-menu-update": true,
+      "xdg-menu": true,
     });
     this._update_capabilities(this._get_network_caps());
     if (this.encryption) {
       this.cipher_in_caps = this._get_cipher_caps()
-      this._update_capabilities({"encryption" : this.cipher_in_caps});
+      this._update_capabilities({
+        "encryption": this.cipher_in_caps
+      });
       console.info("setting cipher in caps=", JSON.stringify(this.cipher_in_caps));
       this.protocol.set_cipher_in(this.cipher_in_caps, this.encryption_key);
     }
@@ -1383,7 +1390,7 @@ class XpraClient {
       auto_refresh_delay: 500,
       "metadata.supported": METADATA_SUPPORTED,
       "encodings": {
-        "" : this.supported_encodings,
+        "": this.supported_encodings,
         "core": this.supported_encodings,
         "rgb_formats": this.RGB_FORMATS,
         "window-icon": ["png"],
@@ -1391,11 +1398,11 @@ class XpraClient {
         "packet": true,
       },
       "encoding": this._get_encoding_caps(),
-      "audio" : this._get_audio_caps(),
+      "audio": this._get_audio_caps(),
       "clipboard": this._get_clipboard_caps(),
-      "keymap" : this._get_keymap_caps(),
+      "keymap": this._get_keymap_caps(),
       "file": this._get_file_caps(),
-      "wants" : ["audio", ],
+      "wants": ["audio", ],
       // encoding stuff
       windows: true,
       "window.pre-map": true,
@@ -1405,11 +1412,11 @@ class XpraClient {
       desktop_mode_size: [this.desktop_width, this.desktop_height],
       screen_sizes: this._get_screen_sizes(),
       dpi: {
-        "x" : this._get_DPI(),
-        "y" : this._get_DPI(),
+        "x": this._get_DPI(),
+        "y": this._get_DPI(),
       },
       notifications: {
-        "enabled" : true,
+        "enabled": true,
       },
       cursors: true,
       bell: true,
@@ -1439,8 +1446,8 @@ class XpraClient {
       "lz4": (lz4 && lz4.decode != "undefined"),
       "bandwidth-limit": this.bandwidth_limit,
       "connection-data": Utilities.getConnectionInfo(),
-      "network" : {
-        "pings" : 5,
+      "network": {
+        "pings": 5,
       }
     }
   }
@@ -1452,7 +1459,7 @@ class XpraClient {
       try {
         this.debug("network", "crypto.subtle=", crypto.subtle);
         for (const hash of ["sha1", "sha256", "sha384", "sha512"]) {
-          digests.push("hmac+"+hash);
+          digests.push("hmac+" + hash);
         }
         this.debug("network", "digests:", digests);
       } catch {
@@ -1487,7 +1494,7 @@ class XpraClient {
 
   _get_build_caps() {
     return {
-      "revision" : Utilities.REVISION,
+      "revision": Utilities.REVISION,
       "local_modifications": Utilities.LOCAL_MODIFICATIONS,
       "branch": Utilities.BRANCH,
     }
@@ -1495,7 +1502,7 @@ class XpraClient {
 
   _get_platform_caps() {
     return {
-      "" : Utilities.getPlatformName(),
+      "": Utilities.getPlatformName(),
       "name": Utilities.getPlatformName(),
       "processor": Utilities.getPlatformProcessor(),
       "platform": navigator.appVersion,
@@ -1504,9 +1511,9 @@ class XpraClient {
 
   _get_audio_caps() {
     return {
-      "receive" : true,
-      "send" : true,
-      "decoders" : Object.keys(this.audio_codecs),
+      "receive": true,
+      "send": true,
+      "decoders": Object.keys(this.audio_codecs),
     }
   }
 
@@ -1545,9 +1552,9 @@ class XpraClient {
     this.log("clipboard preferred format: ", this.clipboard_preferred_format);
 
     return {
-      "enabled" : this.clipboard_enabled,
-      "want_targets" : true,
-      "greedy" : true,
+      "enabled": this.clipboard_enabled,
+      "want_targets": true,
+      "greedy": true,
       "selections": selections,
       "preferred-targets": this.clipboard_targets,
     }
@@ -1855,7 +1862,7 @@ class XpraClient {
 
   init_clipboard() {
     this.clog("initializing clipboard: enabled=", this.clipboard_enabled,
-              ", poll=", this.clipboard_poll, ", preferred format=", this.clipboard_preferred_format);
+      ", poll=", this.clipboard_poll, ", preferred format=", this.clipboard_preferred_format);
     if (!this.clipboard_enabled) {
       return;
     }
@@ -2013,9 +2020,9 @@ class XpraClient {
       (text) => {
         this.debug("clipboard", "paste event, text/html=", text);
         if (!text) {
-            // try with plain text:
-            read_clipboard_text();
-            return;
+          // try with plain text:
+          read_clipboard_text();
+          return;
         }
         const clipboard_buffer = text;
         if (clipboard_buffer != this.clipboard_buffer) {
@@ -2128,14 +2135,18 @@ class XpraClient {
       iwin.focused = iwin.wid == wid;
       if (iwin.focused) {
         iwin.stacking_layer = top_stacking_layer;
-        this.send_configure_window(iwin, { focused: true }, true);
+        this.send_configure_window(iwin, {
+          focused: true
+        }, true);
       } else {
         //move it down to fill the gap:
         if (iwin.stacking_layer > old_stacking_layer) {
           iwin.stacking_layer--;
         }
         if (had_focus == index) {
-          this.send_configure_window(iwin, { focused: false }, true);
+          this.send_configure_window(iwin, {
+            focused: false
+          }, true);
         }
       }
       iwin.updateFocus();
@@ -2328,8 +2339,7 @@ class XpraClient {
         this.close_protocol();
         this.reconnect_attempt++;
         this.do_reconnect();
-      }
-      else {
+      } else {
         this.disconnect_reason = "failed to open connection";
         this.close();
       }
@@ -2416,7 +2426,7 @@ class XpraClient {
 
   _process_close(packet) {
     this.clog("websocket closed: ", packet[1], "reason: ", this.disconnect_reason,
-              ", reconnect: ", this.reconnect, ", reconnect attempt: ", this.reconnect_attempt);
+      ", reconnect: ", this.reconnect, ", reconnect attempt: ", this.reconnect_attempt);
     if (this.reconnect_in_progress) {
       return;
     }
@@ -2633,7 +2643,7 @@ class XpraClient {
     this.server_audio_codecs = audio_caps["encoders"];
     if (!this.server_audio_codecs) {
       this.audio_enabled = false;
-       this.on_audio_state_change("disabled", "audio codecs missing on the server");
+      this.on_audio_state_change("disabled", "audio codecs missing on the server");
       return;
     }
     this.log("audio codecs supported by the server:", this.server_audio_codecs);
@@ -2643,9 +2653,9 @@ class XpraClient {
       //find the best codec we can use:
       for (let codec of MediaSourceConstants.PREFERRED_CODEC_ORDER) {
         if (codec in this.audio_codecs && this.server_audio_codecs.includes(codec)) {
-          this.audio_framework = this.mediasource_codecs[codec]
-            ? "mediasource"
-            : "aurora";
+          this.audio_framework = this.mediasource_codecs[codec] ?
+            "mediasource" :
+            "aurora";
           this.audio_codec = codec;
           this.log("using", this.audio_framework, "audio codec", codec);
           break;
@@ -2692,10 +2702,10 @@ class XpraClient {
       const ul = document.createElement("ul");
 
       //TODO need to figure out how to do this properly
-      a.addEventListener("mouseenter", function () {
+      a.addEventListener("mouseenter", function() {
         this.parentElement.childNodes[1].className = "-visible";
       });
-      a.addEventListener("mouseleave", function () {
+      a.addEventListener("mouseleave", function() {
         this.parentElement.childNodes[1].className = "";
       });
 
@@ -2722,15 +2732,15 @@ class XpraClient {
         a2.title = command;
 
         const me = this;
-        a2.addEventListener("click", function () {
+        a2.addEventListener("click", function() {
           const ignore = "False";
           me.start_command(this.innerText, this.title, ignore);
           document.querySelector("#menu_list").className = "-hide";
         });
-        a2.addEventListener("mouseenter", function () {
+        a2.addEventListener("mouseenter", function() {
           this.parentElement.parentElement.className = "-visible";
         });
-        a2.addEventListener("mouseleave", function () {
+        a2.addEventListener("mouseleave", function() {
           this.parentElement.parentElement.className = "";
         });
 
@@ -2761,11 +2771,11 @@ class XpraClient {
   xdg_image(icon_data, icon_type) {
     const img = new Image();
     if (typeof icon_data !== "undefined") {
-      let image_type = "image/"+icon_type;
+      let image_type = "image/" + icon_type;
       if (icon_type == "svg") {
         image_type = "image/svg+xml";
       }
-      img.src = "data:"+image_type+";base64,"+Utilities.ArrayBufferToBase64(icon_data);
+      img.src = "data:" + image_type + ";base64," + Utilities.ArrayBufferToBase64(icon_data);
     }
     img.className = "menu-content-left";
     img.height = 24;
@@ -2795,6 +2805,7 @@ class XpraClient {
     const prompt = (packet[5] || "password").replace(/[^\d+,. /:a-z]/gi, "");
     this.clog("process challenge:", digest);
     const client = this;
+
     function call_do_process_challenge(password) {
       if (!client || !client.protocol) {
         return;
@@ -2858,16 +2869,16 @@ class XpraClient {
     this.clog("with server salt:", Utilities.convertToHex(server_salt));
     this.clog("using", salt_digest);
     Utilities.gendigest(salt_digest, client_salt, server_salt)
-    .then(salt => {
-      this.clog(salt_digest, ":", Utilities.convertToHex(salt));
-      const hex_salt = Utilities.convertToHex(salt);
-      Utilities.gendigest(challenge_digest, password, hex_salt)
-      .then(challenge_response => {
-        this.do_send_hello(challenge_response, client_salt)
+      .then(salt => {
+        this.clog(salt_digest, ":", Utilities.convertToHex(salt));
+        const hex_salt = Utilities.convertToHex(salt);
+        Utilities.gendigest(challenge_digest, password, hex_salt)
+          .then(challenge_response => {
+            this.do_send_hello(challenge_response, client_salt)
+          })
+          .catch(err => this.disconnect("failed to generate challenge response: " + err));
       })
-      .catch(err => this.disconnect("failed to generate challenge response: "+err));
-    })
-    .catch(err => this.disconnect("failed to generate salt: "+err));
+      .catch(err => this.disconnect("failed to generate salt: " + err));
   }
 
   _send_ping() {
@@ -2933,7 +2944,10 @@ class XpraClient {
   }
   send_info_request() {
     if (!this.info_request_pending) {
-      this.send([PACKET_TYPES.info_request, [this.uuid], [], []]);
+      this.send([PACKET_TYPES.info_request, [this.uuid],
+        [],
+        []
+      ]);
       this.info_request_pending = true;
     }
   }
@@ -2980,7 +2994,10 @@ class XpraClient {
       left = 0;
       top = screen_height / 2 - toolbar_height / 2 - 100;
     }
-    float_menu_element.offset({ top, left });
+    float_menu_element.offset({
+      top,
+      left
+    });
   }
 
   _process_new_tray(packet) {
@@ -3011,8 +3028,7 @@ class XpraClient {
     mycanvas.height = h;
     this.id_to_window[wid] = new XpraWindow(this, wid,
       x, y, w, h,
-      metadata, false, true,
-      {},
+      metadata, false, true, {},
       //TODO: send new tray geometry to the server using send_tray_configure
       () => this.debug("tray", "tray geometry changed (ignored)"),
       (event, window) => this.on_mousemove(event, window),
@@ -3260,7 +3276,10 @@ class XpraClient {
       this.auto_focus();
     }
     if (this.decode_worker) {
-      this.decode_worker.postMessage({ cmd: "remove", wid });
+      this.decode_worker.postMessage({
+        cmd: "remove",
+        wid
+      });
     }
   }
 
@@ -3366,6 +3385,7 @@ class XpraClient {
     }
 
     const context = this;
+
     function notify() {
       let icon_url = "";
       if (icon && icon[0] == "png") {
@@ -3391,7 +3411,7 @@ class XpraClient {
         notify();
         return;
       } else if (Notification.permission !== "denied") {
-        Notification.requestPermission(function (permission) {
+        Notification.requestPermission(function(permission) {
           if (permission === "granted") {
             notify();
           }
@@ -3402,10 +3422,10 @@ class XpraClient {
 
     if (window.doNotification) {
       window.doNotification("info", nid, summary, body, expire_timeout, icon, actions, hints,
-        function (nid, action_id) {
+        function(nid, action_id) {
           context.send([PACKET_TYPES.notification_action, nid, action_id]);
         },
-        function (nid, reason, text) {
+        function(nid, reason, text) {
           context.send([PACKET_TYPES.notification_close, nid, reason, text || ""]);
         }
       );
@@ -3482,8 +3502,11 @@ class XpraClient {
       raw_buffers.push(img_data.buffer);
     }
     if (this.decode_worker) {
-      this.decode_worker.postMessage(
-        { cmd: "decode", packet, start: now },
+      this.decode_worker.postMessage({
+          cmd: "decode",
+          packet,
+          start: now
+        },
         raw_buffers
       );
       //the worker draw event will call do_process_draw
@@ -3496,7 +3519,10 @@ class XpraClient {
     this.do_process_draw(packet, 0);
     const wid = packet[1];
     if (this.decode_worker) {
-      this.decode_worker.postMessage({ cmd: "eos", wid });
+      this.decode_worker.postMessage({
+        cmd: "eos",
+        wid
+      });
     }
   }
 
@@ -3507,7 +3533,10 @@ class XpraClient {
     }
 
     if (this.offscreen_api) {
-      this.decode_worker.postMessage({ cmd: "redraw", wid: win.wid });
+      this.decode_worker.postMessage({
+        cmd: "redraw",
+        wid: win.wid
+      });
       return;
     }
     // request that drawing to screen takes place at next available opportunity if possible
@@ -3581,10 +3610,12 @@ class XpraClient {
       return;
     }
     const me = this;
+
     function send_damage_sequence(decode_time, message) {
       me.do_send_damage_sequence(packet_sequence, wid, width, height, decode_time, message);
     }
     const client = this;
+
     function decode_result(error) {
       const flush = options["flush"] || 0;
       let decode_time = Math.round(1000 * performance.now() - 1000 * start);
@@ -3625,7 +3656,7 @@ class XpraClient {
    */
   init_audio(ignore_audio_blacklist) {
     this.debug("audio", "init_audio() enabled=", this.audio_enabled, ", mediasource enabled=",
-        this.audio_mediasource_enabled, ", aurora enabled=", this.audio_aurora_enabled);
+      this.audio_mediasource_enabled, ", aurora enabled=", this.audio_aurora_enabled);
     if (this.audio_mediasource_enabled) {
       this.mediasource_codecs = MediaSourceUtil.getMediaSourceAudioCodecs(ignore_audio_blacklist);
       for (const codec_option in this.mediasource_codecs) {
@@ -3715,6 +3746,7 @@ class XpraClient {
 
   _sound_start_mediasource() {
     const me = this;
+
     function audio_error(event) {
       if (!me.media_source) {
         //already closed
@@ -4064,33 +4096,33 @@ class XpraClient {
 
     this.debug("clipboard", "sending clipboard token with data:", data, "as", actual_data_format);
     let packet;
-    packet = data
-      ? [
-          PACKET_TYPES.clipboard_token,
-          "CLIPBOARD",
-          actual_data_format,
-          UTF8_STRING,
-          UTF8_STRING,
-          8,
-          "bytes",
-          data,
-          claim,
-          greedy,
-          synchronous,
-        ]
-      : [
-          PACKET_TYPES.clipboard_token,
-          "CLIPBOARD",
-          [],
-          "",
-          "",
-          8,
-          "bytes",
-          "",
-          claim,
-          greedy,
-          synchronous,
-        ];
+    packet = data ?
+      [
+        PACKET_TYPES.clipboard_token,
+        "CLIPBOARD",
+        actual_data_format,
+        UTF8_STRING,
+        UTF8_STRING,
+        8,
+        "bytes",
+        data,
+        claim,
+        greedy,
+        synchronous,
+      ] :
+      [
+        PACKET_TYPES.clipboard_token,
+        "CLIPBOARD",
+        [],
+        "",
+        "",
+        8,
+        "bytes",
+        "",
+        claim,
+        greedy,
+        synchronous,
+      ];
     this.send(packet);
   }
 
@@ -4154,9 +4186,13 @@ class XpraClient {
         navigator.clipboard && Object.hasOwn(navigator.clipboard, "write")
       ) {
         this.debug("clipboard", "png image received");
-        const blob = new Blob([wire_data], { type: dtype });
+        const blob = new Blob([wire_data], {
+          type: dtype
+        });
         this.debug("clipboard", "created blob", blob);
-        const item = new ClipboardItem({ "image/png": blob });
+        const item = new ClipboardItem({
+          "image/png": blob
+        });
         this.debug("clipboard", "created ClipboardItem", item);
         const items = [item];
         this.debug("clipboard", "created ClipboardItem list", items);
@@ -4603,7 +4639,9 @@ class XpraClient {
       mimetype = "application/octet-binary";
     }
     this.log(`saving ${data.length} bytes of ${mimetype} data to filename ${filename}`);
-    Utilities.saveFile(filename, data, { type: mimetype });
+    Utilities.saveFile(filename, data, {
+      type: mimetype
+    });
   }
 
   print_document(filename, data, mimetype) {
@@ -4616,19 +4654,24 @@ class XpraClient {
       return;
     }
     this.log(`got ${data.length} bytes of PDF to print`);
-    const file = new Blob([data], { type: mimetype });
+    const file = new Blob([data], {
+      type: mimetype
+    });
     const fileURL = URL.createObjectURL(file);
     const win = window.open(fileURL);
     if (!win || win.closed || typeof win.closed == "undefined") {
       this.warn("popup blocked, saving to file instead");
-      Utilities.saveFile(filename, data, { type: mimetype });
+      Utilities.saveFile(filename, data, {
+        type: mimetype
+      });
     } else {
       win.print();
     }
   }
 
   send_all_files(files) {
-    for (let index = 0, f; (f = files[index]); index++) {
+    for (let index = 0, f;
+      (f = files[index]); index++) {
       this.send_file(f);
     }
   }
diff --git a/html5/js/DecodeWorker.js b/html5/js/DecodeWorker.js
index f8ce0a2d..2a59c20f 100644
--- a/html5/js/DecodeWorker.js
+++ b/html5/js/DecodeWorker.js
@@ -17,6 +17,7 @@ function decode_draw_packet(packet, start) {
   const height = packet[5];
   const coding = packet[6];
   const packet_sequence = packet[8];
+
   function send_back(raw_buffers) {
     const wid_hold = on_hold.get(wid);
     if (wid_hold) {
@@ -37,11 +38,20 @@ function decode_draw_packet(packet, start) {
     }
     do_send_back(packet, raw_buffers);
   }
+
   function do_send_back(p, raw_buffers) {
-    self.postMessage({ draw: p, start }, raw_buffers);
+    self.postMessage({
+      draw: p,
+      start
+    }, raw_buffers);
   }
+
   function decode_error(message) {
-    self.postMessage({ error: `${message}`, packet, start });
+    self.postMessage({
+      error: `${message}`,
+      packet,
+      start
+    });
   }
 
   function hold() {
@@ -90,13 +100,13 @@ function decode_draw_packet(packet, start) {
     );
     hold();
     createImageBitmap(img, 0, 0, actual_width, actual_height, options).then(
-      function (bitmap) {
+      function(bitmap) {
         packet[6] = "bitmap:rgb32";
         packet[7] = bitmap;
         send_back([bitmap]);
         release();
       },
-      function (error) {
+      function(error) {
         decode_error(
           `failed to create ${actual_width}x${actual_height} rgb32 bitmap from buffer ${data}`
         );
@@ -137,16 +147,18 @@ function decode_draw_packet(packet, start) {
       if (zerocopy) {
         buffer = data.buffer;
       }
-      const blob = new Blob([buffer], { type: `image/${coding}` });
+      const blob = new Blob([buffer], {
+        type: `image/${coding}`
+      });
       hold();
       createImageBitmap(blob, bitmap_options).then(
-        function (bitmap) {
+        function(bitmap) {
           packet[6] = `bitmap:${coding}`;
           packet[7] = bitmap;
           send_back([bitmap]);
           release();
         },
-        function (error) {
+        function(error) {
           console.info(`decode worker failed to create ${coding} image bitmap: ${error}`);
           console.info(`using ${blob} + ${JSON.stringify(bitmap_options)} from data=${data}`);
           console.info(`data from ${buffer.constructor.name} of length ${data.length}`);
@@ -185,19 +197,21 @@ function check_image_decode(
     );
   }
   try {
-    const timer = setTimeout(function () {
+    const timer = setTimeout(function() {
       fail_callback(format, `timeout, no ${format} picture decoded`);
     }, 2000);
     const data = new Uint8Array(image_bytes);
-    const blob = new Blob([data], { type: `image/${format}` });
+    const blob = new Blob([data], {
+      type: `image/${format}`
+    });
     createImageBitmap(blob, {
       premultiplyAlpha: "none",
     }).then(
-      function () {
+      function() {
         clearTimeout(timer);
         success_callback(format);
       },
-      function (error) {
+      function(error) {
         clearTimeout(timer);
         fail_callback(format, `${error}`);
       }
@@ -207,7 +221,7 @@ function check_image_decode(
   }
 }
 
-onmessage = function (e) {
+onmessage = function(e) {
   const data = e.data;
   switch (data.cmd) {
     case "check": {
@@ -275,9 +289,15 @@ onmessage = function (e) {
         delete CHECKS[format];
         if (Object.keys(CHECKS).length === 0) {
           if (errors.length === 0) {
-            self.postMessage({ result: true, formats });
+            self.postMessage({
+              result: true,
+              formats
+            });
           } else {
-            self.postMessage({ result: false, errors });
+            self.postMessage({
+              result: false,
+              errors
+            });
           }
         }
       };
diff --git a/html5/js/Keycodes.js b/html5/js/Keycodes.js
index ce3c809c..dd92a28d 100644
--- a/html5/js/Keycodes.js
+++ b/html5/js/Keycodes.js
@@ -1723,7 +1723,7 @@ const CHARCODE_TO_NAME = {
   222: "apostrophe",
 };
 for (let index = 0; index < 26; index++) {
-  CHARCODE_TO_NAME[65 + index] = "abcdefghijklmnopqrstuvwxyz"[index];
+  CHARCODE_TO_NAME[65 + index] = "abcdefghijklmnopqrstuvwxyz" [index];
 }
 for (let index = 0; index < 10; index++) {
   CHARCODE_TO_NAME[48 + index] = `${index}`;
diff --git a/html5/js/MediaSourceUtil.js b/html5/js/MediaSourceUtil.js
index 332a7ab7..413ba672 100644
--- a/html5/js/MediaSourceUtil.js
+++ b/html5/js/MediaSourceUtil.js
@@ -218,16 +218,16 @@ const MediaSourceUtil = {
       }
       console.debug(message);
     }
-    media_source.addEventListener("sourceopen", function (e) {
+    media_source.addEventListener("sourceopen", function(e) {
       debug_source_event("open");
     });
-    media_source.addEventListener("sourceended", function (e) {
+    media_source.addEventListener("sourceended", function(e) {
       debug_source_event("ended");
     });
-    media_source.addEventListener("sourceclose", function (e) {
+    media_source.addEventListener("sourceclose", function(e) {
       debug_source_event("close");
     });
-    media_source.addEventListener("error", function (e) {
+    media_source.addEventListener("error", function(e) {
       debug_source_event("error");
     });
   },
@@ -236,31 +236,31 @@ const MediaSourceUtil = {
     function debug_me_event(event) {
       console.debug(`${element_type} ${event}`);
     }
-    media_element.addEventListener("waiting", function () {
+    media_element.addEventListener("waiting", function() {
       debug_me_event("waiting");
     });
-    media_element.addEventListener("stalled", function () {
+    media_element.addEventListener("stalled", function() {
       debug_me_event("stalled");
     });
-    media_element.addEventListener("playing", function () {
+    media_element.addEventListener("playing", function() {
       debug_me_event("playing");
     });
-    media_element.addEventListener("loadstart", function () {
+    media_element.addEventListener("loadstart", function() {
       debug_me_event("loadstart");
     });
-    media_element.addEventListener("loadedmetadata", function () {
+    media_element.addEventListener("loadedmetadata", function() {
       debug_me_event("loadedmetadata");
     });
-    media_element.addEventListener("loadeddata", function () {
+    media_element.addEventListener("loadeddata", function() {
       debug_me_event("loadeddata");
     });
-    media_element.addEventListener("error", function () {
+    media_element.addEventListener("error", function() {
       debug_me_event("error");
     });
-    media_element.addEventListener("canplay", function () {
+    media_element.addEventListener("canplay", function() {
       debug_me_event("canplay");
     });
-    media_element.addEventListener("play", function () {
+    media_element.addEventListener("play", function() {
       debug_me_event("play");
     });
   },
@@ -270,16 +270,16 @@ const MediaSourceUtil = {
       const message = `${element_type} buffer ${event}`;
       console.debug(message);
     }
-    asb.addEventListener("updatestart", function (e) {
+    asb.addEventListener("updatestart", function(e) {
       debug_buffer_event("updatestart");
     });
-    asb.addEventListener("updateend", function (e) {
+    asb.addEventListener("updateend", function(e) {
       debug_buffer_event("updateend");
     });
-    asb.addEventListener("error", function (e) {
+    asb.addEventListener("error", function(e) {
       debug_buffer_event("error");
     });
-    asb.addEventListener("abort", function (e) {
+    asb.addEventListener("abort", function(e) {
       debug_buffer_event("abort");
     });
   },
diff --git a/html5/js/Menu.js b/html5/js/Menu.js
index a6f24207..e49fd261 100644
--- a/html5/js/Menu.js
+++ b/html5/js/Menu.js
@@ -23,7 +23,7 @@ SOFTWARE.
 
 */
 
-(function () {
+(function() {
   function $(selector, context) {
     context = context || document;
     return context["querySelectorAll"](selector);
@@ -63,7 +63,7 @@ SOFTWARE.
     menu.classList.add(ACTIVE_CLASS_NAME);
     ul.classList.add(ANIMATING_CLASS_NAME);
     ul.classList.add(VISIBLE_CLASS_NAME);
-    setTimeout(function () {
+    setTimeout(function() {
       ul.classList.remove(ANIMATING_CLASS_NAME);
     }, 25);
   }
@@ -76,7 +76,7 @@ SOFTWARE.
 
     menu.classList.remove(ACTIVE_CLASS_NAME);
     ul.classList.add(ANIMATING_CLASS_NAME);
-    setTimeout(function () {
+    setTimeout(function() {
       ul.classList.remove(VISIBLE_CLASS_NAME);
       ul.classList.remove(ANIMATING_CLASS_NAME);
     }, 300);
@@ -89,7 +89,7 @@ SOFTWARE.
         `li.${HAS_SUBMENU_CLASS_NAME}.${ACTIVE_CLASS_NAME}:not(:hover)`,
         menu.parent
       ),
-      function (e) {
+      function(e) {
         e.hideMenu && e.hideMenu();
       }
     );
@@ -97,15 +97,15 @@ SOFTWARE.
 
   function hideAllMenus() {
     const menu = this;
-    forEach($(`li.${HAS_SUBMENU_CLASS_NAME}`, menu.parent), function (e) {
+    forEach($(`li.${HAS_SUBMENU_CLASS_NAME}`, menu.parent), function(e) {
       e.hideMenu && e.hideMenu();
     });
   }
 
-  window.addEventListener("load", function () {
+  window.addEventListener("load", function() {
     forEach(
       $(`.${MENU_CLASS_NAME} li.${HAS_SUBMENU_CLASS_NAME}`),
-      function (e) {
+      function(e) {
         e.showMenu = showMenu;
         e.hideMenu = hideMenu;
       }
@@ -113,14 +113,14 @@ SOFTWARE.
 
     forEach(
       $(`.${MENU_CLASS_NAME} > li.${HAS_SUBMENU_CLASS_NAME}`),
-      function (e) {
+      function(e) {
         e.addEventListener("click", showMenu);
       }
     );
 
     forEach(
       $(`.${MENU_CLASS_NAME} > li.${HAS_SUBMENU_CLASS_NAME} li`),
-      function (e) {
+      function(e) {
         e.addEventListener("mouseenter", hideAllInactiveMenus);
       }
     );
@@ -129,12 +129,12 @@ SOFTWARE.
       $(
         `.${MENU_CLASS_NAME} > li.${HAS_SUBMENU_CLASS_NAME} li.${HAS_SUBMENU_CLASS_NAME}`
       ),
-      function (e) {
+      function(e) {
         e.addEventListener("mouseenter", showMenu);
       }
     );
 
-    forEach($("a"), function (e) {
+    forEach($("a"), function(e) {
       e.addEventListener("click", hideAllMenus);
     });
 
diff --git a/html5/js/MenuCustom.js b/html5/js/MenuCustom.js
index e719c861..87d03e4e 100644
--- a/html5/js/MenuCustom.js
+++ b/html5/js/MenuCustom.js
@@ -38,12 +38,12 @@ function addWindowListItem(win, wid, title) {
   const a = document.createElement("a");
 
   a.id = `windowlistitemlink${wid}`;
-  a.addEventListener("mouseover", function (e) {
+  a.addEventListener("mouseover", function(e) {
     if (e.ctrlKey) {
       client._window_set_focus(win);
     }
   });
-  a.addEventListener("click", function (e) {
+  a.addEventListener("click", function(e) {
     // Skip handling minimize, maximize, close events.
     if ($(e.target).hasClass(MENU_CONTENT_RIGHT_CLASS_NAME)) return;
     if (win.minimized) {
@@ -81,7 +81,7 @@ function addWindowListItem(win, wid, title) {
   img2.src = "icons/close.png";
   img2.title = "Close";
   img2.className = MENU_CONTENT_RIGHT_CLASS_NAME;
-  img2.addEventListener("click", function (e) {
+  img2.addEventListener("click", function(e) {
     client.send_close_window(win);
     e.stopPropagation();
     hideWindowList();
@@ -90,7 +90,7 @@ function addWindowListItem(win, wid, title) {
   img3.id = `windowlistitemmax${wid}`;
   img3.src = "icons/maximize.png";
   img3.title = "Maximize";
-  img3.addEventListener("click", function (e) {
+  img3.addEventListener("click", function(e) {
     win.toggle_maximized();
     e.stopPropagation();
     hideWindowList();
@@ -100,7 +100,7 @@ function addWindowListItem(win, wid, title) {
   img4.id = `windowlistitemmin${wid}`;
   img4.src = "icons/minimize.png";
   img4.title = "Minimize";
-  img4.addEventListener("click", function (e) {
+  img4.addEventListener("click", function(e) {
     win.toggle_minimized();
     e.stopPropagation();
     hideWindowList();
@@ -124,17 +124,17 @@ function removeWindowListItem(itemId) {
   }
 }
 
-$(function () {
+$(function() {
   const float_menu = $("#float_menu");
   float_menu.draggable({
     cancel: ".noDrag",
     containment: "window",
     scroll: false,
   });
-  float_menu.on("dragstart", function (event_, ui) {
+  float_menu.on("dragstart", function(event_, ui) {
     client.mouse_grabbed = true;
   });
-  float_menu.on("dragstop", function (event_, ui) {
+  float_menu.on("dragstop", function(event_, ui) {
     client.mouse_grabbed = false;
     client.toolbar_position = "custom";
     client.reconfigure_all_trays();
diff --git a/html5/js/Notifications.js b/html5/js/Notifications.js
index df0cabe8..fc34e3d5 100644
--- a/html5/js/Notifications.js
+++ b/html5/js/Notifications.js
@@ -7,12 +7,12 @@
  *
  */
 
-$(function () {
+$(function() {
   window.notification_timers = {};
 
   const NOTIFICATION_SELECTOR = ".notifications";
 
-  window.doNotification = function (
+  window.doNotification = function(
     type,
     nid,
     title,
@@ -40,11 +40,11 @@ $(function () {
     const nID = `notification${nid}`;
     const a = $(
       `<div id="${nID}" class="alert ${type}">` +
-        `<img class="notification_icon" id="notification_icon${nID}">` +
-        `<span class="title">${title}</span>` +
-        `<span class="message">${message}</span>` +
-        `<div class="dismiss">&#215;</div>` +
-        `</div>`
+      `<img class="notification_icon" id="notification_icon${nID}">` +
+      `<span class="title">${title}</span>` +
+      `<span class="message">${message}</span>` +
+      `<div class="dismiss">&#215;</div>` +
+      `</div>`
     );
     const notifications_elements = $(NOTIFICATION_SELECTOR);
     notifications_elements.prepend(a);
@@ -78,12 +78,12 @@ $(function () {
       }
     }
 
-    a.on("click", ".dismiss", function () {
+    a.on("click", ".dismiss", function() {
       window.cancelNotificationTimer(nid);
       a.removeClass("visible").addClass("hidden");
       a.on(
         "transitionend webkitTransitionEnd",
-        $.debounce(250, function () {
+        $.debounce(250, function() {
           a.trigger("dismissed");
           a.remove();
         })
@@ -93,13 +93,13 @@ $(function () {
       }
     });
 
-    setTimeout(function () {
+    setTimeout(function() {
       a.addClass("visible");
     }, 1);
 
     if (timeout) {
       a.data("timeLeft", timeout);
-      window.notification_timers[nid] = setInterval(function () {
+      window.notification_timers[nid] = setInterval(function() {
         const tleft = a.data("timeLeft") - 1;
         if (a.data("timeLeft") === 0) {
           a.find(".dismiss").trigger("click");
@@ -115,7 +115,7 @@ $(function () {
     return a;
   };
 
-  window._notification_button = function (
+  window._notification_button = function(
     nid,
     action_id,
     action_label,
@@ -125,7 +125,7 @@ $(function () {
     const notification_button = $(
       `<div class="notification_button" id=notification"${action_id}">${action_label}</div>`
     );
-    notification_button.on("click", function () {
+    notification_button.on("click", function() {
       window.closeNotification(nid);
       if (onAction) {
         onAction(nid, action_id);
@@ -137,31 +137,31 @@ $(function () {
     return notification_button;
   };
 
-  window.cancelNotificationTimer = function (nid) {
+  window.cancelNotificationTimer = function(nid) {
     const timer = window.notification_timers[nid];
     if (timer) {
       window.clearInterval(timer);
       delete window.notification_timers[nid];
     }
   };
-  window.cancelNotificationTimers = function () {
+  window.cancelNotificationTimers = function() {
     for (const nid in window.notification_timers) {
       window.cancelNotificationTimer(nid);
     }
   };
 
-  window.closeNotification = function (nid) {
+  window.closeNotification = function(nid) {
     window.cancelNotificationTimer(nid);
     const nID = `notification${nid}`;
     $(NOTIFICATION_SELECTOR).find(`#${nID}`).find(".dismiss").trigger("click");
   };
 
-  window.clearNotifications = function () {
+  window.clearNotifications = function() {
     window.cancelNotificationTimers();
     $(NOTIFICATION_SELECTOR).find(".dismiss").trigger("click");
   };
 
-  window.removeNotifications = function () {
+  window.removeNotifications = function() {
     window.cancelNotificationTimers();
     $(NOTIFICATION_SELECTOR).empty();
   };
diff --git a/html5/js/OffscreenDecodeWorker.js b/html5/js/OffscreenDecodeWorker.js
index a8c6791c..901112c3 100644
--- a/html5/js/OffscreenDecodeWorker.js
+++ b/html5/js/OffscreenDecodeWorker.js
@@ -48,7 +48,10 @@ const all_encodings = new Set([
 
 function send_decode_error(packet, error) {
   packet[7] = null;
-  self.postMessage({ error: `${error}`, packet });
+  self.postMessage({
+    error: `${error}`,
+    packet
+  });
 }
 
 const paint_worker = new Worker("PaintWorker.js");
@@ -57,8 +60,7 @@ class WindowDecoder {
   constructor(wid, canvas, debug) {
     this.wid = wid;
 
-    paint_worker.postMessage(
-      {
+    paint_worker.postMessage({
         cmd: "canvas",
         wid,
         canvas,
@@ -155,12 +157,14 @@ class WindowDecoder {
     clonepacket[10] = options;
 
     // Tell the server we are done with this packet
-    self.postMessage({ draw: clonepacket, start });
+    self.postMessage({
+      draw: clonepacket,
+      start
+    });
 
     // Paint the packet on screen refresh (if we can use requestAnimationFrame in the worker)
     if (packet[6] != "throttle") {
-      paint_worker.postMessage(
-        {
+      paint_worker.postMessage({
           cmd: "paint",
           image: packet[7],
           wid: packet[1],
@@ -195,7 +199,7 @@ class WindowDecoder {
   }
 }
 
-onmessage = function (e) {
+onmessage = function(e) {
   const data = e.data;
   let wd = null;
   switch (data.cmd) {
@@ -203,7 +207,10 @@ onmessage = function (e) {
       // Check if we support the given encodings.
       const encodings = [...data.encodings];
       const common = encodings.filter((value) => all_encodings.has(value));
-      self.postMessage({ result: true, formats: common });
+      self.postMessage({
+        result: true,
+        formats: common
+      });
       break;
     }
     case "eos":
@@ -227,7 +234,7 @@ onmessage = function (e) {
         wd.queue_draw_packet(packet);
       } else {
         send_decode_error(packet,
-                          `no window decoder found for wid ${wid}, only:${[...window_decoders.keys(),].join(",")}`
+          `no window decoder found for wid ${wid}, only:${[...window_decoders.keys(),].join(",")}`
         );
       }
       break;
diff --git a/html5/js/OffscreenDecodeWorkerHelper.js b/html5/js/OffscreenDecodeWorkerHelper.js
index 00cf6d7c..a6881e3f 100644
--- a/html5/js/OffscreenDecodeWorkerHelper.js
+++ b/html5/js/OffscreenDecodeWorkerHelper.js
@@ -66,7 +66,7 @@ const XpraOffscreenWorker = {
     }
     console.warn(
       "Offscreen decoding is not available. Please consider using " +
-        "Google Chrome, Firefox >= 108 for better performance."
+      "Google Chrome, Firefox >= 108 for better performance."
     );
     return false;
   },
diff --git a/html5/js/PaintWorker.js b/html5/js/PaintWorker.js
index e4071079..696ba9de 100644
--- a/html5/js/PaintWorker.js
+++ b/html5/js/PaintWorker.js
@@ -117,9 +117,9 @@ class XpraPaintWorker {
     let canvas = this.offscreen_canvas.get(wid);
     let still = this.offscreen_canvas_still.get(wid);
     still.getContext("2d").drawImage(canvas,
-        0, 0, canvas.width, canvas.height,
-        0, 0, canvas.width, canvas.height,
-      );
+      0, 0, canvas.width, canvas.height,
+      0, 0, canvas.width, canvas.height,
+    );
   }
 
   delete_canvas(wid) {
@@ -132,9 +132,9 @@ class XpraPaintWorker {
       let canvas = this.offscreen_canvas.get(wid);
       let still = this.offscreen_canvas_still.get(wid);
       canvas.getContext("2d").drawImage(still,
-          0, 0, still.width, still.height,
-          0, 0, still.width, still.height
-        );
+        0, 0, still.width, still.height,
+        0, 0, still.width, still.height
+      );
     } else {
       console.warn(`PaintWorker was asked for a redraw on window ${wid} but no still is available!`);
     }
@@ -143,7 +143,7 @@ class XpraPaintWorker {
 
 // Message handling to class
 const xpraPaintWorker = new XpraPaintWorker();
-onmessage = function (e) {
+onmessage = function(e) {
   const data = e.data;
   switch (data.cmd) {
     case "paint":
diff --git a/html5/js/Protocol.js b/html5/js/Protocol.js
index 1940ac5b..0eeaa423 100644
--- a/html5/js/Protocol.js
+++ b/html5/js/Protocol.js
@@ -30,7 +30,10 @@ class XpraProtocolWorkerHost {
   open(uri) {
     if (this.worker) {
       //re-use the existing worker:
-      this.worker.postMessage({ c: "o", u: uri });
+      this.worker.postMessage({
+        c: "o",
+        u: uri
+      });
       return;
     }
     this.worker = new Worker("js/Protocol.js");
@@ -40,7 +43,10 @@ class XpraProtocolWorkerHost {
         const data = e.data;
         switch (data.c) {
           case "r":
-            this.worker.postMessage({ c: "o", u: uri });
+            this.worker.postMessage({
+              c: "o",
+              u: uri
+            });
             break;
           case "p":
             if (this.packet_handler) {
@@ -59,28 +65,43 @@ class XpraProtocolWorkerHost {
     );
   }
 
-  close = function () {
-    this.worker.postMessage({ c: "c" });
+  close = function() {
+    this.worker.postMessage({
+      c: "c"
+    });
   };
 
-  terminate = function () {
-    this.worker.postMessage({ c: "t" });
+  terminate = function() {
+    this.worker.postMessage({
+      c: "t"
+    });
   };
 
-  send = function (packet) {
-    this.worker.postMessage({ c: "s", p: packet });
+  send = function(packet) {
+    this.worker.postMessage({
+      c: "s",
+      p: packet
+    });
   };
 
-  set_packet_handler = function (callback) {
+  set_packet_handler = function(callback) {
     this.packet_handler = callback;
   };
 
-  set_cipher_in = function (caps, key) {
-    this.worker.postMessage({ c: "z", p: caps, k: key });
+  set_cipher_in = function(caps, key) {
+    this.worker.postMessage({
+      c: "z",
+      p: caps,
+      k: key
+    });
   };
 
-  set_cipher_out = function (caps, key) {
-    this.worker.postMessage({ c: "x", p: caps, k: key });
+  set_cipher_out = function(caps, key) {
+    this.worker.postMessage({
+      c: "x",
+      p: caps,
+      k: key
+    });
   };
 }
 
@@ -133,9 +154,9 @@ class XpraProtocol {
     if (event.code) {
       try {
         message +=
-          typeof code_mappings[event.code] !== "undefined"
-            ? `'${code_mappings[event.code]}' (${event.code})`
-            : `${event.code}`;
+          typeof code_mappings[event.code] !== "undefined" ?
+          `'${code_mappings[event.code]}' (${event.code})` :
+          `${event.code}`;
         if (event.reason) {
           message += `: '${event.reason}'`;
         }
@@ -158,6 +179,7 @@ class XpraProtocol {
     this.mQ = [];
     this.header = [];
     this.websocket = null;
+
     function handle(packet) {
       me.packet_handler(packet);
     }
@@ -173,7 +195,7 @@ class XpraProtocol {
       return;
     }
     this.websocket.binaryType = "arraybuffer";
-    this.websocket.addEventListener("open", function () {
+    this.websocket.addEventListener("open", function() {
       if (me.verify_connected_timer) {
         clearTimeout(me.verify_connected_timer);
         me.verify_connected_timer = 0;
@@ -185,10 +207,10 @@ class XpraProtocol {
     );
     this.websocket.onerror = (event) =>
       handle(["error", me.close_event_str(event), event.code || 0]);
-    this.websocket.onmessage = function (e) {
+    this.websocket.onmessage = function(e) {
       // push arraybuffer values onto the end
       me.rQ.push(new Uint8Array(e.data));
-      setTimeout(function () {
+      setTimeout(function() {
         me.process_receive_queue();
       }, this.process_interval);
     };
@@ -340,23 +362,22 @@ class XpraProtocol {
       this.cipher_in_params["iv"] = iv;
       // console.log("decrypt", packet_data.byteLength, "bytes, padding=", padding, JSON.stringify(this.cipher_in_params), packet_data);
       crypto.subtle.decrypt(this.cipher_in_params, this.cipher_in_key, encrypted_data)
-      .then(decrypted => {
-        // console.log("decrypted", decrypted.byteLength, "bytes, padding=", padding);
-        const expected_length = packet_size - padding - iv.length;
-        if (!decrypted || decrypted.byteLength < expected_length) {
-          this.protocol_error(` expected ${expected_length} bytes, but got ${decrypted.byteLength}`);
-          return false;
-        }
-        if (decrypted.byteLength == packet_size - padding) {
+        .then(decrypted => {
+          // console.log("decrypted", decrypted.byteLength, "bytes, padding=", padding);
+          const expected_length = packet_size - padding - iv.length;
+          if (!decrypted || decrypted.byteLength < expected_length) {
+            this.protocol_error(` expected ${expected_length} bytes, but got ${decrypted.byteLength}`);
+            return false;
+          }
+          if (decrypted.byteLength == packet_size - padding) {
             packet_data = new Uint8Array(decrypted);
-        }
-        else {
+          } else {
             packet_data = new Uint8Array(decrypted.slice(0, packet_size - padding));
-        }
-        // console.log("packet data:", packet_data);
-        this.process_packet_data(header, packet_data);
-      })
-      .catch(err => this.protocol_error("failed to decrypt data: "+err));
+          }
+          // console.log("packet data:", packet_data);
+          this.process_packet_data(header, packet_data);
+        })
+        .catch(err => this.protocol_error("failed to decrypt data: " + err));
       return true;
     }
 
@@ -458,15 +479,15 @@ class XpraProtocol {
         const iv = Utilities.getSecureRandomBytes(16);
         this.cipher_out_params["iv"] = iv;
         crypto.subtle.encrypt(this.cipher_out_params, this.cipher_out_key, bdata)
-        .then(encrypted => {
+          .then(encrypted => {
             const enc_u8 = new Uint8Array(encrypted);
             const packet_data = new Uint8Array(iv.byteLength + enc_u8.byteLength);
             packet_data.set(iv, 0);
             packet_data.set(enc_u8, iv.byteLength);
             payload_size += iv.byteLength;
             this.send_packet(packet_data, payload_size, true);
-        })
-        .catch(err => this.protocol_error("failed to encrypt packet: "+err));
+          })
+          .catch(err => this.protocol_error("failed to encrypt packet: " + err));
         return;
       }
       this.send_packet(bdata, payload_size, false);
@@ -474,16 +495,16 @@ class XpraProtocol {
   }
 
   make_packet_header(proto_flags, level, payload_size) {
-      const header = new Uint8Array(8);
-      header[0] = "P".charCodeAt(0);
-      header[1] = proto_flags;
-      header[2] = level;
-      header[3] = 0;
-      //size header:
-      for (let index = 0; index < 4; index++) {
-        header[7 - index] = (payload_size >> (8 * index)) & 0xff;
-      }
-      return header;
+    const header = new Uint8Array(8);
+    header[0] = "P".charCodeAt(0);
+    header[1] = proto_flags;
+    header[2] = level;
+    header[3] = 0;
+    //size header:
+    for (let index = 0; index < 4; index++) {
+      header[7 - index] = (payload_size >> (8 * index)) & 0xff;
+    }
+    return header;
   }
 
   send_packet(bdata, payload_size, encrypted) {
@@ -517,7 +538,10 @@ class XpraProtocol {
       } else if (packet[0] === "sound-data" && Object.hasOwn(packet[2], "buffer")) {
         raw_buffers.push(packet[2].buffer);
       }
-      postMessage({ c: "p", p: packet }, raw_buffers);
+      postMessage({
+        c: "p",
+        p: packet
+      }, raw_buffers);
     }
   }
 
@@ -599,44 +623,45 @@ class XpraProtocol {
     const DEFAULT_KEY_HASH = "SHA-1";
     let key_hash = (caps["key_hash"] || DEFAULT_KEY_HASH).toUpperCase();
     if (key_hash.startsWith("SHA") && !key_hash.startsWith("SHA-")) {
-        key_hash = "SHA-"+key_hash.substring(3);
+      key_hash = "SHA-" + key_hash.substring(3);
     }
 
     const params = {
-      name: "AES-"+mode,   //ie: "AES-CBC"
+      name: "AES-" + mode, //ie: "AES-CBC"
       iv: Utilities.u8(iv),
     }
 
-    console.log("importing", "PBKDF2", "key", "'"+key+"'");
-    crypto.subtle.importKey("raw", Utilities.u8(key), { name: "PBKDF2" }, false, ["deriveKey", "deriveBits"])
-    .then(imported_key => {
+    console.log("importing", "PBKDF2", "key", "'" + key + "'");
+    crypto.subtle.importKey("raw", Utilities.u8(key), {
+        name: "PBKDF2"
+      }, false, ["deriveKey", "deriveBits"])
+      .then(imported_key => {
         console.log("imported key:", imported_key);
-        console.log("deriving", key_size*8, "bits", mode, "key with:", iterations, key_hash);
+        console.log("deriving", key_size * 8, "bits", mode, "key with:", iterations, key_hash);
         console.log("salt=", salt);
         // now stretch it to get the real key:
-        crypto.subtle.deriveKey(
-            {
-                name: "PBKDF2",
-                salt: salt,
-                iterations: iterations,
-                hash: {name: key_hash},
-            }, imported_key,
-            {
-                name: "AES-"+mode,
-                length: key_size * 8,
-            }, false, [usage],
-        )
-        .then(crypto_key => {
-          console.log("derived key for", usage, "usage:", crypto_key);
-          setup_function(block_size, params, crypto_key);
-        })
-        .catch(err => {
-          this.protocol_error("failed to derive AES key: "+err);
-        });
-    })
-    .catch(err => {
-      this.protocol_error("failed to import AES key: "+err);
-    });
+        crypto.subtle.deriveKey({
+            name: "PBKDF2",
+            salt: salt,
+            iterations: iterations,
+            hash: {
+              name: key_hash
+            },
+          }, imported_key, {
+            name: "AES-" + mode,
+            length: key_size * 8,
+          }, false, [usage], )
+          .then(crypto_key => {
+            console.log("derived key for", usage, "usage:", crypto_key);
+            setup_function(block_size, params, crypto_key);
+          })
+          .catch(err => {
+            this.protocol_error("failed to derive AES key: " + err);
+          });
+      })
+      .catch(err => {
+        this.protocol_error("failed to import AES key: " + err);
+      });
   }
 }
 
@@ -676,7 +701,10 @@ if (
       raw_buffer = packet[3].buffer;
       packet[3] = null;
     }
-    postMessage({ c: "p", p: packet }, raw_buffer);
+    postMessage({
+      c: "p",
+      p: packet
+    }, raw_buffer);
   }, null);
   // attach listeners from main thread
   self.addEventListener(
@@ -705,11 +733,16 @@ if (
           self.close();
           break;
         default:
-          postMessage({ c: "l", t: "got unknown command from host" });
+          postMessage({
+            c: "l",
+            t: "got unknown command from host"
+          });
       }
     },
     false
   );
   // tell host we are ready
-  postMessage({ c: "r" });
+  postMessage({
+    c: "r"
+  });
 }
diff --git a/html5/js/Utilities.js b/html5/js/Utilities.js
index e0c44105..345e2d80 100644
--- a/html5/js/Utilities.js
+++ b/html5/js/Utilities.js
@@ -8,8 +8,8 @@
  */
 
 const Utilities = {
-  VERSION : "17",
-  REVISION : 0,
+  VERSION: "17",
+  REVISION: 0,
   LOCAL_MODIFICATIONS: 0,
   BRANCH: "master",
 
@@ -107,7 +107,7 @@ const Utilities = {
     }
     if (!digest.startsWith("hmac")) {
       return new Promise(function(resolve, reject) {
-        reject(new Error("unsupported digest '"+digest+"'"));
+        reject(new Error("unsupported digest '" + digest + "'"));
       });
     }
     let hash = "SHA-1";
@@ -121,28 +121,31 @@ const Utilities = {
     }
 
     const promise = new Promise(function(resolve, reject) {
-      crypto.subtle.importKey("raw", Utilities.u8(password), { name: "HMAC", hash: hash }, false, ["sign", "verify"])
-      .then(
-        (key) => {
-          Utilities.cdebug("imported hmac key: ", key);
-          const u8salt = Utilities.u8(salt);
-          crypto.subtle.sign("HMAC", key, u8salt).then(
-            (result) => {
-              const u8digest = new Uint8Array(result);
-              Utilities.clog("hmac result=", u8digest);
-              resolve(Utilities.ArrayBufferToString(u8digest));
-            },
-            (error) => {
-              Utilities.clog("hmac signing failed:", error);
-              reject(error);
-            }
-          );
-        },
-        (error) => {
-          Utilities.clog("hmac key import failed:", error);
-          reject(error);
-        }
-      );
+      crypto.subtle.importKey("raw", Utilities.u8(password), {
+          name: "HMAC",
+          hash: hash
+        }, false, ["sign", "verify"])
+        .then(
+          (key) => {
+            Utilities.cdebug("imported hmac key: ", key);
+            const u8salt = Utilities.u8(salt);
+            crypto.subtle.sign("HMAC", key, u8salt).then(
+              (result) => {
+                const u8digest = new Uint8Array(result);
+                Utilities.clog("hmac result=", u8digest);
+                resolve(Utilities.ArrayBufferToString(u8digest));
+              },
+              (error) => {
+                Utilities.clog("hmac signing failed:", error);
+                reject(error);
+              }
+            );
+          },
+          (error) => {
+            Utilities.clog("hmac key import failed:", error);
+            reject(error);
+          }
+        );
     });
     return promise;
   },
@@ -151,9 +154,9 @@ const Utilities = {
     if (!string_) {
       return "";
     }
-    return string_.length > trimLength
-      ? `${string_.slice(0, Math.max(0, trimLength - 3))}...`
-      : string_;
+    return string_.length > trimLength ?
+      `${string_.slice(0, Math.max(0, trimLength - 3))}...` :
+      string_;
   },
 
   convertToHex(string_) {
@@ -168,7 +171,7 @@ const Utilities = {
     var hex = hexval.toString();
     var str = '';
     for (var i = 0; i < hex.length; i += 2) {
-        str += String.fromCharCode(parseInt(hex.substr(i, 2), 16));
+      str += String.fromCharCode(parseInt(hex.substr(i, 2), 16));
     }
     return str;
   },
@@ -427,7 +430,7 @@ const Utilities = {
 
   //https://github.com/facebook/fixed-data-table/blob/master/src/vendor_upstream/dom/normalizeWheel.js
   //BSD license
-  normalizeWheel(/*object*/ event) /*object*/ {
+  normalizeWheel( /*object*/ event) /*object*/ {
     // Reasonable defaults
     const PIXEL_STEP = 10;
     const LINE_HEIGHT = 40;
@@ -535,7 +538,7 @@ const Utilities = {
       return new Uint8Array(0);
     }
     const type = typeof v;
-    if (type === 'object' && v.constructor===Uint8Array) {
+    if (type === 'object' && v.constructor === Uint8Array) {
       return v;
     }
     return Utilities.StringToUint8(v.toString());
@@ -548,9 +551,7 @@ const Utilities = {
     const skip = 10_400;
     if (uintArray.subarray) {
       for (
-        let index = 0, length_ = uintArray.length;
-        index < length_;
-        index += skip
+        let index = 0, length_ = uintArray.length; index < length_; index += skip
       ) {
         s += String.fromCharCode.apply(
           null,
@@ -559,9 +560,7 @@ const Utilities = {
       }
     } else {
       for (
-        let index = 0, length_ = uintArray.length;
-        index < length_;
-        index += skip
+        let index = 0, length_ = uintArray.length; index < length_; index += skip
       ) {
         s += String.fromCharCode.apply(
           null,
@@ -672,7 +671,7 @@ const Utilities = {
   getparam(property) {
     let getParameter = window.location.getParameter;
     if (!getParameter) {
-      getParameter = function (key) {
+      getParameter = function(key) {
         if (!window.location.queryStringParams)
           window.location.queryStringParams = Utilities.parseParams(
             window.location.search.slice(1)
@@ -680,15 +679,15 @@ const Utilities = {
         return window.location.queryStringParams[key];
       };
     }
-    
+
     let value = getParameter(property);
-    
+
     if (value === undefined) {
       try {
         value = Utilities.getSessionStorageValue(property);
       } catch {}
     }
-    
+
     return value;
   },
 
@@ -796,7 +795,7 @@ const Utilities = {
       xhr.setRequestHeader("Authorization", `Basic ${credentials}`);
     }
     xhr.responseType = "json";
-    xhr.addEventListener("load", function () {
+    xhr.addEventListener("load", function() {
       Utilities.log("loaded", url, "status", xhr.status);
       const status = xhr.status;
       if (status === 200) {
@@ -808,13 +807,13 @@ const Utilities = {
         }
       }
     });
-    xhr.addEventListener("error", function (e) {
+    xhr.addEventListener("error", function(e) {
       Utilities.log(uri, "error:", e);
       if (error_function) {
         error_function(e);
       }
     });
-    xhr.addEventListener("abort", function (e) {
+    xhr.addEventListener("abort", function(e) {
       Utilities.log(uri, "abort:", e);
       if (error_function) {
         error_function(e);
diff --git a/html5/js/VideoDecoder.js b/html5/js/VideoDecoder.js
index b0101864..2b149eb2 100644
--- a/html5/js/VideoDecoder.js
+++ b/html5/js/VideoDecoder.js
@@ -70,7 +70,9 @@ class XpraVideoDecoder {
       codec: this.codec,
       hardwareAcceleration: "no-preference",
       optimizeForLatency: true,
-      colorSpace: new VideoColorSpace({fullRange: true})
+      colorSpace: new VideoColorSpace({
+        fullRange: true
+      })
     });
     this.last_timestamp = 0;
     this.initialized = true;
@@ -177,7 +179,9 @@ class XpraVideoDecoder {
       }
 
       this.had_first_key = true;
-      this.decoder_queue.push({ p: packet });
+      this.decoder_queue.push({
+        p: packet
+      });
       const init = {
         type: options["type"] == "IDR" ? "key" : "delta",
         data,
diff --git a/html5/js/WebTransport.js b/html5/js/WebTransport.js
index 98f7e6fa..e4ac2476 100644
--- a/html5/js/WebTransport.js
+++ b/html5/js/WebTransport.js
@@ -56,7 +56,7 @@ class XpraWebTransportProtocol {
 
     // connect the socket
     try {
-      console.log("opening WebTransport connection to "+uri);
+      console.log("opening WebTransport connection to " + uri);
       this.webtransport = new WebTransport(uri);
     } catch (error) {
       handle(["error", `${error}`, 0]);
@@ -68,31 +68,31 @@ class XpraWebTransportProtocol {
       await this.webtransport.ready;
       this.cancel_connected_timer();
     } catch (e) {
-      console.error("connection failed: "+e);
+      console.error("connection failed: " + e);
       handle(["error", e.toString()]);
       this.cancel_connected_timer();
       return;
     }
 
     this.webtransport.closed.then(() => {
-      handle(["close", "transport closed"])
-    })
-    .catch((e) => {
-      console.error("error closing WebTransport: "+e);
-      handle(["close", "error", e.toString()])
-    });
+        handle(["close", "transport closed"])
+      })
+      .catch((e) => {
+        console.error("error closing WebTransport: " + e);
+        handle(["close", "error", e.toString()])
+      });
 
     console.log("creating stream");
     this.stream = await this.webtransport.createBidirectionalStream();
-    console.log("starting read loop with stream="+this.stream);
+    console.log("starting read loop with stream=" + this.stream);
     this.read_loop().then(() => {
-      console.log("read loop ended, closing");
-      handle(["close", "read loop ended"])
-    })
-    .catch((e) => {
-      console.error("error in read loop: "+e);
-      handle(["close", "read loop error", e.toString()])
-    });
+        console.log("read loop ended, closing");
+        handle(["close", "read loop ended"])
+      })
+      .catch((e) => {
+        console.error("error in read loop: " + e);
+        handle(["close", "read loop error", e.toString()])
+      });
     this.writer = this.stream.writable.getWriter();
     handle(["open"]);
     console.log("async open end");
@@ -102,7 +102,10 @@ class XpraWebTransportProtocol {
     const reader = this.stream.readable.getReader();
     const me = this;
     while (true) {
-      const { value, done } = await reader.read();
+      const {
+        value,
+        done
+      } = await reader.read();
       if (done) {
         break;
       }
@@ -113,7 +116,7 @@ class XpraWebTransportProtocol {
 
   protocol_error(message) {
     this.packet_handler(["error", message]);
-    console.error("protocol error: "+message);
+    console.error("protocol error: " + message);
     this.close();
   }
 
@@ -122,13 +125,13 @@ class XpraWebTransportProtocol {
     const wt = this.webtransport;
     if (wt) {
       wt.closed.then(() => {
-        console.log("closed WebTransport connection");
-        handle(["close", "WebTransport closed"])
-      })
-      .catch((e) => {
-        console.log("error closing WebTransport connection: "+e);
-        handle(["close", "error closing WebTransport connection", e.toString()])
-      });
+          console.log("closed WebTransport connection");
+          handle(["close", "WebTransport closed"])
+        })
+        .catch((e) => {
+          console.log("error closing WebTransport connection: " + e);
+          handle(["close", "error closing WebTransport connection", e.toString()])
+        });
     }
     this.webtransport = null;
   }
diff --git a/html5/js/Window.js b/html5/js/Window.js
index 0bf66a7f..03bbf638 100644
--- a/html5/js/Window.js
+++ b/html5/js/Window.js
@@ -122,11 +122,11 @@ class XpraWindow {
     } else if (this.override_redirect) {
       jQuery(this.div).addClass("override-redirect");
     } else if (!fullscreen && (
-      this.windowtype == "" ||
-      this.windowtype == "NORMAL" ||
-      this.windowtype == "DIALOG" ||
-      this.windowtype == "UTILITY"
-    )) {
+        this.windowtype == "" ||
+        this.windowtype == "NORMAL" ||
+        this.windowtype == "DIALOG" ||
+        this.windowtype == "UTILITY"
+      )) {
       this.resizable = true;
     }
 
@@ -193,9 +193,13 @@ class XpraWindow {
     jQuery(this.div).prepend(head);
     // make draggable
     if (this.scale !== 1) {
-      jQuery(this.div).draggable({ transform: true });
+      jQuery(this.div).draggable({
+        transform: true
+      });
     }
-    jQuery(this.div).draggable({ cancel: "canvas" });
+    jQuery(this.div).draggable({
+      cancel: "canvas"
+    });
     jQuery(`#head${wid}`).click((event_) => {
       if (!this.minimized) {
         this.focus();
@@ -214,7 +218,9 @@ class XpraWindow {
     // This disables helper highlight, so we
     // move the resizable borders in transform plugin
     if (this.scale !== 1) {
-      jQuery(this.div).resizable({ transform: true });
+      jQuery(this.div).resizable({
+        transform: true
+      });
     }
     // attach resize handles
     jQuery(this.div).resizable({
@@ -299,8 +305,7 @@ class XpraWindow {
 
   transfer_canvas(canvas) {
     const offscreen_handle = canvas.transferControlToOffscreen();
-    this.client.decode_worker.postMessage(
-      {
+    this.client.decode_worker.postMessage({
         cmd: "canvas",
         wid: this.wid,
         canvas: offscreen_handle,
@@ -377,6 +382,7 @@ class XpraWindow {
     });
     //wheel events on a window:
     const me = this;
+
     function on_mousescroll(e) {
       me.on_mousescroll(e);
       e.stopPropagation();
@@ -461,10 +467,12 @@ class XpraWindow {
     this.updateCanvasGeometry();
     if (this.client.server_is_desktop || this.client.server_is_shadow) {
       if (this.client.server_resize_exact) {
-        jQuery(this.div).css("top",  0);
+        jQuery(this.div).css("top", 0);
       }
 
-      jQuery(this.div).position({ of: jQuery("#screen") });
+      jQuery(this.div).position({
+        of: jQuery("#screen")
+      });
       return;
     }
     // work out outer size
@@ -1159,6 +1167,7 @@ class XpraWindow {
     const window_element = jQuery(`#${this.wid}`);
     const cursor_url = this.construct_base64_image_url(encoding, img_data);
     const me = this;
+
     function set_cursor_url(url, x, y, w, h) {
       const url_string = `url('${url}')`;
       window_element.css("cursor", `${url_string}, default`);
@@ -1240,7 +1249,7 @@ class XpraWindow {
    */
   may_paint_now() {
     this.debug("draw", "may_paint_now() paint pending=", this.paint_pending,
-               ", paint queue length=", this.paint_queue.length);
+      ", paint queue length=", this.paint_queue.length);
     let now = performance.now();
     while (
       (this.paint_pending == 0 || now - this.paint_pending >= 2000) &&
diff --git a/html5/mitm.html b/html5/mitm.html
index d28450bd..2276e031 100644
--- a/html5/mitm.html
+++ b/html5/mitm.html
@@ -1,5 +1,6 @@
 <!-- saved from url=(0055)https://jimmywarting.github.io/StreamSaver.js/mitm.html -->
 <html>
+
   <head>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     <script>
@@ -36,7 +37,9 @@
           .then((swReg) => {
             return (
               swReg ||
-              navigator.serviceWorker.register("sw.js", { scope: "./" })
+              navigator.serviceWorker.register("sw.js", {
+                scope: "./"
+              })
             );
           })
           .then((swReg) => {
@@ -64,7 +67,11 @@
 
       // Now that we have the Service Worker registered we can process messages
       function onMessage(event) {
-        let { data, ports, origin } = event;
+        let {
+          data,
+          ports,
+          origin
+        } = event;
 
         // It's important to have a messageChannel, don't want to interfere
         // with other simultaneous downloads
@@ -154,9 +161,9 @@
         // then use the transferred port to reply via postMessage(), which
         // will in turn trigger the onmessage handler on messageChannel.port1.
 
-        const transferable = data.readableStream
-          ? [ports[0], data.readableStream]
-          : [ports[0]];
+        const transferable = data.readableStream ?
+          [ports[0], data.readableStream] :
+          [ports[0]];
 
         if (!(data.readableStream || data.transferringReadable)) {
           keepAlive();
@@ -181,7 +188,10 @@
         // shouldn't really be possible?
         keepAlive();
       }
+
     </script>
   </head>
+
   <body></body>
+
 </html>
