Code Monkey home page Code Monkey logo

esp8266-nanoleaf-webserver's Introduction

This repo has been merged and moved here

https://github.com/NimmLor/esp8266-fastled-iot-webserver

LEGACY Nanoleaf Web Server

This is a fork of jasoncoon's esp8266 fastled webserver that was adapted to control the colors of my DIY-Nanoleaf Replica.

Nanoleafs

Changelog

01.02.2020, Native Alexa Update

  • NodeRED part is now DEPRECATED
  • The Nanoleaf Replica allows now for NATIVE Alexa support without the need of an extra Raspberry Pi. When added to the Smart Home devices in the Alexa app, the nanoleafs will appear as Phillips Hue devices.
  • Added Strobe Pattern
  • Added Sound Reactive support
  • Some code cleanup and new parameters to configure
  • New step by step installation instructions (Software_Installation.md)

24.02.2019, NodeRED Update (Depricated)

  • Node-RED integration was added
  • Alexa support via NodeRED

Bill of Materials

Hardware

Check out the project on Thingiverse for more details.

https://www.thingiverse.com/Surrbradl08/things

Installation

FOR INSTALLATION REFER TO THE Software_Installation.md

Features

  • Turn the LEDs on and off
  • Appear as an ALEXA SMART HOME DEVICE
  • Sound Reactive Mode
  • Adjust the brightness, color and patterns
  • Play over 30+ patterns in Autoplay

Web App

Webinterface

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

Circuit

circuit without Logic level converter

Technical

Patterns are requested by the app from the ESP8266, so as new patterns are added, they're automatically listed in the app.

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

The web app is a single page app that uses jQuery and Bootstrap. It has buttons for On/Off, a slider for brightness, a pattern selector, and a color picker (using jQuery MiniColors). Event handlers for the controls are wired up, so you don't have to click a 'Send' button after making changes. The brightness slider and the color picker use a delayed event handler, to prevent from flooding the ESP8266 web server with too many requests too quickly.

The only drawback to SPIFFS that I've found so far is uploading the files can be extremely slow, requiring several minutes, sometimes regardless of how large the files are. It can be so slow that I've been just developing the web app and debugging locally on my desktop (with a hard-coded IP for the ESP8266), before uploading to SPIFFS and testing on the ESP8266.

Alexa

The code has an optional feature to be able to control the lamp via Alexa on any Amazon Echo device. For setup instructions refer to Software_Installation.md document.

Compression

The web app files can be gzip compressed before uploading to SPIFFS by running the following command:

gzip -r data/

The ESP8266WebServer will automatically serve any .gz file. The file index.htm.gz will get served as index.htm, with the content-encoding header set to gzip, so the browser knows to decompress it. The ESP8266WebServer doesn't seem to like the Glyphicon fonts gzipped, though, so I decompress them with this command:

gunzip -r data/fonts/

REST Web services

The firmware implements basic RESTful web services using the ESP8266WebServer library. Current values are requested with HTTP GETs, and values are set with POSTs using query string parameters. It can run in connected or standalone access point modes.

esp8266-nanoleaf-webserver's People

Contributors

nimmlor avatar jasoncoon avatar pattyland avatar seanspotatobusiness avatar wardrake avatar imgbotapp avatar bwarman avatar ctaloi avatar eppfel avatar fromeijn avatar itsans avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.