import THREE from 'three';

// TextSprite
class TextSprite {
    // Creates a text sprite.
    constructor(options) {
        let textObject = new THREE.Object3D();
        let textHeight = 100;
        let textWidth = 0;
        let actualFontSize = options.size || 10;

        let canvas = document.createElement('canvas');
        let context = canvas.getContext('2d');
        context.font = 'normal ' + textHeight + 'px Arial';
        let metrics = context.measureText(options.text);
        textWidth = metrics.width;

        canvas.width = textWidth;
        canvas.height = textHeight;

        context.font = 'normal ' + textHeight + 'px Arial';
        context.textAlign = 'center';
        context.textBaseline = 'middle';
        context.fillStyle = options.color;
        context.fillText(options.text, textWidth / 2, textHeight / 2);

        let texture = new THREE.Texture(canvas);
        texture.needsUpdate = true;
        texture.minFilter = THREE.LinearFilter;

        let material = new THREE.SpriteMaterial({
            map: texture,
            useScreenCoordinates: false,
            transparent: true,
            opacity: 0.6
        });

        textObject.position.x = options.x;
        textObject.position.y = options.y;
        textObject.position.z = options.z;
        textObject.textHeight = actualFontSize;
        textObject.textWidth = (textWidth / textHeight) * textObject.textHeight;

        let sprite = new THREE.Sprite(material);
        sprite.scale.set(textWidth / textHeight * actualFontSize, actualFontSize, 1);

        textObject.add(sprite);

        return textObject;
    }
}

export default TextSprite;

@@ -65,30 +65,390 @@
  // 
-Creates a text sprite.
+@param %7Bobject%7D options The options object%0A    // @param %7Bnumber%7D %5Boptions.x%5D The point on the x-axis%0A    // @param %7Bnumber%7D %5Boptions.y%5D The point on the y-axis%0A    // @param %7Bnumber%7D %5Boptions.z%5D The point on the z-axis%0A    // @param %7Bstring%7D %5Boptions.text%5D The text string%0A    // @param %7Bnumber%7D %5Boptions.textHeight%5D The text height%0A    // @param %7Bstring%7D %5Boptions.color%5D The color
 %0A   
@@ -518,16 +518,16 @@
 ct3D();%0A
-
         
@@ -542,16 +542,38 @@
 Height =
+ options.textHeight %7C%7C
  100;%0A  
@@ -1588,16 +1588,21 @@
 ptions.x
+ %7C%7C 0
 ;%0A      
@@ -1636,16 +1636,21 @@
 ptions.y
+ %7C%7C 0
 ;%0A      
@@ -1684,16 +1684,21 @@
 ptions.z
+ %7C%7C 0
 ;%0A      

Update TextSprite.js