/
FlowchartPlugin.txt
155 lines (127 loc) · 8.76 KB
/
FlowchartPlugin.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
---+!! <nop>%TOPIC%
You can create flowcharts from textual content on the topic.
<div align="right">
<small>[[Foswiki:Extensions.FlowchartPluginPtbr][Este t�pico em Portugu�s do Brasil]]</small>
</div>
%TOC%
------
---++ Example
<center>
%INCLUDE{"%PUBURL%/%WEB%/FlowchartPluginExample/flowchartMapImg_FlowchartPluginExample.txt"}%
<img src="%PUBURL%/%WEB%/FlowchartPluginExample/flowchart_FlowchartPluginExample.png" usemap="flowchart_FlowchartPluginExample" alt="Fuxograma de Exemplo" border="0" />
<small>
%BR% Stop the mouse above each item and see the tag with the name in a bigger size.
%BR% Each item is a link for the text block what was created it and where can exist more information about this step.
</small>
%BR% *[[%PUBURL%/%WEB%/FlowchartPluginExample/flowchart_FlowchartPluginExample.svg][The Based SVG]]*
</center>
The example above was generated by the content of the topic FlowchartPluginExample
In the text to define the itens of the Flowchart you must to write by this way for each item:
<verbatim>
---++ Item of the Flowchart
* Id: unic_nome
* Type: Question
* Yes: item_A
* No: item_B
</verbatim>
To a better example see the [[FlowchartPlugin Example]].
---++ Syntax Rules
To create and present the flowchart, add the variable =%<nop>FLOWCHART%= ou =%<nop>FLOWCHART{%GRAY%Parameters%ENDCOLOR%}%=.
This plugin
Plugin collects the content of the text and considers that each heading level two =---++= indicate the beginning of the definition of a new item of the flowchart.
To specify the item and the derived action is expected a list of the type =* Attribute: Value=
| *Atribute* | *Commentary* |
| =Type= | Type of the flowchart's item. Default: =Action= |
| =Id= | Identification for the =Goto=. It needs to validate with =/[_a-zA-Z0-9]*/= |
| =Color= | Color differentiated for the item |
| =Goto= | Indicates so that item it must follow. Default: =Next= |
| =Yes= | The same as =Goto=, but is obligator for =Type: Question= |
| =No= | The same as =Goto=, but is obligator for =Type: Question= |
The valid types are:
| *Type* | *Commentary* |
| =Start= | Indicates the beginning of a flowchart. It must be placed in its first item |
| =Action= | The standard type. It indicates an action |
| =Question= | Opens a bifurcation in the flow. It compels the definition of attributes =Yes= e =No= |
| =End= | Indicates the end of the flowchart (or part of it) |
| =End-Error= | Differentiated end for the error case |
To control the beginning and end of of valid headings for the construction of the Flowchart use =%<nop>FLOWCHART_START%= and =%<nop>FLOWCHART_STOP%=.
If a name is excessively big for the space of the item a line break can be made with =%<nop>FLOWCHART_BR%=, that does not intervene with the text of the page, only in the flowchart.
To personalize a flowchart, is enough to add parametros to the variable: =%<nop>FLOWCHART{%GRAY%Parameters%ENDCOLOR%}%=
%BR% The valid parametros are:
| *Parameter* | *Commentary* |
| =item-w= | Width for the flowchart's itens area |
| =item-h= | Height for the flowchart's itens |
| =area-w= | Width of the area of the flowchart's itens |
| =area-h= | Height of the area of the flowchart's itens |
| =percent= | Percentage of the PNG size presented in relation to the standard of the generated SVG |
| =text-size= | Size in pixels of the font text |
| =tag-style= | Style for the =img= tag |
---+++ Tips
%I% The web bowsers normally make cache of the web page and of the elements contained in that (images, anima��es, sounds...). It is possible that after to save the modification in the definition of the flowchart you do not see the effect of the modification in the image. In this case click "Reload" in your web browser.
%I% Some flowcharts can become so complex and will be difficult to follow its lines. In this case, increase the area of itens, giving a bigger space between them. _eg:_ =%<nop>FLOWCHART{ area-w="220" area-h="100" }%=
---++ Construction of the Flowchart and Plugin's Working Way
1 The blocks initialized by a heading level two =---++= are read as definition of item of the Flowchart (as the Foswiki:Extensions.SlideShowPlugin).
1 A SVG is created with this information and is annexed in the topic. This SVG file can be had access by =%<nop>ATTACHURL%/flowchart_%<nop>TOPIC%.svg=.
1 A PNG is generated with the [[http://www.imagemagick.org][ImageMagick]] and reduced, so that the image has a good anti-aliasing, that it is not obtained in the direct conversion. The PNG is annexed in the topic and can be had access by =%<nop>ATTACHURL%/flowchart_%<nop>TOPIC%.png= (use this advantage to separate the flowchart's image of the definition topic when it is interesting).
1 Is created a map for the image linking the itens of the flowchart whith the origin of its information, where can exist more information for implementation. =%<nop>ATTACHURL%/flowchartMapImg_%<nop>TOPIC%.txt= (use to map the image out off the topic where the flowchart was generated too)
%BR% =%<nop>INCLUDE{"%<nop>PUBURL%/Web/FlowchartTopic/flowchartMapImg_FlowchartTopic.txt"}%=
%BR% =<img src="%<nop>PUBURL%/Web/FlowchartTopic/flowchart_<nop>FlowchartTopic.png" usemap="flowchart_<nop>FlowchartTopic" alt="Flowchart" border="0" />=
1 The content of the map file and one image tag presenting the PNG are placed in the place of variable =%<nop>FLOWCHART%=.
The files (SVG, PNG and Map) are generated when the topic contend =%<nop>FLOWCHART%= is saved.
---++ Plugin Settings
Plugin settings are stored as preferences variables. To reference a plugin setting write ==%<nop><plugin>_<setting>%==, i.e. ==%<nop>INTERWIKIPLUGIN_SHORTDESCRIPTION%==
* One line description, is shown in the %SYSTEMWEB%.TextFormattingRules topic:
* Set SHORTDESCRIPTION = Bilds a flowchart from information on the topic
* Standard width for the flowchart's itens
* Set ITEM_WIDTH = 140
* Standard height for the flowchart's itens
* Set ITEM_HEIGHT = 40
* Standard width for the area of the flowchart's itens
* Set ITEM_AREA_W = 180
* Standard height of the area of the flowchart's itens
* Set ITEM_AREA_H = 70
* Standard size in pixels of the font text
* Set TEXT_SIZE = 17
* Standard percentage of the PNG size presented in relation to the standard of the generated SVG
* Set PERCENT_IMG = 70
* Standard style for the =img= tag
* Set TAG_STYLE = border:1px dotted #505050;
* Debug plugin: (See output in =data/debug.txt=)
* Set DEBUG = 0
#InstallationInstructions
---++ Plugin Installation Instructions
__Note:__ You do not need to install anything on the browser to use this plugin. The following instructions are for the administrator who installs the plugin on the server where TWiki is running.
* Download the ZIP file from the Plugin web (see below)
* Unzip ==%TOPIC%.zip== in your twiki installation directory. Content:
| *File:* | *Description:* |
| ==data/TWiki/%TOPIC%.txt== | Plugin topic |
| ==data/TWiki/%TOPIC%.txt,v== | Plugin topic repository |
| ==data/TWiki/FlowchartPluginExample.txt== | Plugin Example |
| ==data/TWiki/FlowchartPluginExample.txt,v== | Plugin Example repository |
| ==lib/TWiki/Plugins/%TOPIC%.pm== | Plugin Perl module |
| ==pub/TWiki/FlowchartPluginExample/flowchart_FlowchartPluginExample.png== | The example image to show |
| ==pub/TWiki/FlowchartPluginExample/flowchart_FlowchartPluginExample.svg== | The example base SVG |
| ==pub/TWiki/FlowchartPluginExample/flowchartMapImg_FlowchartPluginExample.txt== | The example map file |
* Install the [[http://www.imagemagick.org][ImageMagick]]
* (Dakar) Visit =configure= in your TWiki installation, and enable the plugin in the {Plugins} section.
* Test if the installation was successful:
* See the %SYSTEMWEB%.FlowchartPluginExample
---++ Plugin Info
<!-- INI Plugin Info -->
| Plugin Author: | TWiki:Main.AurelioAHeckert |
| Plugin Version: | %$VERSION% |
| Change History: | <!-- versions below in reverse order --> |
| 13786 | Bugs:Item4090 - Failed if topics attachment directory did not exist (TWiki:Main.AndrewRJones). |
| 13779 | Bugs:Item4085 - Fixed problem with subwebs. Patch by TWiki:Main.JohnWorsley. |
| 27 Jun 2005: | Initial public version 0.8 |
| TWiki Dependency: | $TWiki::Plugins::VERSION 1.024 |
| CPAN Dependencies: | none |
| Other Dependencies: | [[http://www.imagemagick.org][ImageMagick]] |
| Perl Version: | 5.005 |
| License: | GPL ([[http://www.gnu.org/copyleft/gpl.html][GNU General Public License]]) |
| Foswiki:Extensions/Benchmark: | %SYSTEMWEB%.GoodStyle nn%, %SYSTEMWEB%.FormattedSearch nn%, %TOPIC% nn% |
| Plugin Home: | http://foswiki.org/Extensions/%TOPIC% |
| Feedback: | http://foswiki.org/Extensions/%TOPIC%Dev |
| Appraisal: | http://foswiki.org/Extensions/%TOPIC%Appraisal |
<!-- FIM Plugin Info -->
__Related Topics:__ %SYSTEMWEB%.DefaultPreferences, %USERSWEB%.SitePreferences, [[%SYSTEMWEB%.Plugins][Plugins]]