refactor scenePageRememberStates

- rename folder for consistency
- use csUiLib
- fix inconsitencies with div toggler
- remove double lookup with rbEventKey
- don't handle active class, let react do it's job

Co-authored-by: Elkorol <[email protected]>

Author: feederbox826

plugins/scenePageRememberStates/README.md

@@ -0,0 +1,5 @@
+# Scene Page Remember States
+
+This plugin uses local storage to rememebr what is the current active nav tab of the scenes' detail panel, and upon any page load activate the last remembered active nav tab.
+
+It also rembers the active collapsed state of the divider button and upon page load if it's true, it will automatically collapse the divider.

plugins/scenePageRememberStates/scenePageRememberStates.js

@@ -0,0 +1,38 @@
+function sceneDivider(tabs) {
+  const dividerBtn = document.querySelector(".scene-divider > button");
+
+  // check if tab is currently collapsed, and if it should be
+  const isCollapsed = () => tabs.classList.contains("collapsed")
+  const storedCollapse = localStorage.getItem("remember-state-divider") == "true"
+  // if it should be, but is not, collapse
+  if (storedCollapse && !isCollapsed()) dividerBtn.click()
+
+  // add listener to change desired state based on current collapsed state
+  dividerBtn.addEventListener("click", () => {
+    // isCollapsed does not update in time
+    const newState = !isCollapsed()
+    localStorage.setItem("remember-state-divider", newState)
+  })
+}
+
+function navTab() {
+  const detailsNav = document.querySelector(".nav-tabs")
+
+  // Check local storage for entries
+  let activeKey = localStorage.getItem("remember-state-navtab");
+
+  // click on desired active key if defined
+  if (activeKey) {
+    detailsNav.querySelector(`a[data-rb-event-key="${activeKey}"]`).click()
+  }
+
+  // add event listener
+  detailsNav.querySelectorAll("a").forEach(href => {
+    href.addEventListener("click", function() {
+      localStorage.setItem("remember-state-navtab", this.dataset.rbEventKey)
+    })
+  })
+}
+
+csLib.PathElementListener("/scenes/", ".nav-tabs", navTab)
+csLib.PathElementListener("/scenes/", ".scene-tabs", sceneDivider)

plugins/scenePageRememberStates/scenePageRememberStates.yml

@@ -0,0 +1,9 @@
+name: Scene Page Remember States
+description: Uses local storage to remember the state of the scene page detail panel nav bar and activate it on page load. Remembers collapse state of the divider.
+url:
+version: 0.2
+ui:
+  requires:
+    - CommunityScriptsUILibrary
+  javascript:
+    - scenesPageRememberStates.js