Bling Out Your Laptop with a Festive Web-connected Light Show

/*
 * This is a minimal example, see extra-examples.cpp for a version
 * with more explantory documentation, example routines, how to
 * hook up your pixels and all of the pixel types that are supported.
 *
 */
    
#include "application.h"
#include "neopixel/neopixel.h" // use for Build IDE
// #include "neopixel.h" // use for local build
    
SYSTEM_MODE(AUTOMATIC);
    
// IMPORTANT: Set pixel COUNT, PIN and TYPE
#define PIXEL_PIN D2
#define PIXEL_COUNT 30
#define PIXEL_TYPE WS2812B
    
Adafruit_NeoPixel strip = Adafruit_NeoPixel(PIXEL_COUNT, PIXEL_PIN, PIXEL_TYPE);
    
// Prototypes for local build, ok to leave in for Build IDE
void rainbow(uint8_t wait);
uint32_t Wheel(byte WheelPos);
    
void setup()
{
  strip.begin();
  strip.show(); // Initialize all pixels to 'off'
  Particle.function("startRave",startRave);
}
void loop()
{
}
    
int startRave(String command) {
    if(command == "red"){
        colorWipe(strip.Color(255, 0, 0), 50); // Red
    }else if(command == "blue"){
        colorWipe(strip.Color(0, 0, 255), 50);
    }else if(command == "green"){
        colorWipe(strip.Color(0, 255, 0), 50);
    }else if(command == "rainbow"){
        rainbow(20);
    }else if(command == "clear"){
         colorWipe(strip.Color(0, 0, 0), 50);
    }
}
    
// Set all pixels in the strip to a solid color, then wait (ms)
void colorAll(uint32_t c, uint8_t wait) {
  uint16_t i;
  
  for(i=0; i<strip.numPixels(); i++) {
    strip.setPixelColor(i, c);
  }
  strip.show();
  delay(wait);
}
    
// Fill the dots one after the other with a color, wait (ms) after each one
void colorWipe(uint32_t c, uint8_t wait) {
    
    
  for(uint16_t i=0; i<strip.numPixels(); i++) {
    strip.setPixelColor(i, c);
    strip.show();
    delay(wait);
  }
}
    
void rainbow(uint8_t wait) {
  uint16_t i, j;
    
  for(j=0; j<256; j++) {
    for(i=0; i<strip.numPixels(); i++) {
      strip.setPixelColor(i, Wheel((i+j) & 255));
    }
    strip.show();
    delay(wait);
  }
}
    
// Slightly different, this makes the rainbow equally distributed throughout, then wait (ms)
void rainbowCycle(uint8_t wait) {
  uint16_t i, j;
    
  for(j=0; j<256; j++) { // 1 cycle of all colors on wheel
    for(i=0; i< strip.numPixels(); i++) {
      strip.setPixelColor(i, Wheel(((i * 256 / strip.numPixels()) + j) & 255));
    }
    strip.show();
    delay(wait);
  }
}
    
// Input a value 0 to 255 to get a color value.
// The colours are a transition r - g - b - back to r.
uint32_t Wheel(byte WheelPos) {
  if(WheelPos < 85) {
   return strip.Color(WheelPos * 3, 255 - WheelPos * 3, 0);
  } else if(WheelPos < 170) {
   WheelPos -= 85;
   return strip.Color(255 - WheelPos * 3, 0, WheelPos * 3);
  } else {
   WheelPos -= 170;
   return strip.Color(0, WheelPos * 3, 255 - WheelPos * 3);
  }
}

import {Injectable} from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import {LogService} from '../../core/services/log.service';
import {Observable} from 'rxjs/Rx';
import 'rxjs/add/operator/map';
    
    
@Injectable()
export class PhotonService {
  private requestURl: string;
  private accessToken: string;
    
  constructor(
    private logger: LogService,
    private http: Http) {
      logger.debug(`Photon initializing...`);
      //device id
      this.requestURl = 'https://api.particle.io/v1/devices/<use your device id here>/startRave/';
      //access token
      this.accessToken = '<your access token>';
  }
    
public startLightShow(mode: string) {
    
  let params = 'command=' + mode + '&access_token=' + this.accessToken;
    
  let headers = new Headers();
  headers.append('Content-Type', 'application/x-www-form-urlencoded');
    
  this.http.post(this.requestURl, params, {headers: headers})
    .map(res => res.json())
    .subscribe(
      data => params,
      err => this.handleError(err),
      () => console.log('Post Complete')
    );
}
    
  private handleError(error: Response) {
      return Observable.throw(error);
  }
    
}

<ul class="actions">
    <li (click)="startLightShow('rainbow')"><a class="button special rainbow">Start a Rainbow light show!</a></li>
    <li (click)="startLightShow('red')"><a class="button special red">Start a Red light show!</a></li>
    <li (click)="startLightShow('blue')"><a class="button special blue">Start a Blue light show!</a></li>
    <li (click)="startLightShow('green')"><a class="button special green">Start a Green light show!</a></li>
    <li (click)="startLightShow('clear')"><a class="button special black ">End light show</a></li>
</ul>