crazybiocomputing.github.io/crazybio_workflow.html~ at master · crazybiocomputing/crazybiocomputing.github.io · GitHub

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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="Distribution" content="Global" />
<meta name="Author" content="Jean-Christophe Taveau" />
<meta name="Robots" content="index,follow" />

<link rel="shortcut icon" href="/images/crazybio.ico" />

<title>CrazyBioComputing</title>
<link href='https://fonts.googleapis.com/css?family=Rock+Salt' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
<link href='crazybio.css' rel='stylesheet' type='text/css'>

</head>
<body>
<h1 style="font-family: 'Rock Salt', cursive;"> CrazyBioComputing- BioInformatics</h1>

<div id="nav">
<ul>
<li style="font-family: 'Rock Salt', cursive;"><a href="index.html">Home</a></li>
<li style="font-family: 'Rock Salt', cursive;">Bioinformatics</li>
<li style="font-family: 'Rock Salt', cursive;">GIS</a></li>
<li style="font-family: 'Rock Salt', cursive;">Image Processing</a></li>
<li style="font-family: 'Rock Salt', cursive;"><a href="http://crazybiocomputing.blogspot.com/">Blog</a></li>
<li style="font-family: 'Rock Salt', cursive;">Quizz</a></li>
<li style="font-family: 'Rock Salt', cursive;">Tools</a></li>
</ul>
</div>


<div id="page">
  <div id="left">
    <ul>
      <li>Mini-Games</li>
      <li>Resources</li>
      <li>Tools</li>
    </ul>
  </div>

  <div id="content">

  <p>The CrazyBioWorkFlow is a simple tool to create workflows in the context of the CrazyBioComputing mini-games.</p>
<p><b>Note</b>: You can't use CrazyBioWorkFlow as a real, independent workflow tool.</p>

  <h2>1. Anatomy of a token</h2>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_anatomy.jpg" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig.1.1</b>: Anatomy of a token"</td></tr>
</tbody>
</table>
<h3>1.1. Display the Title</h3>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_hover.jpg" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig.1.2</b>: Display the title by moving the mouse cursor on the token. No click is required. This works in the sandbox and in the board."</td></tr>
</tbody>
</table>

<h3>1.2. Display The contents</h3>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_click_contents.jpg" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig.1.3</b>: Display its contents by left clicking in the center of the token triggering the opening of a popup window. This only works when the token is in the board.</td></tr>
</tbody>
</table>

<h3>1.3. Rotate the token</h3>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_rotate.jpg" width="300px" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig.1.4</b>: By left clicking on the top right button, the token is rotated clockwise.</td></tr>
</tbody>
</table>


  <h2>2. Behavior of a token</h2>
    <p>By default, all the tokens available in a mini-game are located in the sandbox. They are inactivated meaning that you can't click on them to see their contents. However, by hovering the mouse cursor, the title of the token is still visible.</p>
  <h3>2.1. Activation</h3>
<p>To activate a token, drag and drop it on the gameboard as shown in Fig. 2.1.</p>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_activate.jpg" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig. 2.1</b>: Activation of a token by a "click and drop"</td></tr>
</tbody>
</table>

<h3>2.2. Creation of a workflow</h3>
<p>The purpose of this tool is to put tokens side by side to build a workflow.

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_connect.jpg" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig.2.2</b>: Creation of a workflow by appending tokens side by side. The green arrow indicates that the two tokens are locked.</td></tr>
</tbody>
</table>

<h3>2.3. Inputs evaluation</h3>
<p>The order in which inputs are evaluated when more than one token is used in a Tool is important. However, in a CrazyBioWorkFlow, all the input tokens are simultaneously used by a Tool. Thus, to sort the various input tokens, you have to add the '#1' and '#2' tokens to indicate in which order the inputs must be evaluated (see Fig. 2.3 for an example).

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;">
<tbody>
<tr>
<td style="text-align: center;">
<img border="0" src="img/help_subtract.jpg" /></a>
</td>
</tr>
<tr><td class="tr-caption" style="text-align: center;"><b>Fig.2.3</b>: Example of a workflow simulating a subtraction. The inputs must be sorted to get a correct subtraction and this is done by using the two tokens '#1' and '#2'. Top: The workflow does not work properly because two solutions are possible '23-11' or '11-23'. Bottom: In this case, the token '23' is the first evaluated followed by the token '11' in the subtraction Tool.</td></tr>
</tbody>
</table>
    <h2>3. List of tokens</h2>

    <h3>3.1. System Tokens</h3>
    <table style="margin-left: auto; margin-right: auto; vertical-align:middle;">
    <tbody>
    <tr><td style="width:110px"><img src="img/view.png" style="float:left; vertical-align:middle;"></img></td><td> This is a <b>mandatory</b> token used to display the results of the workflow. By clicking on it, you trigger the computation of the workflow. A dialog window warns you about the results of the workflow you built.</td></tr>
    <tr><td><img src="img/void.png"></img></td><td> Void token. The Void is used to lock an empty connector in a workflow because you can't have an empty input connector in a CrazyBioWorkFlow. </td></tr>
    <tr><td><img src="img/question.png"></img></td><td> Anything token. This token is only used for tutorials, debugging and has no special meaning.</td></tr>
    <tr><td><img src="img/first.png"></img></td><td> Token First. Used in combination of token 'Second'. In a CrazyBioWorkFlow, the input tokens are evaluated without any kind of operation precedence. Sometimes, one input must be used FIRST before another input. This is done with the pair of tokens '#1' and '#2'.</td></tr>
    <tr><td><img src="img/second.png"></img></td><td> Token Second. Used in combination of token 'First'. See description above</td></tr>
    </tbody>
    </table>
    <h3>3.2. Input Tokens</h3>
    <table style="margin-left: auto; margin-right: auto; vertical-align:middle;">
    <tbody>
    <tr><td style="width:110px"><img src="img/data.png"></img></td><td> Data. Usually contains text data. No specific action are required.</td></tr>
    <tr><td><img src="img/form.png"></img></td><td> Form input. This token contains a form (textfield, radio boxes, etc.) that you must fill in.</td></tr>
    <tr><td><img src="img/database.png"></img></td><td> Database. This token contains datasets.</td></tr>
    </tbody>
    </table>
    <h3>3.3. Tool Tokens</h3>
    <table style="margin-left: auto; margin-right: auto; vertical-align:middle;">
    <tbody>
    <tr><td style="width:110px"><img src="img/tool.png"></img></td><td> Basic tool.Can have a max of three inputs and only one output.</td></tr>
    <tr><td><img src="img/tool_pen.png"></img></td><td> Advanced Tool. You need to fill in the form (textfield, radio boxes, etc.) for tuning parameters.</td></tr>
    <tr><td><img src="img/filter.png"></img></td><td> Filter. This token filters input data. In most cases, it contains a form (textfield, radio boxes, etc.) that you must fill in for tuning parameters.</td></tr>
    <tr><td><img src="img/settings.png"></img></td><td> Settings. This token is used in conjunction with a Tool and contains a form (textfield, radio boxes, etc.) that you must fill in for setting parameters.</td></tr>
    <tr><td><img src="img/and.png"></img></td><td> AND logical operator.</td></tr>
    <tr><td><img src="img/or.png"></img></td><td> OR logical operator.</td></tr>
    <tr><td><img src="img/not.png"></img></td><td> BUT NOT logical operator.</td></tr>
    </tbody>
    </table>


</div>
</div>
</body>
</html>