API tools faq
paste
MrRockchip

super_8266

MrRockchip
May 25th, 2022 (edited)
268
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
C 32.97 KB | None | 0 0
raw download clone embed print report
  1. //// [000_000000][001_000000][002_000000][003_000000][004_000000][005_000000][006_000000][007_000000][001_FF0000]{
  2. //// [@@@_FFFFFF] [@@@_1B00EA] [@@@_1B00EA]![@@@_1B00EA]"[@@@_1B00EA]#[@@@_1B00EA]!
  3.  
  4. /* Neopixel web server with ESP8266-01
  5.  * with switch to rainbow animation
  6.  *
  7.  * Tom Tobback Sep 2016
  8.  * BuffaloLabs www.cassiopeia.hk/kids
  9. LICENSE:
  10. Copyright (c) 2016 Tom Tobback
  11.  
  12. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
  13.  
  14. The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
  15.  
  16. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  17.  
  18.  * web page esp/rgb returns POST request with 3 RGB parameters
  19.  * web page inspired by https://github.com/dimsumlabs/nodemcu-httpd
  20.  *
  21.  * voltage regulator from 5V to 3.3V
  22.  * neopixel strip 8 LEDs on GPIO2, and Vcc on 3.3V otherwise the data goes wrong sometimes
  23.  *
  24.  * ESP8266 ESP-01 connections
  25.  * Vcc 3.3V
  26.  * GND GND
  27.  * GPIO2 neopixel data pin with 430ohm resistor
  28.  * GPIO3 switch between animation/webserver (only at startup!) with 4K3 pull-down resistor and IN5819 diode to Vcc
  29.  * CH_PD 3.3V (actually Vcc)
  30.  * RST 3.3V (actually Vcc)
  31.  *
  32.  * 3 way switch on 3.3V to choose between webserver and animation
  33.  * GPIO3=RX is connected to switch: HIGH= animation LOW= webserver
  34.  * in HIGH state the power goes from GPIO3 to Vcc via a diode IN5819
  35.  * in LOW state the Vcc power cannot reach GPIO3
  36.  */
  37.  
  38. #define STRIP_NUMPIXELS  8
  39. #define MODE_STATIC_ALL  0
  40. #define MODE_INDIVIDUAL 56
  41.  
  42. #include <ESP8266WiFi.h>
  43. #include <DNSServer.h>
  44. #include <ESP8266WebServer.h>
  45.  
  46. /* Set up your SSID and Password */
  47. const char*     ssid =  "NodeMCU"; // SSID
  48. const char* password = "19216811"; // Password
  49.  
  50. /* Set up your IP addresses */
  51. IPAddress local_ip(192,168,1,1);
  52. IPAddress  gateway(192,168,1,1);
  53. IPAddress subnet(255,255,255,0);
  54.  
  55. const byte DNS_PORT = 53;
  56. DNSServer dnsServer;
  57. ESP8266WebServer webServer(80);
  58.  
  59. boolean animation;
  60.  
  61. String webpageRGB = ""
  62.  " <!DOCTYPE html> "
  63.   " <html style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center;'> "
  64.    " <head> "
  65.     " <title>Neopixel control</title> "
  66.     " <meta name='mobile-web-app-capable' content='yes' /> "
  67.     " <meta name='viewport' content='width=device-width, height=device-height, initial-scale=1.0, user-scalable=yes' /> "
  68.    " </head> "
  69.    " <body style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center; font-family: \"Courier New\", Courier, monospace; font-weight: bold;'> "
  70.     " <script type='text/javascript'> "
  71.      " function toggleDetails() { "
  72.       " var elem = document.getElementById('my_details'); "
  73.       " if (elem.open == true) { "
  74.        " elem.open = false; "
  75.       " } "
  76.       " else { "
  77.        " elem.open = true; "
  78.       " } "
  79.      " } "
  80.          " var stripLocked = false; "
  81.          " function updateStrip(val_r, val_g, val_b, val_m) { "
  82.           " if (stripLocked) { "
  83.            " return; "
  84.           " } "
  85.           " function colourCorrect(v) { "
  86.            " return Math.round(1023 - ((v * v)/64)); "
  87.           " } "
  88.           " var params = [ "
  89.            " 'r=' + colourCorrect(val_r), "
  90.            " 'g=' + colourCorrect(val_g), "
  91.            " 'b=' + colourCorrect(val_b), "
  92.            " 'm=' + val_m "
  93.            " ].join('&'); "
  94.           " var req = new XMLHttpRequest(); "
  95.           " req.open('POST', '?' + params, true); "
  96.           " req.send(); "
  97.           " stripLocked = true; "
  98.           " req.onreadystatechange = function() { "
  99.            " if (req.readyState == 4) { "
  100.             " stripLocked = false; "
  101.            " } "
  102.           " } "
  103.          " } "
  104.      " function updateSummaryColor() { "
  105.       " var val_r = document.getElementById('range_r').value; "
  106.       " my_r      =        (parseInt(val_r, 10 )).toString(16).padStart(2, '0'); "
  107.       " my_r_inv  = (255 - (parseInt(val_r, 10))).toString(16).padStart(2, '0'); "
  108.       " var val_g = document.getElementById('range_g').value; "
  109.       " my_g      =        (parseInt(val_g, 10 )).toString(16).padStart(2, '0'); "
  110.       " my_g_inv  = (255 - (parseInt(val_g, 10))).toString(16).padStart(2, '0'); "
  111.       " var val_b = document.getElementById('range_b').value; "
  112.       " my_b      =        (parseInt(val_b, 10 )).toString(16).padStart(2, '0'); "
  113.       " my_b_inv  = (255 - (parseInt(val_b, 10))).toString(16).padStart(2, '0'); "
  114.       " document.getElementById('text_r').value = my_r; "
  115.       " document.getElementById('text_g').value = my_g; "
  116.       " document.getElementById('text_b').value = my_b; "
  117.       " document.getElementById('text_a').value = my_r + my_g + my_b; "
  118.       " var my_details = document.getElementById('my_details'); "
  119.       " my_details.style.background = '#' + my_r     + my_g     + my_b; "
  120.       " my_details.style.color      = '#' + my_r_inv + my_g_inv + my_b_inv; "
  121.       " var val_m = document.getElementById('range_m').value; "
  122.       " my_m      =        (parseInt(val_m, 10 )).toString(10).padStart(2, '0'); "
  123.       " document.getElementById('text_m').value = my_m; "
  124.       " updateStrip(parseInt(val_r, 10), parseInt(val_g, 10), parseInt(val_b, 10), parseInt(val_m, 10)); "
  125.      " } "
  126.      " function changedText(range_id, text_id, my_base) { "
  127.       " document.getElementById(range_id).value = parseInt(document.getElementById(text_id).value, my_base); "
  128.       " updateSummaryColor(); "
  129.      " } "
  130.      " function changedText_a() { "
  131.       " var text_a = document.getElementById('text_a'); "
  132.       " document.getElementById('range_r').value = parseInt(text_a.value.substring(0, 2), 16); "
  133.       " document.getElementById('range_g').value = parseInt(text_a.value.substring(2, 4), 16); "
  134.       " document.getElementById('range_b').value = parseInt(text_a.value.substring(4, 6), 16); "
  135.       " updateSummaryColor(); "
  136.      " } "
  137.      " function setMode(val_m) { "
  138.       " document.getElementById('range_m').value = val_m; "
  139.       " updateSummaryColor(); "
  140.      " } "
  141.      " // window.onload = updateSummaryColor; "
  142.     " </script> "
  143.     " <div style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center; display: grid; grid-template-columns: 100%; row-gap: 2%; column-gap: 1%;'> "
  144.      " <div style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center; display: grid; grid-template-columns: 7% 74% 17%; row-gap: 2%; column-gap: 1%;'> "
  145.       " <text id='rgb' name='rgb' style='height: 100%; width: 100%; margin: 0%; text-align: right; font-family: inherit; font-weight: inherit; background: #ffffff; color: #000000;'>RGB</text> "
  146.       " <button id='my_toggler' onclick='toggleDetails()' style='width: 100%; margin: 0%; font-family: inherit; font-weight: inherit;'> "
  147.        " <details id='my_details' onclick='toggleDetails()' style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center; font-family: inherit; font-weight: inherit; background: #ffffff; color: #000000;'> "
  148.         " <summary id='my_summary'>Palette</summary> "
  149.         " <iframe style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center;' srcdoc=\" "
  150.          " <body style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center;'> "
  151.           " <canvas id='colorspace' style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center;'></canvas> "
  152.          " </body> "
  153.          " <script type='text/javascript'> "
  154.           " (function () { "
  155.            " var canvas = document.getElementById('colorspace'); "
  156.            " var ctx = canvas.getContext('2d'); "
  157.            " function drawCanvas() { "
  158.             " var colours = ctx.createLinearGradient(0, 0, window.innerWidth, 0); "
  159.             " for (var i = 0; i <= 360; i += 10) { "
  160.              " colours.addColorStop((i/360), 'hsl(' + i + ', 100%, 50%)'); "
  161.             " } "
  162.             " ctx.fillStyle = colours; "
  163.             " ctx.fillRect(0, 0, window.innerWidth, window.innerHeight); "
  164.             " var luminance = ctx.createLinearGradient(0, 0, 0, ctx.canvas.height); "
  165.             " luminance.addColorStop(0,    '#ffffff'); "
  166.             " luminance.addColorStop(0.05, '#ffffff'); "
  167.             " luminance.addColorStop(0.5,  'rgba(0,0,0,0)'); "
  168.             " luminance.addColorStop(0.95, '#000000'); "
  169.             " luminance.addColorStop(1,    '#000000'); "
  170.             " ctx.fillStyle = luminance; "
  171.             " ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height); "
  172.            " } "
  173.            " var eventLocked = false; "
  174.            " function handleEvent(clientX, clientY) { "
  175.             " if (eventLocked) { "
  176.              " return; "
  177.             " } "
  178.             " function colourCorrect(v) { "
  179.              " return Math.round(1023 - ((v * v)/64)); "
  180.             " } "
  181.             " var data = ctx.getImageData(clientX, clientY, 1, 1).data; "
  182.             " my_r     =        (parseInt(data[0], 10 )).toString(16).padStart(2, '0'); "
  183.             " my_r_inv = (255 - (parseInt(data[0], 10))).toString(16).padStart(2, '0'); "
  184.             " my_g     =        (parseInt(data[1], 10 )).toString(16).padStart(2, '0'); "
  185.             " my_g_inv = (255 - (parseInt(data[1], 10))).toString(16).padStart(2, '0'); "
  186.             " my_b     =        (parseInt(data[2], 10 )).toString(16).padStart(2, '0'); "
  187.             " my_b_inv = (255 - (parseInt(data[2], 10))).toString(16).padStart(2, '0'); "
  188.             " function drawCoordinates(x,y) { "
  189.              " var ctx = document.getElementById('colorspace').getContext('2d'); "
  190.              " var pointSize = 3; "
  191.              " ctx.fillStyle = '#' + my_r_inv + my_g_inv + my_b_inv; "
  192.              " ctx.beginPath(); "
  193.              " ctx.arc(x, y, pointSize, 0, Math.PI * 2, true); "
  194.              " ctx.fill(); "
  195.             " } "
  196.             " drawCanvas(); "
  197.             " drawCoordinates(clientX, clientY); "
  198.             " var my_details = parent.document.getElementById('my_details'); "
  199.             " my_details.style.background = '#' + my_r     + my_g     + my_b; "
  200.             " my_details.style.color      = '#' + my_r_inv + my_g_inv + my_b_inv; "
  201.             " function updateSliders(val_r, val_g, val_b) { "
  202.              " parent.document.getElementById('range_r').value = val_r; "
  203.              " parent.document.getElementById('range_g').value = val_g; "
  204.              " parent.document.getElementById('range_b').value = val_b; "
  205.              " parent.document.getElementById('text_r').value = (parseInt(val_r, 10 )).toString(16).padStart(2, '0'); "
  206.              " parent.document.getElementById('text_g').value = (parseInt(val_g, 10 )).toString(16).padStart(2, '0'); "
  207.              " parent.document.getElementById('text_b').value = (parseInt(val_b, 10 )).toString(16).padStart(2, '0'); "
  208.              " parent.document.getElementById('text_a').value = parent.document.getElementById('text_r').value + "
  209.              "                                                  parent.document.getElementById('text_g').value + "
  210.              "                                                  parent.document.getElementById('text_b').value; "
  211.             " } "
  212.             " updateSliders(parseInt(data[0], 10), parseInt(data[1], 10), parseInt(data[2], 10)); "
  213.             " var params = [ "
  214.              " 'r=' + colourCorrect(data[0]), "
  215.              " 'g=' + colourCorrect(data[1]), "
  216.              " 'b=' + colourCorrect(data[2]), "
  217.              " 'm=' + parseInt(parent.document.getElementById('range_m').value, 10) "
  218.              " ].join('&'); "
  219.             " var req = new XMLHttpRequest(); "
  220.             " req.open('POST', '?' + params, true); "
  221.             " req.send(); "
  222.             " eventLocked = true; "
  223.             " req.onreadystatechange = function() { "
  224.              " if (req.readyState == 4) { "
  225.               " eventLocked = false; "
  226.              " } "
  227.             " } "
  228.            " } "
  229.            " canvas.addEventListener('click', function(event) { "
  230.             " var rect = canvas.getBoundingClientRect(); "
  231.             " var my_x = event.clientX - rect.left; "
  232.             " var my_y = event.clientY - rect.top; "
  233.             " handleEvent(my_x, my_y); "
  234.             " }, false); "
  235.            " canvas.addEventListener('touchmove', function(event) { "
  236.             " var rect = canvas.getBoundingClientRect(); "
  237.             " var my_x = event.touches[0].clientX - rect.left; "
  238.             " var my_y = event.touches[0].clientY - rect.top; "
  239.             " handleEvent(my_x, my_y); "
  240.             " }, false); "
  241.            " function resizeCanvas() { "
  242.             " var rect = canvas.getBoundingClientRect(); "
  243.             " canvas.width  = window.innerWidth - rect.left; "
  244.             " canvas.height = window.innerHeight - rect.top - 4; "
  245.             " drawCanvas(); "
  246.            " } "
  247.            " window.addEventListener('resize', resizeCanvas, false); "
  248.            " resizeCanvas(); "
  249.            " document.ontouchmove = function(e) { e.preventDefault() }; "
  250.           " })(); "
  251.          " </script> "
  252.          " \"> "
  253.         " </iframe> "
  254.        " </details> "
  255.       " </button> "
  256.       " <input type='text'  id='text_a'  name='text_a' size='6' maxlength='6' value='ffffff'  onchange='changedText_a();'                      style='height:  75%; margin: 0%; text-align: center; font-family: inherit; font-weight: inherit;'> "
  257.       " <text id='r__'    name='r__'    style='height: 100%; width: 100%; margin: 0%; text-align: right; font-family: inherit; font-weight: inherit; background: #ffffff; color: #ff0000;'>RED</text> "
  258.       " <input type='range' id='range_r' name='range_r' min='0' max='255'     value='255'    onchange='updateSummaryColor();'                  style='height: 100%; margin: 0%; display: flex; flex-grow: 1; flex-shrink: 1; flex-basis: auto;'> "
  259.       " <input type='text'  id='text_r'  name='text_r' size='2' maxlength='2' value='ff'      onchange='changedText(\"range_r\", \"text_r\", 16);' style='height:  75%; margin: 0%; text-align: center; font-family: inherit; font-weight: inherit;'> "
  260.       " <text id='_g_'    name='_g_'    style='height: 100%; width: 100%; margin: 0%; text-align: right; font-family: inherit; font-weight: inherit; background: #ffffff; color: #00ff00;'>GRE</text> "
  261.       " <input type='range' id='range_g' name='range_g' min='0' max='255'     value='255'    onchange='updateSummaryColor();'                  style='height: 100%; margin: 0%; display: flex; flex-grow: 1; flex-shrink: 1; flex-basis: auto;'> "
  262.       " <input type='text'  id='text_g'  name='text_g' size='2' maxlength='2' value='ff'      onchange='changedText(\"range_g\", \"text_g\", 16);' style='height:  75%; margin: 0%; text-align: center; font-family: inherit; font-weight: inherit;'> "
  263.       " <text id='__b'    name='__b'    style='height: 100%; width: 100%; margin: 0%; text-align: right; font-family: inherit; font-weight: inherit; background: #ffffff; color: #0000ff;'>BLU</text> "
  264.       " <input type='range' id='range_b' name='range_b' min='0' max='255'     value='255'    onchange='updateSummaryColor();'                  style='height: 100%; margin: 0%; display: flex; flex-grow: 1; flex-shrink: 1; flex-basis: auto;'> "
  265.       " <input type='text'  id='text_b'  name='text_b' size='2' maxlength='2' value='ff'      onchange='changedText(\"range_b\", \"text_b\", 16);' style='height:  75%; margin: 0%; text-align: center; font-family: inherit; font-weight: inherit;'> "
  266.       " <text id='mod'    name='mod'    style='height: 100%; width: 100%; margin: 0%; text-align: right; font-family: inherit; font-weight: inherit; background: #ffffff; color: #000000;'>MOD</text> "
  267.       " <input type='range' id='range_m' name='range_m' min='0' max='55'      value='0'      onchange='updateSummaryColor();'                  style='height: 100%; margin: 0%; display: flex; flex-grow: 1; flex-shrink: 1; flex-basis: auto;'> "
  268.       " <input type='text'  id='text_m'  name='text_m' size='2' maxlength='2' value='00'      onchange='changedText(\"range_m\", \"text_m\", 10);' style='height:  75%; margin: 0%; text-align: center; font-family: inherit; font-weight: inherit;'> "
  269.       " <div></div> "
  270.       " <div> "
  271.        " <button id='effect_00' onclick='setMode(00)' style='height: 100%; width: 100%; margin: 0%; font-family: inherit; font-weight: inherit;'>00. STATIC</button> "
  272.       " </div> "
  273.       " <div></div> "
  274.       " <div></div> "
  275.       " <div><pre></pre></div> "
  276.       " <div></div> "
  277.      " </div> "
  278.      " <div style='height: 100%; width: 100%; margin: 0%; align-items: center; justify-content: center; display: flex; flex-grow: 1; flex-shrink: 1; flex-basis: auto; flex-direction: column; overflow-y: scroll;'> "
  279.       " <div style='height: 100%; width: 100%; margin: 0%; justify-content: center; display: grid; grid-template-columns: 19% 19% 19% 19% 19%; row-gap: 1%; column-gap: 1%;'> "
  280.        " <button id='effect_01' onclick='setMode(01)' style='font-family: inherit; font-weight: inherit;'>01. Blink</button> "
  281.        " <button id='effect_02' onclick='setMode(02)' style='font-family: inherit; font-weight: inherit;'>02. Breath</button> "
  282.        " <button id='effect_03' onclick='setMode(03)' style='font-family: inherit; font-weight: inherit;'>03. Color Wipe</button> "
  283.        " <button id='effect_04' onclick='setMode(04)' style='font-family: inherit; font-weight: inherit;'>04. Color Wipe Inverse</button> "
  284.        " <button id='effect_05' onclick='setMode(05)' style='font-family: inherit; font-weight: inherit;'>05. Color Wipe Reverse</button> "
  285.        " <button id='effect_06' onclick='setMode(06)' style='font-family: inherit; font-weight: inherit;'>06. Color Wipe IRverse</button> "
  286.        " <button id='effect_07' onclick='setMode(07)' style='font-family: inherit; font-weight: inherit;'>07. Color Wipe Random</button> "
  287.        " <button id='effect_08' onclick='setMode(08)' style='font-family: inherit; font-weight: inherit;'>08. Random Color</button> "
  288.        " <button id='effect_09' onclick='setMode(09)' style='font-family: inherit; font-weight: inherit;'>09. Single Dynamic</button> "
  289.        " <button id='effect_10' onclick='setMode(10)' style='font-family: inherit; font-weight: inherit;'>10. Multi Dynamic</button> "
  290.        " <button id='effect_11' onclick='setMode(11)' style='font-family: inherit; font-weight: inherit;'>11. Rainbow</button> "
  291.        " <button id='effect_12' onclick='setMode(12)' style='font-family: inherit; font-weight: inherit;'>12. Rainbow Cycle</button> "
  292.        " <button id='effect_13' onclick='setMode(13)' style='font-family: inherit; font-weight: inherit;'>13. Scan</button> "
  293.        " <button id='effect_14' onclick='setMode(14)' style='font-family: inherit; font-weight: inherit;'>14. Dual Scan</button> "
  294.        " <button id='effect_15' onclick='setMode(15)' style='font-family: inherit; font-weight: inherit;'>15. Fade</button> "
  295.        " <button id='effect_16' onclick='setMode(16)' style='font-family: inherit; font-weight: inherit;'>16. Theater Chase</button> "
  296.        " <button id='effect_17' onclick='setMode(17)' style='font-family: inherit; font-weight: inherit;'>17. Theater Chase Rainbow</button> "
  297.        " <button id='effect_18' onclick='setMode(18)' style='font-family: inherit; font-weight: inherit;'>18. Running Lights</button> "
  298.        " <button id='effect_19' onclick='setMode(19)' style='font-family: inherit; font-weight: inherit;'>19. Twinkle</button> "
  299.        " <button id='effect_20' onclick='setMode(20)' style='font-family: inherit; font-weight: inherit;'>20. Twinkle Random</button> "
  300.        " <button id='effect_21' onclick='setMode(21)' style='font-family: inherit; font-weight: inherit;'>21. Twinkle Fade</button> "
  301.        " <button id='effect_22' onclick='setMode(22)' style='font-family: inherit; font-weight: inherit;'>22. Twinkle Fade Random</button> "
  302.        " <button id='effect_23' onclick='setMode(23)' style='font-family: inherit; font-weight: inherit;'>23. Sparkle</button> "
  303.        " <button id='effect_24' onclick='setMode(24)' style='font-family: inherit; font-weight: inherit;'>24. Flash Sparkle</button> "
  304.        " <button id='effect_25' onclick='setMode(25)' style='font-family: inherit; font-weight: inherit;'>25. Hyper Sparkle</button> "
  305.        " <button id='effect_26' onclick='setMode(26)' style='font-family: inherit; font-weight: inherit;'>26. Strobe</button> "
  306.        " <button id='effect_27' onclick='setMode(27)' style='font-family: inherit; font-weight: inherit;'>27. Strobe Rainbow</button> "
  307.        " <button id='effect_28' onclick='setMode(28)' style='font-family: inherit; font-weight: inherit;'>28. Multi Strobe</button> "
  308.        " <button id='effect_29' onclick='setMode(29)' style='font-family: inherit; font-weight: inherit;'>29. Blink Rainbow</button> "
  309.        " <button id='effect_30' onclick='setMode(30)' style='font-family: inherit; font-weight: inherit;'>30. Chase White</button> "
  310.        " <button id='effect_31' onclick='setMode(31)' style='font-family: inherit; font-weight: inherit;'>31. Chase Color</button> "
  311.        " <button id='effect_32' onclick='setMode(32)' style='font-family: inherit; font-weight: inherit;'>32. Chase Random</button> "
  312.        " <button id='effect_33' onclick='setMode(33)' style='font-family: inherit; font-weight: inherit;'>33. Chase Rainbow</button> "
  313.        " <button id='effect_34' onclick='setMode(34)' style='font-family: inherit; font-weight: inherit;'>34. Chase Flash</button> "
  314.        " <button id='effect_35' onclick='setMode(35)' style='font-family: inherit; font-weight: inherit;'>35. Chase Flash Random</button> "
  315.        " <button id='effect_36' onclick='setMode(36)' style='font-family: inherit; font-weight: inherit;'>36. Chase Rainbow White</button> "
  316.        " <button id='effect_37' onclick='setMode(37)' style='font-family: inherit; font-weight: inherit;'>37. Chase Blackout</button> "
  317.        " <button id='effect_38' onclick='setMode(38)' style='font-family: inherit; font-weight: inherit;'>38. Chase Blackout Rainbow</button> "
  318.        " <button id='effect_39' onclick='setMode(39)' style='font-family: inherit; font-weight: inherit;'>39. Color Sweep Random</button> "
  319.        " <button id='effect_40' onclick='setMode(40)' style='font-family: inherit; font-weight: inherit;'>40. Running Color</button> "
  320.        " <button id='effect_41' onclick='setMode(41)' style='font-family: inherit; font-weight: inherit;'>41. Running Red Blue</button> "
  321.        " <button id='effect_42' onclick='setMode(42)' style='font-family: inherit; font-weight: inherit;'>42. Running Random</button> "
  322.        " <button id='effect_43' onclick='setMode(43)' style='font-family: inherit; font-weight: inherit;'>43. Larson Scanner</button> "
  323.        " <button id='effect_44' onclick='setMode(44)' style='font-family: inherit; font-weight: inherit;'>44. Comet</button> "
  324.        " <button id='effect_45' onclick='setMode(45)' style='font-family: inherit; font-weight: inherit;'>45. Fireworks</button> "
  325.        " <button id='effect_46' onclick='setMode(46)' style='font-family: inherit; font-weight: inherit;'>46. Fireworks Random</button> "
  326.        " <button id='effect_47' onclick='setMode(47)' style='font-family: inherit; font-weight: inherit;'>47. Merry Christmas</button> "
  327.        " <button id='effect_48' onclick='setMode(48)' style='font-family: inherit; font-weight: inherit;'>48. Fire Flicker</button> "
  328.        " <button id='effect_49' onclick='setMode(49)' style='font-family: inherit; font-weight: inherit;'>49. Fire Flicker Soft</button> "
  329.        " <button id='effect_50' onclick='setMode(50)' style='font-family: inherit; font-weight: inherit;'>50. Fire Flicker Intense</button> "
  330.        " <button id='effect_51' onclick='setMode(51)' style='font-family: inherit; font-weight: inherit;'>51. Circus Combustus</button> "
  331.        " <button id='effect_52' onclick='setMode(52)' style='font-family: inherit; font-weight: inherit;'>52. Halloween</button> "
  332.        " <button id='effect_53' onclick='setMode(53)' style='font-family: inherit; font-weight: inherit;'>53. 2-color Chase</button> "
  333.        " <button id='effect_54' onclick='setMode(54)' style='font-family: inherit; font-weight: inherit;'>54. 3-color Chase</button> "
  334.        " <button id='effect_55' onclick='setMode(55)' style='font-family: inherit; font-weight: inherit;'>55. Twinkle Fox</button> "
  335.       " </div> "
  336.      " </div> "
  337.     " </div> "
  338.    " </body> "
  339.   " </html> ";
  340. //////////////////////////////////////////////////////////////////////////////////////////////////
  341.  
  342. static uint32_t strip_color(uint8_t r, uint8_t g, uint8_t b)
  343. {
  344.   return ((uint32_t)r << 16) | ((uint32_t)g << 8) | b;
  345. }
  346.  
  347. void serial_printhex(uint32_t num, uint16_t digits)
  348. {
  349.   if ((digits >= 3) && (num < 0x100)) {
  350.     Serial.print("0");
  351.   }
  352.   if ((digits >= 2) && (num < 0x10)) {
  353.     Serial.print("0");
  354.   }
  355.   Serial.print(num, HEX);
  356. }
  357.  
  358. void strip_setPixelColor(uint32_t n, uint8_t r, uint8_t g, uint8_t b)
  359. {
  360.   Serial.print("[");
  361.   serial_printhex(n, 3);
  362.   Serial.print("_");
  363.   serial_printhex(r, 2);
  364.   serial_printhex(g, 2);
  365.   serial_printhex(b, 2);
  366.   Serial.print("]");
  367.   return;
  368. }
  369.  
  370. void strip_setStripColor(uint8_t r, uint8_t g, uint8_t b)
  371. {
  372.   Serial.print("[@@@_");
  373.   serial_printhex(r, 2);
  374.   serial_printhex(g, 2);
  375.   serial_printhex(b, 2);
  376.   Serial.print("]");
  377.   return;
  378. }
  379.  
  380. void strip_show(uint8_t mod)
  381. {
  382.   switch(mod)
  383.   {
  384.           /**** ASCII: 32 - 47 *****/
  385.           /***  !"#$%&'()*+,-./ ****/
  386.       case  0 ... 15 :
  387.         Serial.print((char)(32 + mod));
  388.         break;
  389.           /**** ASCII: 71 - 90 *****/
  390.           /* GHIJKLMNOPQRSTUVWXYZ **/
  391.       case 16 ... 35 :
  392.         Serial.print((char)(55 + mod));
  393.         break;
  394.           /*** ASCII: 103 - 123 ****/
  395.           /* ghijklmnopqrstuvwxyz{ */
  396.       case 36 ... 56 :
  397.         Serial.print((char)(67 + mod));
  398.         break;
  399.           /******* ASCII: 32 *******/
  400.           /***********   ***********/
  401.       default:
  402.         Serial.print(" ");
  403.   }
  404.   return;
  405. }
  406.  
  407. void strip_setPixelColor(uint32_t n, uint32_t c)
  408. {
  409.   uint8_t r = (uint8_t)(c >> 16);
  410.   uint8_t g = (uint8_t)(c >> 8);
  411.   uint8_t b = (uint8_t)c;
  412.   strip_setPixelColor(n, r, g, b);
  413. }
  414.  
  415. void handleRGB()
  416. {
  417.   // Serial.println("handle RGB..");
  418.  
  419.   webServer.send(200, "text/html", webpageRGB);
  420.  
  421.   String red   = webServer.arg(0); // read RGB arguments
  422.   String green = webServer.arg(1);
  423.   String blue  = webServer.arg(2);
  424.  
  425.   uint8_t mod = webServer.arg(3).toInt();
  426.  
  427.   allRGB(255 - red.toInt() / 4, 255 - green.toInt() / 4, 255 - blue.toInt() / 4, mod);
  428. }
  429.  
  430. //////////////////////////////////////////////////////////////////////////////////////////////////
  431.  //////////////////////////////////////////////////////////////////////////////////////////////////
  432.  //////////////////////////////////////////////////////////////////////////////////////////////////
  433.  
  434. void setup()
  435. {
  436.  /*
  437.   * It is recommended to use the lower baud rate. The higher the baud rate,
  438.   * the higher the bit error rate will be, and the control action might fail.
  439.   */
  440.   Serial.begin(4800); // Initialize the ESP8266 <=> MEGA2560 serial port
  441.  
  442.   /* STRIP */// strip.begin();
  443.   strip_show(MODE_INDIVIDUAL); // Initialize all pixels to 'off'
  444.   /* STRIP */// strip.setBrightness(250); // 0-255 range
  445.  
  446.   animation = false;
  447.  
  448.   if (!animation) { // start webserver
  449.     allRGB(0, 0, 0, MODE_INDIVIDUAL);
  450.     delay(1000);
  451.     // Serial.println("Starting webserver...");
  452.  
  453.     WiFi.mode(WIFI_AP);
  454.     WiFi.softAPConfig(local_ip, gateway, subnet);
  455.     WiFi.softAP(ssid, password);
  456.  
  457.     // if DNSServer is started with "*" for domain name, it will reply with provided IP to all DNS request
  458.     dnsServer.start(DNS_PORT, "esp", local_ip);
  459.     webServer.on("/", handleRGB);
  460.  
  461.     webServer.begin();
  462.  
  463.     introRed(); // knightrider
  464.     // colorWipe(0x859d12, 5);
  465.     // rainbow(5);
  466.     // rainbowCycle(5);
  467.     // theaterChaseRainbow(5);
  468.     // theaterChase(0x7e1ae1, 5);
  469.     // colorWipe(0x123456, 5);
  470.  
  471.     //// strip_setPixelColor(0, 255, 0, 0);
  472.     //// strip_setPixelColor(3, 255, 0, 0);
  473.     //// strip_setPixelColor(4, 255, 0, 0);
  474.     //// strip_setPixelColor(7, 255, 0, 0);
  475.     strip_show(MODE_INDIVIDUAL);
  476. /*
  477.  * CURRENT LOG:
  478.  * CLEAR_ALL, CLEAR_ALL + 0 LED RED, CLEAR_ALL + 1 LED RED, ..., CLEAR_ALL + 7 LED RED,
  479.  * CLEAR_ALL + 6 LED RED, ..., CLEAR_ALL + 0 LED RED, ..., CLEAR_ALL + 7 LED RED, ...,
  480.  * CLEAR_ALL + 1 LED RED, CLEAR_ALL, 8 LED RED (???), 0 + 3 + 4 + 7 LED RED
  481.  */
  482.   }
  483.   else {
  484.     WiFi.disconnect();
  485.     WiFi.softAPdisconnect(true);
  486.     WiFi.mode(WIFI_STA);
  487.     // Serial.println("Starting animation...");
  488.   }
  489. }
  490.  
  491. //////////////////////////////////////////////////////////////////////////////////////////////////
  492.  
  493. void loop()
  494. {
  495.   if (animation) {
  496.     rainbow(20);
  497.     rainbowCycle(20);
  498.     theaterChaseRainbow(50);
  499.   }
  500.   else {
  501.     dnsServer.processNextRequest();
  502.     webServer.handleClient();
  503.   }
  504. }
  505.  //////////////////////////////////////////////////////////////////////////////////////////////////
  506.  /////////////////////// NEOPIXEL FUNCTIONS //////////////////////////////////////////////////
  507.  //////////////////////////////////////////////////////////////////////////////////////////////////
  508.  
  509. // Fill the dots one after the other with a color
  510. void colorWipe(uint32_t c, uint8_t wait)
  511. {
  512.   uint32_t i;
  513.  
  514.   for (i = 0; i < STRIP_NUMPIXELS; i++) {
  515.     strip_setPixelColor(i, c);
  516.     strip_show(MODE_INDIVIDUAL);
  517.     delay(wait);
  518.   }
  519. }
  520.  
  521. void rainbow(uint8_t wait)
  522. {
  523.   uint32_t i;
  524.   uint16_t j;
  525.  
  526.   for (j = 0; j < 256; j++) {
  527.     for (i = 0; i < STRIP_NUMPIXELS; i++) {
  528.       strip_setPixelColor(i, Wheel((i + j) & 255));
  529.     }
  530.     strip_show(MODE_INDIVIDUAL);
  531.     delay(wait);
  532.   }
  533. }
  534.  
  535. // Slightly different, this makes the rainbow equally distributed throughout
  536. void rainbowCycle(uint8_t wait)
  537. {
  538.   uint32_t i;
  539.   uint16_t j;
  540.  
  541.   for (j = 0; j < 256 * 5; j++) { // 5 cycles of all colors on wheel
  542.     for (i = 0; i < STRIP_NUMPIXELS; i++) {
  543.       strip_setPixelColor(i, Wheel(((i * 256 / STRIP_NUMPIXELS) + j) & 255));
  544.     }
  545.     strip_show(MODE_INDIVIDUAL);
  546.     delay(wait);
  547.   }
  548. }
  549.  
  550. //Theatre-style crawling lights.
  551. void theaterChase(uint32_t c, uint8_t wait)
  552. {
  553.   uint32_t i;
  554.   uint16_t j, q;
  555.  
  556.   for (j = 0; j < 10; j++) { //do 10 cycles of chasing
  557.     for (q = 0; q < 3; q++) {
  558.       for (i = 0; i < STRIP_NUMPIXELS; i = i + 3) {
  559.         strip_setPixelColor(i + q, c); //turn every third pixel on
  560.       }
  561.       strip_show(MODE_INDIVIDUAL);
  562.  
  563.       delay(wait);
  564.  
  565.       for (i = 0; i < STRIP_NUMPIXELS; i = i + 3) {
  566.         strip_setPixelColor(i + q, 0); //turn every third pixel off
  567.       }
  568.     }
  569.   }
  570. }
  571.  
  572. //Theatre-style crawling lights with rainbow effect
  573. void theaterChaseRainbow(uint8_t wait)
  574. {
  575.   uint32_t i;
  576.   uint16_t j, q;
  577.  
  578.   for (j = 0; j < 256; j++) { // cycle all 256 colors in the wheel
  579.     for (q = 0; q < 3; q++) {
  580.       for (i = 0; i < STRIP_NUMPIXELS; i = i + 3) {
  581.         strip_setPixelColor(i + q, Wheel( (i + j) % 255)); //turn every third pixel on
  582.       }
  583.       strip_show(MODE_INDIVIDUAL);
  584.  
  585.       delay(wait);
  586.  
  587.       for (i = 0; i < STRIP_NUMPIXELS; i = i + 3) {
  588.         strip_setPixelColor(i + q, 0); //turn every third pixel off
  589.       }
  590.     }
  591.   }
  592. }
  593.  
  594. // Input a value 0 to 255 to get a color value.
  595. // The colours are a transition r - g - b - back to r.
  596. uint32_t Wheel(byte WheelPos)
  597. {
  598.   WheelPos = 255 - WheelPos;
  599.   if (WheelPos < 85) {
  600.     return strip_color(255 - WheelPos * 3, 0, WheelPos * 3);
  601.   }
  602.   if (WheelPos < 170) {
  603.     WheelPos -= 85;
  604.     return strip_color(0, WheelPos * 3, 255 - WheelPos * 3);
  605.   }
  606.   WheelPos -= 170;
  607.   return strip_color(WheelPos * 3, 255 - WheelPos * 3, 0);
  608. }
  609.  
  610. //////////////////////////////// TOM NEOPIXEL //////////////////////////////////////////////////
  611.  
  612. void introRed()
  613. {
  614.   uint32_t i;
  615.   uint16_t u;
  616.  
  617.   for (u = 0; u < 3; u++) {
  618.     for (i = 0; i < STRIP_NUMPIXELS; i++) {
  619.       oneRed(i);
  620.       delay(100);
  621.     }
  622.     for (i = STRIP_NUMPIXELS - 2; i > 0 ; i--) {
  623.       oneRed(i);
  624.       delay(100);
  625.     }
  626.   }
  627.   /* STRIP */// oneRed(STRIP_NUMPIXELS); // switch all off (switch on only 8, but beyond range)
  628.   for (i = 0; i < STRIP_NUMPIXELS; i++) {
  629.     strip_setPixelColor(i, 0, 0, 0);
  630.   }
  631. }
  632.  
  633. void oneRed(uint32_t u)
  634. {
  635.   uint32_t i;
  636.  
  637.   for (i = 0; i < STRIP_NUMPIXELS; i++) {
  638.     strip_setPixelColor(i, 0, 0, 0);
  639.   }
  640.   strip_setPixelColor(u, 255, 0, 0);
  641.   strip_show(MODE_INDIVIDUAL);
  642. }
  643.  
  644. void allRGB(uint8_t r, uint8_t g, uint8_t b, uint8_t mod)
  645. {
  646.   uint32_t i;
  647.   /*
  648.   for (i = 0; i < STRIP_NUMPIXELS; i++) {
  649.     strip_setPixelColor(i, r, g, b);
  650.   }
  651.   */
  652.   strip_setStripColor(r, g, b);
  653.   strip_show(mod);
  654. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!