fading

2 files changed, 13 insertions, 9 deletions

diff --git a/client/index.js b/client/index.js
index 6e348cd..dab7a7e 100644
--- a/client/index.js
+++ b/client/index.js
@@ -46,7 +46,7 @@ function tick (time) {
   // let offsetIndex = clamp( Math.floor(mouse.y * offsets.length + Math.cos(time/20)), 0, offsets.length-1 )
   inertialIntensity = Math.max(intensity, (intensity + inertialIntensity*(inertia-1))/inertia)
   console.log(inertialIntensity)
-  let offsetIntensity = 0.98 * inertialIntensity
+  let offsetIntensity = 0.94 * inertialIntensity + 0.02
   let offsetIndex = Math.floor(offsetIntensity * offsets.length + Math.cos(time))
   let offset = Math.max((offsets[offsetIndex] || 0) * GRAIN_TIME + ( 0.25 * Math.sin(time*17/7) ), 0)
   // console.log(offset, offsets[offsetIndex] * GRAIN_TIME, ( 0.25 * Math.cos(time*13/7)))
@@ -75,10 +75,10 @@ function move (e){
   if (drawing) {
     intensity = Math.min(0.999, intensity + v*0.1)
     inertialIntensity = Math.min(0.999, intensity)
-    if (intensity == 0.999) intensity -= (Math.random() * 0.45)
-    if (inertialIntensity == 0.999) inertialIntensity -= (Math.random() * 0.35)
-    const gray = Math.floor( clamp(1-(10*v),0,1)*255 )
-    ctx.fillStyle = 'rgb(' + [gray,gray,gray] + ')'
+    if (intensity == 0.999) intensity -= (Math.random() * 0.4)
+    if (inertialIntensity == 0.999) inertialIntensity -= (Math.random() * 0.3)
+    const gray = Math.floor( clamp((10*v),0,1)*127 )
+    ctx.fillStyle = 'rgb(' + [gray,gray,gray*2] + ')'
     ctx.beginPath()
     ctx.arc( x*window.innerWidth, y*window.innerHeight, v*500, 0, Math.PI*2 )
     ctx.fill()
@@ -108,9 +108,13 @@ else {
 function animate(){
   requestAnimationFrame(animate)
   ctx.save()
-  ctx.fillStyle='rgba(255,255,255,' + (1-(intensity || 0.01)) + ')'
-  ctx.globalAlpha = 0.001
-  ctx.fillRect(0,0,window.innerWidth,window.innerHeight)
+  ctx.fillStyle='rgba(0,0,0,' + (1-(intensity || 0.01)) + ')'
+  ctx.globalAlpha = 0.4
+  ctx.rotate(0.001)
+  ctx.drawImage(canvas, -2, -2, canvas.width+4, canvas.height+4)
+  ctx.rotate(-0.001)
+  ctx.globalAlpha = 0.05 * Math.random()
+  ctx.fillRect(0, 0, window.innerWidth, window.innerHeight)
   ctx.restore()
 }
 animate()
diff --git a/client/lib/util.js b/client/lib/util.js
index e8065d5..6eea11f 100644
--- a/client/lib/util.js
+++ b/client/lib/util.js
@@ -14,7 +14,7 @@ const browser = { isIphone, isIpad, isMobile, isDesktop }
 function clamp(n,a,b){ return n<a?a:n<b?n:b }
 function choice (a){ return a[ Math.floor(Math.random() * a.length) ] }
 function mod(n,m){ return n-(m * Math.floor(n/m)) }
-function firstTouch(f){ return e => f(e.touches[0]) }
+function firstTouch(f){ return e => e.preventDefault && f(e.touches[0]) }
 
 function requestAudioContext (fn) {
 	if (isMobile) {