Freeboard is an open-source solution to easily create real-time, interactive dashboards and visualizations within no time. A great collection of Widgets as well as the option to customize the entire product allows to tailor it to your needs.

The following document shows an example of using freeboard (including additional widgets) to monitor mobile WAN connections and with an additional SDK Script the dashboard can interact with the router updating the priority of the WWAN links.

• Netmodule Router Software 4.1 or higher (from our ftp server) with cli-php enabled
• Freeboard (from github)
• Freeboard Widget Plugins (from github) → optional

A word of caution: since this is an additional installation to the system, it will NOT BE UPDATE PERSISTENT ! This means that whenever you do either a system upgrade or a factory-reset your freeboard will be lost. It's therefore recommendet to keep a backup of your finished work.

• Clone freeboard from their github repository to your local machine
• Use scp (for Windows: WinSCP) and transfer the freeboard folder to

  /home/www-data/ 

  so it will be stored under /home/www-data/freeboard

• After this freeboard will be accessible on http://192.168.1.1/freeboard

The best way to interact with the router through freeboard is via the cli-php functionality. A router OS starting from 4.1 allows json output which can be used as datasource for freeboard.

As a simple test let's check the status uf the WAN Interfaces via cli-php:

http://192.168.1.1/cli.php?output=json&usr=admin&pwd=mypassword&command=status&arg0=-s&arg1=wan

{"WAN":{"HOTLINK":"WANLINK1"},"WANLINK1":{"STATE":{"0":"up","UP":{"SINCE":"2018-05-30 12:12:23"}},"TYPE":"eth","INTERFACE":"LAN2","ADDRESS":"172.17.0.207","GATEWAY":"172.17.0.1","DIAL":{"ATTEMPTS":"1564","SUCCESS":"3","FAILURES":"1561"},"DATA":{"DOWNLOADED":"106316207","UPLOADED":"7026003"},"DOWNLOAD":{"RATE":"2595"},"UPLOAD":{"RATE":"3908"}},"WANLINK2":{"STATE":{"0":"down","DOWN":{"SINCE":"2018-05-30 12:20:59"}},"TYPE":"wwan","INTERFACE":"WWAN1","ADDRESS":"n\/a","MODEM":"Mobile1","SIM":"SIM1","PDP":"PDP1","SIGNAL":{"STRENGTH":"n\/a","LEVEL":"n\/a","QUALITY":"weak"},"REGISTRATION":{"STATE":"n\/a"},"SERVICE":{"TYPE":"n\/a"},"NETWORK":"n\/a","DIAL":{"ATTEMPTS":"1","SUCCESS":"1","FAILURES":"0"},"DATA":{"DOWNLOADED":"277712","UPLOADED":"1583241"},"DOWNLOAD":{"RATE":"0"},"UPLOAD":{"RATE":"0"}},"WANLINK3":{"STATE":{"0":"down","DOWN":{"SINCE":"startup"}},"TYPE":"wwan","INTERFACE":"WWAN2","ADDRESS":"n\/a","MODEM":"Mobile2","SIM":"SIM2","PDP":"PDP1","SIGNAL":{"STRENGTH":"n\/a","LEVEL":"n\/a","QUALITY":"n\/a"},"REGISTRATION":{"STATE":"n\/a"},"SERVICE":{"TYPE":"n\/a"},"NETWORK":"n\/a","DIAL":{"ATTEMPTS":"0","SUCCESS":"0","FAILURES":"0"},"DATA":{"DOWNLOADED":"37779700","UPLOADED":"2908579"},"DOWNLOAD":{"RATE":"0"},"UPLOAD":{"RATE":"0"}}}

For a detailed description of cli-php and it's possibilities please refer to your product manual.

To be able to visualize data you first need to add a datasource to freeboard. After a click on the top middle icon a dropdown appears where you can add your datasources. This is where the json output from cli-php comes into place. The URL specified in the example is the same as we used to check the cli-php functionality.

No you should see your datasource displayed as well as the time when it last got updated. All we need to do now is to add a pane and some widgets for visualisation. Let's use a text widget to display the current WAN Hotlink. Since we added the WAN datasource you can just select it in the widget and define the value you want to get visualized.

And now we get the current WAN hotlink displayed:

Autload your created dashboard:

If you created a dashboard and you want it to be loaded when accesing freeboard do the following:

• Save your dashboard → dashboard.json and copy it to you routers freeboard folder (/home/www-data/freeboard)
• Use the following URL to automatically load the corresponding dashboard: http://192.168.1.1/freeboard/index.html#source=dashboard.json

Disable editing of a dashboard:

When you are done creating a dashboard and you might want to share it with customers but not allow them to edit the dashboard just change the following line (from true to false) in your saved dashboard.json

      "allow_edit": false,

The following describes a use case monitoring two modems of an NB2800, displaying wwan informations as well as having a button to switch the prio of the connections. This could help a customer to quickly see which modem has the better service type and signal strength and allows to switch to the preferred connection:

In this example three WAN Links where setup on the NB2800:

• WANLINK1 –> LAN interface, Prio 1
• WANLINK2 –> WWAN interface with sim1 assigned to modem mobile1, Prio 2
• WANLINK3 –> WWAN interface with sim3 asigned to modem mobile2, Prio 3

Its important to remember the WAN links order, because this way we also know the order of the priorities. The SDK Script (freeboard_mobilelink.are) reads a custom variable set by the freeboard button (actuator widget taken from here) via the cli-php and then priorizes the corresponding wanlink.

From the actuator widget in freeboard we use cli-php to set a custom variable passing the WANLINK we want to priorize which then gets stored in custom.var0 that is read by the sdk script:

For the SDK Script the trigger was set to “SDK-Startup” so it is constantly running and checking for changes caused by freeboard.

Below you can find the sdk script freeboard_mobilelink.are as well the dashboard used in freeboard. Please be aware that depending on your configuration and setup you might need to change the WANLINKS within dashboard.json accordingly. Also if you have only one modem the right pane will not display anything. But feel free to customize it to your needs.

freeboard_mobilelink.are

oldlink = "";
 
while (1){
	priolink = nb_config_get("custom.var0");
	if(priolink != oldlink){
		oldlink = priolink;
		nb_wanlink_priorize(sprintf("%s",priolink), 2);
	}
	sleep(5);
}

The dashboard:

dashboard.json

{
	"version": 1,
	"allow_edit": true,
	"plugins": [],
	"panes": [
		{
			"title": "WWAN Infos - Mobile 1",
			"width": 1,
			"row": {
				"2": 1,
				"3": 1
			},
			"col": {
				"2": 1,
				"3": 1
			},
			"col_width": 1,
			"widgets": [
				{
					"type": "text_widget",
					"settings": {
						"title": "Network",
						"size": "regular",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE1\"][\"NETWORK\"]",
						"animate": true
					}
				},
				{
					"type": "text_widget",
					"settings": {
						"title": "Service Type",
						"size": "regular",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE1\"][\"SERVICE\"][\"TYPE\"]",
						"animate": true
					}
				},
				{
					"type": "text_widget",
					"settings": {
						"title": "Active SIM Card",
						"size": "regular",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE1\"][\"SIM\"][\"0\"]",
						"animate": true
					}
				},
				{
					"type": "gauge",
					"settings": {
						"title": "Signal Level (RSSI)",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE1\"][\"SIGNAL\"][\"RSSI\"]",
						"min_value": -100,
						"max_value": 0
					}
				}
			]
		},
		{
			"title": "WWAN Infos - Mobile 2",
			"width": 1,
			"row": {
				"2": 1,
				"3": 1
			},
			"col": {
				"2": 2,
				"3": 3
			},
			"col_width": 1,
			"widgets": [
				{
					"type": "text_widget",
					"settings": {
						"title": "Network",
						"size": "regular",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE2\"][\"NETWORK\"]",
						"animate": true
					}
				},
				{
					"type": "text_widget",
					"settings": {
						"title": "Service Type",
						"size": "regular",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE2\"][\"SERVICE\"][\"TYPE\"]",
						"animate": true
					}
				},
				{
					"type": "text_widget",
					"settings": {
						"title": "Active SIM Card",
						"size": "regular",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE2\"][\"SIM\"][\"0\"]",
						"animate": true
					}
				},
				{
					"type": "gauge",
					"settings": {
						"title": "Signal Level (RSSI)",
						"value": "datasources[\"WWAN Datasource\"][\"MOBILE2\"][\"SIGNAL\"][\"RSSI\"]",
						"min_value": -100,
						"max_value": 0
					}
				}
			]
		},
		{
			"width": 1,
			"row": {
				"2": 13,
				"3": 1
			},
			"col": {
				"2": 1,
				"3": 2
			},
			"col_width": 1,
			"widgets": [
				{
					"type": "text_widget",
					"settings": {
						"title": "WAN Hotlink",
						"size": "regular",
						"value": "datasources[\"WAN Datasource\"][\"WAN\"][\"HOTLINK\"]",
						"animate": true
					}
				},
				{
					"type": "actuator",
					"settings": {
						"title": "",
						"value": "",
						"urlOn": "http://192.168.1.1/cli.php?version=2&output=json&usr=admin&pwd=mypassword&command=set&arg0=custom.var0&arg1=WANLINK2\t",
						"urlOff": "http://192.168.1.1/cli.php?version=2&output=json&usr=admin&pwd=mypassword&command=set&arg0=custom.var0&arg1=WANLINK3\t",
						"on_text": "Switch Mobile Connection",
						"off_text": "Switch Mobile Connection"
					}
				}
			]
		}
	],
	"datasources": [
		{
			"name": "WWAN Datasource",
			"type": "JSON",
			"settings": {
				"url": "http://192.168.1.1/cli.php?version=2&output=json&usr=admin&pwd=mypassword&command=status&arg0=-s&arg1=wwan\t",
				"use_thingproxy": true,
				"refresh": 5,
				"method": "GET",
				"name": "WWAN Datasource"
			}
		},
		{
			"name": "WAN Datasource",
			"type": "JSON",
			"settings": {
				"url": "http://192.168.1.1/cli.php?version=2&output=json&usr=admin&pwd=mypassword&command=status&arg0=-s&arg1=wan\t",
				"use_thingproxy": true,
				"refresh": 5,
				"method": "GET"
			}
		}
	],
	"columns": 3
}