Developer tools

This module provides basic Drupal integration with Chardin.js a jQuery plugin that creates a simple overlay to display instructions on existent elements. It is inspired by the recent Gmail new composer tour.

You can view a demo of how Chardin.js works here: http://heelhook.github.io/chardin.js/

Dependencies

Libraries API

Recommended

Context and all of its dependencies.

Installation

1. Download the Chardin.js plugin (http://heelhook.github.io/chardin.js/) and extract the files under sites/all/libraries (so the result will be sites/all/libraries/chardin/chardinjs.min.js).
2. Download and enable the module.

Usage

Once the module is enabled, If you have the Context module enabled you are able to enable this modules functionality through contexts similar to the Joyride module OR add attributes to any element:

data-toggle: Add the toggle ability to an anchor element
data-intro: Text to show with the instructions
data-position: (left, top, right, bottom), where to place the text with respect to the element

For Example

Create a toggle button:

Allows users to annotate nodes.

The magic forms module supplies several FAPI tweeks allowing for easier customization of forms.

Features include:

Panels Layout builder based on twitter bootstrap 2 & 3, this will help you to dynamically build panel layouts based on bootstrap grid system.

The new ajax style uploader for user avatar (user picture), including avatar cropping after upload.
Gmail, Quora and more and more websites use this way for user picture uploader.

The Logo Doodle module allows site administrators to have variations of the site logo for special occasions.