chinghanho

/* Polyfill indexOf. */
var indexOf;

if (typeof Array.prototype.indexOf === 'function') {
    indexOf = function (haystack, needle) {
        return haystack.indexOf(needle);
    };
} else {
    indexOf = function (haystack, needle) {
        var i = 0, length = haystack.length, idx = -1, found = false;

chinghanho

This is now an actual repo:

https://github.com/cowboy/jquery-tiny-pubsub

chinghanho

function getPaginatedItems(items, page, pageSize) {
  var pg = page || 1,
    pgSize = pageSize || 100,
    offset = (pg - 1) * pgSize,
    pagedItems = _.drop(items, offset).slice(0, pgSize);
  return {
    page: pg,
    pageSize: pgSize,
    total: items.length,
    total_pages: Math.ceil(items.length / pgSize),

chinghanho

Encoding Video

Installing

Install FFmpeg with homebrew. You'll need to install it with a couple flags for webm and the AAC audio codec.

brew install ffmpeg --with-libvpx --with-libvorbis --with-fdk-aac --with-opus

chinghanho

const canvasSketch = require('canvas-sketch'); // not yet released tool
const Random = require('./util/random');
const { lerp } = require('./util/math');

// We can force a random seed or a specific string/number
Random.setSeed(Random.getRandomSeed());

const settings = {
  pixelsPerInch: 300,
  // When exporting, use the seed as the suffix

chinghanho

uniform sampler2D tex; // matched from gst-plugin-gl uniform

const vec4 kappa = vec4(1.0,1.7,0.7,15.0);

// These can be made uniform if they are added to:
// gst/gl/gstglfiltershader.c:363
// gst_gl_shader_set_uniform_1f (filtershader->shader0, "screen_width", width);
// gst_gl_shader_set_uniform_1f (filtershader->shader0, "screen_height", height);
const float screen_width = 1920.0; 

chinghanho

    // Fuzzy matching algorithm
    var fuzzyMatch = function(needle, haystack) {
        if(needle === "" || haystack === "") return true;

        needle = needle.toLowerCase().replace(/ /g, "");
        haystack = haystack.toLowerCase();

        // All characters in needle must be present in haystack
        var j = 0; // haystack position
        for(var i = 0; i < needle.length; i++) {

chinghanho

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
• elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
• elem.getClientRects(), elem.getBoundingClientRect()

chinghanho

// from http://scratch99.com/web-development/javascript/convert-bytes-to-mb-kb/
function bytesToSize(bytes) {
    var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
    if (bytes == 0) return 'n/a';
    var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
    if (i == 0) return bytes + ' ' + sizes[i];
    return (bytes / Math.pow(1024, i)).toFixed(1) + ' ' + sizes[i];
};

chinghanho

'use strict';
import Velocity from 'velocity-animate';

let baseEasings = {};

baseEasings.Bounce = p => {
  let pow2;
  let bounce = 4;
  while (p < ((pow2 = Math.pow(2, --bounce)) - 1) / 11) {}