Strange connections: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
(8 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
[[Datei:player1.png| | This sketch emerged while I was experimenting how to connect the two players' mouses. | ||
[[Datei:player2.png| | I liked the drawings that come out. | ||
[[Datei:player1.png|540px|thumb|left]] | |||
[[Datei:player2.png|540px|thumb|right]] | |||
<source lang="java" line start="2" highlight="4-6"> | |||
// using mqtt protokoll via shiftr.io | |||
// https://docs.shiftr.io/manuals/processing/ | |||
import mqtt.*; | |||
MQTTClient client; | |||
/// Connection to other player | |||
String mePlayer = "/playing-together/red/p2/xy"; | |||
String otherPlayer = "/playing-together/red/p1/xy"; | |||
/// variables for position of others players mouse | |||
int otherMouseX = 0; | |||
int otherMouseY = 0; | |||
int otherPreviousMouseX = 0; //to keep track of last mouse position for drawing line | |||
int otherPreviousMouseY = 0; | |||
//set fix color for players | |||
int p1color, p2color; | |||
// time variables for mqtt | |||
long timeStamp; | |||
int delayTime = 1000/35; | |||
void setup() { | |||
client = new MQTTClient (this); | |||
client.connect("mqtt://YOUR_SHIFTER_IO_Username:YOUR_SHIFTER_IO_Password@broker.shiftr.io", "YOUR_SHIFTER_IO_Username"); | |||
size(600,600); | |||
background(255); | |||
p1color = #AD2C2C; // color for player 1 | |||
p2color = #230E9D; // color for player 2 | |||
} | |||
// RECEIVE messages of other player/// | |||
void clientConnected(){ | |||
println("client connected"); | |||
client.subscribe(otherPlayer); | |||
} | |||
void messageReceived(String topic, byte [] payload){ | |||
// the incoming MQTT "message" is a String: "xValue,yValue" | |||
// to unpack it we use the "split" function: | |||
String incomingPayload = new String(payload); | |||
String [] xy = split(incomingPayload, ','); | |||
if (int(xy[0])== 0 && int(xy[1])== 0){ | |||
background(255); | |||
} else { | |||
println("new message: " + topic + " x: " + xy[0] + " y: " +xy[1]); | |||
otherMouseX = int(xy[0]); | |||
otherMouseY = int(xy[1]); | |||
}} | |||
//SEND my mouse x, y // | |||
void mouseDragged(){ | |||
//the MQTT connection will close if you send more than 25 operations per second! | |||
//so we implement a delay to SEND my coordinates only every xxx milliseconds: | |||
if(millis() - timeStamp > delayTime){ | |||
timeStamp = millis(); | |||
client.publish(mePlayer,mouseX + "," + mouseY); | |||
} | |||
strokeWeight(5); // set line thickness | |||
// set right color for player // | |||
if (mePlayer == "/playing-together/red/p1/xy"){ | |||
stroke(p1color); | |||
} else if (mePlayer == "/playing-together/red/p2/xy") { | |||
stroke(p2color); | |||
} | |||
line (pmouseX,pmouseY,mouseX, mouseY); | |||
//set right color for player // | |||
if (mePlayer == "/playing-together/red/p1/xy"){ | |||
stroke(p2color); | |||
} else if (mePlayer == "/playing-together/red/p2/xy") { | |||
stroke(p1color); | |||
} | |||
line (otherMouseX, otherMouseY, mouseX, mouseY); | |||
} | |||
// DRAW | |||
void draw() { | |||
strokeWeight(5); //line thickness | |||
// set right color for player // | |||
if (mePlayer == "/playing-together/red/p1/xy"){ | |||
stroke(p2color); | |||
} else if (mePlayer == "/playing-together/red/p2/xy") { | |||
stroke(p1color); | |||
} | |||
line(otherPreviousMouseX, otherPreviousMouseY, otherMouseX, otherMouseY); | |||
otherPreviousMouseX = otherMouseX; //update previous to be current | |||
otherPreviousMouseY = otherMouseY; //update previous to be current | |||
if (mePlayer == "/playing-together/red/p1/xy"){ | |||
stroke(p1color); | |||
} else if (mePlayer == "/playing-together/red/p2/xy") { | |||
stroke(p2color); | |||
} | |||
line (mouseX, mouseY, otherMouseX,otherMouseY); | |||
} | |||
// reset canvas // | |||
void keyPressed(){ | |||
background(255); | |||
client.publish(mePlayer, 0 + "," + 0); | |||
} | |||
//DEFECT REPORT /// | |||
void connectionList(){ | |||
println("connection lost"); | |||
} | |||
</source> |
Aktuelle Version vom 12. Mai 2020, 09:12 Uhr
This sketch emerged while I was experimenting how to connect the two players' mouses. I liked the drawings that come out.
// using mqtt protokoll via shiftr.io
// https://docs.shiftr.io/manuals/processing/
import mqtt.*;
MQTTClient client;
/// Connection to other player
String mePlayer = "/playing-together/red/p2/xy";
String otherPlayer = "/playing-together/red/p1/xy";
/// variables for position of others players mouse
int otherMouseX = 0;
int otherMouseY = 0;
int otherPreviousMouseX = 0; //to keep track of last mouse position for drawing line
int otherPreviousMouseY = 0;
//set fix color for players
int p1color, p2color;
// time variables for mqtt
long timeStamp;
int delayTime = 1000/35;
void setup() {
client = new MQTTClient (this);
client.connect("mqtt://YOUR_SHIFTER_IO_Username:YOUR_SHIFTER_IO_Password@broker.shiftr.io", "YOUR_SHIFTER_IO_Username");
size(600,600);
background(255);
p1color = #AD2C2C; // color for player 1
p2color = #230E9D; // color for player 2
}
// RECEIVE messages of other player///
void clientConnected(){
println("client connected");
client.subscribe(otherPlayer);
}
void messageReceived(String topic, byte [] payload){
// the incoming MQTT "message" is a String: "xValue,yValue"
// to unpack it we use the "split" function:
String incomingPayload = new String(payload);
String [] xy = split(incomingPayload, ',');
if (int(xy[0])== 0 && int(xy[1])== 0){
background(255);
} else {
println("new message: " + topic + " x: " + xy[0] + " y: " +xy[1]);
otherMouseX = int(xy[0]);
otherMouseY = int(xy[1]);
}}
//SEND my mouse x, y //
void mouseDragged(){
//the MQTT connection will close if you send more than 25 operations per second!
//so we implement a delay to SEND my coordinates only every xxx milliseconds:
if(millis() - timeStamp > delayTime){
timeStamp = millis();
client.publish(mePlayer,mouseX + "," + mouseY);
}
strokeWeight(5); // set line thickness
// set right color for player //
if (mePlayer == "/playing-together/red/p1/xy"){
stroke(p1color);
} else if (mePlayer == "/playing-together/red/p2/xy") {
stroke(p2color);
}
line (pmouseX,pmouseY,mouseX, mouseY);
//set right color for player //
if (mePlayer == "/playing-together/red/p1/xy"){
stroke(p2color);
} else if (mePlayer == "/playing-together/red/p2/xy") {
stroke(p1color);
}
line (otherMouseX, otherMouseY, mouseX, mouseY);
}
// DRAW
void draw() {
strokeWeight(5); //line thickness
// set right color for player //
if (mePlayer == "/playing-together/red/p1/xy"){
stroke(p2color);
} else if (mePlayer == "/playing-together/red/p2/xy") {
stroke(p1color);
}
line(otherPreviousMouseX, otherPreviousMouseY, otherMouseX, otherMouseY);
otherPreviousMouseX = otherMouseX; //update previous to be current
otherPreviousMouseY = otherMouseY; //update previous to be current
if (mePlayer == "/playing-together/red/p1/xy"){
stroke(p1color);
} else if (mePlayer == "/playing-together/red/p2/xy") {
stroke(p2color);
}
line (mouseX, mouseY, otherMouseX,otherMouseY);
}
// reset canvas //
void keyPressed(){
background(255);
client.publish(mePlayer, 0 + "," + 0);
}
//DEFECT REPORT ///
void connectionList(){
println("connection lost");
}