Twitter: raymondcamden


Address: Lafayette, LA, USA

Early Access to My Next Book - Apache Cordova in Action

11-25-2014 1,084 views Mobile, JavaScript, HTML5, Books Comments

Hey - guess what? I'm working on a book. This time the publisher is Manning, and one of the cool things they do is allow early access to a book. You basically pay for it while it is being developed and you can provide feedback to help improve the text. Obviously you get corrected/new chapters as they come out as well. If this is appealing to you, you can head over to the book page now.

Check out FormKeep, another option for static sites

11-21-2014 946 views Development, JavaScript, HTML5 Comments

Over the past year or so I've been playing around with static site generators. After nearly fifteen years spent building dynamic web applications on the server-side, a simple solution involving a static site generator can be pretty darn appealing. Unfortunately, moving to static means you need to find alternatives for things that simply can't be static. Forms, forums, calendars, etc. I discussed options to handle this problem in my article for modernweb, Moving to Static and Keeping Your Toys. Today I'm going to introduce you to another option I discovered yesterday, FormKeep

Determining installed plugins at runtime for Cordova and PhoneGap applications

11-19-2014 2,443 views Mobile, JavaScript, HTML5 1 Comment

Earlier today on Twitter a user asked an interesting question: How can I tell - via JavaScript - if a particular plugin is installed in a Cordova/PhoneGap application. I responded by asking how you wouldn't know since it is your own app, but then he mentioned that his code base was stand alone and would be used within other projects. (So basically - just JavaScript code that other Cordova/PhoneGap applications would use.)

Using the autodivider feature in jQuery Mobile (take two)

11-18-2014 2,919 views Mobile, jQuery, JavaScript, HTML5 8 Comments

Almost a year ago I blogged about using the autodivider feature in jQuery Mobile. This is a simple feature that enhances list views with dividers. It makes content a bit easier to parse when working with a large list.

One of my readers, Fher (who has a cool name - I kind of imagine her/him as a fire-breathing wolf), asked if there was a way to add a bubble count to the dividers. You can see an example of this on the docs for listview, but this is what the feature looks like:

So, the short answer is no, you can't do this with autodividers. Why? While the feature allows you to build a function to create dynamic dividers, it only lets you specify the text for the divider, not random HTML. However, if you are willing to give up having the "pretty bubble" effect, you can simply use it as part of the label. To make that work, I modified my code a bit from the previous demo (and again, you can read that here, I'd suggest checking it out just so you can see the context). Here is the complete JavaScript code. (The HTML didn't change.)

$(document).ready(function() {

	var dates = [
		"12/16/2013 12:00:00",
		"12/16/2013 14:00:00",		
		"12/17/2013 12:00:00",
		"12/18/2013 12:00:00",
		"12/19/2013 12:00:00",
		"12/19/2013 16:00:00"
	];

	var dateList = $("#dates");
	for(var i=0, len=dates.length; i<len; i++) {
		dateList.append("<li>"+dates[i]+"</li>");	
	}

	/*
	Create a generic func to return the label
	*/
	var getLabel = function(d) {
		return (d.getMonth()+1)+ "/" + d.getDate() + "/" + d.getFullYear();
	}
			
	/*
	Now that we have a func, use it to generate a label to count hash
	*/
	var dateCount = {};
	for(var i=0, len=dates.length; i<len; i++) {
		var l = getLabel(new Date(dates[i]));
		if(dateCount.hasOwnProperty(l)) {
			dateCount[l]++;
		} else {
			dateCount[l] = 1;
		}
	}
			
	dateList.listview({
		autodividers:true,
		autodividersSelector: function ( li ) {
			var d = new Date(li.text());
			var label = getLabel(d);
			
			return label + " (" +dateCount[label] +")";
		}
	}).listview("refresh");

});

The first change was to abstract out the code used to generate the divider - basically turning the date value into a label. Once I have that, I iterate over my data to figure out how many unique date labels I have. This is done with a simple object and a counter. Finally, my autodividersSelector function is modified to make use of this count. Here is the result.

There you go. Not exactly rocket science, but hopefully helpful. It is possible to create dividers with list bubbles, just not quite as simply as this entry demonstrates. I'll show that tomorrow.

List auto-dividers in Ionic

11-06-2014 2,508 views Mobile, JavaScript, HTML5 3 Comments

This question came up on StackOverflow recently and I took a stab at answering it. The user had a list of data that included dates. They were looking to see if there was an easy way to add dividers to the list automatically. jQuery Mobile actually supports this out of the box - and supports it well. By default it will use the first letter of your list data as a separator (so "Andy" and "Al" will be prefixed with an "A" divider) but you can also use a function to specify your own logic.

My Modern Web Conference presentation is now available online

10-29-2014 2,593 views Development, JavaScript, HTML5 Comments

As the title says, my presentation from the Modern Web Conference is now available to watch online. I've embedded it below. You can find the complete list of videos here.

Thoughts on Integrating Ionic into an Existing Application

10-16-2014 2,887 views Development, JavaScript, HTML5 4 Comments

Earlier this week a user asked me a question about integrating Ionic into an existing application.

Delaying an Edge Animate asset until visible - Part 6

10-14-2014 2,660 views jQuery, JavaScript, HTML5 1 Comment

Welcome back to the thread that won't die. I've blogged (see related links below) about this topic six times now. It started off as something simple - making an Edge Animate animation wait to run until visible - but it has turned into a pretty complex set of entries discussing not only how to do it but alternatives and other modifications. Today's entry is rather simple though as it just covers updates for the October 2014 release of Edge Animate.

Ionic has a CDN (use with caution)

10-02-2014 2,272 views Mobile, Development, JavaScript, HTML5 Comments

I kinda stumbled upon this by accident, but Ionic has a CDN you can find here:

Cordova, Plugins, and Determining What Supports What

10-01-2014 3,039 views Mobile, HTML5 2 Comments

Earlier today a user on the Cordova development list asked if plugins are tested against only the current release of the SDK. This brought up an interesting discussion that I'm summarizing here.