[CCSDK-28] populated the seed code for dgbuilder
[ccsdk/distribution.git] / dgbuilder / nodes / dge / dgelogic / call.html
1 <!--
2   Copyright 2013 IBM Corp.
3
4   Licensed under the Apache License, Version 2.0 (the "License");
5   you may not use this file except in compliance with the License.
6   You may obtain a copy of the License at
7
8   http://www.apache.org/licenses/LICENSE-2.0
9
10   Unless required by applicable law or agreed to in writing, software
11   distributed under the License is distributed on an "AS IS" BASIS,
12   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13   See the License for the specific language governing permissions and
14   limitations under the License.
15 -->
16
17 <script type="text/x-red" data-template-name="call">
18     <div class="form-row">
19         <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
20         <input type="text" id="node-input-name" placeholder="Name">
21     </div>
22     <div class="form-row">
23         <label for="node-input-xml"><i class="fa fa-wrench"></i> Node XML</label>
24         <input type="hidden" id="node-input-xml" autofocus="autofocus">
25         <div style="height: 450px;" class="node-text-editor" id="node-input-xml-editor" onkeyup="resetStatus()" ></div>
26     </div>
27     <div class="form-row">
28     <a href="#" class="btn btn-mini" id="node-input-validate" style="margin-top: 4px;"><b>Validate XML</b></a>
29     <a href="#" class="btn btn-mini" id="node-input-show-sli-values" style="margin-top: 4px;"><b>Show Values</b></a>
30     <input type="hidden" id="node-input-comments">
31     <a href="#" class="btn btn-mini" id="node-input-btnComments" style="margin-top: 4px;"><b>Add Comments</b></a>
32     <div id="node-validate-result" class="form-tips" style="float:right;font-size:10px"></div>
33     </div>
34     <div class="form-tips">See the Info tab for help using this node.</div>
35 </script>
36
37 <script type="text/x-red" data-help-name="call">
38         <p>A call node.</p>
39         <p>Name can be anything.</p>
40         <p>Do not include closing tag - it will be automatically generated.</p>
41
42 <div class="section">
43 <h4><a name="Call_node"></a>Call node</h4>
44 <div class="section">
45 <h5><a name="Description"></a>Description</h5>
46 <p>A <b>call</b> node is used to call another graph</p></div>
47 <div class="section">
48 <h5><a name="Attributes"></a>Attributes</h5>
49 <table border="1" class="table table-striped">
50 <tr class="a">
51 <td align="center"><b>module</b></td>
52 <td align="left">Module of directed graph to call. If unset, defaults to that of calling graph</td></tr>
53 <tr class="b">
54 <td align="center"><b>rpc</b></td>
55 <td align="left">rpc of directed graph to call.</td></tr>
56 <tr class="a">
57 <td align="center"><b>version</b></td>
58 <td align="left">version of graph to call, If unset, uses active version.</td></tr>
59 <tr class="b">
60 <td align="center"><b>mode</b></td>
61 <td align="left">mode (sync/async) of graph to call. If unset, defaults to that of calling graph.</td></tr></table></div>
62 <div class="section">
63 <h5><a name="Parameters"></a>Parameters</h5>
64 <p>Not applicable</p></div>
65 <div class="section">
66 <h5><a name="Outcomes"></a>Outcomes</h5>
67 <table border="1" class="table table-striped"><caption> .</caption>
68 <tr class="a">
69 <td align="center"><b>success</b></td>
70 <td align="left">Sub graph returned success</td></tr>
71 <tr class="b">
72 <td align="center"><b>not-found</b></td>
73 <td align="left">Graph not found</td></tr>
74 <tr class="a">
75 <td align="center"><b>failure</b></td>
76 <td align="left">Subgraph returned success</td></tr></table></div>
77 <div class="section">
78 <h5><a name="Example"></a>Example</h5>
79 <div class="source">
80 <pre>&lt;call rpc=&quot;svc-topology-reserve&quot; mode=&quot;sync&quot; /&gt;</pre></div></div></div>
81
82 </script>
83
84
85 <script type="text/javascript">
86     RED.nodes.registerType('call',{
87         color:"#fdd0a2",
88         category: 'DGElogic',
89         defaults: {
90             name: {value:"call"},
91             xml: {value:"<call module='' rpc='' mode='sync' >\n"},
92             comments:{value:""},        
93             outputs: {value:1}
94         },
95         inputs:1,
96         outputs:1,
97         icon: "arrow-in.png",
98         label: function() {
99             return this.name;
100         },
101         oneditprepare: function() {
102             $( "#node-input-outputs" ).spinner({
103                 min:1
104             });
105
106
107              var comments = $( "#node-input-comments").val();
108              if(comments != null){
109                 comments = comments.trim();
110                 if(comments != ''){
111                         $("#node-input-btnComments").html("<span style='color:blue;'><b>View Comments</b></span>");
112                 }
113              }
114
115             function functionDialogResize(ev,ui) {
116                 $("#node-input-xml-editor").css("height",(ui.size.height-275)+"px");
117             };
118
119             $( "#dialog" ).dialog( "option", "width", 1200 );
120             $( "#dialog" ).dialog( "option", "height", 750 );
121             $( "#dialog" ).on("dialogresize", functionDialogResize);
122             $( "#dialog" ).one("dialogopen", function(ev) {
123                 var size = $( "#dialog" ).dialog('option','sizeCache-function');
124                 if (size) {
125                     functionDialogResize(null,{size:size});
126                 }
127             });
128
129             /* close dialog when ESC is pressed and released */ 
130             $( "#dialog" ).keyup(function(event){
131                 if(event.which == 27 ) {
132                         $("#node-dialog-cancel").click();
133                 }
134             }); 
135
136             $( "#dialog" ).one("dialogclose", function(ev,ui) {
137                 var height = $( "#dialog" ).dialog('option','height');
138                 $( "#dialog" ).off("dialogresize",functionDialogResize);
139             });
140             var that = this;
141             require(["orion/editor/edit"], function(edit) {
142                 that.editor = edit({
143                     parent:document.getElementById('node-input-xml-editor'),
144                     lang:"html",
145                     contents: $("#node-input-xml").val()
146                 });
147                 RED.library.create({
148                     url:"functions", // where to get the data from
149                     type:"function", // the type of object the library is for
150                     editor:that.editor, // the field name the main text body goes to
151                     fields:['name','outputs']
152                 });
153                 $("#node-input-name").focus();
154                 $("#node-input-validate").click(function(){
155                                 console.log("validate clicked.");
156                                 //console.dir(that.editor);
157                                 //console.log("getText:" + that.editor.getText());
158                                 var val = that.editor.getText();
159                                 validateXML(val); 
160                 });
161                 $("#node-input-show-sli-values").click(function(){
162                                 //console.log("show Values clicked.");
163                                 showValuesBox(that.editor,rpcValues);
164                 });
165
166             });
167             //for click of add comments button
168             $("#node-input-btnComments").click(function(e){
169                         showCommentsBox();
170             }); 
171         },
172         oneditsave: function() {
173             $("#node-input-xml").val(this.editor.getText());
174                 var resp=validateXML(this.editor.getText());
175                 if(resp){
176                         this.status = {fill:"green",shape:"dot",text:"OK"};
177                 }else{
178                         this.status = {fill:"red",shape:"dot",text:"ERROR"};
179                 }       
180                 delete this.editor;
181         }
182     });
183 </script>