Skip to content

Instantly share code, notes, and snippets.

@aturley
Created October 4, 2011 12:16
Show Gist options
  • Save aturley/1261490 to your computer and use it in GitHub Desktop.
Save aturley/1261490 to your computer and use it in GitHub Desktop.
The Processing sketch takes pictures, encodes them as strings, and writes them to a fifo. The shell script reads from the fifo, sticks the string into a json object, and publishes to the swarm. The HTML file gets data from swarm and draws the picture.
cat ~/swarmpix | sed 's/^\(.*\)$/{"x":"\1"}/' | ./produce.py produce 660e96311f5ca4c39053726d2d0c81f2661a8ef3 00:23:12:55:73:b7 pic
<html>
<head>
<script src="http://cdn.buglabs.net/swarm/swarm-v1.0.0.beta.js"></script>
<!--
<script src="../dist/dev/swarm-v1.0.0.beta.js"></script>
<script src="../dist/int/swarm-v1.0.0.beta.js"></script>
<script src="../dist/test/swarm-v1.0.0.beta.js"></script>
<script src="../dist/stage/swarm-v1.0.0.beta.js"></script>
<script src="../dist/prod/swarm-v1.0.0.beta.js"></script>
-->
</head>
<body>
<script>
window.onload = function() {
var setDivColor = function(div, c) {
var bgColor = "#" + c + "00000";
div.style.backgroundColor = bgColor;
};
var i = 0;
var cols = 32;
var rows = 24;
var blocks = new Array(cols * rows);
var picElement = document.getElementById("pic");
var rowDiv;
var thisDiv;
for (i = 0; i < cols * rows; i++) {
if ((i % cols) == 0) {
rowDiv = document.createElement('div');
rowDiv.style.width = "640px";
rowDiv.style.height = "20px";
picElement.appendChild(rowDiv);
}
thisDiv = document.createElement('div');
thisDiv.style.width = "20px";
thisDiv.style.height = "20px";
thisDiv.style.cssFloat = "left";
setDivColor(thisDiv, "F");
rowDiv.appendChild(thisDiv);
blocks[i] = thisDiv;
};
SWARM.join({apikey: 'cdb56c7dd912dab4c2f30a30a87b7bcfa2b34091',
swarms: ['660e96311f5ca4c39053726d2d0c81f2661a8ef3'],
callback: function(message) {
var strm = JSON.stringify(message);
var sm = message;
var gray = 0;
var data = null;
if (sm.message && sm.message.body && sm.message.body.data) {
console.log(Date.now() + ': ' + sm.message.body.data);
data = eval("(" + sm.message.body.data + ")").x;
for (var i = 0; i < cols * rows; i++) {
gray = data.substring(i, i+1);
setDivColor(blocks[i], gray);
}
} else {
// console.log(Date.now() + ': ' + sm);
}
}
});
}
</script>
</body>
<div id="pic" style="width:640px; height:500px; background-color:blue">
</div>
</html>
/**
* SwarmPixSketch
*
* Sends a string representing pic data to a FIFO file.
*/
import processing.video.*;
import java.io.*;
import java.util.*;
// Size of each cell in the grid
int cellSize = 20;
// Number of columns and rows in our system
int cols, rows;
// Variable for capture device
Capture video;
BufferedWriter out;
int lastPicTime;
void setup() {
size(640, 480, P2D);
frameRate(30);
cols = width / cellSize;
rows = height / cellSize;
colorMode(RGB, 255, 255, 255, 100);
// Uses the default video input, see the reference if this causes an error
video = new Capture(this, width, height, 12);
try{
out = new BufferedWriter(new FileWriter("/Users/aturley/swarmpixfifo"));
} catch (Exception e) {
}
lastPicTime = 0;
background(0);
}
void draw() {
if (millis() - lastPicTime < 1000) {
// if (false) {
return;
} else {
lastPicTime = millis();
}
if (video.available()) {
video.read();
video.loadPixels();
// Not bothering to clear background
// background(0);
// Begin loop for columns
String colors = "0123456789ABCDEF";
String s = "";
for (int j = 0; j < rows; j++) {
for (int i = 0; i < cols; i++) {
// Begin loop for rows
// Where are we, pixel-wise?
int x = i*cellSize;
int y = j*cellSize;
int loc = (video.width - x - 1) + y*video.width; // Reversing x to mirror the image
float r = red(video.pixels[loc]);
float g = green(video.pixels[loc]);
float b = blue(video.pixels[loc]);
// Make a new color with an alpha component
color c = color(r, g, b, 75);
// Code for drawing a single rect
// Using translate in order for rotation to work properly
pushMatrix();
translate(x+cellSize/2, y+cellSize/2);
// Rotation formula based on brightness
// rotate((2 * PI * brightness(c) / 255.0));
int br = int(brightness(c) / 255.0 * 15);
s += colors.charAt(br);
rectMode(CENTER);
c = color(br * 15);
fill(c);
noStroke();
// Rects are larger than the cell for some overlap
rect(0, 0, cellSize+6, cellSize+6);
popMatrix();
}
}
println(s);
try {
// out.write("{\"x\":\"" + s + "\"}" + "\n");
out.write(s + "\n");
out.flush();
} catch (Exception e) {
e.printStackTrace();
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment