Blogfreakz - Web Design and Web Development resources » Prototype/script.aculo.us

TableKit – Sortable Resizable Editable HTML Table

Mufti Ali — Thu, 26 Aug 2010 18:46:59 +0000

TableKit is a collection of HTML table enhancements using the Prototype framework. TableKit currently implements row striping, column sorting, column resizing and cell editing using Ajax.

TableKit allow us to sort the column, by click the table header cells, resize the column by dragging the right border of a header cell, click a cell in the table body to edit the value.

Requirements: Prototype framework
Demo: http://millstream.com.au/upload/code/tablekit/index.html
License: MIT

Incoming search terms for the article:

How to Build a Flash-like game with scripty2

Mufti Ali — Tue, 04 May 2010 13:05:28 +0000

Flash games are facing stiff competition from JavaScript. We’ll see why when we follow along with tutorial by Thomas Fuchs. On this tutorial Thomas Fuchs from http://mir.aculo.us teach us how to create game of memory using javascript.

All we need is a little help from a few open source tools. For the visuals, we use Scripty2 animation framework, the successor to script.aculo.us. We’ll learn about easings, how to use and combine its built-in effects, and how to write your own.

We also use the Prototype JavaScript framework to write shorter, cleaner code, especially when managing the data structures and game logic.

Demo: http://mir.aculo.us/tutorials/scripty2-memory/

Incoming search terms for the article:

Qutensil – Javascript Toolset for Prototype & Scriptaculous

Mufti Ali — Sat, 01 May 2010 15:25:38 +0000

Qutensil (Q.js) is Javascript toolset built on the top prototype.js. and scriptaculous libraries. It features various modules such as growl-like user messaging system, color picker (based on raphaël), slider, tooltip system, draggable window and alert / confirm / prompt windowing system.

Q is using a dynamic stylesheet system. It generates the css declarations on demand and only for the modules active at that time. All background images and fillers are compiled in as few as possible png images. The original vector files are provided as well so you can modify the look and feel in no time.

Requirements: Prototype.js and Scriptaculous
Demo: http://qutensil.com/pages/modules
License:

Incoming search terms for the article:

Horinaja – scriptaculous/prototype or jQuery slide show

Mufti Ali — Sat, 13 Feb 2010 17:49:54 +0000

Horinaja is a ready-to-use slide-show implementation, utilizing either scriptaculous/prototype or jQuery. A running example above
Horinaja is innovative because it allows you to use a mousewheel for navigation. When the mouse is outside of the slide-show area, it scrolls. When hovering over the slide-show, the scrolling pauses.

It can automatically create slide indices (pagination), if required. To manually scroll, either click on the slide index links (pagination) or use your mouse whee.

Requirements: scriptaculous/prototype or jQuery
Demo: http://www.davidmassiani.com/horinaja/index.php
License: CC License

Incoming search terms for the article:

Grafico – charting library built with Raphael and Prototype.

Mufti Ali — Sat, 13 Feb 2010 16:05:28 +0000

Grafico is a javascript charting library built with Raphaël and Prototype.js. The library provides a wide array of graphs and stays with the guidelines laid out by Stephen Few and Edward Tufte. Grafico provides pretty charts that effectively communicate their information.

This means you get awesome graphs such as stacked area charts and sparklines, but no pie charts or bar charts with every bar a different color. Each graph type has numerous API options to customize it’s look and behavior.

Available graphs:

Line graphs
Area graphs
Stacked area graphs
Bar graphs
Horizontal bar graphs
Sparklines
Sparkbars
Sparkareas

Minified, Grafico is about 30kb and available under the MIT license.

Requirements: Raphael and Prototype.js
Demo: http://kilianvalkhof.com/2010/design/grafico-javascript-charting-library/
License: MIT License

Incoming search terms for the article:

CoolTips – lightweight JavaScript tooltips

Mufti Ali — Tue, 05 Jan 2010 16:31:30 +0000

CoolTips is a lightweight unobtrusive JavaScript web-browser tooltips replacement technique. CoolTips is used to replace conventional web-browser tooltips. The tooltips get contents of title attribute, so it’s fully unobtrusive. CoolTips is an OO class based on Prototype JS and script.aculo.us frameworks.

Demo: http://okonet.ru/projects/tooltips/
License: MIT License