to many changes to count, not everything works

src/assets/sections-content.ts

@@ -82,6 +82,10 @@ let content: ContentList = {
             type: 'block',
             handler: 'consoleinputblock',
         },
+        {
+            type: 'block',
+            handler: 'storageblock',
+        },
     ],
     client: [
         {
@@ -105,7 +109,7 @@ let content: ContentList = {
             name: 'show notification',
             description: 'shows notification',
             handler: 'shownotification',
-        }
+        },
     ],
 }
 

src/assets/special.json

@@ -1,26 +1,13 @@
 {
     "normal": [
-        "aHR0cHM6Ly9maW5kbXl0dXRvci5pbmZv",
-        "aHR0cHM6Ly9tYXRoLnN1cHBseXNvbHV0aW9uc214LmNvbQ==",
-        "aHR0cHM6Ly9nb3Zlcm5tZW50LnNvdG5hLm9yZy8=",
-        "aHR0cHM6Ly93d3cud2ViYXBwbGljYXRpb24uZGVzaWduLw==",
-        "aHR0cHM6Ly9ub29vLXRoZS5jaHVic2luZmVzdGF0aW9uLmRlc2lnbg==",
-        "aHR0cHM6Ly9hbGdlYnJhLnN0aWNreXJpY2VjYWtlcy5jb20=",
-        "aHR0cHM6Ly9hdXguaG9wLnNoLw==",
-        "aHR0cHM6Ly9nZW9tZXRyeS5oYWNrbnBlcmwuY29t",
-        "aHR0cHM6Ly9lLnBlbnRhZm9uLm5ldC8=",
-        "aHR0cHM6Ly9sZWFybjJpbnZlc3QuaW5mbw==",
-        "aHR0cHM6Ly9kaXNjb3VudC56b25laXRzaG9wLmNvbS8g",
-        "aHR0cHM6Ly9wZWFjZS5jb21wdXRlcnNmb3JwZWFjZS5uZXQv",
-        "aHR0cHM6Ly9tYXRoLnRhbWFyaW5kby5uZXQvIAo=",
-        "aHR0cHM6Ly9lYXJseWJpcmRib251cy5lYXJseXJpc2Vyc2NvZmZlZXNob3AuY29tLyA=",
-        "aHR0cHM6Ly9hbGdlYnJhLnNqdGVjaC5vcmcv",
-        "aHR0cHM6Ly9hbGdlYnJhLnNlbWJpcmluZy5jb20v",
-        "aHR0cHM6Ly9zY2llbmNlLmtkZW5zZS5jb20v",
-        "aHR0cHM6Ly9hbGdlYnJhLmNhbmRjaW5zdXJhbmNlYnJva2Vycy5jb20v",
-        "aHR0cHM6Ly9zZXJ2ZXJzLmgtby1zLXQubmFtZQ==",
-        "aHR0cHM6Ly9tYXRoLmxhbWVsYS10cmFucy5jb20=",
-        "aHR0cHM6Ly9zY2llbmNlLnBhdWxtY2N1bmUuY29t",
-        "aHR0cHM6Ly9nZW9tZXRyeS50cml1dGFtYS5jb20v"
+        "dJ9wCV5pCAMxdJ91gF5sepCyFj==",
+        "CAkzeJ9bCV5pfpIxB29wCZUsBV5xCATN",
+        "BAEzOp15fKYzfKomBZ0xepY0Fj==",
+        "BZQme3YxgF51d2oxgJYmdF5me20N",
+        "fJ0xf3UkepkkfqCoeJzxB29wFj==",
+        "f2QsCZ5mCV5tfqolBl5me20N",
+        "eZI0dF5pdAMofpYrBZLxe3MqFj==",
+        "f2QsCZ5mCV5zhAMkeZondAQrOpQyeTr=",
+        "eZI0dF5pdAMofpYrBZLxe3MqFj=="
     ]
 }

src/constants.ts

@@ -42,14 +42,15 @@ export var GAMESLINK = {
 export const VERSION = 10
 export const ITERATION = 0
 
-export const NAME = 'car trunk'
+export const NAME = 'car axle'
+// please credit if u change the creator
 export const CREATOR = 'penguinify'
 
 export var ENV = 'production'
 if (document.location.hostname.includes('localhost')) {
     ENV = 'development'
-} else if (document.location.hostname.includes('github.io')) {
-    ENV = 'beta ;-;'
+} else if (document.location.hostname.includes('github.io/car-axle-client')) {
+    ENV = 'i hoped this wouldn\'t need to exist -- BETA'
 }
 
 // DO NOT CHANGE UNLESS YK WHAT U DOIN

src/gui/components/maincontent.component.ts

@@ -35,40 +35,28 @@ export class MainContent extends Component {
         this.maincontent.element.animate(
             [
                 {
+                    transform: 'translateY(-10vh)',
                     opacity: 0,
                 },
                 {
+                    transform: 'translateY(0px)',
                     opacity: 1,
                 },
             ],
             {
-                duration: 500,
+                duration: 300,
+                easing: 'cubic-bezier(0,.41,.42,.98)',
+                fill: 'forwards',
             }
         )
 
         setTimeout(() => {
             this.maincontent.element.style.display = 'block'
-        }, 500)
+        }, 300)
     }
 
     public hide(): void {
-        this.maincontent.element.animate(
-            [
-                {
-                    opacity: 1,
-                },
-                {
-                    opacity: 0,
-                },
-            ],
-            {
-                duration: 500,
-            }
-        )
-
-        setTimeout(() => {
-            this.maincontent.element.style.display = 'none'
-        }, 500)
+        this.maincontent.element.style.display = 'none'
     }
 
     public penIt(): Pen<HTMLElement>[] {

src/gui/components/notificationbar.component.ts

@@ -16,7 +16,6 @@ export class NotificationBar extends Component {
 
         this.notificationbar = pens[0]
 
-
         return pens
     }
 
@@ -34,6 +33,7 @@ export class NotificationBar extends Component {
             notification[0].element.animate(
                 {
                     transform: 'translateX(100%)',
+                    opacity: 0,
                 },
                 {
                     duration: 500,
@@ -51,6 +51,7 @@ export class NotificationBar extends Component {
             notification[0].element.animate(
                 {
                     transform: 'translateX(100%)',
+                    opacity: 0,
                 },
                 {
                     duration: 500,

src/gui/components/sidebar.component.ts

@@ -51,10 +51,7 @@ export class Sidebar extends Component {
         section_background[0].setParent(section_navbar.element)
 
         if (ENV === 'development') {
-            let dev_button = new SidebarButton(
-                'develop',
-                ''
-            )
+            let dev_button = new SidebarButton('develop', '')
             let dev_pen: Pen<HTMLElement>[] = dev_button.penIt()
             dev_pen[0].setParent(section_navbar.element)
             this.buttons.push(dev_pen[0])

src/gui/components/statusbar.component.ts

@@ -1,5 +1,6 @@
-import { Component, Pen, getPenFromElementId } from '../../penexutils'
-import { NAME } from '../../constants'
+import { Component, Pen } from '../../penexutils'
+
+var maximized = false
 
 export class StatusBar extends Component {
     constructor() {
@@ -11,16 +12,113 @@ export class StatusBar extends Component {
             Pen.fromHTML(`
             <div id="app-status" class="rounded-md">
                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM184 232H328c13.3 0 24 10.7 24 24s-10.7 24-24 24H184c-13.3 0-24-10.7-24-24s10.7-24 24-24z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM192 160H320c17.7 0 32 14.3 32 32V320c0 17.7-14.3 32-32 32H192c-17.7 0-32-14.3-32-32V192c0-17.7 14.3-32 32-32z"/></svg>
                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z"/></svg>
             </div>
         `) || []
 
+        let header = pens[0].element
+
+
+        header.addEventListener('mousedown', (e) => {
+
+            let app = document.getElementById('app-fuk-u')
+            if (!app || !header) {
+                return
+            }
+            // makes sures it not clicking something on the header
+            if (e.target !== header) {
+                return
+            }
+
+            e.preventDefault()
+
+            let event = e as MouseEvent
+
+            let shiftX = event.clientX - app.getBoundingClientRect().left
+            let shiftY = event.clientY - app.getBoundingClientRect().top
+
+            moveAt(event.pageX, event.pageY)
+
+            app.animate(
+                {
+                    opacity: [1, 0.9],
+                },
+                {
+                    duration: 200,
+                    easing: 'ease',
+                    fill: 'forwards',
+                }
+            )
+
+            function moveAt(pageX: number, pageY: number) {
+                if (!app || !header) {
+                    return
+                }
+
+                app.style.left = pageX - shiftX + 'px'
+                app.style.top = pageY - shiftY + 'px'
+            }
+
+            function removeListeners() {
+                if (!app || !header) {
+                    return
+                }
+
+                app.animate(
+                    {
+                        opacity: [0.9, 1],
+                    },
+                    {
+                        duration: 200,
+                        easing: 'ease',
+                        fill: 'forwards',
+                    }
+                )
+
+                document.removeEventListener('mousemove', onMouseMove)
+                document.removeEventListener('mouseup', removeListeners)
+
+                if (app.getBoundingClientRect().top < 0) {
+                    app.style.top = '0px'
+                }
+            }
+
+            function onMouseMove(e: MouseEvent) {
+                moveAt(e.pageX, e.pageY)
+            }
+
+            document.addEventListener('mousemove', onMouseMove)
+
+            document.addEventListener('mouseup', removeListeners)
+        })
+
+
         pens[2].element.addEventListener('mousedown', () => {
             let element = document.getElementById('app-fuk-u')
             element && (element.style.display = 'none')
         })
+
         pens[4].element.addEventListener('mousedown', () => {
             let element = document.getElementById('app-fuk-u')
+
+            if (element) {
+                if (!maximized) {
+                    element.style.left = '0px'
+                    element.style.top = '0px'
+                    element.style.width = '100%'
+                    element.style.height = '100%'
+                } else {
+                    element.style.width = '80%'
+                    element.style.height = '80%'
+                }
+
+                maximized = !maximized
+            }
+        })
+
+        pens[6].element.addEventListener('mousedown', () => {
+            let element = document.getElementById('app-fuk-u')
             element && element.remove()
         })
 

src/handlers/client/tabcloak.ts

@@ -12,7 +12,6 @@ async function changePageTitle(title: string): Promise<void> {
 }
 
 async function changePageFavicon(url: string): Promise<void> {
-    // remove old favicon
     let oldFavicon = document.querySelector('link[rel="icon"]')
     oldFavicon && document.head.removeChild(oldFavicon)
 
@@ -52,18 +51,21 @@ function createPresets(parent: Pen<HTMLElement>): Pen<HTMLElement>[] {
     return pens
 }
 
-function loadSave(): void {
+function loadSave(titleinput: Pen<HTMLInputElement>, faviconinput: Pen<HTMLInputElement>): void {
     let title = getStringFromLocalStorage('cac-tabcloak-title')
     let favicon = getStringFromLocalStorage('cac-tabcloak-favicon')
 
+    titleinput.element.value = title
+    faviconinput.element.value = favicon
+
     title && changePageTitle(title)
     favicon && changePageFavicon(favicon)
 }
 
 function Block(content: Pen<HTMLElement>[]): Pen<HTMLElement>[] {
     let pens = Pen.fromHTML(`<div>
                            <h1 class="divider">Tabcloak</h1>
-                           <h2>Page Title and Page Icon</h2>
+                           <h2 class="divider">Page Title and Page Icon</h2>
                            </div>`)
     pens[0].setParent(content[0].element)
 
@@ -91,7 +93,7 @@ function Block(content: Pen<HTMLElement>[]): Pen<HTMLElement>[] {
     pens.push(...pageFaviconInput.penIt())
     pens.push(...createPresets(pens[0]))
 
-    loadSave()
+    loadSave(pageTitleInput.pens[1] as Pen<HTMLInputElement>, pageFaviconInput.pens[1] as Pen<HTMLInputElement>)
     return pens || []
 }
 

src/handlers/dev/shownotification.ts

@@ -1,4 +1,3 @@
-
 import { notificationbar } from '../../gui/app'
 import { HandlerDefinition } from '../../types'
 

src/handlers/games/gameslink.ts

@@ -39,7 +39,7 @@ function Block(content: Pen<HTMLElement>[]): Pen<Elements>[] {
                 handler: changeGameLink,
             },
             {
-                'Normal Links': ['default link'],
+                'Normal Links': ['default link (CURRENTLY DOESNT WORK, CHANGE THE LINK)'],
                 'Other Links': GAMESLINK.alternate_links.map((link) => link.display),
                 'Deprecated Links': GAMESLINK.deprecated_links.map((link) => link.display),
             }

src/handlers/pocketbrowser/proxies.ts

@@ -5,10 +5,19 @@ import { Dropdown } from '../../gui/components/content/dropdown.component'
 import { Pen } from '../../penexutils'
 import { HandlerDefinition, Proxies } from '../../types'
 
+function moveLetter(letter: string, shift: number) {
+    let alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/='
+    if (letter.match(/[A-Za-z]/)) {
+        const start = letter === letter.toUpperCase() ? 'A'.charCodeAt(0) : 'a'.charCodeAt(0)
+        return String.fromCharCode(start + ((letter.charCodeAt(0) - start + shift) % 26))
+    }
+    return letter
+}
+
 export function switchProxy(url: string) {
-    url = atob(url)
-    console.log(url)
-    // checks if the url is valid
+    let test = url.split('').map((letter) => moveLetter(letter, -3))
+    notificationbar.showNotification('Proxy Switched', `Switched to ${test.join('')}`)
+
     if (!url.startsWith('http')) {
         notificationbar.showNotification('Invalid Proxy', 'The proxy url is invalid')
         return

src/handlers/webtools/input.ts

@@ -10,12 +10,12 @@ function handleConsoleInput(input: string, input_element: HTMLInputElement) {
 
 function Block(content: Pen<HTMLElement>[]): Pen<Elements>[] {
     let pens = Pen.fromHTML(`<div>
-                           
+                                    <h1 class="divider">js runner</h1>
                            </div>`)
 
     pens.push(
         ...new Input(
-            pens[0],
+            pens[1],
             {
                 type: 'input',
                 id: 'consoleInput',