@jsenv/plugin-toolbar 0.1.13 → 0.1.15

package/src/client/ui/toolbar_settings/toolbar_autoreload_setting.js

@@ -1,46 +1,46 @@
-import { effect } from "@preact/signals"
+import { effect } from "@preact/signals";
 
-import { autoreloadEnabledSignal } from "../../core/parent_window_signals.js"
+import { autoreloadEnabledSignal } from "../../core/parent_window_signals.js";
 import {
   disableAutoreload,
   enableAutoreload,
-} from "../../core/parent_window_actions.js"
+} from "../../core/parent_window_actions.js";
 
 export const renderToolbarAutoreloadSetting = () => {
-  const parentWindowReloader = window.parent.__reloader__
+  const parentWindowReloader = window.parent.__reloader__;
   if (!parentWindowReloader) {
-    disableAutoreloadSetting()
-    return
+    disableAutoreloadSetting();
+    return;
   }
 
-  const autoreloadCheckbox = document.querySelector("#toggle_autoreload")
+  const autoreloadCheckbox = document.querySelector("#toggle_autoreload");
   effect(() => {
-    const autoreloadEnabled = autoreloadEnabledSignal.value
+    const autoreloadEnabled = autoreloadEnabledSignal.value;
     if (autoreloadEnabled) {
-      autoreloadCheckbox.checked = true
+      autoreloadCheckbox.checked = true;
     } else {
-      autoreloadCheckbox.checked = false
+      autoreloadCheckbox.checked = false;
     }
-  })
+  });
 
   autoreloadCheckbox.onchange = () => {
     if (autoreloadCheckbox.checked) {
-      enableAutoreload()
+      enableAutoreload();
     } else {
-      disableAutoreload()
+      disableAutoreload();
     }
-  }
-}
+  };
+};
 
 const disableAutoreloadSetting = () => {
   document
     .querySelector(".settings_autoreload")
-    .setAttribute("data-disabled", "true")
+    .setAttribute("data-disabled", "true");
   document
     .querySelector(".settings_autoreload")
-    .setAttribute("title", `Autoreload not enabled on server`)
-  document.querySelector("#toggle_autoreload").disabled = true
-}
+    .setAttribute("title", `Autoreload not enabled on server`);
+  document.querySelector("#toggle_autoreload").disabled = true;
+};
 
 // const changeLink = variantNode.querySelector(".eventsource-changes-link")
 // changeLink.innerHTML = reloadMessageCount

package/src/client/ui/toolbar_settings/toolbar_notification_setting.js

@@ -1,88 +1,88 @@
-import { effect } from "@preact/signals"
+import { effect } from "@preact/signals";
 
 import {
   notificationsEnabledSignal,
   notificationPermissionSignal,
-} from "../../core/notification_signals.js"
-import { notificationAPIDetected } from "../../core/notification_context.js"
+} from "../../core/notification_signals.js";
+import { notificationAPIDetected } from "../../core/notification_context.js";
 import {
   enableNotifications,
   disableNotifications,
   requestPermission,
-} from "../../core/notification_actions.js"
-import { enableVariant } from "../variant.js"
+} from "../../core/notification_actions.js";
+import { enableVariant } from "../variant.js";
 
-const notifCheckbox = document.querySelector("#toggle_notifs")
+const notifCheckbox = document.querySelector("#toggle_notifs");
 
 export const renderToolbarNotificationSetting = () => {
   effect(() => {
-    const notificationsEnabled = notificationsEnabledSignal.value
-    notifCheckbox.checked = notificationsEnabled
-  })
+    const notificationsEnabled = notificationsEnabledSignal.value;
+    notifCheckbox.checked = notificationsEnabled;
+  });
 
   effect(() => {
-    const notificationPermission = notificationPermissionSignal.value
+    const notificationPermission = notificationPermissionSignal.value;
     if (!notificationAPIDetected) {
-      applyNotificationNotAvailableEffects()
-      return
+      applyNotificationNotAvailableEffects();
+      return;
     }
     if (notificationPermission === "default") {
-      applyNotificationDefaultEffects()
-      return
+      applyNotificationDefaultEffects();
+      return;
     }
     if (notificationPermission === "denied") {
-      applyNotificationDeniedEffects()
-      return
+      applyNotificationDeniedEffects();
+      return;
     }
     if (notificationPermission === "granted") {
-      applyNotificationGrantedEffects()
-      return
+      applyNotificationGrantedEffects();
+      return;
     }
-  })
-}
+  });
+};
 
 const applyNotificationNotAvailableEffects = () => {
-  const notifSetting = document.querySelector(".settings_notification")
-  notifSetting.setAttribute("data-disabled", "true")
+  const notifSetting = document.querySelector(".settings_notification");
+  notifSetting.setAttribute("data-disabled", "true");
   notifSetting.setAttribute(
     "title",
     `Notification not available in the browser`,
-  )
-  notifCheckbox.disabled = true
-}
+  );
+  notifCheckbox.disabled = true;
+};
 const applyNotificationDefaultEffects = () => {
-  applyNotificationNOTGrantedEffects()
-  const notifSetting = document.querySelector(".settings_notification")
-  notifSetting.removeAttribute("data-disabled")
-  notifSetting.removeAttribute("title")
-}
+  applyNotificationNOTGrantedEffects();
+  const notifSetting = document.querySelector(".settings_notification");
+  notifSetting.removeAttribute("data-disabled");
+  notifSetting.removeAttribute("title");
+};
 const applyNotificationDeniedEffects = () => {
-  applyNotificationNOTGrantedEffects()
-  const notifSetting = document.querySelector(".settings_notification")
-  notifSetting.setAttribute("data-disabled", "true")
-  notifSetting.setAttribute("title", `Notification denied`)
-}
+  applyNotificationNOTGrantedEffects();
+  const notifSetting = document.querySelector(".settings_notification");
+  notifSetting.setAttribute("data-disabled", "true");
+  notifSetting.setAttribute("title", `Notification denied`);
+};
 const applyNotificationGrantedEffects = () => {
   enableVariant(document.querySelector(".notification_text"), {
     notif_granted: "yes",
-  })
-  notifCheckbox.disabled = false
+  });
+  notifCheckbox.disabled = false;
   notifCheckbox.onchange = () => {
     if (notifCheckbox.checked) {
-      enableNotifications()
+      enableNotifications();
     } else {
-      disableNotifications()
+      disableNotifications();
     }
-  }
-}
+  };
+};
 
 const applyNotificationNOTGrantedEffects = () => {
   enableVariant(document.querySelector(".notification_text"), {
     notif_granted: "no",
-  })
-  notifCheckbox.disabled = true
-  notifCheckbox.checked = false
+  });
+  notifCheckbox.disabled = true;
+  notifCheckbox.checked = false;
   document.querySelector("a.request_notification_permission").onclick = () => {
-    requestPermission()
-  }
-}
+    requestPermission();
+  };
+};

package/src/client/ui/toolbar_settings/toolbar_settings.js

@@ -1,54 +1,54 @@
-import { effect } from "@preact/signals"
+import { effect } from "@preact/signals";
 
-import { settingsOpenedSignal } from "../../core/settings_signals.js"
-import { openSettings, closeSettings } from "../../core/settings_actions.js"
-import { enableVariant } from "../variant.js"
+import { settingsOpenedSignal } from "../../core/settings_signals.js";
+import { openSettings, closeSettings } from "../../core/settings_actions.js";
+import { enableVariant } from "../variant.js";
 import {
   activateToolbarSection,
   deactivateToolbarSection,
-} from "../util/dom.js"
-import { renderToolbarAutoreloadSetting } from "./toolbar_autoreload_setting.js"
-import { renderToolbarAnimationSetting } from "./toolbar_animation_setting.js"
-import { renderToolbarNotificationSetting } from "./toolbar_notification_setting.js"
-import { renderToolbarThemeSetting } from "./toolbar_theme_setting.js"
+} from "../util/dom.js";
+import { renderToolbarAutoreloadSetting } from "./toolbar_autoreload_setting.js";
+import { renderToolbarAnimationSetting } from "./toolbar_animation_setting.js";
+import { renderToolbarNotificationSetting } from "./toolbar_notification_setting.js";
+import { renderToolbarThemeSetting } from "./toolbar_theme_setting.js";
 
 export const renderToolbarSettings = () => {
-  document.querySelector("#settings_open_button").onclick = toggleSettings
-  document.querySelector("#settings_close_button").onclick = toggleSettings
-  disableWarningStyle()
+  document.querySelector("#settings_open_button").onclick = toggleSettings;
+  document.querySelector("#settings_close_button").onclick = toggleSettings;
+  disableWarningStyle();
 
-  renderToolbarAutoreloadSetting()
-  renderToolbarAnimationSetting()
-  renderToolbarNotificationSetting()
-  renderToolbarThemeSetting()
+  renderToolbarAutoreloadSetting();
+  renderToolbarAnimationSetting();
+  renderToolbarNotificationSetting();
+  renderToolbarThemeSetting();
 
   effect(() => {
-    const settingsOpened = settingsOpenedSignal.value
+    const settingsOpened = settingsOpenedSignal.value;
     if (settingsOpened) {
-      activateToolbarSection(document.querySelector("#settings"))
+      activateToolbarSection(document.querySelector("#settings"));
     } else {
-      deactivateToolbarSection(document.querySelector("#settings"))
+      deactivateToolbarSection(document.querySelector("#settings"));
     }
-  })
-}
+  });
+};
 
 const toggleSettings = () => {
-  const settingsOpened = settingsOpenedSignal.value
+  const settingsOpened = settingsOpenedSignal.value;
   if (settingsOpened) {
-    closeSettings()
+    closeSettings();
   } else {
-    openSettings()
+    openSettings();
   }
-}
+};
 
 export const enableWarningStyle = () => {
   enableVariant(document.querySelector("#settings_open_button"), {
     has_warning: "yes",
-  })
-}
+  });
+};
 
 export const disableWarningStyle = () => {
   enableVariant(document.querySelector("#settings_open_button"), {
     has_warning: "no",
-  })
-}
+  });
+};

package/src/client/ui/toolbar_settings/toolbar_theme_setting.js

@@ -1,17 +1,17 @@
-import { themeSignal } from "../../core/theme_signals.js"
+import { themeSignal } from "../../core/theme_signals.js";
 import {
   switchToDefaultTheme,
   switchToLightTheme,
-} from "../../core/theme_actions.js"
+} from "../../core/theme_actions.js";
 
 export const renderToolbarThemeSetting = () => {
-  const checkbox = document.querySelector("#checkbox_dark_theme")
-  checkbox.checked = themeSignal.value === "dark"
+  const checkbox = document.querySelector("#checkbox_dark_theme");
+  checkbox.checked = themeSignal.value === "dark";
   checkbox.onchange = () => {
     if (checkbox.checked) {
-      switchToDefaultTheme()
+      switchToDefaultTheme();
     } else {
-      switchToLightTheme()
+      switchToLightTheme();
     }
-  }
-}
+  };
+};

package/src/client/ui/toolbar_ui.js

@@ -1,21 +1,21 @@
-import { initToolbarOpening } from "./toolbar_opening/toolbar_opening.js"
-import { initToolbarMenuOverflow } from "./toolbar_menu_overflow/toolbar_menu_overflow.js"
-import { renderToolbarOverlay } from "./toolbar_overlay/toolbar_overlay.js"
-import { renderDocumentIndexLink } from "./document_index_link/document_index_link.js"
-import { renderDocumentExecutionIndicator } from "./document_execution_indicator/document_execution_indicator.js"
-import { renderChangesIndicator } from "./changes_indicator/changes_indicator.js"
-import { renderServerIndicator } from "./server_indicator/server_indicator.js"
-import { renderToolbarSettings } from "./toolbar_settings/toolbar_settings.js"
-import { renderToolbarCloseButton } from "./toolbar_close_button/toolbar_close_button.js"
+import { initToolbarOpening } from "./toolbar_opening/toolbar_opening.js";
+import { initToolbarMenuOverflow } from "./toolbar_menu_overflow/toolbar_menu_overflow.js";
+import { renderToolbarOverlay } from "./toolbar_overlay/toolbar_overlay.js";
+import { renderDocumentIndexLink } from "./document_index_link/document_index_link.js";
+import { renderDocumentExecutionIndicator } from "./document_execution_indicator/document_execution_indicator.js";
+import { renderChangesIndicator } from "./changes_indicator/changes_indicator.js";
+import { renderServerIndicator } from "./server_indicator/server_indicator.js";
+import { renderToolbarSettings } from "./toolbar_settings/toolbar_settings.js";
+import { renderToolbarCloseButton } from "./toolbar_close_button/toolbar_close_button.js";
 
 export const initToolbarUI = () => {
-  initToolbarOpening()
-  initToolbarMenuOverflow()
-  renderToolbarOverlay()
-  renderDocumentIndexLink()
-  renderDocumentExecutionIndicator()
-  renderChangesIndicator()
-  renderServerIndicator()
-  renderToolbarSettings()
-  renderToolbarCloseButton()
-}
+  initToolbarOpening();
+  initToolbarMenuOverflow();
+  renderToolbarOverlay();
+  renderDocumentIndexLink();
+  renderDocumentExecutionIndicator();
+  renderChangesIndicator();
+  renderServerIndicator();
+  renderToolbarSettings();
+  renderToolbarCloseButton();
+};