How to use Javascript beautifier with gedit.

Javascript beautifier is an awesome online tool to indent your JavaScript code. I use it very often.
Earlier I  use to paste my code in this online tool to get my JavaScript code indented.
Fortunately there is a way to integrate javascript beautifier with gedit.
Here are steps(I hope u are using latest version Ubuntu Linux, and having python).
Step1:Install gedit plugin "External Tools".
open gedit and go to edit->preferences->plugins(tab)
see if you already have a plugin "External Tools", if not install using this command.

$ sudo apt-get install gedit-plugins

After inslalling enable this plugin from edit->preferences->plugins(tab).
Step2: Install Rhino Shell.
You need Rhino Shell, to execute javascript on commandline.
To check whether you already have "Rhino Shell" or not, type "js" on Command Line.
You can Install "Rhino Shell" by typing this command.

$ sudo apt-get install rhino

Step3: Download einars-js-beautify.
You can download it here http://github.com/einars/js-beautify .
Extract it in some folder. lets say you have extracted it in folder
"/home/markandey/dev/einars-js-beautify/" .

Step4: Configure plugin to use jsbeautify.
Now go to "gedit->tools->manage external tools" and add a new command script, with following description.

Description: Beautify Javascript using einars jsbeautify
Shortcut Key:  
Commands:

#!/usr/bin/env python

import os
import sys
import tempfile

jsbeautify_path = "/home/markandey/dev/einars-js-beautify/"

content = sys.stdin.read()
h, tmpfile = tempfile.mkstemp()
os.close(h)

f = open(tmpfile, "w")
f.write(content)
f.close()

cmd = "js beautify-cl.js -i 4 %s"%(tmpfile)
os.chdir(jsbeautify_path)
content = os.system(cmd)
os.remove(tmpfile)

use these attributes.
Input: Current Selection.
Output: Replace the current selection.
Applicability: All documents.

That's it! you are done!

Thanks for reading my blog.

HindiTransliteration (c# and JavaScript implementation, works offline)

When I was in college, I wrote a quick and dirty code to transliterate in Hindi (DevNagari Script). Much before Google's Implementation.
{This code was kept on my old desktop PC,I Thought, its a good idea to share with the rest of the world}

Though my implementation is not very robust, but Its very simple and small. It does not require any Internet connection and can work offline.

Note: code was originally written in C#.net and converted to javascript latter.
Here is C#.net Code(solution zipped)

You need to call function

DoTransLitrate(str)

Where str(as input): Phonetically typed (in English) Hindi .
Returns: Hindi in Devnagari script.


Using JavaScript Code
Get the JavaScript File from here include in your html page and call function

DoTransLitrate()

  DEMO  

Kill All Chrome Instance at once (Linux+ Windows)

Windows users can follow this instructions here.
Or simply use command

        taskkill /F /IM chrome.exe

Linux geeks can use this command 

    kill -9 `ps -A |grep chrome| cut -d "?" -f1`

How This works?
I am sure that, most of the Linux users can easily figure it out, but for those who want explanation here you go...
Command
  ps -A          list all the processes
  grep chorme     will filter only those process which has name as chrome
  cut -d "?"     will cut the process Id potion of the out put.
and
  kill -9   kills a process ,
so above command will kill all the process with name chrome.
Please Note that this command will work on those processes which are not command line (mostly launched from UI ) (i.e whose tty field is "?")

Twenital: Determines gender from a twitter handle

Twitter never stores the gender of their users. It makes the life of analytic engines very difficult to find that what is the ratio of men vs women on twitter.
Here I have created quick and dirty mash-up to get  gender of the twitter user.

How It Works?
Thanks to face.com API, they have recently released face recognition API. I am simply using their face recognition API to do this.

Here is AJAX code

function getusergender(imageurl) {
var url = 'http://api.face.com/faces/detect.json?api_key=1ce92a4c5e60f04c37bedf86c2d19387&urls=' + imageurl + '&callback=?';
$.getJSON(url, function (data) {
if (data.status == "success") {
if (data.photos[0].tags.length == 0) {
$("#resdiv").html('<div class="errormsg">hmmm..Let him/her put better profile picture. </b>TIP: put high resolution profile picture, facing front.</div>');
}
else if (data.photos[0].tags.length > 1) {
showerror('This user is multifaceted, Let him/her put better profile picture..');
}
else {
if (data.photos[0].tags[0].attributes.gender.value) {
var gender = data.photos[0].tags[0].attributes.gender.value;
if (data.photos[0].tags[0].attributes.gender.confidence > 40) {
if (gender == 'male') {
$("#resdiv").text('100% Male');
}
else {
$("#resdiv").text('Gorgeous Female');
}

}
else {
if (gender == 'male') {
$("#resdiv").text('Male');
}
else {
$("#resdiv").text('Female');
}
}
}
else {
showerror('hmmm... not sure!!');
}

}
}
else {
if (data.usage.used > 197) {
showerror('Sorry!! Application Overloaded!!');
}
else {
showerror('Processing failed!! Can not determine gender!!');
}
}
});

}

   DEMO  

Offline Google Maps in C#.net

Sometime back I wrote an application for windows mobile in c#.net which can give you turn-by-turn navigation on phone completely offline. Map and direction info will be pulled by a peer Desktop application which will export all these information in an XML file. This XML file will have these 2 Items

1. Static Map Images (covering the track at zoomed & top level))
2. Direction steps and description.

Static map images can be downloaded from Google using there static map API. Direction steps and descriptions can only be downloaded via a AJAX API. Since I had only AJAX way of getting this data, I created a webpage which can do all necessary DOM operation using JavaScript.  Once the DOM is populated I can easily grab the data from C# API (Web browser control + GetElementByID APIs).

Downloading the static Images from Google is not enough, you need to map Latitude and Longitude on the static map. Which is done like this

public PixelPoint GetCordinateOnStaticImage(double latitude, double longitude, 
double centerLat, 
double centerLang, 
int zoom,
double width,
double height)
{

       long val = 1 << ((21 - zoom));
       double target_y = LatToY(latitude); 
       double target_x = LongToX(longitude);
       double delta_x = (((target_x - LongToX(centerLang))) / (val));
       double delta_y  =(((target_y - LatToY(centerLat)) )/ (val));
       double marker_x = (width/2) + delta_x;
       double marker_y = (height/2) + delta_y;
       PixelPoint p = new PixelPoint(marker_x,marker_y);
       return p;
}

You can see Full source code here. Originally Idea is taken from here.


Direction
Google returns the poly-line of the direction path. Some of the points on this polyline will be identified as step, step has direction description, e.g "at blah blah circle take left".
This project solve another problem of pulling the right direction description from the given location.

SourceCode
Complete source-code of this project is available on Google code here.

Demo
Here is a demo video.