Thursday, August 1, 2013

One of the reason that "why I hate IE"

Recently, I got strange issue with showModalDialog and IE 7/8. Actually I want to implement some gradient background for button. For gradient, we need to define CSS property as per browser, so I have set gradient background for major browser like Chrome,Safari,FireFox,Opera and IE.
Have a look my button CSS looks like:

.myFancyButton{
	background: #2491c6; /* Older browsers */
	background: -moz-linear-gradient(top,  #7ABCDC 0%, #2491c6 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7ABCDC), color-stop(100%,#2491c6)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #7ABCDC 0%,#2491c6 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #7ABCDC 0%,#2491c6 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #7ABCDC 0%,#2491c6 100%); /* IE10+ */
	background: linear-gradient(top,  #7ABCDC 0%,#2491c6 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ABCDC', endColorstr='#2491c6',GradientType=0 ); /* IE6-9 */
}

All things working fine, but after implementing this CSS to my project I found the strange issue from client that button didn't work with model window. For pop-up window display, I'm using showModalDialog and I identify that button is working only when I click on buttion text value. It's not work if I click inside the button but not on buttion text value. At this time I check same in FireFox and it's working well but in IE7/IE8 I don't know why it's not working. And that is the reason I hate IE.

After some workaround on this and I found that if I'm removing all browser specific CSS property for Chrome,Safari,Opera, it's works well in IE. So, now my buttons CSS looks like:

.myFancyButton{
	background: #2491c6; /* Older browsers */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ABCDC', endColorstr='#2491c6',GradientType=0 ); /* IE6-9 */
}


There are many reasons to hate IE but here I have just mention one. If you have any reason to hate IE, please do comment below......

Tuesday, July 30, 2013

Get Android 4.3 Update forcefully on Nexus4

Recently, Google release Android 4.3 updates but when I check system update on my nexus4, it's shows no updates available and it's still stuck to 4.2. But one of my friend have got update on his nexus4.

Then I found some tricky solution of this. Please follow below steps:
If you haven’t received the update yet, go to Settings and select Apps. There select “All” and scroll till you find Google Services Framework. Select that and click on “Clear Data”, which would give you a warning. Disregard the warning and go ahead with it. Once done, go back to Settings, scroll till the end and select “About phone”. From there select “System updates”. It would show last checked for update sometime in 1970, which is alright. Now check for update again. It takes a few attempts and if you don’t get the update, repeat all the steps again. 

Also, I have repeat this steps 2-3 times and then I got the update :). Hope this works for you guys.

Monday, July 15, 2013

Strange Behavior of Javascript

Hello everyone,

I found some strange behavior of Javascript. Let's look below Javascript statements:

 var myArra = [null,undefined,[]];  
 console.log(myArra == ',,');  


When I'm going to execute above statements in my firebug console, console.log returns 'true'. I don't know why and how can it possible because I'm comparing array with the string value. Can anyone explain why Javascript behaves this?

Let's look one more scenario

 var myArra = [0];  
 console.log(myArra == ! myArra);  


Above statement also logs 'true' in my firebug console. Anyone have any idea on this?? Can anyone explain above both scenario??

Friday, July 5, 2013

Tools For The Young UI / Web Developer


Some interesting Front-end tools to build high performance and cutting edge application.

EditorConfig
Used to maintain consistent coding style between different editors and IDEs.

LiveReload
It's one of the my favorite tool. It monitors changes in file system and once you save a file, your browser is automatically refresh the page to reflect your changes. It is very cool when you change a CSS file or an image, the browser updated instantly.

Grunt
Grunt - The JavaScript Task Runner. It's used for concatenating files, minifying files and for css/javascript linting.

Sublime Text Editor
Sublime Text is a sophisticated text editor for code, markup and prose. You'll love it's extraordinary features - one of my favorite is: quickly navigate between files and filter on files and directories names.

Sunday, March 31, 2013

ROWID with Oracle thin clinet datasource



In one of my CF project I was using my datasource with JDBC driver from CF admin. But recently, I have upgrade my webserver to Weblogic 12c as well as I have start using my all datasource with Oracle thin client driver from Weblogic Console. Most everything is working, however, there was one section of legancy code where I got error.

This error is related to a column named 'ROWID' which is a built in 'column' in Oracle that returns a unique value for each row in a database. Its king of like a UUID. When I did a <cfdump> of the query, I noticed that the value of the ROWID column was not a string, but a Java object of type 'oracle.sql.ROWID'.

Here is a snapshots of <cfdump> of my query:

Recent, I was using my datasource with JDBC driver from CF admin and that time I noticed that the value of the ROWID was string. Here is a snapshot of the <cfdump>:

As off now to overcome this issue, In my query I have just used in built function of Orcale 'rowidtochar()' which converts the rowid value to string value and I got the string value in my query object. But still I think that this is not a proper solution because I need to do this change every where I've used 'ROWID' in my project. There may be some settings with Oracle thin client driver that I need to do. Anyone have any idea about this please share......

All in all, a lot of time was not wasted on this issue, but it does bring an important point to light. When you are dealing with any upgrade or going to use any different environment, you need to be aware of how those different environments might behave – such as what is returned from a query.

Sunday, March 17, 2013

How to pause execution of javascript for sometime

Today, I was just looking into the ways to pause or wait or delay execution of my javascript statement for some given time. I do some google for this and I got such a really good code snippet - sleep() function from somewhere.

sleep() Function in Javascript

function sleep(milliseconds) { 
        var start = new Date().getTime(); 
        for (var i = 0; i < 1e7; i++) { 
                if ((new Date().getTime() - start) > milliseconds){ break; } 
        } 
}

Usage

//Sleep for 1 second (1000 milliseconds). 
console.log(new Date()); 
console.log('Dude!'); 
sleep(1000); 
console.log(new Date());


Sunday, February 24, 2013

LESS - Dynamic Stylesheet Language

LESS is a dynamic stylesheet language meant to extend CSS with thing like variables, mixins, operations and functions. Please click here to find out more about LESS.

Why not Plain CSS?

I don't know which one is better LESS or the plain CSS. However, for now LESS is really comes down to customization and reuse of the code. But the question is raise in my mind that with the LESS, browser need to interpret and compile the LESS CSS class every times and which may decrease web page performance. So why LESS??

Please let me know your suggestion in comment and correct me if I misunderstood about LESS. It's really confuse me that what to choose LESS CSS or normal plain CSS.