Monday, January 30, 2012

ghc error: cannot open shared object file

When trying to configure the latest binary of ghc (7.0.4) under Kubuntu 11.10, you might most probably get an error like: " cannot open shared object file". You need libgmp3c2 installed before trying to configure ghc.
sudo apt-get install libgmp-dev libgmp3-dev libgmp3c2
Now you can do a ./configure.

Monday, January 23, 2012

Compile and Install BigInt as a Shared Library in Kubuntu

BigInt is an awesome library that allow us to write C/C++ programs that use arbitrary precision arithmetic. Here we'll go through on how to setup the library as a shared object under GNU/Linux (Kubuntu).
#Download the library
wget --no-check-certificate
#Extract it
tar -xvf bigint-2010.04.30.tar.bz2
#Rename it to bigint
mv bigint-2010.04.30 bigint
#copy it to the include dir
sudo mkdir -p /usr/local/include/bigint/
sudo cp bigint/* /usr/local/include/bigint/
#creating shared library
#create object files
g++ -fpic -c
#create shared library called which can be invoked using -lbigint
g++ -shared -o BigInteger.o BigIntegerAlgorithms.o BigIntegerUtils.o BigUnsigned.o BigUnsignedInABase.o
#copy it into the local lib dir
sudo cp /usr/local/lib/
#configure ldconfig (dynamic linker runtime bindings) to rebuild the shared library cache
#note that ldconfig should contain the path where you copied the file
#/usr/local/lib is already added. You can add additional paths in /etc/
sudo /sbin/ldconfig -v /usr/local/lib
-fpic or -fPIC means position independent code.
Now that the library & the environment is ready, let's write a small program and verify it.
// big.cpp
#include <iostream>
#include <bigint/BigIntegerLibrary.hh>

using namespace std;

int main()
BigInteger a = 31415926535;
cout << a * a * a * a * a * a * a * a << endl;
return 0;
Compile & run
g++ big.cpp -o big -lbigint

Sunday, January 22, 2012

Kubuntu 11.10 Installer Crashed

I got this weird bug that tells that the Kubuntu installer has crashed. I tried to install three times and the same thing happened. Later I changed the file format for the root partition and everthing got sorted out. The problem was that I was using btrfs as the file format for the root partition, which lead to the error. Now that I have changed to ext4 for root, Kubuntu installs fine. You can use btrfs for other partitions like /home and not for root at the moment.

Sunday, January 8, 2012

Change URL of blog posts in blogger

Sometimes, after editing your post, the URL for the blog post might end up like _02.html. So to edit the url, there are two ways. If you don't have any comments, then you can create another post with the desired title, so that the url follows the title, and paste the contents of the post. Then you can schedule the post to be somewhere near the original post's date and time, and then publish the new post. After that you can delete the old post.
If you seriously messed up the urls, then export the blog & it's template. Then rename the current blog to a random address, and create a new blog with the original blog's address. Import the posts and template to the newly created blog and delete the old blog.

Saturday, January 7, 2012

Tooltip on Hovering Links

We can use CSS alone to display tooltip when we hover on links. The idea is that we'll add a span tag to the anchor text and hide them initially using display: none; for the span tag. Only when we hover, we'll display the span tag by changing display to block.
Say I need to show tooltip "..lost in silence" when I hover on a link with text 'kadaj'. Then the anchor tag will be
<a id="t1" href="">kadaj<span>..lost in silence</span></a>
and the CSS for that is
/* hide span tag in the anchor tag (which is our tooltip) */
#t1 span {
display: none;

/* on hover show the span tag (tooltip) */
#t1:hover span {
display: block;
position: absolute;
top: 11em; /* depends on the position of the link */
left: 6em; /* depends on the position of the link */
border-radius: 3px;
text-align: center;
font: 10px Verdana, sans-serif;
padding: 0 .5em 1.5em .5em;
margin: .5em;
width: 13em;
z-index: 100; /* to show on top of other elements */
border:1px solid darkcyan;
background-color: lightcyan;
opacity: .9;
color: black;

/* styling tooltip image */
#t1:hover span img {
position: relative;
top: .7em;
left: .2em;
z-index: 100;
The only thing that changes is the top and left value depending on where the tooltip should appear when you hover on the link. However, there is a drawback when using this method. It will work only if the position of the link is fixed. Here we are using absolute position for the tooltip, so if the position of the link changes, the position of the tooltip won't change, unless you use javascript and change it accordingly. It is good for pages with fixed layout. Not ideal for blog posts, where the position of the post changes when new posts appear.

Friday, January 6, 2012

Detect if the current page is running in an iframe

This is a code snippet to detect if the current page is running in a frame or not.
if (top === self) {
//not in an iframe
} else {
//in an iframe

Page Navigation for AJAX driven websites using Html5 History API

Html5 History API provides a way to maintain history of the current session. This information can be used for page navigations. It will really come handy when you are using AJAX to load pages and want to have browser navigation (back/forward) active. Using Html5 History API, we will maintain the history and use it for navigating back and forth using browser's navigation button. We will use 'hashchange' event and hashtags for urls.
To navigate using the browser's default navigation buttons, i.e, by using the back and forward buttons, there must be a change in the URL. The navigation buttons get active only if the URL of the current window (page) changes. When we use AJAX (JSON), the URL of the current window doesn't change. So we won't have any active navigation, which implies, no history as well.
To add hash to the URL without causing the page navigation, we'll use
window.history.pushState(null, "", "#hashtag") method. We need to be concerned mainly about the third parameter, which is the hashtag string. After that we'll trigger a 'hashchange' event $(this).trigger("hashchange");.

These are some of the notable functions in the history API.

window.history.pushState(data, title, url)
@param data
data is generally something that is specific to the context of the particular page.
Say in the first page you retreive data in JSON format. Say our data is:
page: '1',
title: "Tutorial",
category: "Html5",
desc: "intro"
So when we want to navigate to another page we can save that data so that, the next time when we revisit, popstate will fire and you can retreive the data through event.originalEvent.state object.

@param title
The second parameter can be any string.

@param url
Can be hashtag or a string. Note that you can't change the baseURI,
or it will throw SECURITY_ERR exception. Otherwise it will be easy for URL spoofing. This value will be appended to the baseURI without loading the appended URL. This will activate the browser history, so that we'll have active back and forward button.

The 'popstate' event
When you navigate in history, popstate will be fired, and the data corresponding to the state will be popped. Theses data objects are kept in a stack using the pushState function explained above.

This variable will contain the current hashtag of the window

The 'hashchange' event
'hashchange' event is will be fired whenever there is a change in navigation, i.e if you travel back and forth in history, each time the hashchange event will be fired. So we can listen for the hashchange event and depending on the hash, which we can obtain from window.location.hash, we can take the necessary action. Since we already listen for the hashchange event, we'll trigger the event when the user clicks the page's anchor link to go to that particular page. Otherwise, we can write a separate way to deal with clicking anchor links as opposed to clicking back/forward buttons, which isn't really necessary. So that's the reason we trigger 'hashchange' event manually.

window.history.replaceState(data, title, url)
This function is same as that of push state. But instead of pushing a new state to the stack, it will replace the top state (from the stack) with the one specified in this function.

Live Demo | View Source

Tuesday, January 3, 2012

Add script tags to DOM dynamically using javascript

Here is a little snippet for adding <script> tags dynamically to your html file using javascript and DOM api.
// Add scripts to DOM by creating a script tag dynamically.
// @param {String=} url Url of a js file
// @param {String=} src Script source code to add the source directly.
// NB: At least one of the parameters must be specified.
var hookScripts = function(url, src) {
var s = document.createElement("script");
s.type = "text/javascript";
s.src = url || null;
s.innerHTML = src || null;
// usage eg:
hookScripts('url/path/to/myscript.js'); //url
hookScripts(null, 'alert("hello");'); //giving the source code directly
We use the native DOM API instead of jQuery for this particular case because of the way jQuery treats <script> tags. jQuery inserts script to DOM, then evaluates the script separately and then it removes the tag from the DOM. So you won't see the script tag, but the script will get executed.

Add stylesheets to DOM dynamically using jquery

This is a code snippet to add stylesheets to DOM dynamically using javascript.
// Add stylesheets to DOM by creating a link tag dynamically.
// @param {String} url The stylesheet url.
var hookLinks = function(url) {
var link = $('');
type: 'text/css',
rel: 'stylesheet',
href: url
//usage eg:

Import emails from Thunderbird to Windows Live Mail Client

Windows Live Mail client looks better than Thunderbird. If you want to migrate to Windows Live Mail client from Thunderbird, then do as follows:
1. First, you need to backup the Thunderbird folder under the C:\Documents and Settings\<your-user-name>\Application Data folder and any local folders if any.
2. Install ImportExportTools add-on and restart thunderbird.
3. Right-click on the folder which contain the mails you want to export. Say Inbox, Sent Mail etc, and choose Import/Export -> Export all messages in the folder to EML Format from the context menu. Choose a location to save the exports, say C:\mails\eml-format\Inbox for inbox and C:\mails\eml-format\Sent Mails for sent mails.
4. Open Windows Live Mail client and from the File menu choose Import -> Messages -> Live Mail. Choose the directory from the previous step where we saved the mails. So at first we will import mails from Inbox folder, so we'll choose C:\mails\eml-format\Inbox folder. Click Next and choose All folders, and complete the import wizard. Similarly for the other folders.
5. If you have successfully imported the emails, then it will be shown under the Storage Folders -> Imported Folders section on the left pane. Now you can select all the emails under that folder and drag-and-drop to Inbox or any other folder, and organize them accordingly.
5. Voila! Enjoy new Windows Live Mail client.

Generating diff files

To generate diff between two files the command is:
diff -ru originalfile modifiedfile >patch.diff
diff -ru script.orig.js script.js >bugfix-1234.diff
If you are using IDEs like Eclipse with SVN plugins, then to generate a diff file, right-click on the file and choose Team -> Create Patch -> Save in File System (browse to the directory of your choice and give the file a name, say patch.diff) and click next. Choose Selection and click Finish.

Monday, January 2, 2012

Install HDBC-sqlite3 in windows

HDBC-sqlite3 is a package that provides support for sqlite db interaction for Haskell. To install it in Windows you need to have sqlite source.
1. Download the sqlite source code and extract to any directory, let's say 'C:\sqlite'.
2. Run
cabal update
cabal install HDBC-sqlite3 --extra-lib-dirs=C:\sqlite --extra-include-dirs=C:\sqlite