The Texas Tribune has a neat Flash based map of county-by-county election turnouts. My goal for this weekend… make a Polymaps version. My version can be found here: http://crccheck.com/map/.

The data source I found for counties didn’t let me limit it to just Texas, so a lot of counties outside Texas end up getting colored. The data source for the election data is from the Texas Tribune, and the only processing I had to do with it is to change the case to make it consistent with my other data source. I guess I could have just made it case-insensitive too.

Chrome renders the map much better than FireFox. It supports the SVG title element and takes less CPU.

While there is a mechanism to sort, it requires modifying your search query and a page refresh. My script not only does all that live, but it also turns the search box into a live-search, which makes finding a particular ticket fast. To accompany all this, I also de-paginate the results so all the tickets are in one page. This could potentially cause problems, because some projects might have thousands of tickets; but that’s a problem for another day.

While I have been on a jQuery spree recently, I made sure not to use it for this Greasemonkey script. Even though there is a lot of DOM manipulation, I rely on Xpath and JavaScript 1.6 Arrays. The script is simple enough where it’s easy enough to convert to jQuery if needed.

If you use FireFox, Greasemonkey, and CodebaseHQ, Give CodebaseHQ Tickets+ a shot.

One of the biggest problems with my  last Canvas experiment is that if you put text labels over points of interest, they quickly clutter up and become difficult to read. In this demo, I take a list of labels and the coordinates they belong, then I treat each label as a like-charged ion and they automatically repel each other and find their own non-overlapping positions. I also put a spring force between each label (visualized by the red line) to its original position so they don’t stray too far. There are also some visual embellishments specific for the application.

In my next iteration, I’m going to try and properly attach events to each particle. I have rudimentary drag and drop now, but it’s not robust enough for other ideas I want to add. I also want to be able to add uncharged particles and have wind and gravity. So I can make the whole thing a proper particle playground.

Note: since the code was ripped from a Greasemonkey script, it’s FireFox only.

Update 18 July, 2010: I’ve made it a little more interactive, re-ported a more up to date version of the code, and made it somewhat compatible with Safari and Chrome.

save(), restore(), scale(), and translate() are useful, but when you want to do operations about a point other than the origin, setTransform() does a much nicer job when you use a point other 0,0 for the origin. I could have sworn there was a way that didn’t involve me doing math to do it, but I couldn’t find it and ended up just doing the math to get setTransform to work.

scale() does a really horrible job. I abandoned using tiled images and scaled Text. As you can see, I went with a solid background, and in that picture I removed for aesthetics — but I ended up writing my own custom method for scaling text (I had to do more math!).

I’m not sure how far I’ll take this, or in what direction, but I’ll have fun along the way.

www.openjs.com/scripts/others/dump_function_php_print_r.php

When I tried it, the first thing I noticed what that it put quotes around everything, and that long strings with line breaks got messy, so I did a quick adaptation to suit my immediate needs and came up with this:

function dump(arr,level) {
  function magicquotes(value) { return (isNaN(value)) ? '"' + value.replace(/\n/g,"\n"+indent) + '"' : value; }
  level = level | 0;
  var indent = new Array(level+1).join("\t"), dumped_text = "";

  if(typeof(arr) == 'object') { //Array/Hashes/Objects
    for(var item in arr) {
      var value = arr[item];

      if(typeof(value) == 'object')
          dumped_text += indent + "'" + item + "' :\n" + dump(value,level+1);
      else
          dumped_text += indent + "'" + item + "' => " + magicquotes(value) + "\n";
    }
  } else { //Stings/Chars/Numbers etc.
    dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
  }
  return dumped_text;
}

I also found links to many other print_r(), var_dump() equivalents, but they either depended on write, were overly complicated, or returned a lot of excess text I wasn’t interested in.

So why not just call it print_r ? Well, the original I copied was called dump, and I’ve always been annoyed typing that underscore, so I just didn’t change it.

Update: found another alternative. It’s really long and puts out a lot of extraneous information, but it’s worth looking at: wiki.greasespot.net/Code_snippets#Dump_the_properties_of_an_object

The Yahoo! User Interface Library (YUI)

If you’re building a rich web application from scratch, YUI will have very thorough tools to do anything you want. As long as you survive writing the code.

Mootools

If you’re looking to add a little ajax and dhtml to your exisiting web page, or need a lightweight, high performance library, go with Mootools.

jQuery

Somewhere between Mootools and YUI, jQuery has a lot of  features and is very tidy to code.

Perhaps we can compare the philosophies behind each framework by examining their respective homepages:

	YUI	jQuery	Mootools
Slogan	The YUI Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML and AJAX.	The Write Less, Do More, JavaScript Library	a compact javascript framework
Size	8.91KB	13.41KB	7.33KB
Comment	Look at how busy and dated their homepage is… but it is compact.	A very slick page, but underneath it, it is a little bloated.	Simple and clean.

Here’s my first attempt:

//a[@href]/text()[contains(.,"@")]

It’s pretty bad. I wanted to find links starting with “mailto:” but couldn’t figure out how to operate on the href attribute.

second attempt:

//a/@href[contains(.,"mailto:")]/..

Here you can see that I managed to operate on the href attribute, and then back back up to the a node. I learned how to select the attribute, instead of using the attribute to select the node.

third attempt:

//a[contains(@href,"mailto:")]

Simplified even further!

fourth attempt:

//a[starts-with(@href,"mailto:")]

I knew there was a starts with function… I just had to look it up.

A good place to start looking for things that let you pretend to be productive is lifehacker, and they do not disappoint.

http://lifehacker.com/399985/five-best-to+do-list-managers

Some factors I’m considering:

• I don’t want to register for yet another service (Remember the Milk)
• I don’t want to use something unless I already use it on a regular basis (Outlook)
• Must exist “in the ether”. That is to say… I have to be able to drop it and pick it up wherever I go (pen and paper)
• That kind of leaves plain text… todo.txt

Althought todo.txt sounds nice. With dropbox, my todolist can go whereever I go, but I use Gmail more than Notepad. I think I’ll try using a gmail draft message(s) for now. I might even be able to make it one of my quicklinks.

I also do all sorts of ROI analyses when I do dishes. How to arrange them so that they maximize the excess falloff water (stack them from largest size to smallest, and in increasing concavity). And how to minimize the total amount of effort required to get an item clean (if no lipids touched it, clean it right away, otherwise it will get dirtier before it gets cleaner).

I need more free time.