class Description extends ManageLang {
    constructor(father) {
        super('Description', father);
    }

    create() {
        super.create();
        let x = WIDTH_WINDOW / 2;
        let y = HEIGHT_WINDOW - 100;
        let returnBtn = this.add.image(x, y, 'cancel').setOrigin(0.5, 0.5).setInteractive();
        returnBtn.on('pointerover', () => returnBtn.setFrame(1));
        returnBtn.on('pointerout', () => returnBtn.setFrame(0));
        returnBtn.on('pointerdown', () => this.return());
        returnBtn.displayHeight = HEIGHT_WINDOW / 10;
        returnBtn.scaleX = returnBtn.scaleY;

        let width = WIDTH_WINDOW / 3 - 20;
        let height = HEIGHT_WINDOW / 4 * 3;
        x = 0;
        y = 0;
        this.createCategoryBonus(x, 0, width, height);
        this.createBonusDescription(x, 0, width, height / 3, 'bonusShield0', 'BOUCLIER BRONZE', 'BONUS : +75  -  TIME : 15');
        this.createBonusDescription(x, height / 3, width, height / 3, 'bonusShield1', 'BOUCLIER ARGENT', 'BONUS : +125  -  TIME : 10');
        this.createBonusDescription(x, height / 1.5, width, height / 3, 'bonusShield2', 'BOUCLIER OR', 'BONUS : +200  -  TIME : 5');
        x = WIDTH_WINDOW / 3;
        this.createCategoryBonus(x, 0, width, height);
        this.createBonusDescription(x, 0, width, height / 3, 'bonusSpeed0', 'VITESSE BRONZE', 'BONUS : x2  - TIME : 8');
        this.createBonusDescription(x, height / 3, width, height / 3, 'bonusSpeed1', 'VITESSE ARGENT', 'BONUS : x3  -  TIME : 4');
        this.createBonusDescription(x, height / 1.5, width, height / 3, 'bonusSpeed2', 'VITESSE OR', 'BONUS : x4  -  TIME : 2');
        x = WIDTH_WINDOW / 1.5;
        this.createCategoryBonus(x, 0, width, height);
        this.createBonusDescription(x, 0, width, height / 3, 'bonusAttack0', 'ATTAQUE BRONZE', 'BONUS : x2');
        this.createBonusDescription(x, height / 3, width, height / 3, 'bonusAttack1', 'ATTAQUE ARGENT', 'BONUS : x3');
        this.createBonusDescription(x, height / 1.5, width, height / 3, 'bonusAttack2', 'ATTAQUE OR', 'BONUS : x4');

    }

    createCategoryBonus(x, y, width, height) {
        x += 10;
        y += 10;
        this.add.rectangle(x, y, width, height, 0x868686).setOrigin(0, 0);
    }

    createBonusDescription(x, y, width, height, texture, name, text) {
        x += 20;
        y += 20;
        width -= 20;
        height -= 20;
        this.add.rectangle(x, y, width, height, 0xFFFFFF).setOrigin(0, 0);
        let image = this.add.image(x, y, texture).setOrigin(0, 0);
        image.displayHeight = 100;
        image.scaleX = image.scaleY;
        let style = {font: (image.displayHeight / 2 - name.length) + 'px stencil', fill: "#000000"};
        this.add.text(x + image.displayWidth + 10, y + image.displayHeight / 2, name.toString(), style).setOrigin(0, 0.5);
        style.font = (height / 6) + 'px stencil';
        this.add.text(x, y + image.displayHeight + (height - image.displayHeight) / 2, text.toString(), style).setOrigin(0, 0.5);
    }

    return() {
        this.father.scene.start('Game');
        this.father.scene.remove('Description');
    }
}