Merge pull request #2 from adzialocha/feature/light-version

Feature: Minimal version, volume keys, standalone mode

automaton/scripts/index.js

@@ -14,8 +14,14 @@ const INPUT_VALID_KEY_CODES = [
   KeyCode.RIGHT,
 ]
 
-const isDebugMode = false
-const isVisualsEnabled = true
+function hasMode(key) {
+  return window.location.href.includes(key)
+}
+
+const isDebugMode = hasMode('debug')
+const isMinimalMode = hasMode('minimal')
+const isStandaloneMode = hasMode('standalone')
+const isVisualsEnabled = !hasMode('novisuals')
 
 let isMoveLocked = false
 let isPatternFocussed = false
@@ -37,12 +43,14 @@ const visuals = new Visuals({
   initialWidth: window.innerWidth,
   isEnabled: isVisualsEnabled,
   isDebugMode,
+  isMinimalMode,
   onDistancesUpdated: distances => {
     composition.queueDistances(distances)
   },
 })
 
 const network = new Network({
+  isStandaloneMode,
   onOpen: () => {
     view.changeConnectionState(false, true)
   },
@@ -159,7 +167,7 @@ function initialize() {
 
 // Main keyboard control strokes
 window.addEventListener('keydown', (event) => {
-  const { keyCode, shiftKey, altKey, metaKey } = event
+  const { keyCode, shiftKey, altKey, metaKey, key } = event
 
   // Block everything to avoid browser keys
   if (
@@ -180,7 +188,7 @@ window.addEventListener('keydown', (event) => {
 
   // Press number + shift
   if (
-    shiftKey && (
+    shiftKey && key !== '*' && (
       (keyCode >= KeyCode.ONE && keyCode <= KeyCode.NINE) ||
       (keyCode === 222 || keyCode === 191)
     )
@@ -200,15 +208,24 @@ window.addEventListener('keydown', (event) => {
     return
   }
 
-  if (isPatternFocussed || !isRunning) {
+  if (keyCode === KeyCode.ENTER) {
+    if (view.isMainViewActive()) {
+      view.focusPattern()
+    }
+  }
+
+  if (isPatternFocussed || !isRunning || !isVisualsEnabled) {
     return
   }
 
+  const { audio } = composition.instrument.synthesizerInterface
+
   switch (keyCode) {
-  case KeyCode.ENTER:
-    if (view.isMainViewActive()) {
-      view.focusPattern()
-    }
+  case KeyCode.N:
+    audio.volumeDown()
+    break
+  case KeyCode.M:
+    audio.volumeUp()
     break
   case KeyCode.CAPS_LOCK:
     isMoveLocked = !isMoveLocked
@@ -234,7 +251,7 @@ window.addEventListener('keydown', (event) => {
 })
 
 window.addEventListener('keyup', (event) => {
-  if (isPatternFocussed || !isRunning) {
+  if (isPatternFocussed || !isRunning || !isVisualsEnabled) {
     return
   }
 
@@ -264,7 +281,10 @@ function onPointerLockChange() {
   const isPointerLocked = element === document.body
 
   view.changeSpaceState(isPointerLocked)
-  visuals.isEnabled = isPointerLocked
+
+  if (isVisualsEnabled) {
+    visuals.isEnabled = isPointerLocked
+  }
 
   isRunning = isPointerLocked
 
@@ -273,12 +293,14 @@ function onPointerLockChange() {
   } else {
     composition.stop()
 
-    visuals.controls.move({
-      backward: false,
-      forward: false,
-      left: false,
-      right: false,
-    })
+    if (isVisualsEnabled) {
+      visuals.controls.move({
+        backward: false,
+        forward: false,
+        left: false,
+        right: false,
+      })
+    }
   }
 }
 

automaton/scripts/instrument/AudioInterface.js

@@ -1,4 +1,5 @@
 const INITIAL_VOLUME = 0.5
+const VOLUME_CHANGE_RATE = 0.1
 
 export default class AudioInterface {
   constructor() {
@@ -59,6 +60,20 @@ export default class AudioInterface {
     }
   }
 
+  volumeUp() {
+    this.changeVolume(this.currentVolume + VOLUME_CHANGE_RATE)
+  }
+
+  volumeDown() {
+    const targetValue = this.currentVolume - VOLUME_CHANGE_RATE
+
+    if (targetValue < 0) {
+      this.changeVolume(0)
+    } else {
+      this.changeVolume(targetValue)
+    }
+  }
+
   mute() {
     this.changeVolume(0, false)
   }

automaton/scripts/network/index.js

@@ -3,7 +3,11 @@ import OSC, {
   IS_OPEN,
 } from 'osc-js'
 
+const TICK_INTERVAL = 8.333333333333334
+const TOTAL_TICKS = 120
+
 const defaultOptions = {
+  isStandaloneMode: false,
   onClientsChanged: () => true,
   onClose: () => true,
   onError: () => true,
@@ -16,6 +20,10 @@ export default class Network {
   constructor(options) {
     this.options = Object.assign({}, defaultOptions, options)
 
+    this.standaloneInterval = null
+    this.standaloneCurrentTick = 0
+    this.standaloneCurrentCycle = 0
+
     this.osc = new OSC()
 
     // osc events
@@ -63,6 +71,11 @@ export default class Network {
   }
 
   connect(configuration) {
+    if (this.options.isStandaloneMode) {
+      this.startStandalone()
+      return true
+    }
+
     if (this.osc.status() === IS_OPEN) {
       this.options.onError(new Error('Connection is already open'))
 
@@ -79,15 +92,51 @@ export default class Network {
   }
 
   disconnect() {
+    if (this.options.isStandaloneMode) {
+      this.stopStandalone()
+      return
+    }
+
     if (this.osc.status() === IS_CLOSED) {
       this.options.onError(new Error('Connection is already closed'))
     }
 
     this.osc.close()
   }
 
-  sendToAll() {
-    // const message = new OSC.Message(address)
-    // osc.send(message)
+  startStandalone() {
+    this.standaloneCurrentTick = 0
+    this.standaloneCurrentCycle = 0
+
+    this.standaloneInterval = setInterval(() => {
+      this.options.onSyncTick(
+        this.standaloneCurrentTick,
+        TOTAL_TICKS,
+        Date.now()
+      )
+
+      this.standaloneCurrentTick += 1
+
+      if (this.standaloneCurrentTick > TOTAL_TICKS) {
+        this.standaloneCurrentTick = 0
+        this.standaloneCurrentCycle += 1
+
+        this.options.onNextCycle(this.standaloneCurrentCycle)
+      }
+    }, TICK_INTERVAL)
+
+    setTimeout(() => {
+      this.options.onOpen()
+    })
+  }
+
+  stopStandalone() {
+    if (this.standaloneInterval) {
+      clearInterval(this.standaloneInterval)
+    }
+
+    setTimeout(() => {
+      this.options.onClose()
+    })
   }
 }

automaton/scripts/view/Settings.js

@@ -14,7 +14,7 @@ function resetStorage() {
 }
 
 const defaultConfiguration = {
-  serverHost: '192.168.1.100',
+  serverHost: '192.168.178.115',
   serverPort: 52525,
 }
 

automaton/scripts/visuals/Universe.js

@@ -60,7 +60,7 @@ function getGeometry(name, attributes) {
 }
 
 export default class Universe extends Object3D {
-  constructor(options) {
+  constructor(options, isMinimalMode = false) {
     super()
 
     const defaultOptions = {
@@ -102,39 +102,41 @@ export default class Universe extends Object3D {
     this.lightsAngle = []
     this.lightsRadius = []
 
-    for (let i = 0; i < this.options.lightsCount; i += 1) {
-      const light = new PointLight(
-        getColor(this.options.lightsColor),
-        this.options.lightsStrength,
-        this.options.lightsDistance,
-        2
-      )
+    if (!isMinimalMode) {
+      for (let i = 0; i < this.options.lightsCount; i += 1) {
+        const light = new PointLight(
+          getColor(this.options.lightsColor),
+          this.options.lightsStrength,
+          this.options.lightsDistance,
+          2
+        )
 
-      randomlyPositionObject(light, this.options.sphereSize)
+        randomlyPositionObject(light, this.options.sphereSize)
 
-      this.lightsAngle.push(
-        new Vector3(
-          randomRangePercentage(0.3, 0.8),
-          randomRangePercentage(0.3, 0.8),
-          randomRangePercentage(0.3, 0.8)
+        this.lightsAngle.push(
+          new Vector3(
+            randomRangePercentage(0.3, 0.8),
+            randomRangePercentage(0.3, 0.8),
+            randomRangePercentage(0.3, 0.8)
+          )
         )
-      )
 
-      const radius = randomRange(10, this.options.sphereSize / 2)
+        const radius = randomRange(10, this.options.sphereSize / 2)
 
-      this.lightsRadius.push(new Vector3(radius, radius + 10, radius - 10))
-      this.lights.push(light)
-    }
+        this.lightsRadius.push(new Vector3(radius, radius + 10, radius - 10))
+        this.lights.push(light)
+      }
 
-    this.lights.forEach(light => {
-      this.add(light)
-    })
+      this.lights.forEach(light => {
+        this.add(light)
+      })
+    }
 
     // Add objects to scenery
     this.options.collections.forEach(collection => {
       let meshMaterial
 
-      if (collection.material === 'phong') {
+      if (collection.material === 'phong' && !isMinimalMode) {
         meshMaterial = new MeshPhongMaterial({
           color: getColor(collection.meshColor),
           specular: getColor(collection.meshSpecular),
@@ -143,12 +145,12 @@ export default class Universe extends Object3D {
       } else {
         meshMaterial = new MeshBasicMaterial({
           color: getColor(collection.meshColor),
-          wireframe: collection.hasWireframes,
+          wireframe: isMinimalMode ? true : collection.hasWireframes,
         })
       }
 
       const mesh = mergeRandomlyPlacedObjects(
-        collection.count,
+        isMinimalMode ? Math.round(collection.count / 2) : collection.count,
         getGeometry(collection.geometry, collection.attributes),
         meshMaterial,
         this.options.sphereSize,

automaton/scripts/visuals/index.js

@@ -28,6 +28,7 @@ const defaultOptions = {
   initialWidth: 0,
   isDebugMode: false,
   isEnabled: true,
+  isMinimalMode: false,
   onDistancesUpdated: () => {},
 }
 
@@ -109,7 +110,7 @@ export default class Visuals {
 
   createUniverses() {
     this.options.galaxy.forEach(setting => {
-      const universe = new Universe(setting)
+      const universe = new Universe(setting, this.options.isMinimalMode)
 
       universe.position.set(
         setting.position.x,