Skip to content

Instantly share code, notes, and snippets.

💭
Howdy 🤠

Alex Van Camp Lange

💭
Howdy 🤠
Block or report user

Report or block Lange

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View Permissions RFC.md

NodeCG Permission System RFC

Data Types

interface User {
	id: string;
	role_ids: string[]
}

interface Role {
@Lange
Lange / polymer-upgrade-regexes.md
Last active Aug 5, 2017
Regexes that help with upgrading Polymer 1.x to 2.x
View polymer-upgrade-regexes.md

Regexes that help with upgrading Polymer 1.x to 2.x

There have been some syntactical changes from Polymer 1.x to 2.x. Manually doing all these changes by hand in a large codebase can take a large amount of time. Here are some regexes to use with your editor's "Find and Replace" method that will speed up these rote tasks (assuming that your editor's "Find and Replace" method supports regex):

Convert from @apply(--foo); to @apply --foo;:

Find: @apply\((.*)\);
Relace with: @apply $1;

Convert from :host.foo to :host(.foo)

Find: :host(?![, \(])([^,\s]*)

@Lange
Lange / casparcg_ndi_instructions.md
Last active Aug 31, 2019
How to get NDI output to work in CasparCG
View casparcg_ndi_instructions.md

How to get NDI output to work in CasparCG

  1. Install NewTek Network Video Send.exe
  2. Install NewTek NDI AirSend Updater.exe
  3. The AirSend Updater has a bug, and will not properly copy the x64 version of the DLL to the correct place. So, you'll need to manually copy C:\Program Files\NewTek\NewTek NDI AirSend Updater\Processing.AirSend.x64.dll to C:\Windows\System32\, overwriting the existing file.
  4. Restart your PC.
  5. Configure the CasparCG Server to use a Newtek iVGA output. Even though it says iVGA, it will actually be outputting NDI thanks to the updated AirSend DLLs.
    • You can do this manually by adding a <newtek-ivga /> consumer to your casparcg.config, or you can do it via the third-party [Caspar
@Lange
Lange / nodecg-dashboard.md
Last active Apr 14, 2016
Short-term NodeCG Dashboard Solution
View nodecg-dashboard.md

What?

Chrome 50 was released on April 13th, 2016. It removed the Object.observe method, which NodeCG's Replicant system relies on. NodeCG ships with an Object.observe polyfill that we thought would be enough to keep things working until the new Proxy-based Replicants system was ready, but this was not the case. The polyfill isn't perfect, and as a result some Replicant operations do not function. This effectively means that the NodeCG dashboard no longer works in any browser.

A short-term solution

To address this problem in the short term while we complete the re-write of Replicants, we have created an Electron application that uses a build of CEF which still supports Object.observe.

Install Instructions (Windows)

  1. Download nodecg-dashboard.zip
@Lange
Lange / disable-gpu-compositing.md
Last active Jul 6, 2019
OBS Studio Browser Source --disable-gpu-compositing
View disable-gpu-compositing.md

To pass the --disable-gpu-compositing CEF flag to OBS Studio's Browser Source plugin, you'll need to add it to your OBS Studio shortcut.

Windows

  1. Locate your shortcut to OBS Studio.
  2. Right click the shortcut and hit "Properties".
  3. Add the following to the end of the "Target" field. Be sure to put a space before it: --disable-gpu-compositing
  4. Launch OBS Studio via this shortcut, and try out a Browser Source animation to verify that it does indeed appear smoother.
  5. OBS Studio updates usually delete and re-make this shortcut, so you may need to repeat these steps after every OBS Studio update.

FAQ

@Lange
Lange / describe_example.js
Last active Feb 16, 2016
Mocha `describe` example
View describe_example.js
describe('#foo', function () {
context('on mondays', function () {
it('should do bar', function () {
// ...
});
// More tests...
});
context('on every day except monday', function () {
@Lange
Lange / proxy-replicants.md
Last active Feb 14, 2016
Proxy-based NodeCG Replicants
View proxy-replicants.md

Before continuing, you may wish to read up on ES2015 Proxies:

##Why rewrite Replicants? First, it is important to acknowledge that a good Replicants system needs to solve two separate problems:

  1. Transmitting, ordering, and applying changes. Let's call this “network layer” for now.
  • This layer can be further divided into several sub-layers, but for this document let's treat them all as one.
  1. Providing a way to manipulate an object and detect changes made to that object. Let's call this the “detection layer” for now.
@Lange
Lange / bind_attribute.js
Created Oct 23, 2015
Unfinished `bind-replicant` attribute for NodeCG panels
View bind_attribute.js
/* global NodeCG */
(function() {
'use strict';
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
var item, i;
var addedNodes = mutation.addedNodes;
@Lange
Lange / bind_attribute.js
Created Oct 23, 2015
Unfinished `bind-replicant` attribute for NodeCG panels
View bind_attribute.js
/* global NodeCG */
(function() {
'use strict';
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
var item, i;
var addedNodes = mutation.addedNodes;
View gist:05721ee47c8e69c9ba22

What do you render your After Effects videos to? Animated GIF's/PNG's. Creating a dynamic follow block.
-@LILTALK

It depends on how long, large, and complex the animation is, as well as what I plan to do with it.

If the animation can be broken down into parts and replicated in HTML/SVG/Canvas, then I do that. I go layer by layer and figure out how to replicate it entirely in code.

If the animation can't be easily replicated in code, or if it just isn't time-efficient to do so, I then decide if it would be easier to work with as an EaselJS sprite or a WebM video.

EaselJS sprites are great for small, intricate things that are no more than a couple seconds long. I export from After Effects as a PNG sequence, then use TexturePacker to create a single sprite sheets and generate the EaselJ

You can’t perform that action at this time.