Updated for 8x8x8 tinytim cube.

This commit is contained in:
Jason Coon 2017-09-05 07:59:24 -05:00
parent 3a3bb2043c
commit 9025d0ed10
7 changed files with 114 additions and 54 deletions

View File

@ -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

View File

@ -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 {

View File

@ -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>

View File

@ -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 = {};

View File

@ -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 levelStep = 60 / levels;
var levels = 25;
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) {
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);
function colorButtonClick() {
var rgb = $(this).css('backgroundColor');
var components = rgbToComponents(rgb);
$(".grid-item-color").css("border", "none");
$(".grid-item-color").css("border", "none");
if($(this).attr("class") === "grid-item-color") {
$(this).css("border", "1px solid");
}
postColor("solidColor", components);
});
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);
}

View File

@ -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>

View File

@ -32,14 +32,14 @@ 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
//IRrecv irReceiver(RECV_PIN);
@ -144,27 +144,27 @@ PatternAndNameList patterns = {
{ pride, "Pride" },
{ colorWaves, "Color Waves" },
{ cubeXGradientPalette, "Cube X Gradient Palette" },
{ cubeYGradientPalette, "Cube Y Gradient Palette" },
{ cubeZGradientPalette, "Cube Z Gradient Palette" },
{ cubeXGradientPalette, "X Gradient Palette" },
{ cubeYGradientPalette, "Y Gradient Palette" },
{ cubeZGradientPalette, "Z Gradient Palette" },
{ cubeXYGradientPalette, "Cube XY Gradient Palette" },
{ cubeXZGradientPalette, "Cube XZ Gradient Palette" },
{ cubeYZGradientPalette, "Cube YZ Gradient Palette" },
{ cubeXYZGradientPalette, "Cube XYZ Gradient Palette" },
{ cubeXYGradientPalette, "XY Gradient Palette" },
{ cubeXZGradientPalette, "XZ Gradient Palette" },
{ cubeYZGradientPalette, "YZ Gradient Palette" },
{ cubeXYZGradientPalette, "XYZ Gradient Palette" },
// 3d noise patterns
{ fireNoise3d, "Fire Noise 3D" },
{ fireNoise23d, "Fire Noise 2 3D" },
{ lavaNoise3d, "Lava Noise 3D" },
{ rainbowNoise3d, "Rainbow Noise 3D" },
{ rainbowStripeNoise3d, "Rainbow Stripe Noise 3D" },
{ partyNoise3d, "Party Noise 3D" },
{ forestNoise3d, "Forest Noise 3D" },
{ cloudNoise3d, "Cloud Noise 3D" },
{ oceanNoise3d, "Ocean Noise 3D" },
{ blackAndWhiteNoise3d, "Black & White Noise 3D" },
{ blackAndBlueNoise3d, "Black & Blue Noise 3D" },
{ 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" },
@ -188,15 +188,15 @@ PatternAndNameList patterns = {
{ cloud2Twinkles, "Cloud 2 Twinkles" },
{ oceanTwinkles, "Ocean Twinkles" },
{ rainbow, "Rainbow" },
{ rainbowWithGlitter, "Rainbow With Glitter" },
// { rainbow, "Rainbow" },
// { rainbowWithGlitter, "Rainbow With Glitter" },
{ rainbowSolid, "Solid Rainbow" },
{ confetti, "Confetti" },
{ sinelon, "Sinelon" },
{ bpm, "Beat" },
{ juggle, "Juggle" },
{ fire, "Fire" },
{ water, "Water" },
// { fire, "Fire" },
// { water, "Water" },
{ showSolidColor, "Solid Color" }
};
@ -1155,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;