Open Source Resources for Web Application Developers

WYMeditor is a web-based WYSIWYM XHTML editor. WYMeditor has been created to generate perfectly structured XHTML strict code, to conform to the W3C XHTML specifications and to facilitate further processing by modern applications.

With WYMeditor, the code can’t be contaminated by visual informations like font styles and weights, borders, colors, …The end-user defines content meaning, which will determine its aspect by the use of style sheets. The result is easy and quick maintenance of information.

WYMeditor has been integrated in many open or proprietary applications, such as: Drupal, Symphony, Radiant, TYPO3, WordPress, Rails, CakePHP and etc…

Requirements: -
Demo: http://files.wymeditor.org/wymeditor/trunk/src/examples/
License: MIT, GPL License

• 2 Comments

quickSearch is a jQuery plugin for filtering large sets of data. It supports Tables, Paragraphs and Lists. It’s very easy to use ‘out of the box’. As easy as:

$(search_elements).quicksearch(options);

quickSearch v2.0 was written with speed in mind, it is now a lot quicker than the previous version and it is completely backwards-compatible with any previous code written.

You can also look at another jQuery QuickSilver Live Search Plugin we mentioned earlier, it is able to recognize which items you are searching for if you just use abbreviations, so you can type entire words, or just fragments of each.

Requirements: jQuery framework
Demo: http://rikrikrik.com/jquery/quicksearch
License: License Free

• 11 Comments

FormCheck is a Mootools plugin that allows to performs different tests on forms and indicates errors. It works with input (text, radio, checkbox) fields, textarea and select boxes. You just need to add a specific class to each fields you want to check. You can perform check during the datas entry or on the submit action, shows errors as tips or in a div before or after the field, show errors one by one or all together, show a list of all errors at the top of the form, localize error messages, add new regex check and etc…

Requirements: Mootools framework
Demo: http://mootools.floor.ch/en/labs/formcheck/forum-registration/index.htm
License: MIT License

• 7 Comments

FreeRichTextEditor is an extremely easy to use free javascript based HTML WYSIWYG editor for your website, it can easily be implemented into any existing content management system or other web application with no knowledge required in programming or javascript. Only 3 lines of code required to set up the editor. It also now outputs as XHTML compliant code.

FreeRichTextEditor’s interface looks like Microsoft Office Word, it is easy to use without any help. You are free to use this editor as you wish as long as all copyright notices remain intact. However, there is a number of issues have arisen about the kind of characters used when using special characters. This is done by some 3rd party code embedded within the editor.

Requirements: -
Demo: http://www.freerichtexteditor.com/demo/
License: Creative Commons 2.5 License

• 7 Comments

PrettyCheckboxes is for people who wants to have a consistent look for checkboxes across browser or those who simply want them to look better. By using this script you wont loose any of the regular inputs usability. It has been tested and is known to work in Firefox 2+, Opera 9.5, Safari 3.1.1 and Internet Explorer 6+. This script is licensed under Creative Commons Attribution 2.5. So you can use it in all you projects even commercial ones.

Requirements: jQuery Framework
Demo: http://www.no-margin-for-errors.com/projects/prettyCheckboxes/
License: Creative Commons 2.5 License

• 4 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

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

• 3 Comments

We have seen a lot of examples of Live Search. But now, Ordered List has added a bit of a twist to it. Steve mentioned that the typical year and month layout of archives was overkill. He thought a better way to present them would be to list them all and let live search sort ‘em out. He has created Live Search with Quicksilver Style by integrating “Quicksilver string ranking algorithm” into Live Search component. “Quicksilver string ranking algorithm” will be able to recognize which items you are searching for if you just use abbreviations, so you can type entire words, or just fragments of each.

For example, sure you can search ‘sidebar creative’ to find posts titled that, now you can just type ‘sdbcv’ to get the same result. And that guy Nunemaker, but is that name a keyboardful. Why don’t we just hit a few of the important characters like ‘nnmkr’. The post of “Welcome John Nunemaker” is right there at the top. Try out the demo, you will love this immediately.

Requirements: -
Demo: http://orderedlist.com/demos/quicksilverjs/
License: MIT License

• 7 Comments

SPAW Editor is a web based in-browser WYSIWYG HTML editor control. It is a replacement for standard HTML textarea fields for rich text content editing. It includes lots of exciting features. The followings are the 2 major and interesting features SPAW Editor provides.

Tabbed Multi-document Interface
New industry unique tabbed multi-document interface feature. Now you can edit virtually unlimited number of HTML snippets in a single WYSIWYG instance. This can save a lot of screen space, unnecessary scrolling and loading time compared to other solutions where you have to load as many WYSIWYG instances as HTML snippets you want to edit.

Floating/Shared Toolbars
Multiple instances of SPAW Editor can be controlled by a single toolbar. This toolbar can either be attached to one of the instances or float around the screen. This way you can save loading time and achieve a better level of integration of the editing area into complex designs (no toolbar overhead).

Requirements: -
Demo: http://spaweditor.com/en/disp.php/en_products…
License: GPL License

• 6 Comments

Wysiwym Markdown editor (WMD) is a simple, lightweight HTML editor for blog comments, forum posts, and basic content management. You can add WMD to any textarea with one line of code. Add live preview with one line more. WMD works in nearly all modern browsers, and is now completely free to use. The next release will be open source under an MIT-style license. This is not a normal WYSIWYG editor.

Wysiwym stands for What You See Is What You Mean. WMD produces clean semantic HTML, leaving presentation details like fonts and colors up to style sheets. But you’re not left in the dark about cosmetics; as you type, WMD’s live preview shows you exactly what your text will look like after the current styles have been applied.

Markdown is a simple markup language that’s as easy to read and write as plain-text email. WMD uses Markdown as an input format, converting it into HTML behind the scenes. You can also mix raw HTML with Markdown, so the full expressiveness of HTML is always there if you need it.

Requirements: -
Demo: http://wmd-editor.com
License: License Free , MIT License

• 5 Comments