JT-CIM-SDK/packages/Widgets/WallObject/WallMaterialProperty.js

class WallMaterialProperty {
	/**
	 * 构造方法
	 * @ignore 无需公开
	 * @param {Cesium.Viewer} viewer 着色器运行所需的视图
	 * @param {JSON} options 配置项
	 * @param {Cesium.Color} options.color [墙的颜色，默认蓝色] 可选
	 * @param {Number} options.duration [循环时间 默认1000] 可选
	 * @param {String} options.trailImage 墙的贴图
	 * @param {JSON} options.param 着色器参数
	 * @param {Number} options.param.count [数量 可选 默认为1]
	 * @param {String} options.param.direction [方向 可选 默认竖直 ] 取值vertical/horizontal
	 * @param {String} options.param.order [顺序 可选 上下/下上/顺时针/逆时针 与方向配合使用 ] 取值+/-
	 */
	constructor(viewer, options) {
		

		/* 着色器运行依赖的视图 */
		this._viewer = viewer;
		options = options || {};

		/* 变更事件 */
		this._definitionChanged = new Cesium.Event();
		this._color = undefined;
		/* 墙的颜色 */
		this.color = options.color || Cesium.Color.BLUE;
		/* 动态循环周期 */
		this.duration = options.duration || 1000;
		
		this.count = options.duration || 1;	
		this.direction = options.duration || 'vertical';
		this.order = options.duration || '-';
		
		
		
		/* 墙的贴图 */
		this.trailImage = Cesium.defaultValue(options.trailImage, 'jt3dSDK/imgs/wallmaterial/wl.png');
		/* 默认时间 */
		this._time = (new Date()).getTime();
		/* 材质类型名称 */
		this._materialTypeName = 'WallMaterial' + this._guid();
		/* 存储相关参数的属性 以便后期进行追踪修改 */
		this._param = {
			color: this.color._value.toCssColorString(),
			image: this.trailImage,
			duration: this.duration,
			count: this.count,
			direction: this.direction,
			order: this.order,
		}
		/* 将材质加入缓存 以便重复利用 */
		Cesium.Material._materialCache.addMaterial(this._materialTypeName, {
			fabric: {
				type: this._materialTypeName,
				uniforms: {
					time: -20,
					color: new Cesium.Color(1.0, 0.0, 0.0, 0.5),
					image: options.trailImage,
				},
				source: this._getDirectionWallShader(options.param)
			},
			translucent: function(material) {
				/* 材质是否半透明 */
				return true;
			}
		});
	}

	/**
	 * 生成GUID随机数
	 * @ignore 无需公开
	 */
	_guid() {
		function S4() {
			return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
		}
		return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
	}

	/**
	 * 重新获取类型方法
	 * @ignore 无需公开
	 * @param {Cesium.JulianDate} time 时间
	 */
	getType(time) {
		return this._materialTypeName;
	}

	/**
	 * 重写获取值方法
	 * @ignore 无需公开
	 * @param {Cesium.JulianDate} time
	 * @param {JSON} result 
	 */
	getValue(time, result) {
		if (!Cesium.defined(result)) {
			result = {};
		}
		result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.BLUE, result.color);
		result.image = this.trailImage;
		if (this.duration) {
			result.time = (((new Date()).getTime() - this._time) % this.duration) / this.duration;
		}
		this._viewer.scene.requestRender();
		return result;
	}

	/**
	 * 重写对比函数
	 * @ignore 无需公开
	 * @param {Object} other 传入对比对象
	 */
	equals(other) {
		return (this === other || (other instanceof WallMaterialProperty && Cesium.Property.equals(this
				._color, other._color) && other._param.order === this._param.order && other._param.count ===
			this._param.count && other._param.direction === this._param.direction && other.duration === this
			.duration));
	}

	/**
	 * 创建着色器资源
	 * @ignore 无需公开
	 * @param {JSON} options 配置项
	 * @param {Number} options.count [数量 可选 默认为1]
	 * @param {String} options.direction [方向 可选 默认竖直 ] 取值vertical/horizontal
	 * @param {String} options.order [顺序 可选 上下/下上/顺时针/逆时针 与方向配合使用 ] 取值+/-
	 */
	_getDirectionWallShader(options) {
		let op = Cesium.defaultValue(options, {});
		// console.log('>>>op===', op);
		let count = op.count !== undefined && typeof op.count === 'number' && op.count > 0 ? op.count : 1;
		let direction = op.direction === 'horizontal' ? 'horizontal' : 'vertical';
		let order = op.order === '+' ? '+' : '-';
		this._param.count = count;
		this._param.direction = direction;
		this._param.order = order;
		let materail = '';
		/* 补充参数 */
		// console.log('_param', this._param);
		materail += 'czm_material czm_getMaterial(czm_materialInput materialInput){\n' +
			'  czm_material material = czm_getDefaultMaterial(materialInput);\n' +
			'  vec2 st = materialInput.st;\n';
		if (direction === 'vertical') {
			materail += '  vec4 colorImage = texture2D(image,vec2(st.s,fract(float(' + count + ')*st.t ' + order + ' time)));\n';
		} else if (direction === 'horizontal') {
			materail += '  vec4 colorImage = texture2D(image, vec2(fract(float(' + count + ')*st.s ' + order + ' time), st.t));\n'
		}
		materail += '  vec4 fragColor;\n' +
			'  fragColor.rgb = color.rgb / 1.0;\n' +
			'  fragColor = czm_gammaCorrect(fragColor);\n' +
			'  material.alpha = colorImage.a * color.a;\n' +
			'  material.diffuse = color.rgb;\n' +
			'  material.emission = fragColor.rgb;\n' +
			'  return material;\n' +
			'}';
		return materail;
	}
}

/**
 * 增加默认属性
 */
Object.defineProperties(WallMaterialProperty.prototype, {
	/**
	 * @ignore 无需公开
	 * 判断是否相等，返回false表示属性一直在变化中
	 */
	isConstant: {
		get: function() {
			return false;
		}
	},
	/**
	 * @ignore 无需公开
	 * 事件变更
	 */
	definitionChanged: {
		get: function() {
			return this._definitionChanged;
		}
	},
	/* 颜色属性 */
	color: Cesium.createPropertyDescriptor('color')
})

export default WallMaterialProperty;