export class Measurer {
    private ctx: CanvasRenderingContext2D = null;
    private static _instance: Measurer = new Measurer();
    
    public static get instance(): Measurer {
        return Measurer._instance;
    }
    
    private constructor(){}

    private getFont(element) {
        var prop = ["font-style", "font-variant", "font-weight", "font-size", "font-family"];
        var font = "";
        for (var x in prop)
            font += window.getComputedStyle(element, null).getPropertyValue(prop[x]) + " ";
        return font;
    }

    
     
    private getCtx(input){
        if (this.ctx) return this.ctx;
        let c = document.createElement("canvas");
        this.ctx = c.getContext("2d");
        this.ctx.font = this.getFont(input);
        return this.ctx;
    }
    
    measureInputText(input,cursorPos) {
        let val = input.value.substr(0,cursorPos);
        let txtWidth = this.getCtx(input).measureText(val).width;
        return txtWidth;
    }

}