Saturday, July 17, 2010

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.

No comments:

Post a Comment