async function geturl(url){
    return new Promise((resolve, reject) =>{
        $.ajax({
            method: 'get',
            url: url,
            processData: true,
            dataType: 'json',
            success: function(data){
                resolve(data);
                return;
            },
            error: function(err){
                console.log(JSON.stringify(err));
                console.log(err.toString());
                reject(err);
            }
        });
    });
}
async function posturl(url, body){
    return new Promise((resolve, reject) =>{
        $.ajax({
            method: 'post',
            url: url,
            processData: true,
            data: JSON.stringify(body),
            dataType: 'json',
            success: function(data){
                resolve(data);
                return;
            },
            error: function(err){
                console.log(JSON.stringify(err));
                console.log(err.toString());
                reject(err);
            }
        });
    });
}

var settings = null;
async function pageload(){
    // Get status
    settings = await geturl('/settings');
    console.log('settings: ' + JSON.stringify(settings));
    setInterval(fetchState,60000);
    await fetchProducts();
    await fetchState();
}
async function fetchState(){
    var token = await geturl('/token');
    $('#access_token').text(token.access_token);
    $('#token_created').text(token.created);
    $('#token_expires').text(token.expires);
    if ( settings && settings.energy_sites){
        for(var s in settings.energy_sites){
            if ( settings.energy_sites[s].live){
                var status = await geturl('/live_status/' + s);
                var body = '';
                for(var k in status){
                    body += '<tr><td>' + k + '</td><td>' + JSON.stringify(status[k]) + '</td></tr>';
                    if ( s === settings.active_site && k === 'percentage_charged'){
                        $('#soc').text(Math.round(status[k]*10)/10);
                    }
                }
                $('#' + s + '_live').html(body);
            }
        }
    }
    await fetchOperational();
}
async function fetchOperational(){
    var operational = await geturl('/operational');
    console.log('Operational: ' + JSON.stringify(operational));
    $('#backup_reserve').val(operational.backup_reserve);
}
function isObject(obj) {
    return obj === Object(obj);
}
function showtable(id){
    var display = $('#' + id).css('display');
    if ( display === 'none'){
        $('#' + id).css({display:'block'});
        $('#' + id + '_btn').text('-');
    } else {
        $('#' + id).css({display:'none'});
        $('#' + id + '_btn').text('+');
    }
}
async function set_backup(){
    console.log('set_backup');
    var v = $('#backup_reserve').val();
    console.log('New backup reserve ' + v);
    var body = {
        energy_site_id: parseInt(settings.active_site),
        backup_reserve_percent: parseFloat(v)
    };
    await posturl('/backup',body);
    await fetchProducts();
}
async function fetchProducts(){
    var products = await geturl('/products');
    var body = '<tr><th>Energy Site ID</th><th>Type</th><th>Site Name</th><th>ID</th><th>gateway</th><th>asset_site_id</th></tr>';
    for(var product of products){
        body += '<tr>';
        body += '<td>' + product.energy_site_id + '</td>';
        body += '<td>' + product.resource_type + (product.resource_type === 'battery' ? ' ' + product.battery_type : '') + '</td>';
        body += '<td>' + product.site_name + '</td>';
        body += '<td>' + product.id + '</td>';
        body += '<td>' + product.gateway_id + '</td>';
        body += '<td>' + product.asset_site_id + '</td>';
        body += '<td>';
//        body += JSON.stringify(product);
        body += '</td>';
        // id
        
        body += '</tr>';
        if ( settings && settings.energy_sites){
            console.log('settings.energy_sites: ' + JSON.stringify(settings.energy_sites));
            if ( settings.energy_sites[product.energy_site_id].live){
                body += '<tr><td>Live settings</td>';
                body += '<td colspan="5" >';
                id = product.energy_site_id + '_live';
                body += '<table id="' + id + '" >';
                body += '</table>'
                body += '</td>';
                body += '</td></tr>'
                body += '<tr>';
                body += '<td>Site info</td>';
                body += '<td colspan="5">';
                body += '<table>';
                var site_info = await geturl('/energy_site_info/' + product.energy_site_id);
                //body += '<td>';
                //body += JSON.stringify(status);
                //body += '</td>';
                for( var key in site_info){
                    body += '<tr>';
                    body += '<td>' + key + '</td><td>';
                    if ( isObject(site_info[key])){
                        var id = product.energy_site_id + '_' + key;
                        body += '<button id="' + id + '_btn" onclick="showtable(\'' + id + '\');">+</button>';
                        body += '<table id="' + id + '" style="display:none;" >';
                        var item = site_info[key];
                        for(var k in item){
                            body += '<tr><td>' + k + '</td><td>';
                            body += JSON.stringify(item[k]);
                            body += '</td></tr>';
                        }
                        body += '</table>';
                    } else {
                        body += JSON.stringify(site_info[key]);
                    }
                    body += '</td>';
                    body += '</tr>';
                }
                //console.log('product.energy_site_id: ' + product.energy_site_id);
                //console.log('settings.active_site: ' + settings.active_site);
                if ( product.energy_site_id == settings.active_site){
                    //console.log('Setting backup reserve to ' + site_info['backup_reserve_percent']);
                    $('#backup_reserve').val(site_info['backup_reserve_percent']);                    
                }
                body += '</table>';
                body += '</td>';
                body += '</tr>';
            }
        }
        body += '</tr>';
    }
    $('#products').html(body);
}