dgbuilder/nodes/dge/dgelogic/block.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 <script type="text/x-red" data-template-name="block">
  17     <div class="form-row">
  18         <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
  19         <input type="text" id="node-input-name" placeholder="Name">
  20     </div>
  21     <div class="form-row">
  22         <div>
  23         <table border='0' width='100%' style='cellspacing:5px;'>
  24         <tr>
  25         <td>
  26         <input type="checkbox" id="node-input-atomic-chkBox" onclick=updateXml()>
  27         <input type="hidden" id="node-input-atomic" value="">
  28         </td>
  29         <td>
  30         <span style="font-size:.8em;">Atomic</span>
  31         </td>
  32         </tr>
  33         </table>
  34         </div>
  35         <label for="node-input-xml"><i class="fa fa-wrench"></i> Node XML</label>
  36         <input type="hidden" id="node-input-xml" autofocus="autofocus">
  37         <div style="height: 450px;" class="node-text-editor" id="node-input-xml-editor" onkeyup="resetStatus()" ></div>
  38     </div>
  39     <div class="form-row">
  40     <a href="#" class="btn btn-mini" id="node-input-validate" style="margin-top: 4px;"><b>Validate XML</b></a>
  41     <a href="#" class="btn btn-mini" id="node-input-show-sli-values" style="margin-top: 4px;"><b>Show Values</b></a>
  42     <input type="hidden" id="node-input-comments">
  43     <a href="#" class="btn btn-mini" id="node-input-btnComments" style="margin-top: 4px;"><b>Add Comments</b></a>
  44     <div id="node-validate-result" class="form-tips" style="float:right;font-size:10px"></div>
  45     </div>
  46     <div class="form-tips">See the Info tab for help using this node.</div>
  47 </script>
  48
  49 <script type="text/x-red" data-help-name="block">
  50         <p>A block node.</p>
  51         <p>Name can be anything.</p>
  52         <p>Do not include closing tag - it will be automatically generated.</p>
  53
  54         <div class="section">
  55 <h3><a name="Flow_Control"></a>Flow Control</h3>
  56 <div class="section">
  57 <h4><a name="Block_node"></a>Block node</h4>
  58 <div class="section">
  59 <h5><a name="Description"></a>Description</h5>
  60 <p>A <b>block</b> node is used to executes a set of nodes. </p></div>
  61 <div class="section">
  62 <h5><a name="Attributes"></a>Attributes</h5>
  63 <table border="1" class="table table-striped">
  64 <tr class="a">
  65 <td align="center"><b>atomic</b></td>
  66 <td align="left">if <i>true</i>, then if a node returns failure, subsequent nodes will not be executed and nodes already executed will be backed out.</td></tr></table></div>
  67 <div class="section">
  68 <h5><a name="Parameters"></a>Parameters</h5>
  69 <p>None</p></div>
  70 <div class="section">
  71 <h5><a name="Outcomes"></a>Outcomes</h5>
  72 <p>None</p></div>
  73 <div class="section">
  74 <h5><a name="Example"></a>Example</h5>
  75 <div class="source">
  76 <pre>&lt;block&gt;
  77   &lt;record plugin=&quot;org.onap.ccsdk.sli.core.sli.recording.FileRecorder&quot;&gt;
  78     &lt;parameter name=&quot;file&quot; value=&quot;/tmp/sample_r1.log&quot; /&gt;
  79     &lt;parameter name=&quot;field1&quot; value=&quot;__TIMESTAMP__&quot;/&gt;
  80     &lt;parameter name=&quot;field2&quot; value=&quot;RESERVED&quot;/&gt;
  81     &lt;parameter name=&quot;field3&quot; value=&quot;$asePort.uni_circuit_id&quot;/&gt;
  82   &lt;/record&gt;
  83   &lt;return status=&quot;success&quot;&gt;
  84     &lt;parameter name=&quot;uni-circuit-id&quot; value=&quot;$asePort.uni_circuit_id&quot; /&gt;
  85   &lt;/return&gt;
  86 &lt;/block&gt;</pre></div></div></div>
  87
  88 </script>
  89
  90
  91 <script type="text/javascript">
  92  var blockXmlEditor ;
  93     RED.nodes.registerType('block',{
  94         color:"#fdd0a2",
  95         category: 'DGElogic',
  96         defaults: {
  97             name: {value:"block"},
  98             xml: {value:"<block>\n"},
  99             atomic: {value:"false"},
 100             comments:{value:""},
 101             outputs: {value:1}
 102         },
 103         inputs:1,
 104         outputs:1,
 105         icon: "arrow-in.png",
 106         label: function() {
 107             return this.name;
 108         },
 109         oneditprepare: function() {
 110             $( "#node-input-outputs" ).spinner({
 111                 min:1
 112             });
 113
 114              var comments = $( "#node-input-comments").val();
 115              if(comments != null){
 116                 comments = comments.trim();
 117                 if(comments != ''){
 118                         $("#node-input-btnComments").html("<span style='color:blue;'><b>View Comments</b></span>");
 119                 }
 120              }
 121
 122                 var atomic = $( "#node-input-atomic").val();
 123                 if(atomic == "true"){
 124                         $('#node-input-atomic-chkBox').prop('checked', true);
 125                 }else{
 126                         $('#node-input-atomic-chkBox').prop('checked', false);
 127                 }
 128
 129
 130             function functionDialogResize(ev,ui) {
 131                 $("#node-input-xml-editor").css("height",(ui.size.height-275)+"px");
 132             };
 133
 134             $( "#dialog" ).dialog( "option", "width", 1200 );
 135             $( "#dialog" ).dialog( "option", "height", 750 );
 136             $( "#dialog" ).on("dialogresize", functionDialogResize);
 137             $( "#dialog" ).one("dialogopen", function(ev) {
 138                 var size = $( "#dialog" ).dialog('option','sizeCache-function');
 139                 if (size) {
 140                     functionDialogResize(null,{size:size});
 141                 }
 142             });
 143
 144             /* close dialog when ESC is pressed and released */
 145             $( "#dialog" ).keyup(function(event){
 146                 if(event.which == 27 ) {
 147                         $("#node-dialog-cancel").click();
 148                 }
 149             });
 150
 151             $( "#dialog" ).one("dialogclose", function(ev,ui) {
 152                 var height = $( "#dialog" ).dialog('option','height');
 153                 $( "#dialog" ).off("dialogresize",functionDialogResize);
 154             });
 155             var that = this;
 156             require(["orion/editor/edit"], function(edit) {
 157                 that.editor = edit({
 158                     parent:document.getElementById('node-input-xml-editor'),
 159                     lang:"html",
 160                     contents: $("#node-input-xml").val()
 161                 });
 162                 blockXmlEditor=that.editor;
 163                 RED.library.create({
 164                     url:"functions", // where to get the data from
 165                     type:"function", // the type of object the library is for
 166                     editor:that.editor, // the field name the main text body goes to
 167                     fields:['name','outputs']
 168                 });
 169                 $("#node-input-name").focus();
 170                 $("#node-input-validate").click(function(){
 171                                 //console.log("validate clicked.");
 172                                 //console.dir(that.editor);
 173                                 //console.log("getText:" + that.editor.getText());
 174                                 var val = that.editor.getText();
 175                                 validateXML(val);
 176                 });
 177                 $("#node-input-show-sli-values").click(function(){
 178                                 //console.log("SLIValues clicked.");
 179                                 showValuesBox(that.editor,sliValuesObj);
 180                 });
 181
 182             });
 183             //for click of add comments button
 184             $("#node-input-btnComments").click(function(e){
 185                         showCommentsBox();
 186             });
 187         },
 188         oneditsave: function() {
 189
 190             $("#node-input-xml").val(this.editor.getText());
 191                 var resp=validateXML(this.editor.getText());
 192                 if(resp){
 193                         this.status = {fill:"green",shape:"dot",text:"OK"};
 194                 }else{
 195                         this.status = {fill:"red",shape:"dot",text:"ERROR"};
 196                 }
 197                 delete this.editor;
 198                 delete blockXmlEditor;
 199         }
 200     });
 201 function updateXml(){
 202         if($("#node-input-atomic-chkBox").is(':checked')){
 203                 $("#node-input-name").val("block : atomic");
 204                 $("#node-input-atomic").val("true");
 205                 //alert($("#node-input-xml-editor div.textview div.textviewContent").text());
 206                 var xmlStr = blockXmlEditor.getText();
 207                 var re = new RegExp("<block[^<]+");
 208                 xmlStr=xmlStr.replace(re,"<block atomic='true'>");
 209                 //$("#node-input-xml-editor div.textview div.textviewContent").text(xmlStr);
 210                 blockXmlEditor.setText(xmlStr);
 211                 //console.log("block xmlStr:" + xmlStr);
 212         }else{
 213                 $("#node-input-name").val("block");
 214                 $("#node-input-atomic").val("false");
 215                 var xmlStr = blockXmlEditor.getText();
 216                 var re = new RegExp("<block[^<]+");
 217                 xmlStr=xmlStr.replace(re,"<block>");
 218                 blockXmlEditor.setText(xmlStr);
 219                 //$("#node-input-xml-editor div.textview div.textviewContent").text(xmlStr);
 220                 //console.log("block xmlStr:" + xmlStr);
 221         }
 222 }
 223 </script>