ToolMan DHTML library not supported
25 Jun 2009 5 Comments
The ToolMan DHTML library is a dead project and has been since late 2005. As a user of open source software I’m annoyed when I stumble across dead projects that aren’t advertised as such, yet I’ve been reluctant to provide the same courtesy to you.
I’m more than surprised at the longevity of my little library, particularly in the presence of robust libraries like Dojo, JQuery, YUI, GWT, and others.
I have nothing but thanks to everyone who has supported this project through your links, bumps, bug reports and suggestions, bug fixes or patches, or use of my library.
I have special thanks to everyone who made a donation. I’ve removed the donation box from my site and I will tally up the donations received (as best I can) and donate the 50% to Dojo and 50% to JQuery.
A testament to web standards, my library has held up surprisingly well in Safari and Firefox. Internet Explorer, not so much.
I’m leaving my library code and example site up as well as keeping this blog around. Be patient if I don’t moderate your post right away, but I will get to it. My license remains the very permissive MIT license. The code and examples are yours to do with what you want.
Again, thank you for the interest and support.
ToolMan DHTML Write Up at StudioWhiz
15 Jun 2005 6 Comments
Mr. K shared with me his [write up on my library and examples][1] posted at his site [StudioWhiz][2]. In addition to containing some nice ego-inflating compliments, Mr. K also has created his own edit-in-place and drag-and-drop examples linked to from his article.
[1]: http://www.studiowhiz.com/forums/index.php?showtopic=7896
[2]: http://www.studiowhiz.com/
Version 0.2 of ToolMan DHTML Released
27 Apr 2005 148 Comments
A new version, version 0.2, of the ToolMan DHTML Library has been released. You can try out the examples (Drag & Drop Sorting, Edit in Place) and download it here.
Here are the Top 5 Reasons to be Excited about Version 0.2:
-
IE support. Most examples have been verified to work properly in IE6.
-
Rewritten from scratch; designed for reuse. The new library is more
modular, better packaged, and less likely to have name collisions with
your code and other 3rd party libraries. -
It’s free! Permission granted for personal and commercial use via the
liberal MIT license. -
Improved quality. Cleaner, less duplicated code. Where possible,
library modules have unit tests written using Selenium. -
This is only version 0.2. It just gets better from here.
Saving a reordered list
16 Apr 2005 54 Comments
Update 05/11: version 0.2 of the DHTML Library has a helper function to “serialize” the order of a list:
ToolMan.junkdrawer().serializeList(myList)
It returns a string representation of the list as described in the remainder of this post.
Tim Erfle and several others have asked a question like the following:
Is there anyway to report the order of the list after it has been sorted by the user? Its a super cool script, but it would be helpful if store the user modified order in the database.
Because the sorting is done by rearranging elements in the DOM, all you have to do is iterate over the parent element’s children to extract the new order. For example:
function foo(listID) {
var list = document.getElementById(listID);
var items = list.getElementsByTagName("li");
var itemsString = "";
for (var i = 0; i < items.length; i++) {
if (itemsString.length > 0) itemsString += ":";
itemsString += items[i].innerHTML;
}
alert(itemsString);
}
To use this in a form submit replace alert(itemsString) with something like myHiddenInput.value = itemsString. Or you could stuff itemsString in a cookie or pass it back to the server with XMLHttpRequest. The above example uses items[i].innerHTML which works fine so long as your list items are plain text. A better approach is to give each LI element a unique identifier. You can use the ID attribute or — if you’re not concerned about valid XHTML — invent a new attribute to use. A list would look something like this:
<ul>
<li listID="325"><a href="...">Copper</a></li>
<li listID="27"><a href="...">Gold</a></li>
<li listID="131"><a href="...">Gold</a></li>
...
</ul>
And use a script like this to extract the order:
function foo(listID, formInput) {
var list = document.getElementById(listID);
var items = list.getElementsByTagName("li");
var itemIDs = "";
for (var i = 0; i < items.length; i++) {
if (itemIDs.length > 0) itemIDs += ":";
itemIDs += items[i].getAttribute("listID");
}
// do something with itemIDs
}
Drag & drop between lists
15 Apr 2005 57 Comments
Ben Levy sent me this demonstration of drag & drop between lists:
I don’t know if you are interested, but I was playing with one of your examples of the drag and drop sortable lists and made some changes to allow dragging between multiple lists. I don’t really know how useful that would be, but it seems to work for the most part.
I think it’s pretty damn useful. I especially like that he highlights the drop targets.
