TagLib Home.

JotSpot tagging library created by Phil Kast and members of the JotSpot developer community. See the project wiki for more details: http://tag-dev.jot.com.

Contents

• TagLib -- the main tag library
• TagLibCloud? -- cloud manipulation library
• TagLibEditBox? -- UI for adding tags to a page
• TagLibCS.js? -- client-side javascript for dynamic display
• TagLibCSS.css? -- styles the edit box and cloud
• SimpleTagPivot -- trivial pivot page that displays list of tagged pages as a bullet list
• MultiTagPivot -- stripped-down page intended for pivoting on multiple tags
• SimpleTagSearch -- create a cloud of your search terms

Examples

• In your wiki:
  • TagLibDemoPage -- interactive examples based on pages tagged in this wiki and copy/paste documentation. (*Note: if there are no clouds, you don't have any tags in your wiki yet! Add some to the test page.)
  • SimpleTagSearch -- a simple search page that creates a tag cloud of your search terms
• On the web:
  • http://developer.jot.com/WikiHome/WikiTagCloud -- cloud of ALL pages in the Jot Developer Connection wiki
  • http://developer.jot.com/WikiHome/DocTagCloud -- cloud of all documentation pages in the Jot Developer Connection wiki

Documentation

The library is simple and fast. It supports multiple clouds per page. See TagLibDemoPage for live examples.

There are 3 steps to creating a tag cloud:

1. Include the library:

<jot:include node="TagLib" />

2. Create a tag cloud from an array of tags. E.g.

//create a clould based on the current page's tags
var myCloud = new Tag.Cloud(page.main.tags);

or

var myTagArray = new Array("tag1", "footag", "bartag");
var myCloud = new Tag.Cloud(myTagArray);

3. Display the cloud with options (all together now):

<jot:include node="TagLib" />
<jot:script>
var myTagArray = new Array("tag1", "footag", "bartag");
var myCloud = new Tag.Cloud(myTagArray);
myCloud.display({pivot: 'SimpleTagPivot', idPrefix: 'myCloud', dynamic: 'static', containerClass: 'tagCloud'});
</jot:script>

this displays a cloud that:

• uses a page called SimpleTagPivot when tags are clicked
• is surrounded by a DIV with the id myCloud
• redirects to a new page (SimpleTagPivot) when tags are clicked
• uses the CSS class called tagCloud (default -- included in TagLibCSS.css?)

The options for display() are:

• pivot: Pivot page to use for static cloud / no javascript.
• dynamicPivot: Pivot page to use when popping up a dynamic tag cloud.
• idPrefix: Prefix for any IDs assigned to the generated HTML
• containerClass: Set the class of the container div.
• dynamic: Set the style of the edit box: 'static', 'inplace', 'popup' (defaults to inplace).