Showing posts with label fun. Show all posts
Showing posts with label fun. Show all posts

Tuesday, July 07, 2009

Having fun with jquery -- Numbers to words

Having some fun with jquery, its cool btw...
Type in some numbers in the input box, (it should be in focus when u load this page, if not well u know who to blame - jquery of course, not me :-P)
And if you (un)knowingly type in something other than a number, it should tell you whats wrong.
Then click "Convert to words" and you'll get your number in words... one in Indian number system and another one in international standard. And, if you are really trying this out, you can use keyboard enter, escape.. i bound them to calculate and hide the results etc.

Just some plain short fun :)

[you can use enter and escape]
Enter a number:


And yeah, of course, here's the code (use this link to convert ur javascript into blogger friendly code):


<script type="text/javascript" src="http://abhi-sanoujam-blogspot-posts.googlecode.com/svn/trunk/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function NumberToWords() {

var units = [ "Zero", "One", "Two", "Three", "Four", "Five", "Six",
"Seven", "Eight", "Nine", "Ten" ];
var teens = [ "Eleven", "Twelve", "Thirteen", "Fourteen", "Fifteen",
"Sixteen", "Seventeen", "Eighteen", "Nineteen", "Twenty" ];
var tens = [ "", "Ten", "Twenty", "Thirty", "Forty", "Fifty", "Sixty",
"Seventy", "Eighty", "Ninety" ];

var othersIndian = [ "Thousand", "Lakh", "Crore" ];

var othersIntl = [ "Thousand", "Million", "Billion", "Trillion" ];

var INDIAN_MODE = "indian";
var INTERNATIONAL_MODE = "international";
var currentMode = INDIAN_MODE;

var getBelowHundred = function(n) {
if (n >= 100) {
return "greater than or equal to 100";
};
if (n <= 10) {
return units[n];
};
if (n <= 20) {
return teens[n - 10 - 1];
};
var unit = Math.floor(n % 10);
n /= 10;
var ten = Math.floor(n % 10);
var tenWord = (ten > 0 ? (tens[ten] + " ") : '');
var unitWord = (unit > 0 ? units[unit] : '');
return tenWord + unitWord;
};

var getBelowThousand = function(n) {
if (n >= 1000) {
return "greater than or equal to 1000";
};
var word = getBelowHundred(Math.floor(n % 100));

n = Math.floor(n / 100);
var hun = Math.floor(n % 10);
word = (hun > 0 ? (units[hun] + " Hundred ") : '') + word;

return word;
};

return {
numberToWords : function(n) {
if (isNaN(n)) {
return "Not a number";
};

var word = '';
var val;

val = Math.floor(n % 1000);
n = Math.floor(n / 1000);

word = getBelowThousand(val);

if (this.currentMode == INDIAN_MODE) {
othersArr = othersIndian;
divisor = 100;
func = getBelowHundred;
} else if (this.currentMode == INTERNATIONAL_MODE) {
othersArr = othersIntl;
divisor = 1000;
func = getBelowThousand;
} else {
throw "Invalid mode - '" + this.currentMode
+ "'. Supported modes: " + INDIAN_MODE + "|"
+ INTERNATIONAL_MODE;
};

var i = 0;
while (n > 0) {
if (i == othersArr.length - 1) {
word = this.numberToWords(n) + " " + othersArr[i] + " "
+ word;
break;
};
val = Math.floor(n % divisor);
n = Math.floor(n / divisor);
if (val != 0) {
word = func(val) + " " + othersArr[i] + " " + word;
};
i++;
};
return word;
},
setMode : function(mode) {
if (mode != INDIAN_MODE && mode != INTERNATIONAL_MODE) {
throw "Invalid mode specified - '" + mode
+ "'. Supported modes: " + INDIAN_MODE + "|"
+ INTERNATIONAL_MODE;
};
this.currentMode = mode;
}
}
}

function clear() {
$("#errSpan").hide();
$("#resultDiv").hide();
}

var num2words = new NumberToWords();

function translate() {
clear();
var input = $("#input").val();
if (isNaN(input)) {
$("#errSpan").html("This is not a number - " + input);
$("#errSpan").show();
$("#input").focus();
return;
};

num2words.setMode("indian");
var indian = num2words.numberToWords(input);

num2words.setMode("international");
var intl = num2words.numberToWords(input);

$("#resultDiv").html(
"<table bgcolor='#CCFFFF'><tr><td>In India</td><td>" + indian
+ "</td></tr><tr><td>Internationally</td><td>" + intl
+ "</td></tr></table>");
$("#resultDiv").show("slow");

}

$(document).ready( function() {
$("#resultDiv").hide();
$("#input").focus();
$(document).keypress( function(e) {
if (e.keyCode == 27) {
clear();
};
if (e.keyCode == 13) {
translate();
};
});
});
</script>

<div id="content" align="center">[you can use enter and escape]<br />
<span id="errSpan" style="color: #FF0000;"></span>
<div>Enter a number: <input id="input" type="text" size="15" /><input
type="button" onclick="translate()" value="Convert to words" /></div>

<div id="resultDiv" style="border: solid black 1px;"></div>
</div>

Tuesday, March 24, 2009

Yahoo and Google Suggestions



I always loved the suggestions from the google searchbox in firefox. Most of the time the term that I wanted to search almost always came up in the suggestions. I don't remember when was the last time i really went to www.google.com to do some search, have been always using the search box in the toolbar.
Had been thinking of having some fun with it since quite some time now...

I don't think there's any official API from google for Google Suggest, but looking at iGoogle (it also gives you suggestions real time), there do seemed to be some kind of API. The urls used by Google suggest (as of now) do support callbacks, which gives some opportunity to have fun with it :)
Apparently yahoo has got some API for Related Suggestions (yahoo suggest?). I was playing around with the API's from both google and yahoo... it was fun. Seems to me like google is giving much better results at least compared to yahoo's Related Suggestions. Nonetheless, its just fun looking at the results :)

Have fun here... do some typing in the input box below :)





Oh, by the way, you can click on the results too (will open in a new tab/window)

And here's the code...
The html used for the above is as simple as this:

<div id="suggestions">
<script type="text/javascript">
init("suggestions");
</script>
</div>


And here's the actual javascript code thats doing the bulk of the work:

var gurl = "http://www.google.com/complete/search?output=json&callback=gcallback&q=";
var yurl = "http://search.yahooapis.com/WebSearchService/V1/relatedSuggestion?appid=abhisanoujam&output=json&callback=ycallback&query=";
var gsurl = "http://www.google.com/search?q=";
var ysurl = "http://search.yahoo.com/search?p=";

var gel, yel, lgel, lyel, inp, gres, yres, gh, yh;

function init(ename) {
var el = document.getElementById(ename);
if (el) {
inp = document.createElement("input");
inp.id = "inputText";
inp.type = "text";
inp.setAttribute("autocomplete", "off");
inp.onkeyup = keyup;
inp.size = 55;
inp.value = "Try your text here";
el.appendChild(inp);
}
var cont = document.createElement("div");
cont
.setAttribute("style",
"border-style:solid;border-width: 1px;float: left;padding:2px;margin:2px;");

var gcont = document.createElement("div");
gcont
.setAttribute(
"style",
"float: left;padding:2px;margin:2px;width: 300px;height: 300px;border-style:solid;border-width: 1px;");
gh = document.createElement("div");
gh.setAttribute("style", "font-size: 16px;color:#33CC33;");
gh.innerHTML = "Google Suggests";
gcont.appendChild(gh);
gres = document.createElement("div");
gcont.appendChild(gres);
cont.appendChild(gcont);

var ycont = document.createElement("div");
ycont
.setAttribute(
"style",
"float: left;padding:2px;margin:2px;width: 300px;height: 300px;border-style:solid;border-width: 1px;");
yh = document.createElement("div");
yh.setAttribute("style", "font-size: 16px;color:#33CC33;");
yh.innerHTML = "Yahoo Suggests";
ycont.appendChild(yh);
yres = document.createElement("div");
ycont.appendChild(yres);
cont.appendChild(ycont);

el.appendChild(cont);

gel = document.createElement("div");
el.appendChild(gel);
yel = document.createElement("div");
el.appendChild(yel);
keyup(null);
}
function keyup(evt) {
if (emptyCheck()) {
return;
}
var gsel = document.createElement("script");
gsel.setAttribute("type", "text/javascript");
gsel.setAttribute("src", gurl + inp.value);
gel.appendChild(gsel);
lgel = {
"node" :gsel,
"text" :inp.value
};

var ysel = document.createElement("script");
ysel.setAttribute("type", "text/javascript");
ysel.setAttribute("src", yurl + inp.value);
yel.appendChild(ysel);
lyel = {
"node" :ysel,
"text" :inp.value
};
}

function emptyCheck() {
if (trim(inp.value) == "") {
var e = new Array();
displayRes(gres, e, null, gh, "Google");
displayRes(yres, e, null, yh, "Yahoo");
return true;
}
return false;
}

function gcallback(resp) {
if (emptyCheck()) {
return;
}
var res = new Array();
var t = resp[1];
if (t) {
for ( var i = 0; i < t.length; i++) {
res.push( {
"text" :t[i][0],
"results" :t[i][1]
});
}
}
displayRes(gres, res, gsurl, gh, "Google");
removeAllChildrenExcept(gel, lgel.node);
}

function ycallback(resp) {
if (emptyCheck()) {
return;
}
var res = new Array();
var t = resp.ResultSet;
if (t) {
var tt = t.Result;
if (tt) {
for ( var i = 0; i < tt.length; i++) {
res.push( {
"text" :tt[i]
});
}
}
}
displayRes(yres, res, ysurl, yh, "Yahoo");
removeAllChildrenExcept(yel, lyel.node);
}

function displayRes(el, r, surl, hh, t) {
var h = '';
var l = r.length;
for ( var i = 0; i < l; i++) {
var fsurl = surl + escape(r[i].text);
h += '<span style="font-size: 12px; font-weight: bold;"><a target="_blank" '
+ 'style="text-decoration: none;" href="'
+ fsurl
+ '"> '
+ r[i].text + '</a>';
if (r[i].results) {
h += '</span> <span style="font-size: 10px;">' + r[i].results + '</span><br />';
} else
h += '<span><br />';
}
if (l <= 0) {
h = '---';
}
el.innerHTML = h;
hh.innerHTML = t + ' Suggests (' + l + ' results) ' + getSmiley(l);
}
function getSmiley(l) {
if (l <= 0) {
return '<img alt="sad" src="http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif">';
} else if (l >= 1 && l <= 3) {
return '<img alt="smile" src="http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif">';
} else if (l >= 4 && l <= 7) {
return '<img alt="happy" src="http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif">';
} else
return '<img alt="elated" src="http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/69.gif">';
}

function removeAllChildrenExcept(node, keepchild) {
for ( var i = node.childNodes.length - 1; i >= 0; i--) {
if (node.childNodes[i] != keepchild) {
node.removeChild(node.childNodes[i]);
}
}
}
function trim(str) {
return str.replace(/ [ ]*/g, '');
}



Have fun :)