diff --git a/playground/src/components/LocalOrbitControls.vue b/playground/src/components/LocalOrbitControls.vue index 88a825b76..f09ee522f 100644 --- a/playground/src/components/LocalOrbitControls.vue +++ b/playground/src/components/LocalOrbitControls.vue @@ -8,224 +8,224 @@ import { useEventListener } from '@vueuse/core' export interface OrbitControlsProps { /** - * Whether to make this the default controls. - * - * @default false - * @type {boolean} - * @memberof OrbitControlsProps - */ + * Whether to make this the default controls. + * + * @default false + * @type {boolean} + * @memberof OrbitControlsProps + */ makeDefault?: boolean /** - * The camera to control. - * - * @type {Camera} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.camera - */ + * The camera to control. + * + * @type {Camera} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.camera + */ camera?: Camera /** - * The dom element to listen to. - * - * @type {HTMLElement} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.domElement - */ + * The dom element to listen to. + * + * @type {HTMLElement} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.domElement + */ domElement?: HTMLElement /** - * The target to orbit around. - * - * @type {TresVector3} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.target - */ + * The target to orbit around. + * + * @type {TresVector3} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.target + */ target?: TresVector3 /** - * Whether to enable damping (inertia) - * - * @default false - * @type {boolean} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enableDamping - */ + * Whether to enable damping (inertia) + * + * @default false + * @type {boolean} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enableDamping + */ enableDamping?: boolean /** - * The damping inertia used if `.enableDamping` is set to true - * - * @default 0.05 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.dampingFactor - */ + * The damping inertia used if `.enableDamping` is set to true + * + * @default 0.05 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.dampingFactor + */ dampingFactor?: number /** - * Set to true to automatically rotate around the target. - * - * @default false - * @type {boolean} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.autoRotate - */ + * Set to true to automatically rotate around the target. + * + * @default false + * @type {boolean} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.autoRotate + */ autoRotate?: boolean /** - * How fast to rotate around the target if `.autoRotate` is true. - * - * @default 2 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.autoRotateSpeed - */ + * How fast to rotate around the target if `.autoRotate` is true. + * + * @default 2 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.autoRotateSpeed + */ autoRotateSpeed?: number /** - * Whether to enable panning. - * - * @default true - * @type {boolean} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enablePan - */ + * Whether to enable panning. + * + * @default true + * @type {boolean} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enablePan + */ enablePan?: boolean /** - * How fast to pan the camera when the keyboard is used. Default is 7.0 pixels per keypress. - * - * @default 7.0 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.keyPanSpeed - */ + * How fast to pan the camera when the keyboard is used. Default is 7.0 pixels per keypress. + * + * @default 7.0 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.keyPanSpeed + */ keyPanSpeed?: number /** - * This object contains references to the keycodes for controlling camera panning. - * Default is the 4 arrow keys. - * - * @default `{ LEFT: 'ArrowLeft', UP: 'ArrowUp', RIGHT: 'ArrowRight', BOTTOM: 'ArrowDown' }` - * @type Record - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.keys - */ + * This object contains references to the keycodes for controlling camera panning. + * Default is the 4 arrow keys. + * + * @default `{ LEFT: 'ArrowLeft', UP: 'ArrowUp', RIGHT: 'ArrowRight', BOTTOM: 'ArrowDown' }` + * @type Record + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.keys + */ keys?: Record /** - * How far you can orbit horizontally, upper limit. - * If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], - * with ( max - min < 2 PI ). Default is Infinity. - * - * @default Infinity - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxAzimuthAngle - */ + * How far you can orbit horizontally, upper limit. + * If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], + * with ( max - min < 2 PI ). Default is Infinity. + * + * @default Infinity + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxAzimuthAngle + */ maxAzimuthAngle?: number /** - * How far you can orbit horizontally, lower limit. - * If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], - * with ( max - min < 2 PI ). - * Default is - Infinity. - * - * @default -Infinity - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minAzimuthAngle - */ + * How far you can orbit horizontally, lower limit. + * If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], + * with ( max - min < 2 PI ). + * Default is - Infinity. + * + * @default -Infinity + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minAzimuthAngle + */ minAzimuthAngle?: number /** - * How far you can orbit vertically, upper limit. - * Range is 0 to Math.PI radians, and default is Math.PI. - * - * @default Math.PI - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxPolarAngle - */ + * How far you can orbit vertically, upper limit. + * Range is 0 to Math.PI radians, and default is Math.PI. + * + * @default Math.PI + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxPolarAngle + */ maxPolarAngle?: number /** - * How far you can orbit vertically, lower limit. - * Range is 0 to Math.PI radians, and default is 0. - * - * @default 0 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minPolarAngle - */ + * How far you can orbit vertically, lower limit. + * Range is 0 to Math.PI radians, and default is 0. + * + * @default 0 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minPolarAngle + */ minPolarAngle?: number /** - * The minimum distance of the camera to the target. - * Default is 0. - * - * @default 0 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minDistance - */ + * The minimum distance of the camera to the target. + * Default is 0. + * + * @default 0 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minDistance + */ minDistance?: number /** - * The maximum distance of the camera to the target. - * Default is Infinity. - * - * @default Infinity - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxDistance - */ + * The maximum distance of the camera to the target. + * Default is Infinity. + * + * @default Infinity + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxDistance + */ maxDistance?: number /** - * The minimum field of view angle, in radians. - * Default is 0. - * - * @default 0 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minZoom - */ + * The minimum field of view angle, in radians. + * Default is 0. + * + * @default 0 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.minZoom + */ minZoom?: number /** - * The maximum field of view angle, in radians. - * ( OrthographicCamera only ). - * Default is Infinity. - * - * @default Infinity - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxZoom - */ + * The maximum field of view angle, in radians. + * ( OrthographicCamera only ). + * Default is Infinity. + * + * @default Infinity + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/index.html?q=orbi#examples/en/controls/OrbitControls.maxZoom + */ maxZoom?: number touches?: { ONE?: number TWO?: number } /** - * Whether to enable zooming. - * - * @default true - * @type {boolean} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enableZoom - */ + * Whether to enable zooming. + * + * @default true + * @type {boolean} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enableZoom + */ enableZoom?: boolean /** - * How fast to zoom in and out. Default is 1. - * - * @default 1 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.zoomSpeed - */ + * How fast to zoom in and out. Default is 1. + * + * @default 1 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.zoomSpeed + */ zoomSpeed?: number /** - * Whether to enable rotating. - * - * @default true - * @type {boolean} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enableRotate - */ + * Whether to enable rotating. + * + * @default true + * @type {boolean} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.enableRotate + */ enableRotate?: boolean /** - * How fast to rotate around the target. Default is 1. - * - * @default 1 - * @type {number} - * @memberof OrbitControlsProps - * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.rotateSpeed - */ + * How fast to rotate around the target. Default is 1. + * + * @default 1 + * @type {number} + * @memberof OrbitControlsProps + * @see https://threejs.org/docs/#examples/en/controls/OrbitControls.rotateSpeed + */ rotateSpeed?: number } @@ -262,9 +262,15 @@ const controls = ref(null) extend({ OrbitControls }) function addEventListeners() { - useEventListener(controls.value as any, 'change', () => emit('change', controls.value)) - useEventListener(controls.value as any, 'start', () => emit('start', controls.value)) - useEventListener(controls.value as any, 'end', () => emit('end', controls.value)) + useEventListener(controls.value as any, 'change', () => + emit('change', controls.value), + ) + useEventListener(controls.value as any, 'start', () => + emit('start', controls.value), + ) + useEventListener(controls.value as any, 'end', () => + emit('end', controls.value), + ) } const { onLoop } = useRenderLoop() @@ -284,11 +290,6 @@ onUnmounted(() => { controls.value.dispose() } }) - -watchEffect(() => { - console.log('activeCamera', activeCamera.value) - console.log('renderer', renderer.value) -})