diff --git a/data/index.htm b/data/index.htm
index 864fe1d..fc06787 100644
--- a/data/index.htm
+++ b/data/index.htm
@@ -14,17 +14,8 @@
@@ -70,7 +61,49 @@
+
diff --git a/data/js/scripts.js b/data/js/scripts.js
index 7488dc5..b1e408f 100644
--- a/data/js/scripts.js
+++ b/data/js/scripts.js
@@ -77,6 +77,19 @@ $("#inputColor").change(function() {
delaySetColor(rgb);
});
+$(".btn-color").click(function() {
+ if(ignoreColorChange) return;
+
+ var rgb = $(this).css('backgroundColor');
+ var components = rgbToComponents(rgb);
+ delaySetColor(components);
+
+ var hexString = rgbToHex(components.r, components.g, components.b);
+ ignoreColorChange = true;
+ $("#inputColor").minicolors('value', hexString);
+ ignoreColorChange = false;
+});
+
function getAll() {
$.get(urlBase + "all", function(data) {
allData = data;
@@ -163,3 +176,14 @@ function componentToHex(c) {
function rgbToHex(r, g, b) {
return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}
+
+function rgbToComponents(rgb){
+ var components = {};
+
+ rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
+ components.r = parseInt(rgb[1]);
+ components.g = parseInt(rgb[2]);
+ components.b = parseInt(rgb[3]);
+
+ return components;
+ }
diff --git a/esp8266-fastled-webserver.ino b/esp8266-fastled-webserver.ino
index cb4c14d..40cfbd3 100644
--- a/esp8266-fastled-webserver.ino
+++ b/esp8266-fastled-webserver.ino
@@ -63,28 +63,6 @@ uint8_t brightnessMap[brightnessCount] = { 16, 32, 64, 128, 255 };
int brightnessIndex = 0;
uint8_t brightness = brightnessMap[brightnessIndex];
-typedef void (*Pattern)();
-typedef Pattern PatternList[];
-typedef struct {
- Pattern pattern;
- String name;
-} PatternAndName;
-typedef PatternAndName PatternAndNameList[];
-
-// List of patterns to cycle through. Each is defined as a separate function below.
-PatternAndNameList patterns = {
- { colorwaves, "Color Waves" },
- { palettetest, "Palette Test" },
- { pride, "Pride" },
- { rainbow, "Rainbow" },
- { rainbowWithGlitter, "Rainbow With Glitter" },
- { confetti, "Confetti" },
- { sinelon, "Sinelon" },
- { juggle, "Juggle" },
- { bpm, "BPM" },
- { showSolidColor, "Solid Color" },
-};
-
#define ARRAY_SIZE(A) (sizeof(A) / sizeof((A)[0]))
// ten seconds per color palette makes a good demo
@@ -105,7 +83,6 @@ uint8_t gCurrentPaletteNumber = 0;
CRGBPalette16 gCurrentPalette( CRGB::Black);
CRGBPalette16 gTargetPalette( gGradientPalettes[0] );
-const uint8_t patternCount = ARRAY_SIZE(patterns);
uint8_t currentPatternIndex = 0; // Index number of which pattern is current
bool autoplayEnabled = false;
@@ -281,6 +258,30 @@ void setup(void) {
autoPlayTimeout = millis() + (autoPlayDurationSeconds * 1000);
}
+typedef void (*Pattern)();
+typedef Pattern PatternList[];
+typedef struct {
+ Pattern pattern;
+ String name;
+} PatternAndName;
+typedef PatternAndName PatternAndNameList[];
+
+// List of patterns to cycle through. Each is defined as a separate function below.
+PatternAndNameList patterns = {
+ { colorwaves, "Color Waves" },
+ { palettetest, "Palette Test" },
+ { pride, "Pride" },
+ { rainbow, "Rainbow" },
+ { rainbowWithGlitter, "Rainbow With Glitter" },
+ { confetti, "Confetti" },
+ { sinelon, "Sinelon" },
+ { juggle, "Juggle" },
+ { bpm, "BPM" },
+ { showSolidColor, "Solid Color" },
+};
+
+const uint8_t patternCount = ARRAY_SIZE(patterns);
+
void loop(void) {
// Add entropy to random number generator; we use a lot of it.
random16_add_entropy(random(65535));