Skip to content

Commit

Permalink
Merge pull request #181 from vircadia/fix/avatar-attachment-positions
Browse files Browse the repository at this point in the history
Fix avatar attachment positions.
  • Loading branch information
digisomni authored Sep 17, 2023
2 parents f5dda88 + 8721884 commit 5baa8cb
Show file tree
Hide file tree
Showing 22 changed files with 292 additions and 182 deletions.
5 changes: 2 additions & 3 deletions src/components/JitsiContainer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -70,10 +70,9 @@ export default defineComponent({
},
setupWebEntity(room: JitsiRoomInfo, element: HTMLElement): void {
const gameObject = GameObject.getGameObjectByID(room.entity.id);
const controller = gameObject?.getComponent(WebEntityController.typeName) as WebEntityController;
if (controller) {
const controller = gameObject?.getComponent(WebEntityController.typeName);
if (controller instanceof WebEntityController) {
controller.externalElement = element;

}
}
}
Expand Down
4 changes: 2 additions & 2 deletions src/components/overlays/avatar/Avatar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -515,8 +515,8 @@ export default defineComponent({
set: function(pVal: string): void {
Log.debug(Log.types.AVATAR, `Avatar.vue: set displayNameStore. inputInfo=${pVal}`);
const scene = Renderer.getScene();
const avatarController = scene._myAvatar?.getComponent(MyAvatarController.typeName) as MyAvatarController;
if (avatarController) {
const avatarController = scene._myAvatar?.getComponent(MyAvatarController.typeName);
if (avatarController instanceof MyAvatarController) {
avatarController.displayName = pVal;
}
this.userStore.avatar.displayName = pVal;
Expand Down
7 changes: 4 additions & 3 deletions src/components/overlays/explore/Explore.vue
Original file line number Diff line number Diff line change
Expand Up @@ -479,7 +479,8 @@ import { Vector3, Vector4 } from "@babylonjs/core";
import { applicationStore, userStore } from "@Stores/index";
import { Utility } from "@Modules/utility";
import { Location } from "@Modules/domain/location";
import { Places, PlaceEntry } from "@Modules/places";
import { API } from "@Modules/metaverse/API";
import type { PlaceEntry } from "@Modules/metaverse/APIPlaces";
import { Renderer } from "@Modules/scene";
import Log from "@Modules/debugging/log";
import OverlayShell from "../OverlayShell.vue";
Expand Down Expand Up @@ -515,7 +516,7 @@ export default defineComponent({

data() {
return {
placesList: [] as PlaceEntry[],
placesList: new Array<PlaceEntry>(),
loading: false,
filterText: "",
locationInput: "",
Expand Down Expand Up @@ -598,7 +599,7 @@ export default defineComponent({
methods: {
async loadPlacesList(): Promise<void> {
this.loading = true;
this.placesList = await Places.getActiveList();
this.placesList = await API.getActivePlaceList();
this.loading = false;
},

Expand Down
5 changes: 3 additions & 2 deletions src/components/overlays/jitsi/Jitsi.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,9 +71,10 @@ export default defineComponent({
},

methods: {
getWebEntityController() : WebEntityController {
getWebEntityController(): WebEntityController | undefined {
const gameObject = GameObject.getGameObjectByID(this.room.entity.id);
return gameObject?.getComponent(WebEntityController.typeName) as WebEntityController;
const component = gameObject?.getComponent(WebEntityController.typeName);
return component instanceof WebEntityController ? component : undefined;
}
},

Expand Down
26 changes: 26 additions & 0 deletions src/components/overlays/settings/Controls.vue
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,9 @@ kbd {
<q-tab name="keyboard" icon="keyboard" label="">
<q-tooltip class="bg-black">Keyboard</q-tooltip>
</q-tab>
<q-tab name="camera" icon="camera" label="">
<q-tooltip class="bg-black">Camera</q-tooltip>
</q-tab>
</q-tabs>
<q-tab-panels
v-model="tab"
Expand Down Expand Up @@ -158,6 +161,29 @@ kbd {
</q-list>
</q-scroll-area>
</q-tab-panel>

<q-tab-panel name="camera" class="q-px-none q-pb-none column no-wrap items-stretch">
<q-scroll-area class="full-height">
<q-list class="q-pb-md">
<q-item>
<q-item-section
title="Camera Bobbing"
>
Camera Bobbing
</q-item-section>
<q-item-section class="q-pl-sm">
<q-toggle
name="bloom"
v-model="userStore.graphics.cameraBobbing"
/>
</q-item-section>
<q-item-section side style="min-width: 5ch;">
<output for="bloom">{{ userStore.graphics.cameraBobbing ? `On` : `Off` }}</output>
</q-item-section>
</q-item>
</q-list>
</q-scroll-area>
</q-tab-panel>
</q-tab-panels>
</q-card>
</OverlayShell>
Expand Down
16 changes: 16 additions & 0 deletions src/components/overlays/settings/Graphics.vue
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,22 @@
<output for="fieldOfView">{{ fieldOfView }}</output>
</q-item-section>
</q-item>
<q-item>
<q-item-section
title="Camera Bobbing"
>
Camera Bobbing
</q-item-section>
<q-item-section class="q-pl-sm">
<q-toggle
name="bloom"
v-model="userStore.graphics.cameraBobbing"
/>
</q-item-section>
<q-item-section side style="min-width: 5ch;">
<output for="bloom">{{ userStore.graphics.cameraBobbing ? `On` : `Off` }}</output>
</q-item-section>
</q-item>
<q-item>
<q-item-section
title="Bloom"
Expand Down
79 changes: 49 additions & 30 deletions src/modules/avatar/controller/inputController.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,16 +33,17 @@ import { IInputHandler } from "./inputs/inputHandler";
import { KeyboardInput } from "./inputs/keyboardInput";
import { VirtualJoystickInput } from "./inputs/virtualJoystickInput";
import { applicationStore, userStore } from "@Stores/index";
import type { SceneController } from "@Modules/scene/controllers";
import { MouseSettingsController } from "@Base/modules/avatar/controller/inputs/mouseSettings";
import { Renderer } from "@Modules/scene";
import { MouseSettingsController } from "@Modules/avatar/controller/inputs/mouseSettings";
import { Hysteresis } from "@Modules/utility/hysteresis";
import { IglooCamera } from "@Modules/apps/igloo/Igloo.js";

// Custom camera controls.
class ArcRotateCameraCustomInput implements ICameraInput<ArcRotateCamera> {
className = "ArcRotateCameraCustomInput";
simpleName = "customKeyboardRotate";
camera: ArcRotateCamera;
_keysPressed = [] as string[];
_keysPressed = new Array<string>();
sensibility = 0.01;
_preventDefault = false;

Expand All @@ -69,9 +70,11 @@ class ArcRotateCameraCustomInput implements ICameraInput<ArcRotateCamera> {
attachControl(preventDefault: boolean): void {
this._preventDefault = preventDefault;
const engine = this.camera.getEngine();
const element = engine.getInputElement() as HTMLElement;
const element = engine.getInputElement();
if (!this._onKeyDown || !this._onKeyUp) {
element.tabIndex = 1;
if (element) {
element.tabIndex = 1;
}
// Define the keydown event handler.
this._onKeyDown = (event: KeyboardEvent) => {
if (this._preventDefault) {
Expand All @@ -83,7 +86,7 @@ class ArcRotateCameraCustomInput implements ICameraInput<ArcRotateCamera> {
this._keysPressed.push(event.code);
}
};
element.addEventListener("keydown", (event) => {
element?.addEventListener("keydown", (event) => {
if (this._onKeyDown) {
this._onKeyDown(event);
}
Expand All @@ -99,7 +102,7 @@ class ArcRotateCameraCustomInput implements ICameraInput<ArcRotateCamera> {
this._keysPressed.splice(index, 1);
}
};
element.addEventListener("keyup", (event) => {
element?.addEventListener("keyup", (event) => {
if (this._onKeyUp) {
this._onKeyUp(event);
}
Expand All @@ -115,16 +118,16 @@ class ArcRotateCameraCustomInput implements ICameraInput<ArcRotateCamera> {

detachControl(): void {
const engine = this.camera.getEngine();
const element = engine.getInputElement() as HTMLElement;
const element = engine.getInputElement();
if (this._onKeyDown || this._onKeyUp) {
// Remove all event listeners.
element.removeEventListener("keydown", (event) => {
element?.removeEventListener("keydown", (event) => {
if (this._onKeyDown) {
this._onKeyDown(event);
}
});
this._onKeyDown = undefined;
element.removeEventListener("keyup", (event) => {
element?.removeEventListener("keyup", (event) => {
if (this._onKeyUp) {
this._onKeyUp(event);
}
Expand Down Expand Up @@ -173,11 +176,13 @@ export class InputController extends ScriptComponent {
private _cameraSkin = 0.1;
private _cameraElastic = true;
private _cameraViewTransitionThreshold = 1.5;
private _animGroups: Nullable<Array<AnimationGroup>> = null;
private _cameraHeightHysteresis: Nullable<Hysteresis> = null;
private _animGroups = new Array<AnimationGroup>();
private _animator: Nullable<Animator> = null;
private _avatarState: AvatarState = new AvatarState();
private _avatarState = new AvatarState();
private _avatarHeight = 0;
private _inputState: InputState = new InputState();
private _avatarRoot: Nullable<Vector3> = null;
private _inputState = new InputState();
private _input: Nullable<IInputHandler> = null;
private _isMobile = false;

Expand All @@ -199,10 +204,20 @@ export class InputController extends ScriptComponent {
this._animGroups = value;
}

/**
* The height of the avatar model.
*/
public set avatarHeight(value: number) {
this._avatarHeight = value;
}

/**
* The root vector of the avatar model.
*/
public set avatarRoot(value: Vector3) {
this._avatarRoot = value;
}

public set camera(value: Nullable<ArcRotateCamera>) {
this._camera = value;

Expand All @@ -229,6 +244,12 @@ export class InputController extends ScriptComponent {
}
});

this._cameraHeightHysteresis = new Hysteresis(
() => (this._avatarRoot?.y ?? this._avatarHeight / 2) + this._avatarHeight / 2,
100,
0.1
);

// Remove the default camera controls.
this._camera.inputs.removeByType("ArcRotateCameraKeyboardMoveInput");

Expand Down Expand Up @@ -342,9 +363,7 @@ export class InputController extends ScriptComponent {


public onInitialize(): void {
this._animator = new Animator(
this._gameObject as GameObject,
this._animGroups as AnimationGroup[]);
this._animator = new Animator(this._gameObject as GameObject, this._animGroups);

// Jump animation-end handler.
const jumpAnim = this._animator.getAnimationGroup("jump_standing_land_settle_all");
Expand Down Expand Up @@ -496,9 +515,7 @@ export class InputController extends ScriptComponent {
return;
}
this._avatarState.state = State.Idle;
const sceneManager = this._scene.rootNodes.find((node) => node.id === "SceneManager") as GameObject;
const sceneController = sceneManager.components.get("SceneController") as SceneController | undefined;
sceneController?.applyGravity();
Renderer.getScene().sceneController?.applyGravity();
}
}

Expand Down Expand Up @@ -550,15 +567,13 @@ export class InputController extends ScriptComponent {
return;
}

// Reset the avatar's rotation (so that it is standing up).
// Reset the avatar's rotation (so that it is standing upright).
if (this._gameObject && this._gameObject.rotationQuaternion) {
this._gameObject.rotationQuaternion.x = 0;
this._gameObject.rotationQuaternion.z = 0;
}

const sceneManager = this._scene.rootNodes.find((node) => node.id === "SceneManager") as GameObject;
const sceneController = sceneManager.components.get("SceneController") as SceneController | undefined;
sceneController?.applyGravity();
Renderer.getScene().sceneController?.applyGravity();

this._avatarState.duration += delta;

Expand Down Expand Up @@ -730,8 +745,15 @@ export class InputController extends ScriptComponent {
return;
}

const cameraMode = this._camera.radius <= this._cameraViewTransitionThreshold
? CameraMode.FirstPerson
: CameraMode.ThirdPerson;

// Make the camera follow the avatar.
this._defaultCameraTarget.y = this._avatarHeight;
const smoothHeight = cameraMode === CameraMode.FirstPerson && userStore.graphics.cameraBobbing
? this._cameraHeightHysteresis?.getInstant()
: this._cameraHeightHysteresis?.get();
this._defaultCameraTarget.y = smoothHeight ?? this._avatarHeight;
this._gameObject.position.addToRef(this._defaultCameraTarget, this._camera.target);

// Update the FOV.
Expand All @@ -742,9 +764,6 @@ export class InputController extends ScriptComponent {
this._snapCamera(delta);
}

const cameraMode = this._camera.radius <= this._cameraViewTransitionThreshold
? CameraMode.FirstPerson
: CameraMode.ThirdPerson;
if (cameraMode === CameraMode.FirstPerson) {
this._cameraViewTransitionThreshold = this._camera.lowerRadiusLimit;
this._camera.wheelDeltaPercentage = MouseSettingsController.sensitivityComponents.wheelDeltaMultiplier;
Expand Down Expand Up @@ -888,9 +907,9 @@ export class InputController extends ScriptComponent {
}

// Set the visibility of the avatar's mesh.
const meshComp = this._gameObject.getComponent(MeshComponent.typeName) as MeshComponent;
if (meshComp) {
meshComp.visible = visible;
const meshComponent = this._gameObject.getComponent("Mesh");
if (meshComponent instanceof MeshComponent) {
meshComponent.visible = visible;
}
}
}
9 changes: 2 additions & 7 deletions src/modules/avatar/controller/inputs/keyboardInput.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,6 @@ import { InputState, CameraMode, InputMode } from "../inputState";
import { applicationStore, userStore } from "@Stores/index";
import { AudioManager as AudioMgr } from "@Modules/scene/audio";
import { Renderer } from "@Modules/scene";
import type { GameObject } from "@Modules/object";
import type { SceneController } from "@Modules/scene/controllers";


export class KeyboardInput implements IInputHandler {
Expand Down Expand Up @@ -162,8 +160,7 @@ export class KeyboardInput implements IInputHandler {

// Fly.
if (sourceEvent.code === userStore.controls.keyboard.movement.fly?.keycode) {
const sceneManager = this._scene.rootNodes.find((node) => node.id === "SceneManager") as GameObject;
const sceneController = sceneManager.components.get("SceneController") as SceneController | undefined;
const sceneController = Renderer.getScene().sceneController;

if (this._state.state === State.Fly) {
this._state.action = Action.Jump;
Expand Down Expand Up @@ -233,9 +230,7 @@ export class KeyboardInput implements IInputHandler {
this._state.action = animation;

// Remove gravity.
const sceneManager = this._scene.rootNodes.find((node) => node.id === "SceneManager") as GameObject;
const sceneController = sceneManager.components.get("SceneController") as SceneController | undefined;
sceneController?.removeGravity();
Renderer.getScene().sceneController?.removeGravity();

// Snap to the sittable object.
avatarMesh.setAbsolutePosition(selectedSitObject[0].getAbsolutePosition());
Expand Down
Loading

0 comments on commit 5baa8cb

Please sign in to comment.