jonkwheeler

// Enter slack in the browser. https://{insert your team name here}.slack.com/messages/
// Click on the channel you want.
// Click the information icon.
// Expand the members dropdown.
// Click "See All Members"

// Paste the next line into the console, hit enter.
var imageList = new Array()

// If your channel has more than 19 members, the list won't display past that. It also unloads them from the state as you scroll.

derek-duncan

import React, { Component } from 'react';

const withDeferRender = Presentational =>
  class DeferRender extends Component {
    state = {
      shouldRender: false,
    };

    componentDidMount() {
      window.requestAnimationFrame(() => {

cliffhall

This demo builds on previous gists in this series to render an audio-modulated WebGL animation, and output a 48 FPS, 1080p, HD video utilizing:

• HTML5's Web Audio API for analysing an audio file.
• HTML5's Web Worker API for offloading communications between the web page and the server to separate thread.
• Socket.io for sending messages (including image and audio files) between client and server.
• Node.js for the server process for storing generated images and uploaded audio and creating the final video.
• FFMpeg for the actual video creation.
• Fluent-ffmpeg for making the configuration and execution of FFMpeg commands easy peasy.
• @ffmpeg-installer/ffmpeg for installing the correct version of FFMpeg for the hardware this demo runs on.
• mkdirp for creating the folder path for each client's data, including any missing nodes in the path.

cliffhall

This example renders thirty frames of the Three.js 'your first scene' example and sends them to a Node.js microservice, which saves them to the filesystem.

test-render-client.html

• Creates the scene, camera, renderer, and kicks off the render loop, which stops after 30 frames have been rendered.
• As an optimization, it doesn't add the Three.js canvas to the browser DOM, rendering it offscreen, but reporting progress.
• It extracts the data for each frame using canvas.toDataURL(), sending that to a web worker process for transmission.
• When all frames are rendered, it sends a 'done' message to the worker.

test-render-worker.js

• Sets up a queue for incoming frames to be sent to the server.

thevangelist

import React from 'react';
import { shallow } from 'enzyme';
import MyComponent from '../src/my-component';

const wrapper = shallow(<MyComponent/>);

describe('(Component) MyComponent', () => {
  it('renders without exploding', () => {
    expect(wrapper).to.have.length(1);
  });

webcaetano

var dragonBones;
(function (dragonBones) {
    (function (display) {
        var PhaserDisplayBridge = (function () {
            function PhaserDisplayBridge() {
            }

            PhaserDisplayBridge.prototype.getVisible = function () {
                return this._display ? this._display.visible : false
            };