class CoachingApplicantView extends EICDomContent {

    DOMContentLoaded() {
        this.components = ui.eicfy(this.el);
        this.panels = this.findAll('.panel');

        this.workflow = new StateChart(this.find('[eicstatechart]'), {
            "orientation": "linear",
            "resizable": true,
            "allowDrag": true,
            "entity": {
                "width": 150,
                "height": 50,
                "gap": 30
            }
        });

        app.Assets.loadJson({name:'workflows/wf-coaching-applicant.json'})
        .then(this.setupWorflow.bind(this));

        let invTab = new Tab();
        invTab.addTabs(this.findAll('.invitations menu li'), this.findAll('.invitations .step'));
        let invList = new DataGrid(this.find('.invitations .coaches'), {
            headers: [
                {label: 'coach'},
                {label: 'email'},
                {label: 'status'},
                {label: ''},
            ]
        })

        invList.addRow(1, [ 'Michael Schweda','michael.schweda@ext.ec.europa.eu', '<span eicchip success>selected</span>', '' ])
        invList.addRow(1, [ 'Carmelo Infosino','(not provided)', '<span eicchip danger>declined</span>', '' ])

        this.workflow.click = this.onPanelSelect.bind(this);
    }

    setupWorflow(data) {
        this.workflow.data = data;
        this.showPanel('plan');
    }

    onPanelSelect(entity) { this.showPanel(entity.options.data.id) }

    showPanel(id) {
        for(let panel of this.panels) ui.hide(panel);
        ui.show(this.find('.panel.' + id))
    }
}

app.registerClass('CoachingApplicantView', CoachingApplicantView);