@easyeyes_threshold/runtime 1.20260909.84286

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 New York University (Denis Pelli and the EasyEyes team)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,69 @@
+# EasyEyes Threshold
+
+📖 [**Manual**](https://docs.google.com/document/d/e/2PACX-1vTTrqaSyva2afVupLchBjfTHc_YW5jAbEexGbudXMJ9xMKPBDA3nxQmHXa4wjnAoSVabeEA8T9CGIMa/pub)<br />
+📝 [**Parameter Glossary**](https://docs.google.com/spreadsheets/d/e/2PACX-1vQ8QswX_5h_oNS2Ly6VgoONGIxJHqDFjdZqWY_HUxH2Nr_LNkGDBL8FXz74l9BxVNR2AIXGhHir9GAd/pub?gid=1287694458&single=true&output=pdf)<br />
+🌏 [**Webapp**](https://easyeyes.app/experiment/) (beta)
+
+A PsychoJS-based experiment generator for the measuring various psychometric thresholds, e.g., crowding. Please visit [https://easyeyes.app/experiment](https://easyeyes.app/experiment/) for more instructions.
+
+## Development
+
+To clone this repo, use
+
+```shell
+git clone --recurse-submodules https://github.com/EasyEyes/threshold.git
+```
+
+Then, run the following for the initial setup
+
+```shell
+npm install
+npm run build
+```
+
+To develop based on a specific experiment table, use
+
+```shell
+npm run examples [tableName].[xlsx] # you may also run `npm run examples` to prepare for all tables in your examples/tables folder
+npm start # interactive selection of built examples
+npm start -- --name=[tableName] # start hot-reload development for specific example
+```
+
+You need to rerun `npm run examples [your table name]` every time you edit the HTML or table files.
+
+## PsychoJS Version
+
+We build EasyEyes Threshold with PsychoJS `2022.1.3`.
+
+## Vite Build System (Experimental)
+
+We've added Vite as an experimental alternative to Webpack for faster builds. The existing Webpack setup remains fully functional.
+
+### New Scripts
+
+- `npm run vite-start` - Start Vite development server
+- `npm run vite-build` - Build with Vite
+- `npm run vite-preview` - Preview Vite production build
+- `npm run compare-builds` - Compare Webpack vs Vite build performance (requires Rust)
+
+### Performance Comparison
+
+To compare build performance between Webpack and Vite:
+
+```bash
+npm run compare-builds
+```
+
+This Rust-based tool runs each build 3 times and provides detailed statistics including:
+
+- Average build times
+- Standard deviation
+- Statistical significance
+- Percentage improvement
+
+### Notes
+
+- Vite configuration is in `vite.config.js`
+- Both build systems output to the same `js/` directory
+- The Rust comparison tool requires Rust to be installed
+- Existing Webpack scripts (`npm start`, `npm run build`) remain unchanged

package/coi-serviceworker.js

@@ -0,0 +1,133 @@
+// /*! coi-serviceworker v0.1.6 - Guido Zuidhof, licensed under MIT */
+// let coepCredentialless = false;
+// if (typeof window === "undefined") {
+//   self.addEventListener("install", () => self.skipWaiting());
+//   self.addEventListener("activate", (event) =>
+//     event.waitUntil(self.clients.claim()),
+//   );
+
+//   self.addEventListener("message", (ev) => {
+//     if (!ev.data) {
+//       return;
+//     } else if (ev.data.type === "deregister") {
+//       self.registration
+//         .unregister()
+//         .then(() => {
+//           return self.clients.matchAll();
+//         })
+//         .then((clients) => {
+//           clients.forEach((client) => client.navigate(client.url));
+//         });
+//     } else if (ev.data.type === "coepCredentialless") {
+//       coepCredentialless = ev.data.value;
+//     }
+//   });
+
+//   self.addEventListener("fetch", function (event) {
+//     const r = event.request;
+//     const request =
+//       coepCredentialless && r.mode === "no-cors"
+//         ? new Request(r, {
+//             credentials: "omit",
+//           })
+//         : r;
+
+//     if (r.cache === "only-if-cached" && r.mode !== "same-origin") {
+//       return;
+//     }
+
+//     event.respondWith(
+//       fetch(request)
+//         .then((response) => {
+//           if (response.status === 0) {
+//             return response;
+//           }
+
+//           const newHeaders = new Headers(response.headers);
+//           newHeaders.set(
+//             "Cross-Origin-Embedder-Policy",
+//             coepCredentialless ? "credentialless" : "require-corp",
+//           );
+//           newHeaders.set("Cross-Origin-Opener-Policy", "same-origin");
+
+//           return new Response(response.body, {
+//             status: response.status,
+//             statusText: response.statusText,
+//             headers: newHeaders,
+//           });
+//         })
+//         .catch((e) => console.error(e)),
+//     );
+//   });
+// } else {
+//   (() => {
+//     // You can customize the behavior of this script through a global `coi` variable.
+//     const coi = {
+//       shouldRegister: () => true,
+//       shouldDeregister: () => false,
+//       coepCredentialless: () => false,
+//       doReload: () => window.location.reload(),
+//       quiet: false,
+//       ...window.coi,
+//     };
+
+//     const n = navigator;
+
+//     if (n.serviceWorker && n.serviceWorker.controller) {
+//       n.serviceWorker.controller.postMessage({
+//         type: "coepCredentialless",
+//         value: coi.coepCredentialless(),
+//       });
+
+//       if (coi.shouldDeregister()) {
+//         n.serviceWorker.controller.postMessage({ type: "deregister" });
+//       }
+//     }
+
+//     // If we're already coi: do nothing. Perhaps it's due to this script doing its job, or COOP/COEP are
+//     // already set from the origin server. Also if the browser has no notion of crossOriginIsolated, just give up here.
+//     if (window.crossOriginIsolated !== false || !coi.shouldRegister()) return;
+
+//     if (!window.isSecureContext) {
+//       !coi.quiet &&
+//         console.log(
+//           "COOP/COEP Service Worker not registered, a secure context is required.",
+//         );
+//       return;
+//     }
+
+//     // In some environments (e.g. Chrome incognito mode) this won't be available
+//     if (n.serviceWorker) {
+//       n.serviceWorker.register(window.document.currentScript.src).then(
+//         (registration) => {
+//           !coi.quiet &&
+//             console.log(
+//               "COOP/COEP Service Worker registered",
+//               registration.scope,
+//             );
+
+//           registration.addEventListener("updatefound", () => {
+//             !coi.quiet &&
+//               console.log(
+//                 "Reloading page to make use of updated COOP/COEP Service Worker.",
+//               );
+//             coi.doReload();
+//           });
+
+//           // If the registration is active, but it's not controlling the page
+//           if (registration.active && !n.serviceWorker.controller) {
+//             !coi.quiet &&
+//               console.log(
+//                 "Reloading page to make use of COOP/COEP Service Worker.",
+//               );
+//             coi.doReload();
+//           }
+//         },
+//         (err) => {
+//           !coi.quiet &&
+//             console.error("COOP/COEP Service Worker failed to register:", err);
+//         },
+//       );
+//     }
+//   })();
+// }

package/components/multiple-displays/multipleDisplay.css

@@ -0,0 +1,22 @@
+.form-input-btn {
+  font-size: 1.2rem;
+  margin: 0 0rem;
+  /* width: 5rem; */
+  height: 3rem !important;
+  outline: none;
+  border: none !important;
+  border-radius: 7px !important;
+  font-weight: 700 !important;
+  background-color: #ddd !important;
+}
+
+.form-input-btn:hover {
+  outline: 2px solid #999 !important;
+  outline-offset: 0.2rem !important;
+}
+
+.form-input-btn:active {
+  outline: 2px solid #999 !important;
+  outline-offset: 0.2rem !important;
+  background-color: #bbb !important;
+}

package/components/multiple-displays/peripheralDisplay.html

@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Peripheral Display</title>
+    <link rel="stylesheet" href="multipleDisplay.css" />
+  </head>
+  <body style="margin: 0">
+    <script src="https://cdn.jsdelivr.net/npm/remote-calibrator@0.9.146"></script>
+    <script src="./peripheralDisplay.js" type="module"></script>
+    <!-- <div
+      id="rc-panel-holder"
+      style="z-index: 99999; width: calc(100% - 2rem); margin: 0 1rem"
+    ></div> -->
+  </body>
+</html>

package/components/multiple-displays/peripheralDisplay.js

@@ -0,0 +1,37 @@
+let rc = null;
+
+async function runRemoteCalibrator() {
+  rc = new RemoteCalibrator();
+
+  rc.init();
+  console.log("RC LD", rc.languageData);
+  const tasks = [
+    {
+      name: "screenSize",
+      options: { fullscreen: true, check: false },
+    },
+  ];
+  await new Promise(async (resolve) => {
+    console.log("Remote Calibrator is running...");
+    //sleep for 2 seconds to make sure rc is loaded
+    await new Promise((res) => setTimeout(res, 2000));
+    rc.panel(
+      tasks,
+      "#rc-panel-holder",
+      {
+        debug: false,
+        i18n: true,
+      },
+      () => {
+        rc.removePanel();
+        rc._removeBackground();
+        console.log("Remote Calibrator is done");
+        resolve();
+      },
+      null,
+      null,
+      null,
+    );
+  });
+}
+// await runRemoteCalibrator();

package/index-stepper-bool.html

@@ -0,0 +1,152 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
+
+    <!-- Load serviceWorker as soon as possible -->
+    <!-- We explicity enable COOP/COEP to use ffmpeg.wasm -->
+    <!-- https://dev.to/stefnotch/enabling-coop-coep-without-touching-the-server-2d3n -->
+    <!-- https://github.com/gzuidhof/coi-serviceworker -->
+    <script src="coi-serviceworker.js"></script>
+    <script
+      src="https://js.sentry-cdn.com/8d5c414335e8ff6ebf585b7204830e5f.min.js"
+      crossorigin="anonymous"
+      data-lazy="no"
+    ></script>
+
+    <title>EasyEyes Study</title>
+    <link rel="icon" type="image/x-icon" href="components/images/favicon.ico" />
+
+    <!-- styles -->
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/jquery-ui-dist@1.12.1/jquery-ui.min.css"
+    />
+
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
+      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
+      crossorigin="anonymous"
+    />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.6.1/font/bootstrap-icons.css"
+    />
+    <script
+      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js"
+      integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF"
+      crossorigin="anonymous"
+    ></script>
+    <meta
+      http-equiv="Delegate-CH"
+      content="sec-ch-ua-full-version-list https://cloud.51degrees.com; sec-ch-ua-model https://cloud.51degrees.com; sec-ch-ua-platform https://cloud.51degrees.com; sec-ch-ua-platform-version https://cloud.51degrees.com"
+    />
+  </head>
+  <body>
+    <!-- ----------------------------------------------------------------------- -->
+    <!-- valid DOM elements -->
+    <div id="esc-key-handling-div"></div>
+    <div id="rc-panel-holder"></div>
+    <div id="root"></div>
+
+    <!-- Global error handling for script loading -->
+    <script>
+      (function () {
+        // Track failed scripts
+        window._failedScripts = [];
+
+        // Catch JavaScript errors
+        window.onerror = function (message, source, lineno, colno, error) {
+          console.error("[EasyEyes Error]", {
+            message: message,
+            source: source,
+            line: lineno,
+            column: colno,
+            error: error,
+          });
+          return false; // Let default handler run too
+        };
+
+        // Catch unhandled promise rejections
+        window.onunhandledrejection = function (event) {
+          console.error("[EasyEyes Unhandled Promise Rejection]", event.reason);
+        };
+
+        // Listen for script/resource load errors
+        window.addEventListener(
+          "error",
+          function (event) {
+            if (event.target && event.target.tagName === "SCRIPT") {
+              const src = event.target.src || "unknown";
+              window._failedScripts.push(src);
+              console.error("[EasyEyes Script Load Failed]", src);
+            }
+          },
+          true,
+        ); // Use capture phase to catch errors before they bubble
+
+        // Log ready state changes
+        document.addEventListener("readystatechange", function () {
+          console.log("[EasyEyes] document.readyState:", document.readyState);
+          if (document.readyState === "complete") {
+            if (window._failedScripts.length > 0) {
+              console.error(
+                "[EasyEyes] The following scripts failed to load:",
+                window._failedScripts,
+              );
+            } else {
+              console.log("[EasyEyes] All scripts loaded successfully.");
+            }
+          }
+        });
+      })();
+    </script>
+
+    <!-- external libraries -->
+    <script src="js/experimentLanguage.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/remote-calibrator@0.8.881/lib/RemoteCalibrator.min.js"></script>
+    <script
+      src="https://cdn.jsdelivr.net/npm/speaker-calibration@2.2.269/dist/main.js"
+      crossorigin="anonymous"
+    ></script>
+    <!-- <script src="https://www.keypad.website/ExperimentPeer.js"></script> -->
+    <!-- <script src="ExperimentPeer.js"></script> -->
+    <script
+      id="virtual-keypad-peer"
+      src="https://cdn.jsdelivr.net/gh/EasyEyes/virtual-keypad/dist/ExperimentPeer.js"
+    ></script>
+    <!-- <script src="main.js" ></script> -->
+    <script
+      crossorigin
+      src="https://cloud.51degrees.com/api/v4/AQSjtocC5XcfFwKc20g.js"
+      id="51DegreesScript"
+    ></script>
+    <script src="https://cdn.jsdelivr.net/npm/marked@4.0.7/marked.min.js"></script>
+    <!-- PsychoJS originals -->
+    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/jquery-ui-dist@1.12.1/jquery-ui.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/preloadjs@1.0.1/lib/preloadjs.min.js"></script>
+    <!-- -------------------------------- TEMP --------------------------------- -->
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
+
+    <!-- compatibility-check -->
+    <script
+      src="https://peer.easyeyes.app/main.js"
+      type="module"
+      crossorigin
+    ></script>
+
+    <script
+      src="https://connection-manager-14ac1ef82705.herokuapp.com/main.js"
+      type="module"
+      crossorigin
+    ></script>
+
+    <!-- initial load -->
+    <script type="module" src="js/first.min.js"></script>
+    <!-- experiment -->
+    <script type="module" src="js/threshold.min.js" defer></script>
+  </body>
+</html>

package/index.html

@@ -0,0 +1,153 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
+
+    <!-- Load serviceWorker as soon as possible -->
+    <!-- We explicity enable COOP/COEP to use ffmpeg.wasm -->
+    <!-- https://dev.to/stefnotch/enabling-coop-coep-without-touching-the-server-2d3n -->
+    <!-- https://github.com/gzuidhof/coi-serviceworker -->
+    <script src="coi-serviceworker.js"></script>
+
+    <script
+      src="https://js.sentry-cdn.com/8d5c414335e8ff6ebf585b7204830e5f.min.js"
+      crossorigin="anonymous"
+      data-lazy="no"
+    ></script>
+
+    <title>EasyEyes Study</title>
+    <link rel="icon" type="image/x-icon" href="components/images/favicon.ico" />
+
+    <!-- styles -->
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/jquery-ui-dist@1.12.1/jquery-ui.min.css"
+    />
+
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
+      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
+      crossorigin="anonymous"
+    />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.6.1/font/bootstrap-icons.css"
+    />
+    <script
+      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js"
+      integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF"
+      crossorigin="anonymous"
+    ></script>
+    <meta
+      http-equiv="Delegate-CH"
+      content="sec-ch-ua-full-version-list https://cloud.51degrees.com; sec-ch-ua-model https://cloud.51degrees.com; sec-ch-ua-platform https://cloud.51degrees.com; sec-ch-ua-platform-version https://cloud.51degrees.com"
+    />
+  </head>
+  <body>
+    <!-- ----------------------------------------------------------------------- -->
+    <!-- valid DOM elements -->
+    <div id="esc-key-handling-div"></div>
+    <div id="rc-panel-holder"></div>
+    <div id="root"></div>
+
+    <!-- Global error handling for script loading -->
+    <script>
+      (function () {
+        // Track failed scripts
+        window._failedScripts = [];
+
+        // Catch JavaScript errors
+        window.onerror = function (message, source, lineno, colno, error) {
+          console.error("[EasyEyes Error]", {
+            message: message,
+            source: source,
+            line: lineno,
+            column: colno,
+            error: error,
+          });
+          return false; // Let default handler run too
+        };
+
+        // Catch unhandled promise rejections
+        window.onunhandledrejection = function (event) {
+          console.error("[EasyEyes Unhandled Promise Rejection]", event.reason);
+        };
+
+        // Listen for script/resource load errors
+        window.addEventListener(
+          "error",
+          function (event) {
+            if (event.target && event.target.tagName === "SCRIPT") {
+              const src = event.target.src || "unknown";
+              window._failedScripts.push(src);
+              console.error("[EasyEyes Script Load Failed]", src);
+            }
+          },
+          true,
+        ); // Use capture phase to catch errors before they bubble
+
+        // Log ready state changes
+        document.addEventListener("readystatechange", function () {
+          console.log("[EasyEyes] document.readyState:", document.readyState);
+          if (document.readyState === "complete") {
+            if (window._failedScripts.length > 0) {
+              console.error(
+                "[EasyEyes] The following scripts failed to load:",
+                window._failedScripts,
+              );
+            } else {
+              console.log("[EasyEyes] All scripts loaded successfully.");
+            }
+          }
+        });
+      })();
+    </script>
+
+    <!-- external libraries -->
+    <script src="js/experimentLanguage.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/remote-calibrator@0.9.161"></script>
+    <script
+      src="https://cdn.jsdelivr.net/npm/speaker-calibration@2.2.272/dist/main.js"
+      crossorigin="anonymous"
+    ></script>
+    <!-- <script src="https://www.keypad.website/ExperimentPeer.js"></script> -->
+    <!-- <script src="ExperimentPeer.js"></script> -->
+    <script
+      id="virtual-keypad-peer"
+      src="https://cdn.jsdelivr.net/gh/EasyEyes/virtual-keypad/dist/ExperimentPeer.js"
+    ></script>
+    <!-- <script src="main.js" ></script> -->
+    <script
+      crossorigin
+      src="https://cloud.51degrees.com/api/v4/AQSjtocC5XcfFwKc20g.js"
+      id="51DegreesScript"
+    ></script>
+    <script src="https://cdn.jsdelivr.net/npm/marked@4.0.7/marked.min.js"></script>
+    <!-- PsychoJS originals -->
+    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/jquery-ui-dist@1.12.1/jquery-ui.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/preloadjs@1.0.1/lib/preloadjs.min.js"></script>
+    <!-- -------------------------------- TEMP --------------------------------- -->
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
+
+    <!-- compatibility-check -->
+    <script
+      src="https://peer.easyeyes.app/main.js"
+      type="module"
+      crossorigin
+    ></script>
+
+    <script
+      src="https://connection-manager-14ac1ef82705.herokuapp.com/main.js"
+      type="module"
+      crossorigin
+    ></script>
+
+    <!-- initial load -->
+    <script type="module" src="js/first.min.js"></script>
+    <!-- experiment -->
+    <script type="module" src="js/threshold.min.js" defer></script>
+  </body>
+</html>