SECURITY.md

To-Do

---

• Currently working on

---

• Pages + Functionality

  • Visualizer

    • Get mp3 to play
    • Get mp3 to pause
    • Better styles for the button
    • Volume slider
    • Volume slider --> range/progress bar
    • Lenght of music visualized --> progress bar

    --> musializer todo is moved over to dev branch

    • Particles instead of waveform

    https://www.twilio.com/en-us/blog/audio-visualisation-web-audio-api--react https://github.com/TylerStanish/electron-audio-visualizer

    • Volume slider --> https://codesandbox.io/p/sandbox/framer-motion-animate-on-state-update-ns67ib?file=%2Fsrc%2Fcomponents%2FInput.tsx&from-embed=

  • Cube

    • Add more stuff

  • Switches

    • Vertical switch: add friction to make it snap to top or bottom, reverse in other half

  • More examples

    • Matrix https://github.com/abishekvashok/cmatrix

    • Pipes https://github.com/pipeseroni/pipes.sh

    • Cava (Audio visualizer) https://github.com/karlstav/cava

    • Scrolling lock thing

    • Sliders (?)

    • Idea: play with friction/resistance of slider based on position

    • Add more inspiration gifs

  • Ball

    • Add a reference for pull direction/pull strenght
    • calculate trajectory mode, + button to turn it on/off
    • Ball --> add a randomize button to randomize hoop position

  • Tether

    • Make tethers interact with eachother
    • Tether effects on drag
      • changes in color the further the drag?
    • [ ]

• Styles + Design

• General/QOL

• Low priority

  • Fix lefthalf and righthalf transition spinner

  • Consistent fps

  • fix DOM cant find darkmodeToggle when it starts on canvas page

  • Page transitions --> https://vuejs.org/guide/built-ins/transition.html

  • Hot Reloading shit

    • Hot Reloading: Things to do: - completely remove "webpack.paths.ts" and replace with "path.resolve"

      Things to try out: - ts-node/register/transpile-only - cross-env - NODE_ENV=development - "cross-env NODE_ENV=development TS_NODE_TRANSPILE_ONLY=true webpack serve --config ./.erb/configs/webpack.config.renderer.dev.ts"

---

---

Done

• Cube

  • Reset perspective when mouse is outside of box
  • Cube: add "motions" --> "swipe left" to turn it 180 degrees, "swipe up" etc

• Spinner

  • Figure out if possible
  • Mousewheel
  • Add velocity and friction
  • Add lefthalf and righthalf** for scrolling
  • Fix lefthalf and righthalf dragging/set reference to actual center(?)

• Particles

  • Figure out why mouse isnt at center
  • Fix font not displaying
  • Fix canvas size

• Button

  • Smoother animations
  • some toggle buttons
  • button1 correct light mode colors
  • Effects onpress

• Tethers

  • Figure out inconsistency with damping and stiffness --> initscene called twice on window resize
  • Add actual tether

• Ball

  • Prototype 2d basketball thingy
  • Reset button in the center of screen + bigger
  • Ball start position from wherever the mouse is down?
  • Add a hoop
  • Ball --> calculate bounding box correctly
  • Ball: dont "spawn" ball when click in navbar area

• Switches

  • add a "manual" switch instead of click switch
  • More designs
  • Better style 3 segment
  • Vertical switch: make it "snap" to points
  • Vertical switch: add lines for segments

• Logo

  • Fix/Design better logo
  • Preview for ReadMe
  • Center on page

• General/QOL

  • Fix content centered in the middle of screen
  • Working darkmode toggle
  • Factor out Navbar into react component instead of on the index.html
  • properly align icons in the navbar
  • Figure out why settings button is not working on homepage
  • Reload the canvas pages when darkmodetoggle
  • Remove settings and replace with darkmode toggle instead
  • Add settings button next to "ui-box" title
  • Scale up active element in navbar/remove padding

• Github pages

  • Github actions to automatically push to gh-pages branch
  • Fix position of ball and particles
  • Fix particle sizes --> not depending on screen size

• Joystick

  • Add some keyboard page with wasd
  • Joystick --> mouse and keyboard seperately
  • Joystick: Reset mouse position on keyboard press

• Navbar & Menus

  • Indicate what page is active
  • Navbar better style
  • Icons instead of text

• Low priority

  • Fix keyboard not resetting onmousedown joystick
  • Navbar Tab styles --> https://github.com/adamschwartz/chrome-tabs/tree/gh-pages