In this tutorial, we will use a generic smart monitoring system to track sensor gateway data at multiple locations, configure alerts, and manage company users and security.
The tutorial consists of these sections:
Setup: A quick guide on how to set up the system
Assets: A brief description of the system’s assets
Usage: A deeper understanding of how to use the system
Customize: A quick guide on how to customize the system
Setup
The setup involves these steps:
Getting started
Create an account if you must do so.
Once you log in, you are directed to create a system. Click +Add system.
Click the Template tab and search for
smart-monitoring.
Hover over the template and click View.
Read information about the template and click Create.
Configure security
Define your security model by specifying permissions for various roles. Add employees into the system as users and assign them roles to grant them permissions.
To begin, let’s create a user:
Go to the Users page within your system.
Click + Add User.
Enter an email, password, and sample information for the other fields. The email and password will be your user login to the Portal page.
Click Create.
A window will display to add specific user roles. Authenticated is the default role.
Click Update Roles, and the user should appear in the table.
Configure edges
Click the Edges tab on the left to go to the Edge console page. Define and configure your gateways in the Edges table that will be housing sensors. This is to retrieve the portal visualizations' data.
When you go to the Edge console page, you will see two default edges that have not been set up and connected. There can be up to eight edges with smart monitoring, each with a specific location.
To set up the edges:
Click Setup instructions in the installation window:
Choose where you want the edge installed (e.g., macOS 64bit).
Copy and paste the Install command into your terminal (there is also an option to visualize how it’s functioning by adding the console) and run the command.
Copy and paste the Startup command into your terminal and run it.
Configure devices
Click the Devices tab on the left to go to the Devices console page. Define your sensors in the Devices table, specifying the edge each belongs to.
Configure alerts
This configuration allows users to create rules on how alerts can be triggered. To do so, the user must log into the smart_monitoring portal on the portal console page. After logging in, the alert configuration rules can be defined on the alert configurations page. Users can go to the alert configurations page by clicking the hamburger icon on the portal’s top left corner and selecting the alert configurations tab.
The user can define rules for alert configurations when processing sensor data to send alerts via text, email, or internal messages to designated employees. Rule structure: { “sensor_id”: “111111”, “operator”: “GT”, - “GT”(greater than), “LT”(less than), “EQ”(equal) “value”: “32”, “property”: “sensor_reading” }
Assets
You should have these pre-packaged assets for your new system’s IPM:
Assets | Use |
|---|---|
Existing microservices to use in the smart-monitoring system | |
Existing reusable code to use in code services | |
Data structures with data | |
Gateways that can be defined and configured in the edges table that will be housing the sensors | |
A single web application instance with preconfigured integrations with the ClearBlade System | |
Defining sensors in the Devices table and specifying the edge each will belong to |
Commands and API can be found here.
Usage
The end user mainly uses the portal asset, which we will discuss in this section.
Portals
For this exercise, we will be using the smart_monitoring portal. It has premade widgets for location, alerts, messages, and data visualizations. To begin:
Navigate to the Portals tab on the left menu. You should see a list of three portals available: mobile_alerts, smart_monitoring, and smart_monitoring_edge. Click smart_monitoring.
You’ll be presented with a login page. Log in with the email and password you created earlier.
All the visualizations on the home page are divided into different panes.
There is also a flyout plane with access to other portal pages, such as Employees.
Pages
The smart monitoring portal has these pages:
Home page
On the home page, you will find the following:
Edge location map
Alert list
Messages received and the ability to reply
Edge list and their information
A line graph of the edges' data retrieving history
Alert configuration
Messaging alerts and their priority can be added to this page. The example used in the demo is an alert for high temperatures (above 32F).
There are options in the right pane to:
Add a label to the alert
Change the priority level (high, medium, or low)
Choose an edge (sensors)
Add a rule (Fahrenheit temperature or battery percentage)
Add an employee to contact (through text or email)
Write a message to be sent
The bottom pane shows a data collection on what alerts were sent. This table has an option to be cleared.
Admin
Create/Update
In all portal pages (except for edges), items can be created in the right pane. The items can also be clicked on the left and updated on the right pane.
Delete
Click the trash symbol next to the items in the left pane (except the edge page).
The admin pages consist of these sub-pages:
Sensors
This page is to add sensors and assign them to an edge.
Sensor information includes:
A label
The sensor type (temperature/pressure)
A unique ID number
Which edge will it be assigned to
The last sensor reading information
The last reading date
Sensor type
Choose what data type the sensor will be collecting.
Sensor type information includes:
The sensor type name
What units will the data be in (degrees Fahrenheit)
A unique ID number
Which edge will it be assigned to
The last sensor reading information
The last reading date
Edges
Edges added to the platform’s edge page are also added to this page. The edges' location and description are editable here.
Locations
Sensor locations can be added on this page.
Location information includes:
Name
Description
Latitude and longitude points
Address
Type (i.e., building)
Employees
This page provides the user to create, update, or delete an employee record.
Employee information includes:
A valid email
First and last name
Phone number to receive text alerts
Option to add a photo to appear on a record in the left pane
Pin
Password to log in
Location
Customize
The system’s assets can be customized. The most common configuration happens within the portals. The users can log into the portals with an administrator role (or any other role with update portal permissions). This can be done by creating a new user on the user’s page using the method mentioned in the Configure security setup section. The user should be assigned an administrator role.
Once logged in, the user can perform these customizations:
Portal content management
After logging in, the user lands on the portal’s home page with a side flyout pane. It lists the information for:
Datasources
Pages
Internal resources
External resources
The user can customize the above and save changes by clicking the red icon in the flyout pane’s top toolbar.
Please see how to work with portals.
Default styling
You can change the default ClearBlade logo to your own. Hover over the logo and click the wrench to open the widget editor. Click Edit static data to show three customizable parser sections: HTML, CSS, and JavaScript. In the HTML section, replace the image source with an image link.
Go back to the flyout pane’s theme editor. Under Change palette, go to Secondary to change the pane headers' color.
The panes are movable if you drag them and are placed where you choose.
Save your changes by clicking the red icon in the flyout pane’s top toolbar.
There is also an option to change the portal’s theme colors.
Responsive web design
The portal’s home page (when logged in as an administrator) has CSS Breakpoints at the very top of the page. Users can customize the portal’s appearance on different devices by managing it on desired breakpoints.