Blog Archives

Angry birds is not working on chrome after installing the latest offline version [ FIX ]

A couple of weeks ago angry birds -web-  got a new version that is capable of working offline with HTML5 Cache !

Some people reported that it doesn’t work and craches on this screen:
angry birds crash chrome version


Today, I tried to delete the cache and re-install the game .. and it worked fine =)

Here is HOW:

Go to

Options >under the Hood > Content settings > Click “All Cookies and site data…”

OR simply write  chrome://settings/cookies in your address bar !

You will find a long list of all sites “Cookies and Other Data” in your browser !

in the small box above write “chrome.angrybirds

angrybirds fix for offline version on google chrome



You will find only 1 entry filter, click “session storage” then > “Remove

NOTE: All your saved data <levels> will be lost ! (90%)

Now.. open up your angry birds web app and wait for the installation.
and u r done =D






html5 speech bookmarklet

As I promised in the last post, I made this simple bookmarklet that will change any textbox to be speech recognition enabled 😀

Just click CTRL + SHIFT + B to open the bookmarks bar, right click it and press add page..  write “enable speech” in name and paste the following code in URL

javascript:(function(x) { var i, current; for (i in x) { current = x[i]; if (current.type == "text") { current.setAttribute("x-webkit-speech", "x-webkit-speech"); current.setAttribute("speech", "speech"); } } })(document.getElementsByTagName("input"));

NOW .. open up any website that contains a textbox and click the bookmarklet and you will find that small speech icon in the textbox.

Enjoy =D

Here is a screen shot for after clicking on the bookmarklet 😀

google enabled speech

plug in your mic and “speak now” =d

Note: make sure you have chrome version 11 or later.

coding time,

(function(x) {
        var i, current;
        for (i in x) {
            current = x[i];
            if (current.type == "text") {

I made a self executing anonymous function, and passed all input elements to it.. filtered them with If statement to get only the textboxes.. finally addin the two attributes, Very simple =D

Try it, and tell me if you have any problems.

you can FORK it on


HTML5 speech support

I remember at the beginning of this year when I read about the google chrome’s experiments to add support of HTML5 speech recognition, they put it for the public by running chrome with extra parameter flag passed to the application.

    %LocalAppData%\Google\Chrome\Application\chrome.exe --enable-speech-input

That was very interesting & inspiring for me. and from 2 weeks ago with the release of version 11 they enabled it finally & added it to the translation service. and I was going to blog about it and explain how to add it to you web applications.. & Yess, I got very busy and forgot 🙂 .. Yesterday, at Google’s famous conference –google IO– and exactly at the second day key note speech they talked about it =D .. so I am going to write a brief of how to add it to your apps and extra stuff.


Simply, If you want to have the speech recognition in your web app, all you have to do is add an extra attribute to the input tag to enable speech recognition input =d

<input type="text" x-webkit-speech />

Thats pretty simple, Just adding an extra attribute will get it work !! <thanks HTML5>

Lets see it in action <google translate>, open google translate , point source language from “detect language” to “english” and press the mic icon and SPEAK !:D

<note: the speech recognition attribute is attached to an input (not textarea) as you could think, <inspect element & see ;)> ..

I thought if there is any other properties related to this in the DOM element, so Lets use the developer tools in google chrome press CTRL + SHIFT + J to open chrome’s console. lets use the embedded method console.dir() that will populate every method/property in a given Element.

console.dir( document.createElement('input') );

here is the props/methods that could be related:

webkitSpeech: false
onwebkitspeechchange: null

So, using these prop you can attach event, test if the browser support speech recogniztion etc..

here is how to test if the browser support it or not:

if ("webkitSpeech" in document.createElement('input')){
//do something

what about other browsers than chrome & safari (browsers that doesn’t use the webkit layout engine):

In google ‘s translate input element, they put two attributes related to the speech : speech &  x-webkit-speech , and if you read the API Draft you will find that speech is standard. and you have to put both attributes, now lets add some extra stuff to our test:

var newElement = document.createElement('input');
if ("webkitSpeech" in newElement || "Speech" in newElement){
//do something

and extra attrubite to the first exmaple :

<input type="text" x-webkit-speech speech />

Finally , add the value [ =”” ] fo the sake of xhtml strict specification:

<input type="text" x-webkit-speech="x-webkit-speech" speech="speech" />

What about a small piece of code or even chrome extension that enables any input text in any webpage we are in to be speech recognition ready ??

I ‘ll go study now and may be tonight I’ll write a simple bookmarklet and post it tomorrow.