Bhabishya Kumar

My layman solution to Dustin's Programming Brain Teaser.

    var arr = ['a', 'b', 'c', 'c', 'd','e', 'e', 'e', 'e', 'e', 'f', 'e', 'f', 'e', 'f', 'a', 'a', 'a', 'f', 'f', 'f'];
   
    var result = '';
   
    arr.forEach(function(value, index){
        if(index > 1 && (arr[index] == arr[index - 1]) && (arr[index - 1] == arr[index - 2])){
            if(index == (arr.length - 1) || (arr[index + 1] != arr[index])){
                result += (index < 3 || (arr[index - 2] != arr[index - 3])) ? ' <span>' + value + '</span>' : ' ' + value +  '</span>' ;
            } else {
                result += (index < 3 || (arr[index - 2] != arr[index - 3])) ? ' <span>' + value : ' ' + value;                
            }
        } else {
            result += ' ' + value;   
        }
    })        

Remi Sharp and other guys who used regular expressions came up with much 'cooler' solutions. Regular Expression is really powerful. Need to work on that.

I can't believe we have been together for one whole year! It was this very month last year that I started this blog. It was supposed to be a medium to share my experiences during my journey in Ruby on Rails & JavaScript hacking.

Of Course, I hadn't met you yet!

All I wanted to do was create a super-simple website using Rails & JavaScript. But I couldn't do that after meeting you. You were always there luring me with things which were much easier & fun then starting a project from scratch. You gave me the instant gratification which is so tempting. I was always looking for excuses to meet you even though it made me feel guilty afterwards. Whenever I faced some obstacle, you took me in your loving embrace and made me forget everything.

To be honest, I haven't been totally loyal to you this whole time. I have been sneaking out to meet other people like Gadgets & GreaseMonkey scripts. They make me feel good about myself. I don't feel miserable afterwards as I do after spending time with you. But those occasional dates never materialized into anything meaningful like a full website. Its about time that I change that. Its going to take a lot of commitment, effort from my side but I have to bite the bullet.

I am so sorry to say this but I think we should break-up.

Gasoline requested me if I could develop a Greasemonkey script similar to my first script for Picsearch.com. Initially I thought it should be fairly simple. So, I looked into Picsearch. I was wrong. The good thing with Google Image Search is that all the search results have the url of actual image and actual page as part of their href. So, you just have to parse the href and replace it with image url.

Picsearch on the other hand just points to some ID and when you click on the search results to go to next page, then only you see those urls. So, it became a 2-step process compared to one for Google. First, I had to load the actual href in an invisible Iframe and then read the document in that Iframe to look for the desired urls.

And so, something which was supposed to be a mundane task turned out to be exciting. I had tried this Iframe busines earlier too but had to give up because of cross-domain security restriction (silly me!).

Also, I guess I have to learn more about Greasemonkey quirks. Some things which work fine in real world stop working in Greasemonkey script. Like my onload event handler for Iframe started giving some strange errors in Firebug though it worked perfectly fine in my standalone testing. So, I had to do it the eventListener way. I guess it doesn't like level 4 JavaScript:).

Another weird thing was that the popup-positioning JavaScript which was working perfectly fine for my Google script stopped working. I have no idea why. Maybe, it was conflicting with something in the main body of Picsearch. Anyway, this forced me to try something else and I came across something new. You can manipulate the loaded stylesheets through JavaScript using document.stylesheets. That was fun.

So, finally the script is ready. I even added [Origin Image | Origin Page] to it like CustomizeGoogle. And its also an indicator that the script has done its business and popups should appear now (helpful, since its slower compared to google version because of above mentioned reason). And I assume everybody is going to open images in new tabs(if at all) because if you open in the same tab and come back it will obviously reload all the Iframes and images again.

You can download it from its UserScripts page or directly from here.

Update - 08/28/2007 - I came across an irritating problem with some of the search results. Some of the origin pages don't want them to be shown in frames in some other site. So, they use the following hack at the top of their pages to break out of frames.

if (window!= top) top.location.href=location.href

This was loading their pages in Picsearch results page when I was trying to load them in a IFrame, spoiling the whole thing. So, instead I am using Ajax now. I had thought of Ajax earlier too but gave it up thinking invisible IFrame should work the same way. But, I was wrong(again?). The new script is MUCH FASTER!!!

I came across a very interesting test of JavaScript Knowledge. I agree with most of the comments for that article, the gap between level 5 & 6 is much more than any of the other levels.

I have yet to come across a Java project with JavaScript code of level 6. Even level 4 and 5 are rare. And the reason being that in traditional Java projects, JavaScript is used only for basic UI validations, for which anything over level 3 is an overkill.

I would love to try out level 6 JavaScript code in my projects but I guess that would scare all the other Java Developers away:)

Today, I wrote my first Greasemonkey Script! Woo-Hoo!

I always wanted to try out my hand at Greasemonkeyness and today turned out to be that day. I was doing a Google Image Search for Hot Lyla from Friday Night Lights and as always I had to go through a number of clicks to open the photos that looked "promising" in new tabs before starting to view them.

So, being a long weekend, I thought why not do a NetFlix kind of Popup for Google Image Search Results so that I don't have to go through this clicking routine everytime I am searching for a hot girl!

My Script is a mashup of the original script by Patrick Cavit and a Dynamic Drive CSS Library.

Although, Eric Hamiter & CustomizeGoogle have already fixed the most irritating issue of having to click twice on search result to get to original image, I wanted to take it a step further by not having to click at all (atleast for small/medium images). Instead of opening images in separate tabs, you can view it in a CSS Popup on Mouseover.

Unlike NetFlix, who have fixed size Popup for Movie Info, I had to figure out the least ugly way to position Popups since the images are of random sizes.. The default CSS Library was always positioning the Popup below the search result with a little left offset. This was looking very ugly for the search results on the right & bottom portion of the page. I was not able to fix this issue through CSS because of my limited knowledge of it. So, I had to write some ugly JavaScript to take care of this.

You can find the Script here & here.

I can't help checking the Install Count at UserScripts.org every now and then to boost my ego.

Update - 08/06/2008 - On megamorphg's request, added the resize feature. The large images are now resized to fit the available screen area, no need to scroll any more. This feature is dynamic in the sense that the same image will open in different sizes up to its full size depending on the position of its thumbnail on the screen when mouse is hovered over it.