Sunday, December 5, 2010

Translate BIG webpages using Google Translate JS API

Today I have released yet another open source project : zgtranslate . It is a Javascript library that could be used to translate large webpages using Google Translate JS API.
Google provides a widget that can be placed in the html code of the webpage, but there are some nasty things about it:
  1. it requires flash (and I have flash removed)
  2. it translates just the current page, but not the next linked page (althow it should as it says in its help)
So I decided to make my own translator. Because Google Translate JS API can only process small texts we need to split the (large) webpage into smaller pieces that can be send to hungry Google for processing. I have implemented this split in my library.
Usage is very simple: just include the zGTranslate.js script in your webpage, and set startTranslate(id,language code) to be called when something is clicked (first example) or auto(second example) when the page was loaded.

You can download the examples and the library and see it in action.

Note: as stated in issue 1, the library does not yet works with IE6. bug fixed now

Saturday, September 18, 2010

find my gravatar

Here is a php script that will display your gravatar:

<html>
<body>
<?php
/**
* Get either a Gravatar URL or complete image tag for a specified email address.
*
* @param string $email The email address
* @param string $s Size in pixels, defaults to 80px [ 1 - 512 ]
* @param string $d Default imageset to use [ 404 | mm | identicon | monsterid | wavatar ]
* @param string $r Maximum rating (inclusive) [ g | pg | r | x ]
* @param boole $img True to return a complete IMG tag False for just the URL
* @param array $atts Optional, additional key/value attributes to include in the IMG tag
* @return String containing either just a URL or a complete image tag
* @source http://gravatar.com/site/implement/images/php/
*/
function get_gravatar( $email, $s = 80, $d = 'mm', $r = 'g', $img = false, $atts = array() ) {
$url = 'http://www.gravatar.com/avatar/';
$url .= md5( strtolower( trim( $email ) ) );
$url .= "?s=$s&d=$d&r=$r";
if ( $img ) {
$url = '<img src="' . $url . '"';
foreach ( $atts as $key => $val )
$url .= ' ' . $key . '="' . $val . '"';
$url .= ' />';
}
return $url;
}

print(get_gravatar('my_email_address@gmail.com')."\n" )

?>
</body>
</html>

Friday, August 27, 2010

latest googletalk-call not working with kopete in Ubuntu Maverik

The latest kopete-gcall 4:4.5.0b-0ubuntu3 does not contain the executable /usr/bin/googletalk-call so kopete gives the following error message: "Cannot start process googletalk-call. Check your installation of Kopete.".
I recommend installing the previous version of kopete-gcall that can be found here.
The bug report is here.

Sunday, August 22, 2010

reCaptcha Solver

reCAPTCHA.net has officially been solved algorithmically. Details here(docx, pptx, video).

copy svn working dir without svn hidden dirs and files

Use one of the following commands:

  • svn export PATH1 PATH2

  • rsync -r --exclude=.svn /home/user/progname/ /home/user/progname.copy

  • tar --exclude='.svn' -c -f - /path/to/sourcedir/* | (cd /path/to/destdir ; tar xfp -)
  • just copy the entire directory and then delete the Subversion stuff
    find /path/to/destdir -name '.svn' -exec rm -r {} \;
I found this info here.

Saturday, August 21, 2010

upcase and lowercase alphabet + numbers


ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789

Monday, August 16, 2010

Thursday, July 22, 2010

Google Virtual Keyboard inserts non-breaking space instead of space

I have summited a bug for the Google Virtual Keyboard: more details at http://code.google.com/p/google-ajax-apis/issues/detail?id=494
What steps will reproduce the problem?

1. implement and enable a google virtual keyboard for an input element(text or textarea) on a website
2. type some words and space in that input box( for example "google bug")

example:
1. open www.google.ro (it has a virtual keyboard for the search input) or http://www.revistapadurilor.ro/index.php?section=KeywordSearch (this webpage has a text input in the central part that has a virtual keyboard with romanian layout enabled)
2. write the text: google bug
3. copy the inputed text and use a HTML encode utility(like http://www.cafewebmaster.com/online_tools/htmlentities ) to encode the text to HTML entities

What is the expected output? 

The expected output is the text with simple(regular) spaces

What do you see instead?

Instead of inserting simple (breaking) spaces, the google virtual keyboard inserts non-breaking space.
Example: google bug or (copy pasted):"google bug"


What version of the product are you using? On what operating system?

latest (script loaded from http://www.google.com/jsapi )

Note: 
I checked this bug on the romanian and english layout.

Update:
Seems to be a Chromium related issue. This bug does not appear on Mozilla Firefox. Submitted an issue to Chromium: http://code.google.com/p/chromium/issues/detail?id=49902


Sunday, July 18, 2010

Google Virtual Keyboard with layout selector using a drop-down menu

Google Web Elements allow you to easily add your favorite Google products onto your own website. I will talk about the Google Virtual Keyboard.
As you can see on its presentation page, Google has implemented a virtual keyboard that lets you type directly in your local language script in an easy and consistent manner. Google's virtual keyboard allows developers to enable virtual keyboards on any text field or text area in their webpages.
How to attach a Virtual Keyboard to inputs on your site
As explained here and here, the steps are:

  1. determine the language(layout) for the keyboard
  2. determine the ids of the input elements where the keyboard will be active
  3. put some javascript code in the html source of the webpage
I needed to be able to select when browser the layout. I found an example here that allows to switch the layout to some predetermined layouts, but this wasn't enought.
After some google I found an example that gets all the available layouts and makes a button(anchor) for each one, so when clicked the layout of the keyboard is changed. 
I prefer using a drop-down menu so the code is:


// Load the Google Onscreen Keyboard API
google.load("elements", "1", {packages: "keyboard"});

var kbd; // A Keyboard object.

// Draw a list of keyboard layouts in their native languages.
// User can click any of them to switch to that keyboard layout.
function drawMenu() {
 html = ["<select onchange='kbd.setLayout(this.options[this.selectedIndex].value)' >"];
 html.push("<option value=\"en\" >", "Select a layout for the virtual keyboard", "</option>");
 for (var i in google.elements.keyboard.LayoutCode) {
  var code = google.elements.keyboard.LayoutCode[i];
  var name = google.elements.keyboard.getLayoutName(code);
  html.push("<option value=\"", code, "\" >", name, "</option>");
 }
   html.push("</select>");
 document.getElementById("kbSelect").innerHTML += html.join("");
}


function onLoad() {
 // Create an instance on Keyboard.
 kbd = new google.elements.keyboard.Keyboard([
  google.elements.keyboard.LayoutCode.ENGLISH],
  ["id1","id2","id3"]);
 drawMenu();
 kbd.setLayout("en");//default language
}

google.setOnLoadCallback(onLoad);


The code works very good so I implemented it in my website design toolkit in a PHP class called PVirtualKeyboard(source code here).