package;
import flash.display.Sprite;
import openfl.events.Event;

/**
 * ...
 * @author Mateusz Narolewski
 */
class HTMLInputField extends Sprite
{
    public var input(default, null):Dynamic;
    public var style(default, null):Dynamic;
    private var div:Dynamic;
    private var canvas:Dynamic;
    public var inputWidth(default, default):Float = 150;
    public var inputHeight(default, default):Float = 30;
    public var textSize(default, default):Float = 20;
    public var text(get_text, set_text):String;
    public var textColor(default, set_textColor):UInt;
    public var outline(default, set_outline):Bool;
    public var maxChars(default, set_maxChars):UInt;

    public static inline var ALIGN_LEFT = "left";
    public static inline var ALIGN_RIGHT = "right";
    public static inline var ALIGN_CENTER = "center";

    public function new(divId:String = "openfl-content")
    {
        super();

        input = untyped document.createElement("input");
        input.type = "text";
        style = input.style;
        style.position = "absolute";
        div = untyped document.body;
        canvas = div.querySelector('canvas');
        div.appendChild(input);

        textColor = 0x000000;

        this.addEventListener(Event.ENTER_FRAME, onEnterFrame);
        this.addEventListener(Event.REMOVED_FROM_STAGE, removed);
    }

    private function removed(e:Event):Void
    {
        removeEventListener(Event.REMOVED_FROM_STAGE, removed);
        removeEventListener(Event.ENTER_FRAME, onEnterFrame);
        div.removeChild(input);
    }
    private function onEnterFrame(e:Event):Void
    {
        var scale:Float = Std.parseFloat(canvas.style.width) / stage.stageWidth;
        style.left = (this.x * scale) + Std.parseFloat(canvas.style.marginLeft) + 'px';
        style.top =  (this.y * scale) + Std.parseFloat(canvas.style.marginTop) + 'px';
        style.width = (inputWidth * scale) + "px";
        style.height = (inputHeight * scale) + "px";
        style.fontSize = (textSize * scale) + "px";
    }

    public function setAlign(align:String):Void
    {
        style.textAlign = align;
    }
    public function get_text():String
    {
        return cast input.value;
    }
    public function set_text(txt:String):String
    {
        input.value = txt;
        return txt;
    }
    public function set_maxChars(chars:UInt):UInt
    {
        input.maxLength = chars;
        return chars;
    }
    public function set_textColor(color:UInt):UInt
    {
        style.color = "#" + StringTools.hex(color);
        return color;
    }
    public function set_outline(b:Bool):Bool
    {
        style.outline = b ? "solid" : "none";
        return b;
    }
}