Tag Cloud

  • Tags: jquery, tagcloud, gui
  • Latest: 0.3
  • Last Updated: 14 March 2010
  • Grails version: 1.2.0 > *
  • Authors: null
1 vote
Dependency:
compile ":tagcloud:0.3"

 Documentation

Summary

Installation

grails install-plugin tagcloud

Description

Introduction

The plugin provides GSP tag that allow to simple create "tag cloud" in GSP pages. If you use Taggable Plugin, you can display easy tags related to given class. Tag Cloud plugin is based on jquery.tagcloud.js.

Tag Cloud depends on jQuery Plugin. If you don't use it in your aplication, will be installed automatically.

Generated tag cloud is wrapped in a <div> with a id="tc_tagcloud", so you can style it with css (eg. width).

Issue tracker and sources are hosted on github http://github.com/maszkara/grails-tagcloud-plugin

Usage

Without Taggable Plugin

Add to your GSP page:

<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}" />

With Taggable Plugin

If you have in application Domain Class which implements org.grails.taggable.Taggable (from Taggable Plugin):

import org.grails.taggable.*

class Vehicle implements Taggable { }

you can render easy all tags related to this class - you only need add to your GSP page:

<tc:tagCloud bean="${Vehicle}" />

Configuration

Attributes which can be used for customize:

  • tags - map which contains tags (key) and amounts (value)
<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}" />

If it is used with bean attribute, tags attribute will be ignored.
  • bean - class implements org.grails.taggable.Taggable interface. All tags related to this class will be show in tag cloud.
  • sort - tags will be sorted alphabetically, if set to true (default: false )
  • controller - controller which is used to create tag links (default: current controller)
  • action - action which is used to create tag links (default: current action)
  • paramName - param to which tag will be assigned (default: id)
  • id - value which will be assigned to id param
  • color - map which contains boundary color values
<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}"
                    color="${[start: '#f00', end: '#00f']}" />
  • size - map which contains boundary size values
<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}"
                    size="${[start: 10, end: 40, unit: 'px']}" />

You can use each unit which is valid for css.

Example

<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}"
                    size="${[start: 10, end: 40, unit: 'px']}"
                    color="${[start: '#f00', end: '#00f']}"
                    controller="tag" 
                    action="show" />

This code will generate tag with colors from red to blue and size 10 to 40 px.

Code like this:

<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}"
                    controller="myController"
                    action="myAction"
                    id="5"
                    paramName="myParam" />
will make link for tag green:
<a href="/app-name/myController/myAction/5?myParam=green">green</a>

If you skip id and paramName attributes:

<tc:tagCloud tags="${[green: 5, red: 10, blue: 1, black: 24, purple: 17]}"
                    controller="myController"
                    action="myAction" />
result will be like this:
<a href="/app-name/myController/myAction/green">green</a>

Plugin version history

v.0.3 (2010-03-14)

v. 0.2.1 (2010-02-04)
  • Attribute sort added
v. 0.2 (2010-01-31)
  • Attributes paramName and id added
  • jQuery removed from package (it's provided by jQuery plugin)
  • Code cleaned
v. 0.1 (2010-01-24)
  • Rendered tags from Taggable interface or from Map
  • configurable look