lythreeframe 1.0.0

package/lythreeFrame/src/Object/Pawn/TransformControl.ts

@@ -0,0 +1,215 @@
+import {PawnBase} from "./PawnBase";
+import {LYThreeWorld} from "../../Frame";
+import {Camera, Matrix4, Object3D, PerspectiveCamera} from "three";
+import {TransformControls} from "three/examples/jsm/controls/TransformControls";
+
+export interface TransformType
+{
+    rotate:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null;
+    scale:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null;
+    translate:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null;
+}
+
+export interface ITransforming
+{
+    // onTransfroming(worldPos:Vector3, worldQuat:Quaternion, worldScale:Vector3):void
+    isTransformAllowed():boolean;
+
+    onTransforming(worldMatrix:Matrix4):void;
+
+    getMatrixInWorld():Matrix4;
+
+    getAllowedTransformType():TransformType;
+}
+
+export class LYTransformControl extends PawnBase
+{
+    protected onChange:Function;
+    protected onDraggingChanged:Function;
+    protected onObjectChange:Function;
+    protected onUpdateFunctions:Function[]              = [];
+    protected onDraggingFunctions:Function[]            = [];
+    private helperObject:Object3D                       = new Object3D();
+    protected targets:ITransforming[]                   = [];
+    protected primaryTarget:ITransforming | null        = null;
+    private targetMatrixMap:Map<ITransforming, Matrix4> = new Map();
+
+    constructor(world:LYThreeWorld, camera:Camera)
+    {
+        camera = camera ? camera : new PerspectiveCamera();
+        super(world, camera, new TransformControls(camera, world.renderer.domElement));
+        world.scene?.add(this.helperObject);
+        this.onUpdateFunctions = [];
+        this.onChange          = () =>
+            {
+                this.World.markRenderStateDirty();
+            };
+        this.onDraggingChanged = (event) =>
+            {
+                if (this.primaryTarget)
+                {
+                    let tMatrix = this.primaryTarget.getMatrixInWorld();
+                    tMatrix.decompose(this.helperObject.position, this.helperObject.quaternion, this.helperObject.scale);
+                }
+                this.onDraggingFunctions.forEach((elem) =>
+                {
+                    elem(event.value);
+                });
+            };
+        this.onObjectChange    = () =>
+            {
+                if (this.primaryTarget)
+                {
+                    const TA1 = this.primaryTarget.getMatrixInWorld();
+                    this.helperObject.updateMatrixWorld(true);
+                    const TA2 = this.helperObject.matrixWorld.clone();
+                    // 将初始矩阵分解为位置、旋转和缩放
+
+
+                    this.primaryTarget.onTransforming(TA2);
+
+                    const TA1Inverse      = TA1.clone().invert();
+                    const transformMatrix = new Matrix4().multiplyMatrices(TA2, TA1Inverse);
+                    this.targets.forEach((tar) =>
+                    {
+
+                        //
+                        // let TB1 = tar.getMatrixInWorld(); // B 的初始世界矩阵
+                        // let TB2 = new Matrix4().multiplyMatrices(transformMatrix, TB1); // B 
+                        //
+                        // tar.onTransforming(TB2)
+                        // let TB1 = tar.getMatrixInWorld();
+                        // const TB_local = TB1.clone().invert().multiply(TA1);
+
+                        if (tar !== this.primaryTarget)
+                        {
+                            let TB2 = new Matrix4().multiplyMatrices(TA2, this.targetMatrixMap.get(tar)); // B 
+
+                            tar.onTransforming(TB2);
+                        }
+
+                    });
+
+                    // this.primaryTarget.onTransforming(this.helperObject.matrix)
+
+                }
+                this.onUpdateFunctions.forEach((elem) =>
+                {
+                    elem();
+                });
+            };
+        this.setSize(0.5);
+        this.World.markRenderStateDirty();
+
+    }
+
+    tick(deltaTime)
+    {
+        super.tick(deltaTime);
+    }
+
+    get Camera()
+    {
+        return this.Control.camera;
+    }
+
+    set enable(newEnable)
+    {
+        this.Control.enabled = newEnable;
+    }
+
+
+    setTarget(primaryTarget:ITransforming, multiTargets:ITransforming[], onUpdate:Function | null = null, onDragging:Function | null)
+    {
+        this.targetMatrixMap.clear();
+        let tMatrix = primaryTarget.getMatrixInWorld();
+        tMatrix.decompose(this.helperObject.position, this.helperObject.quaternion, this.helperObject.scale);
+        this.Control.attach(this.helperObject);
+        this.primaryTarget = primaryTarget;
+        this.targets       = multiTargets;
+
+
+        this.targets.forEach((elem) =>
+        {
+            const tarMatrix = elem.getMatrixInWorld();
+            const TB_local  = tMatrix.clone().invert().multiply(tarMatrix);
+
+            this.targetMatrixMap.set(elem, TB_local);
+        });
+
+        if (onUpdate)
+        {
+            this.onUpdateFunctions.push(onUpdate);
+        }
+
+        if (onUpdate)
+        {
+            this.onUpdateFunctions.push(onUpdate);
+        }
+        if (onDragging)
+        {
+            this.onDraggingFunctions.push(onDragging);
+        }
+        this.IsTickable = true;
+    }
+
+    getMode():"translate" | "rotate" | "scale"
+    {
+        return this.Control.getMode();
+    }
+
+    setMode(mode:"translate" | "rotate" | "scale"):void
+    {
+        this.Control.setMode(mode);
+    }
+
+    setSpace(space:"world" | "local"):void
+    {
+        this.Control.setSpace(space);
+    }
+
+    setAxis(axis:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null)
+    {
+        this.Control.showX = axis?.indexOf("X") >= 0;
+        this.Control.showY = axis?.indexOf("Y") >= 0;
+        this.Control.showZ = axis?.indexOf("Z") >= 0;
+    }
+
+    setSize(size:number):void
+    {
+        this.Control.setSize(size);
+    }
+
+    setCamera(newCamera)
+    {
+        super.setCamera(newCamera);
+        this.Control.camera = newCamera;
+        this.World.markRenderStateDirty();
+    }
+
+    possess()
+    {
+        this.World.scene.add(this.Control.getHelper());
+        this.Control.addEventListener('change', this.onChange);
+        this.Control.addEventListener('dragging-changed', this.onDraggingChanged);
+        this.Control.addEventListener('objectChange', this.onObjectChange);
+    }
+
+    unpossess()
+    {
+        this.World.scene.remove(this.Control.getHelper());
+        this.onUpdateFunctions = [];
+        this.Control.removeEventListener('change', this.onChange);
+        this.Control.removeEventListener('dragging-changed', this.onDraggingChanged);
+        this.Control.removeEventListener('objectChange', this.onObjectChange);
+    }
+
+
+    destroy()
+    {
+        this.IsTickable = false;
+        this.world.scene?.remove(this.helperObject);
+
+        super.destroy();
+    }
+}

package/lythreeFrame/src/Object/Pawn/staticCamera.ts

@@ -0,0 +1,80 @@
+import { PointerLockControls } from 'three/addons/controls/PointerLockControls.js';
+import {Euler, PerspectiveCamera, Quaternion} from "three";
+import {CameraStatus, PawnBase} from "./PawnBase";
+
+export class LYStaticCamera extends PawnBase
+{
+    protected speed: number        = 3
+    protected cameraHeight: number = 15
+    protected domElement
+
+    constructor(world)
+    {
+        let ele = world.Element;
+        let camera = new PerspectiveCamera(90, ele.clientWidth / ele.clientHeight, 0.5, 7000)
+        super(world, camera, new PointerLockControls(camera, world.renderer.domElement));
+        this.domElement = world.renderer.domElement
+
+        camera.position.y = Math.max(camera.position.y, 5)
+
+        this.World.markRenderStateDirty();
+    }
+
+    tick(deltaTime)
+    {
+        super.tick(deltaTime)
+    }
+
+    get Camera()
+    {
+        return this.Control.camera;
+    }
+
+    setCamera(newCamera)
+    {
+        super.setCamera(newCamera)
+        this.Control.camera = newCamera
+        this.World.markRenderStateDirty();
+    }
+
+    possess()
+    {
+    }
+
+    unpossess()
+    {
+
+    }
+
+    focusTo(targetPos, targetQuat, distance, time = 0, onFinished = null)
+    {
+        this.Camera.position.set(targetPos.x, targetPos.y + this.cameraHeight, targetPos.z);
+        if (targetQuat instanceof Euler)
+        {
+            targetQuat = new Quaternion().setFromEuler(targetQuat)
+        }
+        this.Camera.quaternion.set(targetQuat.x, targetQuat.y, targetQuat.z, targetQuat.w)
+        this.cameraStatus.update(this.Camera.position, this.Camera.quaternion, targetPos)
+
+        if (onFinished)
+        {
+            onFinished();
+        }
+        this.World.markRenderStateDirty();
+    }
+    
+    restore(status: CameraStatus)
+    {
+        super.restore(status);
+        this.focusTo(status.targetPosition, status.cameraQuaternion, status.targetPosition.clone().sub(status.cameraPosition).length())
+    }
+
+    destroy()
+    {
+        if (this.Control)
+        {
+            this.Control.dispose();
+        }
+        super.destroy();
+    }
+}

package/lythreeFrame/src/Object/PawnV2/FirstPerson.ts

@@ -0,0 +1,12 @@
+import {Pawn} from "./Pawn.ts";
+import {PointerLockControls} from "three/examples/jsm/controls/PointerLockControls";
+import {Controller} from "../../Frame/Controller.ts";
+
+export class FirstPerson extends Pawn
+{
+    constructor(controller:Controller)
+    {
+        super(controller);
+        this.control = new PointerLockControls(controller.camera, controller.viewPort.canvas)
+    }
+}

package/lythreeFrame/src/Object/PawnV2/Oribital.ts

@@ -0,0 +1,45 @@
+import {Pawn} from "./Pawn.ts";
+
+import {Controller} from "../../Frame/Controller.ts";
+import { OrbitControls } from "three/examples/jsm/Addons.js";
+
+export class Orbital extends Pawn
+{
+    override get control():OrbitControls
+    {
+        if(!this._control)
+        {
+            throw new Error("Control not initialized")
+        }
+        return this._control;
+    }
+    protected override _control:OrbitControls
+    protected changeEvent = ()=>{this.onChange()}
+
+    constructor(controller:Controller)
+    {
+        super(controller);
+        this._control = new OrbitControls(controller.camera, controller.viewPort.canvas)
+        this.control.target.set( 0, 0, 0 );
+        controller.camera.position.set( 0, 4, 4 );
+        this.control.update()
+    }
+
+    possess()
+    {
+        super.possess()
+        this.control.addEventListener('change', this.changeEvent)
+
+    }
+
+    unpossess()
+    {
+        super.unpossess()
+        this.control.removeEventListener("change", this.changeEvent)
+    }
+    
+    onChange()
+    {
+        this.controller.viewPort.markRenderStateDirty();
+    }
+}

package/lythreeFrame/src/Object/PawnV2/Pawn.ts

@@ -0,0 +1,50 @@
+
+import {Controller} from "../../Frame/Controller.ts";
+
+export abstract class Pawn
+{
+    get camera()
+    {
+        return this.controller.camera
+    }
+
+    set enabled(value:boolean)
+    {
+        this.control.enabled = value
+    }
+
+    get control():any
+    {
+        if(!this._control)
+        {
+            throw new Error("Control not initialized")
+        }
+        return this._control;
+    }
+    protected _control      : any|null = null;
+    protected controller   : Controller;
+    protected isTickEnabled: boolean = false;
+
+    protected constructor(controller:Controller)
+    {
+        this.controller = controller;
+    }
+
+    tick(deltaTime:number)
+    {
+        return;
+    }
+    possess()
+    {
+        
+    }
+    unpossess()
+    {
+        
+    }
+
+    destroy()
+    {
+        
+    }
+}

package/lythreeFrame/src/Object/PawnV2/TransformControl.ts

@@ -0,0 +1,201 @@
+import { Controller } from "@threeframe/LYCustomFrame.ts";
+import {Pawn} from "./Pawn.ts";
+import { Matrix4, Object3D } from "three";
+import { TransformControls } from "three/examples/jsm/controls/TransformControls.js";
+export interface TransformType
+{
+    rotate:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null;
+    scale:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null;
+    translate:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null;
+}
+
+export interface ITransforming
+{
+    // onTransfroming(worldPos:Vector3, worldQuat:Quaternion, worldScale:Vector3):void
+    isTransformAllowed():boolean;
+    onTransforming(worldMatrix:Matrix4):void;
+    getMatrixInWorld():Matrix4;
+    getAllowedTransformType(): TransformType;
+}
+
+export class TransformGizmo extends Pawn
+{
+    override get control():TransformControls
+    {
+        if(!this._control)
+        {
+            throw new Error("Control not initialized")
+        }
+        return this._control;
+    }
+    protected override  _control        : TransformControls|null = null
+    private   helperObject   : Object3D                          = new Object3D();
+    private   targets        : ITransforming[]                   = [];
+    private   primaryTarget  : ITransforming | null              = null;
+    private   targetMatrixMap: Map<ITransforming,                 Matrix4> = new Map();
+   
+    protected onDraggingChangedEvent:(param:{ value: unknown })=>void = (param:{ value: unknown })=>{this.onDraggingChanged(param)}
+    protected onObjectChangeEvent:()=>void                            = ()=>{this.onObjectChanged()}
+    protected onChangeEvent:()=>void                                  = ()=>{this.onChange()};
+    
+    protected onUpdateFunctions:(()=>void)[]            = [];
+    protected onDraggingFunctions:((event:any)=>void)[] = [];
+
+    constructor(controller:Controller)
+    {
+        super(controller);
+        this._control = new TransformControls(controller.camera, controller.viewPort.canvas)
+        this.control.getHelper().traverse((elem)=>{
+            elem.userData["rayIgnored"] = true
+        })
+        this.helperObject.name = "TransformHelperObject"
+    }
+
+    possess()
+    {
+        this.controller.world.scene?.add(this.helperObject);
+        this.control.attach(this.helperObject);
+        this.control.addEventListener('change', this.onChangeEvent);
+        this.control.addEventListener('dragging-changed', this.onDraggingChangedEvent);
+        this.control.addEventListener('objectChange', this.onObjectChangeEvent);
+    }
+
+    unpossess()
+    {
+        this.control.removeEventListener('change', this.onChangeEvent);
+        this.control.removeEventListener('dragging-changed', this.onDraggingChangedEvent);
+        this.control.removeEventListener('objectChange', this.onObjectChangeEvent);
+        this.control.detach();
+        this.controller.world.scene?.remove(this.helperObject);
+    }
+    
+    onChange()
+    {
+        this.controller.viewPort.markRenderStateDirty();
+    }
+
+    onDraggingChanged(event:{value:any})
+    {
+        if (this.primaryTarget)
+        {
+            let tMatrix = this.primaryTarget.getMatrixInWorld();
+            tMatrix.decompose(this.helperObject.position, this.helperObject.quaternion, this.helperObject.scale);
+        }
+        this.onDraggingFunctions.forEach((elem) =>
+        {
+            elem(event.value);
+        });
+    }
+
+    onObjectChanged()
+    {
+        if (this.primaryTarget)
+        {
+            //const TA1 = this.primaryTarget.getMatrixInWorld();
+            this.helperObject.updateMatrixWorld(true);
+            const TA2 = this.helperObject.matrixWorld.clone();
+
+            this.primaryTarget.onTransforming(TA2);
+
+            // const TA1Inverse      = TA1.clone().invert();
+            //const transformMatrix = new Matrix4().multiplyMatrices(TA2, TA1Inverse);
+            this.targets.forEach((tar) =>
+            {
+                if (tar !== this.primaryTarget)
+                {
+                    let t = this.targetMatrixMap.get(tar)
+                    if(t)
+                    {
+                        let TB2 = new Matrix4().multiplyMatrices(TA2, t); // B 
+                
+                        tar.onTransforming(TB2);
+                    }
+                }
+            });
+
+        }
+        this.onUpdateFunctions.forEach((elem) =>
+        {
+            elem();
+        });
+    }
+
+    set enable(newEnable:boolean)
+    {
+        this.control.enabled = newEnable;
+    }
+
+
+    setTarget(primaryTarget:ITransforming, multiTargets:ITransforming[], onUpdate:(()=>void) | null = null, onDragging:((bDragging:boolean)=>void) | null = null)
+    {
+        this.targetMatrixMap.clear();
+        let tMatrix = primaryTarget.getMatrixInWorld();
+        tMatrix.decompose(this.helperObject.position, this.helperObject.quaternion, this.helperObject.scale);
+        this.controller.world.scene?.add(this.control.getHelper());
+        // this.control.attach(this.helperObject);
+        this.primaryTarget = primaryTarget;
+        this.targets       = multiTargets;
+        this.targets.forEach((elem) =>
+        {
+            const tarMatrix = elem.getMatrixInWorld();
+            const TB_local  = tMatrix.clone().invert().multiply(tarMatrix);
+            this.targetMatrixMap.set(elem, TB_local);
+        });
+
+        if (onUpdate)
+        {
+            this.onUpdateFunctions.push(onUpdate);
+        }
+
+        if (onUpdate)
+        {
+            this.onUpdateFunctions.push(onUpdate);
+        }
+        if (onDragging)
+        {
+            this.onDraggingFunctions.push(onDragging);
+        }
+        this.isTickEnabled = true;
+    }
+
+    getMode():"translate" | "rotate" | "scale"
+    {
+        return this.control.getMode();
+    }
+
+    setMode(mode:"translate" | "rotate" | "scale"):void
+    {
+        this.control.setMode(mode);
+    }
+
+    setSpace(space:"world" | "local"):void
+    {
+        this.control.setSpace(space);
+    }
+
+    setAxis(axis:"X" | "Y" | "Z" | "E" | "XY" | "YZ" | "XZ" | "XYZ" | "XYZE" | null)
+    {
+        this.control.showX = axis ? axis?.includes("X") : false;
+        this.control.showY = axis ? axis?.includes("Y") : false;
+        this.control.showZ = axis ? axis?.includes("Z") : false;
+    }
+
+    setSize(size:number):void
+    {
+        this.control.setSize(size);
+    }
+
+    destroy()
+    {
+        this.isTickEnabled = false;
+        this.unpossess();
+        this.targetMatrixMap.clear();
+        this.targets             = [];
+        this.primaryTarget       = null;
+        this.onUpdateFunctions   = [];
+        this.onDraggingFunctions = [];
+        this._control?.dispose();
+        this._control = null;
+        super.destroy();
+    }
+}

package/lythreeFrame/src/PostProcess/Param/Bloom.ts

@@ -0,0 +1,12 @@
+export interface BloomParam
+{
+    threshold:number,
+    strength:number,
+    radius:number,
+}
+
+export const DefaultBloomParam:BloomParam = {
+    threshold:0,
+    strength :1,
+    radius   :0,
+};

package/lythreeFrame/src/PostProcess/Param/DOF.ts

@@ -0,0 +1,14 @@
+import {uniform} from "three/src/Three.TSL";
+
+export interface DOFParam
+{
+    focus:number,
+    aperture:number,
+    maxblur:number,
+}
+
+export const DefaultDOFParam:DOFParam = {
+    focus:  500.0 ,
+    aperture: 5 ,
+    maxblur:  0.01 
+};

package/lythreeFrame/src/PostProcess/Param/Denoise.ts

@@ -0,0 +1,14 @@
+export interface DenoiseParam
+{
+    denoiseRadius:number,
+    lumaPhi:number,
+    depthPhi:number,
+    normalPhi:number
+}
+
+export const DefaultDenoiseParam:DenoiseParam = {
+    denoiseRadius   :5,
+    lumaPhi         :5,
+    depthPhi        :5,
+    normalPhi       :5
+};

package/lythreeFrame/src/PostProcess/Param/GTAO.ts

@@ -0,0 +1,21 @@
+import { DefaultDenoiseParam, DenoiseParam } from './Denoise';
+export interface GTAOParam
+{
+    distanceExponent: number,
+    distanceFallOff : number,
+    radius          : number,
+    scale           : number,
+    thickness       : number,
+    denoised        : boolean,
+    denoiseParam    : DenoiseParam,
+}
+
+export const DefaultGTAOParam:GTAOParam = {
+    distanceExponent:1,
+    distanceFallOff :1,
+    radius          :0.25,
+    scale           :1,
+    thickness       :1,
+    denoised        :true,
+    denoiseParam    :DefaultDenoiseParam,
+};

package/lythreeFrame/src/PostProcess/Param/LensFlare.ts

@@ -0,0 +1,11 @@
+export interface LensFlareParam {
+    threshold             : number ;
+    ghostSpacing          : number ;
+    ghostAttenuationFactor: number ;
+}
+
+export const DefaultLensFlareParam: LensFlareParam = {
+    threshold             : 0.5,
+    ghostSpacing          : 25,
+    ghostAttenuationFactor: 0.25,
+};

package/lythreeFrame/src/PostProcess/Param/MotionBlur.ts

@@ -0,0 +1,8 @@
+export interface MotionBlurParam
+{
+    blurAmount: number;
+}
+
+export const DefaultMotionBlurParam: MotionBlurParam = {
+    blurAmount: 1,
+};