TextArea

/***

    TextArea(id, class, text)

    (optional) id: str

    (optional) class : str

    (optional) text : str

***/

var id = $id ?? @id;
var class = $class;
var text = $text ?? '';

if(text != '') {
    <textarea id=(id) class=(class) ctor="
        var val = {{ text }};
        when($this.focus) {
            if($this.val() == val) {
                $this.css({ 'color': '#000000', 'font-style': 'normal' });
                $this.val('');
            }
            $this.css({ 'background-color': '#EEF1F8' });
        }
        when($this.blur) {
            if($this.val() == '') {
                $this.css({ 'color': '#778899', 'font-style': 'italic' });
                $this.val(val);
            }
            $this.css({ 'background-color': '#FFFFFF' });
        }
    ">
        text
    </textarea>
} else {
    <textarea id=(id) class=(class) ctor="
        var val = {{ text }};
        when($this.focus) $this.css({ 'background-color': '#EEF1F8' });
        when($this.blur) $this.css({ 'background-color': '#FFFFFF' });
    "/>
}