On The Inside

On The Inside

Saturday, December 31, 2016

SafeSound - Dashboard

In order to view the streams on your web page you will have to create a dashboard with widgets  This is the one aspect of the application that the Flow source will not automatically create for you. Simply go to the Dashboards page of your M2X site and create a new Dashboard by clicking on Add Dashboard. Give it a name, e.g., SafeSound. You will now be able to add Widgets by clicking on the Create a Widget button. You will want to create three widgets, one for Environment, one for Input Voltage, and one for Output Voltage. Each environment will be a line chart and you will choose the streams from the pre-created streams. Put Temp and Humidity on Environment, and Left and Right Input and Output on the Input and Output streams respectively.

When you are finished, you should have three widgets and your dashboard should look something like this.

You can now view your dashboard from your M2X account, or, if you prefer, you can also view it from within the embedded client. In order to do this, however, you will have to embed the URL for the dashboard into the HTML source in the Flow application. To do this you will have to create a public URL for your dashboard. This is a security risk so make sure that this is something that you want to do before creating a public URL.

Click on Create a public URL.  This will create the URL and allow you to copy it to the clipboard. Now, open the Flow source code for the project and open the Client App tab. Double click on the HTML Template node and scroll to the bottom of the source. Find the section of code below and past the URL of your public dashboard right below the comment just above the </div> line.

<div style="width: 2000px; height=500px;">
    <-- paste your display widgets here /-->

There you have it, your website should be accessible at "your baseurl"/client  and you should be able to see your dashboard below the form used to change safesound parameters.

No comments:

Post a Comment