Replace StashUserscriptLibrary (#319)

* replace SUL in VideoScrollWheel

* rewrite stats to use cs-ui-lib

- reused and simplified GQL queries

* rewrite sceneCoverCropper to use cs-ui-lib

* update discordPrescence to use cs-ui-lib

- add websocket liveliness check
- add video playback hooks

* make stash-realbooru use cs-ui-lib

* deprecated by https://github.com/7dJx1qP/stash-plugins/tree/main/plugins/stashBatchResultToggle

* add cs-ui-lib to stashAI, applied some fixes to realbooru

* update Visage to use cs-ui-lib

* update themeSwitch to use cs-ui-lib

* remove userscript lib

---------

Co-authored-by: feederbox826 <feederbox826@users.noreply.github.com>

plugins/VideoScrollWheel/VideoScrollWheel.yml

@@ -1,5 +1,6 @@
 name: VideoScrollWheel
 description: Adds functionality to change volume/time in scene video player by hovering over left/right side of player and scrolling with mouse scrollwheel. Scroll while hovering on left side to adjust volume, scroll on right side to skip forward/back.
+#requires: CommunityScriptsUILibrary
 version: 0.2
 settings:
   allowVolumeChange:
@@ -36,6 +37,6 @@ settings:
     type: NUMBER
 ui:
   requires:
-    - StashUserscriptLibrary
+    - CommunityScriptsUILibrary
   javascript:
-    - videoScrollWheel.js
+    - VideoScrollWheel.js

plugins/VideoScrollWheel/videoScrollWheel.js

@@ -1,8 +1,4 @@
 (async () => {
-  while (!window.stash) {
-    await new Promise((resolve) => setTimeout(resolve, 100));
-  }
-
   const volumeScrollScale = -0.00065;
   const timeScrollScale = 0.01;
   const timeScrollFriction = 0.00015;
@@ -11,7 +7,8 @@
   let vjsPlayer = null;
   let scrollVelocity = 1;
   let previousTime = Date.now();
-  let pluginSettings = {
+  let pluginSettings = {};
+  const defaultPluginSettings = {
     allowVolumeChange: false,
     volumeScrollSpeed: 100.0,
     timeScrollSpeed: 100.0,
@@ -24,14 +21,11 @@
 
   async function setupVideoScrollWheel() {
     // Get settings
-    var settings = await getPluginConfig("videoScrollWheel");
-    if (settings) {
-      for (var key in settings) {
-        if (pluginSettings.hasOwnProperty(key)) {
-          pluginSettings[key] = settings[key];
-        }
-      }
-    }
+    const settings = await csLib.getConfiguration("VideoScrollWheel", {}); // getConfiguration is from cs-ui-lib.js
+    pluginSettings = {
+      ...defaultPluginSettings,
+      ...settings,
+    };
 
     // Get video player and register wheel event listener.
     vjsPlayer = document.getElementById("VideoJsPlayer").player;
@@ -95,26 +89,10 @@
     }
   }
 
-  // Util functions for getting plugin settings.
-  async function getPluginConfigs() {
-    const reqData = {
-      operationName: "Configuration",
-      variables: {},
-      query: `query Configuration {
-                configuration {
-                  plugins
-                }
-              }`,
-    };
-    return stash.callGQL(reqData);
-  }
-  async function getPluginConfig(pluginId) {
-    const data = await getPluginConfigs();
-    return data.data.configuration.plugins[pluginId];
-  }
-
   // Wait for video player to load on scene page.
-  stash.addEventListener("stash:page:scene", function () {
-    waitForElementId("VideoJsPlayer", setupVideoScrollWheel);
-  });
+  csLib.PathElementListener(
+    "/scenes/",
+    "#VideoJsPlayer",
+    setupVideoScrollWheel
+  ); // PathElementListener is from cs-ui-lib.js
 })();