build cloud

2 files changed, 96 insertions, 0 deletions

diff --git a/site/assets/cloud/src/getOptimalFontSize.js b/site/assets/cloud/src/getOptimalFontSize.js
new file mode 100644
index 00000000..02787516
--- /dev/null
+++ b/site/assets/cloud/src/getOptimalFontSize.js
@@ -0,0 +1,18 @@
+import {Vector3} from 'three';
+
+let objectWorldPosition = new Vector3();
+let cameraWorldPosition = new Vector3();
+let objectWorldScale = new Vector3();
+
+export default function(object, renderer, camera) {
+	if (renderer.domElement.width && renderer.domElement.height && object.material.map.textLines.length) {
+		let distance = object.getWorldPosition(objectWorldPosition).distanceTo(camera.getWorldPosition(cameraWorldPosition));
+		if (distance) {
+			let heightInPixels = object.getWorldScale(objectWorldScale).y * renderer.domElement.height / distance;
+			if (heightInPixels) {
+				return Math.round(heightInPixels / object.material.map.imageHeight);
+			}
+		}
+	}
+	return 0;
+}
diff --git a/site/assets/cloud/src/index.js b/site/assets/cloud/src/index.js
new file mode 100644
index 00000000..270891d5
--- /dev/null
+++ b/site/assets/cloud/src/index.js
@@ -0,0 +1,78 @@
+import {
+	Math as THREE_Math,
+	Sprite,
+	SpriteMaterial,
+} from 'three';
+import TextTexture from 'three.texttexture';
+
+import getOptimalFontSize from './getOptimalFontSize';
+
+export default class extends Sprite {
+	constructor({
+		textSize = 1,
+		redrawInterval = 1,
+		minFontSize = 0,
+		maxFontSize = Infinity,
+		material = {},
+		texture = {},
+	} = {}) {
+		super(new SpriteMaterial({
+			...material,
+			map: new TextTexture(texture),
+		}));
+		this.textSize = textSize;
+		this.redrawInterval = redrawInterval;
+		this.minFontSize = minFontSize;
+		this.maxFontSize = maxFontSize;
+		this.lastRedraw = 0;
+	}
+
+	get isTextSprite() {
+		return true;
+	}
+
+	onBeforeRender(renderer, scene, camera) {
+		this.redraw(renderer, camera);
+	}
+
+	updateScale() {
+		this.scale
+			.set(this.material.map.imageAspect, 1, 1)
+			.multiplyScalar(this.textSize * this.material.map.imageHeight);
+	}
+
+	updateMatrix(...args) {
+		this.updateScale();
+		return super.updateMatrix(...args);
+	}
+
+	redraw(renderer, camera) {
+		if (this.lastRedraw + this.redrawInterval < Date.now()) {
+			if (this.redrawInterval) {
+				setTimeout(() => {
+					this.redrawNow(renderer, camera);
+				}, 1);
+			} else {
+				this.redrawNow(renderer, camera);
+			}
+		}
+	}
+
+	redrawNow(renderer, camera) {
+		this.updateScale();
+		this.material.map.autoRedraw = true;
+		this.material.map.fontSize = THREE_Math.clamp(
+			THREE_Math.ceilPowerOfTwo(
+				getOptimalFontSize(this, renderer, camera)
+			),
+			this.minFontSize,
+			this.maxFontSize,
+		);
+		this.lastRedraw = Date.now();
+	}
+
+	dispose() {
+		this.material.map.dispose();
+		this.material.dispose();
+	}
+}