Skip to main content

Posts

JavaScript debugging with Chrome Developer Tools and some tips\tricks

Last Friday I was having a conversation with Ben Nadel and Jonothan Joyce on Twitter about examining the content of a JavaScript object. While the firebug add-on for Firefox comes in very handy in examining the request\response header and for various other internals, I can’t really debug the JavaScript code by adding breakpoints. I use Google’s Chrome browser for my day to day web application development. Both Chrome and Safari provide ‘Developer tools’ which help the user not only in debugging the JavaScript code but also in examining the content of an object at any point in time by providing watch expressions. What I like about debugging in Chrome is that it is very much similar to how I debug my server-side code using ColdFusion Builder or Eclipse. This certainly reduces the learning curve to understand debugging in a browser. However, Chrome has more to give when it comes to debugging web applications. In this post I’ll explain how Google Chrome can help you debug web applic

File upload and Progress events with HTML5 XmlHttpRequest Level 2

The XmlHttpRequest Level 2 specification adds several enhancements to the XmlHttpRequest object. Last week I had blogged about cross-origin-requests and how it is different from Flash\Silverlight's approach .  With Level 2 specification one can upload the file to the server by passing the file object to the send method. In this post I'll try to explore uploading file using XmlHttpRequest 2 in conjunction with the progress events. I'll also provide a description on the new HTML5 tag -  progress which can be updated while the file is being uploaded to the server. And of course, some ColdFusion code that will show how the file is accepted and stored on the server directory.

HTML5 XmlHttpRequest 2 v/s Flash\Silverlight approach to cross-origin requests

A few days back I had posted on XmlHttpRequest Level 2 , describing how cross-origin requests can be achieved. A few folks on my team asked me how different it is from Flash\Silverlight's approach to achieve cross domain request\response with crossdomain.xml . The approach that these plugins take to send a request and receive a response is completely different from that of XmlHttpRequest's approach.

HTML5 XmlHttpRequest 2 - Cross origin request

HTML5 specification has introduced a few enhancements for XmlHttpRequest object and one of them is the ability to make cross-origin request. That is, a host can send a XmlHttpRequest request to another host and receive a response in return. On the server-side, a check can be made to see whether the request can be accepted from the given origin. In this post I'll try to explain how this can be done using ColdFusion. Client side: On the client side, a XmlHttpRequest object is created and then a GET request is made to the remote server. var client = new XMLHttpRequest(); client.onreadystatechange = readyStateChangeHandler; client.open("GET","http://{remote-address}/{path-to-file}.cfm",true); client.send(); For example, say example.com wants to get a response from another domain say abc.com , then as observed from the above code the request would look like: client.open("GET","http://abc.com/dir1/foo.cfm",true); Serve

Navigation enhancements in ColdFusion Builder 2.0

Do you spend a lot of  time scrolling large files, just to find out the next function definition in place or to figure out the end\start of a tag? If your answer is YES, then why don’t you try the Navigation enhancements in ColdFusion Builder 2.0? ColdFusion Builder comes to you with three types of Navigation enhancements: -          Code Navigation -          Smart Tab Navigation -          Jumping to matching tag. Code Navigation Code Navigation is all about navigating to the next function definition in place. Imagine a CFC containing various cffunction tags. It is a time-consuming task to keep scrolling and keep an eye on the file to get to the next cffunction tag. ColdFusion Builder 2.0 provides a shortcut key CTRL + SHIFT + DOWN to navigate to the next function definition. And to navigate to the previous function definition, you can use the shortcut CTRL + SHIFT + UP. Code Navigation works in conditional statements as well.  Consider an example of a cfif-cfelseif-cfelse condit

Tag replace - Actions in ColdFusion Builder

Tag search is that one powerful feature in ColdFusion Builder 2.0 which allows you to search for tags that match some criteria. Also, there are various actions that the user can perform once the tag is found. Actions such as  'Replacing the tag block' with some text,  'Removing the Tag block',   'Setting an attribute',   'Removing an attribute',  'Adding text before the tag block' and  'Adding text after the tag block'.  In this post I'll explain how these actions can help you increase your productivity in your day to day application development. Action - Setting an attribute Consider a use-case where you would like your ColdFusion application to be available to other web clients such as a HTML client or a FLEX client. In these cases you will have to update the cffunction's  access attribute to remote.  Updating each and every function definition can be a time consuming task. With the action Set attribute  one can specify the attr

A cheat sheet of keyboard shortcuts in ColdFusion Builder

In my last post I have explained about keyboard shortcuts in ColdFusion Builder 2.0. This blog post contains a list of all shortcut keys and I have listed these keyboard shortcuts based on the categories that it falls into. Well, this post was not planned since users can easily get to know the keyboard shortcuts by navigating to the preferences (ColdFusion -> Profiles -> Keys). However, I met Joshua at Scotch on the rocks in Edinburgh and he suggested that it would be nice to have the list of keyboard shortcuts handy. So this post is for those who would like to have the list with them and refer it whenever required. Keyboard shortcuts for inserting text: These are the keyboard shortcuts which are used to insert some text into the editor: Command Keyboard shortcuts on Windows Keyboard shortcuts on Mac Insert anchor tag CTRL + T, L CMD + T, L Insert bold tag CTRL + T, B CMD + T, B Insert br tag CTRL + T, R CMD + T, R Insert cfabort CTRL + T, A CMD + T, A Insert

Forget the mouse, keyboard shortcuts are here - ColdFusion Builder

ColdFuison Builder 2.0 is all about productivity, it has introduced a lot of keyboard shortcuts, about 42 of them. Shortcuts have been provided for inserting text, invoking wizards, shortcuts for all new editor features and shortcuts for Extensions. Want to define a keyboard shortcut for a piece of code? Possible. Not only that, you can also Export and Import the keyboard shortcuts, so that you need not redo the task of defining a list of keyboard shortcuts on a different installation. What comes with ColdFusion Builder 2.0? You get 42 keyboard shortcuts and I know remembering all of these 42 keyboard shortcuts seems to be a daunting task, but the way these keyboard shortcuts have been designed doesn't require you to remember each and every shortcut. The keyboard shortcuts have been grouped into three categories: Insert options, Wizard options and the Extensions options. Each of these categories start with a key combination. For example the Insert options start with CTRL + T and wh

Quick Fix in ColdFusion Builder

Quick Fix is another interesting feature introduced in ColdFusion Builder 2.0. The CFML Editor now provides corrections to the problems found in the file that you are editing. The Editor tries to resolve the CFCs specified at various places i.e. in createObject function, the new operator or the ones specified in the tags cfinvoke\cfobject. The Editor also tries to resolve the functions using CFC introspection. Now if you have declared a CFC or a function which doesn't exist, then the CFML Editor instead of showing an error in document provides Quick Fix suggestions. Quick fix suggestions for components: As shown in picture above, the CFML Editor was not able to resolve the component 'Component1' and instead of showing an error, the Editor has shown a yellow marker indicating that a quick fix suggestion is available. On clicking the yellow marker, a list containing suggestions are shown. On selecting the first suggestion, the component will be created in the same directory

ColdFusion Builder Search\Replace - A new story

ColdFusion Builder 2 (codenamed 'Storm') the next version of ColdFusion Builder is now public beta and it comes packed with several new features. One of the highlights of this release is the ColdFusion specific Search and Replace feature; CFB is an Eclipse based IDE and the search\replace functionality provided in the 1.0 version of the product (codenamed 'Bolt') used the Eclipse's search and replace functionality. Storm now comes with a separate engine for Search and Replace. One can search not only for text but also tags based on the conditions that you specify. The search scope is now widened and users can search over various scopes such as Open documents , Projects , Workingset ,  Workspace , Local directory , Selected Resources and over any of your FTP\RDS connections . And that's not it, you can also perform certain actions on the matches found. In this post I'll be providing an overview and will try to deliver more complex scenarios in the comi

What's new in ColdFusion Builder Storm- picture

ColdFusion Builder - Storm is public beta and you can download Storm from labs.adobe.com. I just completed my session at SOTR and all the new features are on the picture below:

Server sent events with HTML5 and ColdFusion

There are several ways to interact with the server apart from the traditional request\response and refresh all protocol. They are polling, long polling, Ajax and Websockets ( pusherapp ). Of all these Ajax and Websockets have been very popular. There is another way to interact with the server such that the server can send notifications to the client using Server Sent Events (SSE) . SSE is a part of HTML5 spec:  http://dev.w3.org/html5/eventsource/

Game created with jQuery

Last week I had published an application on facebook "Which smartphone is for you?" which was created with javascript and HTML. I have always tried to experiment things with jQuery and HTML. I thought of making a good use of my jQuery skills in creating a game (a simple one - but still fun to play). Today I'm launching this game and it is titled "Shoot your friends". This application (game) pulls the pictures of your facebook friends and you can shoot them. Once you have hit enough, it will allow you to publish the results. You can either let the shot ones know that they have been shot by you or just publish the story to your wall. Login to your facebook account and try it out. Which smartphone is for you:  http://apps.facebook.com/sagarganatra/ Shoot your friends:  http://apps.facebook.com/shootyourfriendsapp/

Speaking at Scotch on the Rocks 2011

The title says it all. I will be speaking at Scotch on the Rocks (SOTR) conference to be held at Edinburgh, Scotland on March 3rd and 4th 2011. I will talking about the next version of ColdFusion Builder codenamed Storm. The speakers and sessions were announced a month back and I must say the session topics look very impressive. Of course there will be sessions on ColdFusion and related technologies, but one would also get to know more about HTML5, Regular expressions, Software Requirements etc,. This is going to be my first ever ColdFusion conference and I'm very excited.

Audio in HTML5

I have been looking into HTML5 and it's capabilities to play audio and video content on the web without requiring any browser plug-in. In this post I will be explaining how one can embed an audio file into a web page and add controls to perform various operations on it.

Showing Notifications with HTML5/Webkit

Most of us use popular twitter clients such as TweetDeck, Seesmic which are developed using Adobe AIR. One thing  I like about these clients is that they show notifications when the application is in the minimized mode. Now with browsers implementing webkit such as Google chrome one can use the notification API to send notification to the browser. In this blog post I will be explaining how one can implement webkit notifications in their web application. 

Server Monitoring in CF 9.0.1 - Multi Server monitor changes

Multi server monitor enables you to monitor multiple ColdFusion instances and at any point one can check the load on the added instance. If your remote server is running on the jetty (please refer to my previous post here ) i.e. when the remote machine has monitoring server enabled then the cross-domain details are required to be specified in crossdomain.xml located under {CF_ROOT} /MonitoringServer/. 

ColdFusion 9.0.1 Server monitoring enhancements

This post gives an Introduction to Server Monitoring Enhancements in CF 9 updater 1. Server Monitoring helps the user to monitor various statistics such as slow requests, load at any point of time, active requests,  requests with errors etc,. In the updater version of ColdFusion,  an embedded server - Jetty is added which listens to a different port: 5500. A page -  Monitoring Settings is added to the administrator where in the user can check the current status of server monitor. This avoids the step of launching and checking whether monitoring, profiling and memory tracking are enabled/disabled. Configuring and starting Server Monitor: By default Server Monitor will run on the same port on which coldfusion is running (i.e. without Jetty). However, to improve the performance the embedded server jetty can be enabled. There are three ways of starting Server monitoring with Jetty on a different port: ColdFusion administrator: Sever Monitoring -> Monitoring Settings. Manually

ColdFusion meets Photoshop

I have been looking into Photoshop very lately and I must say it's the most amazing software that I have ever experienced. I have created a few Wallpapers using Photoshop with ColdFusion as theme. I have referred to few tutorials available on the web and have created these pictures. Feel free to download and use it.

ColdFusion Builder - A few tweaks

ColdFusion Builder sometimes might take a lot of time during startup or when a large project is imported into workspace. This post explains how one can change Builder settings to improve the startup experience. Server settings: If you have added a server to CFB, then you can see at the bottom right corner of the IDE that the CFCs are getting indexed. CFB uses the server settings to provide code assist for datasources, CFCs. This might take a lot of time since it indexes all the files in the webroot. This setting can be disabled in the preferences section. Navigate to Window -> Preferences -> ColdFusion -> Server Settings. Mac users can find Preferences under Adobe ColdFusion Builder (standalone) or under Eclipse (plugin installation). CFB indexes all the CFCs located under webroot and mappings directory for the servers defined. By default these options are checked. One can uncheck 'Build server settings' and can observe that the build is not initiated when the CFB is

ColdFusion Builder - Project Support

ColdFusion Builder is a brand new IDE from Adobe for building ColdFusion applications. ColdFusion Builder is based on Eclipse and can be downloaded from  http://www.adobe.com/products/coldfusion/buy/#cfb . In this series I will be explaining about creating Projects/Applications in ColdFusion Builder. CF Builder provides wizards for creating projects. It also provides wizards for creating CFCs, CFMs and CF Interfaces. I would like to cover the latter in the next post. In this post I will be explaining the project creation with CF Builder. To get started with creating Projects switch to ColdFusion perspective. The project creation wizard can be invoked from four places: Start page -> ColdFusion project. File -> New -> ColdFusion project Clicking New ColdFusion project Icon on the toolbar. Right click Navigator view and select New -> ColdFusion Project. The 'New ColdFusion project' page is as shown below: Enter your 'Project Name' as say 'ProjectTest'.

Populating flex MenuBar items in mx:Script using the data retrieved from ColdFusion

Couple of days back I was looking for a piece of code that would populate a Flex MenuBar dynamically. Googled a lot, but I was not able to find the right solution. However, I learnt that a Flex MenuBar can be populated using XML data; but the examples found declared the XML right within the client with all data. What I wanted is to retrieve an array of objects(MenuBar data) from my database and send that to the client. I used ColdFusion ORM to do this for me. It is so nice to see a few lines of code not just retrieve the data and present it very clean; but also save a lot of time. Let's get started: On the server side I have two CFC's MenuBar.cfc and MenuBarManager.cfc.  MenuBar.cfc contains the mapping data: T_MENU is the table which contains MenuBar data. MenuBarManager.cfc contains a method getMenuBarItems that retrieves all MenuBar data. The output of getMenuBarItems is as shown below: The above dump shows the Column names, their parent and the action to be taken on the

IMAP with CFIMAP

What is IMAP? IMAP stands for Internet Message Access Protocol. IMAP is one of the two most prevalent Internet standard protocols for e-mail retrieval, the other being the Post Office Protocol (POP). Virtually all modern e-mail clients and mail servers support both protocols as a means of transferring e-mail messages from a server. An IMAP connection is a live connection to the server. If folders are created, they exist on your account on the server. If messages are moved or deleted, then they are moved or deleted on the server. With POP3, your mail is saved in a mailbox on the remote server until you check your mail. When you check your mail, all of the mail is immediately downloaded to your computer and is no longer maintained on the server. IMAP can be thought of as a remote file server, while POP3 can be thought of as a “store-and-forward” service. Ultimately they both accomplish similar tasks but often one will suit your needs better than the other. CFIMAP: With CFIMAP tag one can