[How to] Turn off Google Instant Previews

Google launched Instant Previews few days ago – a feature which adds screenshots along with the search results. Though they claim that Instant Previews will help the users to find the results more precisely, personally, I found this feature to be annoying. Unfortunately, there is no option available yet to turn off “Instant Previews”. Turning off “Instant” search feature has no effect on “Instant Previews” either. I am surprised that not many technical journalists have raised concerns about this UI clutter so far. I have written a simple script to toggle the Instant Previews.

How to Install?

Compatible Browsers: Firefox 3+, Chrome 4+

Firefox

• Install the GreaseMonkey add-on for Firefox from here and restart the browser.
• Get the script by pointing your browser to this.
• GreaseMonkey Installation dialog box will appear. Please click on the “Install” button.
• You are all set to use the script. Open Google and perform a search. Click on the link “Disable Instant Previews” at the right top to disable the Instant Previews.

Chrome

• Chrome has native support for GreaseMonkey scripts.No additional extensions are needed to use the script.
• Get the script by pointing your browser to this.
• You will be prompted with a security alert. Please click on the ‘Continue’ button.
• The script will be installed as an extension. Open Google and perform a search. Click on the link “Disable Instant Previews” at the right top to disable the Instant Previews.

Please write to me if you find any issues with the script.

Update:

New version (V 1.1) is available now.

1. Instant Previews will be disabled by default.
2. Remember 'Instant Previews' setting across sessions. For e.g., if you have disabled the Instant Previews in the current session, the same setting will be remembered for the next session as well.

Userscripts.org seems to go down frequently these days. Here is an alternate link to the script.

-- Varun

[How to] Show QR codes for links in your web page

QR (Quick Response) code is a two-dimensional bar code consists of black rectangular modules arranged in a square pattern on white background. QR codes can digitally store more data than the standard barcodes. QR code was used for the first time in Japan in 1994 but it became popular only in the last 3-4 years. Thanks to the iPhones and Androids. Almost all the smartphones have QR code readers and the reading of codes takes just few seconds. We may soon see QR Codes storing addresses and URLs appearing in magazines, on signs, buses, business cards, etc. QR codes can be used on your web pages to improve the mobile experience of your users. Making each link on your page available as a QR code will allow the users to quickly navigate to that link on their mobiles.

Steps to be followed to add QR code for the links on your web page:

1. Include the jQuery library (if you have not included already) and jQuery.cluetip plug-in from within the HTML <head> section. Download it from here. [JavaScript experts may want to try this asynchronously loading JavaScripts. Link.]

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" type="text/javascript"></script>
<script src="jquery.cluetip.js" type="text/javascript"></script>

2. Copy the following HTML snippet and paste it just before closing the </body> tag. The snippet uses Google charts for generating the QR code and the jQuery plug-in cluetip is used for showing the bubble.

<div id="divQR" style="background-color: #D9E6F7; border:4px solid #C1D9FF; text-align:center; display:none;
    font-family:calibri;-moz-border-radius: 5px;-webkit-border-radius: 5px;width:200px;height:380px;padding:-5px;">
    <img id="imgQR" src="" width="200" height="200" alt="" />
    <p align="justify" style="padding-left:15px;padding-right:15px">QR code will be shown for each link on 
        hovering over it. Scan the QR code above using the Barcode Scanner from your smart phone, and the link 
        will be instantly accessible on your phone.
    </p>
</div>

<script type="text/javascript">
    $.fn.cluetip.defaults.dropShadow = false;
    $.fn.cluetip.defaults.onActivate = function(e) {
        if (e.length > 0) {
            var anchor = e.context;
            var link = anchor.href;
            if (link.indexOf("javascript:") == 0)
                return false;
            
            $("#imgQR").attr("src", "http://chart.apis.google.com/chart?chf=a,s,000000&chs=200x200&chld=|2&cht=qr&chl=" + encodeURIComponent(link));
            $("#imgQR").attr("alt", anchor.innerText);
            return true;
        } else
            return false;
    };
    $("a").attr("rel", "#divQR");
    $("a.qrLink").cluetip({local: true, hideLocal: true, showTitle: false, clickThrough: true});
</script>

3. Set the attribute class to “qrLink” for all the hyperlinks that you want to show as QR codes.

<a class="qrLink" href="http://blog.varunkumar.me" >Varun's ScratchPad</a>

4. Done. Hover over the hyperlinks to see their QR codes. Scan the codes from your mobile and navigate to the links quickly from your mobile.

Generate QR Code for hyperlinks on all the web pages

If you want to generate QR code for hyperlinks on all the web pages, use this GreaseMonkey script. It works only on Firefox as of now. Download and install GreaseMonkey add-on. Point your browser to this link. Now, the QR code will be shown on hovering over any of the hyperlinks on any web page.

-- Varun

[How to] Filter out updates on Facebook News feed

Facebook is a social networking site as opposed to Twitter which to me is a broadcasting medium. But, Facebook has been widely used for broadcasting messages as well. Similar to the Twitter timeline, your Facebook news feed often gets flooded with updates carrying similar message. Facebook handles these cases to a greater extent than Twitter. Facebook tries to group messages based on the sender, application and other parameters (like events). If a person is spamming your news feed, you can hide the updates from that person. You can also hide the updates from a particular application. The only missing feature here is the ability to hide updates on a particular topic. That is where my script will be useful. It is an extension to the script written for Twitter.

Features

• Filter out topics. Filter out updates containing a set of words from your news feed (works on profile pages also). You can enter multiple words separated by a comma. This will prevent your news feed getting flooded with the similar updates.
• Filtered count Indicator. The filtered updates are not gone for ever. You can clear the filters to view them. The number of updates filtered out will be shown intuitively on the ‘Filters’ menu itself.
• Remember your settings. The script has the ability to remember your filter settings on the browser and will reload the same when you sign in again. Also, the script applies the filters on new incoming updates as well (with a max time lag of 15 secs).
• Hide the ‘Likes’ from friends. (v 1.2) If you don’t care about what your friends are liking on Facebook or on other sites, you can use this feature to hide the ‘Likes’ on your news feed.
• Hide the friend connection updates. (v 1.2) Whenever a friend of yours is connected to another person, Facebook will notify you about the new connection on your news feed. If you are not interested in knowing who has be-friended whom, you can disable the friend connection notification using this feature.
• Hide the attachments. (v 1.2) Enabling this option will hide all the attachments on your news feed. This includes shared videos, photos, links, etc.
• Hide Facebook Places. (v 1.3) Enabling this option will hide the check-ins from your friends.
• Hide Facebook Questions. (v 1.3)
• Hide Facebook Ticker Section. (v 1.4). Facebook added a new section called “Ticker” which shows all the activities of your friends. It pushes the information that are already available on your friends’ profile. This section adds too much of noise to your news feed. Use this option to fix the section.
• Show only the filtered posts. (v 1.4) Enabling this option will show the posts which match the search text specified. This will be handy if you want to know what friends say on a particular topic. Thanks to Raghu for the idea.
• Hide Unread Count. (v 1.5). Facebook added a new feature called “Smart Lists” and showed the lists on the news feeds page. The unread count of the lists / groups clutters the UI. Use this option to hide the unread count.

How to install?

Compatible Browsers: Firefox 3+, Chrome 4+

Firefox 3+

• Install the GreaseMonkey add-on for Firefox from here and restart the browser.
• Get the script by pointing your browser to this.
• GreaseMonkey Installation dialog box will appear. Please click on the “Install” button.
• You are all set to use the script. Refresh the Facebook homepage. ‘Filters’ menu will appear next to ‘Account’ menu.

Chrome 4+

• Chrome has native support for GreaseMonkey scripts. No additional extensions are needed to use the script.
• Get the script by pointing your browser to this.
• You will be prompted with a security alert. Please click on the ‘Continue’ button.
• The script will be installed as an extension. Refresh the Facebook homepage to see the ‘Filters’ menu.

The script might contain few minor UI glitches. Please let me know if you find any. If you feel some other feature is missing in Facebook, please reach out to me. I shall try to extend this script. If you are looking for a similar solution for Twitter, try this script. 

Update: A new version (v 1.2) is available with three new features – Hide the ‘Likes’ from friends, Hide the friend connection updates, Hide the attachments. You can download the script from here.

Update-1: A new version (v 1.3) is available with two new features – Hide updates from Facebook Places, Hide Facebook Questions. You can download the script from here.

Update-2: Version 1.4 is just released to Userscripts.org. Features included: Hide Facebook Ticker, Show only the filtered posts. You can download the script from here.

Update-3: Version 1.5 is just released to Userscripts.org. Features included: Fix for new Facebook UI, Hide unread count of Groups / Lists updates. You can download the script from here.

Userscripts.org seems to go down frequently these days. Here is an alternate link to the script. Source code is available here.

-- Varun

[How to] Filter out tweets on New Twitter interface

Twitter has been rolling out the preview version of its new interface and I got the chance to try it out just few days back. One of the basic functionalities which is missing even in the new interface is the ability to filter out tweets. Twitter is a nice medium for catching up on the latest happenings. But, at times, you might get bombarded with tweets (all of which carrying the  same message) about the same topic from different people and might have to miss some important ones. Filtering is a must-to-have feature in an application like Twitter but Twitter is yet to realize the need for it. However, this feature is already available on some of the popular Twitter clients like Tweetdeck. I have written a simple GreaseMonkey script to add this functionality to New Twitter.

Features

• Filter out a person. If a person on your timeline is on a spamming spree, you can temporarily unfollow him / her using this feature. Typical example for this could be a person attending a conference / tech talk and live tweeting from there. His / her tweets might not be applicable outside the conference room. You can use this feature to temporarily unfollow the person.
• Filter out keywords. Filter out tweets containing a set of words. You can enter multiple words separated by a comma. This will prevent your timeline getting flooded with the trending topics.
• Remove hyperlinks. In the past few weeks alone, there were two different cases of XSS attack on Twitter. This feature will safeguard you from these sort of attacks to some extent by removing all the external links from your timeline.
• Filtered count Indicator. The filtered tweets are not gone for ever. You can clear the filters to view them. The number of tweets filtered out will be shown intuitively on the ‘Filters’ menu itself.
• Remember your settings. The script has the ability to remember your filter settings on the browser and will reload the same when you sign in again. Also, the script applies the filters on new incoming tweets as well (with a max time lag of 15 secs).

How to install?

Compatible Browsers: Firefox 3+, Chrome 4+

Firefox 3+

• Install the GreaseMonkey add-on for Firefox from here and restart the browser.
• Get the script by pointing your browser to this.
• GreaseMonkey Installation dialog box will appear. Please click on the “Install” button.
• You are all set to use the script. Refresh the twitter homepage. ‘Filters’ menu will appear next to ‘Messages’ menu.

Chrome 4+

• Chrome has native support for GreaseMonkey scripts. No additional extensions are needed to use the script.
• Get the script by pointing your browser to this.
• You will be prompted with a security alert. Please click on the ‘Continue’ button.
• The script will be installed as an extension. Refresh the twitter homepage to see the ‘Filters’ menu.

The script might contain few minor UI glitches. Please let me know if you find any. If you feel some other feature is missing in Twitter, please reach out to me. I shall try to extend this script. If you are still on old Twitter and looking forward to one such script, try this script. If you are looking for a similar script for Facebook updates, try this script.

Userscripts.org seems to go down frequently these days. Here is an alternate link to the script. Source code is available here

-- Varun