Social development practitioner. Trying to understand our world.
gateway = "██████████" // Replace this with your Gateway identifier.
counter = "example" // Edit this to change the counter.
account = "████████████" // Replace with your AWS account number.
region = "us-east-1" // Replace with your AWS region, as needed.
origin = location.origin.replace("observablehq", "████████") // Replace with your origin.
increment = {
let queue = [];
let socket;
let timeout;
let delay = 250;
(function open() {
socket = new WebSocket(`wss://v3q80qxjpa.execute-api.us-east-1.amazonaws.com/prod?id=${encodeURIComponent(counter)}`);
socket.onopen = () => {
delay = 250;
queue.forEach(message => socket.send(message));
queue = null;
};
socket.onclose = () => {
delay *= 2;
timeout = setTimeout(open, delay + Math.random() * delay);
queue = [];
};
socket.onmessage = event => {
const data = JSON.parse(event.data);
if (isNaN(mutable count) || data.count > mutable count) {
mutable count = data.count;
}
};
})();
invalidation.then(() => {
socket.onclose = null;
socket.close();
clearTimeout(timeout);
});
return () => {
const message = JSON.stringify({type: "increment"});
if (queue) queue.push(message);
else socket.send(message);
++mutable count;
};
}
mutable count = counter, NaN
stage = "prod" // Replace if you choose a different stage name.
html`<style>
pre {
box-sizing: border-box;
border-left: solid 4px #e2e5e9;
margin-left: -14px;
padding-left: 10px;
}
body {
counter-reset: item;
}
.counter::before {
counter-increment: item;
content: counter(item) ". ";
}
</style>`
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
