Home  »     »     »     »  Google Transliterate API - Simple Online editor in Javascript to type in your own language

Google Transliterate API - Simple Online editor in Javascript to type in your own language

Wednesday, May 21, 2014

Javascript based simple Online editor to type in your own language
Google Transliterate API Integration


It's great to type contents to your website in your own language. Google provides a simple Javascript based Language editor, which can be implemented on your website.The name of the API is Google Transliterate API. The code is simple and very easy to understand and integrate. Here you have to define a pair of languages, ie, a Source language and a Destination language. The content you type on editor using the source language is converted to the destination language. While type user will be provided options to choose exact word.



You may use the following code to create your own JS based Transliterator.

Copy the script and save as "mytranslator.html" and see the fun.

<html>
<head>
<title>My Language Editor</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
</head>
<body>


<script type="text/javascript">

// Load the Google Transliteration API
google.load("elements", "1", { packages: "transliteration"
});

function onLoad() {
var options = {
sourceLanguage: 'en',
destinationLanguage: ['ml'],
shortcutKey: 'ctrl+g',
transliterationEnabled: true
};
// Create an instance on TransliterationControl with the required
// options.
var control =
new google.elements.transliteration.TransliterationControl(options);

// Enable transliteration in the textfields with the given ids.
var ids = [ "transl1" ];
control.makeTransliteratable(ids);

// Show the transliteration control which can be used to toggle between
// English and Hindi.
control.showControl('translControl');
}
google.setOnLoadCallback(onLoad);
</script>


<table width="100%" border="0">
<tr>
<td> <div id='translControl' style="width:50px; float:left"></div>
<div style="width:200px; float:left" class="txtlabel">Click here to change language</div> </td>
</tr>
<tr>
<td><textarea name="content" cols="50" rows="50" class="formTextarea" id="transl1" style="width:475px; height:450px;"></textarea></td>
</tr>
</table>
</body>
</html>

In the above script I had used Source language as "English"

sourceLanguage: 'en'

and Destination language as "Malayalam"

destinationLanguage: ['ml']

list of available source Language and Detination languages are given here https://developers.google.com/transliterate/v1/getting_started

For language code check : https://developers.google.com/transliterate/v1/getting_started#LanguageCode

For more details on this please visit Google Transliterate API Developer's Guide

Some other Tools:
http://www.quillpad.in/
http://roaming.quillpad.in/


http://www.vishalon.net/PramukhIME/JavaScriptLibrary.aspx
http://www.slideshare.net/cdacmatra/english-to-indian-language-transliteration-system-by-cdac-mumbai



How to link to this page?
If you wish to link to this page from your website, simply Copy and paste the above HTML code to your web page. It will appear on your page as:
Google Transliterate API - Simple Online editor in Javascript to type in your own language.




Share this!




comments powered by Disqus

This Weeks 7 Popular Posts


Subscribe to Recent Posts by Email
Stay connected to CROZOOM with regular Email notices of new Techie articles and IT Jobs. Updates will be delivered to your Inbox as soon as they are posted online.

Enter Your Email Address:  

Delivered by FeedBurner   RSS Feed

Search this Blog   



Urgent Openings for PHP trainees, Andriod / IOS developers and PHP developers in Kochi Trivandrum Calicut and Bangalore. Please Send Your updated resumes to recruit.vo@gmail.com   Read more »