VisMusicPlayer guide done.

src/mapping/dimensions.js

@@ -56,7 +56,7 @@ function mapWidth({ element, growLower, growUpper, unit, lowerBin, visUpdateRout
  * @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, visUpdateRouter, interpolator, upperBin = undefined, reversed = false }) {
-    const getter = () => element.style.height;
+    const getter = () => parseInt(element.style.height) || 0;
     const setter = (value) => element.style.height = value + unit;
     const conf = {
         minVal: growLower,

src/mapping/mappings.js

@@ -1,5 +1,6 @@
 import * as dimensions from "./dimensions.js";
 import * as numeric from "./numeric.js";
+import * as text from "./text.js";
 
 /**@module */
-export { dimensions, numeric };
+export { dimensions, numeric, text };

src/mapping/text.js

@@ -19,7 +19,10 @@ function mapRgba({ element, color, lowerBin, visUpdateRouter, interpolator, uppe
     const rgbaStr = "rgba";
     color = rgbaStr.indexOf(color);
     if (color < 0) throw new Error("Invalid color parameter provided.");
-    const getter = () => parseColor(element.style.color)[color];
+    const getter = () => {
+        if (!element.style.color) element.style.color = "rgb(0,0,255)";
+        return parseColor(element.style.color)[color];
+    };
     const setter = (value) => {
         const changed = parseColor(element.style.color);
         changed[color] = value;

src/support/colors.js

@@ -43,6 +43,7 @@ function rgbHexToRgba(hex) {
  * @returns {number[]} the rgba components.
  */
 function cssRgbaToRgba(rgba) {
+    rgba = rgba.replaceAll(" ", "");
     const cssRgbaRegex = /rgba\((\d+),(\d+),(\d+),(\d+)\)/;
     try {
         const matches = rgba.match(cssRgbaRegex);
@@ -59,6 +60,7 @@ function cssRgbaToRgba(rgba) {
  * @returns {number[]} the rgba components.
  */
 function cssRgbToRgba(rgb) {
+    rgb = rgb.replaceAll(" ", "");
     const cssRgbRegex = /rgb\((\d+),(\d+),(\d+)\)/;
     try {
         const matches = rgb.match(cssRgbRegex);