Open Source Resources for Web Application Developers

Yotophoto is a search engine for free-to-use stock photographs and images. These are images that are either in the Public Domain or released under generous Creative Commons, GNU FDL or similar licenses. Originally an experiment to facilitate easier image searching of the Wikipedia, Yotophoto eventually expanded to index other well known free image sites. Today, Yotophoto indexes over a quarter million free images. They index various sources of free imagery on the web including Flickr, Wikipedia, Stock.Xchng, Morguefile, Pixelperfect Digital and OpenPhoto.

Requirements: No Requirements
Demo: http://yotophoto.com/
License: Creative Commons License

• 1 Comment

Sometimes, when we are building websites and web applications, we need a percentage bar / progress bar to show the progress of a specific task. However, it is very difficult to find a working and easy solution without using Flash. Therefore WebAppers has created a simple Javascript based Percentage Bar / Progress Bar which is inspired by Bare Naked App. Bare Naked App taught us how to display Percentage Bar with 2 images only by using CSS. And then I used a little bit of Javascript to make it more interactivity. You can use it anywhere you can think of. Use your Imagination, I am sure you will find it useful somewhere.

Click the image above to see the demo and documentation of Progress / Percentage Bar. And please feel free to grab the package below and test it on your machine.

Download Ajax Progress Bar

Bram.us has created a better version written in objects and unobtrusive, You can view the documentation and demo through Dynamic Unobtrusive Javascript Progress/Percentage Bar.

Download Ajax Progress Bar Version 0.1 by Bram.us

If you have any suggestions, please feel free to leave comments. I will update the script regularly.

Requirements: Prototype Framework
Demo: http://www.webappers.com/progressBar/
License: Creative Commons License

• 81 Comments

Adam Woodhouse released many sets of quality brushes including Web 2.0 Style Brushes with different shapes, and many dynamically generating gradients, Grunge Brushes and Retro Brushes. All of the brushes are free to use, free to use in your artwork, however they are subject to copyright and may not be distributed without written permission from Adam Woodhouse. Enjoy using these brushes, they are Compatible with Adobe Photoshop CS, CS2 + CS3.

Requirements: Adobe Photoshop CS, CS2 + CS3
Demo: http://www.adamwoodhouse.co.uk/?p=20
License: Creative Commons License

• 1 Comment

No one in their right mind likes pop-up windows and personally, the thought of embedding JavaScript blocks within the (X)HTML just doesn’t do it for Brian, so, Brian coded an Unobtrusive Date-Picker that was accessible using the keyboard and suitable for use within documents served as application/xhtml+xml (as no document.write statements are used). The date-picker attempts to auto-detect the language of the users browser installation and download the corresponding language file from the server. And also, it has the nice fade in and fade out effect.

Requirements: Modern Browsers with Javascript Enabled
Demo: http://www.frequency-decoder.com/demo/fd-date-picker/
License: Creative Commons License

• 2 Comments

BittBox provides a lot of free and original source files of photoshop brushes. You are free to use Bittbox files in posters, website designs, cd covers, postcards, annuals, flyers, business cards, branding, . . . DESIGN. Here are some of his photoshop brushes.

1. Free Illustrator Brushes: Teardrop Foliage
2. Free High-Res Grunge Ink Splatter Brushes
3. Free High-Res Photoshop Brushes – Leaves
4. Free Hi-Res Watercolor Photoshop Brushes Set II
5. Free Hi-Res Splatter Photoshop Brushes
6. Free Hi-Res Watercolor Photoshop Brushes
7. 30 Illustrator Pattern Brushes for Making Flowers and Circular Designs

Apart from these stunning brushes, there are a lot of free to download design elements and vectors. I am sure you will be amazed how useful they are.

Requirements: See License Agreement
Demo: http://www.bittbox.com/
License: Creative Commons License

• 2 Comments

Unobtrusive Table Sort Script can sort dates (dd-mm-yyyy, mm-dd-yyyy or yyyy-mm-dd formats accepted), currency values (£, $, €, ¥ and ¤), numbers/floats and plain-text (sorted in a case-insensitive manner). It also enables zebra striping the table rows and highlighting the currently sorted column. All table column s are sortable. You can implement your own sort function easily if you would like to. The table looks really nice as well.

Requirements: Modern Browsers with Javascript Enabled
Demo: http://www.frequency-decoder.com/demo/table-sort-revisited/
License: Creative Commons License

• 0 Comments

Christopher Einarsrud was intended to develop a flash photo gallery called Polaroid Gallery for his online portfolio in year 2006, but he ended up going for something completely different. He thought that it might come in handy for someone else, so he decided to release it as a free and open source flash gallery for everyone. All the photos are displayed as Polaroid Photos, you can move them around with your mouse. You can also double click on each photo to zoom in. Polaroid Gallery looks so fresh and stunning that I would like to have one too.

Requirements: Modern Browsers with Flash
Demo: http://www.no3dfx.com/polaroid/
License: Creative Commons License

• 17 Comments

Couloir Slideshow is a demonstration of Flash-like behavior implemented solely in Javascript, HTML, and CSS. It is a very good resources for creating a gallery with resizing and fading effects. You are permitted to use it on your own project so long as you do so according to the rules outlined in the Creative Commons ‘Attribution-ShareAlike 2.0′ License and the license terms contained in the associated, third-party APIs.

Requirements: Any Modern Browsers with Javascript Enabled
Demo: http://www.couloir.org/js_slideshow
License: Creative Commons License

• 4 Comments

Do you want to build your own color schemer? Do you want to put a color picker in your web application? ColorJack DHTML Color Picker is the best choice. Users can simply click on the color picker to choose their favourite color. Also, users can drag the color picker to where they want it to be. They can even close it easily by clicking on the “X” symbol at the top right hand corner. It’s licenced under Creative Commons, so you are free to use or modify the DHTML Color Picker on your own project.

If you like this, you might want to use ColorJack Sphere Color Picker as well. However, this version is not compatiable with Internet Explorer at the moment. Therefore, there is no download-able package at the moment.

Requirements: Any Modern Browsers with Javascript Enabled
Demo: http://www.colorjack.com/plugin/
License: Creative Commons

• 1 Comment

Yellow5 wrote a unobtrusive, lightweight javascript datepicker for us. It is so small that you can use it on your pda, but the functionality is just about right. There are also a few advantages to using DateChooser over other javascript datepickers according to Yellow5:

• The HTML for the calendar is standards-compliant.
• The calendar appears in the same window as the input field(s). It doesn’t annoyingly pop up in a new window.
• It has no hard-coded styles; apply your own .css file to customize DateChooser’s appearance.
• Return values are flexible, using patterns borrowed from PHP’s date() function.
• It doesn’t pollute the global namespace.
• It uses unobtrusive, warning/error-free javascript.

Requirements: Internet Explorer 5+, Firefox 1.0+, Opera 8+, Safari
Demo: http://yellow5.us/projects/datechooser
License: CC Attribution 2.0 License

• 0 Comments