Open Source Resources for Web Application Developers

CrossSlide is a jQuery plugin that implements in Javascript some common slide-show animations, traditionally only available to the web developer via Adobe Flash™ or other proprietary plugins. CrossSlide builds upon jQuery’s animation facility, so it is as portable across browsers as jQuery itself.

CrossSlide can do simple Static cross-fade, Slide + cross-fade and Ken Burns effect: panning, zooming and fading to specific points, to guide the eye of the viewer and convey meaning. This kind of effect relies on the browser for positioning, scaling and cropping images, through CSS and the DOM.

However it depends heavily on how the browser and the underlying graphics platform optimize these operations. Compared to native implementations of the same effects, CrossSlide is quite CPU-intensive, but recent hardware handles it without problems.

Requirements: jQuery Framework
Demo: http://www.gruppo4.com/~tobia/cross-slide.shtml
License: GPL License

• 3 Comments

You’re writing an email to invite a friend to meet at a local San Francisco restaurant that neither of you has been to. You’d like to include a map. Today, this involves the disjointed tasks of message composition on a web-mail service, mapping the address on a map site, searching for reviews on the restaurant on a search engine, and finally copying all links into the message being composed. And you haven’t even really sent a map or useful reviews—only links to them.

Mozilla Labs has announced the launch of Ubiquity. Ubiquity empower users to control the web browser with language-based instructions. (With search, users type what they want to find. With Ubiquity, they type what they want to do.) And it enables on-demand, user-generated mashups with existing open Web APIs. (In other words, allowing everyubone–not just Web developers–to remix the Web so it fits their needs, no matter what page they are on, or what they are doing.)

Ubiquity lets you map and insert maps anywhere; translate on-page; search amazon, google, wikipedia, yahoo, youtube, etc.; digg and twitter; lookup and insert yelp review; get the weather; syntax highlight any code you find; and a lot more. Ubiquity “command list” to see them all.

All of the code underlying the Ubiquity experiment is being released as open source software under the  GPL/MPL/LGPL tri-license as well.

Requirements: -
Demo: http://labs.mozilla.com/2008/08/introducing-ubiquity/
License: GPL/MPL/LGPL Tri-License

• 5 Comments

Phusion Passenger is an Apache module, which makes deploying Ruby and Ruby on Rails applications on Apache a breeze. It follows the usual Ruby on Rails conventions, such as “Don’t-Repeat-Yourself” and ease of setup, while at the same time providing enough flexibility.

Phusion Passenger is a commercial supported open source product that enables people to deploy their Ruby on Rails applications in an upload-and-go manner, which is very reminiscent of the PHP way of deploying. Also, you can always get community support on Discussion board.

Requirements: Any OS, except Microsoft Windows
Demo: http://www.modrails.com
License: GPL License

• 3 Comments

Superfish is an enhanced Suckerfish-style menu jQuery plugin that takes an existing pure CSS drop-down menu (so it degrades gracefully without JavaScript) and adds the some nice features as well. The reveal of sub-menu is animated, uses a fade-in by default but can be given a custom object to be used in the first argument of the animate function. The animation speed is also customisable but is set to “normal” by default.

There is a set of callback functions (onInit, onBeforeShow, onShow and onHide) available as well, allowing for further enhancements and functionality to be added without needing to alter the core Superfish code.

Requirements: jQuery v1.1.3.1+
Demo: http://users.tpg.com.au/j_birch/plugins/superfish/
License: MIT and GPL License

• 4 Comments

Facelift Image Replacement (or FLIR, pronounced fleer) is an image replacement script that dynamically generates image representations of text on your web page in fonts that otherwise might not be visible to your visitors. It is similar to sIFR which accomplishes this by using a combination of javascript, CSS, and Flash. FLIR generated image will be automatically inserted into your web page via Javascript and visible to all modern browsers. Any element with text can be replaced: from headers (<h1>, <h2>, etc.) to <span> elements and everything in between.

Requirements: Javascript Enabled
Demo: http://facelift.mawhorter.net/
License: GPL License

• 5 Comments

The Pencil Project is a free and open source tool for making diagrams and GUI prototyping that everyone can use. Web designers and web application developers can use Pencil Project creating mockups for their websites or web applications easily. Pencil will always be free as it is released under the GPL version 2 and is available for virtually all platforms that Firefox 3 can run. Download it for free now.

Requirements:-
Demo: http://www.evolus.vn/Pencil/
License: GPL 2.0 License

• 9 Comments

One of our lovely WebAppers readers, James Wright has found an interesting tool and submitted to us. This is called dBug, which is a PHP version of ColdFusion’s cfdump. Basically, it outputs colored and structured tabular variable information. Variable types supported are: Arrays, Classes/Objects, Database and XML Resources. Stylesheet can be easily edited. Table cells can be expanded and collapsed as well. dBug is free for download, and it has been downloaded over 20,000 times now.

Requirements:-
Demo: http://dbug.ospinto.com/
License: GPL License

• 4 Comments

CamStudio is able to record all screen and audio activity on your computer and create industry-standard AVI video files and using its built-in SWF Producer can turn those AVIs into lean, mean, bandwidth-friendly Streaming Flash videos (SWFs). You can use it to create demonstration videos for your web application.

CamStudio can also add high-quality, anti-aliased (no jagged edges) screen captions to your recordings in seconds and with the unique Video Annotation feature you can even personalise your videos by including a webcam movie of yourself “picture-in-picture” over your desktop. You can download and use it completely free for your personal and commercial projects.

Requirements:-
Demo: http://camstudio.org/
License: GPL License

• 13 Comments

Alternate Select Multiple (asmSelect) is a progressive enhancement to <select multiple> form elements. It provides a simpler alternative of with the following advantages:

• Easier for users to understand and interact with than regular <select multiple> form elements. Users know how to interact with it sans instruction.

• Doesn’t require user to Ctrl-Click or Shift-Click multiple elements. Instead users of your form can add or remove elements individually, without risk of losing those that have already been selected.

• Selected elements are always visible (within the confines of your interface) while unselected elements are always hidden (within a regular <select>).

• Unlike regular <select multiple> option elements, those on asmSelect are optionally sortable with drag and drop (this part requires jQuery UI).

• If a user does not have javascript, then of course the regular <select multiple> form element is used instead.

Requirements: -
Demo: http://www.ryancramer.com/projects/asmselect/examples/example1.html
License: GPL License

• 4 Comments

pChart is a PHP class oriented framework designed to create aliased charts. Most of todays chart libraries have a cost, pChart is intended to be free. Data can be retrieved from SQL queries, CSV files, or manually provided. Focus has been put on rendering quality introducing an aliasing algorithm to draw eye candy graphics. This project is still under development and new features or fix are made every week.

Requirements: PHP
Demo: http://pchart.sourceforge.net/demo.php
License: GPL License

• 5 Comments