Updated for 8x8x8 tinytim cube.

Map.h

@@ -0,0 +1,79 @@
+uint8_t coordsX[NUM_LEDS] = {   0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 6, 6, 6, 6, 6, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 6, 6, 6, 6, 6, 6, 6, 6, 5, 5, 5, 5, 5, 5, 5, 5, 4, 4, 4, 4, 4, 4, 4, 4, 3, 3, 3, 3, 3, 3, 3, 3, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0, 7, 6, 5, 4, 3, 2, 1, 0  };
+uint8_t coordsY[NUM_LEDS] = {   0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 6, 6, 6, 6, 6, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 6, 6, 6, 6, 6, 6, 6, 6, 5, 5, 5, 5, 5, 5, 5, 5, 4, 4, 4, 4, 4, 4, 4, 4, 3, 3, 3, 3, 3, 3, 3, 3, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 6, 6, 6, 6, 6, 6, 7, 7, 7, 7, 7, 7, 7, 7, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 6, 6, 6, 6, 6, 6, 7, 7, 7, 7, 7, 7, 7, 7  };
+uint8_t coordsZ[NUM_LEDS] = {   0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 0, 1, 2, 3, 4, 5, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0  };
+
+void cubeXGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t x = coordsX[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - (x * hues));
+  }
+}
+
+void cubeYGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t y = coordsY[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - (y * hues));
+  }
+}
+
+void cubeZGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t z = coordsZ[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - (z * hues));
+  }
+}
+
+void cubeXYGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t x = coordsX[i];
+    uint8_t y = coordsY[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - ((x + y) * hues));
+  }
+}
+
+void cubeXZGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t x = coordsX[i];
+    uint8_t z = coordsZ[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - ((x + z) * hues));
+  }
+}
+
+void cubeYZGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t y = coordsY[i];
+    uint8_t z = coordsZ[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - ((y + z) * hues));
+  }
+}
+
+void cubeXYZGradientPalette() {
+  uint8_t hues = 8;
+
+  for (uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t x = coordsX[i];
+    uint8_t y = coordsY[i];
+    uint8_t z = coordsZ[i];
+
+    leds[i] = ColorFromPalette(gCurrentPalette, beat8(speed) - ((x + y + z) * hues));
+  }
+}
+

Noise.h

@@ -0,0 +1,212 @@
+/*
+   ESP8266 + FastLED + IR Remote: https://github.com/jasoncoon/esp8266-fastled-webserver
+   Copyright (C) 2015-2016 Jason Coon
+
+   This program is free software: you can redistribute it and/or modify
+   it under the terms of the GNU General Public License as published by
+   the Free Software Foundation, either version 3 of the License, or
+   (at your option) any later version.
+
+   This program is distributed in the hope that it will be useful,
+   but WITHOUT ANY WARRANTY; without even the implied warranty of
+   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+   GNU General Public License for more details.
+
+   You should have received a copy of the GNU General Public License
+   along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+// The 16 bit version of our coordinates
+uint16_t noisex;
+uint16_t noisey;
+uint16_t noisez;
+
+// We're using the x/y dimensions to map to the x/y pixels on the matrix.  We'll
+// use the z-axis for "time".  speed determines how fast time moves forward.  Try
+// 1 for a very slow moving effect, or 60 for something that ends up looking like
+// water.
+int8_t noisespeedx = 0;
+int8_t noisespeedy = 1;
+int8_t noisespeedz = 0;
+
+// Scale determines how far apart the pixels in our noise matrix are.  Try
+// changing these values around to see how it affects the motion of the display.  The
+// higher the value of scale, the more "zoomed out" the noise will be.  A value
+// of 1 will be so zoomed in, you'll mostly see solid colors.
+uint16_t noisescale = 1; // scale is set dynamically once we've started up
+
+uint8_t colorLoop = 0;
+
+CRGBPalette16 blackAndWhiteStripedPalette;
+
+// This function sets up a palette of black and white stripes,
+// using code.  Since the palette is effectively an array of
+// sixteen CRGB colors, the various fill_* functions can be used
+// to set them up.
+void SetupBlackAndWhiteStripedPalette()
+{
+  // 'black out' all 16 palette entries...
+  fill_solid( blackAndWhiteStripedPalette, 16, CRGB::Black);
+  // and set every fourth one to white.
+  blackAndWhiteStripedPalette[0] = CRGB::White;
+  blackAndWhiteStripedPalette[4] = CRGB::White;
+  blackAndWhiteStripedPalette[8] = CRGB::White;
+  blackAndWhiteStripedPalette[12] = CRGB::White;
+
+}
+
+CRGBPalette16 blackAndBlueStripedPalette;
+
+// This function sets up a palette of black and blue stripes,
+// using code.  Since the palette is effectively an array of
+// sixteen CRGB colors, the various fill_* functions can be used
+// to set them up.
+void SetupBlackAndBlueStripedPalette()
+{
+  // 'black out' all 16 palette entries...
+  fill_solid( blackAndBlueStripedPalette, 16, CRGB::Black);
+
+  for(uint8_t i = 0; i < 6; i++) {
+    blackAndBlueStripedPalette[i] = CRGB::Blue;
+  }
+}
+
+// There are several different palettes of colors demonstrated here.
+//
+// FastLED provides several 'preset' palettes: RainbowColors_p, RainbowStripeColors_p,
+// OceanColors_p, CloudColors_p, LavaColors_p, ForestColors_p, and PartyColors_p.
+//
+// Additionally, you can manually define your own color palettes, or you can write
+// code that creates color palettes on the fly.
+
+void drawNoise3d(CRGBPalette16 palette, uint8_t hueReduce = 0)
+{
+  for(uint16_t i = 0; i < NUM_LEDS; i++) {
+    uint8_t x = coordsX[i];
+    uint8_t y = coordsY[i];
+    uint8_t z = coordsZ[i];
+   
+    int xoffset = noisescale * x;
+    int yoffset = noisescale * y;
+    int zoffset = noisescale * z;
+
+    uint8_t data = inoise8(x + xoffset + noisex, y + yoffset + noisey, z + zoffset + noisez);
+
+    // The range of the inoise8 function is roughly 16-238.
+    // These two operations expand those values out to roughly 0..255
+    // You can comment them out if you want the raw noise data.
+    data = qsub8(data, 16);
+    data = qadd8(data, scale8(data, 39));
+
+    if(hueReduce > 0 && data >= hueReduce)
+      data -= hueReduce;
+
+    leds[i] = ColorFromPalette(palette, data, 255, LINEARBLEND); 
+  }
+  
+  noisex += noisespeedx;
+  noisey += noisespeedy;
+  noisez += noisespeedz;
+}
+
+void rainbowNoise3d() {
+  noisespeedx = 0;
+  noisespeedy = 0;
+  noisespeedz = -1;
+  noisescale = 24;
+  colorLoop = 0;
+  drawNoise3d(RainbowColors_p);
+}
+
+void rainbowStripeNoise3d() {
+  noisespeedx = 0;
+  noisespeedy = 0;
+  noisespeedz = -2;
+  noisescale = 24;
+  colorLoop = 0;
+  drawNoise3d(RainbowStripeColors_p);
+}
+
+void partyNoise3d() {
+  noisespeedx = -9;
+  noisespeedy = 0;
+  noisespeedz = 0;
+  noisescale = 32;
+  colorLoop = 0;
+  drawNoise3d(PartyColors_p);
+}
+
+void forestNoise3d() {
+  noisespeedx = -9;
+  noisespeedy = 0;
+  noisespeedz = 0;
+  noisescale = 32;
+  colorLoop = 0;
+  drawNoise3d(ForestColors_p);
+}
+
+void cloudNoise3d() {
+  noisespeedx = -2;
+  noisespeedy = 0;
+  noisespeedz = 0;
+  noisescale = 24;
+  colorLoop = 0;
+  drawNoise3d(CloudColors_p);
+}
+
+void fireNoise3d() {
+  noisespeedx = 16;
+  noisespeedy = 16;
+  noisespeedz = 16;
+  noisescale = 64;
+  colorLoop = 0;
+  drawNoise3d(HeatColors_p, 60);
+}
+
+void fireNoise23d() {
+  noisespeedx = 3;
+  noisespeedy = 3;
+  noisespeedz = 3;
+  noisescale = 32;
+  colorLoop = 0;
+  drawNoise3d(HeatColors_p);
+}
+
+void lavaNoise3d() {
+  noisespeedx = -4;
+  noisespeedy = -4;
+  noisespeedz = -4;
+  noisescale = 32;
+  colorLoop = 0;
+  drawNoise3d(LavaColors_p);
+}
+
+void oceanNoise3d() {
+  noisespeedx = -2;
+  noisespeedy = 0;
+  noisespeedz = 4;
+  noisescale = 24;
+  colorLoop = 0;
+  drawNoise3d(OceanColors_p);
+}
+
+void blackAndWhiteNoise3d() {
+  SetupBlackAndWhiteStripedPalette();
+  noisespeedx = -12;
+  noisespeedy = 0;
+  noisespeedz = 0;
+  noisescale = 24;
+  colorLoop = 0;
+  drawNoise3d(blackAndWhiteStripedPalette);
+}
+
+void blackAndBlueNoise3d() {
+  SetupBlackAndBlueStripedPalette();
+  noisespeedx = -4;
+  noisespeedy = -4;
+  noisespeedz = -4;
+  noisescale = 32;
+  colorLoop = 0;
+  drawNoise3d(blackAndBlueStripedPalette);
+}
+

TwinkleFOX.h

@@ -194,7 +194,7 @@ void drawTwinkles()
 
   uint8_t backgroundBrightness = bg.getAverageLight();
 
-  for(uint8_t i = 0; i < NUM_LEDS; i++) {
+  for(uint16_t i = 0; i < NUM_LEDS; i++) {
     CRGB& pixel = leds[i];
 
     PRNG16 = (uint16_t)(PRNG16 * 2053) + 1384; // next 'random' number

data/css/simple.css

@@ -2,10 +2,20 @@
   padding-bottom: 70px;
 }*/
 
+.grid-item-color-button {
+  border: 0px;
+  width: 7.69%;
+  height: 64px;
+  margin: 0px;
+  padding: 0px;
+}
+
 .grid-item-color {
-  width: 4%;
+  border: none;
+  width: 3.33%;
   height: 32px;
-  cursor: pointer;
+  margin: 0px;
+  padding: 0px;
 }
 
 .grid-item-pattern {

data/index.htm

@@ -5,7 +5,7 @@
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>ESP8266 + FastLED by Evil Genius Labs</title>
+  <title>Cube by Evil Genius Labs</title>
 
   <!-- request CSS from internet CDN -->
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
@@ -36,7 +36,7 @@
       </div>
       <div class="collapse navbar-collapse" id="navbar-collapse-1">
         <ul class="nav navbar-nav">
-          <li class="active"><a href="/">ESP8266 + FastLED <span class="sr-only">(current)</span></a></li>
+          <li class="active"><a href="/">Cube <span class="sr-only">(current)</span></a></li>
           <li><a href="/simple.htm" target="_blank" title="Simple Mode">Simple</a></li>
           <li><a href="/edit.htm" target="_blank" title="Edit Files">Files</a></li>
           <li><a href="/update" target="_blank" title="Update Firmware">Firmware</a></li>

data/js/app.js

@@ -3,7 +3,7 @@ var address = location.hostname;
 var urlBase = "";
 
 // used when hosting the site somewhere other than the ESP8266 (handy for testing without waiting forever to upload to SPIFFS)
-// var address = "esp8266-1920f7.local";
+// var address = "192.168.86.55";
 // var urlBase = "http://" + address + "/";
 
 var postColorTimer = {};

data/js/simple.js

@@ -3,7 +3,7 @@ var address = location.hostname;
 var urlBase = "";
 
 // used when hosting the site somewhere other than the ESP8266 (handy for testing without waiting forever to upload to SPIFFS)
-// var address = "192.168.1.13";
+// var address = "192.168.86.55";
 // var urlBase = "http://" + address + "/";
 
 var postColorTimer = {};
@@ -15,6 +15,27 @@ var patterns = [
   "Pride",
   "Color Waves",
 
+  "X Gradient Palette",
+  "Y Gradient Palette",
+  "Z Gradient Palette",
+
+  "XY Gradient Palette",
+  "XZ Gradient Palette",
+  "YZ Gradient Palette",
+  "XYZ Gradient Palette",
+
+  "Fire Noise",
+  "Fire Noise 2",
+  "Lava Noise",
+  "Rainbow Noise",
+  "Rainbow Stripe Noise",
+  "Party Noise",
+  "Forest Noise",
+  "Cloud Noise",
+  "Ocean Noise",
+  "Black & White Noise",
+  "Black & Blue Noise",
+
   "Rainbow Twinkles",
   "Snow Twinkles",
   "Cloud Twinkles",
@@ -35,15 +56,11 @@ var patterns = [
   "Cloud 2 Twinkles",
   "Ocean Twinkles",
 
-  "Rainbow",
-  "Rainbow With Glitter",
   "Solid Rainbow",
   "Confetti",
   "Sinelon",
   "Beat",
   "Juggle",
-  "Fire",
-  "Water"
 ];
 
 var ws = new ReconnectingWebSocket('ws://' + address + ':81/', ['arduino']);
@@ -114,13 +131,13 @@ $(document).ready(function() {
 });
 
 function addColorButtons() {
-  var hues = 25;
+  var hues = 30;
   var hueStep = 360 / hues;
 
-  var levels = 10;
+  var levels = 25;
-  var levelStep = 60 / levels;
+  var levelStep = 50 / levels;
 
-  for(var l = 20; l < 80; l += levelStep) {
+  for(var l = 50; l < 95; l += levelStep) {
     for(var h = 0; h < hues; h++) {
       addColorButton(h * hueStep, 100, l);
     }
@@ -131,24 +148,35 @@ function addColorButtons() {
     layoutMode: 'fitRows'
   });
 
+  $('.grid-color-buttons').isotope({
+    itemSelector: '.grid-item-color-button',
+    layoutMode: 'fitRows'
+  });
+
+  $('.grid-item-color-button').click(colorButtonClick);
 }
 
 var colorButtonIndex = 0;
 
-function addColorButton(h, s, l) {
+function colorButtonClick() {
-  var color = "hsla(" + h + ", " + s + "%, " + l + "%, 1)"
-  var template = $("#colorButtonTemplate").clone();
-  template.attr("id", "color-button-" + colorButtonIndex++);
-  template.css("background-color", color);
-  template.click(function() {
   var rgb = $(this).css('backgroundColor');
   var components = rgbToComponents(rgb);
 
   $(".grid-item-color").css("border", "none");
+
+  if($(this).attr("class") === "grid-item-color") {
     $(this).css("border", "1px solid");
+  }
 
   postColor("solidColor", components);
-  });
+}
+
+function addColorButton(h, s, l) {
+  var color = "hsl(" + h + ", " + s + "%, " + l + "%)"
+  var template = $("#colorButtonTemplate").clone();
+  template.css("background-color", color);
+  template.attr("title", template.css("background-color") + "\r\n" + color);
+  template.click(colorButtonClick);
 
   $("#colorButtonsRow").append(template);
 }

data/simple.htm

@@ -5,7 +5,7 @@
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>ESP8266 + FastLED by Evil Genius Labs</title>
+  <title>Cube by Evil Genius Labs</title>
 
   <!-- request CSS from internet CDN -->
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
@@ -20,22 +20,44 @@
 
 <body>
 
-  <div id="container" class="container">
+  <div id="container" class="container-fluid">
 
     <div style="margin: 5px;">
       <button type="button" class="btn btn-default" id="btnOn">On</button>
       <button type="button" class="btn btn-default" id="btnOff">Off</button>
     </div>
 
+    <h4>Patterns</h4>
+
     <div id="patternGrid" class="grid-pattern"></div>
 
+    <h4>Basic Colors</h4>
+
+    <div class="grid-color-buttons">
+      <button type="button" class="grid-item-color-button" style="background: #FF0000;" title="Red">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #FF8000;" title="Orange">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #FFFF00;" title="Yellow">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #80FF00;" title="Chartreuse">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #00FF00;" title="Green">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #00FF80;" title="Spring Green">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #00FFFF;" title="Cyan">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #0080FF;" title="Azure">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #0000FF;" title="Blue">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #8000FF;" title="Violet">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #FF00FF;" title="Magenta">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #FF0080;" title="Rose">&nbsp;</button>
+      <button type="button" class="grid-item-color-button" style="background: #FFFFFF; border: 1px solid;" title="White">&nbsp;</button>
+    </div>
+
+    <h4>Color Palette</h4>
+
     <div id="colorButtonsRow" class="grid-color"></div>
 
   </div>
 
   <div id="templates" style="display: none">
 
-    <div id="colorButtonTemplate" class="grid-item-color"></div>
+    <button id="colorButtonTemplate" class="grid-item-color"></button>
 
     <button id="patternButtonTemplate" class="grid-item-pattern btn btn-default"></button>
 

esp8266-fastled-webserver.ino

@@ -1,21 +1,23 @@
 /*
- * ESP8266 + FastLED + IR Remote: https://github.com/jasoncoon/esp8266-fastled-webserver
+   ESP8266 + FastLED + IR Remote: https://github.com/jasoncoon/esp8266-fastled-webserver
- * Copyright (C) 2015-2016 Jason Coon
+   Copyright (C) 2015-2016 Jason Coon
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program.  If not, see <http://www.gnu.org/licenses/>.
- */
 
+   This program is free software: you can redistribute it and/or modify
+   it under the terms of the GNU General Public License as published by
+   the Free Software Foundation, either version 3 of the License, or
+   (at your option) any later version.
+
+   This program is distributed in the hope that it will be useful,
+   but WITHOUT ANY WARRANTY; without even the implied warranty of
+   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+   GNU General Public License for more details.
+
+   You should have received a copy of the GNU General Public License
+   along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+//#define FASTLED_ALLOW_INTERRUPTS 0
+#define FASTLED_INTERRUPT_RETRY_COUNT 0
 #include <FastLED.h>
 FASTLED_USING_NAMESPACE
 
@@ -30,19 +32,19 @@ extern "C" {
 #include <WebSocketsServer.h>
 #include <FS.h>
 #include <EEPROM.h>
-#include <IRremoteESP8266.h>
+//#include <IRremoteESP8266.h>
 #include "GradientPalettes.h"
 
 #define ARRAY_SIZE(A) (sizeof(A) / sizeof((A)[0]))
 
 #include "Field.h"
 
-#define HOSTNAME "ESP8266-" ///< Hostname. The setup function adds the Chip ID at the end.
+#define HOSTNAME "Cube-ESP8266-" ///< Hostname. The setup function adds the Chip ID at the end.
 
-#define RECV_PIN D4
+//#define RECV_PIN D4
-IRrecv irReceiver(RECV_PIN);
+//IRrecv irReceiver(RECV_PIN);
 
-#include "Commands.h"
+//#include "Commands.h"
 
 const bool apMode = false;
 
@@ -59,10 +61,10 @@ ESP8266HTTPUpdateServer httpUpdateServer;
 
 #include "FSBrowser.h"
 
-#define DATA_PIN      D8
+#define DATA_PIN      D5
-#define LED_TYPE      WS2811
+#define LED_TYPE      WS2812B
 #define COLOR_ORDER   GRB
-#define NUM_LEDS      24
+#define NUM_LEDS      8 * 8 * 6
 
 #define MILLI_AMPS         2000     // IMPORTANT: set the max milli-Amps of your power supply (4A = 4000mA)
 #define FRAMES_PER_SECOND  120 // here you can control the speed. With the Access Point / Web Server the animations run a bit slower.
@@ -133,6 +135,8 @@ typedef PatternAndName PatternAndNameList[];
 
 #include "Twinkles.h"
 #include "TwinkleFOX.h"
+#include "Map.h"
+#include "Noise.h"
 
 // List of patterns to cycle through.  Each is defined as a separate function below.
 
@@ -140,6 +144,28 @@ PatternAndNameList patterns = {
   { pride,                  "Pride" },
   { colorWaves,             "Color Waves" },
 
+  { cubeXGradientPalette,   "X Gradient Palette" },
+  { cubeYGradientPalette,   "Y Gradient Palette" },
+  { cubeZGradientPalette,   "Z Gradient Palette" },
+  
+  { cubeXYGradientPalette,  "XY Gradient Palette" },
+  { cubeXZGradientPalette,  "XZ Gradient Palette" },
+  { cubeYZGradientPalette,  "YZ Gradient Palette" },
+  { cubeXYZGradientPalette, "XYZ Gradient Palette" },
+
+  // 3d noise patterns
+  { fireNoise3d, "Fire Noise" },
+  { fireNoise23d, "Fire Noise 2" },
+  { lavaNoise3d, "Lava Noise" },
+  { rainbowNoise3d, "Rainbow Noise" },
+  { rainbowStripeNoise3d, "Rainbow Stripe Noise" },
+  { partyNoise3d, "Party Noise" },
+  { forestNoise3d, "Forest Noise" },
+  { cloudNoise3d, "Cloud Noise" },
+  { oceanNoise3d, "Ocean Noise" },
+  { blackAndWhiteNoise3d, "Black & White Noise" },
+  { blackAndBlueNoise3d, "Black & Blue Noise" },
+  
   // twinkle patterns
   { rainbowTwinkles,        "Rainbow Twinkles" },
   { snowTwinkles,           "Snow Twinkles" },
@@ -162,15 +188,15 @@ PatternAndNameList patterns = {
   { cloud2Twinkles,         "Cloud 2 Twinkles" },
   { oceanTwinkles,          "Ocean Twinkles" },
 
-  { rainbow,                "Rainbow" },
+//  { rainbow,                "Rainbow" },
-  { rainbowWithGlitter,     "Rainbow With Glitter" },
+//  { rainbowWithGlitter,     "Rainbow With Glitter" },
   { rainbowSolid,           "Solid Rainbow" },
   { confetti,               "Confetti" },
   { sinelon,                "Sinelon" },
   { bpm,                    "Beat" },
   { juggle,                 "Juggle" },
-  { fire,                   "Fire" },
+//  { fire,                   "Fire" },
-  { water,                  "Water" },
+//  { water,                  "Water" },
 
   { showSolidColor,         "Solid Color" }
 };
@@ -180,7 +206,7 @@ const uint8_t patternCount = ARRAY_SIZE(patterns);
 typedef struct {
   CRGBPalette16 palette;
   String name;
- } PaletteAndName;
+} PaletteAndName;
 typedef PaletteAndName PaletteAndNameList[];
 
 const CRGBPalette16 palettes[] = {
@@ -205,11 +231,13 @@ const String paletteNames[paletteCount] = {
   "Forest",
   "Party",
   "Heat",
- };
+};
 
 #include "Fields.h"
 
 void setup() {
+  WiFi.setSleepMode(WIFI_NONE_SLEEP);
+  
   Serial.begin(115200);
   delay(100);
   Serial.setDebugOutput(true);
@@ -228,7 +256,7 @@ void setup() {
 
   FastLED.setBrightness(brightness);
 
-  irReceiver.enableIRIn(); // Start the receiver
+  //  irReceiver.enableIRIn(); // Start the receiver
 
   Serial.println();
   Serial.print( F("Heap: ") ); Serial.println(system_get_free_heap_size());
@@ -354,7 +382,7 @@ void setup() {
   webServer.on("/twinkleSpeed", HTTP_POST, []() {
     String value = webServer.arg("value");
     twinkleSpeed = value.toInt();
-    if(twinkleSpeed < 0) twinkleSpeed = 0;
+    if (twinkleSpeed < 0) twinkleSpeed = 0;
     else if (twinkleSpeed > 8) twinkleSpeed = 8;
     broadcastInt("twinkleSpeed", twinkleSpeed);
     sendInt(twinkleSpeed);
@@ -363,7 +391,7 @@ void setup() {
   webServer.on("/twinkleDensity", HTTP_POST, []() {
     String value = webServer.arg("value");
     twinkleDensity = value.toInt();
-    if(twinkleDensity < 0) twinkleDensity = 0;
+    if (twinkleDensity < 0) twinkleDensity = 0;
     else if (twinkleDensity > 8) twinkleDensity = 8;
     broadcastInt("twinkleDensity", twinkleDensity);
     sendInt(twinkleDensity);
@@ -476,7 +504,7 @@ void loop() {
   webSocketsServer.loop();
   webServer.handleClient();
 
-  handleIrInput();
+  //  handleIrInput();
 
   if (power == 0) {
     fill_solid(leds, NUM_LEDS, CRGB::Black);
@@ -552,212 +580,212 @@ void webSocketEvent(uint8_t num, WStype_t type, uint8_t * payload, size_t length
   }
 }
 
-void handleIrInput()
+//void handleIrInput()
-{
+//{
-  InputCommand command = readCommand();
+//  InputCommand command = readCommand();
-
+//
-  if (command != InputCommand::None) {
+//  if (command != InputCommand::None) {
-    Serial.print("command: ");
+//    Serial.print("command: ");
-    Serial.println((int) command);
+//    Serial.println((int) command);
-  }
+//  }
-
+//
-  switch (command) {
+//  switch (command) {
-    case InputCommand::Up: {
+//    case InputCommand::Up: {
-        adjustPattern(true);
+//        adjustPattern(true);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Down: {
+//    case InputCommand::Down: {
-        adjustPattern(false);
+//        adjustPattern(false);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Power: {
+//    case InputCommand::Power: {
-        setPower(power == 0 ? 1 : 0);
+//        setPower(power == 0 ? 1 : 0);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::BrightnessUp: {
+//    case InputCommand::BrightnessUp: {
-        adjustBrightness(true);
+//        adjustBrightness(true);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::BrightnessDown: {
+//    case InputCommand::BrightnessDown: {
-        adjustBrightness(false);
+//        adjustBrightness(false);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::PlayMode: { // toggle pause/play
+//    case InputCommand::PlayMode: { // toggle pause/play
-        setAutoplay(!autoplay);
+//        setAutoplay(!autoplay);
-        break;
+//        break;
-      }
+//      }
-
+//
-    // pattern buttons
+//    // pattern buttons
-
+//
-    case InputCommand::Pattern1: {
+//    case InputCommand::Pattern1: {
-        setPattern(0);
+//        setPattern(0);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern2: {
+//    case InputCommand::Pattern2: {
-        setPattern(1);
+//        setPattern(1);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern3: {
+//    case InputCommand::Pattern3: {
-        setPattern(2);
+//        setPattern(2);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern4: {
+//    case InputCommand::Pattern4: {
-        setPattern(3);
+//        setPattern(3);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern5: {
+//    case InputCommand::Pattern5: {
-        setPattern(4);
+//        setPattern(4);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern6: {
+//    case InputCommand::Pattern6: {
-        setPattern(5);
+//        setPattern(5);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern7: {
+//    case InputCommand::Pattern7: {
-        setPattern(6);
+//        setPattern(6);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern8: {
+//    case InputCommand::Pattern8: {
-        setPattern(7);
+//        setPattern(7);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern9: {
+//    case InputCommand::Pattern9: {
-        setPattern(8);
+//        setPattern(8);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern10: {
+//    case InputCommand::Pattern10: {
-        setPattern(9);
+//        setPattern(9);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern11: {
+//    case InputCommand::Pattern11: {
-        setPattern(10);
+//        setPattern(10);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pattern12: {
+//    case InputCommand::Pattern12: {
-        setPattern(11);
+//        setPattern(11);
-        break;
+//        break;
-      }
+//      }
-
+//
-    // custom color adjustment buttons
+//    // custom color adjustment buttons
-
+//
-    case InputCommand::RedUp: {
+//    case InputCommand::RedUp: {
-        solidColor.red += 8;
+//        solidColor.red += 8;
-        setSolidColor(solidColor);
+//        setSolidColor(solidColor);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::RedDown: {
+//    case InputCommand::RedDown: {
-        solidColor.red -= 8;
+//        solidColor.red -= 8;
-        setSolidColor(solidColor);
+//        setSolidColor(solidColor);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::GreenUp: {
+//    case InputCommand::GreenUp: {
-        solidColor.green += 8;
+//        solidColor.green += 8;
-        setSolidColor(solidColor);
+//        setSolidColor(solidColor);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::GreenDown: {
+//    case InputCommand::GreenDown: {
-        solidColor.green -= 8;
+//        solidColor.green -= 8;
-        setSolidColor(solidColor);
+//        setSolidColor(solidColor);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::BlueUp: {
+//    case InputCommand::BlueUp: {
-        solidColor.blue += 8;
+//        solidColor.blue += 8;
-        setSolidColor(solidColor);
+//        setSolidColor(solidColor);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::BlueDown: {
+//    case InputCommand::BlueDown: {
-        solidColor.blue -= 8;
+//        solidColor.blue -= 8;
-        setSolidColor(solidColor);
+//        setSolidColor(solidColor);
-        break;
+//        break;
-      }
+//      }
-
+//
-    // color buttons
+//    // color buttons
-
+//
-    case InputCommand::Red: {
+//    case InputCommand::Red: {
-        setSolidColor(CRGB::Red);
+//        setSolidColor(CRGB::Red);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::RedOrange: {
+//    case InputCommand::RedOrange: {
-        setSolidColor(CRGB::OrangeRed);
+//        setSolidColor(CRGB::OrangeRed);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Orange: {
+//    case InputCommand::Orange: {
-        setSolidColor(CRGB::Orange);
+//        setSolidColor(CRGB::Orange);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::YellowOrange: {
+//    case InputCommand::YellowOrange: {
-        setSolidColor(CRGB::Goldenrod);
+//        setSolidColor(CRGB::Goldenrod);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Yellow: {
+//    case InputCommand::Yellow: {
-        setSolidColor(CRGB::Yellow);
+//        setSolidColor(CRGB::Yellow);
-        break;
+//        break;
-      }
+//      }
-
+//
-    case InputCommand::Green: {
+//    case InputCommand::Green: {
-        setSolidColor(CRGB::Green);
+//        setSolidColor(CRGB::Green);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Lime: {
+//    case InputCommand::Lime: {
-        setSolidColor(CRGB::Lime);
+//        setSolidColor(CRGB::Lime);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Aqua: {
+//    case InputCommand::Aqua: {
-        setSolidColor(CRGB::Aqua);
+//        setSolidColor(CRGB::Aqua);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Teal: {
+//    case InputCommand::Teal: {
-        setSolidColor(CRGB::Teal);
+//        setSolidColor(CRGB::Teal);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Navy: {
+//    case InputCommand::Navy: {
-        setSolidColor(CRGB::Navy);
+//        setSolidColor(CRGB::Navy);
-        break;
+//        break;
-      }
+//      }
-
+//
-    case InputCommand::Blue: {
+//    case InputCommand::Blue: {
-        setSolidColor(CRGB::Blue);
+//        setSolidColor(CRGB::Blue);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::RoyalBlue: {
+//    case InputCommand::RoyalBlue: {
-        setSolidColor(CRGB::RoyalBlue);
+//        setSolidColor(CRGB::RoyalBlue);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Purple: {
+//    case InputCommand::Purple: {
-        setSolidColor(CRGB::Purple);
+//        setSolidColor(CRGB::Purple);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Indigo: {
+//    case InputCommand::Indigo: {
-        setSolidColor(CRGB::Indigo);
+//        setSolidColor(CRGB::Indigo);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Magenta: {
+//    case InputCommand::Magenta: {
-        setSolidColor(CRGB::Magenta);
+//        setSolidColor(CRGB::Magenta);
-        break;
+//        break;
-      }
+//      }
-
+//
-    case InputCommand::White: {
+//    case InputCommand::White: {
-        setSolidColor(CRGB::White);
+//        setSolidColor(CRGB::White);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::Pink: {
+//    case InputCommand::Pink: {
-        setSolidColor(CRGB::Pink);
+//        setSolidColor(CRGB::Pink);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::LightPink: {
+//    case InputCommand::LightPink: {
-        setSolidColor(CRGB::LightPink);
+//        setSolidColor(CRGB::LightPink);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::BabyBlue: {
+//    case InputCommand::BabyBlue: {
-        setSolidColor(CRGB::CornflowerBlue);
+//        setSolidColor(CRGB::CornflowerBlue);
-        break;
+//        break;
-      }
+//      }
-    case InputCommand::LightBlue: {
+//    case InputCommand::LightBlue: {
-        setSolidColor(CRGB::LightBlue);
+//        setSolidColor(CRGB::LightBlue);
-        break;
+//        break;
-      }
+//      }
-  }
+//  }
-}
+//}
 
 void loadSettings()
 {
@@ -804,7 +832,7 @@ void setPower(uint8_t value)
 }
 
 void setAutoplay(uint8_t value)
-  {
+{
   autoplay = value == 0 ? 0 : 1;
 
   EEPROM.write(6, autoplay);
@@ -883,8 +911,8 @@ void setPattern(uint8_t value)
 
 void setPatternName(String name)
 {
-  for(uint8_t i = 0; i < patternCount; i++) {
+  for (uint8_t i = 0; i < patternCount; i++) {
-    if(patterns[i].name == name) {
+    if (patterns[i].name == name) {
       setPattern(i);
       break;
     }
@@ -906,8 +934,8 @@ void setPalette(uint8_t value)
 
 void setPaletteName(String name)
 {
-  for(uint8_t i = 0; i < paletteCount; i++) {
+  for (uint8_t i = 0; i < paletteCount; i++) {
-    if(paletteNames[i] == name) {
+    if (paletteNames[i] == name) {
       setPalette(i);
       break;
     }
@@ -1004,10 +1032,10 @@ void sinelon()
   int pos = beatsin16(speed, 0, NUM_LEDS);
   static int prevpos = 0;
   CRGB color = ColorFromPalette(palettes[currentPaletteIndex], gHue, 255);
-  if( pos < prevpos ) {
+  if ( pos < prevpos ) {
-    fill_solid( leds+pos, (prevpos-pos)+1, color);
+    fill_solid( leds + pos, (prevpos - pos) + 1, color);
   } else {
-    fill_solid( leds+prevpos, (pos-prevpos)+1, color);
+    fill_solid( leds + prevpos, (pos - prevpos) + 1, color);
   }
   prevpos = pos;
 }
@@ -1127,7 +1155,7 @@ void heatMap(CRGBPalette16 palette, bool up)
   random16_add_entropy(random(256));
 
   // Array of temperature readings at each simulation cell
-  static byte heat[256];
+  static byte heat[NUM_LEDS];
 
   byte colorindex;