Skip to content

Instantly share code, notes, and snippets.

Created May 24, 2015
Embed
What would you like to do?
JS Bin // source http://jsbin.com/kevuxesojo
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-git.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
<script>
var startTime = (new Date().getTime());
// Set all pixels to a given color
function writeFrame(red, green, blue) {
var leds = 12;
var packet = new Uint8ClampedArray(4 + leds * 3);
if (socket.readyState != 1 /* OPEN */) {
// The server connection isn't open. Nothing to do.
return;
}
if (socket.bufferedAmount > packet.length) {
// The network is lagging, and we still haven't sent the previous frame.
// Don't flood the network, it will just make us laggy.
// If fcserver is running on the same computer, it should always be able
// to keep up with the frames we send, so we shouldn't reach this point.
return;
}
// Dest position in our packet. Start right after the header.
var dest = 4;
var thisTime = (new Date().getTime()); //milliseconds
var seconds = thisTime * 0.001;
var minutes = seconds / 60.0;
var hours = minutes / 60.0;
var elapsed = (thisTime - startTime);
var secondHand = Math.round(seconds) % leds;
var minuteHand = Math.round(minutes) % leds;
var hourHand = Math.round(hours) % leds;
// Sample the center pixel of each LED
for (var led = 0; led < leds; led++) {
var angle = (2* Math.PI * led) / leds;
var redVal, greenVal, blueVal;
if(led == secondHand) {
redVal = 255;
greenVal = 0;
blueVal = 0;
}
else if(led == minuteHand) {
redVal = 0;
greenVal = 255;
blueVal = 0;
}
else if(led == hourHand) {
redVal = 0;
greenVal = 0;
blueVal = 255;
}
else {
redVal = 0;
greenVal = 0;
blueVal = 0;
}
//var br = Math.sin(angle + elapsed*4.0)+0.8;
packet[dest++] = redVal;
packet[dest++] = greenVal;
packet[dest++] = blueVal;
}
socket.send(packet.buffer);
}
var red = Math.random(0, 255);
var green = Math.random(0, 255);
var blue = Math.random(0, 255);
// Animation loop
var animate = function() {
writeFrame(red, green, blue);
setTimeout(animate, 1); //milliseconds
}
// Connect to a Fadecandy server running on the same computer, on the default port
var socket = new WebSocket('ws://localhost:7890');
// Put some connection status text in the corner of the screen
$('#connectionStatus').text('Connecting to fcserver...');
socket.onclose = function(event) {
$('#connectionStatus').text('Not connected to fcserver');
}
socket.onopen = function(event) {
$('#connectionStatus').text('Connected');
animate();
}
</script>
</head>
<body>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment