@labcat2020/p5.audioreactive 0.1.2

package/src/p5.polygon.js

@@ -0,0 +1,71 @@
+import p5 from 'p5';
+
+// p5.polygon.js
+// A polygon drawing library for p5.js
+
+/**
+ * Helper function to draw any regular polygon
+ * @param {Number} x - x-coordinate of the polygon
+ * @param {Number} y - y-coordinate of the polygon
+ * @param {Number} radius - radius of the polygon
+ * @param {Number} sides - number of sides
+ * @param {Number} startAngle - starting angle (optional)
+ */
+p5.prototype.polygon = function(x, y, radius, sides, startAngle = 0) {
+    this.angleMode(this.RADIANS);
+    const angle = this.TWO_PI / sides;
+    this.beginShape();
+    for (let a = startAngle; a < this.TWO_PI + startAngle; a += angle) {
+        let sx = x + this.cos(a) * radius;
+        let sy = y + this.sin(a) * radius;
+        this.vertex(sx, sy);
+    }
+    this.endShape(this.CLOSE);
+};
+
+/**
+ * Draw a pentagon shape
+ * @param {Number} x - x-coordinate of the pentagon
+ * @param {Number} y - y-coordinate of the pentagon
+ * @param {Number} width - width of the pentagon
+ * @param {Number} height - height of the pentagon (optional, defaults to width)
+ */
+p5.prototype.pentagon = function(x, y, width, height = width) {
+    // Fixed: Remove the radius division by 2 since we're already providing the full width/height
+    // Fixed: Adjust starting angle to point upward (-PI/2 or -90 degrees)
+    const radius = Math.min(width, height) / 2;
+    this.polygon(x, y, radius, 5, -this.PI/2);
+};
+
+/**
+ * Draw a hexagon shape
+ * @param {Number} x - x-coordinate of the hexagon
+ * @param {Number} y - y-coordinate of the hexagon
+ * @param {Number} radius - radius of the hexagon
+ */
+p5.prototype.hexagon = function(x, y, radius) {
+    // For consistency, also remove the radius division here
+    this.polygon(x, y, radius / 2, 6, 0);
+};
+
+/**
+ * Draw an octagon shape
+ * @param {Number} x - x-coordinate of the octagon
+ * @param {Number} y - y-coordinate of the octagon
+ * @param {Number} radius - radius of the octagon
+ */
+p5.prototype.octagon = function(x, y, radius) {
+    // For consistency, also remove the radius division here
+    this.polygon(x, y, radius / 2, 8, this.TWO_PI / 16);
+};
+
+/**
+ * Draw an equilateral triangle shape
+ * @param {Number} x - x-coordinate of the triangle
+ * @param {Number} y - y-coordinate of the triangle
+ * @param {Number} radius - radius of the triangle
+ */
+p5.prototype.equilateral = function(x, y, radius) {
+    // Match the exact same pattern as pentagon, hexagon, and octagon
+    this.polygon(x, y, radius / 2, 3, -this.PI/2);
+};

package/src/p5.randomColor.README.md

@@ -0,0 +1,95 @@
+# p5.randomColor
+
+A p5.js library for generating attractive random colors. A p5-aware port of [randomColor](https://randomcolor.lllllllllllllllll.com) by David Merfield (CC0).
+
+This library augments `p5.prototype` with a `randomColor()` method that uses p5's RNG and returns a `p5.Color` object.
+
+## Installation
+
+Include the script in your HTML file after p5.js:
+
+```html
+<script src="p5.js"></script>
+<script src="p5.randomColor.js"></script>
+```
+
+## Basic Usage
+
+```javascript
+function setup() {
+  createCanvas(400, 400);
+  
+  // Generate a random attractive color
+  let c = randomColor();
+  fill(c);
+  rect(0, 0, width, height);
+}
+```
+
+## Options
+
+You can pass an options object to influence the type of color it produces:
+
+**`hue`** – Controls the hue of the generated color. You can pass a string representing a color name: `red`, `orange`, `yellow`, `green`, `blue`, `purple`, `pink` and `monochrome` are currently supported.
+
+**`luminosity`** – Controls the luminosity of the generated color. You can specify a string containing `bright`, `light`, `dark`, or `random`.
+
+**`count`** – An integer which specifies the number of colors to generate. Returns an array of `p5.Color` objects.
+
+**`alpha`** – A decimal between 0 and 1. Controls the alpha channel of the generated color.
+
+**Note:** This library always returns a `p5.Color` object. There is no `format` option. Seeding is handled by p5's `randomSeed()` function, not through options.
+
+## Examples
+
+```javascript
+// Returns a random attractive color
+let color = randomColor();
+
+// Returns an array of ten green colors
+let greens = randomColor({
+  count: 10,
+  hue: 'green'
+});
+
+// Returns a light blue color
+let lightBlue = randomColor({
+  luminosity: 'light',
+  hue: 'blue'
+});
+
+// Returns a bright color
+let bright = randomColor({
+  luminosity: 'bright'
+});
+
+// Returns a dark color with alpha
+let dark = randomColor({
+  luminosity: 'dark',
+  alpha: 0.8
+});
+
+// Returns a 'truly random' color
+let random = randomColor({
+  luminosity: 'random',
+  hue: 'random'
+});
+
+// Using with p5's randomSeed for reproducible results
+function setup() {
+  randomSeed(42);
+  let color1 = randomColor({ hue: 'blue' });
+  
+  randomSeed(42);
+  let color2 = randomColor({ hue: 'blue' });
+  // color1 and color2 will be the same
+}
+```
+
+## Differences from vanilla randomColor
+
+- Always returns a `p5.Color` object (no hex strings or format options)
+- Uses p5's RNG (use `randomSeed()` for seeding, not a `seed` option)
+- Works seamlessly with p5's color system
+- Only intended for use within p5 sketches
+

package/src/p5.randomColor.js

@@ -0,0 +1,302 @@
+import p5 from 'p5';
+
+/**
+ * @fileoverview p5.randomColor.js
+ * A p5-aware port of randomColor (original by David Merfield, CC0)
+ * This module augments p5.prototype with `randomColor(options)` which
+ * mirrors the original API but uses p5's RNG and returns a p5.Color.
+ */
+const colorDictionary = {};
+const colorRanges = [];
+
+loadColorBounds();
+
+/**
+ * Generates a random color using p5's RNG
+ * @param {Object} options - Configuration options
+ * @param {string|number} [options.hue] - Hue range (color name or 0-360)
+ * @param {string} [options.luminosity] - "bright", "light", "dark", or "random"
+ * @param {number} [options.alpha] - Alpha value (0-1)
+ * @param {number} [options.count] - Number of colors to generate
+ * @returns {p5.Color|p5.Color[]} A p5.Color or array of p5.Colors
+ */
+p5.prototype.randomColor = function (options) {
+  const p = this;
+  options = options || {};
+
+  function generateOne() {
+    const H = pickHueForP(p, options);
+    const S = pickSaturation(H, options, p);
+    const B = pickBrightness(H, S, options, p);
+    return colorFromHSV([H, S, B], options, p);
+  }
+
+  if (options.count !== null && options.count !== undefined) {
+    const totalColors = options.count;
+    const colors = [];
+    for (let i = 0; i < totalColors; i++) colorRanges.push(false);
+    const singleOptions = { ...options };
+    delete singleOptions.count;
+    while (colors.length < totalColors) colors.push(p.randomColor(singleOptions));
+    return colors;
+  }
+
+  return generateOne();
+};
+
+/**
+ * Picks a hue value based on options
+ * @param {p5} p - p5 instance
+ * @param {Object} options - Options object
+ * @returns {number} Hue value (0-360)
+ * @private
+ */
+function pickHueForP(p, options) {
+  if (colorRanges.length > 0) {
+    let hueRange = getRealHueRange(options.hue);
+    let hue = p.random(hueRange[0], hueRange[1]);
+
+    const step = (hueRange[1] - hueRange[0]) / colorRanges.length;
+    let j = parseInt((hue - hueRange[0]) / step);
+
+    if (colorRanges[j] === true) {
+      j = (j + 2) % colorRanges.length;
+    } else {
+      colorRanges[j] = true;
+    }
+
+    const min = (hueRange[0] + j * step) % 359;
+    const max = (hueRange[0] + (j + 1) * step) % 359;
+    hueRange = [min, max];
+
+    hue = p.random(hueRange[0], hueRange[1]);
+    if (hue < 0) hue = 360 + hue;
+    return hue;
+  } else {
+    const hueRange = getHueRange(options.hue);
+    let hue = p.random(hueRange[0], hueRange[1]);
+    if (hue < 0) hue = 360 + hue;
+    return hue;
+  }
+}
+
+/**
+ * Picks a saturation value based on hue and options
+ * @param {number} hue - Hue value
+ * @param {Object} options - Options object
+ * @param {p5} p - p5 instance
+ * @returns {number} Saturation value (0-100)
+ * @private
+ */
+function pickSaturation(hue, options, p) {
+  if (options && options.hue === "monochrome") return 0;
+  if (options && options.luminosity === "random") return p.random(0, 100);
+
+  const saturationRange = getSaturationRange(hue);
+  let sMin = saturationRange[0], sMax = saturationRange[1];
+
+  switch (options && options.luminosity) {
+    case "bright":
+      sMin = 55;
+      break;
+    case "dark":
+      sMin = sMax - 10;
+      break;
+    case "light":
+      sMax = 55;
+      break;
+  }
+
+  return p.random(sMin, sMax);
+}
+
+/**
+ * Picks a brightness value based on hue, saturation, and options
+ * @param {number} H - Hue value
+ * @param {number} S - Saturation value
+ * @param {Object} options - Options object
+ * @param {p5} p - p5 instance
+ * @returns {number} Brightness value (0-100)
+ * @private
+ */
+function pickBrightness(H, S, options, p) {
+  let bMin = getMinimumBrightness(H, S), bMax = 100;
+  switch (options && options.luminosity) {
+    case "dark":
+      bMax = bMin + 20;
+      break;
+    case "light":
+      bMin = (bMax + bMin) / 2;
+      break;
+    case "random":
+      bMin = 0;
+      bMax = 100;
+      break;
+  }
+  return p.random(bMin, bMax);
+}
+
+/**
+ * Creates a p5.Color from HSB values
+ * @param {number[]} hsv - Array of [H, S, B] values
+ * @param {Object} options - Options object
+ * @param {p5} p - p5 instance
+ * @returns {p5.Color} p5.Color object
+ * @private
+ */
+function colorFromHSV(hsv, options, p) {
+  options = options || {};
+  const H = hsv[0];
+  const S = hsv[1];
+  const B = hsv[2];
+  const alpha = options.alpha === undefined ? 1 : Math.max(0, Math.min(1, options.alpha));
+  p.push();
+  p.colorMode(p.HSB, 360, 100, 100, 1);
+  const c = p.color(H, S, B, alpha);
+  p.pop();
+  return c;
+}
+
+/**
+ * Calculates minimum brightness for a given hue and saturation
+ * @param {number} H - Hue value
+ * @param {number} S - Saturation value
+ * @returns {number} Minimum brightness value
+ * @private
+ */
+function getMinimumBrightness(H, S) {
+  const lowerBounds = getColorInfo(H).lowerBounds;
+  for (let i = 0; i < lowerBounds.length - 1; i++) {
+    const s1 = lowerBounds[i][0], v1 = lowerBounds[i][1];
+    const s2 = lowerBounds[i + 1][0], v2 = lowerBounds[i + 1][1];
+    if (S >= s1 && S <= s2) {
+      const m = (v2 - v1) / (s2 - s1), b = v1 - m * s1;
+      return m * S + b;
+    }
+  }
+  return 0;
+}
+
+/**
+ * Gets hue range for a color input
+ * @param {string|number} colorInput - Color name or hue value
+ * @returns {number[]} Array of [min, max] hue range
+ * @private
+ */
+function getHueRange(colorInput) {
+  if (!isNaN(parseInt(colorInput))) {
+    const number = parseInt(colorInput);
+    if (number < 360 && number > 0) return [number, number];
+  }
+  if (typeof colorInput === "string") {
+    if (colorDictionary[colorInput]) {
+      const color = colorDictionary[colorInput];
+      if (color.hueRange) return color.hueRange;
+    }
+  }
+  return [0, 360];
+}
+
+/**
+ * Gets saturation range for a hue value
+ * @param {number} hue - Hue value
+ * @returns {number[]} Array of [min, max] saturation range
+ * @private
+ */
+function getSaturationRange(hue) {
+  return getColorInfo(hue).saturationRange;
+}
+
+/**
+ * Gets color information for a hue value
+ * @param {number} hue - Hue value
+ * @returns {Object} Color info with hueRange, lowerBounds, saturationRange, brightnessRange
+ * @private
+ */
+function getColorInfo(hue) {
+  if (hue >= 334 && hue <= 360) hue -= 360;
+  for (const colorName in colorDictionary) {
+    const color = colorDictionary[colorName];
+    if (
+      color.hueRange &&
+      hue >= color.hueRange[0] &&
+      hue <= color.hueRange[1]
+    ) {
+      return colorDictionary[colorName];
+    }
+  }
+  return { lowerBounds: [[0,0]], saturationRange: [0,100] };
+}
+
+/**
+ * Defines a color in the color dictionary
+ * @param {string} name - Color name
+ * @param {number[]|null} hueRange - Hue range array or null
+ * @param {number[][]} lowerBounds - Array of [saturation, brightness] pairs
+ * @private
+ */
+function defineColor(name, hueRange, lowerBounds) {
+  const sMin = lowerBounds[0][0], sMax = lowerBounds[lowerBounds.length - 1][0];
+  const bMin = lowerBounds[lowerBounds.length - 1][1], bMax = lowerBounds[0][1];
+  colorDictionary[name] = {
+    hueRange: hueRange,
+    lowerBounds: lowerBounds,
+    saturationRange: [sMin, sMax],
+    brightnessRange: [bMin, bMax],
+  };
+}
+
+/**
+ * Loads color bounds into the color dictionary
+ * @private
+ */
+function loadColorBounds() {
+  defineColor("monochrome", null, [ [0,0], [100,0] ]);
+
+  defineColor("red", [-26, 18], [
+    [20,100],[30,92],[40,89],[50,85],[60,78],[70,70],[80,60],[90,55],[100,50]
+  ]);
+
+  defineColor("orange", [18,46], [
+    [20,100],[30,93],[40,88],[50,86],[60,85],[70,70],[100,70]
+  ]);
+
+  defineColor("yellow", [46,62], [
+    [25,100],[40,94],[50,89],[60,86],[70,84],[80,82],[90,80],[100,75]
+  ]);
+
+  defineColor("green", [62,178], [
+    [30,100],[40,90],[50,85],[60,81],[70,74],[80,64],[90,50],[100,40]
+  ]);
+
+  defineColor("blue", [178,257], [
+    [20,100],[30,86],[40,80],[50,74],[60,60],[70,52],[80,44],[90,39],[100,35]
+  ]);
+
+  defineColor("purple", [257,282], [
+    [20,100],[30,87],[40,79],[50,70],[60,65],[70,59],[80,52],[90,45],[100,42]
+  ]);
+
+  defineColor("pink", [282,334], [
+    [20,100],[30,90],[40,86],[60,84],[80,80],[90,75],[100,73]
+  ]);
+}
+
+/**
+ * Gets the real hue range when generating multiple colors
+ * @param {string|number} colorHue - Color name or hue value
+ * @returns {number[]} Array of [min, max] hue range
+ * @private
+ */
+function getRealHueRange(colorHue) {
+  if (!isNaN(colorHue)) {
+    const number = parseInt(colorHue);
+    if (number < 360 && number > 0) return getColorInfo(colorHue).hueRange;
+  } else if (typeof colorHue === 'string') {
+    if (colorDictionary[colorHue]) {
+      const color = colorDictionary[colorHue];
+      if (color.hueRange) return color.hueRange;
+    }
+  }
+  return [0,360];
+}

package/src/p5.setGlobalP5.js

@@ -0,0 +1,3 @@
+import p5 from 'p5';
+
+globalThis.p5 = p5;

package/src/p5.soundBoot.js

@@ -0,0 +1,2 @@
+import './p5.setGlobalP5.js';
+import 'p5.sound/dist/p5.sound.js';

package/src/sacredGeometry.js

@@ -0,0 +1,198 @@
+import p5 from 'p5';
+
+// Sacred Geometry Library
+// Shared functions for drawing sacred geometry patterns using p5.Polar
+/**
+ * Draws the vesica piscis pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawVesicaPiscis = function(currentShapeType, size) {
+  if (currentShapeType === 'polarEllipse') {
+    this.polarEllipse(0, size, size);
+    this.polarEllipse(0, size / 2, size /2);
+    this.polarEllipse(0, size / 4 * 3, size / 4 * 3, size / 4);
+    this.polarEllipse(0, size / 4 * 3, size / 4 * 3, -size / 4);
+  } else {
+    this[currentShapeType](0, size);
+    this[currentShapeType](0, size / 2);
+    this[currentShapeType](0, size / 4 * 3, -size / 4);
+    this[currentShapeType](180, size / 4 * 3, -size / 4);
+  }
+};
+
+/**
+ * Draws the seed of life pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawSeedOfLife = function(currentShapeType, size) {
+  const shapeSize = size / 2;
+  if (currentShapeType === 'polarEllipse') {
+    this.polarEllipse(0, shapeSize, shapeSize);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize);
+  }
+  else {
+    this[currentShapeType](0, shapeSize);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize);
+  }
+};
+
+/**
+ * Draws the egg of life pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawEggOfLife = function(currentShapeType, size) {
+  const shapeSize = size / 3;
+  if (currentShapeType === 'polarEllipse') {
+    this.polarEllipse(0, shapeSize, shapeSize);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize * 2);
+  }
+  else {
+    this[currentShapeType](0, shapeSize);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize * 2);
+  }
+};
+
+/**
+ * Draws the flower of life pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawFlowerOfLife = function(currentShapeType, size) {
+  const shapeSize = size / 3;
+  if (currentShapeType === 'polarEllipse') {
+    this.polarEllipse(0, size, size);
+    this.polarEllipse(0, shapeSize, shapeSize);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize);
+    this.polarEllipses(12, shapeSize, shapeSize, shapeSize * 2);
+  }
+  else {
+    this[currentShapeType](0, size);
+    this[currentShapeType](0, shapeSize);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize);
+    this[`${currentShapeType}s`](12, shapeSize, shapeSize * 2);
+  }
+};
+
+/**
+ * Draws the fruit of life pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawFruitOfLife = function(currentShapeType, size) {
+  const shapeSize = size / 5;
+  if (currentShapeType === 'polarEllipse') {
+    this.polarEllipse(0, shapeSize, shapeSize);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize * 2);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize * 4);
+  }
+  else {
+    this[currentShapeType](0, shapeSize);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize * 2);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize * 4);
+  }
+};
+
+/**
+ * Draws Metatrons Cube pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawMetatronsCube = function(currentShapeType, size) {
+  const shapeSize = size / 5;
+  if (currentShapeType === 'polarEllipse') {
+    this.polarEllipse(0, shapeSize, shapeSize);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize * 2);
+    this.polarEllipses(6, shapeSize, shapeSize, shapeSize * 4);
+  }
+  else {
+    this[currentShapeType](0, shapeSize);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize * 2);
+    this[`${currentShapeType}s`](6, shapeSize, shapeSize * 4);
+  }
+
+  const originalStrokeWeight = this.drawingContext.lineWidth;
+  this.strokeWeight(originalStrokeWeight / 4);
+
+  const linePositions = [];
+  for (let i = 0; i < 6; i++) {
+    const angle = this.TWO_PI / 6 * i + this.PI / 6;
+    linePositions.push({
+      x: this.cos(angle) * shapeSize * 2,
+      y: this.sin(angle) * shapeSize * 2
+    });
+    linePositions.push({
+      x: this.cos(angle) * shapeSize * 4,
+      y: this.sin(angle) * shapeSize * 4
+    });
+  }
+
+  for (let i = 0; i < linePositions.length; i++) {
+    for (let j = i + 1; j < linePositions.length; j++) {
+      this.line(linePositions[i].x, linePositions[i].y, linePositions[j].x, linePositions[j].y);
+    }
+  }
+  this.strokeWeight(originalStrokeWeight);
+};
+
+/**
+ * Draws the tree of life pattern
+ * @param {string} currentShapeType - Current shape type being used
+ * @param {number} size - Size of the pattern
+ */
+p5.prototype.drawTreeOfLife = function(currentShapeType, size) {
+  const shapeSize = size / 2;
+  const points = [];
+  
+  for (let i = 0; i < 6; i++) {
+    const angle = (i * 60 + 30) * Math.PI / 180;
+    const x = Math.cos(angle) * shapeSize;
+    const y = Math.sin(angle) * shapeSize - shapeSize;
+    points.push({x, y});
+  }
+  
+  for (let i = 0; i < 6; i++) {
+    if (i === 0 || i === 2) continue; 
+    const angle = (i * 60 + 30) * Math.PI / 180;
+    const x = Math.cos(angle) * shapeSize;
+    const y = Math.sin(angle) * shapeSize + shapeSize;
+    points.push({x, y});
+  }
+  
+  points.push({x: 0, y: shapeSize});
+
+  points.forEach((point, index) => {
+    this.push();
+    this.translate(point.x, point.y);
+    if (currentShapeType === 'polarEllipse') {
+      this.polarEllipse(0, shapeSize / 3, shapeSize / 3);
+    } else {
+      this[currentShapeType](0, shapeSize / 3);
+    }
+    this.pop();
+  });
+
+  const connections = [
+    // Top triangle (Supernal Triad)
+    [3, 4], [4, 5], [5, 3],
+    // Vertical paths from top triangle
+    [5, 0], [3, 2],
+    // Connections to bottom ring
+    [0, 9], [2, 7],
+    // Horizontal connections
+    [0, 2],
+    // Vertical central trunk
+    [4, 8], [8, 10], [10, 6],
+    // Bottom formation connections
+    [7, 8], [8, 9], [9, 10], [10, 7]
+  ];
+  
+  connections.forEach(([from, to]) => {
+    if (points[from] && points[to]) {
+      this.line(points[from].x, points[from].y, points[to].x, points[to].y);
+    }
+  });
+  
+};