allen
/
COFFEE_STM32_CODE


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
							<html>
<meta charset="utf-8">
<title>Coffee Loader Demo</title>

<!--
<script src="mqttws31.min.js" type="text/javascript"></script>
-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js" type="text/javascript"></script>
<style>
button {
            background-color: white;
            border-radius:10px;
            border: 3px solid lightgray;
        }

</style>

<script>
// the URL or IP address of the MQTT server to connect to
const mqtt_server = "60.250.156.234"
// the port of the MQTT server to connect to
const mqtt_port = 8080

// the MQTT topic to publish to   9c:65:f9:1e:6c:68   b8:27:eb:84:e9:3f  b8:27:eb:f8:24:92   
const mqtt_pub_topic = "AISKY/Coffee/MK-G/b8:27:eb:7e:24:78";
// the MQTT topic to subscribe to   b8:27:eb:b4:59:3e b8:27:eb:7e:24:78
const mqtt_sub_topic = "AISKY/Coffee/MK-G/b8:27:eb:7e:24:78/Log";
var client = false;
// the function to be executed when connected to the MQTT broker
function onConnect() {
    // once connected, start subscribing to the topic
    console.log("onConnect: start subscribing to the topic");
    client.subscribe(mqtt_sub_topic, { qos: Number(2) });
}

// the function to be executed when the message is received
function onMessageArrived(message) {
    console.log("onMessageArrived:" + message.payloadString);
    // display received messages on the webpage
    document.getElementById("mqtt_monitor").innerText = message.payloadString;
}

function publish_message_otadownload() {
    var url_text = document.getElementById("OTA_DOWNLOAD");
    var payload = {
        command: "a061",
        url:"git clone "+url_text.value
    }
    var message = new Paho.MQTT.Message(JSON.stringify(payload));
    message.destinationName = mqtt_pub_topic;
    message.qos = Number(2);
    client.send(message);
}


function publish_message_isp() {
    var hex_text = document.getElementById("sensor").value;
    var payload = {
        command: "a063",
        hex:hex_text+".hex",
    }
    var message = new Paho.MQTT.Message(JSON.stringify(payload));
    message.destinationName = mqtt_pub_topic;
    message.qos = Number(2);
    client.send(message);
}


function publish_message_clear() {
    var payload = {
        command: "a064",
    }
    var message = new Paho.MQTT.Message(JSON.stringify(payload));
    message.destinationName = mqtt_pub_topic;
    message.qos = Number(2);
    client.send(message);
}


//-------------------------------------------------------------------------------
function init() {
    document.getElementById("mqtt_otadownload").addEventListener('click', publish_message_otadownload);
    document.getElementById("mqtt_isp").addEventListener('click', publish_message_isp);
    document.getElementById("mqtt_clear").addEventListener('click', publish_message_clear);
    // assign the client ID for MQTT broker authentication, you can assign it on your own
    var MQTT_CLIENT_ID = "iot_web_" + Math.floor((1 + Math.random()) * 0x10000000000).toString(16);

    // create a MQTT client instance
    // make sure the MQTT broker address and port number are correct
    // the port number should be used for websocket, not other protocol
    client = new Paho.MQTT.Client(mqtt_server, mqtt_port, '/ws', MQTT_CLIENT_ID);

    // the public MQTT broker "iot.eclipse.org" can be used for testing
    // client = new Paho.MQTT.Client("iot.eclipse.org", 80, '/ws', MQTT_CLIENT_ID);

    // the function to be executed when the message is received
    client.onMessageArrived = onMessageArrived;

    // connect to the MQTT broker
    client.connect({
        // if you don't use user name and password, just remove these lines
        userName: "aisky-server",
        password: "aisky",
        // the function to be executed when connected
        onSuccess:onConnect
    });

}
window.addEventListener('load', init, false);
</script>

<body>
<p><h2>
Coffee Loader Demo
</h2></p>
<p>
</p>
<div>

<input type="text" id="OTA_DOWNLOAD"/>
<button id="mqtt_otadownload">燒錄檔案下載</button>
<br><br>
<form>
<select id="sensor"style="font-size:20px">
　<option value="RELAY">RELAY</option>
　<option value="PH">PH</option>
　<option value="DO">DO</option>
　<option value="EC">EC</option>
  <option value="LIDARS">LIDARS</option>
　<option value="ORP">ORP</option>
　<option value="SHT11">SHT11</option>
　<option value="SOIL">SOIL</option>
  <option value="SONIC">SONIC</option>
　<option value="TEMP">TEMP</option>
　<option value="WATERLEVEL">WATERLEVEL</option>
  <option value="PWM">PWM</option>
  <option value="bmp280">BMP280</option>
  <option value="servo">SERVO</option>
  <option value="stepmotor">STEPMOTOR</option>
  <option value="motorfeedback">MOTORFEEDBACK</option>
  <option value="KIT0139">KIT0139</option>
  ...
</select>
</form>
<button id="mqtt_isp">燒錄</button>
<br><br>
<button id="mqtt_clear">清除</button>
<br><br>

</div><br>
<div id="mqtt_monitor">
</div>
</body>
</html>