URL Shares Count

by karimkhan

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div class="panel panel-default">
                <div class="panel-body">
                    <form role="form">
                        <div class="form-group">
                            <label>URL</label>
                            <input type="text" class="form-control" id="urlInput" placeholder="Enter URL" />
                            <p class="help-block">with <code>http</code> or <code>https</code>

                            </p>
                        </div>
                        <button type="button" class="btn btn-success" id="getJSON">Get Share Counts</button>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-md-4" id="data-tab">
            <div class="list-group"> 
 <a href="#" class="list-group-item">
          <h4 class="list-group-item-heading">Facebook</h4>
          <p class="list-group-item-text" id="facebook-count"></p>
        </a>
 <a href="#" class="list-group-item">
          <h4 class="list-group-item-heading">Twitter</h4>
          <p class="list-group-item-text" id="twitter-count"></p>
        </a>
 <a href="#" class="list-group-item">
          <h4 class="list-group-item-heading">LinkdIn</h4>
          <p class="list-group-item-text" id="linkdin-count"></p>
        </a>

            </div>
        </div>
    </div>
</div>

JavaScript

$('#getJSON').click( function () {
    $('#data-tab').fadeOut();
    $URL = $('#urlInput').val();
    
    // Facebook Shares Count
    $.getJSON( 'http://graph.facebook.com/?id=' + $URL, function( fbdata ) {
        $('#facebook-count').text( 'The URL has ' + ReplaceNumberWithCommas(fbdata.shares) + ' shares count on Facebook')
    });
    
    // Twitter Shares Count
    $.getJSON( 'http://cdn.api.twitter.com/1/urls/count.json?url=' + $URL + '&callback=?', function( twitdata ) {
        $('#twitter-count').text( 'The URL has ' + ReplaceNumberWithCommas(twitdata.count) + ' shares count on Twitter')
    });
    
    // LinkIn Shares Count
    $.getJSON( 'http://www.linkedin.com/countserv/count/share?url=' + $URL + '&callback=?', function( linkdindata ) {
        $('#linkdin-count').text( 'The URL has ' + ReplaceNumberWithCommas(linkdindata.count) + ' shares count on linkdIn')
    });
    
    $('#data-tab').fadeIn();

});


// Format Number functions
function ReplaceNumberWithCommas(yourNumber) {
    //Seperates the components of the number
    var components = yourNumber.toString().split(".");
    //Comma-fies the first part
    components [0] = components [0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    //Combines the two sections
    return components.join(".");
}