class Intro
{
    constructor( ui , map )
    {
        this.ui = ui;
        this.map = map;
        this.lbl_bg = this.ui.add( new Sparrow.UI.Label( "" , { position: "center" , verticalPosition: "center" , width: 620 , height: 290 , background: "background" , backgroundColor: "#d6e6ff" , borderWidth: 5 , borderColor: "#003844" } ) );
        this.lbl_bg.addChild( new Sparrow.UI.Label( "Crystal Courier" , { position: "center" , y: 10 , width: 500 , height: 40 , textAlign: "center" , font: "monospace" , textSize: 40 } ) );

        this.lbl_bg.addChild( new Sparrow.UI.Label( "- Collect crystals and deliver them to the base." , { position: "center" , width: 600 , y: 70 , font: "monospace" } ) );
        this.lbl_bg.addChild( new Sparrow.UI.Label( "- Purchase upgrades to increase efficiency." , { position: "center" , width: 600 , y: 110 , font: "monospace" } ) );
        this.lbl_bg.addChild( new Sparrow.UI.Label( "- Launch a rocket and escape before the asteroid hits." , { position: "center" , width: 600 , y: 150 , font: "monospace" } ) );
        this.lbl_bg.addChild( new Sparrow.UI.Label( "- WASD, 🡹🡸🡻🡺: Drive | SPACE: Brake | R: Restart" , { position: "center" , width: 600 , y: 190 , font: "monospace" } ) );

        this.btn_close = this.lbl_bg.addChild( new Sparrow.UI.Button( "PLAY" , { position: "center" , width: 200 , y: 240 , font: "monospace" } ) );
        this.btn_close.onclick = () => {
            this.map.start();
            this.lbl_bg.b_visible = false;
        };

        this.lbl_bg.b_visible = true;
    }

    show()
    {
        this.lbl_bg.b_visible = true;
    }

    hide()
    {
        this.lbl_bg.b_visible = false;
    }
}