diff options
author | Chinthakayala,Sheshashailavas(sc2914) <sc2914@att.com> | 2018-06-27 16:11:44 +0000 |
---|---|---|
committer | Chinthakayala,Sheshashailavas(sc2914) <sc2914@att.com> | 2018-06-27 16:25:31 +0000 |
commit | 8f6a6c445eaeb7356e1db9d10d10b7d3fa42f27e (patch) | |
tree | bf1e5c83c357fbd4a0158cac6d41bd936e949a80 /dgbuilder/public/red/main.js | |
parent | e14a02086c9119532f9153c78346d5c1d6789ca9 (diff) |
removed dependency on built-editor.min.js
and added ability to test DG from dgbuilder
and fixed the break node on XML generation
and added ability to download
formatted DG XML and DG JSON
Issue-ID: SDNC-353
Change-Id: I799de5de2c4f61e9b56dbe996d8ac3e3b28061f7
Signed-off-by: Chinthakayala,Sheshashailavas(sc2914) <sc2914@att.com>
Diffstat (limited to 'dgbuilder/public/red/main.js')
-rw-r--r-- | dgbuilder/public/red/main.js | 349 |
1 files changed, 337 insertions, 12 deletions
diff --git a/dgbuilder/public/red/main.js b/dgbuilder/public/red/main.js index 27032a26..cf7bb287 100644 --- a/dgbuilder/public/red/main.js +++ b/dgbuilder/public/red/main.js @@ -13,6 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. **/ + var RED = (function() { function hideDropTarget() { @@ -392,7 +393,8 @@ var RED = (function() { .always(function() { }); } - /* + + /* function listYangFiles(){ yangFilesList=[]; var divStyle="<style>#list-yang-data-container a { color: #067ab4; font-size: 0.75em;} #list-yang-data-container a:hover { text-decoration: underline; padding: -15px -15px -15px 15px; } .header { height: 40px; border-bottom: 1px solid #EEE; background-color: #ffffff; height: 40px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; } .footer { height: 40px; background-color: whiteSmoke; border-top: 1px solid #DDD; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }</style>"; @@ -1216,10 +1218,239 @@ Added this logic because , when the configuration item is choosen in the menu th $("#list-yang-browser-dialog").dialog("close"); $("#request-input-dialog").dialog(); $("#request-input-dialog").dialog("close"); + $("#test-dg-dialog").dialog(); + $("#test-dg-dialog").dialog("close"); + $("#ctx-values-dialog").dialog(); + $("#ctx-values-dialog").dialog("close"); + $("#list-input-browser-dialog").dialog(); + $("#list-input-browser-dialog").dialog("close"); + $("#diff-browser-dialog").dialog(); + $("#diff-browser-dialog").dialog("close"); //var msecs2= Date.now(); //console.log("Time taken for dialog boxes:" + (msecs2 - msecs1)); })(); + + //start functions to support Test DG + function testDG(){ + getSliParametersFromDG(); + /* + for (var property in callNodes) { + if (callNodes.hasOwnProperty(property)) { + console.log(property); + var moduleRpc = property.split("_"); + var mName = moduleRpc[0]; + var rName = moduleRpc[1]; + } + } + */ + showTestDGDialog(); + } + + + function showInputFiles(files){ + var divStyle="<style>#input-files-data-container a { color: #067ab4; font-size: 0.75em;} #input-files-data-container a:hover { text-decoration: underline; padding: -15px -15px -15px 15px; } .header { height: 40px; border-bottom: 1px solid #EEE; background-color: #ffffff; height: 40px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; } .footer { height: 40px; background-color: whiteSmoke; border-top: 1px solid #DDD; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } table#input-file-list-table { width:100%; } table#input-file-list-table th,table#input-file-list-table td { border: 1px solid black; border-collapse: collapse; } table#input-file-list-table th,table#input-file-list-table td { padding: 5px; text-align: left; } table#input-file-list-table tr:nth-child(even) { background-color: #eee; } table#input-file-list-table tr:nth-child(odd) { background-color:#fff; } table#input-file-list-table th { background-color: #65a9d7; color: white; } table#input-file-list-table a { color: #337ab7; } table#input-file-list-table a:link { color: #65a9d7; } table#input-file-list-table a:visited { color: #636; } table#input-file-list-table a:hover { color: #3366CC; cursor: pointer } table#input-file-list-table a:active { color: #65a9d7 }</style>"; + + var header="<div class='header'>List of Input Files </div>"; + var html= divStyle + header + "<div id='input-files-data-container'>"; + html+="<table id='input-file-list-table' border=1>"; + html+="<tr>"; + html+="<th>File</th>"; + html+="<th>Delete</th>"; + html+="</tr>"; + files.sort(function (a,b){ + if(a > b){ + return -1; + }else if(a < b){ + return 1; + }else{ + return 0; + } + }); + for(var i=0;files != null && i<files.length;i++){ + html+="<tr><td><a href=\"#\" onclick=\"loadInputFile('" + files[i] + "')\">" + files[i] + "</a></td><td>" + "<input type='button' onclick='deleteInputFile(\"" + files[i] + "\")' value='Delete'></td></td></td></tr>"; + } + html+="</table>"; + html+="</div>"; + $( "#list-input-browser-dialog" ).dialog({ + title: "List Input Files", + modal: true, + autoOpen: true, + width: 830, + height: 630, + buttons: [ + { + text: "Close", + click: function() { + $( this ).dialog( "close" ); + } + } + ], + close: function(ev,ui){ + $(this).dialog("destroy"); + } + }).html(html); + $("#list-input-browser-dialog").show(); + } + + + function showTestDGDialog(){ + $.get("/getCurrentSettings",function (data){ + var activeWorkspace=RED.view.getWorkspace(); + var currNodes = RED.nodes.nodes.filter(function(d) { return d.z == activeWorkspace }) + var moduleName = ""; + var rpcName = ""; + if(currNodes != null && currNodes.length > 1){ + currNodes.forEach(function(n){ + if(n.type == 'service-logic'){ + moduleName = getAttributeValue(n.xml,"module"); + }else if(n.type == 'method'){ + rpcName = getAttributeValue(n.xml,"rpc"); + } + }); + } + + var sliApiInputObj = { "input" : { "module-name" : moduleName, "rpc-name" : rpcName, "mode" : "sync", "sli-parameter" : []}}; + var intParameterObj = { "parameter-name" : "", "int-value": 0}; + var booleanParameterObj = { "parameter-name" : "", "boolean-value": true}; + /* + //Use this logic to add all the Ctx variables that have -input. + Object.keys(dgParsedParameters).forEach(function(key,index) { + //console.log("key:" + key + " index" +index ); + if(key.indexOf("-input.") != -1){ + key = key.replace(/\$/g,""); + var strParameterObj = { "parameter-name" : key, "string-value": ""}; + sliApiInputObj["input"]["sli-parameter"].push(strParameterObj); + } + }); + */ + + var sliApiInputStr = JSON.stringify(sliApiInputObj,null,4); + + //var htmlStr="<div id='request-template-div' style='width:875px;height:575px'><textarea style='width:875px;height:575px'>" + inputValStr + "</textarea></div>" + //var htmlStr="<div id='request-template-div' style='width:750px;height:550px;font-weight:bold;font-size:1em'><pre>" + inputValStr + "</pre></div>" + //var htmlStr = "<div id='test-dg-div' style='width:750px;height:50px'>"; + var htmlStr = "<label style='font-weight:bold;font-size:1em'>URL</label><input id='test-dg-url' type='textbox' style='width:743px;height:30px;font-weight:bold;font-size:1em' value='" + data.restConfUrl + "'><br><br><label style='font-weight:bold;font-size:1em'>Method</label><input type='radio' name='methodType' value='GET'> GET <input type='radio' name='methodType' value='POST' checked> POST <input type='radio' name='methodType' value='PUT' > PUT <input type='radio' name='methodType' value='DELETE' > DELETE <br><br><label style='font-weight:bold;font-size:1em'>Input</label>"; + htmlStr +="<textarea id='test-dg-request' style='width:750px;height:350px;font-size:1em' >" + sliApiInputStr + "</textarea><br><br><label style='font-weight:bold;font-size:1em'>Response</label><textarea id='test-dg-response' style='width:750px;height:150px;font-weight:bold;font-size:1em'></textarea>" + //background: "#c3e8d1", + $("#test-dg-dialog").dialog({ + dialogClass :"no-close", + modal:true, + autoOpen :false, + title: "Test DG Module:" + moduleName + " RPC:" + rpcName, + width: 800, + height: "auto", + buttons :[ + { + text: "$Variables", + click: function() { + $("#test-dg-response").val(""); + showCtxVariables(moduleName,rpcName); + //console.dir(dgParsedParameters); + } + }, + { + text: "Load", + click: function() { + var inputData = { + "moduleName" : moduleName, + "rpcName" : rpcName + }; + + $.post( "/getInputFiles",inputData ) + .done(function( data ) { + //console.dir(data); + if(data != undefined && data != null){ + showInputFiles(data.files); + } + }) + .fail(function(err) { + console.log( "failed to save input. " + err ); + }) + .always(function() { + }); + } + }, + { + text: "Send", + click: function() { + $("#test-dg-response").val(""); + var methodType =$("input[name=methodType]:checked").val(); + var urlValue = $("#test-dg-url").val(); + var reqData = {}; + try{ + reqData = JSON.parse($("#test-dg-request").val()); + }catch(er){ + $("#test-dg-response").val(er); + return false; + } + //console.log("urlValue:" + urlValue); + //console.dir(reqData); + var inputStr = $("#test-dg-request").val(); + //headers: { 'Authorization': 'Basic ' + btoa(data.restConfUser + ":" + data.restConfPassword)}, + var inputData = { + "moduleName" : moduleName, + "rpcName" : rpcName, + "inputStr" : inputStr + }; + + $.post( "/saveTestDGInput",inputData ) + .done(function( data ) { + + }) + .fail(function(err) { + console.log( "failed to save input. " + err ); + }) + .always(function() { + $.ajax({ + xhrFields: { withCredentials: true }, + type: methodType, + url: urlValue, + data: JSON.stringify(reqData), + contentType: "application/json; charset=utf-8", + username : data.restConfUser, + password : data.restConfPassword, + success: function(data) { + if(data != null){ + $("#test-dg-response").val(JSON.stringify(data,null,4)); + }else{ + $("#test-dg-response").val("No Content returned"); + } + }, + error: function(err) { + if(err != null){ + $("#test-dg-response").val(JSON.stringify(err,null,4)); + }else{ + $("#test-dg-response").val("error Occured"); + } + } + }); + }); + } + }, + { + text: "Reset", + click: function() { + $("#test-dg-request").val(sliApiInputStr); + $("#test-dg-response").val(""); + } + }, + { + text: "Close", + click: function() { + $("#test-dg-dialog").dialog("close"); + } + } + ], + open:function(){ + $('#test-dg-dialog').css('overflow', 'hidden'); + } + }).dialog("open").html(htmlStr).css("background","aliceblue"); + }); + } + //end functions to support Test DG + + function updateConfiguration(){ //console.log("in updateConfiguration"); $.get("/getCurrentSettings",function (data){ @@ -1228,9 +1459,16 @@ Added this logic because , when the configuration item is choosen in the menu th var dbName = data.dbName; var dbUser = data.dbUser; var dbPassword = data.dbPassword; + var formatXML = data.formatXML; + var formatJSON = data.formatJSON; var gitLocalRepository = data.gitLocalRepository; var performGitPull = data.performGitPull; + var restConfUrl = data.restConfUrl; + var restConfUser = data.restConfUser; + var restConfPassword = data.restConfPassword; + var emailAddress = data.emailAddress; + if(dbHost == undefined) dbHost=""; if(dbPort == undefined) dbPort=""; if(dbName == undefined) dbName=""; @@ -1238,13 +1476,19 @@ Added this logic because , when the configuration item is choosen in the menu th if(dbPassword == undefined) dbPassword=""; if(gitLocalRepository == undefined) gitLocalRepository=""; if(performGitPull == undefined || performGitPull == null) performGitPull="N"; + if(restConfUrl == undefined) restConfUrl=""; + if(restConfUser == undefined) restConfUser=""; + if(restConfPassword == undefined) restConfPassword=""; + if(emailAddress == undefined) emailAddress=""; + if(formatXML == undefined) formatXML="Y"; + if(formatJSON == undefined) formatJSON="Y"; - var divStyle="border: 1px solid #a1a1a1; padding: 10px 40px; background: #dddddd; width: 500px; border-radius: 25px;"; + var divStyle="border: 1px solid #a1a1a1; padding: 10px 40px; background: #dddddd; width: 600px; border-radius: 25px;"; //var divStyle="border: 2px solid #a1a1a1; padding: 10px 40px; background: #99CCFF; width: 400px; border-radius: 25px;"; var html = "<div>"; - html += "<script>function changeType(obj,targetId){if( obj.checked== true){$('#' + targetId).prop('type','password');}else{$('#'+ targetId).prop('type','text');}} function changeTitle(){ document.getElementById(\"gitLocalRepository\").title=document.getElementById(\"gitLocalRepository\").value;}</script>"; + html += "<script>function changeType(obj,targetId){if( obj.checked== true){$('#' + targetId).prop('type','password');}else{$('#'+ targetId).prop('type','text');}} function changeTitle(){ document.getElementById(\"gitLocalRepository\").title=document.getElementById(\"gitLocalRepository\").value;} function changeTitle1(){ document.getElementById(\"restconfurl\").title=document.getElementById(\"restconfurl\").value;}</script>"; html += "<div style='" + divStyle + "' >"; html += "<table border='0' cellpadding='5' >"; html += "<tr>"; @@ -1272,12 +1516,31 @@ Added this logic because , when the configuration item is choosen in the menu th html += "</table>"; html += "</div>"; html += "<div style='fill:both;clear:both'></div><br>"; - html += "<div style='" + divStyle + "' >"; html += "<table border='0' cellpadding='5' >"; html += "<tr>"; + html += "<td style='font-size:12px;align:center'><b>RestConf URL</b></td>"; + html += "<td><textarea style='align:center;font-size:14px;width:100%' cols='100' rows='4' id='restconfurl' name='restconfurl' onkeyup='changeTitle1()' title='" + restConfUrl + "'>" + restConfUrl + "</textarea></td>"; + html += "</tr>"; + html += "<tr>"; + html += "<td style='font-size:12px;align:center'><b>RestConf UserName</b></td>"; + html += "<td><input style='align:center;font-size:11px;font-weight:bold' id='restconfuser' name='restconfuser' type='password' value='" + restConfUser + "'>"; + html += " <input style='background:background:white;width:20px;height:20px' type='checkbox' checked value='1' onclick=\"changeType(this,'restconfuser')\">Hide</td>"; + html += "</tr>"; + html += "<tr>"; + html += "<td style='font-size:12px;align:center'><b>RestConf Password</b></td>"; + html += "<td><input style='align:center;font-size:11px;font-weight:bold' id='restconfpassword' name='restconfpassword' type='password' value='" + restConfPassword + "'>"; + html += " <input style='background:background:white;width:20px;height:20px' type='checkbox' checked value='1' onclick=\"changeType(this,'restconfpassword')\">Hide</td>"; + html += "</tr>"; + html += "</table>"; + html += "</div>"; + html += "<div style='fill:both;clear:both'></div><br>"; + + html += "<div style='" + divStyle + "' >"; + html += "<table border='0' cellpadding='5' width='100%' >"; + html += "<tr>"; html += "<td style='font-size:12px;align:center'><b>Git Local Repository Path</b></td>"; - html += "<td><textarea style='align:center;font-size:14px;' cols='50' rows='4' id='gitLocalRepository' name='gitLocalRepository' onkeyup='changeTitle()' title='" + gitLocalRepository + "'>" + gitLocalRepository + "</textarea></td>"; + html += "<td><textarea style='align:center;font-size:14px;width:100%' cols='100' rows='4' id='gitLocalRepository' name='gitLocalRepository' onkeyup='changeTitle()' title='" + gitLocalRepository + "'>" + gitLocalRepository + "</textarea></td>"; html += "</tr>"; html += "</table>"; html += "<table border='0' cellpadding='5' >"; @@ -1290,14 +1553,36 @@ Added this logic because , when the configuration item is choosen in the menu th html += "</tr>"; html += "</table>"; html += "</div>"; + html += "<div style='fill:both;clear:both'></div><br>"; + + html += "<div style='" + divStyle + "' >"; + html += "<table border='0' cellpadding='5' width='100%' >"; + html += "<tr>"; + html += "<td style='font-size:12px;align:center'><b>Email</b></td>"; + html += "<td><input style='align:center;font-size:11px;font-weight:bold' id='emailaddress' name='emailaddress' type='text' value='" + emailAddress + "'></td>"; + html += "</tr>"; + html += "<tr>"; + if(formatXML == "Y"){ + html += "<td style='align:center;'><input style='color:blue;width:20px;height:20px;' id='formatXML' type='checkbox' value='Y' checked><b>Format XML</b></td>"; + }else{ + html += "<td style='align:center;'><input style='color:blue;width:20px;height:20px;' id='formatXML' type='checkbox' value='Y'><b>Format XML</b></td>"; + } + if(formatJSON == "Y"){ + html += "<td style='align:center;'><input style='color:blue;width:20px;height:20px;' id='formatJSON' type='checkbox' value='Y' checked><b>Format JSON</b></td>"; + }else{ + html += "<td style='align:center;'><input style='color:blue;width:20px;height:20px;' id='formatJSON' type='checkbox' value='Y'><b>Format JSON</b></td>"; + } + html += "</tr>"; + html += "</table>"; + html += "</div>"; html += "</div>"; //console.log("html:" + html); $( "#update-configuration-dialog" ).dialog({ title: "Configuration", modal: true, autoOpen: true, - width: 630, - height: 630, + width: 730, + height: 930, buttons: [ { text: "Save", @@ -1308,11 +1593,29 @@ Added this logic because , when the configuration item is choosen in the menu th var newDBUser = $("#dbuser").val().trim(); var newDBPassword = $("#dbpassword").val().trim(); var newGitLocalRepository = $("#gitLocalRepository").val().trim(); + + var isFormatXML = $('#formatXML').is(':checked'); + var isFormatJSON = $('#formatJSON').is(':checked'); var isPerformGitPullChecked = $('#performGitPull').is(':checked'); + var newRestConfUrl = $("#restconfurl").val().trim(); + var newRestConfUser = $("#restconfuser").val().trim(); + var newRestConfPassword = $("#restconfpassword").val().trim(); var newPerformGitPull = "N"; + var newEmailAddress = $("#emailaddress").val().trim(); + //console.log("newEmailAddress:" + newEmailAddress); if(isPerformGitPullChecked){ newPerformGitPull = "Y"; } + if(isFormatXML){ + newFormatXML = "Y"; + }else{ + newFormatXML = "N"; + } + if(isFormatJSON){ + newFormatJSON = "Y"; + }else{ + newFormatJSON = "N"; + } if(newDBHost == ""){ RED.notify("Error: DB Host is required."); $("#dbhost").focus(); @@ -1333,18 +1636,31 @@ Added this logic because , when the configuration item is choosen in the menu th RED.notify("Error: DB Password is required."); $("#dbpassword").focus(); return; + }else if(newEmailAddress == ""){ + RED.notify("Error: Email Address is required."); + $("#emailaddress").focus(); + return; }else{ - console.log("newGitLocalRepository:" + newGitLocalRepository); + //console.log("newGitLocalRepository:" + newGitLocalRepository); var reqData= {"dbHost":newDBHost, "dbPort" : newDBPort, "dbName" : newDBName, "dbUser" : newDBUser, "dbPassword" : newDBPassword, "gitLocalRepository" : newGitLocalRepository, - "performGitPull" : newPerformGitPull + "performGitPull" : newPerformGitPull , + "formatXML": newFormatXML, + "formatJSON": newFormatJSON, + "restConfUrl" : newRestConfUrl, + "restConfUser" : newRestConfUser, + "restConfPassword" : newRestConfPassword, + "emailAddress" : newEmailAddress }; $.post( "/updateConfiguration",reqData ) .done(function( data ) { + RED.settings.emailAddress = newEmailAddress; + format_xml = newFormatXML; + format_json = newFormatJSON; RED.notify("Configuration updated successfully"); //loadSettings(); //RED.comms.connect(); @@ -1552,16 +1868,25 @@ Added this logic because , when the configuration item is choosen in the menu th {id:"btn-list-yang-files",icon:"fa fa-clipboard",label:"List Yang Files",onselect:listYangFiles}, ]}, null, + /* {id:"btn-dg-diff-menu",icon:"fa fa-sign-in",label:"DG diff",options:[ + {id:"btn-diff-json",icon:"fa fa-clipboard",label:"Json diff since import",onselect:RED.view.diffJsonSinceImportDialog}, + {id:"btn-diff-xml",icon:"fa fa-clipboard",label:"XML diff since import",onselect:RED.view.diffXmlSinceImportDialog}, + ]}, + null,*/ {id:"btn-configure-upload",icon:"fa fa-book",label:"Configuration",toggle:false,onselect:updateConfiguration}, null, {id:"btn-manage-tabs",icon:"fa fa-info",label:"Manage Tabs",toggle:false,onselect:showSelectedTabs}, null, - {id:"btn-search-text",icon:"fa fa-info",label:"Search Text (Ctrl+[)",toggle:false,onselect:RED.view.showSearchTextDialog}, + {id:"btn-test-dg",icon:"fa fa-book",label:"Test DG",toggle:false,onselect:testDG}, + null, + {id:"btn-find-dgnumber",icon:"fa fa-info",label:"Search Text (Ctrl+[)",toggle:false,onselect:RED.view.showSearchTextDialog}, null, {id:"btn-find-dgnumber",icon:"fa fa-info",label:"Find Node (Ctrl+B)",toggle:false,onselect:RED.view.showDgNumberDialog}, null, - {id:"btn-request-input",icon:"fa fa-info",label:"RPC Input (Ctrl+O)",toggle:false,onselect:RED.view.showRequestTemplateDialog}, + {id:"btn-request-input",icon:"fa fa-info",label:"RPC Input (Ctrl+O)",toggle:false,onselect:RED.view.showRequestTemplateDialog}, null, + /*{id:"btn-loop-detection",icon:"fa fa-info",label:"Loop Detection",toggle:true,onselect:performLoopDetection}, + null ,*/ {id:"btn-node-status",icon:"fa fa-info",label:"Node Status",toggle:true,onselect:toggleStatus}, null, {id:"btn-node-dgnumber",icon:"fa fa-info",label:"Show Node Numbers",toggle:true,onselect:toggleDgNumberDisplay}, @@ -1610,7 +1935,7 @@ Added this logic because , when the configuration item is choosen in the menu th //Making default loop detection on and display check mark in the menu //$("#btn-loop-detection").addClass("active"); - RED.keyboard.add(/* ? */ 191,{shift:true},function(){showHelp();d3.event.preventDefault();}); + RED.keyboard.add(/* ? */ 191,{shift:true,ctrl:true},function(){showHelp();d3.event.preventDefault();}); loadSettings(); RED.comms.connect(); }); |