yomotsu / camera-controls

A camera control for three.js, similar to THREE.OrbitControls yet supports smooth transitions and more features.

Home Page:https://yomotsu.github.io/camera-controls/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

make CameraControls modulable

yomotsu opened this issue · comments

Is your feature request related to a problem? Please describe.

CameraControls became a sort of large code as just a camera controls lib by adding each feature.
This affects the file size and maintenanceability.

I'm planning to make CC modulable with mixins.

example usages:

// some user only need programmable
const CameraControlsProgrammable = makeProgrammable( CameraControlsEssential );
const programmableCameraControls = new CameraControlsProgrammable( {} );
programmableCameraControls.rotate();

// also, this can assemble the current CameraControls.
const CameraControls = makeDraggable( makeProgrammable( CameraControlsEssential ) );
const cameraControls = new CameraControls( {} );
cameraControls.rotate();

here is the example code in the TS playground.

The TS suggestions still work even if we use mixins.

in this case, the instance only has and suggests isProgrammable and methods for that.

image


in this case, the instance has and suggests both isProgrammable and isDraggable params.

image

or maybe
const myCC = assembleCameraControls( { exclude: [ 'functionalityName' ] } );
const myCC = assembleCameraControls( { include: [ 'functionalityName' ] } );

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

No response

type Constructor<TResult, TParams extends any[] = any[]> = new (
    ...params: TParams
) => TResult;

// we will have the essestial abstract class
interface Camera {}
class CameraControlsEssential {

  _spherical = 0;

  constructor( camera: Camera ) {

    console.log( this._spherical );

  }

}

// then user can add features
function makeProgrammable<TBase extends Constructor<CameraControlsEssential>>(Base: TBase) {
    return class extends Base {
        constructor(...args: any[]) {
            super(...args);
            console.log( 'extended 1' );
        }
        rotate() {
          console.log( 'rotate' );
        }
    };
}

function makeDraggable<TBase extends Constructor<CameraControlsEssential>>(Base: TBase) {
    return class extends Base {
        constructor(...args: any[]) {
            super(...args);
            console.log( 'extended 2' );

            const dragStart = () => {
                console.log( 'dragStart' );
            }
            document.body.addEventListener( 'pointerdown', dragStart );
        }
    };
}

// someuser only needs programmable
const CameraControlsProgrammable = makeProgrammable(CameraControlsEssential);
const programmableCameraControls = new CameraControlsProgrammable( {} );
programmableCameraControls.rotate();

// also, this can assemble the current CameraControls.
const CameraControls = makeDraggable( makeProgrammable(CameraControlsEssential) );
const cameraControls = new CameraControls( {} );
cameraControls.rotate();

But I can't still decide on the module granularity...
Please add comments on what you think of it.