Add files via upload

cally-jt · web-flow · commit 92d11d5818c0 · 2024-04-07T14:46:04.000+01:00
diff --git a/features/features.json b/features/features.json
@@ -1,4 +1,9 @@
 [
+  {
+    "version": 2,
+    "id": "sidebar",
+    "versionAdded": "v3.8.0"
+  },
   {
     "version": 2,
     "id": "project-version-detector",
@@ -1141,18 +1146,6 @@
     "file": "round-profile-pictures",
     "type": ["Website", "Theme"]
   },
-  {
-    "title": "Sidebar",
-    "description": "Adds a sidebar to the Scratch website, rather than just the normal navigation bar at the top of the screen.",
-    "credits": ["Scratchfangs", "rgantzos", "callumjt"],
-    "urls": [
-      "https://scratch.mit.edu/users/scratchfangs/",
-      "https://scratch.mit.edu/users/rgantzos/",
-      "https://scratch.mit.edu/users/callumjt/"
-    ],
-    "file": "sidebar",
-    "type": ["Website", "Theme"]
-  },
   {
     "title": "Ocular Links in Forums",
     "description": "Adds a link to any user's Ocular page right below their username on a post.",
diff --git a/features/sidebar/data.json b/features/sidebar/data.json
@@ -0,0 +1,24 @@
+{
+    "title": "Sidebar",
+    "description": "Adds a sidebar to the Scratch website, rather than just the normal navigation bar at the top of the screen.",
+    "credits": [
+        {"username": "Scratchfangs", "url": "https://scratch.mit.edu/users/scratchfangs/"},
+        {"username": "rgantzos", "url": "https://scratch.mit.edu/users/rgantzos/"},
+        {"username": "callumjt", "url": "https://scratch.mit.edu/users/callumjt/"}
+    ],
+    "type": ["Website", "Theme"],
+    "dynamic": false,
+    "scripts": [{"file": "./script.js", "runOn": "/"}],
+    "styles": [{"file": "./style.css", "runOn": "/"}],
+    "resources": [
+        {"name": "search", "path": "/resources/search.svg"},
+        {"name": "home", "path": "/resources/home.svg"},
+        {"name": "create", "path": "/resources/create.svg"},
+        {"name": "explore", "path": "/resources/explore.svg"},
+        {"name": "ideas", "path": "/resources/ideas.svg"},
+        {"name": "about", "path": "/resources/about.svg"},
+        {"name": "logout", "path": "/resources/logout.svg"},
+        {"name": "settings", "path": "/resources/settings.svg"},
+        {"name": "signIn", "path": "/resources/signin.svg"}
+    ]
+}
diff --git a/features/sidebar/resources/about.svg b/features/sidebar/resources/about.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M480 1016 360 896H180q-24 0-42-18.5T120 836V236q0-24 18-42t42-18h600q23 0 41.5 18t18.5 42v600q0 23-18.5 41.5T780 896H600l-120 120ZM180 836h204l96 96 96-96h204V236H180v600Zm0-600v600-600Zm297.028 522Q493 758 504 746.972q11-11.028 11-27T503.972 693q-11.028-11-27-11T450 693.028q-11 11.028-11 27T450.028 747q11.028 11 27 11ZM501 610q0-31 10-50.5t34.721-44.221Q579 482 592 456.5t13-53.5q0-53-34-84t-91.523-31q-51.866 0-88.171 24.5Q355 337 338 380l53 22q14-28 36.2-42.5Q449.4 345 479 345q32 0 50.5 16t18.5 44.098Q548 425 537 443.5T500 487q-37 35-46.5 60t-9.5 63h57Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/create.svg b/features/sidebar/resources/create.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M453 776h60V610h167v-60H513V376h-60v174H280v60h173v166Zm27.266 200q-82.734 0-155.5-31.5t-127.266-86q-54.5-54.5-86-127.341Q80 658.319 80 575.5q0-82.819 31.5-155.659Q143 347 197.5 293t127.341-85.5Q397.681 176 480.5 176q82.819 0 155.659 31.5Q709 239 763 293t85.5 127Q880 493 880 575.734q0 82.734-31.5 155.5T763 858.316q-54 54.316-127 86Q563 976 480.266 976Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/explore.svg b/features/sidebar/resources/explore.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M480 976q-84 0-157-31.5T196 859q-54-54-85-127.5T80 574q0-84 31-156.5T196 291q54-54 127-84.5T480 176q84 0 157 30.5T764 291q54 54 85 126.5T880 574q0 84-31 157.5T764 859q-54 54-127 85.5T480 976Zm0-58q35-36 58.5-82.5T577 725H384q14 60 37.5 108t58.5 85Zm-85-12q-25-38-43-82t-30-99H172q38 71 88 111.5T395 906Zm171-1q72-23 129.5-69T788 725H639q-13 54-30.5 98T566 905ZM152 665h159q-3-27-3.5-48.5T307 574q0-25 1-44.5t4-43.5H152q-7 24-9.5 43t-2.5 45q0 26 2.5 46.5T152 665Zm221 0h215q4-31 5-50.5t1-40.5q0-20-1-38.5t-5-49.5H373q-4 31-5 49.5t-1 38.5q0 21 1 40.5t5 50.5Zm275 0h160q7-24 9.5-44.5T820 574q0-26-2.5-45t-9.5-43H649q3 35 4 53.5t1 34.5q0 22-1.5 41.5T648 665Zm-10-239h150q-33-69-90.5-115T565 246q25 37 42.5 80T638 426Zm-254 0h194q-11-53-37-102.5T480 236q-32 27-54 71t-42 119Zm-212 0h151q11-54 28-96.5t43-82.5q-75 19-131 64t-91 115Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/home.svg b/features/sidebar/resources/home.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M220 876h150V626h220v250h150V486L480 291 220 486v390Zm-60 60V456l320-240 320 240v480H530V686H430v250H160Zm320-353Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/ideas.svg b/features/sidebar/resources/ideas.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M480 976q-34 0-57.5-23.5T399 895h162q0 34-23.5 57.5T480 976ZM318 833v-60h324v60H318Zm5-121q-66-43-104.5-107.5T180 459q0-122 89-211t211-89q122 0 211 89t89 211q0 81-38 145.5T637 712H323Zm22-60h271q48-32 76-83t28-110q0-99-70.5-169.5T480 219q-99 0-169.5 70.5T240 459q0 59 28 110t77 83Zm135 0Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/logout.svg b/features/sidebar/resources/logout.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M180 936q-24 0-42-18t-18-42V276q0-24 18-42t42-18h291v60H180v600h291v60H180Zm486-185-43-43 102-102H375v-60h348L621 444l43-43 176 176-174 174Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/search.svg b/features/sidebar/resources/search.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 96 960 960" width="24"><path d="M781.692 919.076 530.461 667.845q-30 24.769-69 38.769t-80.692 14q-102.55 0-173.582-71.014t-71.032-173.537q0-102.524 71.014-173.601 71.014-71.076 173.538-71.076 102.523 0 173.6 71.032T625.384 476q0 42.846-14.385 81.846-14.385 39-38.385 67.846l251.231 251.231-42.153 42.153Zm-400.923-258.46q77.308 0 130.962-53.654Q565.385 553.308 565.385 476q0-77.308-53.654-130.962-53.654-53.654-130.962-53.654-77.308 0-130.962 53.654Q196.154 398.692 196.154 476q0 77.308 53.653 130.962 53.654 53.654 130.962 53.654Z" fill="#cccccc"/></svg>
diff --git a/features/sidebar/resources/settings.svg b/features/sidebar/resources/settings.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="m388 976-20-126q-19-7-40-19t-37-25l-118 54-93-164 108-79q-2-9-2.5-20.5T185 576q0-9 .5-20.5T188 535L80 456l93-164 118 54q16-13 37-25t40-18l20-127h184l20 126q19 7 40.5 18.5T669 346l118-54 93 164-108 77q2 10 2.5 21.5t.5 21.5q0 10-.5 21t-2.5 21l108 78-93 164-118-54q-16 13-36.5 25.5T592 850l-20 126H388Zm92-270q54 0 92-38t38-92q0-54-38-92t-92-38q-54 0-92 38t-38 92q0 54 38 92t92 38Zm0-60q-29 0-49.5-20.5T410 576q0-29 20.5-49.5T480 506q29 0 49.5 20.5T550 576q0 29-20.5 49.5T480 646Zm0-70Zm-44 340h88l14-112q33-8 62.5-25t53.5-41l106 46 40-72-94-69q4-17 6.5-33.5T715 576q0-17-2-33.5t-7-33.5l94-69-40-72-106 46q-23-26-52-43.5T538 348l-14-112h-88l-14 112q-34 7-63.5 24T306 414l-106-46-40 72 94 69q-4 17-6.5 33.5T245 576q0 17 2.5 33.5T254 643l-94 69 40 72 106-46q24 24 53.5 41t62.5 25l14 112Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/resources/signin.svg b/features/sidebar/resources/signin.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="M480 575q-66 0-108-42t-42-108q0-66 42-108t108-42q66 0 108 42t42 108q0 66-42 108t-108 42ZM160 896v-94q0-38 19-65t49-41q67-30 128.5-45T480 636q62 0 123 15.5t127.921 44.694q31.301 14.126 50.19 40.966Q800 764 800 802v94H160Zm60-60h520v-34q0-16-9.5-30.5T707 750q-64-31-117-42.5T480 696q-57 0-111 11.5T252 750q-14 7-23 21.5t-9 30.5v34Zm260-321q39 0 64.5-25.5T570 425q0-39-25.5-64.5T480 335q-39 0-64.5 25.5T390 425q0 39 25.5 64.5T480 515Zm0-90Zm0 411Z" fill="#fafafa"/></svg>
diff --git a/features/sidebar/script.js b/features/sidebar/script.js
@@ -0,0 +1,205 @@
+if (
+    document.querySelector(
+      "#footer > div > ul.clearfix.footer-col > li:nth-child(3) > ul > li:nth-child(4)"
+    ) !== null
+) {
+    document.querySelector("#content").style.width = "80%";
+    document.querySelector("#content").style.float = "right";
+    document.querySelector("#content").style.right = "0";
+    document.querySelector("#content").style.marginTop = "0px";
+    var navbar = document.querySelector("#topnav");
+    var pageWrapper = document.querySelector("div#pagewrapper");
+    document.querySelector(".dropdown").remove()
+}
+
+if (
+    document.querySelector(
+      "#footer > div > div > dl:nth-child(3) > dd:nth-child(5)"
+    ) !== null
+) {
+    document.querySelector("div.page").style.width = "84%";
+    document.querySelector("div.page").style.float = "right";
+    document.querySelector("div.page").style.right = "0";
+    document.querySelector("main#view").style.marginTop = "0px";
+    var navbar = document.querySelector("#navigation");
+    var pageWrapper = document.querySelector("div#app");
+}
+
+var sidebar = document.createElement("div");
+sidebar.classList = "sidebar"
+pageWrapper.prepend(sidebar);
+navbar.remove()
+
+var links = document.createElement("ul");
+links.classList = "links";
+sidebar.appendChild(links);
+
+CheckLogin()
+
+async function createMenu(name, href, imageLink, id) {
+    var a;
+    var create = document.createElement("li");
+    var createText = document.createElement("p");
+    var createIcon;
+
+    if (imageLink) {
+        createIcon = document.createElement("img");
+        createIcon.src = ScratchTools.Resources[imageLink];
+        createIcon.classList = "createIcon";
+
+        a = document.createElement("a")
+        a.href = href
+        a.width = "inherit", a.height = "inherit"
+    } else if (imageLink == "profile") {
+        createIcon.src = getProfile();
+    }
+
+    create.classList = "create"
+    createText.textContent = name;
+    createText.classList = "createText";
+    links.appendChild(create);
+    if (a) {
+        create.append(a); 
+        if (createIcon) a.appendChild(createIcon);
+        a.appendChild(createText);
+    } else {
+        if (createIcon) create.appendChild(createIcon);
+        create.appendChild(createText)
+    }
+
+    if (id == "top") {
+        create.classList += " top"
+
+        var scratchLogo = document.createElement("img");
+        scratchLogo.src = "https://scratch.mit.edu/images/logo_sm.png";
+        scratchLogo.classList = "SLogo";
+        scratchLogo.onclick = () => {location.href = "/"};
+        createText.remove();
+        create.style.gap = "10px"
+        create.appendChild(scratchLogo);
+        create.onclick = () => {};
+        create.addEventListener("mouseenter", function() {
+            create.style.backgroundColor = "transparent"
+        })
+
+        var create2 = document.createElement("a");
+        var create2Img = document.createElement("img")
+        create2Img.src = "https://scratch.mit.edu/images/nav-notifications.png";
+        create2Img.classList = "img2"
+        create2.classList = "miniCreate";
+        create2.href = "/messages"
+        create.appendChild(create2);
+        create2.appendChild(create2Img);
+
+        var create3 = document.createElement("a");
+        var create3Img = document.createElement("img")
+        create3Img.src = "https://scratch.mit.edu/images/mystuff.png";
+        create3Img.classList = "img"
+        create3.classList = "miniCreate";
+        create3.href = "/mystuff"
+        create.appendChild(create3);
+        create3.appendChild(create3Img);
+    }
+
+    if (id == "search") {
+        createText.remove();
+        create.onclick = () => {};
+        var search = document.createElement("input");
+        create.appendChild(search)
+        search.placeholder = name;
+        search.type = "text";
+        search.classList = "input st";
+        search.addEventListener("keypress", function(event) {
+            if (event.key === "Enter") {
+                event.preventDefault();
+                search();
+
+                function search() {
+                    window.location.href = `https://scratch.mit.edu/search/projects?q=${
+                        document.querySelector("input.input.st").value
+                    }`;
+                }
+            }
+        })
+    }
+
+    if (id == "profile") {
+        createIcon.src = imageLink;
+        createIcon.classList = "createIcon";
+        createIcon.style.borderRadius = "99999px";
+    }
+
+    if (id == "logout") {
+        create.onclick = () => {
+            logOut()
+        }
+    }
+}
+
+createDefault()
+
+async function CheckLogin() {
+    if ((await ScratchTools.Session()).user) {
+        loggedIn()
+        console.log("no")
+    } else {
+        NotLoggedIn()
+        console.log("yes")
+    }
+}
+
+function createDefault() {
+    createMenu("", "", "", "top");
+    createMenu("Search", "", "", "search")
+    createMenu("Home Page", "/", "home", "home");
+    createMenu("Create", "/", "create", "create");
+    createMenu("Explore", "/", "explore", "explore");
+    createMenu("Ideas", "/", "ideas", "ideas");
+    createMenu("About", "/", "about", "about");
+}
+
+async function loggedIn() {
+    var response = await fetch("https://scratch.mit.edu/session/", {
+      headers: {
+        accept: "*/*",
+        "accept-language": "en, en;q=0.8",
+        "sec-ch-ua":
+          '" Not A;Brand";v="99", "Chromium";v="101", "Google Chrome";v="101"',
+        "sec-ch-ua-mobile": "?0",
+        "sec-ch-ua-platform": '"macOS"',
+        "sec-fetch-dest": "empty",
+        "sec-fetch-mode": "cors",
+        "sec-fetch-site": "same-origin",
+        "x-requested-with": "XMLHttpRequest",
+      },
+      referrer: "https://scratch.mit.edu/",
+      referrerPolicy: "strict-origin-when-cross-origin",
+      body: null,
+      method: "GET",
+      mode: "cors",
+      credentials: "include",
+    });
+    var data = await response.json();
+    var br = document.createElement("br");
+    br.style.paddingTop = "60vh"
+    links.appendChild(br)
+    createMenu(data["user"]["username"], `https://scratch.mit.edu/users/${data["user"]["username"]}/`, `https://uploads.scratch.mit.edu/get_image/user/${data["user"]["id"]}_90x90.png`, "profile")
+    createMenu("Account Settings", "/accounts/settings/", "settings", "")
+    createMenu("Log Out", "", "logout", "logout")
+}
+
+async function logOut() {
+    var response = await fetch("https://scratch.mit.edu/accounts/logout/", {
+  "headers": {
+    "x-csrftoken": ScratchTools.cookies.get("scratchcsrftoken"),
+  },
+  "method": "POST",
+  });
+    window.location.href = "/"
+}
+
+function NotLoggedIn() {
+    var br2 = document.createElement("br");
+    links.appendChild(br2)
+    createMenu("Sign In", "/login", "signIn", "signIn")
+}
diff --git a/features/sidebar/style.css b/features/sidebar/style.css
