Takazudo
9/13/2011 - 5:21 PM

shortenUrl using bit.ly API

shortenUrl using bit.ly API

<h1>bit.ly</h1>
<div>
	<input id="longUrl" type="text" value="http://example.com">
	<input id="button" type="submit" value="GO">
</div>
<div>
	res: <span id="res"></span>
</div>
var bitly_url = 'http://api.bitly.com/v3/shorten';
var bitly_login = 'takazudox';
var bitly_apiKey = 'R_1f81ad462aa657865bf953a062f85877';

/* proxy */

var shortenUrl = function(longUrl){
	return $.Deferred(function(defer){
		var action = bitly_url;
		var data = {
			login: bitly_login,
			apiKey: bitly_apiKey,
			format: 'json',
			longUrl: longUrl
		};
		$.ajax(action, {
			dataType: 'jsonp',
			data: data
		}).then(function(res){
			if(!res || !res.data || !res.data.url){
				reject();
				return;
			}
			defer.resolve(res.data.url);
		}, reject);
		function reject(){
			defer.reject({ msg: 'bit.ly got problem' });
		}
	}).promise();
};

/* DOM things */

$(function(){

	var $longUrl = $('#longUrl');
	var $button = $('#button');
	var $res = $('#res');

	$button.click(function(){
		var longUrl = $longUrl.val();
		if(longUrl === ''){
			return;
		}
		shortenUrl(longUrl).then(function(shortUrl){
			$res.text(shortUrl);
		}, function(){
			alert('bit.ly may be offline');
		});
	});

});
name: bit.ly example
description: bit.ly API via jQuery ajax
authors:
  - Takeshi Takatsudo
normalize_css: no