const regl = require('../regl')()
const normals = require('angle-normals')
const mat4 = require('gl-mat4')
const bunny = require('bunny')

const drawBunny = regl({
  vert: `
  precision mediump float;
  attribute vec3 position, normal;
  uniform mat4 view, projection;
  varying vec3 fragNormal, fragPosition;
  void main() {
    fragNormal = normal;
    fragPosition = position;
    gl_Position = projection * view * vec4(position, 1);
  }`,

  frag: `
  precision mediump float;
  struct Light {
    vec3 color;
    vec3 position;
  };
  uniform Light lights[4];
  varying vec3 fragNormal, fragPosition;
  void main() {
    vec3 normal = normalize(fragNormal);
    vec3 light = vec3(0, 0, 0);
    for (int i = 0; i < 4; ++i) {
      vec3 lightDir = normalize(lights[i].position - fragPosition);
      float diffuse = max(0.0, dot(lightDir, normal));
      light += diffuse * lights[i].color;
    }
    gl_FragColor = vec4(light, 1);
  }`,

  attributes: {
    position: regl.buffer(bunny.positions),
    normal: regl.buffer(normals(bunny.cells, bunny.positions))
  },

  elements: regl.elements(bunny.cells),

  uniforms: {
    view: (props, {count}) => {
      const t = 0.01 * count
      return mat4.lookAt([],
        [30 * Math.cos(t), 2.5, 30 * Math.sin(t)],
        [0, 2.5, 0],
        [0, 1, 0])
    },
    projection: (props, {viewportWidth, viewportHeight}) => {
      return mat4.perspective([],
        Math.PI / 4,
        viewportWidth / viewportHeight,
        0.01,
        1000)
    },
    'lights[0].color': [1, 0, 0],
    'lights[1].color': [0, 1, 0],
    'lights[2].color': [0, 0, 1],
    'lights[3].color': [1, 1, 0],
    'lights[0].position': (props, {count}) => {
      const t = 0.1 * count
      return [
        10 * Math.cos(t),
        10 * Math.sin(2 * t),
        10 * Math.cos(3 * t)
      ]
    },
    'lights[1].position': (props, {count}) => {
      const t = 0.1 * count
      return [
        10 * Math.cos(5 * t + 1),
        10 * Math.sin(4 * t),
        10 * Math.cos(0.1 * t)
      ]
    },
    'lights[2].position': (props, {count}) => {
      const t = 0.1 * count
      return [
        10 * Math.cos(9 * t),
        10 * Math.sin(0.25 * t),
        10 * Math.cos(4 * t)
      ]
    },
    'lights[3].position': (props, {count}) => {
      const t = 0.1 * count
      return [
        10 * Math.cos(0.3 * t),
        10 * Math.sin(2.1 * t),
        10 * Math.cos(1.3 * t)
      ]
    }
  }
})

regl.frame((props, count) => {
  regl.clear({
    depth: 1,
    color: [0, 0, 0, 1]
  })

  drawBunny()
})

@@ -965,28 +965,16 @@
 sition: 
-regl.buffer(
 bunny.po
@@ -980,17 +980,16 @@
 ositions
-)
 ,%0A    no
@@ -998,20 +998,8 @@
 al: 
-regl.buffer(
 norm
@@ -1031,17 +1031,16 @@
 sitions)
-)
 %0A  %7D,%0A%0A 
@@ -1054,22 +1054,8 @@
 ts: 
-regl.elements(
 bunn
@@ -1061,17 +1061,16 @@
 ny.cells
-)
 ,%0A%0A  uni
@@ -1089,23 +1089,16 @@
  view: (
-props, 
 %7Bcount%7D)
@@ -1276,23 +1276,16 @@
 ction: (
-props, 
 %7Bviewpor
@@ -1315,24 +1315,15 @@
 ) =%3E
- %7B
 %0A      
-return 
 mat4
@@ -1427,22 +1427,16 @@
    1000)
-%0A    %7D
 ,%0A    'l
@@ -1584,39 +1584,32 @@
 %5B0%5D.position': (
-props, 
 %7Bcount%7D) =%3E %7B%0A  
@@ -1768,39 +1768,32 @@
 %5B1%5D.position': (
-props, 
 %7Bcount%7D) =%3E %7B%0A  
@@ -1962,39 +1962,32 @@
 %5B2%5D.position': (
-props, 
 %7Bcount%7D) =%3E %7B%0A  
@@ -2161,23 +2161,16 @@
 tion': (
-props, 
 %7Bcount%7D)
@@ -2351,20 +2351,8 @@
 me((
-props, count
 ) =%3E

update lighting demo