constructor()

in backup/polaris/polaris-gsi/src/PolarisGSI.ts [69:171]


	constructor(props: PolarisGSIProps) {
		const mergedProps = {
			...DefaultPolarisGSIProps,
			...props,
		}
		super(mergedProps)

		this.props = mergedProps

		this.view = {
			html: new HtmlView(),
			gsi: new GSIView(),
		}
		for (const key in this.view) {
			this.view[key].init(this)
		}

		/**
		 * init html / canvas
		 */
		const container = this.props.container as HTMLDivElement

		// render html view
		this.view.html.element
		this.view.html.element.style.position = 'relative'
		this.view.html.element.style.width = this.width + 'px'
		this.view.html.element.style.height = this.height + 'px'
		this.view.html.element.style.overflow = 'hidden'
		this.view.html.element.className = 'polaris-wrapper'
		container.appendChild(this.view.html.element)

		// pointer 事件
		this._initPointerEvents()

		// 相机控制事件
		if (this.props.cameraControl) {
			if (isTouchDevice) {
				this.cameraControl = new TouchControl({
					camera: this.cameraProxy,
					element: this.view.html.element as HTMLElement,
				})
			} else {
				this.cameraControl = new PointerControl({
					camera: this.cameraProxy,
					element: this.view.html.element as HTMLElement,
				})
			}
			this.cameraControl.scale = 1.0 / (this.ratio ?? 1.0)
		}

		/**
		 * Props listener
		 */

		// Renderer props update listener
		const rendererProps = [
			'background',
			'cameraNear',
			'cameraFar',
			'fov',
			'viewOffset',
			'lights',
			'postprocessing',
		] as const
		this.watchProps(rendererProps, (e) => {
			// const changedProps = e.props

			const newProps = {}
			for (let i = 0; i < rendererProps.length; i++) {
				const key = rendererProps[i]
				newProps[key] = this.getProp(key)
			}

			if (this.renderer) {
				this.cameraProxy.fov = newProps['fov']
				this.renderer.updateProps(newProps)
			}
		})

		// Responsive for container resize
		this.watchProps(['autoResize'], () => {
			const autoResize = this.getProp('autoResize')
			if (autoResize) {
				if (!this._resizeListener) {
					this._resizeListener = setInterval(() => {
						const width = container.clientWidth
						const height = container.clientHeight
						if (width !== this.width || height !== this.height) {
							this.resize(width, height, this.ratio)
							this.dispatchEvent({
								type: 'viewChange',
								cameraProxy: this.cameraProxy,
								polaris: this,
							})
						}
					}, 200)
				}
			} else if (this._resizeListener) {
				clearInterval(this._resizeListener)
				this._resizeListener = undefined
			}
		})
	}