ChromoSelector - jQuery Color Picker plugin - Documentation / API / The API object

The API object

The purpose of the API object is to shorten the code when accessing the ChromoSelector API.

Example of basic API usage:

$(document).ready(function () {
    // Instanciate the color picker
    $("#myColorInput").chromoselector();
    // Show it
    $("#myColorInput").chromoselector("show");
    // Change color
    $("#myColorInput").chromoselector("setColor", "#123456");
    // Log new color to console in HSL format
    console.log($("#myColorInput").chromoselector("getColor").getHsl());
});

Same as above, but using the API object:

$(document).ready(function () {
    // Instanciate the color picker
    var $picker = $("#myColorInput").chromoselector();
    // Get an instance of the API object
    var api = $picker.chromoselector("api");
    // Now do everything else
    api.show();
    api.setColor("#123456");
    console.log(api.getColor().getHsl());
});

Most API object function calls can be chained, so the above can be again reduced to the following:

$(document).ready(function () {
    // Instanciate the color picker and get the API object
    var api = $("#myColorInput").chromoselector().chromoselector("api");
    // Now do everything else
    console.log(
        api.show().setColor("#123456").getColor().getHsl()
    );
});