alexanderson1993

import { produce, applyPatches, enablePatches } from "immer";

enablePatches();

function setToValue(obj, value, path) {
  var i;
  path = path.split(".");
  for (i = 0; i < path.length - 1; i++) {
    if (!obj[path[i]]) {
      obj[path[i]] = isNaN(parseInt(path[i], 10)) ? {} : [];

alexanderson1993

import i18next from "i18next";
import {initReactI18next} from "react-i18next";
import LanguageDetector from "i18next-browser-languagedetector";
import codegen from "codegen.macro";
import debounce from "lodash.debounce";
i18next
  .use(LanguageDetector)
  .use(initReactI18next) // passes i18n down to react-i18next
  .init({
    resources: {},

alexanderson1993

import {
  React,
} from "https://unpkg.com/es-react";

declare global {
  namespace JSX {
    interface IntrinsicElements {
      h1: any;
      div: any;
      h2: any;

alexanderson1993

// A React hook which uses the WebUSB API to send DMX messages to a connected ENTTEC Pro device
// This will only work in Chrome.
// If you want to just try it, run it through the TypeScript compiler here https://www.typescriptlang.org/play/index.html

import React from "react";

declare global {
  interface Navigator {
    // This USB type comes from @types/w3c-web-usb
    readonly usb: USB;

alexanderson1993

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

alexanderson1993

// Set your secret key: remember to change this to your live secret key in production
// See your keys here: https://dashboard.stripe.com/account/apikeys
var stripe = require("stripe")(process.env.STRIPE_KEY_SECRET);

exports.handler = (event, context, callback) => {
  //console.log('Received event:', JSON.stringify(event, null, 2));

  const done = (err, res) =>
    callback(null, {
      statusCode: err ? "400" : "200",

alexanderson1993

import styled from "@emotion/styled";

const DragContainer = styled.div`
  height: 460px;
  max-height: 80vh;
  width: 100%;
  position: relative;
  overflow: hidden;
`;

alexanderson1993

async function setUpLights() {
  const lightingDevice = await navigator.usb.requestDevice({ filters: [] });
  await lightingDevice.open();
  await lightingDevice.claimInterface(0);

  // This comes from https://github.com/NERDDISCO/webusb-dmx512-controller 
  lightingDevice.controlTransferOut({
    // It's a USB class request
    requestType: "class",
    // The destination of this request is the interface

alexanderson1993

// animationValue is a number from 0 to 1, generated by a tweener
// In this case, I'm using a useAnimation hook.
function calculateAnimationValue(animationValue, arcLength, arcStart) {
  // Figure out where the animation starts
  const animationStart = arcStart / 360;
  
  // If our arc starts after where the animation currently is, return 0
  // This renders an invisible arc.
  if (animationValue < animationStart) {
    return 0;

alexanderson1993

import React from 'react'

export default function useCounter(initialCount) {
  const [time, setTime] = React.useState(initialCount);
  // The timer might not be exactly 1000 ms, so track the time
  // between intervals manually
  const lastTimeRef = React.useRef(Date.now())
  
  // This effect resets the timer to the initial count when it changes.
  React.useEffect(() => {