Getting Started with DataTables

A colleague came to me today trying to get the DataTables jQuery plugin working on a web page. The instructions on the datatables.net site don’t seem to have a complete out-of-the-box example on how to get the plugin working. So here goes.

  1. Download the plugin from datatables.net.
  2. From within the zip archive you downloaded, navigate to the media folder.
  3. Copy the following files into your project:
    • Copy media/css/jquery.dataTables.css to your project’s css folder
    • Copy all the files from the images folder to your project’s images folder
    • Copy js/jquery.dataTables.min.js to your project’s js folder
  4. In the <head> section of your web page, include the following code:
    <link href="css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.dataTables.min.js"></script>

    This gives you the basic CSS and javascript required to get DataTables working on your page.

  5. Build an html table on your page. Give it an id (I used “table1″ in the code below) Make sure you include a header row using <thead> and wrap the table body in a <tbody>.
    <table id="table1">
    	<thead>
    		<tr>
    			<th>Column 1</th>
    			<th>Column 2</th>
    			<th>Column 3</th>
    			<th>Column 4</th>
    		</tr>
    	</thead>
    	<tbody>
    		<tr>
    			<td>Item 1</td>
    			<td>Description 1</td>
    			<td>Data 1</td>
    			<td>More Data 1</td>
    		</tr>
    		<tr>
    			<td>Item 2</td>
    			<td>Description 2</td>
    			<td>Data 2</td>
    			<td>More Data 2</td>
    		</tr>
    		<tr>
    			<td>Item 3</td>
    			<td>Description 3</td>
    			<td>Data 3</td>
    			<td>More Data 3</td>
    		</tr>
    		<tr>
    			<td>Item 4</td>
    			<td>Description 4</td>
    			<td>Data 4</td>
    			<td>More Data 4</td>
    		</tr>
    		<tr>
    			<td>Item 5</td>
    			<td>Description 5</td>
    			<td>Data 5</td>
    			<td>More Data 5</td>
    		</tr>
    	</tbody>
    </table>
    
  6. Finally, just before the closing <body> tag, include the following code:
    <script type="text/javascript">
    $(document).ready(function () {
    	$('#table1').dataTable();
    });
    </script>
    

    This code references the table by its id (table1) and calls the dataTable method to run on it. Simple.

My tarp, hammock and underquilt as setup on March 9, 2013.

Hammock Camping – Spring 2013

Over the last year, I have switched to hammock camping. I no longer carry a tent. On the weekend of March 8-10, 2013, I was out camping in my new setup:

My tarp, hammock and underquilt as setup on March 9, 2013.
My tarp, hammock and underquilt as setup on March 9, 2013.

Here’s how my gear broke down prior to making the switch:

Ounces Pounds Kilograms
Tent 120 oz 7.5 lbs 3.4 kg
MEC Raven -7 sleeping bag 52.9 oz 3.3 lbs 1.5 kg
172.9 oz 10.8 lbs 4.9 kg

And after:

Ounces Pounds Kilograms
Trek Light Gear Double Hammock 20 oz 1.25 lbs 0.56 kg
Trek Light Gear Go Anywhere Rope Kit 8 oz 0.5 lbs 0.23 kg
Trek Light Gear Bug Free Hammock Shield 16 oz 1 lb 0.45 kg
MEC Silicone Scout Tarp 18.3 oz 1.1 lb 0.52 kg
MEC Raven -7 sleeping bag 52.9 oz 3.3 lbs 1.5 kg
Arrowhead New River Under Quilt 30 oz 1.875 lbs 0.85 kg
145.2 oz 9 lbs 4.11 kg

So I’ve shaved 1.8 lbs off my pack weight. 2.8 lbs if I don’t need the bug net.

Next up I’m considering going with a much lighter pack. The GoLite Quest 65L Pack is looking pretty nice right now at about 3.6 lbs. That’s a far cry from the 6.6 lbs (3 kg) my current pack weighs. The Boreas Lost Coast 60 Backpack at MEC is also looking pretty good at 3.4 lbs (1.523 kg).

this-scope

Setting SessionTimeout in CF9 and CF10

I ran across a thread on the CFWheels Google Group where someone was having problems with setting a session timeout. I remembered that I had the same problem a few weeks back. I didn’t think anything of it after I found a solution though. Now, since I’m not the only one having this problem, I thought I’d blog it.

So the problem in a nutshell is that if you try to set a timeout to a number of seconds, it no longer works. My suspicion is that this behavior changed in ColdFusion 9, but was backwards compatible with using a number of seconds as the sessionTimeout value. Like this:
this.sessionTimeout = "3600"

When you read the CF9 documentation for cfapplication, you find this note as the description for sessionTimeout:

Life span of session variables. CreateTimeSpan function and values in days, hours, minutes, and seconds, separated by commas.

I am almost completely using CF10 now, and it appears that the old way of setting a number of seconds no longer works at all. Instead, the revised code for the sessionTimeout value should be:
this.sessiontimeout = CreateTimeSpan(0, 4, 0, 0);

When I dump the THIS scope in Application.cfc, I get the following output in a CFWheels Application:

Hope this helps someone.

NOTE: Code samples above use CFScript. Could be just as easily achieved using.

Installing ColdFusion 10 under MAMP Pro 2 on OS X Lion

I’ve been attending a whole host of ColdFusion 10 Developer Week 2012 sessions this week, and got inspired to upgrade my development machine to run ColdFusion 10. I had previously been running CF9 (developer) and MAMP Pro 2.0.5. These instructions will allow you to remove CF9 and install CF10. Installing and configuring MAMP Pro is up to you.
Update: Added a note near the end of the instructions. Basically, make sure you edit the httpd.conf file in MAMP Pro or the changes may be overwritten.

Here’s the process I used to get everything setup and working properly: Continue reading

RSS Truck

Combining Two RSS Feeds in CFScript

RSS TruckIn a previous post, I had written an example of combining two RSS feeds into one. At some point, I lost the code from the example, probably from clicking save one-too-many times in WordPress. WordPress is quite finicky about posting any kind of programming code. I did some research, and found PasteBin, and have started using that for my code samples.

With that out of the way, it’s time to rewrite the example that was lost, and to try it out in pure CFScript.

Code Walkthrough:

  • Use feed to Read a WordPress blog feed and return a Query object. If this fails, create an empty query object.
  • Execute an SQL Query to get recent News Stories from a MySQL database. If this fails, create an empty query object.
  • Use Query of Queries to create a Union of the two sources previously defined. If this fails, create an empty query object.
  • Setup Structs to defined properties for RSS Feed Creation
  • Create the RSS Feed. This one gave me a bit of grief. I didn’t see my output file until I added ExpandPath to it. It took be a bit to figure out that to get assign the results of the create method to the xmlVar. Adobe’s documentation is sketchy on this – no working example. After reading through the documentation a few times, I eventually figured it out.

Glacier Discover Walk Concept

Parks Canada’s Glacier Walk Proposal

Glacier Discover Walk Concept
Glacier Discover Walk Concept

Parks Canada emailed me today in regards to the Glacier Walk proposal in Jasper National Park. They provided several pieces of information:

It almost sounds like the proposal has already been approved, and is just waiting on the an Environmental rubber stamp.

Here’s my thoughts on this proposal:

By “privatizing” a lookout and making it only available to paying customers of a corporation, Parks Canada are denying me my rights to visit this portion of Jasper National Park. The so-called alternative viewpoints do not give the same view as that from the soon-to-be-closed viewpoint.

There are no areas in any national park that I am currently precluded from visiting (to my knowledge). There will be one if this proposal is allowed to proceed. The only exceptions I know of are:

  • areas that are closed due to Parks regulations (ie. Avalanche closures, bear closures, elk calving closures, caribou protection closures, seasonal closures, etc…).
  • hot springs leases – these are operated by Parks Canada, or a contractor on Parks Canada’s behalf and are a traditional use of the National Parks. Heck, we may not even have National Parks if there hadn’t been a dispute over who owned the Cave and Basin hot springs in Banff National Park back in 1885.

All other leased areas I’m aware of can be visited by walking. I can walk to any portion of any leased ski area if I so choose. Lake Louise and Sunshine even have public trails that require no fees to use. I can visit any backcountry hut or lodge, no matter who owns it. I may not be able to afford to stay there, but that could be the subject of another blog post.

I feel so strongly about this that if it proceeds, I will likely make it a point to stop at this viewpoint to park my car for a visit on every visit to Jasper from this day forward, making sure to block access to the corporation’s vehicles and paying customers. I’m pretty sure am not the only one who feels this way too.

jQuery AJAX request for a JSON WordPress feed

Here’s a method to get a JSON feed with jQuery (version 1.7.1 at time of writing). This may work in earlier versions of jQueruy but I have didn’t test it.

Code walkthrough:

  • Specify the feed URL. See notes in the code below for pre-requisites.
  • Before sending the request, set the “result” div to show an animated gif to indicate something’s happening
  • If there’s an error, display an error message in the “result” div
  • If successful, display the first 6 items from the feed in the “result” div

Stuff I do, or stuff I find interesting