{% extends 'layout.html'%}

{%block content%}

<br>
<div class="row">
    <div class="col-md-6">
        <h1>Register WinHello Key</h1>
        <form id="register_winhello_form" class="row g-3">
            <div class="col-auto">
                <div class="input-group">
                    <label for="access_token_id" class="input-group-text">Access token id</label>
                    <input type="text" id="access_token_id" name="access_token_id" class="form-control" required>
                    <button class="btn btn-outline-primary" type="button" data-bs-toggle="modal" data-bs-target="#access_token_modal" onclick="$('#access_token_modal_table').DataTable().ajax.reload(null, false)">Select...</button>
                </div>
            </div>
            <div class="col-12">
                <button type="button" class="btn btn-primary" onclick="registerWinHello()">Register WinHello Key</button>
            </div>
        </form>
        <br>
        <h1>Generate PRT from WinHello</h1>
        <form id="winhello_to_prt_form" class="row g-3">
            <div class="col-auto">
                <div class="input-group">
                    <label for="winhello_id" class="input-group-text">WinHello ID</label>
                    <input type="text" id="winhello_id" name="winhello_id" class="form-control" required>
                    <button class="btn btn-outline-primary" type="button" data-bs-toggle="modal" data-bs-target="#winhello_modal" onclick="$('#winhello_modal_table').DataTable().ajax.reload(null, false)">Select...</button>
                </div>
            </div>
            <div class="col-xl-8">
                <div class="input-group">
                    <label for="device_id" class="input-group-text">Device ID</label>
                    <input type="text" id="device_id" name="device_id" class="form-control" placeholder="Leave empty to use device linked to WinHello key">
                    <button class="btn btn-outline-primary" type="button" data-bs-toggle="modal" data-bs-target="#device_modal" onclick="$('#device_modal_table').DataTable().ajax.reload(null, false)">Select...</button>
                </div>
            </div>
            <div class="col-xl-8">
                <div class="input-group">
                    <label for="winhello_username" class="input-group-text">Username</label>
                    <input type="text" id="winhello_username" name="winhello_username" class="form-control" placeholder="Leave empty to use username linked to WinHello key">
                </div>
            </div>
            <div class="col-12">
                <button type="button" class="btn btn-primary" onclick="generatePRTFromWinHelloForm()">Generate PRT</button>
            </div>
        </form>
    </div>
    <div class="col-md-6">
        <h1>Import WinHello Key</h1>
        <form id="import_winhello_form" class="row g-3">
            <div class="col-12">
                <div class="input-group">
                    <label for="import_private_key" class="input-group-text">Private Key (Base64 or PEM)</label>
                    <textarea id="import_private_key" class="form-control" rows="2"></textarea>
                    <input type="file" id="import_private_key_file" class="d-none" accept=".pem,.key">
                    <button class="btn btn-outline-secondary" type="button" onclick="$('#import_private_key_file').click()">
                        <i class="fi fi-rr-upload"></i>
                    </button>
                </div>
            </div>
            <div class="col-xl-8">
                <div class="input-group">
                    <label for="import_device_id" class="input-group-text">Device ID</label>
                    <input type="text" id="import_device_id" class="form-control" required>
                    <button class="btn btn-outline-primary" type="button" data-bs-toggle="modal" data-bs-target="#device_modal" onclick="$('#device_modal_table').DataTable().ajax.reload(null, false)">Select...</button>
                </div>
            </div>
            <div class="col-xl-6">
                <div class="input-group">
                    <label for="import_user" class="input-group-text">Username</label>
                    <input type="text" id="import_user" class="form-control" required placeholder="john.doe@e-corp.local">
                </div>
            </div>
            <div class="col-xl-6">
                <div class="input-group">
                    <label for="import_key_id" class="input-group-text">Key ID</label>
                    <input type="text" id="import_key_id" class="form-control" placeholder="00000000-0000-0000-0000-000000000000 (optional)">
                </div>
            </div>
            <div class="col-auto">
                <button type="button" class="btn btn-primary" onclick="importWinHelloKey()">Import Key</button>
            </div>
        </form>
    </div>
</div>

<script>
    getActiveAccessToken(document.getElementById("access_token_id"));
    loadDeviceModalTable();
    loadWinHelloModalTable();

    function registerWinHello() {
        $.ajax({
            url: '/api/register_winhello',
            type: 'POST',
            data: {
                access_token_id: $('#access_token_id').val()
            },
            success: function(response) {
                bootstrapToast("Register WinHello", response.message, "success");
                $('#winhello_keys').DataTable().ajax.reload(null, false);
            },
            error: function(xhr) {
                bootstrapToast("Register WinHello", xhr.responseJSON.message, "danger");
            }
        });
    }

function generatePRTFromWinHello(winhello_id, device_id = null, winhello_username = null) {
    let formData = {
        winhello_id: winhello_id
    };
    if (device_id) {
        formData.device_id = device_id;
    }
    if (winhello_username) {
        formData.winhello_username = winhello_username;
    }
    $.ajax({
        url: '/api/winhello_to_prt',
        type: 'POST',
        data: formData,
        success: function(response) {
            bootstrapToast("Generate PRT from WinHello", response.message, "success");
            $('#winhello_keys').DataTable().ajax.reload(null, false);
        },
        error: function(xhr) {
            bootstrapToast("Generate PRT from WinHello", xhr.responseJSON.message, "danger");
        }
    });
}

function generatePRTFromWinHelloForm() {
    let winhello_id = $('#winhello_id').val();
    let device_id = $('#device_id').val();
    let winhello_username = $('#winhello_username').val();
    generatePRTFromWinHello(winhello_id, device_id, winhello_username);
}

// Add file input handler for private key
document.getElementById('import_private_key_file').addEventListener('change', function(e) {
    const file = e.target.files[0];
    if (file) {
        const reader = new FileReader();
        reader.onload = function(e) {
            $('#import_private_key').val(e.target.result);
        };
        reader.readAsText(file);
    }
});

function importWinHelloKey() {
    let privateKey = $('#import_private_key').val();
    // Check if the private key is a base64 encoded PEM
    if (!privateKey.includes('-----BEGIN RSA PRIVATE KEY-----')) {
        try {
            let decoded = atob(privateKey);
            if (!decoded.includes('-----BEGIN RSA PRIVATE KEY-----')) {
                // This is likely a raw base64 private key string, wrap it in PEM headers
                privateKey = '-----BEGIN RSA PRIVATE KEY-----\n' + 
                            privateKey.match(/.{1,64}/g).join('\n') + 
                            '\n-----END RSA PRIVATE KEY-----';
            }
        } catch (e) {
            // If decoding fails, this is likely not a valid private key format
            bootstrapToast("Import WinHello Key", "Invalid private key format", "danger");
            return;
        }
    }
    // If it's a PEM but not base64 encoded, encode it
    if (privateKey.includes('-----BEGIN RSA PRIVATE KEY-----')) {
        privateKey = btoa(privateKey);
    }

    let formData = {
        private_key_pem_base64: privateKey,
        device_id: $('#import_device_id').val(),
        user: $('#import_user').val(),
        key_id: $('#import_key_id').val() || "Unknown"
    };

    $.ajax({
        url: '/api/import_winhello_key',
        type: 'POST',
        data: formData,
        success: function(response) {
            bootstrapToast("Import WinHello Key", response.message, "success");
            $('#winhello_keys').DataTable().ajax.reload(null, false);
        },
        error: function(xhr) {
            bootstrapToast("Import WinHello Key", xhr.responseJSON.message, "danger");
        }
    });
}
</script>

<br>
<div>
    <h1>WinHello Keys</h1>
    <table id="winhello_keys" class="table table-striped nowrap" style="table-layout: fixed; width:100%">
    </table>
</div>

<script type="text/javascript" class="init">
    // Populate the winhello_keys table
    let myTable = new DataTable('#winhello_keys', {
        ajax: {
            url: '/api/list_winhello_keys', dataSrc: "data"
        },
        columns: [
            {
                className: 'dt-control table-control',
                orderable: false,
                data: null,
                defaultContent: '',
                'width': '40px'
            },
            {
                className: 'copy-key-control table-control',
                orderable: false,
                data: null,
                defaultContent: '<i class="fi fi-rr-key" title="Copy Private Key to Clipboard" style="cursor: pointer"></i>',
                'width': '40px'
            },
            {
                className: 'generate-prt-control table-control',
                orderable: false,
                data: null,
                defaultContent: '<i class="fi fi-rr-laptop-refresh" title="Generate PRT from WinHello Key" style="cursor: pointer"></i>',
                'width': '40px'
            },
            {
                className: 'delete-control table-control',
                orderable: false,
                data: null,
                defaultContent: '<i class="fi fi-rr-trash" title="Delete WinHello Key" style="cursor: pointer"></i>',
                'width': '40px'
            },
            { data: 'id', title: 'ID', 'width': '60px' },
            { 
                data: 'stored_at', 
                title: 'Stored At', 
                'width': '170px',
                render: function(data) {
                    return new Date(data * 1000).toLocaleString();
                }
            },
            { data: 'user', title: 'User', 'width': '370px' },
            { data: 'device_id', title: 'Device ID', 'width': '370px' },
            { data: 'key_id', title: 'Key ID', 'width': 'auto' }
        ],
        order: [[4, 'desc']],
        colReorder: {
            columns: ':gt(3)'
        },
        processing: true
    });

    myTable.on('click', 'td.dt-control', function (e) {
        let tr = e.target.closest('tr');
        let row = myTable.row(tr);

        if (row.child.isShown()) {
            // This row is already open - close it
            row.child.hide();
        }
        else {
            // Open this row
            row.child(format(row.data())).show();
        }
    });

    myTable.on('click', 'td.copy-key-control', function (e) {
        let tr = e.target.closest('tr');
        let row = myTable.row(tr);
        copyToClipboard(row.data().priv_key);
    });

    myTable.on('click', 'td.generate-prt-control', function (e) {
        let tr = e.target.closest('tr');
        let row = myTable.row(tr);
        generatePRTFromWinHello(row.data().id);
    });

    myTable.on('click', 'td.delete-control', function (e) {
        let tr = e.target.closest('tr');
        let row = myTable.row(tr);
        if (!confirm(`Are you sure you want to delete the WinHello key with ID ${row.data().id}?`)) { return }
        deleteWinHelloKey(row.data().id);
        $('#winhello_keys').DataTable().ajax.reload(null, false);
    });

    function format(d) {
        var formatWrapper = $('<dl style="word-break: break-all; white-space: pre-wrap"></dl>');
        formatWrapper.append($('<dt>Private Key:</dt>'));
        formatWrapper.append($('<dd></dd>').append($('<code></code>').text(d.priv_key)));
        return formatWrapper;
    }

    function deleteWinHelloKey(id) {
        $.ajax({
            url: '/api/delete_winhello_key',
            type: 'POST',
            data: {
                id: id
            },
            success: function(response) {
                bootstrapToast("Delete WinHello Key", response.message, "success");
                $('#winhello_keys').DataTable().ajax.reload(null, false);
            },
            error: function(xhr) {
                bootstrapToast("Delete WinHello Key", xhr.responseJSON.message, "danger");
            }
        });
    }
</script>

{%endblock content%}