Oculus Rift

The Oculus VR company was recently bought by Facebook for $2 billion. Since, the company started 2 years ago my husband has been talking about it non-stop and will be the first in line when it goes public, even if many are unhappy about the Facebook buy out.

Oculus promises to take Virtual Reality to a whole new level, and Facebook plans on keeping up development of Oculus Rift their Virtual Reality Head Set. Check out this article that explains why Oculus Rift is going to be awesome. 7 Ways the Oculus Rift Could Change Entertainment as We Know It

According to the website you can pre-order your developer kit now for $350 and they expect to start sending them out July this year.

Pre-Order yours here

Replace All Not Replacing All Matching Substrings in CF 9

We have a process consuming data that is pipe delimited. As a part of this, we need to ensure that empty spots have spaces in between the pipes, so that each cell will keep its original position, because ColdFusion ignores empty list elements. I recently ran into an issue where we had multiple pipes, containing empty elements, occurring immediately next to each other - but the replace all was skipping over every other instance where our search string was side-by-side another instance of the search string.

For example, if this is our original string, "1|2||4|5||||9", our expected result was "1|2| |4|5| | | |9".

[More]

Safari issue with showing loading graphic on click

Untitled Document

Life as a web developer means checking your code in all browser environments . The unfortunate reality is that sometimes we do not do this and eventually come across something that does not work in one browser by accident. Recently I had an issue where Safari on a Mac was causing issues.

The issue was reported that the standard design pattern of prompting the user from a link click or form submission with a loading indicator like an animated GIF with javascript was not working in the most recent version of Safari on Mac. Upon testing the issue reported was correct and the loading graphics were not showing.

Here is what the code looked like that did not work in Safari.

 

view plain print about
1function goToLink(){
2        
3        $('#somediv').html('<img src="loading.gif" > Loading...');
4        window.location.href = 'link.html?';    
5            
6    }

The issue I found is that Safari for whatever reason does not allow or show DOM manipulation after a link is clicked or form is submitted. To fix the issue you need to delay processing to allow time for the DOM to be changed to show the loading image and then execute the browser change location. Here is an example of how to do this...

 

view plain print about
1function goToLink(){
2        
3        $('#somediv').html('<img src="loading.gif" > Loading...');
4        setTimeout(function(){
5            window.location.href = 'link.html?';    
6        },1000);
7
8            
9    }

 

 

 

Using Modernizr to Detect HTML5 Feature Support

The problem: you want to use HTML5 features or libraries on your site, but you also want to support older browsers. Fortunately there is a library called Modernizr to help. Because HTML5 is not simply one thing, it is not possible to simply detect HTML5 compatibility as a whole, and using browser specific checks is an archaic practice that is not a solid solution because some browsers do have partial HTML5 support which means those users would miss out on content regardless of browser support. Instead, the proper method is to detect support for specific features of HTML5. Modernizr makes this process easy.

An example of this would be HTML5 video. In order to use Modernizr to check for this it is very simple.

Example index.html:

view plain print about
1<!-- Place the include in the head after any CSS includes. --> <!-- This should in the head because HTML5 Shiv (included library to enable HTML5 elements in older versions of IE) must execute before the body and if the page uses any CSS from Modernizr this will prevent a "flash of unstyled content." -->
2<head>
3    <script src="modernizr.min.js" type="text/javascript"></script>
4</head>

Example script.js:

view plain print about
1if ( Modernizr.video )
2{
3    if ( Modernizr.video.webm )
4    {
5        // Try WebM
6    }
7    else if ( Modernizer.video.ogg )
8    {
9        // Try Ogg
10    }
11    else if ( Modernizr.video.h264 )
12    {
13        // Try H.264
14    }
15}
16else
17{
18    // No HTML5 video supported, at this point you can use a flash player or another solution.
19}

Modernizr works for many other HTML5 features as well miscellaneous things such as CSS3, geolocation, SVG, WebGL, and more. For more information and to download Modernizr, visit http://modernizr.com/.

Casting to Scientific Notation

I came across an issue a couple of months ago, where I had received a bug report that the numbers in a report we were generating were incorrect. There were two percentages that when added together should have totaled to 100%.

To get this percentage we have very large numbers that are added together and used cast(sum(NUMBERS) AS varchar) to obtain them. I couldn't find any correlation with the size, but some of the numbers were returned by the query as scientific notation, so instead of getting 1227630000 we got 1.22763e009. We then required ColdFusion to do some more calculations to determine the percentages, but ColdFusion didn't know how to handle the scientific notion so it just didn't and we added 1.22763 instead of 1227630000, which is a huge difference when you are calculating values.

To fix this issue we just removed the cast around the sum statement.

Unnecessary Curly Brackets in ColdFusion's CFScript

Recently I came across an issue where a variable was being set, when the expected result was that it shouldn't have been. The code was written in CFScript for ColdFusion 9, and involved some rogue curly brackets.

In essence, the code was trying to perform an if/else statement using CFScript syntax, with the executable blocks surrounded by curly brackets - however, it was missing the else before the second block. Below is a very basic example of what the code looked like:

[More]

Input Tags and Double Quotes

Today I came across a support issue that took me a little while to figure out.

The Original Problem - A user said that the field in a form was smaller than it used to be because the text he entered was being cut off and asked if it could be made bigger.

What It Could Have Been - First I checked the database thinking that if it was varchar(50) I could make it bigger, but when I looked it was of type text which has a max of over 2 billion characters. So, this wasn't where the problem was unless they were trying to type a novel into the text area. Then, I looked at the Input box which was a textarea which didn't have a maxlength set for it, I couldn't find the default maxlength for a textarea, but when I input what the user was trying to input I was able to do it with no problem so this wasn't the issue either.

The Real Problem - I then noticed that this was a two part form the first page (Form 1) collected some information and then continued to a second page (Form 2) that wanted more detailed information about answers on Form 1. After Form 2 was filled out the whole thing was submitted and inserted into the database. In order to do this all the fields from Form 1 had to be hidden input fields on Form 2. When I viewed the form details on Form 2 I could see that the field I had just entered was cut off. To test I did two dumps of the form variable I wanted one at the top of the page and one just before it was set into the hidden input value both on Form 2. They were both complete and as expected, but the hidden input value was still cut off. I then realized that the user put part of the text he inputted in double quotes so when the value field in the hidden Input hit the first double quote it assumed that it was finished and ignored the rest of the text.

The Fix - I found this fix online <input name="width" value="#HtmlEditFormat(Form.Width)#" /> it allows the full text to be inputted without cancelling out early even if there are double quotes.

The solution was found here.

Query of Queries to the rescue

Sometimes SQL is slow when using a LIKE operation. Recently I came across a situation where a rather complex query that regularly returned anywhere up to 1K+ rows was running great and returning results within seconds. As soon as a LIKE statement was inserted into the query to filter that query by first and last name of "Users", it slowed to a crawl. The query went from return results on average from 2 seconds to 50 seconds. After identifying the LIKE against the name columns was the cause we tried optimizing and indexing the table columns we were searching, but this only brought the query time down to 30 seconds which was not acceptable.

This is where I had to think creatively. If the original SQL query without the LIKE in it returned results in an average of two seconds why not just filter that query by name. This is where Coldfusions Query of Queries came to the rescue. By taking my LIKE statement out of my SQL and then re-querying the results with a QoQ I was able to get immediate results when filtering by name. In my opinion Colfdusions Query of Queries rocks.

view plain print about
1<cffunction name="filterQuery" >
2        <cfargument name="searchQuery">
3        <cfargument name="search_name" required="false" default="">
4        
5        <cfset var returnQuery = ''>
6        
7        <cfquery dbtype="query" name="returnQuery">
8            SELECT * FROM arguments.searchQuery
9            WHERE 1 = 1
10            
11            <cfif arguments.search_name neq ''>
12                AND
13                (
14                    LOWERR(first_name) LIKE '%#LCase(arguments.search_name)#%')
15                    OR
16                    LOWERR(last_name) LIKE '%#LCase(arguments.search_name)#%')
17                        
18                )
19            </cfif>
20        </cfquery>    
21        
22        <cfreturn returnQuery>
23        
24    </cffunction>

Do you use StructKeyExists over isDefined?

We have an official best practice of using StructKeyExists over isDefined in our ColdFusion applications.

Based on my understanding (detailed in this stack overflow forum post), StructKeyExists is more efficient and accurate, because it knows exactly which scope it needs to evaluate, whereas isDefined still has to check all available scopes.

[More]

Expedia makes $12 million by removing one form field

This is an old news story, but the lesson definitely still holds true today.

Too many form fields and confusing potential customers and website visitors can cost you a LOT.

ConversionVoodo wrote a great article about how Expedia changed one form field and saw a $12 million dollar profit increase.

This is worth a few minutes of your time. It definitely brings home the point that less is more in form design and small changes in UI and UX can have HUGE impacts on your business and bottom line.

More Entries