Extension:JSWikiGantt

MediaWiki extensions manual - list

JSWikiGantt Release status: beta
Implementation	Tag
Description	Draws Gantt charts inside wiki articles.
Author(s)	• Extension code and fixes by Maciej "Nux" Jaros, • JSGantt by Shlomy Gantz, • Xaprb JavaScript date formatting by Baron Schwartz
Last version	0.5.5 (2012-05-14)
MediaWiki	1.16
PHP	5.1+
License	GNU General Public License 2.0 or later
Download	JSWikiGantt0.5.5.zip
Parameters mostly you'll want to change "$wgJSGanttConfig" (see "JSWikiGantt.config.php" for details)
Tags <jsgantt>
Hooks used ParserFirstCallInit ParserAfterTidy
Check usage (experimental)

This extension aims to allow adding Gantt charts (diagrams) to wiki pages without the need of exporting diagrams to PNG.

This is achieved by allowing users to add simple XML definition of diagrams in <jsgantt> tag. Currently only one diagram per page is allowed (which is due to the limitations of the original JSGantt).

Note: This extension is based on JSGantt project started by Shlomy Gantz and Xaprb JavaScript date formatting by Baron Schwartz. See jsgantt.js and date-functions.js for licensing details of these modules.

Usage

To add a diagram to a page, simply add a <jsgantt> tag with <task> tags inside it (described below).

The <jsgantt> tag can have only one attribute:

autolink 

if set to 1, your tasks will be automatically linked based on the task id (very useful if you use task ids from your bug tracking software). Remember to set $wgJSGanttConfig['TasksAutoLink'] in JSWikiGantt.config.php if you use this. The default state of autolinking is set with the $wgJSGanttConfig['AutoLinks'] variable.

Tasks tags

Tags that can be used inside the <task> tag are described below.

Tag name	required?	example value	description
pID	yes	10	a task id
pName	yes	Heal the world	a task name/title
pStart	yes/no	2011-01-01	ISO style date when this task should be started; not required for groups
pEnd	yes/no	2011-12-31	ISO style date when this task should end; not required for groups
pColor	yes	00FF00	a color of this task on a diagram (color of a bar that is on the right side of a diagram)
pLink	no	http://world.peace/for-dummies	URL that can e.g. point to a description of a task (omit if you use autolinks to e.g. point to your bugzilla/flyspray or whatever bug killer you use)
pMile	no	0	milestone number
pRes	no	Mr. Healer	resource name (e.g. developer that is assigned to this task)
pComp	yes/no	0	task completeness percentage (0-100); not required for groups
pGroup	no	0	if set to 1, this is a grouping task (use this task id as other tasks' parent to make them grouped by this task)
pParent	no	0	id of a grouping task that is a parent of this task
pOpen	no	1	this is only meaningful for groups - if set to 1, this group will be closed by default (subtasks will be hidden)
pDepend	no	11	id of a task that this tasks depends on (will be indicated by an arrow)

Note. You might actually skip some required values if you are putting tags directly in your article (loading diagram from an external article is not advised anyway - left for backward compatibility).

Example

Rendering of the code

Example code:

<jsgantt>
<task>
        <pID>10</pID>
        <pName>WCF Changes</pName>
        <pColor>0000ff</pColor>
        <pLink></pLink>
        <pMile>0</pMile>
        <pRes></pRes>
        <pComp>0</pComp>
        <pGroup>1</pGroup>
        <pParent>0</pParent>
        <pOpen>1</pOpen>
        <pDepend></pDepend>
</task>
<task>
        <pID>20</pID>
        <pName>Move to WCF from remoting</pName>
        <pStart>2010-07-11</pStart>
        <pEnd>2010-07-15</pEnd>
        <pColor>0000ff</pColor>
        <pLink></pLink>
        <pMile>0</pMile>
        <pRes>Rich</pRes>
        <pComp>10</pComp>
        <pGroup>0</pGroup>
        <pParent>10</pParent>
        <pOpen>1</pOpen>
        <pDepend></pDepend>
</task>
<task>
        <pID>30</pID>
        <pName>add Auditing</pName>
        <pStart>2010-07-19</pStart>
        <pEnd>2010-07-21</pEnd>
        <pColor>0000ff</pColor>
        <pLink></pLink>
        <pMile>0</pMile>
        <pRes>Mal</pRes>
        <pComp>50</pComp>
        <pGroup>0</pGroup>
        <pParent>10</pParent>
        <pOpen>1</pOpen>
        <pDepend>20</pDepend>
</task>
</jsgantt>

Installation

1. Download the files from the link in the infobox and place them under $IP/extensions/JSWikiGantt
2. At the end of LocalSettings.php, add:
   require_once("$IP/extensions/JSWikiGantt/JSWikiGantt.php");
3. Installation can now be verified through Special:Version on your wiki

See also

• Extension:JobSchEd - interface for editing one of types of Gantt diagrams
• Extension:EasyTimeline - other timeline drawing extension
• Extension:Semantic Project Management - generates Gantt-Charts out of semantic queries