This example demonstrates the use of partySetShared()
.
Try this example in two browser windows at once!
let shared;
function preload() {
partyConnect("wss://demoserver.p5party.org", "set_shared");
shared = partyLoadShared("shared", {});
}
function setup() {
createCanvas(400, 400);
noStroke();
}
function mousePressed(e) {
// replace all properties in shared
partySetShared(shared, { x: mouseX, y: mouseY });
}
function keyPressed() {
// remove all properties from shared
partySetShared(shared, {});
}
function draw() {
// check if shared has a property called x
if (typeof shared.x === "undefined") {
background("#ffcccc");
} else {
background("#ccffcc");
fill("#000066");
ellipse(shared.x, shared.y, 100, 100);
}
}
<!DOCTYPE html>
<html>
<head> </head>
<body>
<main></main>
<div id="readme"></div>
<h2>index.js</h2>
<div id="source-javascript"></div>
<h2>index.html</h2>
<div id="source-html"></div>
<script src="https://cdn.jsdelivr.net/npm/p5@1.4.1/lib/p5.js"></script>
<script src="/dist/p5.party.js"></script>
<script src="index.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/highlight.min.js"></script>
<link rel="stylesheet" href="/examples.css" />
<script src="/examples.js" type="module"></script>
</body>
</html>