#77 Merge audio module

examples/whs-module-audio/positional/index.pug

@@ -0,0 +1,5 @@
+extends ../../layout.pug
+
+block additional
+  script(src='../../assets/modules/StatsModule.js')
+  script(src='../../../modules/whs-module-audio/build/AudioModule.js')

examples/whs-module-audio/positional/script.js

@@ -0,0 +1,86 @@
+import * as UTILS from '../../globals';
+
+const controlsModule = new WHS.controls.OrbitModule();
+
+const cameraModule = new WHS.app.CameraModule({
+  position: {
+    z: 250,
+    y: 100
+  },
+
+  far: 30000,
+  near: 1
+});
+
+const world = new WHS.App([
+  ...UTILS.appModules({
+    position: new THREE.Vector3(0, 10, 200)
+  }),
+
+  controlsModule,
+  cameraModule
+]);
+
+controlsModule.controls.autoRotate = true;
+
+const audioModule = new AudioModule({
+  loop: true
+});
+
+const sphere = new WHS.Sphere({
+  geometry: {
+    radius: 20
+  },
+
+  shadow: {
+    cast: false
+  },
+
+  material: new THREE.MeshBasicMaterial({
+    color: 0xffffff
+  }),
+
+  modules: [
+    audioModule
+  ],
+
+  position: {
+    y: 5
+  }
+
+});
+sphere.addTo(world);
+
+audioModule.addListener(cameraModule.camera);
+audioModule.playAudio(`${process.assetsPath}/sounds/folk.mp3`);
+
+new WHS.PointLight({
+  light: {
+    color: 0xffffff,
+    intensity: 1,
+    distance: 1000
+  },
+
+  position: [10, 40, 10]
+}).addTo(world);
+
+new WHS.Box({
+  geometry: {
+    width: 2000,
+    height: 0.1,
+    depth: 2000
+  },
+
+  shadow: {
+    cast: false
+  },
+
+  material: new THREE.MeshPhongMaterial({
+    color: 0xffffff
+  }),
+
+  position: [0, -60, 0],
+  rotation: [0, 0, 25]
+}).addTo(world);
+
+world.start();

gulp/dev.js

@@ -48,6 +48,7 @@ gulp.task('dev', () => {
   });
 
   app.use('/assets', express.static(path.resolve(__dirname, `${examples}/assets`)));
+  app.use('/modules', express.static('modules'));
 
   app.set('views', path.resolve(__dirname, `./${examples}`));
   app.set('view engine', 'pug');

modules/.babelrc

@@ -0,0 +1,11 @@
+{
+  "presets": [
+    "es2015"
+  ],
+  "plugins": [
+    "add-module-exports",
+    "transform-decorators-legacy",
+    "transform-class-properties",
+    "transform-object-rest-spread"
+  ]
+}

modules/whs-module-audio/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "whs-module-audio",
+  "version": "0.0.1",
+  "description": "Audio module for whs",
+  "main": "build/AudioPlugin.js",
+  "scripts": {
+    "start": "webpack --watch",
+    "build": "webpack",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "whs-module",
+    "audio"
+  ],
+  "author": "hirako2000",
+  "license": "MIT"
+}

modules/whs-module-audio/src/index.js

@@ -0,0 +1,40 @@
+import {
+  PositionalAudio,
+  AudioListener,
+  AudioLoader
+} from 'three';
+
+export default class PositionalAudioModule {
+  constructor(params = {}) {
+    this.params = Object.assign({
+      loop: true
+    }, params);
+
+    this.audioListener = new AudioListener();
+    this.audioLoader = new AudioLoader();
+
+    this.positionalAudio = new PositionalAudio(this.audioListener);
+    this.positionalAudio.setLoop(this.params.loop);
+  }
+
+  addListener(object) {
+    object.native.add(this.audioListener);
+  };
+
+  playAudio(path) {
+    const sound = this.positionalAudio;
+
+    this.audioLoader.load(path, buffer => {
+      sound.setBuffer(buffer);
+      sound.setRefDistance(50);
+      sound.play();
+    });
+  };
+
+  bridge = {
+    mesh(mesh, self) {
+      mesh.add(self.positionalAudio);
+      return mesh;
+    }
+  }
+}

modules/whs-module-audio/webpack.config.babel.js

@@ -0,0 +1,45 @@
+import path from 'path';
+import webpack from 'webpack';
+
+process.env.BABEL_ENV = 'browser';
+
+const isProduction = process.env.NODE_ENV === 'production';
+
+console.log(
+  isProduction
+  ? 'Production mode'
+  : 'Development mode'
+);
+
+export default {
+  devtool: isProduction ? false : 'source-map',
+  entry: './src/index.js',
+  target: 'web',
+  output: {
+    path: path.join(__dirname, './build/'),
+    filename: 'AudioModule.js',
+    libraryTarget: 'umd',
+    library: 'AudioModule'
+  },
+  externals: {
+    whs: 'WHS',
+    three: 'THREE'
+  },
+  module: {
+    loaders: [
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader'
+      }
+    ]
+  },
+  plugins: isProduction
+  ? [
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {warnings: false},
+      minimize: true
+    })
+  ]
+  : []
+};