JSFiddle - React, Tailwind, and code Playground

by Steven Senkus

HTML

<pre>
    <h3>FIPS - Countries</h3>
    <p>Based off of IP addresses from our servers</p>
    <ul id="fipsList"></ul>
</pre>

CSS

pre {
    margin: 30px;
    
}
li {
    opacity: 0.7;
    
}

h3 {
    margin: 0;
    
}

JavaScript

var FIPS = {
    'JP': 'Japan',            //1.1.90.82
    'GB': 'Great Britain',    //5.11.16.3
    'UC': 'Curaçao',
    'UG': 'Uganda',
    'UK': 'United Kingdom',
    'UP': 'Ukraine',
    'US': 'United States',
    'UV': 'Burkina Faso',
    'UY': 'Uruguay',
    'UZ': 'Uzbekistan'
};
$.each(FIPS, function(a,b) {
    $('#fipsList').append('<li class="fips"id="'+ a +'">'+ a + ' ' + b + '</li>');
});

$.ajaxSetup({
    error: function (jqXHR, exception) {
        if (jqXHR.status === 0) {
            alert('Not connect.\n Verify Network.');
        } else if (jqXHR.status == 404) {
            alert('Requested page not found. [404]');
        } else if (jqXHR.status == 500) {
            alert('Internal Server Error [500].');
        } else if (exception === 'parsererror') {
            alert('Requested JSON parse failed.');
        } else if (exception === 'timeout') {
            alert('Time out error.');
        } else if (exception === 'abort') {
            alert('Ajax request aborted.');
        } else {
            alert('Uncaught Error.\n' + jqXHR.responseText);
        }
    }
});


$.ajax({
    type: 'GET',
    url: 'http://www.duralabel.com/utils/iplookup.php?mode=json&ip=50.11.16.3',
    dataType: 'jsonp',
    success: function (data) {
        var foundFIPS = data['Countrycode'];
        alert(foundFIPS);
        $('#' + foundFIPS).css({
            'background-color':'#ff0',
            'opacity': 1
        });
    }
});