pukkared

Looping over Arrays

Matthew Cook — Thu, 26 Aug 2010 01:40:28 +0000

I’ve been working in CF 7 a lot lately. This has forced me to look at writing Coldfusion differently from what I’m used to, being Coldfusion 8 & 9. An example is that in CF 7 there is no attribute available in the tag. This means that I have to loop over an array by looping from 1 to however long the array is. There are two ways to loop over an array in CF 7. First is to evaluate the array length with each loop, and the second is to set the length of the loop into a variable and loop from 1 to that value.

To illustrate the first example of evaluating with each loop the code would look like:

and the to illustrate the second example of setting the length first the code would look like:

Lastly, in Coldfusion 8 & 9 you can write it like the following:

So of the first two options, clearly setting the length of the array into a variable has design advantages and should always be the preferred method. Nonetheless I was curious if there was really a performance difference.

I used the following script to loop over an array with 100,000 values using the three above methods.


	



	



	



	





	Number of refreshes: #SESSION.refreshes#









	

















	Using as an attribute - 

	Average: #variables.attributeAvg#

























	Setting length in a varible - 

	Average: #variables.attributeAvg#






















	Evaluating length for each loop - 

	Average: #variables.attributeAvg#

Each was timed and stored in the session. At the end of 10, 25, 50, and 100 page refreshes the average execution speed was determined for each method.

After all was said and done evaluating the array for each loop vs. setting the length and looping to the length was within 4 milliseconds running a loop over an array with 100,000 values. The following chart illustrates the differences.

Hopefully, what is obvious from this is not so much that there is little to no difference in the execution time between pre-setting the array length vs. evaluating it with each loop, but that using the array as an attribute (which can only be used in Coldfusion 8 & 9) of the tag runs much faster than either of the other two methods. About 25 milliseconds faster.

Showing line numbers in Visual C# 2010 Express

Matthew Cook — Fri, 16 Jul 2010 00:44:12 +0000

Thought I would share how to show line numbers for the code editor in Microsoft Visual C# Express because it is less than intuitive. My personal opinion is that the numbers should show by default. It makes a ton of sense to display error locations by line number, but not actually show the line numbers in the code editor.

Anyways, in the top navigation open tools > options dialog. In the dialog make sure you first check the ‘Show all settings’ checkbox in the lower left corner. Now expand the ‘Text Editor’ menu item. Click ‘All Languages’. Lastly check the ‘Line numbers’ checkbox in the options. It should really not be this complicated.

Setting print margins using Eclipse to maintain line character length

Matthew Cook — Sat, 15 May 2010 01:25:20 +0000

Sometimes you may have standard line lengths with which to work when writing code. If this is the case and your using Coldfusion and Eclipse with the cfEclipse plugin you can maintain the character length consistency by setting up the print margins to n character length.

Point being that when running the cfeclipse plugin you need to choose CFEclipse > Editor in the preferences left navigation. In the options you will check ‘Show print margin’, set the ‘Print margin column’ text field to the desired character length, and if you choose the ‘Print margin’ option in the ‘Appearance color options’ select box. Then choose the color you wish the margin to be. This will set a line length that will show in the code editor pane. Of course it will not wrap the line. It is still your duty as a developer to wrap appropriately. Nonetheless it does give you a guide for where the line should wrap at least.

If you’re writing Java then you would select General > Editor > Text Editors in the preferences pane. Although the display is slightly different, generally follow the same steps as above for showing the print margin.

If you’re using Coldfusion Builder you will follow the same exact directions as listed just above for showing the print margins writing Java.

Lastly, if you’re using Flex Builder 3 you will again follow the same directions as above for showing print margins writing Java.

Android LinearLayout tag not stacking elements

Matthew Cook — Fri, 07 May 2010 02:19:34 +0000

This is really more of a reference for myself than anything else. Point being I just spent about half an hour trying to figure out why my TextViews were not showing up in my LinearLayout for my Android application. What I was getting was the top level TextView but none of the others below it. As I moved them around in their order I realized that they were there, but falling behind the TextView on top. So, clearly, the issue is that they are layering instead of stacking.

Just to make sure we’re all on the same page in resolving this issue (which is really not an issue at all) we’re working on a layout XML file for an Android application. So if you’re using the built-in Eclipse Android plugin you will have a main.xml file by default in the res/layout directory. If you delete the XML from this file and add a new LinearLayout from the layout perspective, and then add some TextViews or whatever, you’ll notice that only the top one shows.

So for example.

Does not work

and…

Does work

For whatever reason, when you add a LinearLayout like this it does not include the ‘android:orientation=”vertical | horizontal”‘ attribute. Apparently this is a pretty important attribute. This determines if the assets stack horizontally or vertically. And if not specified no error is thrown, instead it just seems to layer, or possibly just show the top asset. Doesn’t really matter as far as I see it. For those of us who have no idea what we’re doing it should seriously throw an error or something.

Device does not show up in Eclipse ‘Android Device Chooser’

Matthew Cook — Thu, 06 May 2010 14:36:43 +0000

This is just a quick note on how to make sure your device shows up in the device listing when debugging an Android app in Eclipse. I spent some time trying to figure this out since I had the plugins all installed and the app ran good in the Emulator, but my device just wouldn’t show up in the device list when choosing to debug manually. I found the solution, of course, in the docs.

So if you’re having this problem you should make sure that your device is set up for debugging. I’m running the Droid Incredible, so you may need to take slightly different steps to accomplish this than what I layout here.

On the home screen of your device choose Menu > Settings > Applications > Development.
Make sure that ‘USB debugging’ is checked. I would also suggest checking the ‘Stay awake’ option as well so you don’t have to keep waking your phone up during debugging.

If the rest of your debug settings are correct your device should show up. At least for me this was the solution.

Connecting to the MailChimp API with Coldfusion

Matthew Cook — Mon, 26 Apr 2010 01:49:50 +0000

I have just started playing with the MailChimp API with Coldfusion. As usual, there’s not a lot of Coldfusion documentation or examples. So I thought I’d start posting some of the how-to’s as I myself figure them out. Here will demonstrate how to make a simple connection with the API so you can start doing more productive things like adding emails to lists and getting stats.

Let’s begin at the beginning of using any API. We need an account and an API key. Go ahead and create an account as if you’re a client, or if you are doing this for an actual client go ahead and create an account for them. MailChimp makes this super simple. Once you have an account click on the ‘account’ button in the top left corner of the dashboard. This will take you to a set of links. Click the ‘API Keys & Info’ link. This will take you to a page where you can manage your API keys. Clicking ‘Add A Key’ will generate a new key for you to use.

Now that we have our key and account we’re ready to make our connection via Coldfusion. Before looking at any code, let’s make sure we know where our documentation is at. You can find the MailChimp docs here. Requesting data from MailChimp requires you to pass the method and parameters via the url: http://us1.api.mailchimp.com/1.2/. As parameters you need to indicate the type of output MailChimp should return data as. In our case we’ll use JSON. So we’ll attach ‘?output=json’. Next we need to specify the method. MailChimp has a ping() method meant for no other reason than to make sure the connection is working. So this is what we’ll use here. To do this we attach the method parameter ‘&method=ping’. If you look at the docs you’ll see that this requires only one parameter to work, which is the API key (this is required for all methods). So we’ll attach another parameter ‘&apikey=[yourapikey]‘.

So let’s look at how to write this using Coldfusion.

First we set our URL. In this case you’ll, of course, change the ‘[your key]‘ to whatever your actual key is that MailChimp generated for you in your account. Next we use the Coldfusion tag to send the url to MailChimp. MailChimp then processes it and sends back the result which we store as ‘VARIABLES.mycall’. Because we specified to MailChimp to return data back to us as JSON we need to make sure we deserialize it before displaying it. We do this using the ‘deserializeJSON()’ method. Also the response is passed back as a struct with the actual data from MailChimp stored in the ‘fileContent’ key. Lastly we just dump the data so we can see that ‘Everything’s Chimpy!’.

At this point you should be able to start playing more with the API to do more complex and practical things.

Using Coldfusion to specify which pages to run under an SSL

Matthew Cook — Mon, 26 Apr 2010 00:49:01 +0000

I recently had a site that ran under an SSL certificate. As this was the case each page of the site ran under the ‘https://’ protocol. A few weeks ago the client noticed that when run in Internet Explorer they were receiving a message stating that not all of the data was being passed via the SSL. It would ask if the user wished to load in the insecure data as well as the secure. If the user chose yes everything loaded as normal. If they chose no everything except AJAX data would load onto the page.

While this makes sense I’m not sure why it just started happening. Nonetheless, I noted that it was not necessary to run the entire site under the SSL. Since I, of course, do not use AJAX anywhere in the checkout process, I decided that the simple solution was to run the SSL only under the checkout. This would allow the rest of the site to run under the ‘http://’ protocol without any security prompts concerning AJAX from Internet Explorer. So let’s take a look at how to run the SSL under only select pages in your site.

This snippet of code is run under the onRequestStart() method in the Application.cfc. This allows the program to check the url with each request that is made. Some pre-planning is required to choose where the SSL is run without just doing a page by page check. In this case we have made sure that we have placed all of our secure pages under a single directory. In this case we are wanting to secure our ‘checkout’ directory. If we are under this directory we also want to make sure that we are not running on the secure port 443. If not we can take the current url, run the secure protocol at the beginning, attach the query string if necessary, and then redirect the user to the secure page.

With each request Coldfusion checks if the page falls under the ‘checkout’ directory and if so it redirects to itself using the ‘https://’ protocol. For this protocol to work, it of course assumes that you have set up the SSL in IIS or whatever you use. I also recommend going into the site and changing any absolute paths linking to any of the pages running under your secure directory to use the secure protocol by default.

Creating a Twitter style character counter with jQuery

Matthew Cook — Fri, 23 Apr 2010 02:39:31 +0000

I’m not really sure why I decided to write the javascript to handle a text area with a limited character count as well as a character counter like that used on Twitter. Reason or not, it turned out to be fairly simple to pull off. By far the hardest part was finding a way to only run the onkeyup event when the appropriate text area field was focused. The idea being that every time the user presses a key typing in their name there isn’t a bunch of javascript running unnecessarily in the background. Somewhere on the web I found an activeElement javascript method that returns the focused form element. Just a fair warning that I’ve never used this outside of this example and have no idea if it works in IE or not. I did check though in Chrome, Firefox, and Safari however.

I came up with two scenarios for using a limited character text area with a character counter. First is a text area that allows x number of characters. The counter counts up to this number and then increases no more. The string itself is trimmed to the max character on each keypress beyond the max characters allowed. Second is a text area much truer to the Twitter ‘What’s Happening’ text area. This text area will allow the user to type as much as they wish, while the counter begins at the max and counts down to 0. At zero the counter begins counting down through negative numbers. I’ve also added a class at this point that changes the color of negative numbers to red.

Let’s take a look at some code.

The HTML


	
		
		Character Counter

		
		

		
		
	

	
		
			
		

		Characters:

Pretty simple stuff we have here. First is a link to the jQuery library hosted by Google. Next is a link to the character_counter.js file that I will get into next. As far as HTML is concerned we have a text area with an id of ‘my_text’ and a span with an id of ‘counter’. The span is empty because it will serve as a container for us to dynamically insert the character count as the user types into the text area.

I will list first the javascript that counts up to the max number of characters and then trims the string to the max character count so that the user can literally on enter the allowed number of characters. Afterwards, I will show the code that will allow the user to type as much as they wish and count into negative numbers.

character_counter.js (Counts up with character limit)

$(document).ready(function()
{
	var max_length = 10;

	//run listen key press
	whenkeydown(max_length);
});

whenkeydown = function(max_length)
{
	$("#my_text").unbind().keyup(function()
	{
		//check if the appropriate text area is being typed into
		if(document.activeElement.id === "my_text")
		{
			//get the data in the field
			var text = $(this).val();

			//set number of characters
			var numofchars = text.length;

			if(numofchars <= max_length)
			{
				//set the length of the text into the counter span
				$("#counter").html("").html(text.length);
			}
			else
			{
				//make sure string gets trimmed to max character length
				$(this).val(text.substring(0, max_length));
			}
		}
	});
}

character_counter.js (Counts down without a character limit)

$(document).ready(function()
{
	//set max length
	var max_length = 10;

	//load in max characters when page loads
	$("#counter").html(max_length);

	//run listen key press
	whenkeydown(max_length);
});

whenkeydown = function(max_length)
{
	$("#my_text").unbind().keyup(function()
	{
		//check if the appropriate text area is being typed into
		if(document.activeElement.id === "my_text")
		{
			//get the data in the field
			var text = $(this).val();

			//set number of characters
			var numofchars = text.length;

			//set the chars left
			var chars_left = max_length - numofchars;

			//check if we are still within our maximum number of characters or not
			if(numofchars <= max_length)
			{
				//set the length of the text into the counter span
				$("#counter").html("").html(chars_left).css("color", "#000000");
			}
			else
			{
				//style numbers in red
				$("#counter").html("").html(chars_left).css("color", "#FF0000");
			}
		}
	});
}

Gist of both is that we need to set a max character count for the text area and then listen for the keyup event to fire. When this happens we then check if the text area with the id of ‘my_text’ is focused. If not there is no need to continue running code. If so we get the value of the text area and get the length which is the number of characters. If we are increasing our counter by one we just need to use jQuery to write to the span tag the current length of the value of the text area. If counting down we do the opposite. We subtract the length of the value of the text area from the max number of characters allowed. Next, if we are trimming the string so that it can never actually get longer than the number of allowed characters we check if the length has exceeded the max characters. If so we use the ’subString()’ method to make sure that the value is trimmed off each time the user tries to add a character. If running the counter into negative numbers we don’t really need to run any conditionals unless changing the color so that negative numbers show up different than positive numbers. In this case I just check if the length of the value exceeds the max length. If so I use the jQuery css() method to change the color of the text to red.

That’s really it. Not pretty, but functional and simple.

Looping over lists

Matthew Cook — Wed, 21 Apr 2010 20:42:13 +0000

I realize that the title implies a super basic topic, and it certainly does. But this is something that tripped me up a little earlier today so I thought that simple as it may be I would share for anyone else encountering a similar problem. My issue was that I created a list, looped over the list, for each loop checked the value, and depending on the value output a new value. What I found was that my switch statements would pick up the first value in the list but not the rest. The problem ended up being that I was putting a space between my comma and the next value. Let’s look at a quick example of this.






	
	
		
			
		

		
			
		

		
			
		
	

	
	
		#VARIABLES.state#

This will display “Rhode Island” three times. What causes this? Again it’s that space after the commas in my initial list. As it stands the the case value is looking for ” MA” not “MA”.

If you convert the items in the list into a byte array you will see that both MA and CT have an extra character which is a space. Simple and obvious solution though. Just make sure that your lists are nice and tight. While I have a tendency to use arrays as opposed to lists in these cases I really find it hard to believe that I’m just now noticing this.

VARIABLES scope in CFCs in Coldfusion 9

Matthew Cook — Mon, 12 Apr 2010 01:19:44 +0000

The point is to hopefully add a little clarification to the VARIABLES scope used inside of CFCs in Coldfusion 9. I’ll also be using a few other things like an init() method to further illustrate the use of the VARIABLES scope. I’ll be using simple examples of these things for demonstration purposes only. That being said, we’ll look at the first example which will demonstrate the ‘VARIABLES’ scope in a cfc as well as using an ‘init()’ method to set up a CFC. Let’s take a look at the component.

We have a simple cfc here with an init() method, an addPerson() method, and several setter methods for setting different attributes of a person. The scope being used here is the VARIABLES scope. This scope persists with the instance of the component. In other words, until the a new instance is created any data stored in the VARIABLES scope will be available to all functions inside the component.

The init() method is called when we create an instance of the component. Upon creation we simply set a few pieces of data into the VARIABLES scope preparing the component to use any of this data in any of the following methods. In this case I go ahead and simply create a default person object, but could easily leave this data blank and rely on the set methods to fill in the person object attributes.

The next method is the addPerson() method which just compiles all of the attributes that make a person object and store it into a struct called ‘data’. Notice though that none of the values of a person are set in this method. It’s only job is to lump it all into a struct. We can do this because our data is stored in the VARIABLES scope.

The remaining functions just set data into the VARIABLES scope. Notice that they simply accept a value as an ARGUMENT, and then take that value and set it into the VARIABLES scope. This essentially overrides the value set initially in the init() method. Let’s look now at how this would be called from the .cfm page.

First we create an instance of our component using the ‘createObject()’ method. Not only do we create an instance, but we also go on and run the ‘init()’ method as well. The init() method returns the THIS scope. This is very important to do. If you do not return the THIS scope when running an init() method during the instance creation you won’t get anything back to play on. So for example, if I didn’t return the THIS scope I wouldn’t be able to call the addPerson() method because I technically don’t have it to call because it was never returned. If you do not call a method upon creating an instance Coldfusion will by default return everything that the component has to offer.

So if we were to simply dump our component instance ‘person_obj’ we would get the following. To get the following output I temporarily changed the return on the init() method to VARIABLES so we could see the variables that were created upon creating the component instance. Dumping the instance when the we return the appropriate THIS scope only returns the available methods. This makes sense since we can’t access any data stored in the component’s VARIABLES scope outside of the component itself.

manage_person cfc dump

Anyways, this was just a small portion of the actual struct, but you get the idea. Point being when we look at the VARIABLES scope of our cfc we see the data that was set in the init() method as well as each function that is also stored in the VARIABLES scope by default under the name of the function.

All is well so far. Now let’s look at what is returned when we add a person. Remember that in the init() method we create a default person. Since we are not running any setter methods our addPerson() method will simply return the default person object. So given the above code, when we dump the ‘person’ variable we get the following.

Default person object.

Now let’s say we want to create a new person. To do this we will need to call our setter methods and pass them the attributes of our new person. To create our new person our code would look like the following.

Our new person object now looks like the following.

Person 2 object

Point being here that we have just used our setter methods to manipulate the VARIABLES scope in the cfc to reflect the attributes of a different person. Then we use our same addPerson() method to compile those attributes into an object, or more specifically a struct. When all is said and done, the main thing to keep in mind is that data in the VARIABLES scope persists the duration of the component instance and is available for use from within the component.