Open Source Resources for Web Application Developers

Tablecloth is lightweight, easy to use, unobtrusive way to add style and behaviour to your html table elements. By simply adding 2 lines of code to your html page you will have styled and active tables that your visitors will love. There’s absolutely no need for hardcoded class names or id’s on the tables.Tablecloth adds those automatically.

If you mouseover on a table, Tablecloth will highlight the row or column (or both) automatically. Tablecloth will also adds selected state on click. It is really useful and easy to implement. I am sure I will use it in the near future.

Requirements: No Requirements
Demo: http://cssglobe.com/lab/tablecloth/
License: License Free

It is time for some quality Photoshop Brushes again. Graphic designer JavierZhX from Mexico has designed a set of beautiful Photoshop brushes for us. Have a look at them, they are just gorgeous and useful.

Requirements: No Requirements
Demo: http://javierzhx.deviantart.com/gallery/resources/?order=9
License: License Free

One of the reasons for starting I Love Typography was that the author felt there just wasn’t enough being said about the topic. Secondly, and more significantly, He always found it difficult to quickly locate typographic resources. The long-term aim of this blog is to be such a resource, a one-stop-shop for everything about typography, from terminology to new typefaces, from inspirational examples of type to choosing the best font for the job, whether that be on- or off-line.

I think I Love Typography is a really excellent blog about fonts. The author has a really in depth knowledge about fonts and typefaces, and how to use them correctly. You can get a lot of information about typography in this blog. His latest article of 15 Excellent Examples of Web Typography is so interesting as well.

Requirements: No Requirements
Demo: http://ilovetypography.com/
License: N/A

Tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. Tablesorter can successfully parse and sort many types of data including linked data in a cell. It has many useful features including:

• Multi-column sorting
• Parsers for sorting text, URIs, integers, currency, floats, IP addresses, dates (ISO, long and short formats), time. Add your own easily
• Support for ROWSPAN and COLSPAN on TH elements
• Support secondary “hidden” sorting (e.g., maintain alphabetical sort when sorting on other criteria)
• Extensibility via widget system
• Small code size (7,4kb packed)

*** You can sort multiple columns simultaneously by holding down the shift key and clicking a second, third or even fourth column header.

Requirements: jQuery
Demo: http://tablesorter.com/
License: GPL and MIT License

One of of the most popular free stock photos site – Morgue File. The idea to build the web’s morguefile was conceived by Michael Connors as a college student in 1996. The term “morgue file” is popular in the newspaper business to describe the file that holds past issues flats. Although the term has been used by illustrators, comic book artist, designers and teachers as well. The purpose of this site is to provide free image reference material for use in all creative pursuits. This morgue file contains free high resolution digital stock photography for either corporate or public use.

Requirements: No Requirements
Demo: http://www.morguefile.com/
License: License Free

Being a typical guy, Chirag Mehta have no clue what the colors Lavender and Mauve look like. You can show him Indigo and he won’t know if it’s more like Violet or Purple. So he made this little app called Name that Color where you can create a color on the screen (or copy-paste CSS hex# color) and find out the name of the closest matching color. I did not realise there are so many colors you can actaully call them until I saw Name that Color…If you want to incorporate the same facility into your website or project, you may download a copy and use it as you wish.

Requirements: Modern Browsers with Javascript Enabled
Demo: http://chir.ag/phernalia/name-that-color/
License: Creative Commons License

When we are styling forms with CSS, we can style the text fields and buttons easily. However, File inputs (<input type=”file” />) are the bane of beautiful form design. No rendering engine provides the granular control over their presentation designers desire. Shaun Inman (founder of Mint) has shown us a simple, three-part progressive enhancement provides the markup, CSS, and JavaScript to address the long-standing irritation. We are now be able to style File input buttons as well.

Requirements: Modern Browsers with Javascript Enabled
Demo: http://www.shauninman.com/assets/examples/styling-file-inputs/
License: License Free

LiveValidation is a small open source javascript library built for giving users real-time validation information as they fill out forms. Not only that, but it serves as a sophisticated validation library for any validations you need to make elsewhere, it is not just limited to form fields.

The naming conventions and parameters of the validations are similar to those found in the Ruby on Rails framework, and as such is the perfect companion. Don’t worry if you dont use Rails though, LiveValidation can be used anywhere you like, is simple to learn, and a joy to use.

Requirements: Modern Browsers with Javascript Enabled
Demo: http://www.livevalidation.com/examples
License: MIT License

Kombine has designed “Pro Toolbar Icons” which is a set of 264 toolbar icons and buttons to help users intuitively understand the functions of your application. All icons in this set are PNG images with transparency and designed to fit the look of Apple’s OS X operating system. It is very useful when building websites and web applications. You can Preview the full set of 264 icons or Download the Quick Reference Card here.

The full set of icons costs $59.95, however you can get a set of 45 common toolbar icons for FREE. Kreg Wallace, the designer of the Kombine toolbar icons is very kind by giving away one set of 264 “Pro Toolbar Icons ” for FREE to one of WebAppers readers . You can use them on both personal and commercial projects. If you would like to be the one Lucky Guy, it is really easy.

To participate, you only have to

Make a comment on this post.

* You will get 2 more entries if you have a link back to this post or Webappers.

I would like to keep this event short, so that we do not have to wait too long for the result. Kreg Wallace will pick the winner on 24th September. Thank you Kreg Wallace for the icons and thank you all for the participation in advance.

*** 2007-09-10 UPDATE ***
Kreg Wallace said
Hey folks. Just so you know, I’m more inclined to pick someone who plans to use the icons for an interesting project. So, if you have a software application or web site you want to use the icons for, indicate that in your comments.

This contest has ended, please view http://www.webappers.com/2007/09/26/winner-of-264-toolbar-icons-set/ 

(more…)