diff --git a/.vscode/settings.json b/.vscode/settings.json
index e8b18e1..9e03ef9 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -5,7 +5,14 @@
         "ckeditor",
         "easings",
         "linebreak",
-        "musicplayer"
+        "musicplayer",
+        "musicplaylist",
+        "nextbtn",
+        "pathetique",
+        "playbtn",
+        "prevbtn",
+        "Rosen",
+        "syncdir"
     ],
     "javascript.preferences.importModuleSpecifierEnding": "js",
     "html.format.wrapLineLength": 0,
diff --git a/src/mapping/dimensions.js b/src/mapping/dimensions.js
index 6987677..076e334 100644
--- a/src/mapping/dimensions.js
+++ b/src/mapping/dimensions.js
@@ -1,4 +1,4 @@
-import VisualizerUpdateManager from "../visualization/VisualizerUpdateManager.js";
+import VisUpdateRouter from "../visualization/VisUpdateRouter.js";
 import { mapBinNumerical, mapRangedAvgNumerical } from "./numeric.js";
 
 
@@ -11,11 +11,11 @@ import { mapBinNumerical, mapRangedAvgNumerical } from "./numeric.js";
  * @param {number} conf.growUpper The upper limit of the width.
  * @param {string} conf.unit The unit the upper and lower bounds are measured in.
  * @param {number} conf.lowerBin The lower boundary of bins to be mapped (or the single bin to be mapped if the upper bin is undefined).
- * @param {VisualizerUpdateManager} conf.visUpdateManager The visualizer update manager to be mapped to.
+ * @param {VisUpdateRouter} conf.visUpdateManager The visualizer update manager to be mapped to.
  * @param {interpolator} conf.interpolator The interpolation function to be used to transition from one value to the next.
  * @param {number} [conf.upperBin] The upper bin or undefined, which results in mapping to a single bin.
  * @param {boolean} [conf.reversed=false] If true, then high amplitudes are mapped to lower values and vice versa.
- * @returns {{bin: number, listener: VisualizerUpdateManager.visualizerBinUpdateListener}|{lower: number, upper: number, listener: VisualizerUpdateManager.visualizerRangedUpdateListener}} The listener that was added (ranged if an upper bound was provided, binned otherwise).
+ * @returns {{bin: number, listener: VisUpdateRouter.visualizerBinUpdateListener}|{lower: number, upper: number, listener: VisUpdateRouter.visualizerRangedUpdateListener}} The listener that was added (ranged if an upper bound was provided, binned otherwise).
  */
 function mapWidth({ element, growLower, growUpper, unit, lowerBin, visUpdateManager, interpolator, upperBin = undefined, reversed = false }) {
     const getter = () => element.style.width;
@@ -49,11 +49,11 @@ function mapWidth({ element, growLower, growUpper, unit, lowerBin, visUpdateMana
  * @param {number} conf.growUpper The upper limit of the height.
  * @param {string} conf.unit The unit the upper and lower bounds are measured in.
  * @param {number} conf.lowerBin The lower boundary of bins to be mapped (or the single bin to be mapped if the upper bin is undefined).
- * @param {VisualizerUpdateManager} conf.visUpdateManager The visualizer update manager to be mapped to.
+ * @param {VisUpdateRouter} conf.visUpdateManager The visualizer update manager to be mapped to.
  * @param {interpolator} conf.interpolator The interpolation function to be used to transition from one value to the next.
  * @param {number} [conf.upperBin] The upper bin or undefined, which results in mapping to a single bin.
  * @param {boolean} [conf.reversed=false] If true, then high amplitudes are mapped to lower values and vice versa.
- * @returns {{bin: number, listener: VisualizerUpdateManager.visualizerBinUpdateListener}|{lower: number, upper: number, listener: VisualizerUpdateManager.visualizerRangedUpdateListener}} The listener that was added (ranged if an upper bound was provided, binned otherwise).
+ * @returns {{bin: number, listener: VisUpdateRouter.visualizerBinUpdateListener}|{lower: number, upper: number, listener: VisUpdateRouter.visualizerRangedUpdateListener}} The listener that was added (ranged if an upper bound was provided, binned otherwise).
  */
 function mapHeight({ element, growLower, growUpper, unit, lowerBin, visUpdateManager, interpolator, upperBin = undefined, reversed = false }) {
     const getter = () => element.style.height;
diff --git a/src/mapping/numeric.js b/src/mapping/numeric.js
index 338b3bf..b0f7179 100644
--- a/src/mapping/numeric.js
+++ b/src/mapping/numeric.js
@@ -1,4 +1,4 @@
-import VisualizerUpdateManager from "../visualization/VisualizerUpdateManager.js";
+import VisUpdateRouter from "../visualization/VisUpdateRouter.js";
 
 /**
  * 
@@ -24,9 +24,9 @@ import VisualizerUpdateManager from "../visualization/VisualizerUpdateManager.js
  * @param {numericalGetter} conf.getter The getter callback to be used to get the current number.
  * @param {numericalSetter} conf.setter The setter callback to be used to set the new number.
  * @param {interpolator} conf.interpolator The interpolation function to use.
- * @param {VisualizerUpdateManager} conf.visUpdateManager the visualizer update manager this mapping corresponds with.
+ * @param {VisUpdateRouter} conf.visUpdateManager the visualizer update manager this mapping corresponds with.
  * @param {boolean} [conf.reversed = false] If true, then high amplitudes will be mapped to low values and vice versa.
- * @returns {{lower: number, upper: number, listener: VisualizerUpdateManager.visualizerRangedUpdateListener}} An object containing the lower and upper bounds for the range of a listener, which is also in the object.
+ * @returns {{lower: number, upper: number, listener: VisUpdateRouter.visualizerRangedUpdateListener}} An object containing the lower and upper bounds for the range of a listener, which is also in the object.
  */
 function mapRangedAvgNumerical({ minVal, maxVal, lowerBin = undefined, upperBin, getter, setter, interpolator, visUpdateManager, reversed = false }) {
     const rangedListener = {
@@ -63,9 +63,9 @@ function mapRangedAvgNumerical({ minVal, maxVal, lowerBin = undefined, upperBin,
  * @param {numericalGetter} conf.getter The callback to be used to get the current number.
  * @param {numericalSetter} conf.setter The callback to be used to set the new number.
  * @param {interpolator} conf.interpolator The interpolation function to use.
- * @param {VisualizerUpdateManager} conf.visUpdateManager The update manager to map to.
+ * @param {VisUpdateRouter} conf.visUpdateManager The update manager to map to.
  * @param {boolean} [conf.reversed] If true, then high amplitudes will be mapped to lower values and vice versa.
- * @returns {{bin: number, listener: VisualizerUpdateManager.visualizerBinUpdateListener}} The bin listener that was added.
+ * @returns {{bin: number, listener: VisUpdateRouter.visualizerBinUpdateListener}} The bin listener that was added.
  */
 function mapBinNumerical({ minVal, maxVal, bin, getter, setter, interpolator, visUpdateManager, reversed = false }) {
     const listener = {
diff --git a/src/player/VisualizedMusicPlayer.js b/src/player/VisMusicPlayer.js
similarity index 76%
rename from src/player/VisualizedMusicPlayer.js
rename to src/player/VisMusicPlayer.js
index 5104022..7909a61 100644
--- a/src/player/VisualizedMusicPlayer.js
+++ b/src/player/VisMusicPlayer.js
@@ -1,5 +1,5 @@
 import Visualizer from "../visualization/Visualizer.js";
-import VisualizerUpdateManager from "../visualization/VisualizerUpdateManager.js";
+import VisUpdateRouter from "../visualization/VisUpdateRouter.js";
 import MusicPlayer from "./MusicPlayer.js";
 import MusicPlaylist from "./MusicPlaylist.js";
 
@@ -11,7 +11,7 @@ import MusicPlaylist from "./MusicPlaylist.js";
  * 
  * @augments MusicPlayer
  */
-export default class VisualizedMusicPlayer extends MusicPlayer {
+export default class VisMusicPlayer extends MusicPlayer {
     #fftSize = 1024;
     #visualizerUpdateManager;
 
@@ -24,7 +24,11 @@ export default class VisualizedMusicPlayer extends MusicPlayer {
     constructor(playlist, fftSize = 1024) {
         super(playlist);
         this.#fftSize = fftSize;
-        this.#visualizerUpdateManager = new VisualizerUpdateManager(this.getCurrentMusicVisualizer());
+        this.#updateVisUpdateManager();
+    }
+
+    #updateVisUpdateManager() {
+        this.#visualizerUpdateManager = new VisUpdateRouter(this.getCurrentMusicVisualizer());
     }
 
     /**
@@ -32,7 +36,7 @@ export default class VisualizedMusicPlayer extends MusicPlayer {
      */
     set playlist(playlist) {
         super.playlist = playlist;
-        this.#visualizerUpdateManager = new VisualizerUpdateManager(this.getCurrentMusicVisualizer());
+
     }
 
     /**
@@ -42,7 +46,8 @@ export default class VisualizedMusicPlayer extends MusicPlayer {
     next() {
         const updateListeners = this.#visualizerUpdateManager.getBinnedListeners();
         if (!super.next()) return false;
-        this.#visualizerUpdateManager = new VisualizerUpdateManager(this.getCurrentMusicVisualizer());
+        this.#updateVisUpdateManager();
+
         this.#visualizerUpdateManager.setBinnedListeners(updateListeners);
         return true;
     }
@@ -56,7 +61,8 @@ export default class VisualizedMusicPlayer extends MusicPlayer {
         const updateListeners = this.#visualizerUpdateManager.getBinnedListeners();
         if (!super.previous()) return false;
 
-        this.#visualizerUpdateManager = new VisualizerUpdateManager(this.getCurrentMusicVisualizer());
+        this.#updateVisUpdateManager();
+
         this.#visualizerUpdateManager.setBinnedListeners(updateListeners);
         return true;
     }
@@ -69,13 +75,14 @@ export default class VisualizedMusicPlayer extends MusicPlayer {
     changeCurrent(index) {
         const updateListeners = this.VisualizerUpdateManager.getBinnedListeners();
         if (!super.changeCurrent(index)) return false;
-        this.#visualizerUpdateManager = new VisualizerUpdateManager(this.getCurrentMusicVisualizer());
+        this.#updateVisUpdateManager();
+
         this.#visualizerUpdateManager.setBinnedListeners = updateListeners();
         return true;
     }
 
     /**
-     * @returns {VisualizerUpdateManager} The current visualizer update manager.
+     * @returns {VisUpdateRouter} The current visualizer update manager.
      */
     get currentVisualizerUpdateManager() {
         return this.#visualizerUpdateManager();
diff --git a/src/player/player.js b/src/player/player.js
index e97cfb5..b9e21d3 100644
--- a/src/player/player.js
+++ b/src/player/player.js
@@ -1,7 +1,7 @@
 import MusicPlayer from "./MusicPlayer.js";
 import MusicPlaylist from "./MusicPlaylist.js";
-import VisualizedMusicPlayer from "./VisualizedMusicPlayer.js";
+import VisMusicPlayer from "./VisMusicPlayer.js";
 import Music from "./Music.js";
 
 /**@module */
-export { MusicPlayer, MusicPlaylist, VisualizedMusicPlayer, Music };
\ No newline at end of file
+export { MusicPlayer, MusicPlaylist, VisMusicPlayer, Music };
\ No newline at end of file
diff --git a/src/visualization/VisualizerUpdateManager.js b/src/visualization/VisUpdateRouter.js
similarity index 96%
rename from src/visualization/VisualizerUpdateManager.js
rename to src/visualization/VisUpdateRouter.js
index c43d21e..591b519 100644
--- a/src/visualization/VisualizerUpdateManager.js
+++ b/src/visualization/VisUpdateRouter.js
@@ -22,7 +22,7 @@ import Visualizer from "./Visualizer.js";
  * Specifically, the update manager handles updates directly from the {@link Visualizer} and checks for changes in the individual bins. These changes are then broadcasted to the individual bin listeners.
  * In the rare event that a bin has not changed, then it will not receive an update call.
  */
-export default class VisualizerUpdateManager {
+export default class VisUpdateRouter {
     #binnedListeners = [];
     #rangedListeners = [];
     #lastBins;
@@ -82,7 +82,7 @@ export default class VisualizerUpdateManager {
     }
 
     /**
-     * Similar to {@link VisualizerUpdateManager#AddVisualizerBinUpdateListener}, this method adds a listener for to a range of bins.
+     * Similar to {@link VisUpdateRouter#AddVisualizerBinUpdateListener}, this method adds a listener for to a range of bins.
      * 
      * @param {object} rangedUpdateListener The ranged update listener to add.
      * @param {number} rangedUpdateListener.lower The lower bound of the bins to listen to (inclusive).
@@ -155,7 +155,7 @@ export default class VisualizerUpdateManager {
 
     /**
      * 
-     * @returns {object} All the listeners, both for binned, and ranged listeners. See {@link VisualizerUpdateManager#loadListeners} to see the structure of the returned object.
+     * @returns {object} All the listeners, both for binned, and ranged listeners. See {@link VisUpdateRouter#loadListeners} to see the structure of the returned object.
      */
     retrieveListeners() {
         return {
diff --git a/src/visualization/visualization.js b/src/visualization/visualization.js
index 82286fd..171ae4d 100644
--- a/src/visualization/visualization.js
+++ b/src/visualization/visualization.js
@@ -1,5 +1,5 @@
 import Visualizer from "./Visualizer.js";
-import VisualizerUpdateManager from "./VisualizerUpdateManager.js";
+import VisUpdateRouter from "./VisUpdateRouter.js";
 
 /**@module */
-export { Visualizer, VisualizerUpdateManager };
\ No newline at end of file
+export { Visualizer, VisUpdateRouter };
\ No newline at end of file