adding emoji

1 files changed, 31 insertions, 11 deletions

diff --git a/client/index.js b/client/index.js
index 4a86930..5091da7 100644
--- a/client/index.js
+++ b/client/index.js
@@ -1,7 +1,7 @@
 import Tone from 'tone'
 import keys from './lib/keys'
 import color from './lib/color'
-import { browser, requestAudioContext, clamp, choice, firstTouch } from './lib/util'
+import { browser, requestAudioContext, randrange, clamp, choice, firstTouch } from './lib/util'
 
 const compressor = new Tone.Compressor(-30, 3).toMaster()
 
@@ -15,11 +15,21 @@ requestAudioContext( () => {
   console.log('ready')
 })
 
+let images = []
+let img;
+
+for (var i = 745; i <= 750; i++) {
+  img = new Image
+  img.src = 'img/' + i + '.png'
+  images.push(img)
+}
+
 let offsets = []
 let loading = true
 
 let player = new Tone.MultiPlayer({
-  applause: 'applause.mp3',
+  // applause: 'applause.mp3',
+  applause: '0bB7tTknkDw.mp3',
 }, () => {
   loading = false
   let data = player.buffers.get('applause').get().getChannelData(0)
@@ -61,6 +71,7 @@ canvas.height = window.innerHeight
 let ctx = canvas.getContext('2d')
 document.body.appendChild(canvas)
 
+let count = 0
 function down (e) {
   drawing = true
   mouse.x = e.pageX / window.innerWidth
@@ -77,10 +88,17 @@ function move (e){
     inertialIntensity = Math.min(0.999, intensity)
     if (intensity == 0.999) intensity -= (Math.random() * 0.4)
     if (inertialIntensity == 0.999) inertialIntensity -= (Math.random() * 0.3)
-    ctx.fillStyle = color(intensity)
-    ctx.beginPath()
-    ctx.arc( x*window.innerWidth, y*window.innerHeight, v*500, 0, Math.PI*2 )
-    ctx.fill()
+    // ctx.fillStyle = color(intensity)
+    // ctx.beginPath()
+    // ctx.arc( x*window.innerWidth, y*window.innerHeight, v*500, 0, Math.PI*2 )
+    // ctx.fill()
+    if ((count++ % 5) == 0) {
+      ctx.save()
+      ctx.translate(x*window.innerWidth, y*window.innerHeight)
+      ctx.rotate(Math.random() - 0.5)
+      ctx.drawImage(choice(images), 0, 0)
+      ctx.restore()
+    }
   }
   mouse.x = x
   mouse.y = y
@@ -108,8 +126,12 @@ const fonts = ['Arial','Helvetica','Comic Sans MS','Chalkboard','Georgia']
 function animate(t){
   requestAnimationFrame(animate)
   ctx.save()
-  ctx.fillStyle=color(inertialIntensity/2)
-  ctx.globalAlpha = 0.4
+  // ctx.fillStyle=color(inertialIntensity/2)
+  const n = Math.floor( (0.5 + randrange(0, 1 - inertialIntensity/2) ) * 255 )
+  ctx.fillStyle = 'rgb(255,255,255)' // + [n,n,n] + ')'
+  ctx.globalAlpha = 0.02
+  ctx.fillRect(0, 0, w, h)
+
   const w = canvas.width
   const h = canvas.height
   ctx.save()
@@ -118,9 +140,7 @@ function animate(t){
   ctx.translate(-w/2,-h/2)
   ctx.drawImage(canvas, -2, -2, w+10, h+10)
   ctx.restore()
-  ctx.globalAlpha = 0.02 * Math.random()
-  ctx.fillRect(0, 0, w, h)
-  ctx.fillStyle='#000'
+  ctx.fillStyle='#fff'
   ctx.fillRect(0, 0, w, h)
   ctx.restore()
 }