import { Object3D } from './Object3D';
import { Utils } from '../main';

// #endregion

/**
 * @class
 * HTML 标记
 * </br>The html marker object.
 * @memberof THING
 * @extends THING.Object3D
 * @public
 * @example
 * let htmlMarker = new THING.HTMLMarker({
 *	renderType: "Sprite", //"Plane",
 *	element: document.getElementById("containerId"),
 *	pivot: [0.5, 0, 0.5],
 *	offset: [0, 0, 0]
 * })
 */
class HTMLMarker extends Object3D {

	/**
	 * @constructor
	 * @public
	 */
	constructor(param = {}) {
		super(Utils.cloneObject(param));

		if (param.element) {
			this.css3d.domElement = param.element;
			if (param.pickable !== undefined) {
				this.pickable = param.pickable;
			}
		}
	}

	onSetupComponent(param) {
		super.onSetupComponent(param);
		this.addComponent(Utils.createObject('CSS3DComponent', { delegate: this.app.delegate }), "css3d");

		let { renderType, offset = [0, 0, 0], pivot = [0.5, 0.5] } = param;
		this.css3d.renderType = renderType;
		this.css3d.offset = offset;
		this.css3d.pivot = pivot;

		const enableEventProxy = Utils.parseBoolean(param['enableEventProxy'], true);
		this.css3d.enableEventProxy = enableEventProxy;
	}

	setPickable(value, recursive = false) {
		super.setPickable(value, recursive);
		this.pickable = value;
	}

	// #region Accessor

	/**
	 * 设置/获取 渲染类型(支持精灵模式和平面模式)
	 * @type {THING.RenderType}
	 * @default THING.RenderType.Sprite
	 * @public
	 */
	get renderType() {
		return this.css3d.renderType;
	}
	set renderType(value) {
		if (this._renderType == value) {
			return;
		}

		this.css3d.renderType = value;

		this._renderType = value;
	}

	/**
	 * 设置/获取 DOM 元素
	 * @type {object}
	 * @public
	 */
	get element() {
		if (this._element !== undefined) {
			return this._element;
		}
	}
	set element(value) {
		if (this._element == value) {
			return;
		}

		this.css3d.domElement = value;

		this._element = value;
	}

	/**
	 * 设置/获取 锚点
	 * @type {Array}
	 * @public
	 */
	get pivot() {
		return this.css3d.pivot;
	}
	set pivot(value) {
		this.css3d.pivot = value;
	}

	/**
	 * 设置/获取 偏移
	 * @type {Array}
	 * @public
	 */
	get offset() {
		return this.css3d.offset;
	}
	set offset(value) {
		this.css3d.offset = value;
	}

	/**
	 * 设置/获取 是否可拾取
	 * @type {boolean}
	 * @public
	 */
	get pickable() {
		return this.css3d.interactive;
	}
	set pickable(value) {
		this.css3d.interactive = value;
	}

	/**
	 * 获取 zIndex
	 * @type {number}
	 * @default null
	 * @public
	 */
	get zIndex() {
		return this.css3d.zIndex;
	}
	// #endregion

	get isHTMLMarker() {
		return true;
	}

}

export { HTMLMarker }