Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <?xml version="1.0" encoding="UTF-8" standalone="no"?>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>Mosquitto Websockets</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta charset="utf-8">
- <script src="mqttws31.js" type="text/javascript"></script>
- <script src="jquery.min.js" type="text/javascript"></script>
- <script src="config.js" type="text/javascript"></script>
- <script type="text/javascript">
- var mqtt;
- var reconnectTimeout = 2000;
- var selectedtopic='#';
- function MQTTconnect(selectedtopic) {
- if (typeof path == "undefined") {
- path = '/mqtt';
- }
- mqtt = new Paho.MQTT.Client(
- host,
- port,
- path,
- "web_" + parseInt(Math.random() * 100, 10)
- );
- var options = {
- timeout: 3,
- useSSL: useTLS,
- cleanSession: cleansession,
- onSuccess: onConnect,
- onFailure: function (message) {
- $('#status').val("Connection failed: " + message.errorMessage + "Retrying");
- setTimeout(MQTTconnect, reconnectTimeout);
- }
- };
- mqtt.onConnectionLost = onConnectionLost;
- mqtt.onMessageArrived = onMessageArrived;
- if (username != null) {
- options.userName = username;
- options.password = password;
- }
- console.log("Host="+ host + ", port=" + port + ", path=" + path + " TLS = " + useTLS + " username=" + username + " password=" + password);
- mqtt.connect(options);
- }
- function onConnect() {
- $('#status').val('Connected to ' + host + ':' + port + path);
- // Connection succeeded; subscribe to our topic
- console.log("subscribed to "+selectedtopic);
- mqtt.subscribe(selectedtopic, {qos: 0});
- $('#topic').val(selectedtopic);
- }
- function onConnectionLost(response) {
- setTimeout(MQTTconnect, reconnectTimeout);
- $('#status').val("connection lost: " + responseObject.errorMessage + ". Reconnecting");
- };
- function onMessageArrived(message) {
- var topic = message.destinationName;
- var payload = message.payloadString;
- $('#ws').prepend('<li>' + topic + ' = ' + payload + '</li>');
- };
- $(document).ready(function() {
- MQTTconnect(selectedtopic);
- $('#topic').change(function()
- {
- selectedtopic = $(this).val();
- console.log("change "+selectedtopic);
- })
- });
- </script>
- </head>
- <body>
- <h1>Things</h1>
- <div>
- <div>Location
- <select id="topic">
- <option value="#">All</option>
- <option value="emergency-room/#">Emergency room</option>
- <option value="ward/#">Ward</option>
- </select>
- Status: <input type='text' id='status' size="80" disabled /></div>
- <ul id='ws' style="font-family: 'Courier New', Courier, monospace;"></ul>
- </div>
- </body>
- </html>
Add Comment
Please, Sign In to add comment