import haxe.ui.containers.Box;
import haxe.ui.events.MouseEvent;
import haxe.ui.events.UIEvent;
import openfl.geom.ColorTransform;

@:xml("
    <vbox style='padding: 10px; border: 2px solid black; background-color: white; border-radius: 5px;'>
        <hbox>
            <label text='Current bunny count:' />
            <label id='currentBunnyCountLabel' />
        </hbox>
        <hbox>
            <textfield id='bunniesToAddField' text='100' />
            <button id='addButton' text='Add Bunnies!' repeater='true' />
        </hbox>
        <grid columns='3'>
            <label text='Rotation' />
            <slider id='rotationSlider' max='360' precision='0' />
            <label text='${rotationSlider.pos}' />

            <label text='Red' />
            <slider id='redSlider' max='1' pos='1' precision='1' />
            <label text='${redSlider.pos}' />

            <label text='Green' />
            <slider id='greenSlider' max='1' pos='1' precision='1' />
            <label text='${greenSlider.pos}' />

            <label text='Blue' />
            <slider id='blueSlider' max='1' pos='1' precision='1' />
            <label text='${blueSlider.pos}' />
        </grid>
    </vbox>
")
class Panel extends Box {
    @:bind(currentBunnyCountLabel)      public var currentBunnyCount:String = "0";
    @:bind(bunniesToAddField)           public var bunniesToAdd:String;

    public function new() {
        super();
        currentBunnyCount = Std.string(Main.instance.bunnies.length);
    }

    @:bind(addButton, MouseEvent.MOUSE_DOWN)
    function onAddMouseDown(e) {
        Main.instance.addingBunnies = true;
        currentBunnyCount = Std.string(Main.instance.bunnies.length);
    }

    @:bind(addButton, MouseEvent.MOUSE_UP)
    function onAddMouseUp(e) {
        Main.instance.addingBunnies = false;
        currentBunnyCount = Std.string(Main.instance.bunnies.length);
    }


    @:bind(rotationSlider, UIEvent.CHANGE)
    function onRotationChange(e) {
        for (bunny in Main.instance.bunnies) {
            bunny.rotation = rotationSlider.pos;
        }
    }

    @:bind(redSlider, UIEvent.CHANGE, updateColor)
    function onRedChange(e) {
        updateColor();
    }

    @:bind(greenSlider, UIEvent.CHANGE, updateColor)
    function onGreenChange(e) {
        updateColor();
    }

    @:bind(blueSlider, UIEvent.CHANGE, updateColor)
    function onBlueChange(e) {
        updateColor();
    }

    function updateColor() {
        for (bunny in Main.instance.bunnies) {
            if (bunny.colorTransform == null) {
                bunny.colorTransform = new ColorTransform(redSlider.pos, greenSlider.pos, blueSlider.pos);
            } else {
                bunny.colorTransform.redMultiplier = redSlider.pos;
                bunny.colorTransform.greenMultiplier = greenSlider.pos;
                bunny.colorTransform.blueMultiplier = blueSlider.pos;
            }
        }
    }
}