first commit

9 files changed, 254 insertions, 0 deletions

diff --git a/CustomApps/legacyLibrary/index.js b/CustomApps/legacyLibrary/index.js
new file mode 100644
index 0000000..b435ddc
--- /dev/null
+++ b/CustomApps/legacyLibrary/index.js
@@ -0,0 +1,45 @@
+// this part was mostly copied from an example
+
+// Grab any variables you need
+const react = Spicetify.React;
+const reactDOM = Spicetify.ReactDOM;
+const {
+    URI,
+    React: { useState, useEffect, useCallback },
+    Platform: { History },
+} = Spicetify;
+
+// this is called when the page is open
+function render() {
+    Spicetify.Platform.History.replace("collection");
+    // element.classList.add("main-yourLibraryX-navLinkActive", "active");
+    return react.createElement(Grid, { title: "Open in the main view" });
+}
+
+//builds components of the page
+class Grid extends react.Component {
+    constructor(props) {
+        super(props);
+        Object.assign(this, props);
+        this.state = {
+            foo: "bar", //dont know what these do but its working so ill leave them be
+            data: "etc"
+        };
+    }
+
+    render() {
+        return react.createElement("section", {
+            className: "betterLibSection",
+            },
+            react.createElement("div",{
+                className: "betterLibBox"
+            },
+            react.createElement("div", {
+                className: "betterLibText",
+                },  
+                react.createElement("h4", null, this.props.title),
+            ),
+            )
+        );
+    }
+}
diff --git a/CustomApps/legacyLibrary/legacylibrary.js b/CustomApps/legacyLibrary/legacylibrary.js
new file mode 100644
index 0000000..5a10093
--- /dev/null
+++ b/CustomApps/legacyLibrary/legacylibrary.js
@@ -0,0 +1,24 @@
+function startLegacyLibListener() {
+    setTimeout(function() {
+        var libraryButton = document.querySelector('[data-id="/legacyLibrary"]').children[0];
+        var classes = ["main-yourLibraryX-navLinkActive", "active"];
+        Spicetify.Platform.History.listen((location) => {
+            console.log("called");
+            if (location.pathname.includes("/collection")  && location.pathname != "/collection/tracks")
+            {
+                if (!libraryButton.classList.contains(...classes))
+                {
+                    console.log("tried to add");
+                    libraryButton.classList.add(...classes);
+                }
+            }
+            else
+            {
+                if (libraryButton.classList.contains(...classes))
+                {
+                    libraryButton.classList.remove(...classes);
+                }
+            }
+        });
+    }, 1000);
+}
diff --git a/CustomApps/legacyLibrary/loadcss.js b/CustomApps/legacyLibrary/loadcss.js
new file mode 100644
index 0000000..a231694
--- /dev/null
+++ b/CustomApps/legacyLibrary/loadcss.js
@@ -0,0 +1,59 @@
+(function loadcss() {
+    console.log("got here");
+    document.getElementsByTagName('head')[0].insertAdjacentHTML(
+        'beforeend',`
+        <style>            
+            /* hide placeholder text */
+            .betterLibText {
+                display: none;
+            }
+            
+            /* hides the library header when in the sidebar*/
+            .main-yourLibraryX-library .main-yourLibraryX-header {
+                display: none;
+            }
+            
+            /* shows the library header if the user is in a folder*/
+            .main-yourLibraryX-library .main-yourLibraryX-header:has(.WYU7SXdABSulyirnmIYb) {
+                display: flex;
+            }
+            
+            /* hides collapse button (library icon)*/
+            span.IconWrapper__Wrapper-sc-16usrgb-0.Wrapper-medium-leading {
+                display: none;
+            }
+            
+            /* hides collapse button (library icon) in folder*/
+            /* button.Button-sc-1dqy6lx-0.Button-medium-medium-buttonTertiary-iconOnly-condensed-useBrowserDefaultFocusStyle.main-yourLibraryX-collapseButtonWrapper.main-yourLibraryX-button.main-useDropTarget-base.main-useDropTarget-track.main-useDropTarget-local.main-useDropTarget-album.main-useDropTarget-episode.main-useDropTarget-playlistV2.main-useDropTarget-folder, */
+            button.Button-sc-1dqy6lx-0.Button-medium-medium-buttonTertiary-iconOnly-condensed-useBrowserDefaultFocusStyle.main-yourLibraryX-collapseButtonWrapper.main-yourLibraryX-button.main-useDropTarget-base {
+                display: none;
+            }
+            
+            /* hides expand/reduce button (<- ->)(and also add(+) and more(...))*/
+            button.Button-sc-1dqy6lx-0.Button-small-small-buttonTertiary-iconOnly-useBrowserDefaultFocusStyle.main-yourLibraryX-button.main-yourLibraryX-iconOnly.main-useDropTarget-base {
+                display: none;
+            }
+            
+            /* unhides add(+) and more(...)*/
+            span button.Button-sc-1dqy6lx-0.Button-small-small-buttonTertiary-iconOnly-useBrowserDefaultFocusStyle.main-yourLibraryX-button.main-yourLibraryX-iconOnly.main-useDropTarget-base {
+                display: inherit;
+            }
+            
+            /* add more top padding to the sidebar */
+            .main-yourLibraryX-library {
+                padding-top: 5px;
+            }
+            
+            /* fixes icons on collapsed betterlibrary */
+            span.Type__TypeElement-sc-goli3j-0.TypeElement-balladBold-type {
+                display: var(--betterlib-fix-collaped-view,inherit);
+            }
+            
+            /* for future setting */
+            .main-yourLibraryX-entryPoints.main-yourLibraryX-library {
+                display: var(--betterlib-hide-sidebar-library,inherit);
+            }
+        </style>`
+    );
+    startLegacyLibListener();
+})();
\ No newline at end of file
diff --git a/CustomApps/legacyLibrary/manifest.json b/CustomApps/legacyLibrary/manifest.json
new file mode 100644
index 0000000..8c67ce3
--- /dev/null
+++ b/CustomApps/legacyLibrary/manifest.json
@@ -0,0 +1,6 @@
+{
+    "name": "Your Library",
+    "icon": "<svg role=\"img\" height=\"24\" width=\"24\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-encore-id=\"icon\" class=\"Svg-sc-ytk21e-0 Svg-img-24-icon\"><path d=\"M14.5 2.134a1 1 0 0 1 1 0l6 3.464a1 1 0 0 1 .5.866V21a1 1 0 0 1-1 1h-6a1 1 0 0 1-1-1V3a1 1 0 0 1 .5-.866zM16 4.732V20h4V7.041l-4-2.309zM3 22a1 1 0 0 1-1-1V3a1 1 0 0 1 2 0v18a1 1 0 0 1-1 1zm6 0a1 1 0 0 1-1-1V3a1 1 0 0 1 2 0v18a1 1 0 0 1-1 1z\"></path></svg>",
+    "active-icon": "<svg role=\"img\" height=\"24\" width=\"24\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-encore-id=\"icon\" class=\"Svg-sc-ytk21e-0 Svg-img-24-icon\"><path d=\"M3 22a1 1 0 0 1-1-1V3a1 1 0 0 1 2 0v18a1 1 0 0 1-1 1zM15.5 2.134A1 1 0 0 0 14 3v18a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V6.464a1 1 0 0 0-.5-.866l-6-3.464zM9 2a1 1 0 0 0-1 1v18a1 1 0 1 0 2 0V3a1 1 0 0 0-1-1z\"></path></svg>",
+    "subfiles_extension": ["legacylibrary.js","loadcss.js"]
+}
\ No newline at end of file
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..4408ee8
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Sowgro
+
+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.
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..3ea5c2c
--- /dev/null
+++ b/README.md
@@ -0,0 +1,16 @@
+# betterLibrary
+A Spicetify custom app which brings back the old library
+
+![Preview](preview.png)
+
+## Installation
+1. Download the source code and unzip it if necessary.
+2. Copy betterLibrary from the CustomApps folder into your Spicetify CustomApps folder.
+3. Run the following commands to enable the custom app:
+
+    ```
+    spicetify config custom_apps betterLibrary
+    ```
+    ```
+    spicetify apply
+    ```
diff --git a/manifest.json b/manifest.json
new file mode 100644
index 0000000..26fb393
--- /dev/null
+++ b/manifest.json
@@ -0,0 +1,11 @@
+{
+    "name": "legacyLibrary",
+    "description": "Restores the old library",
+    "preview": "preview.png",
+    "readme": "README.md",
+    "branch": "main",
+    "authors": [
+        { "name": "sowgro", "url": "https://sowgro.net/" }
+    ],
+    "tags": ["library"]
+}
diff --git a/preview.png b/preview.png
new file mode 100644
index 0000000..bbb3464
--- /dev/null
+++ b/preview.png
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..86a29fe
--- /dev/null
+++ b/style.css
@@ -0,0 +1,72 @@
+/* remove resize bar while in betterlibrary */
+.Root__top-container:has(.betterLibBox) .LayoutResizer__resize-bar {
+    visibility: hidden;
+}
+
+/* creates the centered placeholder text on the sidebar where the library was */
+.betterLibText {
+    display: none;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+}
+
+/* makes the text visible only when it is in the sidebar */
+.main-yourLibraryX-library .betterLibText {
+    display: var(--betterlib-show-placeholder-text,flex);
+}
+
+/* makes the "your library" not clickable, expands and styles the text*/
+button.Button-sc-1dqy6lx-0.Button-medium-medium-buttonTertiary-iconLeading-condensed-useBrowserDefaultFocusStyle.main-yourLibraryX-collapseButtonWrapper.main-yourLibraryX-button.main-useDropTarget-base.main-useDropTarget-track.main-useDropTarget-album.main-useDropTarget-artist.main-useDropTarget-playlistV2.main-useDropTarget-show.main-useDropTarget-episode.main-useDropTarget-folder,
+button.Button-sc-1dqy6lx-0.Button-medium-medium-buttonTertiary-iconLeading-condensed-useBrowserDefaultFocusStyle.main-yourLibraryX-collapseButtonWrapper.main-yourLibraryX-button.main-useDropTarget-base
+{
+    pointer-events: none;
+    font-size: x-large;
+    color: white;
+}
+
+/* hides the library header when in the sidebar*/
+.main-yourLibraryX-library .main-yourLibraryX-header {
+    display: none;
+}
+
+/* shows the library header if the user is in a folder*/
+.main-yourLibraryX-library .main-yourLibraryX-header:has(.WYU7SXdABSulyirnmIYb) {
+    display: flex;
+}
+
+/* hides collapse button (library icon)*/
+span.IconWrapper__Wrapper-sc-16usrgb-0.Wrapper-medium-leading {
+    display: none;
+}
+
+/* hides collapse button (library icon) in folder*/
+/* button.Button-sc-1dqy6lx-0.Button-medium-medium-buttonTertiary-iconOnly-condensed-useBrowserDefaultFocusStyle.main-yourLibraryX-collapseButtonWrapper.main-yourLibraryX-button.main-useDropTarget-base.main-useDropTarget-track.main-useDropTarget-local.main-useDropTarget-album.main-useDropTarget-episode.main-useDropTarget-playlistV2.main-useDropTarget-folder, */
+button.Button-sc-1dqy6lx-0.Button-medium-medium-buttonTertiary-iconOnly-condensed-useBrowserDefaultFocusStyle.main-yourLibraryX-collapseButtonWrapper.main-yourLibraryX-button.main-useDropTarget-base {
+    display: none;
+}
+
+/* hides expand/reduce button (<- ->)(and also add(+) and more(...))*/
+button.Button-sc-1dqy6lx-0.Button-small-small-buttonTertiary-iconOnly-useBrowserDefaultFocusStyle.main-yourLibraryX-button.main-yourLibraryX-iconOnly.main-useDropTarget-base {
+    display: none;
+}
+
+/* unhides add(+) and more(...)*/
+span button.Button-sc-1dqy6lx-0.Button-small-small-buttonTertiary-iconOnly-useBrowserDefaultFocusStyle.main-yourLibraryX-button.main-yourLibraryX-iconOnly.main-useDropTarget-base {
+    display: inherit;
+}
+
+/* add more top padding to the sidebar */
+.main-yourLibraryX-library {
+    padding-top: 5px;
+}
+
+/* fixes icons on collapsed betterlibrary */
+span.Type__TypeElement-sc-goli3j-0.TypeElement-balladBold-type {
+    display: var(--betterlib-fix-collaped-view,inherit);
+}
+
+/* for future setting */
+.main-yourLibraryX-entryPoints.main-yourLibraryX-library {
+    display: var(--betterlib-hide-sidebar-library,inherit);
+}
\ No newline at end of file