wonglok

function FaceMomo() {
  // ready-player-me
  let glb = useGLTF(`/facecap/4cbc677b-3c53-4787-b62e-288d84f379a0.glb`);
  let text = useLoader(
    FileLoader,
    // from facecap
    `/facecap/FC_2021-11-18_11-4-48_testing.txt`
  );
  let render = useRef(() => {});
  //

wonglok

import { useEffect, useState } from "react";

export const getID = function () {
  return (
    "_" +
    Math.random().toString(36).substr(2, 9) +
    Math.random().toString(36).substr(2, 9)
  );
};

wonglok

https://stackoverflow.com/questions/23006414/3d-texture-in-webgl-three-js-using-2d-texture-workaround/23040903#23040903

wonglok

let isFunction = function(obj) {
  return typeof obj === 'function' || false;
}

class EventEmitter {
  // https://gist.github.com/datchley/37353d6a2cb629687eb9
  constructor() {
    this.listeners = new Map();
  }

wonglok

THREE.VolumetericLightShader = {
  uniforms: {
    tDiffuse: {value:null},
    lightPosition: {value: new THREE.Vector2(0.5, 0.5)},
    exposure: {value: 0.18},
    decay: {value: 0.95},
    density: {value: 0.8},
    weight: {value: 0.4},
    samples: {value: 50}

wonglok

/* CopyRight © Wong Lok 2020, MIT Licensed */

class Teller {
  constructor () {
    const eventMap = {}

    const on = (name, fn) => {
      if (!eventMap[name]) {
        eventMap[name] = []

wonglok

import { WebGLCubeRenderTarget, Camera, Scene, Mesh, PlaneBufferGeometry, ShaderMaterial, BackSide, NoBlending, BoxBufferGeometry, CubeCamera, LinearMipmapLinearFilter } from 'three'
// import { Vector2, MeshBasicMaterial, DoubleSide, RGBFormat, LinearFilter, WebGLRenderTarget, CubeRefractionMapping, CubeReflectionMapping, EquirectangularReflectionMapping } from 'three'
import { Vector2, MeshBasicMaterial, DoubleSide, WebGLRenderTarget } from 'three'
import { cloneUniforms } from 'three/src/renderers/shaders/UniformsUtils.js'
class CustomWebGLCubeRenderTarget extends WebGLCubeRenderTarget {
  constructor (width, height, options) {
    super(width, height, options)
    this.ok = true
  }

wonglok

test

wonglok

import { Clock, Euler, Points, Quaternion, ShaderMaterial, SphereBufferGeometry, Vector3, Vector4 } from "three"
let glsl = (v, ...args) => {
  let str = ''
  v.forEach((e, i) => {
    str += e + (args[i] || '')
  })
  return str
}

class ValueDamper {

wonglok

// import { PlaneBufferGeometry } from 'three/build/three.module'
import { ShaderMaterial, PlaneBufferGeometry, Mesh } from 'three'
let glsl = v => v[0]
export class FastFlame {
  constructor ({ onLoop, onResize, onClean, resX = 128, resY = 128 }) {
    this.onLoop = onLoop
    this.onClean = onClean
    this.onResize = onResize

    this.out = {}