John Dyer

Update: Many people have noted "it looks like [picker X]" and they are right: there are tons of pickers out there (I listed a few in the original post). The main difference in mine is that it has all 6 picking options (H,S,V,R,G,B) not just Hue. I haven't seen one that does that and this is a fun way of showing what JavaScript can do.
-----

There are a lot of nice JavaScript color pickers out there (colorjack, colourmod, yahoo, dojo, nogray, mootools), but none of them has a full HSB and RGB options of Photoshop's picker. Some pickers try to generate the entire color map in JavaScript by drawing a 256x256 grid made of divs. This is very slow, which is why color pickers that go the JavaScript route often don't draw the entire map, but instead only 4x4 or 8x8 blocks (ColorZilla).

The other options is to use transparent PNGs and opacity to fake the maps. A few years back, I did this, but it didn't have RGB and was Firefox and IE only (excellent tutorial here). To create the color mixing, the larger map is made of two layers and the vertical slider has four layers (two are used for H, S, or B; four layers for R, G, or B). Some others pickers use this method for a hue map, but don't include the other maps (S,V,R,G,B). The JavaScript is made up of some color methods, a slider control, a handler for input, and the ColorPicker object to put it all together. Click the image below to try it out:

Tested on IE5.5, IE6, IE7, FF2, Opera 9, Safari 2. It would probably need some modification depending on use, but you can download it here: Color Picker

For the last year, I've been working and reworking FreeTextBox 4 for various internal projects, trying to come up with a good API that will work well for both ASP.NET developers and generic JavaScript developers. The major updates that I wanted to do were

• new more object oriented JavaScript API based on Prototype (and including some features like one toolbar for multiple editors)
  
• support for other environments than ASP.NET
  
• support for Opera and Safari
• new styling and theming (including the Office 2007 style Floatie)
• live CSS editing in another window
• full document editing with doctypes
  

All of these are features built into the content manager of DTS website (www.dts.edu). Right now I have an early build at: http://www.freetextbox.com/ftb4/

I will have a beta release this month without all the features to help developers migrate (if they so choose) and then finish out the remaining features over the coming months. Having the entire control work in JavaScript apart from any dependancies on ASP.NET allows an ASP.NET developer to use a normal <asp:TextBox> control and "upgrade" with FreeTextBox. In plain HTML and JavaScript, this looks like:

<textarea id="MyHtmlCode" cols="14" rows="8"></textarea>
<script type="text/javascript">
var FreeTextBox1 = new FreeTextBox('MyHtmlCode');
</script>	

And in ASP.NET, it would look like

<asp:TextBox id="MyHtmlCode" TextMode="MultiLine" runat="server" />
<script type="text/javascript">
var FreeTextBox1 = new FreeTextBox('<%= MyHtmlCode.ClientID %>');
</script>	

Then in your AJAX code you can reference the editor object and its method directly:

<script type="text/javascript">
var html = FreeTextBox1.getHtml(); 
FreeTextBox1.setHtml('<b>new html</b>');
</script>

We just finished an initial version of a Flash embedded player of our DTS media. All of our chapels and dialogues will now be embedded into blogs. We've made room for an intro and possibly announcements at the beginning and end. In this way, we can use the advertisement concepts in other embedded players (Brightcove, upcoming YouTube ads, etc.) to send messages to students, faculty, staff, and other listeners. Here's a sample from a "giant" of a professor, D. Jeffrey Bingham:

Here's a simple script for enabling alternating CSS classes on a table.

// ALT script
function createAlternatingRows(table, className) {
var tbodys = table.getElementsByTagName('tbody');
if (tbodys.length > 0) 
table = tbodys[0];
var rows = table.getElementsByTagName('tr');
for (var i=0; i<rows.length; i++) {
if (i%2==0) rows[i].className = className;
}
}
createAlternatingRows(document.getElementById('myTable'), 'alt'); 

Just send it a table and a classname it and it handle the rest. It's setup to ignore <thead> and <tfoot> tags and it will overwrite other classes.