SpotOn

SpotOn, a browser extension for Spotify. Including full custom toggles and user settings! For more info check out the README.md! Happy Spotting!

OTHER License

Stars
50

Bot releases are hidden (Show)

SpotOn - Version 3.0.3.5 Latest Release

Published by SenpaiHunters 7 months ago

Changelog - 2/4/2024

Significant optimizations and bug fixes have been implemented. Detailed changes are as follows:

  • Manifest updated to version 3.0.3.5.
  • JavaScript file structure and codebase streamlined:
    • The options folder has been removed; settingsDown.js is now located in the settings folder.
    • Consolidated toggle.js and contents of the shared folder into a single file themeToggles.js within the settings folder.
    • Enhanced theme settings functionality, particularly the 'Auto' feature, and resolved related bugs.
    • Refined the extension's enabled state logic for improved performance.
    • Resolved an issue in import.js to ensure reliable importing of user settings.
    • Conducted code optimization for settingsOptions.js, settings.js, search.js, locals.js, and background.js.
    • Corrected a defect affecting the lyrics color display.
    • Improved code formatting across several files for better readability and maintenance.
    • Addressed various minor bugs to enhance overall stability.

I may add each release to the release tab, instead of only doing major releases, minor bug fixes, i may only add to the readme..... we'll see.

Auto-generated Changelog:

Full Changelog: https://github.com/SenpaiHunters/SpotOn/compare/V3.0.2...V3.0.3.5

SpotOn - V3.0.2

Published by SenpaiHunters 8 months ago

Enhanced the code by adding missing variables, updated the version, removed a default feature, and fixed a bug related to the white color in SpotOn.

Accidentally pushed the wrong branch... I'm so sorry about this.

Also, fixed bugs and added stuff I forgot.

What's Changed

Full Changelog: https://github.com/SenpaiHunters/SpotOn/compare/V2...V3.0.2

SpotOn - SpotOn Version 3

Published by SenpaiHunters 8 months ago

What's Changed

Greetings everyone!

SpotOn V3 is out. Here is the massive changelog that will take me ages to write. By the time you read this, both the Chrome Web Store and SpotOn here will have been updated.

Changes

Optimization was the main focus: speed, optimization, and UI/UX. I'm happy to say that this has been succeeded.

Optimsation

TL:DR: Every file has had a change of some sort

Sizing

  • Initial size: 512 kB
  • Final size: 172 kB
  • Difference: 512 kB - 172 kB = 340 kB
  • Optimization percentage: (340 kB / 512 kB) * 100 ≈ 66.41%
  • Changed number: 340 kB

Speed

SpotOn load times have been improved from the previous times of 5ms/15ms at some points to a speed of 1ms. If you're lucky, you could see even less than that! This improvement is due to a significant optimization in how SpotOn loads and interacts with the page.

At its best:

  • Previous load time: 15 ms
  • New load time: 1 ms
  • Difference: 15 ms - 1 ms = 14 ms
  • Improvement percentage: (14 ms / 15 ms) * 100 = 93.33%
  • Changed number: 14 ms

Generalised:

  • Average difference: (4 ms + 14 ms) / 2 = 9 ms
  • Improvement percentage: (9 ms / 15 ms) * 100 ≈ 60%
  • Changed number: 9 ms

This is just SpotOn load times, when refreshing the page, you will now see faster rendering, and when skipping songs, there will no longer be that annoy lag.

Here is the repo size changes:
Size changes

  • Red indicates: Removal.
  • Blue indicates: Changes.

The differences, both in numbers and percentage, are as follows:

  • background.js decreased by 46kb (76.67% reduction)
  • folder CSS decreased by 59kb (86.76% reduction)
  • folder Icons decreased by 1kb (33.33% reduction)
  • manifest.json decreased by 1kb (33.33% reduction)
  • folder Options decreased by 53kb (45.69% reduction)
  • settings.html increased by 1kb (4.55% increase)
    • The increase in settings.js is due to options.html being included in it as well

The total removal is 160kb.

The total removal in kilobytes (kb) is as follows:

  • color.html: 3kb
  • colorHistory.html: 3kb
  • colorOptions.html: 6kb
  • download.html: 21kb
  • options.html: 5kb
  • folder Themes: 73kb

The total removal is 111kb.


File changes - Removal / Additions


Additions

  • Did you know, you can press a header to collapse it?
  • Completely redesigned the main popup page, along with associated JS and CSS, and improved functionality.

Additions / New Features

Theme Locking

A pretty heavily requested feature, allow the SpotOn theme to be locked, this is now fully in effect, and the first thing you'll see when loading into SpotOn, if the theme ever freezes unlock theme will force a state change, if that again does not work, a simple reload will fix it all!


Mini song player

I have drafted several options, including a standalone player menu (which I may add to a future stats website!). However, I decided to go with a small one that updates every time you open SpotOn. Additionally, I added a "Copy Track Info" feature, allowing me to easily copy the song name to the clipboard. I also included a "Search on Genius" option for when Spotify does not have the lyrics, as well as a "Download Album Art" feature. This feature has replaced the original button on the NPB and is now optimized. It downloads all album arts regardless of the situation and does not require a reload to function.

Wanna see that draft?

SpotOn Player

all JS

It's built in JS pretty nice, anyway, back to SpotOn!!


Custom CSS

The Spotify popup has undergone a complete overhaul and now exists as a single page that encompasses everything. The following features have been added:

  • You can now utilize custom CSS to create your own SpotOn themes or import themes from the official SpotOn Themes repository: SpotOnThemes.
  • By default, all of SpotOn's original themes are imported into the editor.
  • To fetch any new changes to the theme repository, simply press the "Check for New Themes" button.

Images

As evident from the array of buttons, you have numerous options at your disposal. Additionally, the Themes repository provides CSS examples and walkthroughs that can serve as a foundation for your own CSS.


Translator

translation

I was really debating whether to include this drafted feature or not. However, I decided I would, so here we are! After hours of improving and optimising, it's now live. You can change the color of the lyrics too, if you please. We also have an auto translator feature.


Settings

Now, we have a small little settings section, by pressing the cog on the left of the header, you can find the following

  • In Import/Export you can import or export any of your SpotOn settings, this will include all CSS themes, and non coded themes, like we had before, now under "Visual Editor"

In addition to the importing and exporting of settings, we have a new theme picker for how SpotOn will look. In this example, I'm using the Dark theme. We also have Dark, Gray, and Light themes, as well as Auto. Auto will be the default, so hopefully, if you're on a dark theme, you won't see a flashbang when loading into SpotOn. It will fetch your device theme and dynamically change the theme based on your device's mode. Then you have your manual modes.

If you have any suggestions on what else to include, shoot me a message!


Development

Added a small development section where you can see some stats. It's pretty barebones for now, but it's where I'll put some hidden options or toggles in later!


Keybinds

keybinds

When Nav toggle is enabled, added the option to use keybinds for toggling the sidebar and npb

URL: chrome://extensions/shortcuts


Notable mention: When you right-click, you have a few options under SpotOn, such as going to the current Spotify tab, opening a playlist, or closing the current tab. When you highlight some text, you can then use that text to search for the song on Spotify as well!


Removal

  • Removed all of the color tools. This was not used when I asked my 40 BETA testers. It was removed for speed and weight.
  • Removed all previous mentions of theming and opted for custom CSS.
  • Full options changes:
    • Red indicates removal.
    • Blue indicates changes.
    • Green indicates additions.

file opt

file opt

  • Totalized size already calculated above.

Bug Fixes

  • Fixed a long-standing bug where media keys were not reassigned.
  • Fixed a bug where you could not skip a song.
  • Fixed a bug where keybinds would not be registered.
  • Fixed a bug where hotkeys would sometimes double skip.
  • Fixed a bug where reloading the extension would reset the options to defaults.
  • Fixed a multitude of bugs inside the options folder.
  • Fixed the nav hider not working.
  • Fixed non-highlighting failing to add.
  • Fixed an issue where the font would not be added to the npb.
  • Fixed an issue where album art would not be rounded.
  • Fixed a bug where you'd be asked for SpotOn to access a site, even when it wasn't scoped.
  • Fixed a small error when searching; the text would still be highlighted.
  • Fixed an annoying issue when reloading SpotOn would randomly reset all toggles.
  • Resolved an issue with extra padding when toggling the sidebar.
  • Fixed an annoying problem where options would randomly appear on an unaccepted page (this was in response to bug 11).
  • Rewrote the code for saving options and using toggles.
  • Fixed a small CSS issue on some pages when loading.
  • Fixed a JS error causing a memory leak when SpotOn was enabled for a long period of time and checking for updates (this had to do with Spotify's vendor~web-player.da5d0645).
  • Removed nav bar styling and opted for only changing lyric colors, font, and bar colorings.
  • Fixed a multitude of padding issues.
  • Removed some defaults when first installing, notably rainbow controls; this would slow down lower-performing machines by an excess of 8.4%.
  • Fixed an issue where SpotOn would pause when you went to a new Spotify tab.
  • Fixed an issue where you could not see any connections in the music player.
  • Fixed a lot of CSS issues... I mean a lot...
  • Then fixed more issues, but this was midway through development, so I won't note them!

Ending notes

SpotOn V3 has taken me a while—from new features to bug fixes. Unfortunately, I am now sick. I wish I had posted this 15 days ago, but time is running out. I do have more plans and will continue maintaining SpotOn. However, I am currently out of ideas. I have already rewritten it six times, from V2 to V3, and I can't optimize it any further.

This project has made me nothing still, but if you find use in it, that's good enough. I'm always happy to hear your feedback!

If you'd like to make some themes for SpotOn, share them in the new repository under a pull request!

I have spent over 3 months working on this; hopefully, there won't be any bugs!

If you'd like to support the development of SpotOn, you can find some links here:

I will now go to bed and wake up, editing this if there are any new features or if I missed something. This took an hour to write.

SpotOn - SpotOn V2

Published by SenpaiHunters about 1 year ago

What's Changed

Full Changelog: https://github.com/SenpaiHunters/SpotOn/compare/V_1.5...V2

SpotOn - V 1.5

Published by SenpaiHunters over 1 year ago

Release V1 Full Changelog and Feature List

Quick look:

SCR-20230612-bqva

Features (New and Improved)

  • Added new toggle options (in beta)

  • Full redone of SpotOn code #28

  • It's now super easy to edit SpotOn to your tastes without needing knowledge in css or js~

    • See customisation below
  • Reduced code size from 413kb to 268kb, resulting in a decrease of 35.12%

  • Introduced inbuilt SpotOn Righter, which can be toggled on/off (only inside js for now)

  • Reduced image sizes for improved performance

  • Revamped popup.html and added a new popup design

  • Restructured and reformatted code, removing unnecessary parts

  • Moved the streaming to devices bar inside the Now Playing Bar

  • Redesigned the Hotkeys panel

  • Redid the design of artist page

    • Small visual changes, scrolling hides the artists cover etc
  • Enhanced toggle.js code

  • Temporarily removed the scrollbar

  • Removed borders on multiple elements

    • Quick search (command + k) and been improved now
  • Animations now play smoother

  • Hovering looks better, with a smooth fade in

  • Subtext for songs, like albums are now a sorta grey color, looks better now

  • Added additional customisation options to tailor SpotOn to individual preferences

    • Note: Toggles will be added in the future (visible but non-functional), for now, customisation requires editing SpotOnMain.js
    • Customisation options include:
  • Nav bar & Now playing bar customisation:

    • --now-playing-color:
    • --nav-bar-color:
    • --bg-img:
    • --song-color: white;
    • --album-art:
  • Hiders:

    • --hide-song-date:
    • --hide-song-numbering:
    • --hide-song-dura:
    • --hide-song-album:
    • --hide-song-heart:
    • --hide-top-infbar:
    • --hide-profile-icon:
  • Lyrics:

    • --lyrics-color:
    • --lyrics-font-size:
  • Progress bar settings:

    • --progress-bar--background-color:
    • --progress-bar-dot-color:
    • --playback-duration-color:
  • And more to come in future updates

Change Log

  • Significantly improved SpotOn script load times from around 5 seconds to 2 seconds
  • Removed unused style.css, transferring necessary parts to other files
  • Fixed the toggle button inside popup.html
  • Completely overhauled SpotOn code, resulting in a 35.12% decrease in size
  • Resolved numerous bugs and glitches
  • Enhanced the speed of toggle.js
  • Implemented folder organisation to improve code maintenance
  • Rectified spacing issues in toggle.js
  • Addressed memory usage overload and optimised resource usage
  • Fully eliminated the function node for extra SpotOn CSS
  • Fixed rainbow controls to properly apply effects to items like the library button
  • Resolved issues with 4k monitor support
  • Fixed overscroll problem (again)
    • Fixed another infinite scroll issue (this was pretty fun, I could scroll forever!)
  • Corrected problems with lyric auto-scrolling
  • Resolved an issue in manifest.json that caused installation difficulties for some users
  • Fixed the footer display issue
  • Eliminated instances of the Spotify logo reappearing
  • Ensured proper hiding of the install app button
  • Corrected multiple spacing issues
  • Improved skipping times and overall hotkey speed
    • For maximum speed (approximately 2 seconds faster), removing the rainbow controls is recommended
  • Fixed homepage functionality
  • Addressed multiple spelling errors and code-related issues
  • Fixed font and spacing issue on song art, and other large areas
  • Fixed multiple hovering issues
  • Fixed numbering on songs
  • Fixed the play/pause icon's uglyness
  • Fixed a bug with the new UI where SpotOn wouldn't work

TLDR:

Fixed a lot, added a lot, Improved a lot, sleep now

SpotOn - V 0.7

Published by SenpaiHunters over 1 year ago

Release Notes

0.7

In this version there has been a lot of changes, for all browsers. I mean a lot, close to a week of solid work, mostly to get some features to work then spotify went down, so that was cool. Anyway, release notes are as follows.

New Features:

  • Added ability to click on the icon of an album and add it to the Queue, Go to playlist radio, Add to profile, Report, Remove from Your Library, Exclude from your taste profile, and About recommendatiations.
  • Added lines for album sorting, however, this is not yet implimented.
  • Redid Genius Intergration's options menu, added the icon to be constant now, ability to copy the lyrics shown
  • Hotkeys got a speed increase!
  • Redid the connect to a device, changed colour of the play icon for arc browsers (fallback for other browsers too)
  • Rounded the popup menu (right-click menu i mean).
  • Faster transisions! Woo, 0.3 secoonds... Still faster..
  • Rounded the current playing song, and added another animation for it. Just to distinguish it faster than normal songs
  • When highlighting over a song it will pop-out further, this in align with the roundede current playing song makes it flow better
  • Reduced the size of code (now less than 700kb)
  • Added more Rainbow controls and menus, try and find them all!
  • Added a faster way of loading and ability to backtrack ⌘ + → or ⌘ + ←

Bug fixes

  • Fixed the overscrolling Issue
  • Fixed random song stopping
  • Fixed an issue when loading Spotify in another tab or device the current song would pause or cause the page to freeze
  • Fixed text spacing on h1 contexts, like Liked Songs, now at the start and not to the end of nowhere
  • Fixed an issue causing the content menu to not be hidden.
  • Fixed an issue that caused lyrics to scroll further then needed.
  • Fixed an issue that prevented scrolling lyrics.
  • Removed outdated code lines, adding more context to the lines.
  • Adressed an issue that prevented the Nav bar to not hide when pressing the hidden bar.
  • Fixed a bug causing constant crashing and spooling
  • Fixed an issue causing some users a need to relog in to their spotify account each time they reloaded the page
  • Fixed an issue causing hotkeys to not function when pressing the intended keys.
  • Adressed the issue of poor readability on the explicit (that e at the bottom of the songs)
  • Fixed the horrid look of 'now streaming to', should be better now.
  • Fixed an issue preventing some users access to their library
  • Fixed an issue of not being able to fully scroll on larger displays
  • Added better support for larger displays
  • Adressed an issue causing high cache use in Genisu Lyric Searches (you can now remove the Cache by pressing remove cache)
  • Adressed an issue on non chromium browsers not being able to access anything on their screen.
  • Fixed an issue that caused Firefox to not render the background
  • Adressed an issue of crashing on low end hardware due to a memeory leek (this was also partial to a program the user was running in the background, but now there should be no chances of crashes)
  • Fixed the slow loading times when reloading the page or moving to an album

Extra notes

This is one of my biggest updates in a long time, thank you to those who reported a bug and provided information when requested, thank you to everyone who downloads SpotOn, I hope you enjoy it, I'm making 0 pennies off SpotOn so any support is much appericated. Feel free to reach out to me on my socials or launch an issue on GitHub.

  • Kami
SpotOn - V 0.6

Published by SenpaiHunters over 1 year ago

Release Notes

  • Hide the Nav Bar
  • Updated rainbow elements (now includes more, find them all! -- Right click & some info pages for example)
    • Right click
    • Hover
    • Play/Pause
    • Info pages (like 'more info')
    • Sound icon now is rainbow
      • More
  • Lyrics match screen size and auto fit to the middle of the screen
  • Cleaned some lines of code
  • Bug fixes
    • Fixed the issue where some elements displayed pure black
    • Removed an error when reloading
  • Almost all elements are now transparent.
    • They now match the background
  • Improved support for 4k monitors
  • Added more info into the description
  • Removed the green 'play/pause' button
    • It is now rainbow + only displays the state, with no border.
  • Removed a UI error, causing freezing
  • Hotkeys improved
  • Added more animations
  • Changed the now playing bar colour to pink (matches nav bar)
  • Decreased transition load times for background
  • And more I'm probs missing..
    (now time to update photos in the Wiki/Features)
SpotOn - V 0.5.6

Published by SenpaiHunters almost 2 years ago

This release fixes

  • Menu bar fading error, where the end wasn't fully matching the rest of the bar.
    • Same with now playing bar
  • Fixed a loading error
  • Removed unneeded code (old/outdated)
  • Fixed now playing bar lyrics and queue not being rainbow

New features/changes

  • Redid the scrollbar
  • Rounded all album covers by 10px
  • Changed all menus to be semi-transparent
    • These are the 'Profile', 'Right-Click', 'Hotkey', 'Quick Search', and a few others
  • Added all album cover art when first loading to spin
    • This has no performance loss; only visual
  • Liked Songs album cover (off to the left) now matches the now playing bar
  • Adds support for 4k monitor sizes

Stay tuned for more!!

SpotOn - V 0.5.2

Published by SenpaiHunters almost 2 years ago

Spotify wide Hotkeys!

Added in V 0.5.2, this update now has hotkeys for all areas of Spotify.

- NOTE: The Hotkeys shown are for MAC! They should work for windows simply by pressing Control instead of Command, and Alt instead of Option.

Keys on Mac VS. Windows

⌥ (Option) - (Windows Ctrl)

⌘ (Command) - ( Windows Alt)

Basic Shortcuts

Playback Shortcuts

Navigation Shortcuts

Layout Shortcuts

Quick Search Bar

SCR-20221212-ojw

More to come at a later date!!!

SpotOn - V 0.5

Published by SenpaiHunters almost 2 years ago

Visual improvements

Dark background

Light background

A new mode!!!

In this new mode, the now playing bar at the bottom no longer is hidden!

Genius integration now auto searches for the song when going to the next song.

  • NOTE Having this open will reduce song loading speed if you have a lot going on in the background
  • To enable this, simply press the 'Hide Lyrics' then reopen the lyrics by pressing the 'G' on the top right. (Pic for ref)

Bug fixes

  • Ironing out Genius integration with Spotify + Fonts. As well as 'Options'.
  • Menu bar and now playing bar has increased readability.
  • Text is easier to read.
  • Copying links are now faster
  • Fixed several padding issues
  • New colour on highlight!

Some things to note

With the release of V0.5, users on low-end software might encounter a slight performance drop. But! I've tested it on the lowest of hardware and it's not really noticeable, unless you reload the Spotify page every single second, sometimes the images won't change, and for that to fix itself simply skip the song back and forwards.

Addition of light weight SpotOn

This has got many features, but is intended for low performance hardware. The performance difference between the 3 different 'SpotOn's are about 0.43% Performance gain. So, it won't be getting looked at, nor will have any good features.

Addition of SpotOn - (non hidden now playing bar)

In this new mode, the now playing bar at the bottom no longer is hidden!

SpotOn - V 0.4

Published by SenpaiHunters about 2 years ago

V 0.4 is out! Featuring:

No Spotify Lyrics? Then Let's Check Genius! Neatly hidden away until you want it!

To enable it do follow this Step-By-Step!

  1. Click on Tampermonkey (or any userscript)

Click on Tampermonkey

  1. Click on "No Spotify Lyrics? Then Lets Check Genius! Show Lyrics"

SCR-20221016-l5

  1. It'll automatically load in, with the current playing song with the lyrics if Genius has it.

SCR-20221016-lc

  1. To hide the sidebar, either reload, or press 'hide'.
  • If it's not auto loaded (1 sec of time) to the next lyrics press 'Wrong Lyrics'
    • It'll bring you back to the search, if neither Genius nor Spotify has the lyrics it'll say "Lyrics not found'
    • If you reloaded repeat steps 1 & 2

SCR-20221016-lj

  1. If you press 'Hide' you'll see a little Genius Button cleanly off to the right
    • If you reloaded repeat steps 1 & 2 for the button to come back.

SCR-20221016-ln

More that comes with 0.4

Copy track information

  • That being the name of the song and the artist

Imbedded into Spotify's Menu!

Imbedded right into Spotify's Menu

A clean copy box shows up!

A Imbedded box

More updates

  • Mics performance updates
  • Added more information on code lines
  • Fixes text alignment
  • Removes Podcasts (Take a while on low end hard-ware / 2-4 seconds)
  • Addresses an error when loading/reloading, while another Spotify tab is open
  • Updated song timings (Some song delays fixed - both for non-SpotOn users, and SpotOn users)
    • An example of this is, lyric timings now match with what is being sung
  • Site-wide increased readability
SpotOn - V 0.3

Published by SenpaiHunters about 2 years ago

Update 0.3 includes

  • A rainbow colour options in the menus?!
    • This includes all text, and icons, it's only turned on within the Now Playing Bar
  • New background options, a shifting rainbow!
    • This is turned off by default
  • Removal of Spotify's top Logo
    • This can be reversed
  • Removal of annoying footer note
    • This can be reversed
  • Quality of life improvements
  • More entries added
SpotOn - V 0.2

Published by SenpaiHunters about 2 years ago

Version 0.2

Bugs fixes and other preformance updates.

A redesigned NPB (now playing bar) which is now fully customisable!
A fix for when Spotify needs to reload an error would occur.
Fixed an error where the menu bar would fail to load.
Fixed an error in the code line, causing slow performance on low-end hardware.