window.onload = main;
var ids;
var nbIds = 500;
var de;

function main() {
    ids = new Array();
    de = document.getElementById("list");
    var i;
    faker.locale = "fr";
    console.log(single_id);
    for (i = 0; i < nbIds; ++i) {
        var single_id = {
            firstname: faker.name.firstName(),
            lastname: faker.name.lastName(),
            city: faker.address.city(),
            job: faker.name.jobType()
        };
        ids.push(single_id);
    }
    displayIds();
}

function displayIds() {
    var table = "<table><tr><th onclick=\"sortLName()\">Nom</th><th onclick=\"sortFName()\">Prénom</th><th onclick=\"sortCity()\">Ville</th><th onclick=\"sortJob()\">Métier</th></tr>";
    for (i = 0; i < nbIds; ++i) {
        table += "<tr><td>";
        table += ids[i].lastname;
        table += "</td><td>";
        table += ids[i].firstname;
        table += "</td><td>";
        table += ids[i].city;
        table += "</td><td>";
        table += ids[i].job;
        table += "</td></tr>";
    }
    table += "</table>";
    de.innerHTML = table;
}

function sortLName() {
    ids.sort(function(a, b) {
        return compareString(a.lastname, b.lastname);
    });
    displayIds();
}

function sortFName() {
    ids.sort(function(a, b) {
        return compareString(a.firstname, b.firstname);
    });
    displayIds();
}

function sortCity() {
    ids.sort(function(a, b) {
        return compareString(a.city, b.city);
    });
    displayIds();
}

function sortJob() {
    ids.sort(function(a, b) {
        return compareString(a.job, b.job);
    });
    displayIds();
}

function compareString(a, b) {
    var x = a.toLowerCase();
    var y = b.toLowerCase();
    if (x < y) {
        return -1;
    }
    if (x > y) {
        return 1;
    }
    return 0;
}