red sphere with lightning in regl

render-light.js

const mat4 = require('gl-mat4')
const sphere = require('primitive-icosphere')
const fit = require('canvas-fit')
const normals = require('angle-normals')
const regl = require('regl')()
const camera = require('lookat-camera')()

var mesh = sphere(1, {
  subdivisions: 5
})

const cube = regl({
  frag: `
    precision mediump float;
    uniform vec3 color;
    uniform vec3 light;
    varying vec3 vnormal;
    varying vec3 vposition;
    void main () {
      vec3 direction = normalize(light - vposition);
      vec3 normal = normalize(vnormal);
      float power = max(0.0, dot(direction, vnormal));
      gl_FragColor = vec4(mix(vec3(power, power, power), vec3(0.7, 0.1, 0.1), 0.7), 1.0);
    }`,
  vert: `
    precision mediump float;
    uniform mat4 proj;
    uniform mat4 model;
    uniform mat4 view;
    attribute vec3 position;
    attribute vec3 normal;
    varying vec3 vnormal;
    varying vec3 vposition;
    void main () {
      vnormal = normal;
      vposition = position;
      gl_Position = proj * view * model * vec4(position, 1.0);
    }`,
  attributes: {
    position: regl.buffer(mesh.positions),
    normal: regl.buffer(mesh.normals)
  },
  elements: regl.elements(mesh.cells),
  uniforms: {
    proj: mat4.perspective([], Math.PI / 2, window.innerWidth / window.innerHeight, 0.01, 1000),
    model: regl.prop('model'),
    view: regl.prop('view'),
    color: regl.prop('color'),
    light: regl.prop('light')
  }
})

var scale

regl.frame(function (props, context) {
  regl.clear({
    color: [0, 0, 0, 1]
  })
  camera.position = [0, 5, 0]
  camera.target = [0, 0, 0]
  camera.up = [0, 0, 1]
  scale = 2
  cube({
    view: camera.view(),
    color: [1, 0, 0],
    light: [Math.cos(context.count * 0.01) * 10, Math.sin(context.count * 0.01) * 10, 5],
    model: mat4.scale(mat4.identity([]), mat4.identity([]), [scale, scale, scale])
  })
})