From 1dab495955e5d520cb4a862d90466629f949b51a Mon Sep 17 00:00:00 2001
From: joni <johnfshaughnessy@gmail.com>
Date: Thu, 12 Apr 2018 16:37:26 -0700
Subject: [PATCH] Fix the problem where the avatar selector spins all the way
around.
---
src/react-components/avatar-selector.js | 14 ++++++++++++--
yarn.lock | 10 ----------
2 files changed, 12 insertions(+), 12 deletions(-)
diff --git a/src/react-components/avatar-selector.js b/src/react-components/avatar-selector.js
index 465608e7c..528d5b815 100644
--- a/src/react-components/avatar-selector.js
+++ b/src/react-components/avatar-selector.js
@@ -38,7 +38,17 @@ class AvatarSelector extends Component {
// HACK - a-animation ought to restart the animation when the `to` attribute changes, but it doesn't
// so we need to force it here.
const currRot = this.animation.parentNode.getAttribute("rotation");
- this.animation.setAttribute("from", `${currRot.x} ${currRot.y} ${currRot.z}`);
+ const currY = currRot.y;
+ const toRot = String.split(this.animation.attributes.to.value, " ");
+ const toY = toRot[1];
+ const step = 360.0 / this.props.avatars.length;
+ const brokenlyBigRotation = Math.abs(toY - currY) > 3 * step;
+ let fromY = currY;
+ if (brokenlyBigRotation) {
+ // Rotation in Y wrapped around 360. Adjust the "from" to prevent a dramatic rotation
+ fromY = currY < toY ? currY + 360 : currY - 360;
+ }
+ this.animation.setAttribute("from", `${currRot.x} ${fromY} ${currRot.z}`);
this.animation.stop();
this.animation.handleMixinUpdate();
this.animation.start();
@@ -83,7 +93,7 @@ class AvatarSelector extends Component {
attribute="rotation"
dur="1000"
easing="ease-out"
- to={`0 ${360 * this.getAvatarIndex() / this.props.avatars.length + 180} 0`}
+ to={`0 ${(360 * this.getAvatarIndex() / this.props.avatars.length + 180) % 360} 0`}
/>
{avatarEntities}
</a-entity>
diff --git a/yarn.lock b/yarn.lock
index 142ae2918..35ef01650 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -170,12 +170,6 @@ aframe-extras@^4.0.0:
version "0.1.2"
resolved "https://github.com/johnshaughnessy/aframe-input-mapping-component#4c7e493ad6c4a25eef27d32551c94d8b78541191"
-aframe-lerp-component@^1.1.0:
- version "1.1.0"
- resolved "https://registry.yarnpkg.com/aframe-lerp-component/-/aframe-lerp-component-1.1.0.tgz#dc8c12c53698770c30f25eef8873e34a4e79c765"
- dependencies:
- almost-equal "^1.1.0"
-
"aframe-physics-extras@https://github.com/infinitelee/aframe-physics-extras#fix/physics-collider-crash":
version "0.1.2"
resolved "https://github.com/infinitelee/aframe-physics-extras#49b2d5d3c0caac905783aee51d9e89dbdf7199b8"
@@ -234,10 +228,6 @@ ajv@^6.0.1, ajv@^6.1.0:
fast-json-stable-stringify "^2.0.0"
json-schema-traverse "^0.3.0"
-almost-equal@^1.1.0:
- version "1.1.0"
- resolved "https://registry.yarnpkg.com/almost-equal/-/almost-equal-1.1.0.tgz#f851c631138757994276aa2efbe8dfa3066cccdd"
-
alphanum-sort@^1.0.1, alphanum-sort@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/alphanum-sort/-/alphanum-sort-1.0.2.tgz#97a1119649b211ad33691d9f9f486a8ec9fbe0a3"
--
GitLab