Merge branch 'master' of https://github.com/NimmLor/esp8266-fastled-webserver

2019-02-24 21:48:27 +01:00 · 2019-02-24 21:48:27 +01:00 · 200d3c06c9
commit 200d3c06c9
parent 539804fbc8 3132613ad5
15 changed files with 66 additions and 40 deletions
--- a/README.md
+++ b/README.md
@ -3,7 +3,7 @@ Nanoleaf Web Server

 This is a fork of [jasoncoon's esp8266 fastled webserver](https://github.com/jasoncoon/esp8266-fastled-webserver) that was adapted to control the colors of my  [DIY-Nanoleaf Replica](https://www.thingiverse.com/thing:3354082).

-[![Nanoleafs](https://github.com/NimmLor/esp8266-fastled-webserver/blob/master/gallery/rgb_preview2.gif?raw=true)](https://www.thingiverse.com/thing:3354082)
+[![Nanoleafs](https://github.com/NimmLor/esp8266-nanoleaf-webserver/blob/master/gallery/rgb_preview2.gif?raw=true)](https://www.thingiverse.com/thing:3354082)

 Hardware
 --------
@ -46,18 +46,18 @@ Features
 ### Upcoming Features

 - **Node-RED** integration
-  - Custom-Alexa skill
+  - Simple Amazon **Alexa** integration
  - Nanoleaf voice control
  - Custom color pattern designer
  - **Node-RED** webinterface to store special patterns persistant
  - Controlling multiple nanoleafs at once
-
+- Advanced Amazon **Alexa** integration with custom skill (AWS account required, free)
 >  these features will be optional and require additional hardware (any linux/windows device that is in the same network)

 Webinterface
 --------

-![Webinterface](https://github.com/NimmLor/esp8266-fastled-webserver/blob/master/gallery/interface.jpg?raw=true)
+![Webinterface](https://github.com/NimmLor/esp8266-nanoleaf-webserver/blob/master/gallery/interface.jpg?raw=true)

 The web app is stored in SPIFFS (on-board flash memory).

@ -70,7 +70,7 @@ The app depends on the following libraries. They must either be downloaded from
 * [FastLED](https://github.com/FastLED/FastLED)
 * [Arduino WebSockets](https://github.com/Links2004/arduinoWebSockets)

-Download the app code from GitHub using the green Clone or Download button from [GitHub](https://github.com/NimmLor/esp8266-fastled-webserver) and click Download ZIP. Decompress the ZIP file in your Arduino sketch folder.
+Download the app code from GitHub using the green Clone or Download button from [GitHub](https://github.com/NimmLor/esp8266-nanoleaf-webserver) and click Download ZIP. Decompress the ZIP file in your Arduino sketch folder. Rename the folder from *esp8266-nanoleaf-webserver-master* to *esp8266-nanoleaf-webserver*

 The web app needs to be uploaded to the ESP8266's SPIFFS.  You can do this within the Arduino IDE after installing the [Arduino ESP8266FS tool](http://esp8266.github.io/Arduino/versions/2.3.0/doc/filesystem.html#uploading-files-to-file-system). An alternative would be to install the [Visual Micro](https://www.visualmicro.com/) plugin for Visual Studio.

@ -114,13 +114,13 @@ You should also set the milli-amps of your power supply to prevent power overloa

 ### Without Logic-Level Converter

-![circuit without Logic level converter](https://github.com/NimmLor/esp8266-fastled-webserver/blob/master/gallery/circuit.jpg?raw=true)
+![circuit without Logic level converter](https://github.com/NimmLor/esp8266-nanoleaf-webserver/blob/master/gallery/circuit.jpg?raw=true)



 ### With Logic-Level-Converter (required if leds 'glitch')

-![circuit with logic level converter](https://github.com/NimmLor/esp8266-fastled-webserver/blob/master/gallery/circuit_logic_level_Steckplatine.jpg?raw=true)
+![circuit with logic level converter](https://github.com/NimmLor/esp8266-nanoleaf-webserver/blob/master/gallery/circuit_logic_level_Steckplatine.jpg?raw=true)



--- a/data/index.htm
+++ b/data/index.htm
@ -1,20 +1,27 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
 <html>
+
 <head>
  <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>
+
  <!-- 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"> -->
  <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-minicolors/2.2.4/jquery.minicolors.min.css" integrity="sha256-4wnSkPYU5B4yngAlx/rEb8LdfMah4teUth4AfhGEuaY=" crossorigin="anonymous" /> -->
+
  <!-- request CSS from the ESP8266 web server -->
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <link rel="stylesheet" href="css/minicolors.min.css">
+
  <link rel="stylesheet" href="css/styles.css">
+
  <link rel="icon" href="images/atom196.png">
 </head>
+
 <body>
+
  <nav class="navbar navbar-default navbar-static-top" id="top" role="banner">
    <div class="container">
      <div class="navbar-header">
@ -29,7 +36,7 @@
      </div>
      <div class="collapse navbar-collapse" id="navbar-collapse-1">
        <ul class="nav navbar-nav">
-          <li class="active"><a href="/">DIY Nanoleaf control <span class="sr-only">(current)</span></a></li>
+          <li class="active"><a href="/">ESP8266 + FastLED <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>
@ -45,15 +52,22 @@
      </div>
    </div>
  </nav>
+
  <div id="container" class="container">
-    <form class="form-horizontal" id="form"></form>
+
+    <form class="form-horizontal" id="form">
+    </form>
+
  </div>
+
  <div id="templates" style="display: none">
+
    <div id="sectionTemplate" class="form-group">
      <div class="col-sm-12">
        <hr style="margin-bottom: 5px;margin-top: 5px;" />
      </div>
    </div>
+
    <div id="numberTemplate" class="form-group">
      <label class="col-sm-2 control-label"></label>
      <div class="col-sm-2">
@ -63,6 +77,7 @@
        <input class="form-control slider" type="range" step="1" min="0" max="255" />
      </div>
    </div>
+
    <div id="booleanTemplate" class="form-group">
      <label class="col-sm-2 control-label"></label>
      <div class="col-sm-10">
@ -72,6 +87,7 @@
        </div>
      </div>
    </div>
+
    <div id="selectTemplate" class="form-group">
      <label class="col-sm-2 control-label"></label>
      <div class="col-sm-8">
@ -100,6 +116,7 @@
        </div>
      </div>
    </div>
+
    <div id="selectTemplate" class="form-group">
      <label class="col-sm-2 control-label"></label>
      <div class="col-sm-8">
@ -118,6 +135,7 @@
        </div>
      </div>
    </div>
+
    <div id="colorPaletteTemplate" class="form-group"> 
      <label class="col-sm-2 control-label color-label"></label>
 	  
@ -165,6 +183,7 @@
        </div>
      </div>
    </div>
+
    <div id="colorTemplate">
      <div class="form-group">
        <!-- <label class="col-sm-2 control-label color-label"></label> -->
@ -200,7 +219,9 @@
        </div>
      </div>
    </div>
+
  </div>
+
  <nav class="navbar navbar-default navbar-fixed-bottom">
    <div class="container">
      <div class="navbar-header">
@ -223,16 +244,21 @@
      </div>
    </div>
  </nav>
+
  <!-- request js from internet CDN -->
  <!-- <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> -->
  <!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> -->
  <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-minicolors/2.2.4/jquery.minicolors.min.js" integrity="sha256-XAFQ9dZ6hy8p/GRhU8h/8pMvM1etymiJLZW1CiHV3bQ=" crossorigin="anonymous"></script> -->
  <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/reconnecting-websocket/1.0.0/reconnecting-websocket.min.js" integrity="sha256-A4JwlcDvqO4JXpvEtvWY1RH8JAEMu5W21wP8GUXLUNs=" crossorigin="anonymous"></script> -->
+
  <!-- request js from the ESP8266 web server -->
  <script src="js/jquery-3.1.1.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="js/minicolors.min.js"></script>
  <script src="js/r-websocket.min.js"></script>
+
  <script src="js/app.js"></script>
+
 </body>
+
 </html>
--- a/esp8266-nanoleaf-webserver.ino
+++ b/esp8266-nanoleaf-webserver.ino
--- a/gallery/DSC_8616.JPG
+++ b/gallery/DSC_8616.JPG
--- a/gallery/DSC_8617.JPG
+++ b/gallery/DSC_8617.JPG
--- a/gallery/DSC_8619.JPG
+++ b/gallery/DSC_8619.JPG
--- a/gallery/DSC_8620.JPG
+++ b/gallery/DSC_8620.JPG
--- a/gallery/electronics_box.jpg
+++ b/gallery/electronics_box.jpg
--- a/gallery/electronics_box_level_shift.jpg
+++ b/gallery/electronics_box_level_shift.jpg
--- a/gallery/rgb_preview.gif
+++ b/gallery/rgb_preview.gif
--- a/web-app-simple-thumb.png
+++ b/web-app-simple-thumb.png
--- a/web-app-simple.png
+++ b/web-app-simple.png
--- a/web-app-thumb.png
+++ b/web-app-thumb.png
--- a/web-app.png
+++ b/web-app.png
--- a/webapp.png
+++ b/webapp.png