Lightweight & Highly Customizable Ajax Events Calendar

dhtmlxScheduler is a web-based event calendar which provides simple in-browser scheduling solution. With smooth Ajax-enabled interface dhtmlxScheduler allows users to add, modify or delete events without refreshing the web page.

Intuitive drag-n-drop behavior gives the possibility to change events date and start/end time by simply dragging the event boxes. The calendar events can be displayed in Day/Week/Month views.

dhtmlxScheduler is very lightweight (about 19KB gzipped), cross-browser and highly customizable. Each aspect of the calendar interface can be configured through JavaScript API. Developers can easily add/update events, change date format, time scale or calendar language.

Although dhtmlxScheduler is a pure JavaScript solution, it can be easily connected to the backend database with the help of dhtmlxConnector, a PHP extension that enables data communication between client-side interface and server-side datasource.

You can also use your own server-side code written in any language (PHP, Java, ASP, etc.) to bind scheduler content to the database. dhtmlxScheduler is distributed under GNU GPL and commercial licenses.

Requirements: -
Demo: http://dhtmlx.com/docs/products/dhtmlxScheduler…
License: GPL and Commercial Licenses

How to Create a Tabbled Content Rotator with jQuery

Raymond Selda has published a tutorial about how to Create a Tabbed Content Rotator using jQuery and the interface library called jQuery UI. This effect can be used effectively on your homepage to present customers with your products and services.

After you’re finished, you can experiment and try placing the tabs above or lining them up vertically. Try looking up some websites that use this kind of interface for inspiration. Simple variations to the interface can be a great way to learn more about CSS.

Requirements: jQuery Framework
Demo: http://www.raymondselda.com/demo/tabbed-rotator/
License: License Free

Gmail / Facebook Style Chat Application with jQuery

Everyone loves the Gmail and Facebook inline chat modules. This Gmail/Facebook Style jQuery Chat Module enables you to seamlessly integrate Gmail/Facebook style chat into your existing website.

You can see the chat box displays at the bottom right hand corner of the screen. You can keep the chat boxes open and stores state (data) even when pages are browsed/refreshed. It will display “Sent at…” after 3 minutes of inactivity. You can also minimize and close chat boxes easily.

This chat script can be used for free under LGPL-style license for non-commercial purposes. However, you need to purchase a license for commercial purposes.

Requirements: jQuery Framework
Demo: http://anantgarg.com/2009/05/13/gmail-facebook-style-jquery-chat/
License: LGPL License

Choose jQuery or MooTools Javascript Framework?

Most people getting started with JavaScript these days are faced with the challenging task of picking a library to use, or at least which one to learn first. Aaron Newton of Clientcide saw numerous posts that boil down to “MooTools or jQuery?”

He has published “jQuery vs MooTools” aims to help you make that choice. He tried to highlight the differences in philosophies between the two codebases and highlight their advantages and disadvantages.

jQuery focuses on expressiveness, quick and easy coding, and the DOM while MooTools focuses on extension, inheritance, legibility, reuse, and maintainability. jQuery is easy to get started and see quick results but can turn into code that’s harder to reuse and maintain, while MooTools takes longer to learn and requires you to write more code upfront before you see results, but afterwards is more reusable and more maintainable.

Both frameworks keep their cores rather lean, leaving it to you and others to write plug-ins and extensions. MooTools takes a more holistic approach and gives you tools to write anything you can imagine beyond the scope of the DOM, but pays the price by having a steeper learning curve.

MooTools extensibility and holistic approach gives you a superset of jQuery’s features, but jQuery’s focus on a slick DOM API doesn’t preclude you from using the native inheritance methods of JavaScript or from using a class system like MooTools if you want it.

Do you think so? Which framework do you choose?

Source: jQuery vs MooTools

How to Build a Dynamic Flash Gallery with Slider Control

Flashtuts has published: Build a Dynamic Flash Gallery with Slider Control. In the tutorial, you will learn how to create a flash gallery which displays all image files in a given directory, with a slider that is used to browse easily through the images.

The flash gallery is still low on functionality. The loaded images all need to be the same size and do not have a larger preview. You could add a resizing function and an option to view a larger preview of the image when clicked. Furthermore, an option to browse left or right with buttons or with a keyboard event could be added.

Requirements: Flash Required
Demo: http://besofresh.com/flashtuts/full.html
License: License Free

Axiis - Open Source Data Visualization Framework

Axiis is an open source data visualization framework designed for beginner and expert developers alike. Axiis gives developers the ability to expressively define their data visualizations through concise and intuitive markup.

Axiis provides both pre-built visualization components as well as abstract layout patterns and rendering classes that allow you to create your own unique visualizations. Axiis was designed to be a granular framework, allowing developers to mix and match components and build complex output by compositing together basic building blocks.

Axiis is an open source project, under an MIT license. This means you can use it for personal projects, commercial work, and pretty much anything you can think of with no restrictions.

Requirements: Degrafa Graphics Framework & Adobe Flex 3
Demo: http://www.axiis.org/examples.html
License: MIT License

Giving Away 10 Sets of 275 Premium App Icons

We would like to celebrate the success of WebAppers over the past two years. Without your support, WebAppers cannot survive. We would like to say Big Thank You to all of our readers.

And also, we have contacted Function, and asked if they can give away few copies of their New Beautiful Premium App Icons ($20 /pack). They are very kind, and happy to give away 10 sets of 275 New Premium App Icons to WebAppers readers for Free!

How to Participate

In order to have a chance to get those amazing icons, you can simply leave a comment under this post. And then, we will randomly draw 10 winners on 1st June 2009.

Free Social Media Icons for Everyone

Few days ago, Function has also released a set of Free Social Media Icon Pack for everyone as well. All of them look shiny and beautiful. You can download them directly now. I am sure you will find them useful for your blog or web application.

Create Your Own Patterns Online for Free

Repper is a free-to-use pattern creator that turns your images into eye-catching designs. First of all, you can load a random example image or upload your own image. Resize & drag the box to change the pattern. And then save your design and download the pattern to your computer.

Patterns generated with the Repper tool are freely available to everybody under the Creative Commons Attribution-Noncommercial 3.0 Unported License. This means that you can use it for your own personal projects for free.

Requirements: -
Demo: http://repper.studioludens.com
License: Creative Commons License

Useful Web Caching Tutorial for Webmasters

Recently, I have been doing research on Web Caching. And I have found Caching Tutorial for Web Authors and Webmasters , which is a detailed, informational document published by Mark Nottingham.

A Web cache sits between one or more Web servers and a client or many clients, and watches requests come by, saving copies of the responses — like HTML pages, images and files — for itself. Then, if there is another request for the same URL, it can use the response that it has, instead of asking the origin server for it again.

Web Caching can reduce latency, because the request is satisfied from the cache instead of the origin server, it takes less time for it to get the representation and display it. This makes the Web seem more responsive.

And also, Web Caching can reduce network traffic, because representations are reused, it reduces the amount of bandwidth used by a client. This saves money if the client is paying for traffic, and keeps their bandwidth requirements lower and more manageable.

You can also get more information about the type of web caches, how web caches work, how to control them, tips for building a cache-aware site and etc…

Source: Caching Tutorial for Web Auhors and Webmaters
License: Creative Commons License

Hand-Picked The Best Fonts for Download

Font^ex has spent plenty of hours to compile a list of hand-picked fonts for you. This is an amazing resource for everyone who would like to be presented with amazing free fonts to Download. They are adding some premium fonts on Font^ex soon. The site is profesionally designed. With the help of jQuery, the site becomes more interactive as well.


Source: http://www.fontex.org/

Tokenizing Autocomplete Text Entry with TokenInput

TokenInput jQuery Plugin allows users to select multiple items from a predefined list, using autocompletion as they type to find each item. You may have seen something similar on Facebook or TextboxList by Devthought.

There is an intuitive UI for selecting multiple items from a large list, the layout is fully in controlled with CSS, and easily customisable. Also, the result caching reduces server load. Users can select items using the mouse or keyboard. TokenInput jQuery Plugin is released under GPL2.

Requirements: jQuery Framework
Demo: http://loopj.com/tokeninput/demo.html
License: GPL2 License

Sexy Page Peel Effect Tutorial & jQuery Plugin

You have probably seen these forms of advertisings where you can peel a corner of a website and see a message underneath. SohTanaka has made a tutorial: Simple Page Peel Effect with jQuery & CSS. All they are doing is expanding the image on hover, then retracting to its default size on hover out.

You may also interested in The Sexy Curls jQuery Plugin if you like this tutorial. The page corner can be set to curl automatically. The plugin is released under the MIT license. That means you can do whatever you like with it.

Requirements: jQuery Framework
Demo: http://www.sohtanaka.com/web-design/examples/peeling-effect/
Demo: http://www.elliottkember.com/sexy_curls.html
License: MIT License