you are acting like a little schoolgirl, and not in a hot way

chee · May 14, 2018 · deed581 · deed581
1 parent 6e3d4f6
commit deed581
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 22 deletions.
diff --git a/api/index.js b/api/index.js
@@ -5,6 +5,19 @@ const wss = new Server({port: 3714})
 const channels = {}
 const channelUsers = {}
 
+const tell = (channel, message, current) => {
+  channelUsers[channel].forEach(user => {
+    if (user.readyState !== OPEN) {
+      channelUsers[channel] = channelUsers[channel].filter(user =>
+        user.readyState === OPEN
+      )
+      return
+    }
+    if (user === current) return
+    user.send(JSON.stringify(message))
+  })
+}
+
 wss.on('connection', (ws, request) => {
   let channel
 
@@ -21,23 +34,20 @@ wss.on('connection', (ws, request) => {
     },
     position (id, x, y, z) {
       channels[channel][id] = {x, y, z}
-      channelUsers[channel].forEach(user => {
-        if (user.readyState !== OPEN) {
-          channelUsers[channel] = channelUsers[channel].filter(user =>
-            user.readyState === OPEN
-          )
-        }
-        user.send(JSON.stringify({
-          type: 'position',
-          position: [id, x, y, z]
-        }))
+      tell(channel, {
+        type: 'position',
+        position: [id, x, y, z]
       })
+    },
+    noemi () {
+      tell(channel, {type: 'noemi'}, ws)
     }
   }
 
   ws.on('message', message => {
     const [type, ...data] = JSON.parse(message)
-    handlers[type](...data)
+    const handler = handlers[type]
+    handler && handler(...data)
   })
 })
 
diff --git a/client/index.html b/client/index.html
@@ -1,8 +1,9 @@
 <!doctype quirks>
 <meta charset="utf-8">
 <title>🐝🕷🕷🐞🐞🦗🦗🦗🐜🐜🐜</title>
-<link rel="stylesheet" href="./normal.css"/>
-<link rel="stylesheet" href="./index.sass"/>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="stylesheet" href="./normal.css">
+<link rel="stylesheet" href="./index.sass">
 
 <article id="overlay" class="overlay"></article>
 

diff --git a/client/index.js b/client/index.js
@@ -38,6 +38,9 @@ const handlers = {
   },
   position ({position}) {
     update(position)
+  },
+  noemi () {
+    toggleHomo('no homo')
   }
 }
 
@@ -51,7 +54,19 @@ function upload (positions) {
   ws.send(JSON.stringify(['position', ...positions]))
 }
 
-function getCoordsFromEvent ({clientX, clientY}) {
+function getCoordsFromEvent ({clientX, clientY, touches}) {
+  if (touches) {
+    const {
+      clientX,
+      clientY
+    } = touches[0]
+    console.log({clientX, clientY, radius})
+
+    return {
+      x: clientX - radius,
+      y: clientY
+    }
+  }
   return {
     x: clientX - radius,
     y: clientY - radius
@@ -84,41 +99,55 @@ function update ([id, x, y, z]) {
   })
 }
 
-document.body.addEventListener('pointerdown', event => {
+const handleDown = event => {
   if (!event.target.classList.contains(pieceClass)) return
 
+  document.body.style.overflow = 'hidden'
+
   element = event.target
   dragging = true
   element.style.position = 'absolute'
 
   moveAndSet(getCoordsFromEvent(event))
   element.style.zIndex = highestZ++
-})
+}
 
-document.body.addEventListener('pointermove', event => {
+const handleMove = event => {
   if (!dragging || !element) return
 
   moveAndSet(getCoordsFromEvent(event))
-})
+}
 
-document.body.addEventListener('pointerup', event => {
+const handleUp = event => {
   const {id} = element
   const {x, y, z} = positions[id]
+  document.body.style.overflow = 'initial'
   dragging = false
   element = null
   upload([id, x, y, z])
-})
+}
+
+document.body.addEventListener('mousedown', handleDown)
+document.body.addEventListener('mousemove', handleMove)
+document.body.addEventListener('mouseup', handleUp)
+
+document.body.addEventListener('touchstart', handleDown)
+document.body.addEventListener('touchmove', handleMove)
+document.body.addEventListener('touchend', handleUp)
 
 function createTyper (word, fn) {
   let typed = []
   window.addEventListener('keydown', event => {
     typed.push(event.key)
-    typed = typed.splice(-word.length)
+    typed = typed.slice(-word.length)
     if (typed.join('') === word) fn()
   })
 }
 
-const toggleHomo = () => document.body.classList.toggle('gay')
+function toggleHomo (nohomo) {
+  document.body.classList.toggle('gay')
+  nohomo || ws.send('["noemi"]')
+}
 
 createTyper('gay', toggleHomo)
 createTyper('noemi', toggleHomo)