Skip to content

Commit

Permalink
Add Slider card (#23)
Browse files Browse the repository at this point in the history
* Added Slider Code

* Update keywords.txt

* Credits

* Update SliderCard.vue

* Added Slider Confirmation

* Update ESPDash.cpp

* Removed SPIFFS Libraries

* Code Improvements

* Update ESPDash.h

* Update SliderCard.vue

* Added Slider Example

* Added Slider Persistence
  • Loading branch information
ayushsharma82 committed Apr 12, 2019
1 parent 494b826 commit dd5a5bb
Show file tree
Hide file tree
Showing 18 changed files with 618 additions and 134 deletions.
62 changes: 62 additions & 0 deletions examples/ESP32_slider/ESP32_slider.ino
@@ -0,0 +1,62 @@
/*
* ESP-DASH V2
* Made by Ayush Sharma
* Github URL: https://github.com/ayushsharma82/ESP-DASH
* Support Me: https://www.patreon.com/asrocks5
*
* - Version Changelog -
* V1.0.0 - 11 Nov. 2017 - Library was Born
* V1.0.1 - 13 Nov. 2017 - Fixed Empty SPIFFS Issue
* V1.0.2 - 13 Nov. 2017 - Improvements on SPIFFS Issue
* V1.0.3 - 24 Dec. 2017 - Pushing to Library Manager
*
* = Library Rewritten! =
* V2.0.0 - 25 Jan 2019 - Wohoo! A breakthrough in performance and capabilities!
*/

// This Example is a Demo of Button Capability in ESP-DASH.
// Open Dashboard after Uploading and Drag the Slider to see changes on Gauge Card


#include <Arduino.h>
#include <WiFi.h>
#include <AsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <ESPDash.h>

AsyncWebServer server(80);

const char* ssid = ""; // Your WiFi SSID
const char* password = ""; // Your WiFi Password


void sliderChanged(const char* id, int value){
Serial.println("Slider Changed - "+String(id)+" "+String(value));
ESPDash.updateGaugeChart("gauge1", value);
}


void setup() {
Serial.begin(115200);
WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
if (WiFi.waitForConnectResult() != WL_CONNECTED) {
Serial.printf("WiFi Failed!\n");
return;
}
Serial.print("IP Address: ");
Serial.println(WiFi.localIP());

ESPDash.init(server); // Initiate ESPDash and attach your Async webserver instance

// Attach Slider Change Events
ESPDash.attachSliderChanged(sliderChanged);

ESPDash.addSliderCard("slider1", "Gauge Slider", 3);
ESPDash.addGaugeChart("gauge1", "Gauge 1");
server.begin();
}

void loop() {

}
62 changes: 62 additions & 0 deletions examples/ESP8266_slider/ESP8266_slider.ino
@@ -0,0 +1,62 @@
/*
* ESP-DASH V2
* Made by Ayush Sharma
* Github URL: https://github.com/ayushsharma82/ESP-DASH
* Support Me: https://www.patreon.com/asrocks5
*
* - Version Changelog -
* V1.0.0 - 11 Nov. 2017 - Library was Born
* V1.0.1 - 13 Nov. 2017 - Fixed Empty SPIFFS Issue
* V1.0.2 - 13 Nov. 2017 - Improvements on SPIFFS Issue
* V1.0.3 - 24 Dec. 2017 - Pushing to Library Manager
*
* = Library Rewritten! =
* V2.0.0 - 25 Jan 2019 - Wohoo! A breakthrough in performance and capabilities!
*/

// This Example is a Demo of Button Capability in ESP-DASH.
// Open Dashboard after Uploading and Drag the Slider to see changes on Gauge Card


#include <Arduino.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <ESPDash.h>

AsyncWebServer server(80);

const char* ssid = ""; // Your WiFi SSID
const char* password = ""; // Your WiFi Password


void sliderChanged(const char* id, int value){
Serial.println("Slider Changed - "+String(id)+" "+String(value));
ESPDash.updateGaugeChart("gauge1", value);
}


void setup() {
Serial.begin(115200);
WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
if (WiFi.waitForConnectResult() != WL_CONNECTED) {
Serial.printf("WiFi Failed!\n");
return;
}
Serial.print("IP Address: ");
Serial.println(WiFi.localIP());

ESPDash.init(server); // Initiate ESPDash and attach your Async webserver instance

// Attach Slider Change Events
ESPDash.attachSliderChanged(sliderChanged);

ESPDash.addSliderCard("slider1", "Gauge Slider", 3);
ESPDash.addGaugeChart("gauge1", "Gauge 1");
server.begin();
}

void loop() {

}
2 changes: 2 additions & 0 deletions keywords.txt
Expand Up @@ -8,6 +8,8 @@ addHumidityCard KEYWORD2
updateHumidityCard KEYWORD2
addStatusCard KEYWORD2
updateStatusCard KEYWORD2
addSliderCard KEYWORD2
updateSliderCard KEYWORD2
addButtonCard KEYWORD2
addLineChart KEYWORD2
updateLineChart KEYWORD2
Expand Down
111 changes: 109 additions & 2 deletions src/ESPDash.cpp
Expand Up @@ -82,6 +82,24 @@ void ESPDashClass::onWsEvent(AsyncWebSocket * server, AsyncWebSocketClient * cli
Serial.println("buttonClicked Command didn't match any ID in our records! Rouge Request...");
}
}
} else if (command == "sliderChanged"){
if(ESPDash._sliderChangedFunc != NULL){
const char* sliderId = object["id"];
int sliderValue = object["value"];
for(int i=0; i < SLIDER_CARD_LIMIT; i++){
if(ESPDash.slider_card_id[i] == sliderId){
ESPDash._sliderChangedFunc(sliderId, sliderValue);
// Send Confirmation
ESPDash.slider_card_value[i] = sliderValue;
ws.textAll("{\"response\": \"updateSliderCard\", \"id\": \""+(String)sliderId+"\", \"value\": "+sliderValue+"}");
return;
}
}

if(DEBUG_MODE){
Serial.println("sliderChanged Command didn't match any ID in our records! Rouge Request...");
}
}
}
}else{
if(DEBUG_MODE){
Expand Down Expand Up @@ -556,6 +574,66 @@ void ESPDashClass::addButtonCard(const char* _id, const char* _name){
}


/////////////////
// Slider Card //
/////////////////

// Add Slider Card
void ESPDashClass::addSliderCard(const char* _id, const char* _name, int _type){
if(_id != NULL && _type >= 0 && _type <= SLIDER_CARD_TYPES){
for(int i=0; i < SLIDER_CARD_LIMIT; i++){
if(slider_card_id[i] == ""){
if(DEBUG_MODE){
Serial.println("[DASH] Found an empty slot in Slider Cards. Inserted New Card at Index ["+String(i)+"].");
}

slider_card_id[i] = _id;
slider_card_name[i] = _name;
slider_card_type[i] = _type;
slider_card_value[i] = 0;

ws.textAll("{\"response\": \"updateLayout\"}");
break;
}
}
return;
}else{
return;
}
}

// Update Slider Card with Custom Value
void ESPDashClass::updateSliderCard(const char* _id, int _value){
for(int i=0; i < SLIDER_CARD_LIMIT; i++){
if(slider_card_id[i] == _id){
if(DEBUG_MODE){
Serial.println("[DASH] Updated Slider Card at Index ["+String(i)+"].");
}

slider_card_value[i] = _value;

DynamicJsonDocument doc(250);
JsonObject object = doc.to<JsonObject>();
object["response"] = "updateSliderCard";
object["id"] = slider_card_id[i];
object["value"] = slider_card_value[i];
size_t len = measureJson(doc);
AsyncWebSocketMessageBuffer * buffer = ws.makeBuffer(len);
if (buffer) {
serializeJson(doc, (char *)buffer->get(), len + 1);
ws.textAll(buffer);
}else{
if(DEBUG_MODE){
Serial.println("[DASH] Websocket Buffer Error (updateSliderCard())");
}
}
break;
}
}
return;
}



////////////////
// Line Chart //
Expand Down Expand Up @@ -834,7 +912,6 @@ void ESPDashClass::generateLayoutResponse(String& result){
stats["sketchHash"] = ESP.getSketchMD5();
stats["macAddress"] = String(WiFi.macAddress());
stats["freeHeap"] = ESP.getFreeHeap();
// disabled temp stats["heapFragmentation"] = ESP.getHeapFragmentation();
stats["wifiMode"] = int(WiFi.getMode());
#elif defined(ESP32)
stats["chipId"] = ESP.getEfuseMac();
Expand Down Expand Up @@ -948,6 +1025,19 @@ void ESPDashClass::generateLayoutResponse(String& result){
}
}

for(int i=0; i < SLIDER_CARD_LIMIT; i++){
if(slider_card_id[i] != ""){
DynamicJsonDocument carddoc(250);
JsonObject jsoncard = carddoc.to<JsonObject>();
jsoncard["id"] = slider_card_id[i];
jsoncard["card_type"] = "slider";
jsoncard["name"] = slider_card_name[i];
jsoncard["value"] = slider_card_value[i];
jsoncard["type"] = slider_card_type[i];
cards.add(jsoncard);
}
}

serializeJson(doc, result);

if(DEBUG_MODE){
Expand Down Expand Up @@ -975,7 +1065,6 @@ void ESPDashClass::generateStatsResponse(String& result){
stats["sketchHash"] = ESP.getSketchMD5();
stats["macAddress"] = String(WiFi.macAddress());
stats["freeHeap"] = ESP.getFreeHeap();
// disabled temp stats["heapFragmentation"] = ESP.getHeapFragmentation();
stats["wifiMode"] = int(WiFi.getMode());
#elif defined(ESP32)
stats["chipId"] = ESP.getEfuseMac();
Expand Down Expand Up @@ -1076,6 +1165,13 @@ size_t ESPDashClass::getTotalResponseCapacity(){
}
}

for(int i=0; i < SLIDER_CARD_LIMIT; i++){
if(slider_card_id[i] != ""){
capacity += JSON_OBJECT_SIZE(5);
totalCards++;
}
}


capacity += JSON_ARRAY_SIZE(totalCards);
return capacity;
Expand Down Expand Up @@ -1152,5 +1248,16 @@ size_t ESPDashClass::getGaugeChartsLen(){
return total;
}

size_t ESPDashClass::getSliderCardsLen(){
size_t total = 0;
for(int i=0; i < SLIDER_CARD_LIMIT; i++){
if(slider_card_id[i] != ""){
total++;
}
}
return total;
}



ESPDashClass ESPDash;

0 comments on commit dd5a5bb

Please sign in to comment.