Custom Mouse Input (TypeScript)

Questions
1

Hello all,
I am trying to create a custom input handler and I have checked out the tutorial (Customize Camera Inputs - Babylon.js Documentation). I am doing the following in TS, but VSCode is highlighting “camera” with the message “Property ‘camera’ has no initializer and is not definitely assigned in the constructor.” The docs say this will get filled in by the input manager, so I didn’t set it explicitly. Did I miss something?

import { Nullable } from "@babylonjs/core/types";
import { FreeCamera } from '@babylonjs/core/Cameras/freeCamera';
import { ICameraInput } from '@babylonjs/core/Cameras/cameraInputsManager';

export class HoverCameraMouseInput implements ICameraInput<FreeCamera>
{
    public camera: FreeCamera;

    public constructor()
    {

    }

    public getClassName():string
    {
        return 'HoverCameraMouseInput';
    }

    public getSimpleName():string
    {
        return 'hoverInput';
    }

    public attachControl(element:HTMLElement, preventDefault:boolean):void
    {

    }

    public detachControl(element: Nullable<HTMLElement>)
    {

    }

    public checkInputs():void 
    {

    }
}
2

I did something similar a about a week ago and went with

public camera: Nullable<ArcRotateCamera> = null;

The full code is in this thread:
https://forum.babylonjs.com/t/arcrotatecamera-make-it-shift-on-the-y-axis-instead-of-panning/1910/5

3 Likes
3

Also quick update here as the last post got a like not long ago and seems to still be relevant:

I updated the above mentioned input to the new style of ArcRotateCameraPointersInput.
ArcRotateCameraPointersInput got a rework after my initial post and is now way easier to understand and modifying it became a lot easier in my eyes. :slight_smile:

By extending that class it is not necessary anymore to add the line with the camera as it is all in the base class. I would guess that it is the same for other CameraPointsInputs and CameraInputs in general.

For the new code see the thread linked in the post above. :+1:

1 Like