Cool-looking dashboard for connected devices

General
21

jackt, just to clarify for others, that’s $14 per month :smile:

22

That's $14/month if you pay for a full year up front. $19/month with only a monthly commitment.

23

did anybody had a look at http://ubidots.com ?
they have a spark core demo available: http://ubidots.com/docs/devices/spark.html
just wondering how it compares to freeboard.io.

Gerrit.

1 Like
24

so is it possible to make your freeboard page read-only visible to the public?
On there website they state ‘(permission required)’ for the clone option, but I can’t see how.

25

The only out-of-the-box way to secure it (that I know of) is to implement username and password authentication at the web server level (a la Apache .htaccess file).

1 Like
26

Is it possible for me to see events published by my core in Freeboard?

I’m trying to make up a Dashboard for demo. :wink:

27

@kennethlimcp, the following data source should work

(function () {
	var sseDatasource = function (settings, updateCallback) {
		var self = this;
		var currentSettings = settings;

        this.updateNow = function () {
            var eventSource = new EventSource("https://api.spark.io/v1/devices/" + currentSettings.deviceId + "/events/?access_token=" + currentSettings.accessToken);

            eventSource.addEventListener('open', function(e) { },false);

            eventSource.addEventListener('error', function(e) { },false);

            eventSource.addEventListener(currentSettings.event_name, function(e) {
                var parsedData = JSON.parse(e.data);
                
                updateCallback(parsedData.data);
            }, false);	
		}

		this.onDispose = function () {
	
        }

		this.onSettingsChanged = function (newSettings) {
			currentSettings = newSettings;

			self.updateNow();
		}
	};

	freeboard.loadDatasourcePlugin({
		"type_name": "SSE",
		"display_name": "SSE",
		"settings": [
			{
				name: "deviceId",
				display_name: "Device ID",
				description: 'Spark Core Device ID.',
				type: "text",
			},
			{
				name: "accessToken",
				display_name: "Access Token",
				description: 'Spark Core Access Token.',
				type: "text",
			},
			{
				name: "event_name",
				display_name: "Event Name",
				description: 'Event Name.',
				type: "text",
			}
		],
		newInstance: function (settings, newInstanceCallback, updateCallback) {
			newInstanceCallback(new sseDatasource(settings, updateCallback));
		}
	});
}());

I downloaded the Freeboard.io and added this plugin. It is working for me, let me know it works for you

28

Ah… that means i can’t do it with the online version?

29

@kennethlimcp, I don’t think we can add plugins to the online version, we need to change the index.html to load the custom plugin.

1 Like
30

I managed to cook up a dashboard for my upcoming talk with the help of @krvarma! :smiley:

Rock on Spark community. :punch:

It’s so fun to present about community stuff with the help of the community. punny! :wink:

3 Likes
31

Hi @gerrit,

Thanks for pointing out Ubidots. While Freeboard seems is a nice tool, Ubidots is more than just visualization as it offers other extra features like SMS/Email notifications and a math engine to compute data from different sources (i.e. Power = I*V).

32

Hey @aguspg - feel free to present Ubidots when it represents a helpful solution to somebody’s problem (which it does here), but lay off the hardcore marketing-speech a bit. Cool?

1 Like
33

Hi @zach sorry it sounded like that, just corrected the comment.

2 Likes
34

Thanks @aguspg!

1 Like
35

Hello All,

I am working with new Spark Core SaaS project and dashboard. :slight_smile:

I hope , when programming finished will be nice!

Look some images:)
General Screen ;

General Screen 2

Messaging ;

Notification ;

What do you think ?

7 Likes
36

Looks good! May I ask what you are using to make this? MEAN, or something like that?

37

Hi @Moors7 . This project will be server side project. Every one can add their Spark Core based project. ( temperature sensor , motion detector, 3 axis sensor etc.)

Quick Information for dashboard;

  • I am using bootstrap for templating
  • Used some JS files .( Look below image)
  • and programming language is PHP.
3 Likes
38

@Yasin This looks great, is this free? Also - when will you be posting the source and instructions how we can use it for our projects?

It looks amazing and can’t wait to get my hands on it :smile:

39

Your work is so nice, are you planning to share the source and if possilble would you tell us when? Appreciate.

40

Hello! I’ve been working on a simple private dashboard and am looking for contributors. It’s being done in node/express. I’m interested in colaboration with other javascript folks. Send me a PM if you are interested and have some experience with js and git. :smile: