Skip to content
GitLab
Commit ad882572 authored by Jerome Mariette's avatar Jerome Mariette
Browse files

wfform documentation ok

parent 9c579ed7
Hide whitespace changes
Inline Side-by-side
docs/example1.html
View file @ ad882572
......@@ -177,7 +177,7 @@
*/
$("#available-workflows-list").availablewf();
$("#available-workflows-list").on('select.available', function(event, workflow) {
$("#available-workflows-list").on('select.availablewf', function(event, workflow) {
$('#setAndRunModal .modal-footer').show();
$('#setAndRunModalLabel').html(workflow["name"] + " <small>" + workflow["help"] + "</small>");
$('#setAndRunModalBody').wfform({
......@@ -188,11 +188,11 @@
$('#setAndRunModal').modal();
});
$('#setAndRunModalBody').on('uploading', function(event, running_wf) {
$('#setAndRunModalBody').on('uploading.wfform', function(event, running_wf) {
$('#setAndRunModal .modal-footer').hide();
});
$('#setAndRunModalBody').on('run', function(event, running_wf) {
$('#setAndRunModalBody').on('run.wfform', function(event, running_wf) {
$('#setAndRunModal').modal('hide');
$('#statusModalLabel').html(running_wf["name"] + " <small>" + running_wf["id"] + "</small>");
$('#statusModalBody').wfstatus({
......@@ -232,7 +232,7 @@
$('.status-panel').hide();
}
$("#active-workflows-list").activewf();
$("#active-workflows-list").on("select.active", function(event, workflow) {
$("#active-workflows-list").on("select.activewf", function(event, workflow) {
$('#statusModalLabel').html(workflow["name"] + " <small>" + workflow["id"] + "</small>");
$('#statusModalBody').wfstatus({
workflowID: workflow.id
......
docs/jflow-plugin.html
View file @ ad882572
......@@ -83,7 +83,14 @@
<li><a href="#activewf_events">Events</a></li>
</ul>
</li>
<li><a href="#wfform">wfform</a></li>
<li><a href="#wfform">wfform</a>
<ul class="nav nav-stacked">
<li><a href="#wfform_example">Example</a></li>
<li><a href="#wfform_options">Options</a></li>
<li><a href="#wfform_methods">Methods</a></li>
<li><a href="#wfform_events">Events</a></li>
</ul>
</li>
<li><a href="#wfstatus">wfstatus</a></li>
</ul>
</nav>
......@@ -120,8 +127,8 @@
<div id="availablewf_options" class="subgroup">
<h2>Options</h2>
<p> Call <code>availablewf</code> with id <code>myDiv</code> with a single line of JavaScript:
<pre class="pre-hl "><code class="python">$('#myDiv').availablewf(options)</code></pre>
<p> Call <code>availablewf</code> with id <code>element</code> with a single line of JavaScript:
<pre class="pre-hl "><code class="python">$('#element').availablewf(options)</code></pre>
<p>Options can be passed via JavaScript.</p>
<div class="table-responsive">
......@@ -148,13 +155,13 @@
<td>string</td>
<td>false</td>
<td><code>-</code></td>
<td>Base HTML to use when creating the list of available workflows. The template will be injected into the defined element (<code>myDiv</code>).</td>
<td>Base HTML to use when creating the list of available workflows. The template will be injected into the defined element (<code>element</code>).</td>
</tr>
<tr>
<td>filters</td>
<td>list</td>
<td>false</td>
<td>new Array()</td>
<td>[]</td>
<td>Defines the workflow classes that should not be displayed.</td>
</tr>
</tbody>
......@@ -167,6 +174,7 @@
<h4>.availablewf('reload')</h4>
<p>Requests the jflow server to reload and refresh the workflow list.
</p>
<pre class="pre-hl "><code class="python">$('#element').availablewf('reload')</code></pre>
</div>
......@@ -182,7 +190,7 @@
</thead>
<tbody>
<tr>
<td>select.available</td>
<td>select.availablewf</td>
<td>This event fires immediately when the user select a workflow on the list. The selected workflow
is given as parameter to the callback function.</td>
</tr>
......@@ -190,7 +198,7 @@
</table>
</div>
<pre class="pre-hl "><code class="python">$('#myDiv').on('select.available', function (workflow) {
<pre class="pre-hl "><code class="python">$('#element').on('select.availablewf', function (workflow) {
// do something…
})</code></pre>
......@@ -209,8 +217,8 @@
<div id="activewf_options" class="subgroup">
<h2>Options</h2>
<p> Call <code>activewf</code> with id <code>myDiv</code> with a single line of JavaScript:
<pre class="pre-hl "><code class="python">$('#myDiv').activewf(options)</code></pre>
<p> Call <code>activewf</code> with id <code>element</code> with a single line of JavaScript:
<pre class="pre-hl "><code class="python">$('#element').activewf(options)</code></pre>
<p>Options can be passed via JavaScript.</p>
<div class="table-responsive">
......@@ -237,7 +245,7 @@
<td>string</td>
<td>false</td>
<td><code>-</code></td>
<td>Base HTML to use when creating the list of available workflows. The template will be injected into the defined element (<code>myDiv</code>).</td>
<td>Base HTML to use when creating the list of active workflows. The template will be injected into the defined element (<code>element</code>).</td>
</tr>
<tr>
<td>metadataFilter</td>
......@@ -256,6 +264,7 @@
<h4>.activewf('reload')</h4>
<p>Requests the jflow server to reload and refresh the active workflow list.
</p>
<pre class="pre-hl "><code class="python">$('#element').activewf('reload')</code></pre>
</div>
......@@ -271,7 +280,7 @@
</thead>
<tbody>
<tr>
<td>select.active</td>
<td>select.activewf</td>
<td>This event fires immediately when the user select a workflow on the list. The selected workflow
with an initialized status is given as parameter to the callback function.</td>
</tr>
......@@ -279,7 +288,7 @@
</table>
</div>
<pre class="pre-hl "><code class="python">$('#myDiv').on('select.active', function (workflow) {
<pre class="pre-hl "><code class="python">$('#element').on('select.activewf', function (workflow) {
// do something…
})</code></pre>
......@@ -287,18 +296,163 @@
</section>
<section id="wfform">
<section id="wfstatus">
<div class="page-header">
<h1>wfform: display the workflow form</h1>
<h1>wfstatus: display the monitoring form</h1>
</div>
</section>
<section id="wfstatus">
<div class="page-header">
<h1>wfstatus: display the monitoring form</h1>
<section id="wfform">
<h1 class="page-header">Workflow form <small>wfform</small></h1>
<div id="wfform_example" class="subgroup">
<h2>Example</h2>
<p></p>
</div>
<div id="wfform_options" class="subgroup">
<h2>Options</h2>
<p> Call <code>wfform</code> with id <code>element</code> with a single line of JavaScript:
<pre class="pre-hl "><code class="python">$('#element').wfform(options)</code></pre>
<p>Options can be passed via JavaScript.</p>
<div class="table-responsive">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Name</th>
<th>type</th>
<th>required</th>
<th>default</th>
<th>description</th>
</tr>
</thead>
<tbody>
<tr>
<td>serverURL</td>
<td>path</td>
<td>false</td>
<td>http://localhost:8080</td>
<td>The remote URL pointing to the jflow server is running.</td>
</tr>
<tr>
<td>[*]Template</td>
<td>string</td>
<td>false</td>
<td><code>-</code></td>
<td><code>wfform</code> provides several templates for several types. As example, the <code>dateTemplate</code> is in charge to
display a date type. The other available templates are <code>choiceTemplate</code>, <code>inputfileTemplate</code>,
<code>browsefileTemplate</code>, <code>regexpfilesTemplate</code>, <code>booleanTemplate</code>, <code>textTemplate</code>
and <code>progressTemplate</code>.</td>
</tr>
<tr>
<td>workflowClass</td>
<td>string</td>
<td>true</td>
<td>none</td>
<td>The workflow class name, as defined in the <code>Python class</code>, of the workflow to build.</td>
</tr>
<tr>
<td>displayRunButton</td>
<td>boolean</td>
<td>false</td>
<td>true</td>
<td>Should <code>wfform</code> display the button in charge to run the workflow.</td>
</tr>
<tr>
<td>displayResetButton</td>
<td>boolean</td>
<td>false</td>
<td>true</td>
<td>Should <code>wfform</code> display the button in charge to reset the workflow.</td>
</tr>
<tr>
<td>parameters</td>
<td>hashtable</td>
<td>false</td>
<td>{}</td>
<td>A hashtable fixing the value of the desired parameters defined by <code>{param:value}</code>. All the parameters with a fixed value
will be hidden from the form populated to the final user.</td>
</tr>
<tr>
<td>timer</td>
<td>number</td>
<td>false</td>
<td>2000</td>
<td>The time in milliseconds between 2 updates of <code>progressTemplate</code> displayed when files have to be uploaded.</td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="wfform_methods" class="subgroup">
<h2>Methods</h2>
<h4>.wfform('reset')</h4>
<p>Resets all the form fields.
</p>
<pre class="pre-hl "><code class="python">$('#element').wfform('reset')</code></pre>
<h4>.wfform('run')</h4>
<p>Requests the jflow server to run the workflow with the specified parameters. Before submiting the workflow to the
server, all the fields are checked. Once the workflow is lunched on the server side, the event <code>run.wfform</code>
is triggered.
</p>
<pre class="pre-hl "><code class="python">$('#element').wfform('run')</code></pre>
<h4>.wfform('render')</h4>
<p>Render the form. This method can be useful when the form is built within a hidden <code>$("#element")</code>. The function
allows to render all form components such as the <code>handsontable</code> displayed for <code>MultiParameterList</code>.
</p>
<pre class="pre-hl "><code class="python">$('#element').wfform('render')</code></pre>
<h4>.wfform('load')</h4>
<p>Load the workflow information and display the corresponding form.
</p>
<pre class="pre-hl "><code class="python">$('#element').wfform('load')</code></pre>
</div>
<div id="wfform_events" class="subgroup">
<h2>Events</h2>
<div class="table-responsive">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Event Type</th>
<th>description</th>
</tr>
</thead>
<tbody>
<tr>
<td>uploaded.wfform</td>
<td>This event fires immediately when the files to upload are all uploaded.</td>
</tr>
<tr>
<td>run.wfform</td>
<td>This event is fired when the workflow has been lunched on the server side.</td>
</tr>
<tr>
<td>uploading.wfform</td>
<td>This event is fired immediately when the upload of the files is started.</td>
</tr>
<tr>
<td>loaded.wfform</td>
<td>This event is fired when the workflow information have been retrieved from the server.</td>
</tr>
</tbody>
</table>
</div>
<pre class="pre-hl "><code class="python">$('#element').on('uploaded.wfform', function (workflow) {
// do something…
})</code></pre>
</div>
</section>
</div>
</div>
......
src/js/jflow-activewf.js
View file @ ad882572
......@@ -81,7 +81,7 @@
$.tmpl($this.options.template, {workflows: workflows_sorted}).appendTo($this.$element);
$("[id^=activewf_btn_]").click(function(){
var workflow_id = $(this).attr("id").split("activewf_btn_")[1];
$this.$element.trigger('select.active', workflow_by_id[workflow_id]);
$this.$element.trigger('select.activewf', workflow_by_id[workflow_id]);
});
$("[id^=activewf_refresh_]").click(function(){
$this.reload();
......
src/js/jflow-availablewf.js
View file @ ad882572
......@@ -67,7 +67,7 @@
$.tmpl($this.options.template, {workflows: data, filters: $this.options.filters}).appendTo($this.$element);
$("[id^=availablewf_btn_]").click(function(){
var workflow_class = $(this).attr("id").split("availablewf_btn_")[1];
$this.$element.trigger('select.available', workflow_by_class[workflow_class]);
$this.$element.trigger('select.availablewf', workflow_by_class[workflow_class]);
});
}
});
......
src/js/jflow-wfform.js
View file @ ad882572
......@@ -301,7 +301,7 @@ Handsontable.cellTypes["bootdate"] = Handsontable.BootstrapDateCell;
});
if (allUploaded && !justinit) {
clearInterval(timer);
elt.$element.trigger('uploaded');
elt.$element.trigger('uploaded.wfform');
}
$("#workflow_form").hide();
$("#progress").html("");
......@@ -410,7 +410,7 @@ Handsontable.cellTypes["bootdate"] = Handsontable.BootstrapDateCell;
if (!$(this).prop('checked')) { params += $(this).attr("name") + "=false&"; }
});
$this.$element.on("uploaded", function() {
$this.$element.on("uploaded.wfform", function() {
$this.$element.off("uploaded");
$.ajax({
url: $this.options.serverURL + '/run_workflow?' + params + 'callback=?',
......@@ -418,7 +418,7 @@ Handsontable.cellTypes["bootdate"] = Handsontable.BootstrapDateCell;
success: function(data) {
// Ajax success
if( data["status"] == 0 ) {
$this.$element.trigger('run', data["content"]);
$this.$element.trigger('run.wfform', data["content"]);
// Ajax error
} else {
var alert_message = ['<div class="alert alert-danger" role="alert">',
......@@ -431,7 +431,7 @@ Handsontable.cellTypes["bootdate"] = Handsontable.BootstrapDateCell;
});
});
$this.$element.trigger('uploading');
$this.$element.trigger('uploading.wfform');
var nbdata2submit = 0;
// submit the data of each fileupload
......@@ -450,7 +450,7 @@ Handsontable.cellTypes["bootdate"] = Handsontable.BootstrapDateCell;
// then loop to follow the file upload
timer = setInterval(function() { _uploadProgress($this, false) }, $this.options.timer);
} else {
$this.$element.trigger('uploaded');
$this.$element.trigger('uploaded.wfform');
}
}
}
......@@ -526,7 +526,7 @@ Handsontable.cellTypes["bootdate"] = Handsontable.BootstrapDateCell;
}
}
// trigger an event to specify the workflow is loaded
$this.$element.trigger('loaded', $this.workflow);
$this.$element.trigger('loaded.wfform', $this.workflow);
$this.$element.html("");
$.tmpl(
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment