Added to github
This commit is contained in:
Mountain-Pitt
parent
0ee7c65b6e
commit
3355828923
|
|
@ -0,0 +1,56 @@
|
|||
void append_page_header() {
|
||||
webpage = F("<!DOCTYPE html><html>");
|
||||
webpage += F("<head>");
|
||||
webpage += F("<title>File MK-BlindControl</title>"); // NOTE: 1em = 16px
|
||||
webpage += F("<meta name='viewport' content='user-scalable=yes,initial-scale=1.0,width=device-width'>");
|
||||
webpage += F("<style>");
|
||||
webpage += F("body{max-width:65%;margin:0 auto;font-family:arial;font-size:105%;text-align:center;color:blue;background-color:#F7F2Fd;}");
|
||||
webpage += F("ul{list-style-type:none;margin:0.1em;padding:0;border-radius:0.375em;overflow:hidden;background-color:#dcade6;font-size:1em;}");
|
||||
webpage += F("li{float:left;border-radius:0.375em;border-right:0.06em solid #bbb;}last-child {border-right:none;font-size:85%}");
|
||||
webpage += F("li a{display: block;border-radius:0.375em;padding:0.44em 0.44em;text-decoration:none;font-size:85%}");
|
||||
webpage += F("li a:hover{background-color:#EAE3EA;border-radius:0.375em;font-size:85%}");
|
||||
webpage += F("section {font-size:0.88em;}");
|
||||
webpage += F("h1{color:white;border-radius:0.5em;font-size:1em;padding:0.2em 0.2em;background:#558ED5;}");
|
||||
webpage += F("h2{color:orange;font-size:1.0em;}");
|
||||
webpage += F("h3{font-size:0.8em;}");
|
||||
webpage += F("table{font-family:arial,sans-serif;font-size:0.9em;border-collapse:collapse;width:85%;}");
|
||||
webpage += F("th,td {border:0.06em solid #dddddd;text-align:left;padding:0.3em;border-bottom:0.06em solid #dddddd;}");
|
||||
webpage += F("tr:nth-child(odd) {background-color:#eeeeee;}");
|
||||
webpage += F(".rcorners_n {border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:20%;color:white;font-size:75%;}");
|
||||
webpage += F(".rcorners_m {border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:50%;color:white;font-size:75%;}");
|
||||
webpage += F(".rcorners_w {border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:70%;color:white;font-size:75%;}");
|
||||
webpage += F(".column{float:left;width:50%;height:45%;}");
|
||||
webpage += F(".row:after{content:'';display:table;clear:both;}");
|
||||
webpage += F("footer{background-color:#eedfff; text-align:center;padding:0.3em 0.3em;border-radius:0.375em;font-size:60%;}");
|
||||
webpage += F("button{border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:20%;color:white;font-size:130%;}");
|
||||
webpage += F(".buttons {border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:15%;color:white;font-size:80%;}");
|
||||
webpage += F(".buttonsm{border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:9%; color:white;font-size:70%;}");
|
||||
webpage += F(".buttonm {border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:15%;color:white;font-size:70%;}");
|
||||
webpage += F(".buttonw {border-radius:0.5em;background:#558ED5;padding:0.3em 0.3em;width:40%;color:white;font-size:70%;}");
|
||||
webpage += F("a{font-size:75%;}");
|
||||
webpage += F("p{font-size:75%;}");
|
||||
webpage += F("</style></head><body><h1>MK-BlindControl "); webpage += String(ServerVersion) + "</h1>";
|
||||
}
|
||||
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
void append_page_footer(){ // Saves repeating many lines of code for HTML page footers
|
||||
webpage += F("<ul>");
|
||||
webpage += F("<li><a href='/'>Home</a></li>"); // Lower Menu bar command entries
|
||||
webpage += F("<li><a href='/firmwareupdate'>Firmware</a></li>");
|
||||
webpage += F("<li><a href='/reboot'>Reboot</a></li>");
|
||||
webpage += F("<li><a href='/reset'>Reset</a></li>");
|
||||
webpage += F("<li><a href='/set-servo'>Align</a></li>");
|
||||
webpage += F("<li><a href='/set-limits'>Limit Set</a></li>");
|
||||
webpage += F("<li><a href='/setup'>Setup</a></li>");
|
||||
webpage += F("<li><a href='/saveconfig'>Save</a></li>");
|
||||
webpage += F("<li><a href='/filemanager'>File Manager</a></li>");
|
||||
webpage += F("<li><a href='https://mountaineagle-technologies.com.au/tasmota/mkblindcontrol.html'>About</a></li>");
|
||||
webpage += F("</ul>");
|
||||
webpage += "<footer>™"+String(char(byte(0x40>>1)))+String(char(byte(0x9a>>1)))+String(char(byte(0xde>>1)))+String(char(byte(0xea>>1)))+String(char(byte(0xdc>>1)));
|
||||
webpage += String(char((0xe8>>1)))+String(char(byte(0xc2>>1)))+String(char(0xd2>>1))+String(char(0xdc>>1))+String(char(byte(0x8a>>1)));
|
||||
webpage += String(char((0xc2>>1)))+String(char(byte(0xce>>1)))+String(char(0xd8>>1))+String(char(0xca>>1))+String(char(byte(0x5a>>1)));
|
||||
webpage += String(char((0xa8>>1)))+String(char(byte(0xca>>1)))+String(char(0xc6>>1))+String(char(0xd0>>1))+String(char(byte(0xdc>>1)));
|
||||
webpage += String(char((0xde>>1)))+String(char(byte(0xd8>>1)))+String(char(0xde>>1))+String(char(0xce>>1))+String(char(byte(0xd2>>1)));
|
||||
webpage += String(char((0xca>>1)))+String(char(byte(0xe6>>1)));
|
||||
webpage += String(char(byte(0x40>>1)))+String(char(byte(0x64>>1)))+String(char(byte(0x60>>1)))+String(char(byte(0x64>>1)))+String(char(0x64>>1))+"</footer>";
|
||||
webpage += F("</body></html>");
|
||||
}
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
#ifndef HA_MQTT_DEVICE_H
|
||||
#define HA_MQTT_DEVICE_H
|
||||
|
||||
#include "Arduino.h"
|
||||
|
||||
class HAMqttDevice
|
||||
{
|
||||
public:
|
||||
enum DeviceType
|
||||
{
|
||||
ALARM_CONTROL_PANEL,
|
||||
BINARY_SENSOR,
|
||||
CAMERA,
|
||||
COVER,
|
||||
FAN,
|
||||
LIGHT,
|
||||
LOCK,
|
||||
SENSOR,
|
||||
SWITCH,
|
||||
CLIMATE,
|
||||
VACUUM
|
||||
};
|
||||
|
||||
private:
|
||||
// Device proprieties
|
||||
const String _name;
|
||||
const DeviceType _type;
|
||||
|
||||
String _identifier;
|
||||
String _topic;
|
||||
|
||||
// Config variables handling
|
||||
struct ConfigVar
|
||||
{
|
||||
String key;
|
||||
String value;
|
||||
};
|
||||
std::vector<ConfigVar> _configVars;
|
||||
|
||||
// Device attributes handling
|
||||
struct Attribute
|
||||
{
|
||||
String key;
|
||||
String value;
|
||||
};
|
||||
std::vector<Attribute> _attributes;
|
||||
|
||||
public:
|
||||
HAMqttDevice(
|
||||
const String &name,
|
||||
const DeviceType type,
|
||||
const String &haMQTTPrefix = "homeassistant");
|
||||
|
||||
~HAMqttDevice();
|
||||
|
||||
HAMqttDevice &enableCommandTopic();
|
||||
HAMqttDevice &enableStateTopic();
|
||||
HAMqttDevice &enableAttributesTopic();
|
||||
|
||||
HAMqttDevice &addConfigVar(const String &key, const String &value);
|
||||
HAMqttDevice &addAttribute(const String &key, const String &value);
|
||||
HAMqttDevice &clearAttributes();
|
||||
|
||||
const String getConfigPayload() const;
|
||||
const String getAttributesPayload() const;
|
||||
|
||||
inline const String getTopic() const { return _topic; }
|
||||
inline const String getStateTopic() const { return _topic + "/state"; }
|
||||
inline const String getConfigTopic() const { return _topic + "/config"; }
|
||||
inline const String getAttributesTopic() const { return _topic + "/attr"; }
|
||||
inline const String getCommandTopic() const { return _topic + "/cmd"; }
|
||||
|
||||
private:
|
||||
static String deviceTypeToStr(DeviceType type);
|
||||
};
|
||||
|
||||
#endif
|
||||
|
|
@ -0,0 +1,164 @@
|
|||
const char MAIN_page[] PROGMEM = R"=====(
|
||||
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html>
|
||||
|
||||
<head>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<style>
|
||||
|
||||
html {
|
||||
|
||||
font-family: Arial;
|
||||
|
||||
display: inline-block;
|
||||
|
||||
margin: 0px auto;
|
||||
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.slidecontainer {
|
||||
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.slider {
|
||||
|
||||
-webkit-appearance: none;
|
||||
|
||||
width: 50%;
|
||||
|
||||
height: 15px;
|
||||
|
||||
border-radius: 5px;
|
||||
|
||||
background: orange;
|
||||
|
||||
outline: none;
|
||||
|
||||
opacity: 0.5;
|
||||
|
||||
-webkit-transition: .2s;
|
||||
|
||||
transition: opacity .2s;
|
||||
|
||||
}
|
||||
|
||||
.slider:hover {
|
||||
|
||||
opacity: 2;
|
||||
|
||||
}
|
||||
|
||||
.slider::-webkit-slider-thumb {
|
||||
|
||||
-webkit-appearance: none;
|
||||
|
||||
appearance: none;
|
||||
|
||||
width: 25px;
|
||||
|
||||
height: 25px;
|
||||
|
||||
border-radius: 50%;
|
||||
|
||||
background: brown;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
.slider::-moz-range-thumb {
|
||||
|
||||
width: 25px;
|
||||
|
||||
height: 25px;
|
||||
|
||||
border-radius: 50%;
|
||||
|
||||
background: #4CAF50;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1> Use Mouse or Left/Right Arrow Keys to Position Blind</h1>
|
||||
<h1> For fine tunning use Left/Right Arrow Keys
|
||||
<h1> Take note of default values above as these are system generated and can change
|
||||
<h1> Click Required Set Position OPEN or CLOSED</h1>
|
||||
<h1> Click Save when done</h1>
|
||||
<h1> Click HOME to de-energise servo's when done</h1>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><br>
|
||||
|
||||
<div class="slidecontainer">
|
||||
|
||||
|
||||
<input type="range" min="0" value="90" max="180" class="slider" id="myRange">
|
||||
|
||||
<p>Servo position: <span id="demo"></span></p>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
function sendData(pos) {
|
||||
|
||||
var xhttp = new XMLHttpRequest();
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
|
||||
if (this.readyState == 4 && this.status == 200) {
|
||||
|
||||
console.log(this.responseText);
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
xhttp.open("GET", "setPOS?servoPOS="+pos, true);
|
||||
|
||||
xhttp.send();
|
||||
|
||||
}
|
||||
|
||||
var slider = document.getElementById("myRange");
|
||||
|
||||
var output = document.getElementById("demo");
|
||||
|
||||
output.innerHTML = slider.value;
|
||||
|
||||
slider.oninput = function() {
|
||||
|
||||
output.innerHTML = this.value;
|
||||
|
||||
sendData(output.innerHTML);
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
)=====";
|
||||
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
# mk-blindcontrol
|
||||
ESP8266 MQTT Servo motor control to open and close venetian blinds. Home Assistant and Openhab intergration
|
||||
Auto Discovery.
|
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue