mage-engine 3.20.1 → 3.21.0

package/dist/mage.js

@@ -386,13 +386,13 @@ function getAugmentedNamespace(n) {
 		});
 	});
 	return a;
-}var between = {exports: {}};/* Between.js v0.1.2-fix.2 */
+}var between$1 = {exports: {}};/* Between.js v0.1.2-fix.2 */
 
 (function (module, exports) {
 !function(t,n){module.exports=n();}(commonjsGlobal,function(){function O(t){return (O="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function r(t,n){for(var e=0;e<n.length;e++){var r=n[e];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r);}}function n(t,n,e){return n&&r(t.prototype,n),e&&r(t,e),t}function M(t,n,e){return n in t?Object.defineProperty(t,n,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[n]=e,t}function I(t){return (I=Object.getPrototypeOf||function(t){return t.__proto__})(t)}function o(t,n){return (o=Object.setPrototypeOf||function(t,n){return t.__proto__=n,t})(t,n)}function u(t,n,e){return (u="undefined"!=typeof Reflect&&Reflect.construct?Reflect.construct:function(t,n,e){var r=[null];r.push.apply(r,n);var u=new(t.bind.apply(t,r));return e&&o(u,e.prototype),u}).apply(null,arguments)}function _(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}var t=function(o){var a={},i=[];(o=o||this).on=function(t,n,e){return (a[t]=a[t]||[]).push([n,e]),o},o.off=function(t,n){t||(a={});for(var e=a[t]||i,r=e.length=n?e.length:0;r--;)n==e[r][0]&&e.splice(r,1);return o},o.emit=function(t){for(var n,e=a[t]||i,r=0<e.length?e.slice(0,e.length):e,u=0;n=r[u++];)n[0].apply(n[1],i.slice.call(arguments,1));return o};};var V=function(t,n,e){return t*(1-e)+n*e},e="undefined"!=typeof window?window:"undefined"!=typeof commonjsGlobal?commonjsGlobal:"undefined"!=typeof self?self:{};function a(t,n){return t(n={exports:{}},n.exports),n.exports}for(var i=a(function(t){var n=t.exports={Linear:{None:function(t){return t}},Quadratic:{In:function(t){return t*t},Out:function(t){return t*(2-t)},InOut:function(t){return (t*=2)<1?.5*t*t:-.5*(--t*(t-2)-1)}},Cubic:{In:function(t){return t*t*t},Out:function(t){return --t*t*t+1},InOut:function(t){return (t*=2)<1?.5*t*t*t:.5*((t-=2)*t*t+2)}},Quartic:{In:function(t){return t*t*t*t},Out:function(t){return 1- --t*t*t*t},InOut:function(t){return (t*=2)<1?.5*t*t*t*t:-.5*((t-=2)*t*t*t-2)}},Quintic:{In:function(t){return t*t*t*t*t},Out:function(t){return --t*t*t*t*t+1},InOut:function(t){return (t*=2)<1?.5*t*t*t*t*t:.5*((t-=2)*t*t*t*t+2)}},Sinusoidal:{In:function(t){return 1-Math.cos(t*Math.PI/2)},Out:function(t){return Math.sin(t*Math.PI/2)},InOut:function(t){return .5*(1-Math.cos(Math.PI*t))}},Exponential:{In:function(t){return 0===t?0:Math.pow(1024,t-1)},Out:function(t){return 1===t?1:1-Math.pow(2,-10*t)},InOut:function(t){return 0===t?0:1===t?1:(t*=2)<1?.5*Math.pow(1024,t-1):.5*(2-Math.pow(2,-10*(t-1)))}},Circular:{In:function(t){return 1-Math.sqrt(1-t*t)},Out:function(t){return Math.sqrt(1- --t*t)},InOut:function(t){return (t*=2)<1?-.5*(Math.sqrt(1-t*t)-1):.5*(Math.sqrt(1-(t-=2)*t)+1)}},Elastic:{In:function(t){var n,e=.1;return 0===t?0:1===t?1:(!e||e<1?(e=1,n=.1):n=.4*Math.asin(1/e)/(2*Math.PI),-e*Math.pow(2,10*(t-=1))*Math.sin((t-n)*(2*Math.PI)/.4))},Out:function(t){var n,e=.1;return 0===t?0:1===t?1:(!e||e<1?(e=1,n=.1):n=.4*Math.asin(1/e)/(2*Math.PI),e*Math.pow(2,-10*t)*Math.sin((t-n)*(2*Math.PI)/.4)+1)},InOut:function(t){var n,e=.1;return 0===t?0:1===t?1:(!e||e<1?(e=1,n=.1):n=.4*Math.asin(1/e)/(2*Math.PI),(t*=2)<1?e*Math.pow(2,10*(t-=1))*Math.sin((t-n)*(2*Math.PI)/.4)*-.5:e*Math.pow(2,-10*(t-=1))*Math.sin((t-n)*(2*Math.PI)/.4)*.5+1)}},Back:{In:function(t){return t*t*(2.70158*t-1.70158)},Out:function(t){return --t*t*(2.70158*t+1.70158)+1},InOut:function(t){var n=2.5949095;return (t*=2)<1?t*t*((n+1)*t-n)*.5:.5*((t-=2)*t*((n+1)*t+n)+2)}},Bounce:{In:function(t){return 1-n.Bounce.Out(1-t)},Out:function(t){return t<1/2.75?7.5625*t*t:t<2/2.75?7.5625*(t-=1.5/2.75)*t+.75:t<2.5/2.75?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375},InOut:function(t){return t<.5?.5*n.Bounce.In(2*t):.5*n.Bounce.Out(2*t-1)+.5}}};}),c=(i.Linear,i.Quadratic,i.Cubic,i.Quartic,i.Quintic,i.Sinusoidal,i.Exponential,i.Circular,i.Elastic,i.Back,i.Bounce,a(function(a){(function(){var t,n,e,r,u,o;"undefined"!=typeof performance&&null!==performance&&performance.now?a.exports=function(){return performance.now()}:"undefined"!=typeof process&&null!==process&&process.hrtime?(a.exports=function(){return (t()-u)/1e6},n=process.hrtime,r=(t=function(){var t;return 1e9*(t=n())[0]+t[1]})(),o=1e9*process.uptime(),u=r-o):Date.now?(a.exports=function(){return Date.now()-e},e=Date.now()):(a.exports=function(){return (new Date).getTime()-e},e=(new Date).getTime());}).call(e);})),l="undefined"==typeof window?e:window,f=["moz","webkit"],s="AnimationFrame",p=l["request"+s],h=l["cancel"+s]||l["cancelRequest"+s],m=0;!p&&m<f.length;m++)p=l[f[m]+"Request"+s],h=l[f[m]+"Cancel"+s]||l[f[m]+"CancelRequest"+s];if(!p||!h){var d=0,y=0,v=[];p=function(t){if(0===v.length){var n=c(),e=Math.max(0,1e3/60-(n-d));d=e+n,setTimeout(function(){for(var t=v.slice(0),n=v.length=0;n<t.length;n++)if(!t[n].cancelled)try{t[n].callback(d);}catch(t){setTimeout(function(){throw t},0);}},Math.round(e));}return v.push({handle:++y,callback:t,cancelled:!1}),y},h=function(t){for(var n=0;n<v.length;n++)v[n].handle===t&&(v[n].cancelled=!0);};}var b=function(t){return p.call(l,t)};b.cancel=function(){h.apply(l,arguments);},b.polyfill=function(t){t||(t=l),t.requestAnimationFrame=p,t.cancelAnimationFrame=h;};var w,k,P=[],T=Symbol("type"),j=Symbol("start_time"),x=Symbol("completed"),D=Symbol("paused"),g=requestAnimationFrame||b,A=Date.now();!function t(){g(t),w=Date.now(),k=w-A;for(var n=0;n<P.length;n++)P[n][x]||P[n](k,Date.now()-P[n][j]);A=w;}();var E=function(t){function g(e,t){var n,r,u,o;!function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}(this,g),u=this,o=I(g).call(this),M(_(_(r=!o||"object"!=typeof o&&"function"!=typeof o?_(u):o)),"update",function(){var e=_(_(r))._updateValue;return function(t,n){r[x]||r[D]||(0===r.localTime&&r.emit("start",r.value,_(_(r))),e(r.ease(r.loopFunction.progress(Math.min(1,(n||r.localTime)/r.duration)))),r.emit("update",r.value,_(_(r)),t),r.localTime>=r.duration&&r.loopFunction.complete(function(){r[x]=!0,r.emit("complete",r.value,_(_(r)));}),r.localTime+=t);}});var a=r.plugin=Object.values(g._plugins).reduce(function(t,n){return t||n&&n.test&&n.test(e)&&n},!1),i=a&&a.name||("object"===O(e)?Array.isArray(e)?"array":"object":"number");if(a){var c=a.initialize(e,t);e=c.startValue,t=c.destValue,r.data=c.data;}switch(Object.assign(_(_(r)),(M(n={duration:1e3,localTime:0,startValue:e,destValue:t,loopMode:"once",loopFunction:g.DEFAULT_LOOP,ease:function(t){return t},value:"array"===i?[].concat(e):"object"===i?Object.assign({},e):e},x,!1),M(n,T,i),M(n,j,Date.now()),M(n,D,!1),n)),r[T]){case"number":r._updateValue=function(t){r.value=V(r.startValue,r.destValue,t);};break;case"array":var l=r.value.length,f=_(_(r)),s=f.startValue,p=f.destValue,h=f.value;r._updateValue=function(t){for(var n=0;n<l;n++)h[n]=V(s[n],p[n],t);};break;case"object":var m=Object.keys(r.startValue),d=m.length,y=_(_(r)),v=y.startValue,b=y.destValue,w=y.value;r._updateValue=function(t){for(var n=0;n<d;n++){var e=m[n];w[e]=V(v[e],b[e],t);}};break;default:r.plugin?r._updateValue=function(t){r.value=r.plugin.interpolate(r.startValue,r.destValue,t,r.data);}:(console.warn("Between: startValue type was unrecognized."),r._updateValue=function(){return null});}return P.push(r.update()),r}return n(g,null,[{key:"between",value:function(){for(var t=arguments.length,n=new Array(t),e=0;e<t;e++)n[e]=arguments[e];return u(g,n)}}]),n(g,[{key:"pause",value:function(){return this[D]=!0,this.emit("pause",this.value,this,k),this}},{key:"play",value:function(){return this[D]=!1,this.emit("play",this.value,this,k),this}},{key:"easing",value:function(t){return this.ease=t,this}},{key:"time",value:function(t){return this.duration=t,this}},{key:"loop",value:function(){for(var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:"once",n="__loop_".concat(t),e=arguments.length,r=new Array(1<e?e-1:0),u=1;u<e;u++)r[u-1]=arguments[u];return this.loopFunction=n in this?Object.assign({},g.DEFAULT_LOOP,this[n].apply(this,r)):g.DEFAULT_LOOP,this}},{key:"__loop_repeat",value:function(t){var n=this,e=t;return this.times=0,{complete:function(t){n.localTime=0,Number.isInteger(e)&&++n.times===e?t():Number.isInteger(e)||++n.times;}}}},{key:"__loop_bounce",value:function(t){var n=this,e=t,r=1;return this.times=0,{complete:function(t){n.localTime=0,r=-r,Number.isInteger(e)&&++n.times===e?t():Number.isInteger(e)||++n.times;},progress:function(t){return 0<r?t:1-t}}}},{key:"isPaused",get:function(){return this[D]}}]),function(t,n){if("function"!=typeof n&&null!==n)throw new TypeError("Super expression must either be null or a function");o(t.prototype,n&&n.prototype),n&&o(t,n);}(g,t),g}(t);return M(E,"DEFAULT_LOOP",{complete:function(t){return t()},progress:function(t){return t}}),E.Easing=i,E._plugins={},E});
-}(between));
+}(between$1));
 
-var Between = between.exports;/*! *****************************************************************************
+var between = between$1.exports;/*! *****************************************************************************
 Copyright (c) Microsoft Corporation. All rights reserved.
 Licensed under the Apache License, Version 2.0 (the "License"); you may not use
 this file except in compliance with the License. You may obtain a copy of the
@@ -53618,7 +53618,6 @@ var BOUNDINGBOX_NOT_AVAILABLE = "".concat(PREFIX, " Selected element does not ha
 var INVALID_EMITTER_ID = "".concat(PREFIX, " The selected emitter id is not valid.");
 var EMITTER_NOT_FOUND = "".concat(PREFIX, " The requested emitter could not be found");
 var FEATURE_NOT_SUPPORTED = "".concat(PREFIX, " The following features are not supported: ");
-var METHOD_NOT_SUPPORTED = "".concat(PREFIX, " This method is not supported.");
 var ANIMATION_NOT_FOUND = "".concat(PREFIX, " Required animation can't be found.");
 var ANIMATION_HANDLER_NOT_FOUND = "".concat(PREFIX, " AnimationHander hasn't been defined yet.");
 var ELEMENT_NOT_SET$1 = "".concat(PREFIX, " Body hasn't been defined yet.");
@@ -54441,9 +54440,9 @@ var createElementFromSelector = function createElementFromSelector(selector) {
   } catch (e) {
     return null;
   }
-};var DEFAULT_HEIGHT$1 = 600;
+};var DEFAULT_HEIGHT$2 = 600;
 var DEFAULT_WIDTH = 800;
-var DEFAULT_RATIO = DEFAULT_WIDTH / DEFAULT_HEIGHT$1;
+var DEFAULT_RATIO = DEFAULT_WIDTH / DEFAULT_HEIGHT$2;
 
 var Config = /*#__PURE__*/function () {
   function Config() {
@@ -54561,7 +54560,7 @@ var Config = /*#__PURE__*/function () {
     key: "getScreenDefaults",
     value: function getScreenDefaults() {
       return {
-        h: DEFAULT_HEIGHT$1,
+        h: DEFAULT_HEIGHT$2,
         w: DEFAULT_WIDTH,
         ratio: DEFAULT_RATIO
       };
@@ -54744,7 +54743,8 @@ var Universe$1 = new Universe();var generateUUID = function generateUUID() {
 };
 var generateRandomName = function generateRandomName(prefix) {
   return "".concat(prefix, "_").concat(generateUUID());
-};var uuid$1=/*#__PURE__*/Object.freeze({__proto__:null,generateUUID:generateUUID,generateRandomName:generateRandomName});var UP$1 = 'UP';
+};var uuid$1=/*#__PURE__*/Object.freeze({__proto__:null,generateUUID:generateUUID,generateRandomName:generateRandomName});var ALMOST_ZERO = 0.00001;
+var UP$1 = 'UP';
 var DOWN$1 = 'DOWN';
 var LEFT = 'LEFT';
 var RIGHT = 'RIGHT';
@@ -54845,7 +54845,7 @@ var EMPTY$2 = '';
 var QUERY_START = '?';
 var DEFAULT_SELECTOR = '#gameContainer';
 var BEFORE_UNLOAD = 'beforeunload';
-var HASH_CHANGE = 'hashchange';var lib_constants=/*#__PURE__*/Object.freeze({__proto__:null,UP:UP$1,DOWN:DOWN$1,LEFT:LEFT,RIGHT:RIGHT,FRONT:FRONT,BACK:BACK,VECTOR_UP:VECTOR_UP,VECTOR_DOWN:VECTOR_DOWN,VECTOR_LEFT:VECTOR_LEFT,VECTOR_RIGHT:VECTOR_RIGHT,VECTOR_FRONT:VECTOR_FRONT,VECTOR_BACK:VECTOR_BACK,ORIGIN:ORIGIN,ZERO_QUATERNION:ZERO_QUATERNION,MATERIALS:MATERIALS,TEXTURES:TEXTURES,EFFECTS:EFFECTS,COLLISION_EVENT:COLLISION_EVENT,COLORS:COLORS,ASSETS_TYPES:ASSETS_TYPES,OUTPUT_ENCODINGS:OUTPUT_ENCODINGS,DEFAULT_OUTPUT_ENCODING:DEFAULT_OUTPUT_ENCODING,ROOT:ROOT,DIVIDER:DIVIDER,HASH:HASH,EMPTY:EMPTY$2,QUERY_START:QUERY_START,DEFAULT_SELECTOR:DEFAULT_SELECTOR,BEFORE_UNLOAD:BEFORE_UNLOAD,HASH_CHANGE:HASH_CHANGE});var buildAssetId = function buildAssetId(name, level) {
+var HASH_CHANGE = 'hashchange';var lib_constants=/*#__PURE__*/Object.freeze({__proto__:null,ALMOST_ZERO:ALMOST_ZERO,UP:UP$1,DOWN:DOWN$1,LEFT:LEFT,RIGHT:RIGHT,FRONT:FRONT,BACK:BACK,VECTOR_UP:VECTOR_UP,VECTOR_DOWN:VECTOR_DOWN,VECTOR_LEFT:VECTOR_LEFT,VECTOR_RIGHT:VECTOR_RIGHT,VECTOR_FRONT:VECTOR_FRONT,VECTOR_BACK:VECTOR_BACK,ORIGIN:ORIGIN,ZERO_QUATERNION:ZERO_QUATERNION,MATERIALS:MATERIALS,TEXTURES:TEXTURES,EFFECTS:EFFECTS,COLLISION_EVENT:COLLISION_EVENT,COLORS:COLORS,ASSETS_TYPES:ASSETS_TYPES,OUTPUT_ENCODINGS:OUTPUT_ENCODINGS,DEFAULT_OUTPUT_ENCODING:DEFAULT_OUTPUT_ENCODING,ROOT:ROOT,DIVIDER:DIVIDER,HASH:HASH,EMPTY:EMPTY$2,QUERY_START:QUERY_START,DEFAULT_SELECTOR:DEFAULT_SELECTOR,BEFORE_UNLOAD:BEFORE_UNLOAD,HASH_CHANGE:HASH_CHANGE});var buildAssetId = function buildAssetId(name, level) {
   return level ? "".concat(level, "_").concat(name) : name;
 };
 var isLevelName = function isLevelName(level) {
@@ -55461,7 +55461,7 @@ var convertAmmoVector = function convertAmmoVector(_ref2) {
   };
 };var utils=/*#__PURE__*/Object.freeze({__proto__:null,DEFAULT_DESCRIPTION:DEFAULT_DESCRIPTION$1,mapColliderTypeToAddEvent:mapColliderTypeToAddEvent$1,extractBoundingBox:extractBoundingBox,extractBiggestBoundingBox:extractBiggestBoundingBox,extractBoundingSphere:extractBoundingSphere,extractBiggestBoundingSphere:extractBiggestBoundingSphere,parseBoundingBoxSize:parseBoundingBoxSize,extractPositionAndQuaternion:extractPositionAndQuaternion$1,extractBoxDescription:extractBoxDescription,extractSphereDescription:extractSphereDescription,getBoxDescriptionForElement:getBoxDescriptionForElement$1,getSphereDescriptionForElement:getSphereDescriptionForElement,mapColliderTypeToDescription:mapColliderTypeToDescription$1,iterateGeometries:iterateGeometries$1,convertAmmoVector:convertAmmoVector});var getHostURL = function getHostURL() {
   return "".concat(document.location.protocol, "//").concat(document.location.host);
-};var _excluded$8 = ["uuid"];
+};var _excluded$a = ["uuid"];
 var COLLIDER_TYPES = COLLIDER_TYPES$1;
 var getBoxDescriptionForElement = getBoxDescriptionForElement$1,
     extractPositionAndQuaternion = extractPositionAndQuaternion$1,
@@ -55535,7 +55535,7 @@ var Physics = /*#__PURE__*/function (_EventDispatcher) {
 
     _defineProperty$1(_assertThisInitialized(_this), "handleBodyUpdate", function (_ref3) {
       var uuid = _ref3.uuid,
-          data = _objectWithoutProperties(_ref3, _excluded$8);
+          data = _objectWithoutProperties(_ref3, _excluded$a);
 
       var element = Universe$1.getByUUID(uuid);
 
@@ -55917,9 +55917,8 @@ var Physics$1 = new Physics();var ENTITY_TYPES = {
   },
   AUDIO: {
     DEFAULT: 'AUDIO.DEFAULT',
-    AMBIENT: 'AUDIO.AMBIENT',
     DIRECTIONAL: 'AUDIO.DIRECTIONAL',
-    BACKGROUND: 'AUDIO.BACKGROUND'
+    AMBIENT: 'AUDIO.AMBIENT'
   },
   MODEL: 'MODEL',
   SPRITE: 'SPRITE',
@@ -55943,6 +55942,9 @@ var ENTITY_EVENTS = {
   ANIMATION: {
     LOOP: 'LOOP',
     FINISHED: 'FINISHED'
+  },
+  AUDIO: {
+    ENDED: 'ended'
   }
 };
 var DEFAULT_TAG = 'all';var Scene = /*#__PURE__*/function () {
@@ -57411,7 +57413,7 @@ function applyMiddleware() {
 
 var thunk = createThunkMiddleware();
 thunk.withExtraArgument = createThunkMiddleware;var name = "mage-engine";
-var version$1 = "3.20.1";
+var version$1 = "3.21.0";
 var description = "A WebGL Javascript Game Engine, built on top of THREE.js and many other libraries.";
 var main = "dist/mage.js";
 var author$1 = {
@@ -57464,7 +57466,7 @@ var dependencies = {
 	"redux-thunk": "^2.3.0",
 	rxjs: "6.5.3",
 	three: "0.126.0",
-	"three.proton.js": "0.2.3",
+	"three.proton": "npm:three.proton.js@0.2.3",
 	vivifyjs: "*",
 	"whatwg-fetch": "3.0.0",
 	xstate: "^4.8.0"
@@ -58680,7 +58682,7 @@ if (!self.fetch) {
   self.Headers = Headers;
   self.Request = Request;
   self.Response = Response;
-}var _excluded$7 = ["wheels", "accelerationKey", "brakingKey", "rightKey", "leftKey", "debug", "autostart"];
+}var _excluded$9 = ["wheels", "accelerationKey", "brakingKey", "rightKey", "leftKey", "debug", "autostart"];
 
 var BaseCar = /*#__PURE__*/function (_BaseScript) {
   _inherits(BaseCar, _BaseScript);
@@ -58708,7 +58710,7 @@ var BaseCar = /*#__PURE__*/function (_BaseScript) {
           options.debug;
           var _options$autostart = options.autostart,
           autostart = _options$autostart === void 0 ? true : _options$autostart,
-          physicsOptions = _objectWithoutProperties(options, _excluded$7);
+          physicsOptions = _objectWithoutProperties(options, _excluded$9);
 
       this.car = element;
       this.wheels = wheels;
@@ -58765,7 +58767,7 @@ var BaseCar = /*#__PURE__*/function (_BaseScript) {
 
   return BaseCar;
 }(BaseScript);var DEFAULT_DISTANCE$1 = 5.0;
-var DEFAULT_HEIGHT = 3.0;
+var DEFAULT_HEIGHT$1 = 3.0;
 var DEFAULT_HEIGHT_DAMPING = 2.0;
 var DEFAULT_LOOK_AT_HEIGHT = 1;
 var DEFAULT_ROTATION_SNAP_TIME = 0.3;
@@ -58788,7 +58790,7 @@ var SmoothCarFollow = /*#__PURE__*/function (_BaseScript) {
     value: function start(camera, options) {
       var target = options.target,
           _options$height = options.height,
-          height = _options$height === void 0 ? DEFAULT_HEIGHT : _options$height,
+          height = _options$height === void 0 ? DEFAULT_HEIGHT$1 : _options$height,
           _options$heightDampin = options.heightDamping,
           heightDamping = _options$heightDampin === void 0 ? DEFAULT_HEIGHT_DAMPING : _options$heightDampin,
           _options$lookAtHeight = options.lookAtHeight,
@@ -59555,6 +59557,17 @@ var hasMaterial = function hasMaterial(mesh) {
 var hasGeometry = function hasGeometry(mesh) {
   return Boolean(mesh.geometry);
 };
+var applyMaterialChange = function applyMaterialChange(elementBody, changeCallback) {
+  if (hasMaterial(elementBody)) {
+    processMaterial(elementBody.material, changeCallback);
+  } else {
+    elementBody.traverse(function (child) {
+      if (hasMaterial(child)) {
+        processMaterial(child.material, changeCallback);
+      }
+    });
+  }
+};
 var processMaterial = function processMaterial(material, callback) {
   return Array.isArray(material) ? material.map(callback) : callback(material);
 };
@@ -59642,7 +59655,7 @@ var EASING_EVENTS = {
   UPDATE: 'update',
   COMPLETE: 'complete'
 };
-var FUNCTIONS = _objectSpread2$1({}, Between.Easing);
+var FUNCTIONS = _objectSpread2$1({}, between.Easing);
 var tweenTo = function tweenTo(origin, target) {
   var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   return new Promise(function (resolve) {
@@ -59657,7 +59670,7 @@ var tweenTo = function tweenTo(origin, target) {
     } : _options$onUpdate,
         _options$repeat = options.repeat,
         repeat = _options$repeat === void 0 ? undefined : _options$repeat;
-    var tween = new Between(origin, target).time(time).easing(easing).on(EASING_EVENTS.UPDATE, onUpdate);
+    var tween = new between(origin, target).time(time).easing(easing).on(EASING_EVENTS.UPDATE, onUpdate);
     var infinite = loop && !repeat;
 
     var onComplete = function onComplete() {
@@ -59683,16 +59696,16 @@ var tweenTo = function tweenTo(origin, target) {
   function Entity() {
     var _this;
 
-    var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-        _ref$serializable = _ref.serializable,
-        serializable = _ref$serializable === void 0 ? true : _ref$serializable,
-        _ref$tag = _ref.tag,
-        tag = _ref$tag === void 0 ? '' : _ref$tag,
-        _ref$tags = _ref.tags,
-        tags = _ref$tags === void 0 ? [] : _ref$tags;
+    var _options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
     _classCallCheck(this, Entity);
 
+    var _options$serializable = _options.serializable,
+        serializable = _options$serializable === void 0 ? true : _options$serializable,
+        _options$tag = _options.tag,
+        tag = _options$tag === void 0 ? '' : _options$tag,
+        _options$tags = _options.tags,
+        tags = _options$tags === void 0 ? [] : _options$tags;
     _this = _super.call(this);
 
     _defineProperty$1(_assertThisInitialized(_this), "getBodyByName", function (name) {
@@ -59759,11 +59772,11 @@ var tweenTo = function tweenTo(origin, target) {
       return Object.values(ENTITY_TYPES.EFFECT).includes(_this.getEntityType());
     });
 
-    _defineProperty$1(_assertThisInitialized(_this), "setQuaternion", function (_ref2) {
-      var x = _ref2.x,
-          y = _ref2.y,
-          z = _ref2.z,
-          w = _ref2.w;
+    _defineProperty$1(_assertThisInitialized(_this), "setQuaternion", function (_ref) {
+      var x = _ref.x,
+          y = _ref.y,
+          z = _ref.z,
+          w = _ref.w;
 
       _this.body.quaternion.set(x, y, z, w);
     });
@@ -59774,6 +59787,11 @@ var tweenTo = function tweenTo(origin, target) {
       }
     });
 
+    _this.options = _objectSpread2$1(_objectSpread2$1({}, _options), {}, {
+      serializable: serializable,
+      tag: tag,
+      tags: tags
+    });
     _this.scripts = [];
     _this.tags = [];
     _this.children = [];
@@ -59842,8 +59860,8 @@ var tweenTo = function tweenTo(origin, target) {
   }, {
     key: "setBody",
     value: function setBody() {
-      var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-          body = _ref3.body;
+      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          body = _ref2.body;
 
       this.body = body;
     }
@@ -59869,11 +59887,11 @@ var tweenTo = function tweenTo(origin, target) {
 
       var container = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.getBody();
 
-      var _ref4 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
-          _ref4$waitForBody = _ref4.waitForBody,
-          waitForBody = _ref4$waitForBody === void 0 ? 0 : _ref4$waitForBody,
-          _ref4$waitForBodyMaxR = _ref4.waitForBodyMaxRetries,
-          waitForBodyMaxRetries = _ref4$waitForBodyMaxR === void 0 ? 1 : _ref4$waitForBodyMaxR;
+      var _ref3 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
+          _ref3$waitForBody = _ref3.waitForBody,
+          waitForBody = _ref3$waitForBody === void 0 ? 0 : _ref3$waitForBody,
+          _ref3$waitForBodyMaxR = _ref3.waitForBodyMaxRetries,
+          waitForBodyMaxRetries = _ref3$waitForBodyMaxR === void 0 ? 1 : _ref3$waitForBodyMaxR;
 
       if (this.hasBody()) {
         var _add = function _add(toAdd) {
@@ -60030,10 +60048,10 @@ var tweenTo = function tweenTo(origin, target) {
       var _this4 = this;
 
       if (this.hasScripts()) {
-        this.scripts.forEach(function (_ref5) {
-          var script = _ref5.script,
-              enabled = _ref5.enabled,
-              options = _ref5.options;
+        this.scripts.forEach(function (_ref4) {
+          var script = _ref4.script,
+              enabled = _ref4.enabled,
+              options = _ref4.options;
 
           if (enabled) {
             script.start(_this4, options);
@@ -60047,9 +60065,9 @@ var tweenTo = function tweenTo(origin, target) {
     key: "update",
     value: function update(dt) {
       if (this.hasScripts()) {
-        this.scripts.forEach(function (_ref6) {
-          var script = _ref6.script,
-              enabled = _ref6.enabled;
+        this.scripts.forEach(function (_ref5) {
+          var script = _ref5.script,
+              enabled = _ref5.enabled;
 
           if (script && enabled) {
             script.update(dt);
@@ -60061,9 +60079,9 @@ var tweenTo = function tweenTo(origin, target) {
     key: "onPhysicsUpdate",
     value: function onPhysicsUpdate(dt) {
       if (this.hasScripts()) {
-        this.scripts.forEach(function (_ref7) {
-          var script = _ref7.script,
-              enabled = _ref7.enabled;
+        this.scripts.forEach(function (_ref6) {
+          var script = _ref6.script,
+              enabled = _ref6.enabled;
 
           if (script && enabled) {
             script.physicsUpdate(dt);
@@ -60308,13 +60326,13 @@ var tweenTo = function tweenTo(origin, target) {
     }
   }, {
     key: "translate",
-    value: function translate(_ref8) {
-      var _ref8$x = _ref8.x,
-          x = _ref8$x === void 0 ? 0 : _ref8$x,
-          _ref8$y = _ref8.y,
-          y = _ref8$y === void 0 ? 0 : _ref8$y,
-          _ref8$z = _ref8.z,
-          z = _ref8$z === void 0 ? 0 : _ref8$z;
+    value: function translate(_ref7) {
+      var _ref7$x = _ref7.x,
+          x = _ref7$x === void 0 ? 0 : _ref7$x,
+          _ref7$y = _ref7.y,
+          y = _ref7$y === void 0 ? 0 : _ref7$y,
+          _ref7$z = _ref7.z,
+          z = _ref7$z === void 0 ? 0 : _ref7$z;
 
       if (this.hasBody()) {
         this.body.translateX(x);
@@ -60490,10 +60508,10 @@ var tweenTo = function tweenTo(origin, target) {
   }, {
     key: "mapScriptsToJSON",
     value: function mapScriptsToJSON() {
-      this.scripts.reduce(function (acc, _ref9) {
-        var name = _ref9.name,
-            _ref9$options = _ref9.options,
-            options = _ref9$options === void 0 ? {} : _ref9$options;
+      this.scripts.reduce(function (acc, _ref8) {
+        var name = _ref8.name,
+            _ref8$options = _ref8.options,
+            options = _ref8$options === void 0 ? {} : _ref8$options;
         acc.names.push(name);
         acc.options.push(options);
         return acc;
@@ -60652,7 +60670,7 @@ var tweenTo = function tweenTo(origin, target) {
 var MATERIAL_TEXTURE_MAP = (_MATERIAL_TEXTURE_MAP = {}, _defineProperty$1(_MATERIAL_TEXTURE_MAP, MATERIALS.BASIC, [TEXTURES.ALPHA, TEXTURES.AO, TEXTURES.ENV, TEXTURES.LIGHT, TEXTURES.MAP, TEXTURES.SPECULAR]), _defineProperty$1(_MATERIAL_TEXTURE_MAP, MATERIALS.LAMBERT, [TEXTURES.ALPHA, TEXTURES.AO, TEXTURES.ENV, TEXTURES.LIGHT, TEXTURES.MAP, TEXTURES.SPECULAR, TEXTURES.EMISSIVE]), _defineProperty$1(_MATERIAL_TEXTURE_MAP, MATERIALS.PHONG, [TEXTURES.ALPHA, TEXTURES.AO, TEXTURES.ENV, TEXTURES.LIGHT, TEXTURES.MAP, TEXTURES.SPECULAR, TEXTURES.EMISSIVE, TEXTURES.BUMP, TEXTURES.DISPLACEMENT, TEXTURES.NORMAL]), _defineProperty$1(_MATERIAL_TEXTURE_MAP, MATERIALS.DEPTH, [TEXTURES.ALPHA, TEXTURES.MAP, TEXTURES.DISPLACEMENT]), _defineProperty$1(_MATERIAL_TEXTURE_MAP, MATERIALS.STANDARD, [TEXTURES.ALPHA, TEXTURES.AO, TEXTURES.ENV, TEXTURES.LIGHT, TEXTURES.MAP, TEXTURES.EMISSIVE, TEXTURES.BUMP, TEXTURES.DISPLACEMENT, TEXTURES.NORMAL, TEXTURES.METALNESS, TEXTURES.ROUGHNESS]), _defineProperty$1(_MATERIAL_TEXTURE_MAP, MATERIALS.THREE_TOON, [TEXTURES.ALPHA, TEXTURES.AO, TEXTURES.BUMP, TEXTURES.DISPLACEMENT, TEXTURES.EMISSIVE, TEXTURES.GRADIENT, TEXTURES.LIGHT, TEXTURES.MAP, TEXTURES.NORMAL]), _MATERIAL_TEXTURE_MAP);
 var isTextureMapAllowedForMaterial = function isTextureMapAllowedForMaterial(materialType, textureType) {
   return MATERIAL_TEXTURE_MAP[materialType] && MATERIAL_TEXTURE_MAP[materialType].includes(textureType);
-};var _excluded$6 = ["position", "quaternion"],
+};var _excluded$8 = ["position", "quaternion"],
     _excluded2 = ["applyPhysicsUpdate"],
     _excluded3 = ["dt", "event"];
 var COLLIDER_TAG = 'collider';
@@ -60842,7 +60860,7 @@ var Element$1 = /*#__PURE__*/function (_Entity) {
     _defineProperty$1(_assertThisInitialized(_this), "handlePhysicsUpdate", function (_ref6) {
       var position = _ref6.position,
           quaternion = _ref6.quaternion,
-          data = _objectWithoutProperties(_ref6, _excluded$6);
+          data = _objectWithoutProperties(_ref6, _excluded$8);
 
       _this.setPosition(position);
 
@@ -61187,18 +61205,12 @@ var Element$1 = /*#__PURE__*/function (_Entity) {
   }, {
     key: "setColor",
     value: function setColor(color) {
-      var _this2 = this;
+      var _setColor = function _setColor(material) {
+        return material.color = new Color$1(color);
+      };
 
       if (color) {
-        if (hasMaterial(this.getBody())) {
-          this.body.material.color = new Color$1(color);
-        } else {
-          this.body.traverse(function (child) {
-            if (hasMaterial(child) && !_this2.isParentOf(child)) {
-              child.material.color = new Color$1(color);
-            }
-          });
-        }
+        applyMaterialChange(this.getBody(), _setColor);
       } else {
         console.warn(ELEMENT_SET_COLOR_MISSING_COLOR);
       }
@@ -61244,23 +61256,15 @@ var Element$1 = /*#__PURE__*/function (_Entity) {
             wrap = _options$wrap === void 0 ? RepeatWrapping$1 : _options$wrap;
         this.recordTexture(textureId, textureType);
 
-        var applyTextureTo = function applyTextureTo(element) {
+        var applyTextureTo = function applyTextureTo(material) {
           var texture = Images$1.get(textureId);
           texture.wrapS = wrap;
           texture.wrapT = wrap;
           texture.repeat.set(repeat.x, repeat.y);
-          element.material[textureType] = texture;
+          material[textureType] = texture;
         };
 
-        if (hasMaterial(this.getBody())) {
-          applyTextureTo(this.getBody());
-        } else {
-          this.getBody().traverse(function (child) {
-            if (hasMaterial(child)) {
-              applyTextureTo(child);
-            }
-          });
-        }
+        applyMaterialChange(this.getBody(), applyTextureTo);
       }
     }
   }, {
@@ -61310,64 +61314,58 @@ var Element$1 = /*#__PURE__*/function (_Entity) {
   }, {
     key: "setOpacity",
     value: function setOpacity() {
-      var _this3 = this;
+      var _this2 = this;
 
       var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1.0;
       var opacity = clamp(value, 0, 1);
       this.opacity = opacity;
 
-      if (hasMaterial(this.getBody())) {
-        this.body.material.transparent = true;
-        this.body.material.opacity = opacity;
-      } else {
-        this.body.traverse(function (child) {
-          if (hasMaterial(child) && !_this3.isParentOf(child)) {
-            child.material.transparent = true;
-            child.material.opacity = opacity;
-          }
-        });
-      }
+      var _setOpacity = function _setOpacity(material) {
+        material.transparent = true;
+        material.opacity = _this2.opacity;
+      };
+
+      applyMaterialChange(this.getBody(), _setOpacity);
     }
   }, {
     key: "fadeTo",
-    value: function fadeTo(opacity, time) {
-      var _this4 = this;
+    value: function fadeTo() {
+      var _this3 = this;
 
-      return new Promise(function (resolve) {
-        return new Between(_this4.opacity, opacity).time(time).on('update', function (value) {
-          return !_this4.isDisposed() && _this4.setOpacity(value);
-        }).on('complete', resolve);
-      });
+      var opacity = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+      var time = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 250;
+      var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+
+      var onUpdate = function onUpdate(value) {
+        return !_this3.isDisposed() && _this3.setOpacity(value);
+      };
+
+      return tweenTo(this.opacity, clamp(opacity, 0, 1), _objectSpread2$1(_objectSpread2$1({}, options), {}, {
+        time: time,
+        onUpdate: onUpdate
+      }));
     }
   }, {
     key: "setWireframe",
     value: function setWireframe() {
       var flag = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
 
-      if (hasMaterial(this.getBody())) {
-        this.body.material.wireframe = flag;
-      } else {
-        this.body.traverse(function (child) {
-          if (hasMaterial(child)) {
-            child.material.wireframe = flag;
-          }
-        });
-      }
+      var _setWireframe = function _setWireframe(material) {
+        return material.wireframe = flag;
+      };
+
+      applyMaterialChange(this.getBody(), _setWireframe);
     }
   }, {
     key: "setWireframeLineWidth",
     value: function setWireframeLineWidth() {
       var width = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
 
-      if (hasMaterial(this.getBody())) {
-        this.body.material.wireframeLinewidth = width;
-      } else {
-        this.body.traverse(function (child) {
-          if (hasMaterial(child)) {
-            child.material.wireframeLinewidth = width;
-          }
-        });
-      }
+      var _setWireframeLineWidth = function _setWireframeLineWidth(material) {
+        material.wireframeLinewidth = width;
+      };
+
+      applyMaterialChange(this.getBody(), _setWireframeLineWidth);
     }
   }, {
     key: "disposeBody",
@@ -61954,7 +61952,7 @@ var Plane = /*#__PURE__*/function (_Element) {
   }
 
   return Box;
-}(Element$1);var _excluded$5 = ["anisotropy"];
+}(Element$1);var _excluded$7 = ["anisotropy"];
 
 var validateAnisotropy = function validateAnisotropy(anisotropy) {
   var max = Scene$1.getRenderer().capabilities.getMaxAnisotropy();
@@ -61980,7 +61978,7 @@ var Sprite = /*#__PURE__*/function (_Element) {
 
     var _options$anisotropy = options.anisotropy,
         anisotropy = _options$anisotropy === void 0 ? 1 : _options$anisotropy,
-        rest = _objectWithoutProperties(options, _excluded$5);
+        rest = _objectWithoutProperties(options, _excluded$7);
 
     var texture = Images$1.get(spriteTexture);
     texture.anisotropy = validateAnisotropy(anisotropy);
@@ -68244,9 +68242,9 @@ var connect = createConnect();var BaseUI = function BaseUI() {
   return null;
 };var TIME_FOR_UPDATE = 5;
 var VOLUME = 2;
-var AUDIO_EVENTS = {
-  ENDED: 'ended'
-};
+var DEFAULT_AUDIO_NODE_VOLUME = 5;
+var DEFAULT_AUDIO_NODE_RAMP_TIME = 100; // value in ms
+
 var AUDIO_RAMPS = {
   LINEAR: 'LINEAR',
   EXPONENTIAL: 'EXPONENTIAL'
@@ -68322,6 +68320,11 @@ var Audio = /*#__PURE__*/function () {
     value: function hasContext() {
       return !!this.context;
     }
+  }, {
+    key: "hasSounds",
+    value: function hasSounds() {
+      return this.sounds.length > 0;
+    }
   }, {
     key: "createAudioContext",
     value: function createAudioContext() {
@@ -68349,6 +68352,8 @@ var Audio = /*#__PURE__*/function () {
       if (this.context) {
         return this.context.destination;
       }
+
+      console.log(AUDIO_CONTEXT_NOT_AVAILABLE);
     }
   }, {
     key: "getVolume",
@@ -68356,6 +68361,8 @@ var Audio = /*#__PURE__*/function () {
       if (this.masterVolumeNode) {
         return this.masterVolumeNode.gain.value;
       }
+
+      console.log(AUDIO_CONTEXT_NOT_AVAILABLE);
     }
   }, {
     key: "getMasterVolumeNode",
@@ -68380,33 +68387,33 @@ var Audio = /*#__PURE__*/function () {
   }, {
     key: "updateListenerPosition",
     value: function updateListenerPosition() {
-      //now handling listener
       Scene$1.getCameraBody().updateMatrixWorld();
       var p = new Vector3$1();
-      p.setFromMatrixPosition(Scene$1.getCameraBody().matrixWorld); //setting audio engine context listener position on camera position
-
-      this.context.listener.setPosition(p.x, p.y, p.z);
+      p.setFromMatrixPosition(Scene$1.getCameraBody().matrixWorld);
+      this.context.listener.positionX.setValueAtTime(p.x, this.context.currentTime);
+      this.context.listener.positionY.setValueAtTime(p.y, this.context.currentTime);
+      this.context.listener.positionZ.setValueAtTime(p.z, this.context.currentTime);
     }
   }, {
     key: "updatelistenerOrientation",
     value: function updatelistenerOrientation() {
-      //this is to add up and down vector to our camera
-      // The camera's world matrix is named "matrix".
       var m = Scene$1.getCameraBody().matrix;
       var mx = m.elements[12],
           my = m.elements[13],
           mz = m.elements[14];
-      m.elements[12] = m.elements[13] = m.elements[14] = 0; // Multiply the orientation vector by the world matrix of the camera.
-
+      m.elements[12] = m.elements[13] = m.elements[14] = 0;
       var vec = new Vector3$1(0, 0, 1);
       vec.applyMatrix4(m);
-      vec.normalize(); // Multiply the up vector by the world matrix.
-
+      vec.normalize();
       var up = new Vector3$1(0, -1, 0);
       up.applyMatrix4(m);
-      up.normalize(); // Set the orientation and the up-vector for the listener.
-
-      this.context.listener.setOrientation(vec.x, vec.y, vec.z, up.x, up.y, up.z);
+      up.normalize();
+      this.context.listener.forwardX.setValueAtTime(vec.x, this.context.currentTime);
+      this.context.listener.forwardY.setValueAtTime(vec.y, this.context.currentTime);
+      this.context.listener.forwardZ.setValueAtTime(vec.z, this.context.currentTime);
+      this.context.listener.upX.setValueAtTime(up.x, this.context.currentTime);
+      this.context.listener.upY.setValueAtTime(up.y, this.context.currentTime);
+      this.context.listener.upZ.setValueAtTime(up.z, this.context.currentTime);
       m.elements[12] = mx;
       m.elements[13] = my;
       m.elements[14] = mz;
@@ -68425,13 +68432,17 @@ var Audio = /*#__PURE__*/function () {
     key: "update",
     value: function update(dt) {
       if (!this.hasContext()) return;
+
+      if (this.hasSounds()) {
+        this.updateListenerPosition();
+        this.updatelistenerOrientation();
+      }
+
       var start = new Date();
 
       for (var index in this.sounds) {
         var sound = this.sounds[index];
         sound.update(dt);
-        this.updateListenerPosition();
-        this.updatelistenerOrientation();
         if (+new Date() - start > TIME_FOR_UPDATE) break;
       }
     }
@@ -82285,6 +82296,8 @@ var Stats = /*#__PURE__*/function () {
     this._fps = 0;
     this._fpsMax = 100;
     this.fps = new Subject();
+    this.memory = new Subject();
+    this.memoryMax = new Subject();
   }
 
   _createClass(Stats, [{
@@ -82322,8 +82335,8 @@ var Stats = /*#__PURE__*/function () {
     key: "getMemoryUsage",
     value: function getMemoryUsage() {
       if (Features$1.isFeatureSupported(FEATURES.MEMORY)) {
-        this.memory = performance.memory.usedJSHeapSize / ONE_MB;
-        this.memoryMax = performance.memory.jsHeapSizeLimit / ONE_MB;
+        this.memory.next(performance.memory.usedJSHeapSize / ONE_MB);
+        this.memoryMax.next(performance.memory.jsHeapSizeLimit / ONE_MB);
       }
     }
   }, {
@@ -82349,7 +82362,7 @@ var Stats$1 = new Stats();var Loader = /*#__PURE__*/function () {
   }]);
 
   return Loader;
-}();var _excluded$4 = ["mesh", "scripts", "texture"];
+}();var _excluded$6 = ["mesh", "scripts", "texture"];
 var MeshLoader = /*#__PURE__*/function (_Loader) {
   _inherits(MeshLoader, _Loader);
 
@@ -82375,7 +82388,7 @@ var MeshLoader = /*#__PURE__*/function (_Loader) {
           var mesh = _ref.mesh,
               scripts = _ref.scripts,
               texture = _ref.texture,
-              opts = _objectWithoutProperties(_ref, _excluded$4);
+              opts = _objectWithoutProperties(_ref, _excluded$6);
 
           return _this.loadMesh(_this.parseMesh(mesh), scripts, texture, opts);
         });
@@ -82560,12 +82573,16 @@ var Light = /*#__PURE__*/function (_Entity) {
       var _this2 = this;
 
       var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getIntensity();
-      var time = arguments.length > 1 ? arguments[1] : undefined;
+      var time = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 250;
       var intensity = this.getIntensity();
-      return new Promise(function (resolve) {
-        return new Between(intensity, value).time(time).on('update', function (value) {
-          return !_this2.isDisposed() && _this2.setIntensity(value);
-        }).on('complete', resolve);
+
+      var onUpdate = function onUpdate(value) {
+        return !_this2.isDisposed() && _this2.setIntensity(value);
+      };
+
+      return tweenTo(intensity, value, {
+        time: time,
+        onUpdate: onUpdate
       });
     }
   }, {
@@ -82904,9 +82921,11 @@ var PointLight = /*#__PURE__*/function (_Light) {
 
   var _super = _createSuper(PointLight);
 
-  function PointLight(options) {
+  function PointLight() {
     var _this;
 
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
     _classCallCheck(this, PointLight);
 
     var _options$color = options.color,
@@ -85690,7 +85709,7 @@ var Proton = three_proton_min.exports;var ParticleEmitterGroup = /*#__PURE__*/fu
   }]);
 
   return ParticleEmitterGroup;
-}(Entity);var _excluded$3 = ["initializers", "behaviours", "texture", "color", "rate"];
+}(Entity);var _excluded$5 = ["initializers", "behaviours", "texture", "color", "rate"];
 var DEFAULT_PARTICLE_COLOR = PALETTES.BASE.BLACK;
 var SYSTEM_DISPOSE_TIMEOUT = 700;
 
@@ -85715,7 +85734,7 @@ var ProtonParticleEmitter = /*#__PURE__*/function (_ParticleEmitter) {
         _options$color = options.color,
         color = _options$color === void 0 ? DEFAULT_PARTICLE_COLOR : _options$color,
         rate = options.rate,
-        rest = _objectWithoutProperties(options, _excluded$3);
+        rest = _objectWithoutProperties(options, _excluded$5);
 
     var parsedOptions = _objectSpread2$1({
       initializers: initializers,
@@ -85924,7 +85943,7 @@ var Explosion = /*#__PURE__*/function (_ParticleEmitterGroup) {
   }
 
   return Explosion;
-}(ParticleEmitterGroup);var _excluded$2 = ["texture", "direction", "size", "strength", "colors"];
+}(ParticleEmitterGroup);var _excluded$4 = ["texture", "direction", "size", "strength", "colors"];
 
 var getFireRate = function getFireRate() {
   return new Proton.Rate(new Proton.Span(10, 15), new Proton.Span(.05, .1));
@@ -85956,7 +85975,7 @@ var Fire = /*#__PURE__*/function (_ProtonParticleEmitte) {
         _options$strength = options.strength,
         strength = _options$strength === void 0 ? 100 : _options$strength,
         colors = options.colors,
-        rest = _objectWithoutProperties(options, _excluded$2);
+        rest = _objectWithoutProperties(options, _excluded$4);
 
     var fireOptions = _objectSpread2$1({
       rate: getFireRate(),
@@ -90130,7 +90149,7 @@ var unmount = function unmount() {
   render(null, container); // removing the container as well
 
   removeElement(id);
-};var _excluded$1 = ["Component", "format", "width", "height"];
+};var _excluded$3 = ["Component", "format", "width", "height"];
 
 var Label = /*#__PURE__*/function (_Element) {
   _inherits(Label, _Element);
@@ -90145,7 +90164,7 @@ var Label = /*#__PURE__*/function (_Element) {
         format = _ref$format === void 0 ? 'png' : _ref$format,
         _width = _ref.width,
         _height = _ref.height,
-        options = _objectWithoutProperties(_ref, _excluded$1);
+        options = _objectWithoutProperties(_ref, _excluded$3);
 
     _classCallCheck(this, Label);
 
@@ -90248,34 +90267,200 @@ var Label = /*#__PURE__*/function (_Element) {
   }]);
 
   return Label;
-}(Element$1);var Beat = /*#__PURE__*/function () {
-  function Beat(name) {
-    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+}(Element$1);var Color = /*#__PURE__*/function () {
+  _createClass(Color, null, [{
+    key: "randomColor",
+    value: function randomColor() {
+      var asNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+      var letters = '0123456789ABCDEF'.split('');
+      var color = '';
 
-    _classCallCheck(this, Beat);
+      for (var i = 0; i < 6; i++) {
+        color += letters[Math.floor(Math.random() * 16)];
+      }
 
-    this.name = name;
-    this.buffer = null;
-    this.connected = false;
-    this.playing = false;
-    this.options = options;
-    this.init();
-    this.connect();
+      return asNumber ? Number("0x".concat(color)) : "#".concat(color);
+    }
+  }, {
+    key: "componentToHex",
+    value: function componentToHex(c) {
+      var hex = c.toString(16);
+      return hex.length == 1 ? "0" + hex : hex;
+    }
+  }, {
+    key: "gbToHex",
+    value: function gbToHex(r, g, b) {
+      return "0x" + Color.componentToHex(r) + Color.componentToHex(g) + Color.componentToHex(b);
+    }
+  }, {
+    key: "getIntValueFromHex",
+    value: function getIntValueFromHex(hex) {
+      return parseInt(hex, 16);
+    }
+  }]);
+
+  function Color(color) {
+    _classCallCheck(this, Color);
+
+    this.color = new Color$1(color);
   }
 
-  _createClass(Beat, [{
-    key: "init",
-    value: function init() {
-      this.source = Audio$1.context.createBufferSource();
+  _createClass(Color, [{
+    key: "getColor",
+    value: function getColor() {
+      return this.color;
+    }
+  }]);
+
+  return Color;
+}();var DEFAULT_RADIUS = 5;
+var DEFAULT_HEIGHT = 5;
+var DEFAULT_RADIAL_SEGMENTS = 8;
+var DEFAULT_HEIGHT_SEGMENTS = 1;
+var DEFAULT_OPENENDED = false;
+
+var Cone = /*#__PURE__*/function (_Element) {
+  _inherits(Cone, _Element);
+
+  var _super = _createSuper(Cone);
+
+  function Cone() {
+    var _this;
+
+    var radius = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : DEFAULT_RADIUS;
+    var height = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_HEIGHT;
+    var color = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : Color.randomColor(true);
+    var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+
+    _classCallCheck(this, Cone);
+
+    _this = _super.call(this, options);
+    var _options$radialSegmen = options.radialSegments,
+        radialSegments = _options$radialSegmen === void 0 ? DEFAULT_RADIAL_SEGMENTS : _options$radialSegmen,
+        _options$heightSegmen = options.heightSegments,
+        heightSegments = _options$heightSegmen === void 0 ? DEFAULT_HEIGHT_SEGMENTS : _options$heightSegmen,
+        _options$openEnded = options.openEnded,
+        openEnded = _options$openEnded === void 0 ? DEFAULT_OPENENDED : _options$openEnded;
+    var geometry = new ConeGeometry(radius, height, radialSegments, heightSegments, openEnded);
+    var material = new MeshBasicMaterial(_objectSpread2$1({
+      color: color,
+      wireframe: false
+    }, options));
+
+    _this.setBody({
+      geometry: geometry,
+      material: material
+    });
+
+    _this.setEntityType(ENTITY_TYPES.MESH);
+
+    return _this;
+  }
+
+  return Cone;
+}(Element$1);var Sound = /*#__PURE__*/function (_Entity) {
+  _inherits(Sound, _Entity);
+
+  var _super = _createSuper(Sound);
+
+  function Sound() {
+    var _this;
+
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, Sound);
+
+    var source = options.source,
+        _options$loop = options.loop,
+        loop = _options$loop === void 0 ? false : _options$loop,
+        loopStart = options.loopStart,
+        loopEnd = options.loopEnd,
+        autoplay = options.autoplay,
+        reconnectOnReset = options.reconnectOnReset,
+        _options$name = options.name,
+        name = _options$name === void 0 ? generateRandomName('sound') : _options$name;
+    _this = _super.call(this, _objectSpread2$1(_objectSpread2$1({}, options), {}, {
+      source: source,
+      loop: loop,
+      loopStart: loopStart,
+      loopEnd: loopEnd,
+      autoplay: autoplay,
+      reconnectOnReset: reconnectOnReset,
+      name: name
+    }));
+
+    _defineProperty$1(_assertThisInitialized(_this), "reset", function () {
+      _this.playing = false;
+
+      _this.disconnect();
+
+      _this.setupAudio();
+
+      _this.connect();
+    });
+
+    _this.source = source;
+    _this.loop = loop;
+    _this.loopStart = loopStart;
+    _this.loopEnd = loopEnd;
+    _this.autoplay = autoplay;
+    _this.reconnectOnReset = reconnectOnReset;
+    _this.name = name;
+    _this.connected = false;
+    _this.playing = false;
+    _this.hasPlayed = false;
+    _this.buffer = null;
+    _this.audioNode = null;
+    _this.volumeNode = null;
+
+    _this.setupAudio();
+
+    _this.setName(name);
+
+    _this.setBody({
+      body: new Object3D()
+    });
+
+    _this.setEntityType(ENTITY_TYPES.AUDIO.DEFAULT);
+
+    Audio$1.add(_assertThisInitialized(_this));
+    return _this;
+  }
+
+  _createClass(Sound, [{
+    key: "setupAudio",
+    value: function setupAudio() {
+      this.createAudioNode();
       this.createVolumeNode();
       this.setBuffer();
-      this.source.addEventListener(AUDIO_EVENTS.ENDED, this.onSoundEnded.bind(this));
+      this.setupAudioNodeLoop();
+      this.audioNode.removeEventListener(ENTITY_EVENTS.AUDIO.ENDED, this.onSoundEnded.bind(this));
+      this.audioNode.addEventListener(ENTITY_EVENTS.AUDIO.ENDED, this.onSoundEnded.bind(this));
+    }
+  }, {
+    key: "createAudioNode",
+    value: function createAudioNode() {
+      this.audioNode = Audio$1.context.createBufferSource();
+    }
+  }, {
+    key: "setupAudioNodeLoop",
+    value: function setupAudioNodeLoop() {
+      this.audioNode.loop = this.loop;
+      this.audioNode.loopEnd = this.loopEnd === undefined ? this.duration : this.loopEnd;
+      this.audioNode.loopStart = this.loopStart === undefined ? this.duration : this.loopStart;
     }
   }, {
     key: "createVolumeNode",
     value: function createVolumeNode() {
       this.volumeNode = Audio$1.context.createGain();
-      this.volumeNode.gain.value = 20;
+      this.volumeNode.gain.value = DEFAULT_AUDIO_NODE_VOLUME;
+    }
+  }, {
+    key: "tryAutoplay",
+    value: function tryAutoplay() {
+      if (this.autoplay && !this.hasPlayed) {
+        this.play();
+      }
     }
   }, {
     key: "connect",
@@ -90285,33 +90470,24 @@ var Label = /*#__PURE__*/function (_Element) {
       }
 
       this.volumeNode.connect(Audio$1.getMasterVolumeNode());
-      this.source.connect(this.volumeNode);
+      this.audioNode.connect(this.volumeNode);
       this.connected = true;
+      this.tryAutoplay();
     }
   }, {
     key: "disconnect",
     value: function disconnect() {
       if (this.connected) {
         this.volumeNode.disconnect();
-        this.source.disconnect();
+        this.audioNode.disconnect();
         this.connected = false;
       }
     }
-  }, {
-    key: "reset",
-    value: function reset() {
-      this.playing = false;
-      var reconnectOnReset = this.options.reconnectOnReset;
-      this.disconnect();
-
-      if (reconnectOnReset) {
-        this.init();
-        this.connect();
-      }
-    }
   }, {
     key: "dispose",
     value: function dispose() {
+      _get(_getPrototypeOf(Sound.prototype), "dispose", this).call(this);
+
       this.stop();
       this.disconnect();
     }
@@ -90322,7 +90498,8 @@ var Label = /*#__PURE__*/function (_Element) {
     }
   }, {
     key: "setVolume",
-    value: function setVolume(value) {
+    value: function setVolume() {
+      var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : DEFAULT_AUDIO_NODE_VOLUME;
       this.volumeNode.gain.setValueAtTime(value, Audio$1.context.currentTime);
     }
   }, {
@@ -90333,7 +90510,7 @@ var Label = /*#__PURE__*/function (_Element) {
   }, {
     key: "setBuffer",
     value: function setBuffer() {
-      var buffer = Audio$1.get(this.name);
+      var buffer = Audio$1.get(this.source);
 
       if (!buffer) {
         console.error(AUDIO_UNABLE_TO_LOAD_SOUND);
@@ -90341,107 +90518,60 @@ var Label = /*#__PURE__*/function (_Element) {
       }
 
       this.buffer = buffer;
-      this.source.buffer = buffer;
+      this.audioNode.buffer = buffer;
     }
   }, {
     key: "play",
     value: function play() {
       var volume = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.getVolume();
-      var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0.1;
+      var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_AUDIO_NODE_RAMP_TIME;
       var ramp = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : AUDIO_RAMPS.LINEAR;
-      if (this.playing) return;
+      if (this.playing) return Promise.resolve();
       this.setVolume(0);
-      this.source.start();
+      this.audioNode.start();
+      this.hasPlayed = true;
       this.playing = true;
+      var audioDelay = delay / 1000; // linearRampToValueAtTime/exponentialRampToValueAtTime requires time to be expressed in seconds
 
       if (ramp === AUDIO_RAMPS.LINEAR) {
-        this.volumeNode.gain.linearRampToValueAtTime(volume, Audio$1.context.currentTime + delay);
+        this.volumeNode.gain.linearRampToValueAtTime(volume, Audio$1.context.currentTime + audioDelay);
       } else {
-        this.volumeNode.gain.exponentialRampToValueAtTime(volume, Audio$1.context.currentTime + delay);
+        this.volumeNode.gain.exponentialRampToValueAtTime(volume, Audio$1.context.currentTime + audioDelay);
       }
+
+      return this;
     }
   }, {
     key: "onSoundEnded",
     value: function onSoundEnded() {
       this.reset();
+      this.dispatchEvent({
+        type: ENTITY_EVENTS.AUDIO.ENDED
+      });
     }
   }, {
     key: "stop",
     value: function stop() {
-      var _this = this;
-
-      var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0.1;
+      var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : DEFAULT_AUDIO_NODE_RAMP_TIME;
       var ramp = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : AUDIO_RAMPS.LINEAR;
+      var audioDelay = delay / 1000; // linearRampToValueAtTime/exponentialRampToValueAtTime requires time to be expressed in seconds
 
       if (ramp === AUDIO_RAMPS.LINEAR) {
-        this.volumeNode.gain.linearRampToValueAtTime(0, Audio$1.context.currentTime + delay);
+        this.volumeNode.gain.linearRampToValueAtTime(ALMOST_ZERO, Audio$1.context.currentTime + audioDelay);
       } else {
-        this.volumeNode.gain.exponentialRampToValueAtTime(0, Audio$1.context.currentTime + delay);
+        this.volumeNode.gain.exponentialRampToValueAtTime(ALMOST_ZERO, Audio$1.context.currentTime + audioDelay);
       }
 
-      setTimeout(function () {
-        _this.source.stop();
-      }, delay);
+      setTimeout(this.reset, delay);
+      return this;
     }
   }, {
     key: "detune",
     value: function detune(value) {
-      if (this.source) {
-        this.source.detune.value = value;
+      if (this.audioNode) {
+        this.audioNode.detune.value = value;
       }
     }
-  }]);
-
-  return Beat;
-}();var Sound$1 = /*#__PURE__*/function (_Beat) {
-  _inherits(Sound, _Beat);
-
-  var _super = _createSuper(Sound);
-
-  function Sound(name) {
-    var _this;
-
-    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-    _classCallCheck(this, Sound);
-
-    var _options$loop = options.loop,
-        loop = _options$loop === void 0 ? false : _options$loop,
-        _options$autoplay = options.autoplay,
-        autoplay = _options$autoplay === void 0 ? false : _options$autoplay,
-        _options$reconnectOnR = options.reconnectOnReset,
-        reconnectOnReset = _options$reconnectOnR === void 0 ? false : _options$reconnectOnR;
-    _this = _super.call(this, name, {
-      loop: loop,
-      autoplay: autoplay,
-      reconnectOnReset: reconnectOnReset
-    });
-    _this.source.loop = loop;
-    _this.target = null;
-    _this.pannerNode = null;
-    _this.convolverNode = null;
-
-    if (autoplay) {
-      _this.play();
-    }
-
-    Audio$1.add(_assertThisInitialized(_this));
-    return _this;
-  }
-
-  _createClass(Sound, [{
-    key: "createPannerNode",
-    value: function createPannerNode() {
-      this.pannerNode = Audio$1.context.createPanner();
-      this.volumeNode.disconnect();
-      this.volumeNode.connect(this.pannerNode);
-      this.pannerNode.connect(Audio$1.getMasterVolumeNode());
-    }
-  }, {
-    key: "hasEffect",
-    value: function hasEffect() {
-      return !!this.convolverNode;
-    }
   }, {
     key: "addEffect",
     value: function addEffect(effect) {
@@ -90471,325 +90601,180 @@ var Label = /*#__PURE__*/function (_Element) {
       }
     }
   }, {
-    key: "hasPannerNode",
-    value: function hasPannerNode() {
-      return !!this.pannerNode;
-    }
-  }, {
-    key: "hasTarget",
-    value: function hasTarget() {
-      return !!this.target;
-    }
-  }, {
-    key: "getTarget",
-    value: function getTarget() {
-      return this.target;
+    key: "sampleRate",
+    get: function get() {
+      return this.buffer.sampleRate;
     }
   }, {
-    key: "setTarget",
-    value: function setTarget(target) {
-      this.target = target;
-      this.createPannerNode();
+    key: "duration",
+    get: function get() {
+      return this.buffer.duration * 1000;
     }
   }, {
-    key: "update",
-    value: function update(dt) {
-      if (this.hasTarget() && this.hasPannerNode()) {
-        var p = new Vector3$1();
-        p.setFromMatrixPosition(this.target.getBody().matrixWorld);
-        var px = p.x,
-            py = p.y,
-            pz = p.z;
-        this.target.getBody().updateMatrixWorld();
-        var q = new Vector3$1();
-        q.setFromMatrixPosition(this.target.getBody().matrixWorld);
-        var dx = q.x - px,
-            dy = q.y - py,
-            dz = q.z - pz; //setting panner position and velocity using doppler effect.
-
-        try {
-          this.panner.setPosition(q.x, q.y, q.z);
-          this.panner.setVelocity(dx / dt, dy / dt, dz / dt);
-        } catch (e) {// quick and dirty solution.
-        }
-      }
+    key: "numberOfChannels",
+    get: function get() {
+      return this.buffer.numberOfChannels;
     }
   }]);
 
   return Sound;
-}(Beat);var BackgroundSound = /*#__PURE__*/function (_Sound) {
-  _inherits(BackgroundSound, _Sound);
-
-  var _super = _createSuper(BackgroundSound);
+}(Entity);var _excluded$2 = ["name"];
 
-  function BackgroundSound() {
-    _classCallCheck(this, BackgroundSound);
+var AmbientSound = /*#__PURE__*/function (_Sound) {
+  _inherits(AmbientSound, _Sound);
 
-    return _super.apply(this, arguments);
-  }
+  var _super = _createSuper(AmbientSound);
 
-  _createClass(BackgroundSound, [{
-    key: "update",
-    value: function update(dt) {}
-  }, {
-    key: "createPannerNode",
-    value: function createPannerNode() {
-      console.log(METHOD_NOT_SUPPORTED);
-    }
-  }, {
-    key: "hasPannerNode",
-    value: function hasPannerNode() {
-      console.log(METHOD_NOT_SUPPORTED);
-    }
-  }, {
-    key: "hasTarget",
-    value: function hasTarget() {
-      console.log(METHOD_NOT_SUPPORTED);
-    }
-  }, {
-    key: "getTarget",
-    value: function getTarget() {
-      console.log(METHOD_NOT_SUPPORTED);
-    }
-  }, {
-    key: "setTarget",
-    value: function setTarget() {
-      console.log(METHOD_NOT_SUPPORTED);
-    }
-  }]);
-
-  return BackgroundSound;
-}(Sound$1);var DirectionalSound = /*#__PURE__*/function (_Sound) {
-  _inherits(DirectionalSound, _Sound);
-
-  var _super = _createSuper(DirectionalSound);
-
-  function DirectionalSound(name, angles, options) {
+  function AmbientSound(source) {
     var _this;
 
-    _classCallCheck(this, DirectionalSound);
+    var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+        _ref$name = _ref.name,
+        name = _ref$name === void 0 ? generateRandomName('AmbientSound') : _ref$name,
+        options = _objectWithoutProperties(_ref, _excluded$2);
+
+    _classCallCheck(this, AmbientSound);
 
-    _this = _super.call(this, name);
-    var target = options.target;
+    _this = _super.call(this, _objectSpread2$1({
+      source: source,
+      name: name
+    }, options));
 
-    if (target) {
-      _this.setTarget(target);
+    _this.setEntityType(ENTITY_TYPES.AUDIO.AMBIENT);
 
-      _this.setPannerAngles(angles);
-    }
+    _this.connect();
 
     return _this;
   }
 
-  _createClass(DirectionalSound, [{
-    key: "setPannerAngles",
-    value: function setPannerAngles(angles) {
-      this.pannerNode.coneInnerAngle = angles.innerAngleInDegrees;
-      this.pannerNode.coneOuterAngle = angles.outerAngleInDegrees;
-      this.pannerNode.coneOuterGain = angles.outerGainFactor;
-    }
-  }, {
-    key: "setPannerOrientation",
-    value: function setPannerOrientation() {
-      if (this.hasPannerNode()) {
-        var vec = new Vector3$1(0, 0, 1);
-        var m = this.target.getBody().matrixWorld; // Save the translation column and zero it.
+  return AmbientSound;
+}(Sound);var _excluded$1 = ["name"];
 
-        var mx = m.elements[12],
-            my = m.elements[13],
-            mz = m.elements[14];
-        m.elements[12] = m.elements[13] = m.elements[14] = 0; // Multiply the 0,0,1 vector by the world matrix and normalize the result.
-
-        vec.applyProjection(m);
-        vec.normalize();
-        this.pannerNode.setOrientation(vec.x, vec.y, vec.z); // Restore the translation column.
-
-        m.elements[12] = mx;
-        m.elements[13] = my;
-        m.elements[14] = mz;
-      }
-    }
-  }, {
-    key: "update",
-    value: function update(dt) {
-      _get(_getPrototypeOf(DirectionalSound.prototype), "update", this).call(this, dt);
+var DirectionalSound = /*#__PURE__*/function (_Sound) {
+  _inherits(DirectionalSound, _Sound);
 
-      this.setPannerOrientation();
-    }
-  }]);
+  var _super = _createSuper(DirectionalSound);
 
-  return DirectionalSound;
-}(Sound$1);var Sound = /*#__PURE__*/function (_Beat) {
-  _inherits(Sound, _Beat);
+  function DirectionalSound(source) {
+    var _this;
 
-  var _super = _createSuper(Sound);
+    var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+        _ref$name = _ref.name,
+        name = _ref$name === void 0 ? generateRandomName('DirectionalSound') : _ref$name,
+        options = _objectWithoutProperties(_ref, _excluded$1);
 
-  function Sound(name) {
-    var _this;
+    _classCallCheck(this, DirectionalSound);
 
-    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    _this = _super.call(this, _objectSpread2$1({
+      source: source,
+      name: name
+    }, options));
 
-    _classCallCheck(this, Sound);
+    _this.setEntityType(ENTITY_TYPES.AUDIO.DIRECTIONAL);
 
-    var _options$loop = options.loop,
-        loop = _options$loop === void 0 ? false : _options$loop,
-        _options$autoplay = options.autoplay,
-        autoplay = _options$autoplay === void 0 ? false : _options$autoplay,
-        _options$reconnectOnR = options.reconnectOnReset,
-        reconnectOnReset = _options$reconnectOnR === void 0 ? false : _options$reconnectOnR;
-    _this = _super.call(this, name, {
-      loop: loop,
-      autoplay: autoplay,
-      reconnectOnReset: reconnectOnReset
-    });
-    _this.source.loop = loop;
-    _this.target = null;
-    _this.pannerNode = null;
-    _this.convolverNode = null;
+    _this.createPannerNode(options);
 
-    if (autoplay) {
-      _this.play();
-    }
+    _this.connect();
 
-    Audio$1.add(_assertThisInitialized(_this));
     return _this;
   }
 
-  _createClass(Sound, [{
+  _createClass(DirectionalSound, [{
+    key: "hasPannerNode",
+    value: function hasPannerNode() {
+      return !!this.pannerNode;
+    }
+  }, {
     key: "createPannerNode",
     value: function createPannerNode() {
+      var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      var _options$coneInnerAng = options.coneInnerAngleDegrees,
+          coneInnerAngleDegrees = _options$coneInnerAng === void 0 ? 360 : _options$coneInnerAng,
+          _options$coneOuterAng = options.coneOuterAngleDegrees,
+          coneOuterAngleDegrees = _options$coneOuterAng === void 0 ? 0 : _options$coneOuterAng,
+          _options$coneOuterGai = options.coneOuterGain,
+          coneOuterGain = _options$coneOuterGai === void 0 ? 0 : _options$coneOuterGai,
+          _options$maxDistance = options.maxDistance,
+          maxDistance = _options$maxDistance === void 0 ? 10000 : _options$maxDistance,
+          _options$rolloffFacto = options.rolloffFactor,
+          rolloffFactor = _options$rolloffFacto === void 0 ? 1 : _options$rolloffFacto,
+          _options$refDistance = options.refDistance,
+          refDistance = _options$refDistance === void 0 ? 1 : _options$refDistance;
       this.pannerNode = Audio$1.context.createPanner();
-      this.volumeNode.disconnect();
-      this.volumeNode.connect(this.pannerNode);
-      this.pannerNode.connect(Audio$1.getMasterVolumeNode());
-    }
-  }, {
-    key: "hasEffect",
-    value: function hasEffect() {
-      return !!this.convolverNode;
+      this.pannerNode.panningModel = 'HRTF';
+      this.pannerNode.distanceModel = 'inverse';
+      this.pannerNode.refDistance = refDistance;
+      this.pannerNode.maxDistance = maxDistance;
+      this.pannerNode.rolloffFactor = rolloffFactor;
+      this.pannerNode.coneInnerAngle = coneInnerAngleDegrees;
+      this.pannerNode.coneOuterAngle = coneOuterAngleDegrees;
+      this.pannerNode.coneOuterGain = coneOuterGain;
     }
   }, {
-    key: "addEffect",
-    value: function addEffect(effect) {
-      if (!this.hasEffect() && effect) {
-        this.convolverNode = Audio$1.context.createConvolver();
-        this.mixerNode = Audio$1.createGain();
-
-        if (this.hasPannerNode()) {
-          this.pannerNode.disconnect();
-          this.pannerNode.connect(this.mixerNode);
-        } else {
-          this.volumeNode.disconnect();
-          this.volumeNode.connect(this.mixerNode);
-        } //creating gains
-
-
-        this.plainGainNode = Audio$1.context.createGain();
-        this.convolverGainNode = Audio$1.context.createGain(); //connect mixer to new gains
-
-        this.mixerNode.connect(this.plainGainNode);
-        this.mixerNode.connect(this.convolverGainNode);
-        this.plainGainNode.connect(Audio$1.getMasterVolumeNode());
-        this.convolverGainNode.connect(Audio$1.getMasterVolumeNode());
-        this.convolverNode.buffer = Audio$1.get(effect);
-        this.convolverGainNode.gain.setValueAtTime(0.7, Audio$1.context.currentTime);
-        this.plainGainNode.gain.setValueAtTime(0.3, Audio$1.context.currentTime);
+    key: "connect",
+    value: function connect() {
+      if (this.connected) {
+        this.disconnect();
       }
+
+      this.volumeNode.connect(Audio$1.getMasterVolumeNode());
+      this.pannerNode.connect(this.volumeNode);
+      this.audioNode.connect(this.pannerNode);
+      this.connected = true;
+      this.tryAutoplay();
     }
   }, {
-    key: "hasPannerNode",
-    value: function hasPannerNode() {
-      return !!this.pannerNode;
-    }
-  }, {
-    key: "hasTarget",
-    value: function hasTarget() {
-      return !!this.target;
+    key: "disconnect",
+    value: function disconnect() {
+      if (this.connected) {
+        this.volumeNode.disconnect();
+        this.pannerNode.disconnect();
+        this.audioNode.disconnect();
+        this.connected = false;
+      }
     }
   }, {
-    key: "getTarget",
-    value: function getTarget() {
-      return this.target;
+    key: "updatePannerOrientation",
+    value: function updatePannerOrientation() {
+      var vec = new Vector3$1(0, 0, 1);
+      var m = this.getBody().matrixWorld;
+      var mx = m.elements[12],
+          my = m.elements[13],
+          mz = m.elements[14];
+      m.elements[12] = m.elements[13] = m.elements[14] = 0;
+      vec.applyMatrix4(m);
+      vec.normalize();
+      this.pannerNode.orientationX.setValueAtTime(vec.x, Audio$1.context.currentTime);
+      this.pannerNode.orientationY.setValueAtTime(vec.y, Audio$1.context.currentTime);
+      this.pannerNode.orientationZ.setValueAtTime(vec.z, Audio$1.context.currentTime);
+      m.elements[12] = mx;
+      m.elements[13] = my;
+      m.elements[14] = mz;
     }
   }, {
-    key: "setTarget",
-    value: function setTarget(target) {
-      this.target = target;
-      this.createPannerNode();
+    key: "updatePannerPosition",
+    value: function updatePannerPosition() {
+      this.getBody().updateMatrixWorld();
+      var position = new Vector3$1();
+      position.setFromMatrixPosition(this.getBody().matrixWorld);
+      this.pannerNode.positionX.setValueAtTime(position.x, Audio$1.context.currentTime);
+      this.pannerNode.positionY.setValueAtTime(position.y, Audio$1.context.currentTime);
+      this.pannerNode.positionZ.setValueAtTime(position.z, Audio$1.context.currentTime);
     }
   }, {
     key: "update",
     value: function update(dt) {
-      if (this.hasTarget() && this.hasPannerNode()) {
-        var p = new Vector3$1();
-        p.setFromMatrixPosition(this.target.getBody().matrixWorld);
-        var px = p.x,
-            py = p.y,
-            pz = p.z;
-        this.target.getBody().updateMatrixWorld();
-        var q = new Vector3$1();
-        q.setFromMatrixPosition(this.target.getBody().matrixWorld);
-        var dx = q.x - px,
-            dy = q.y - py,
-            dz = q.z - pz; //setting panner position and velocity using doppler effect.
+      _get(_getPrototypeOf(DirectionalSound.prototype), "update", this).call(this, dt);
 
-        try {
-          this.panner.setPosition(q.x, q.y, q.z);
-          this.panner.setVelocity(dx / dt, dy / dt, dz / dt);
-        } catch (e) {// quick and dirty solution.
-        }
+      if (this.hasPannerNode()) {
+        this.updatePannerOrientation();
+        this.updatePannerPosition();
       }
     }
   }]);
 
-  return Sound;
-}(Beat);var Color = /*#__PURE__*/function () {
-  _createClass(Color, null, [{
-    key: "randomColor",
-    value: function randomColor() {
-      var asNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-      var letters = '0123456789ABCDEF'.split('');
-      var color = '';
-
-      for (var i = 0; i < 6; i++) {
-        color += letters[Math.floor(Math.random() * 16)];
-      }
-
-      return asNumber ? Number("0x".concat(color)) : "#".concat(color);
-    }
-  }, {
-    key: "componentToHex",
-    value: function componentToHex(c) {
-      var hex = c.toString(16);
-      return hex.length == 1 ? "0" + hex : hex;
-    }
-  }, {
-    key: "gbToHex",
-    value: function gbToHex(r, g, b) {
-      return "0x" + Color.componentToHex(r) + Color.componentToHex(g) + Color.componentToHex(b);
-    }
-  }, {
-    key: "getIntValueFromHex",
-    value: function getIntValueFromHex(hex) {
-      return parseInt(hex, 16);
-    }
-  }]);
-
-  function Color(color) {
-    _classCallCheck(this, Color);
-
-    this.color = new Color$1(color);
-  }
-
-  _createClass(Color, [{
-    key: "getColor",
-    value: function getColor() {
-      return this.color;
-    }
-  }]);
-
-  return Color;
-}();var BLOB_TYPE = 'application/javascript';
+  return DirectionalSound;
+}(Sound);var BLOB_TYPE = 'application/javascript';
 var createBlob = function createBlob(task) {
   return new Blob(['(', task.toString(), ')()'], {
     type: BLOB_TYPE
@@ -90911,15 +90896,20 @@ var DEFAULT_MAP_SIZE = 2048;
 var DEFAULT_BIAS = -0.0001;
 var WHITE = 0xffffff;
 var GREEN$1 = 0x2ecc71;
+var DEFAULT_SPOTLIGHT_ANGLE = .32;
+var DEFAULT_SPOTLIGHT_PENUMBRA = .5;
+var DEFAULT_SPOTLIGHT_DECAY = 2;
 
 var SpotLight = /*#__PURE__*/function (_Light) {
   _inherits(SpotLight, _Light);
 
   var _super = _createSuper(SpotLight);
 
-  function SpotLight(options) {
+  function SpotLight() {
     var _this;
 
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
     _classCallCheck(this, SpotLight);
 
     var _options$color = options.color,
@@ -90927,7 +90917,15 @@ var SpotLight = /*#__PURE__*/function (_Light) {
         _options$intensity = options.intensity,
         intensity = _options$intensity === void 0 ? DEFAULT_INTENSITY$1 : _options$intensity,
         _options$name = options.name,
-        name = _options$name === void 0 ? generateRandomName('SpotLight') : _options$name;
+        name = _options$name === void 0 ? generateRandomName('SpotLight') : _options$name,
+        _options$distance = options.distance,
+        distance = _options$distance === void 0 ? DEFAULT_FAR : _options$distance,
+        _options$angle = options.angle,
+        angle = _options$angle === void 0 ? DEFAULT_SPOTLIGHT_ANGLE : _options$angle,
+        _options$penumbra = options.penumbra,
+        penumbra = _options$penumbra === void 0 ? DEFAULT_SPOTLIGHT_PENUMBRA : _options$penumbra,
+        _options$decay = options.decay,
+        decay = _options$decay === void 0 ? DEFAULT_SPOTLIGHT_DECAY : _options$decay;
     _this = _super.call(this, {
       color: color,
       intensity: intensity,
@@ -90937,7 +90935,11 @@ var SpotLight = /*#__PURE__*/function (_Light) {
 
     _this.setLight({
       color: color,
-      intensity: intensity
+      intensity: intensity,
+      distance: distance,
+      angle: angle,
+      penumbra: penumbra,
+      decay: decay
     });
 
     _this.setEntityType(ENTITY_TYPES.LIGHT.SPOT);
@@ -90969,7 +90971,11 @@ var SpotLight = /*#__PURE__*/function (_Light) {
           _ref$color = _ref.color,
           color = _ref$color === void 0 ? WHITE : _ref$color,
           _ref$intensity = _ref.intensity,
-          intensity = _ref$intensity === void 0 ? DEFAULT_INTENSITY$1 : _ref$intensity;
+          intensity = _ref$intensity === void 0 ? DEFAULT_INTENSITY$1 : _ref$intensity,
+          distance = _ref.distance,
+          angle = _ref.angle,
+          penumbra = _ref.penumbra,
+          decay = _ref.decay;
 
       if (light) {
         this.setBody({
@@ -90977,7 +90983,7 @@ var SpotLight = /*#__PURE__*/function (_Light) {
         });
       } else {
         this.setBody({
-          body: new SpotLight$1(color, intensity)
+          body: new SpotLight$1(color, intensity, distance, angle, penumbra, decay)
         });
       }
 
@@ -92737,4 +92743,4 @@ var Shaders$1 = new Shaders();var Shader = function Shader(name, attributes, uni
   } else {
     this.instance = this.shader.instance;
   }
-};var constants = _objectSpread2$1(_objectSpread2$1({}, lib_constants), light_contants);export{AUDIO_RAMPS,AmbientLight,Atmosphere,Audio$1 as Audio,Axes,BUILTIN,BackgroundSound,BaseScript,Box,Camera,Color,Config$1 as Config,Controls$1 as Controls,Cube,CurveLine,Cylinder,DirectionalSound,ENTITY_EVENTS,ENTITY_TYPES,Element$1 as Element,Entity,EventDispatcher,FEATURES,Features$1 as Features,GameRunner$1 as GameRunner,Grid,HemisphereLight,INPUT_EVENTS,Images$1 as Images,Input$1 as Input,Label,LabelComponent,Level,LightLoader$1 as LightLoader,Lights$1 as Lights,Line,MeshLoader$1 as MeshLoader,Mirror,Models$1 as Models,Ocean,PALETTES,PARTICLES,constants$1 as PHYSICS_CONSTANTS,PHYSICS_EVENTS,ParticleEmitter,ParticleEmitterGroup,Particles$1 as Particles,index$1 as Partykals,Physics$1 as Physics,Plane,PointLight,PostProcessing$1 as PostProcessing,Proton,ProtonParticleEmitter,Provider,Router$1 as Router,Scene$1 as Scene,Scripts$1 as Scripts,Shader,Sky,Skybox,Sound,Sphere,SpotLight,Sprite,Stats$1 as Stats,SunLight,three_module as THREE,Universe$1 as Universe,Vector3$1 as Vector3,Water,author,connect,constants,createElement,easing,functions,hitbox as hitboxUtils,index_esm as inferno,math,utils as physicsUtils,index$2 as rxjs,index as store,strings,uuid$1 as uuid,workers};
+};var constants = _objectSpread2$1(_objectSpread2$1({}, lib_constants), light_contants);export{AUDIO_RAMPS,AmbientLight,AmbientSound,Atmosphere,Audio$1 as Audio,Axes,BUILTIN,BaseScript,Box,Camera,Color,Cone,Config$1 as Config,Controls$1 as Controls,Cube,CurveLine,Cylinder,DirectionalSound,ENTITY_EVENTS,ENTITY_TYPES,Element$1 as Element,Entity,EventDispatcher,FEATURES,Features$1 as Features,GameRunner$1 as GameRunner,Grid,HemisphereLight,INPUT_EVENTS,Images$1 as Images,Input$1 as Input,Label,LabelComponent,Level,LightLoader$1 as LightLoader,Lights$1 as Lights,Line,MeshLoader$1 as MeshLoader,Mirror,Models$1 as Models,Ocean,PALETTES,PARTICLES,constants$1 as PHYSICS_CONSTANTS,PHYSICS_EVENTS,ParticleEmitter,ParticleEmitterGroup,Particles$1 as Particles,index$1 as Partykals,Physics$1 as Physics,Plane,PointLight,PostProcessing$1 as PostProcessing,Proton,ProtonParticleEmitter,Provider,Router$1 as Router,Scene$1 as Scene,Scripts$1 as Scripts,Shader,Sky,Skybox,Sound,Sphere,SpotLight,Sprite,Stats$1 as Stats,SunLight,three_module as THREE,Universe$1 as Universe,Vector3$1 as Vector3,Water,author,connect,constants,createElement,easing,functions,hitbox as hitboxUtils,index_esm as inferno,math,utils as physicsUtils,index$2 as rxjs,index as store,strings,uuid$1 as uuid,workers};