use mqtt data to draw dots
This commit is contained in:
parent
5a4baf832b
commit
d2a14219fa
|
@ -11,26 +11,42 @@ static float pixelborderweight=1;
|
||||||
|
|
||||||
color colorWhite=color(240,255,150);
|
color colorWhite=color(240,255,150);
|
||||||
color colorBlack=color(50,50,50);
|
color colorBlack=color(50,50,50);
|
||||||
|
color colorBG=color(127,127,127);
|
||||||
|
|
||||||
String lastDataReceived="";
|
String lastDataReceived="";
|
||||||
|
int lastDataReceivedTime=0;
|
||||||
|
|
||||||
PGraphics pg;
|
PGraphics pg;
|
||||||
|
|
||||||
|
PFont smallfont;
|
||||||
|
// The font must be located in the sketch's
|
||||||
|
// "data" directory to load successfully
|
||||||
|
|
||||||
|
|
||||||
void setup() {
|
void setup() {
|
||||||
size(1300,300);
|
size(1300,300);
|
||||||
|
smooth(0);
|
||||||
pg = createGraphics(int(displaywidth*pixeldistance+pixelborderweight/2),int(displayheight*pixeldistance+pixelborderweight/2));
|
pg = createGraphics(int(displaywidth*pixeldistance+pixelborderweight/2),int(displayheight*pixeldistance+pixelborderweight/2));
|
||||||
background(127);
|
background(colorBG);
|
||||||
|
|
||||||
|
//printArray(PFont.list());
|
||||||
|
smallfont = createFont("Monospaced.plain", 12);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
client = new MQTTClient(this);
|
client = new MQTTClient(this);
|
||||||
client.connect("mqtt://192.168.1.6", "processing-flipdot");
|
client.connect("mqtt://192.168.1.6", "processing-flipdot");
|
||||||
}
|
}
|
||||||
|
|
||||||
void draw() {
|
void draw() {
|
||||||
|
fill(colorBG);
|
||||||
|
rect(0,0,width,height);
|
||||||
pg.beginDraw();
|
pg.beginDraw();
|
||||||
pg.clear();
|
pg.clear();
|
||||||
for (int y=0;y<displayheight;y++){
|
for (int y=0;y<displayheight;y++){
|
||||||
for (int x=0;x<displaywidth;x++){
|
for (int x=0;x<displaywidth;x++){
|
||||||
pg.strokeWeight(pixelborderweight);
|
pg.strokeWeight(pixelborderweight);
|
||||||
if (int(random(3))==0) {
|
if (getPixelFromString(x,y)) {
|
||||||
pg.stroke(0,0,0);
|
pg.stroke(0,0,0);
|
||||||
pg.fill(colorWhite);
|
pg.fill(colorWhite);
|
||||||
}else{
|
}else{
|
||||||
|
@ -42,10 +58,25 @@ void draw() {
|
||||||
}
|
}
|
||||||
pg.endDraw();
|
pg.endDraw();
|
||||||
image(pg,5,5);
|
image(pg,5,5);
|
||||||
|
|
||||||
|
textFont(smallfont);
|
||||||
|
fill(255,255,255);
|
||||||
|
int showFirstData=100;
|
||||||
|
int showLastData=32;
|
||||||
|
text(lastDataReceived.substring(0,min(showFirstData,lastDataReceived.length()))+"..",5,pg.height+16);
|
||||||
|
text(".."+lastDataReceived.substring(max(lastDataReceived.length()-showLastData,0),lastDataReceived.length()), (showFirstData+2)*7.3 ,pg.height+16);
|
||||||
|
text("length="+lastDataReceived.length(), (showFirstData+2)*7.3+(showLastData+2)*7.3 ,pg.height+16);
|
||||||
|
|
||||||
|
text((millis()-lastDataReceivedTime)/1000.0+"s", 5,pg.height+16+16);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
boolean getPixelFromString(int x,int y){
|
boolean getPixelFromString(int x,int y){
|
||||||
|
if (lastDataReceived.length()>x*displayheight+y){
|
||||||
return lastDataReceived.charAt(x*displayheight+y)=='1';
|
return lastDataReceived.charAt(x*displayheight+y)=='1';
|
||||||
|
}else{
|
||||||
|
return false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
void clientConnected() {
|
void clientConnected() {
|
||||||
|
@ -58,6 +89,7 @@ void messageReceived(String topic, byte[] payload) {
|
||||||
//println("new message: " + topic + " - " + new String(payload));
|
//println("new message: " + topic + " - " + new String(payload));
|
||||||
println("new message: " + topic + " len= " + (new String(payload)).length());
|
println("new message: " + topic + " len= " + (new String(payload)).length());
|
||||||
lastDataReceived=new String(payload);
|
lastDataReceived=new String(payload);
|
||||||
|
lastDataReceivedTime=millis();
|
||||||
}
|
}
|
||||||
|
|
||||||
void connectionLost() {
|
void connectionLost() {
|
||||||
|
|
Loading…
Reference in New Issue