import * as vscode from 'vscode';

export class TextDocumentContentProvider implements vscode.TextDocumentContentProvider {
    private _onDidChange = new vscode.EventEmitter<vscode.Uri>();
    private _data = null;

    public provideTextDocumentContent(uri: vscode.Uri): string {
        if (!this._data) return this.errorSnippet();
        if (this._data['rows'].length == 0) return this.errorSnippet();

        const configuration = vscode.workspace.getConfiguration('frog')
        const additionalStyles = configuration.get("resultSetStyles", "")
        
        let styles = `<style>
                    table {
                        border-collapse: collapse;
                    }
                    table td, table th {
                        padding: 2px;
                        font-size: 11px;
                        white-space: nowrap;
                    }
                    tr:hover {
                        background-color: #aaaa66;
                    }
                    #limitBox a {
                        padding: 3px;
                    }

                    .vscode-dark table {
                        border: solid 1px white;
                    }
                    .vscode-dark table td, .vscode-dark table th {
                        border: solid 1px white;
                    }
                    .vscode-dark #limitBox a {
                        color: white;
                    }
                    .vscode-dark table td.value-null {
                        background-color: #666600;
                    }

                    .vscode-light table {
                        border: solid 1px black;
                    }
                    .vscode-light table td, .vscode-light table th {
                        border: solid 1px black;
                    }
                    .vscode-light #limitBox a {
                        color: black;
                    }
                    .vscode-light table td.value-null {
                        background-color: #cccc33;
                    }

                    ${additionalStyles}
                </style>`

        const choosableLimits = [2,10,50]
        let limitBox = '<div id="limitBox"><p>Limit Results: '
            + choosableLimits.map((limit) =>
            `<a href="${encodeURI('command:frog.setRowLimit?{"rowLimit": ' + limit + '}')}">${limit}</a>`).join('') + '</p></div>'

        let text = `<body>${styles}${limitBox}<table><tr>`
        text += this._data['columnDefinitions'].map((x) => `<th>${x['name']}</th>`).join('')
        text += '</tr>'
        text += this._data['rows'].map((r) => 
            '<tr>' + r['columns'].map((c) => '<td class="' + (c['value'] == null ? 'value-null' : 'value-value') + '">' + (c['value'] == null ? 'NULL' : c['value']) + '</td>').join('') + '</tr>'
        ).join('')
        text += '</table></body>'
        return text;
    }

    get onDidChange(): vscode.Event<vscode.Uri> {
        return this._onDidChange.event;
    }

    public update(uri: vscode.Uri) {
        this._onDidChange.fire(uri);
    }

    public setData(data) {
        this._data = data;
    }

    private errorSnippet(): string {
        return `
            <body>
                <table>
                    <tr>
                        <td>No results found!</td>
                    </tr>
                </table>
            </body>`;
    }
}