Visualising Website events in realtime

Social Project Share
1

Hey everyone,

I saw this cool post https://segment.com/blog/how-jut-uses-segment-LED-information-radiator/ on the Segment blog and wondered If I could do something similar with a Spark Core.

So I used an adafruit 8x8 matrix and just use the webhools integration of of segment.io to post to the Spark API whenever an event happens on https://dentally.co

Take a look

I would like to expand this because the animation is a blocking for loop that just scrolls the line. Does anyone know how I could right to be a that the main loop scrolls the matrix, and the spark exposed function just draws a line at the origin, so multiple lines can be scrolling simultaneously.

Cheers,

Ben

1 Like
2

@ben2, not sure what you are asking exactly. Do you have code you need help with? When you say:

What exactly do you mean? Perhaps being more specific on what you need help with would be good. :smile:

3

Hey,

Sorry for not being more descriptive.

This is the code:

#include "Adafruit_GFX.h"
#include "Adafruit_LEDBackpack.h"
#include "glcdfont.h"

Adafruit_8x8matrix matrix = Adafruit_8x8matrix();

void setup()   {
  Spark.function("displayData", boom);
  pinMode(A0, INPUT);
  Serial.begin(9600);
  matrix.begin(0x70);
}

void loop() {
}

int boom(String data) {
  for (int8_t x=0; x<9; x++) {
     matrix.clear();
     matrix.drawLine(x,0, x,7, LED_ON);
     matrix.writeDisplay();
     delay(100);
   }
}

As you can see when the function ‘boom’ is called via the API it starts a ‘for’ loop where a line is sequentially drawn across the 8x8 matrix. As is, the function gets triggered and cannot accept another call until the animation has completed. The behaviour I would to create is one in where when event hits the API to call the ‘boom’ function it sends a line to the display which over time moves to the bottom of the display. This behaviour would then allow two events to be displayed on the display as two horizontal lines moving towards the bottom of the display. I would like the animation of the lines to be independent of the creation of them. If that makes sense?

I would imagine this as the main loop just shifts the pixels on the matrix and the boom function just draws new lines at the top of the matrix whenever a call is made via the API.

Any ideas would be greatly appreciated.

Thanks,

Ben