# My Blog Has A New Home!

Hey!

I hope all is going well.

It’s Eid Ul Fitr today. So a big Happy Eid to y’all.

I’ve an announcement to make. From now on, I’ll be blogging right from my own website.

So don’t forget to bookmark junaidqadir.com

Stay blessed and have fun!!

# I Can’t Search For Past Timeline Posts On Facebook. What?

If you think you can do “all” sorta things on Facebook, think again!

Well, looks like for Facebook guys its a hell lot more work than the Privacy-Killer Graph Search.

I think its all bout priorities vs creating hype.

I think its about what you WANT vs what your users NEED.

# A Case of Bad User Experience

Last week I have been working on a couple of projects. I use Windows, unfortunately on my company-provided Dell INSPIRON. Apparently I haven’t changed anything to the system in terms of (un)installing applications except I was just preparing a keyboard layout for a friend. After getting done with the thing , I wanted to try it out on my system but soon I found out that I have the same keyboard already installed. Which I went on to uninstall and rebooting my system. As I logged in, this dialog popped up and stayed for a while, while I wondered what on earth this thing doing to my system!!

The title-bar says “Launching Application”. Come on! you don’t want me to guess what application. We are not playing some kind of guess game here! Its my PC man!

You PC starts and you see some crazy thing like this, definitely you’re going to react.

This is Windows. Its not 3.1 or 95 or Millennium or 98 or even XP, its The Microsoft Windows 7!

Whatever it was it was some .Net app. Now I’m not sure whether it was caused by my keyboard layout or something else, but this is the worst user experience.

The dialog has conversation but its talking something which user fails to understand. Its not clear which application is being referred to, and the dialog disappears on its on not giving me any information what happened afterwards, Whether the app failed or was successfully installed. In any case the user was kept in darkness.

For me I’ll dig it up, I have to look it up in the event viewer, but what about the average user?

Will they have to live with that clumsy dialog box who is master of its will.

This blog is moved to junaidqadir.com

NEWS: Bootstrap 3 is out! Currently a RC1

Earlier today, I was working on a web app with Twitter Bootstrap and I was required to have tabs which the user can add or remove. Unfortunately Bootstrap doesn’t give you the close button on a tab out-of-the-box. So I quickly went to the Bootstrap’s Issues page on GitHub where I stumbled upon the very problem I was facing.

A guy, one of the maintainers of the project was of the opinion:

I don’t think we’ll be adding this as native functionality, but feel free to file an issue later if you wish to add whatever solution you come up with to the wiki for forks/extensions/etc.

I was like wow! Now, everyone was proposing their way of doing it. So, I came up with my solution thanks to this guy who proposed this solution. He just gave an heads-up and that was all I needed, then I sat and wrote the three features I needed i.e. Add, Remove and renumber the tabs (if in case one is removed from the middle. and yeah, the first tab cannot be removed).

## The Code

The following code assumes Bootstrap and jQuery scripts and style are loaded accordingly and the code is called on

$(doument).ready() and var pageNum = 1; is defined in the global scope (I know I know :)). /** * Add a Tab */$('#btnAddPage').click(function() {
pageNum++;
$('#pageTab').append($('&lt;/pre&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#page' + pageNum + '&quot;&gt;' +
'Page ' + pageNum +
'&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;pre&gt;

'));

$('#pageTabContent').append($('&lt;/pre&gt;
&lt;div class=&quot;tab-pane&quot; id=&quot;page' + pageNum +         '&quot;&gt;Content page' + pageNum + '&lt;/div&gt;
&lt;pre&gt;
'));

$('#page' + pageNum).tab('show'); }); /** * Remove a Tab */$('#pageTab').on('click', ' li a .close', function() {
var tabId = $(this).parents('li').children('a').attr('href');$(this).parents('li').remove('li');
$(tabId).remove(); reNumberPages();$('#pageTab a:first').tab('show');
});

/**
* Click Tab to show its contents
*/
$(&quot;#pageTab&quot;).on(&quot;click&quot;, &quot;a&quot;, function(e) { e.preventDefault();$(this).tab('show');
});

/**
* Reset numbering on tab buttons
*/
function reNumberPages() {
pageNum = 1;
var tabCount = $('#pageTab &gt; li').length;$('#pageTab &gt; li').each(function() {
var pageId = $(this).children('a').attr('href'); if (pageId == &quot;#page1&quot;) { return true; } pageNum++;$(this).children('a').html('Page ' + pageNum +
});
}


## The Demo

Check out the demo here.

Please like and share the post if you enjoyed it and if it helped you.

# WordPress Code Generators

Hi,

Let me quickly share with you some useful code generators specifically for WordPress. If you are into developing or customizing wordpress themes and plugins, these tools come in really handy.

GenerateWP (This one’s my fav so far)

Themergency

WordPress Theme Generator by yvoschaap.com

If you know other than the ones I menetioned would be great!!

# Vimeo: How to search videos like a ninja?

Vimeo has a rich database of many amazing videos contributed by millions of users and producers.

The plus point (out of many): its ad-free.

The point that freaks me out: search.

Believe it or not Vimeo has no idea what a user is looking for, making you believe that the content you are looking for doesn’t exists on Vimeo.

Before you dump Vimeo of for good, let me share a little secret with you and you will be searching Vimeo like a ninja.

I’m sure Goolge is your best friend (if not,its time to do so).

So, without further delay here’s the secret:

All you have to do is:

• type vimeo and the video title you are looking for on Vimeo

e.g: vimeo be here now ray lamontagne

# Turning Goolge Instant Search suggestions off

Google Instant can save 2-5 seconds per search

But for me 2 or 5 second should not be a big deal at all. As I have a slow connection most of the time therefore the “Instant” predictions stays disappeared for longer than 5 seconds and that becomes annoying for the curious searchers. Then I’d be like “get me out of here!” after refreshing the page numerous times.

So, how can you turn that thing off?

# What is a good logo or icon to represent JavaScript?

Its hard to put an image to this language, let along reach consensus.

View Question on Quora

# jQuery – Prevent Multiple AJAX Requests

Many times we do not want to take any other requests of the same type while one is still in progress.
A normal post request looks something like:

function doSignup(){
$.post('http://my-awsomesite/ajax.php',$('#signupForm').serialize(),
function(resp){
if(resp.status == 'OK'){
}else{
}
}, 'JSON');
}


Suppose, if we call the function using a link,

<a href="javascript:doSignup()">Signup</a>


Someone does repeated clicks and an enormous amount of requests will be off their way to choke the server to death!
So, to process one request at a time, we’ll modify the above function to something like this:

/**
*Let's define a variable that acts similar to the 'On Air' light. When
*its active (true in this case), we will just return from the doSignup function
* silently or inform the user via a jquery-ui dialog or something like that.
*/
var isProcessing = false;

function doSignup(){
if(isProcessing){
/*
*This won't go past this condition while
*isProcessing is true.
*You could even display a message.
**/
return;
}

/**
*set isProcessing to true right before the $.post (or anyother method *of the sort like$.ajax, $.get) is called */ isProcessing = true;$.post('http://awsomesite/ajax.php',  \$('#signupForm').serialize(),
function(resp){
isProcessing = false;
if(resp.status == 'OK'){
}else{

}
}, 'JSON');
}


The code is pretty straight-forward, you define a variable that is visible to your function.
Then inside your function you write a conditional statement to check whether the variable is true, initially it is false.
If it’s false then the code continues and just before the AJAX action (get, post, etc) is performed, you’ll change the variable to true. And as soon as the AJAX action completes its trip to the server, you turn that variable to false again.
While the AJAX action is processing if the user tries to click the signup link, either you prompt him/her to wait or simply ignore his actions.

As I mentioned earlier of repeated user clicks, another concern arises, we have to tackle after how much delay a request should go in order to prevent unnecessary requests to the server. I’ll try to cover that in a future post.

Thanks for reading, have a great weekend.

# Troubleshooting the PATH Environment Variables in Windows

Have you been freaking out whole day about why the heck the command prompt keeps throwing an error instead of just executing it, saying that

‘foo’ is not recognized as an internal or external command,
operable program or batch file.

and you can clearly see that c:\foo is in the PATH of the Environment Variables.

When I tell you that you have an extra space just after the ; then you’d be like “hey! that was pretty easy man!”.

In case you are still in a limbo, let me tell it the ol’fasioned way.

Remove any spaces after of before the semicolon that separates paths in the PATH variable otherwise system cannot find the program you want to run from the command prompt.

The program foo won’t work:

PATH=c:\windows\system32; c:\foo;c:\bar\bin
PATH=c:\windows\system32;c:\foo ;c:\bar\bin

I hope that helps someone out there.