/**
* Copyright (c) 2013/2014, Intel Performance Learning Solutions Ltd, Intel Corporation.
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may
* not use this file except in compliance with the License. You may obtain
* a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0 (http://www.apache.org/licenses/LICENSE-2.0)
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
**/
/**
* Contains function which convert data into html tables and vice versa
*
* Created by Sridhar Voorakkara (vsridhar420@gmail.com)
*/
//builds a html table to display resources list. Input is a business process in json
var createResourcesTable = function (containerid, businessProcess) {
//Yes/No options list
ynOptionsDefYes = "<option value=''></option><option value='true' selected='true'>Yes</option><option value='false'>No</option>";
ynOptionsDefNo = "<option value=''></option><option value='true'>Yes</option><option value='false' selected='true'>No</option>";
//start building form and table
strTab = "Business Process Name : "+businessProcess.name;
strTab = strTab + "<input type='hidden' id='resBPID' value='"+businessProcess.id+"'>";
strTab = strTab + "<input type='hidden' id='resBPName' value='"+businessProcess.name+"'>";
strTab = strTab + "<input type='hidden' id='resAltIdx' value='"+businessProcess.altIdx+"'>";
strTab = strTab + "<input type='hidden' id='resRiskName' value='"+businessProcess.riskName+"'>";
strTab = strTab + "<input type='hidden' id='resCount' value='"+businessProcess.resources.length+"'>";
strTab = strTab + "<table class='lists' id='resources'><tr class='listHdr'><td>Name</td><td>Type</td>"
+ "<td>Size(MB)</td><td>License Cost(USD)</td><td>Conversion Reqd?</td><td>Sourceable?</td><td>Alternate?</td><td>Preservable?</td>";
for (var i = 0; i < businessProcess.resources.length; i++) {
dr = businessProcess.resources[i];
strTab = strTab + "<tr><td><input type='hidden' id='resId"+i+"' value='"+dr.id+"'>"+dr.resourceName+"</td><td>"+dr.resourceType+"</td>";
//add editable fields.
//size
strTab = strTab + "<td><input type='text' size='6' onblur='resValidateAndTotal(this)' id='resSize"+i+"' value='"+dr.size+"'></td>";
//license cost
strTab = strTab + "<td><input type='text' size='6' onblur='resValidateAndTotal(this)' id='resLicense"+i+"' value='"+dr.licenseCost+"'></td>";
//convesrion
var ynTxt = (dr.requiresConversion?ynOptionsDefYes:ynOptionsDefNo);
strTab = strTab + "<td><select id='resConv"+i+"' onchange='resValidateAndTotal(this)'>"+ynTxt+"</select></td>";
//sourceable
ynTxt = (dr.sourceable?ynOptionsDefYes:ynOptionsDefNo);
strTab = strTab + "<td><select id='resSour"+i+"' onchange='resValidateAndTotal(this)'>"+ynTxt+"</select></td>";
//alternate
ynTxt = (dr.alternate?ynOptionsDefYes:ynOptionsDefNo);
strTab = strTab + "<td><select id='resAlt"+i+"' onchange='resValidateAndTotal(this)'>"+ynTxt+"</select></td>";
//preservable
ynTxt = (dr.preservable?ynOptionsDefYes:ynOptionsDefNo);
strTab = strTab + "<td><select id='resPres"+i+"' onchange='resValidateAndTotal(this)'>"+ynTxt+"</select></td>";
strTab = strTab + "</tr>";
}
strTab = strTab + "<tr class='listHdr'><td>Total</td><td></td>";
strTab = strTab + "<td><span id='resSizeTotal'></span></td><td><span id='resLicenseTotal'></span></td><td></td><td></td><td></td><td><span id='resPct'></span></td></tr>";
strTab = strTab + "</table>";
//add button for getting cost/feasibility
strTab = strTab + "<input type='button' id='btnGetCost' value='Get Cost Projection' onclick='getCostProjection()'>";
strTab = strTab + "</form>" ;
$('#'+containerid).html(strTab);
$('#btnGetCost').button();
};
/*calculates summary of size etc as the user is updating the resources list and displays
* in the summary row of the resources table
*/
var resValidateAndTotal = function (obj) {
var val = obj.value;
var idx = obj.id.replace('res','').replace('Size','').replace('Sour','').replace('Alt','').replace('Pres','').replace('Conv','').replace('License','');
frm = document.forms["caForm"];
//validations
//Size
if (obj.id.indexOf("Size") > 0 && obj.value.length > 0 && !(/^[+]?([0-9]+(?:[\.][0-9]*)?|\.[0-9]+)$/).test(val)) {
alert("Please enter numeric value only for size");
obj.focus();
return false;
}
if (obj.id.indexOf("License") > 0 && obj.value.length > 0 && !(/^[+]?([0-9]+(?:[\.][0-9]*)?|\.[0-9]+)$/).test(val)) {
alert("Please enter numeric value only for License cost");
obj.focus();
return false;
}
var alt = frm['resAlt'+idx].value;
var sour = frm['resSour'+idx].value;
var conv = frm['resConv'+idx].value;
//Conversion
if (obj.id.indexOf('Conv') > 0) {
if (val == '') {
alert("Please indicate whether resource needs conversion by selecting Yes or No.");
obj.focus();
return false;
}
}
//Sourceable
if (obj.id.indexOf('Sour') > 0) {
if (val == '') {
alert("Please indicate whether resource is sourceable by selecting Yes or No.");
obj.focus();
return false;
}
}
//Alternate
if (obj.id.indexOf('Alt') > 0) {
if (val == '') {
alert("Please indicate whether resource has an alternate source by selecting Yes or No.");
obj.focus();
return false;
}
}
//preservable
//Alternate
if (obj.id.indexOf('Pres') > 0) {
var valid = true;
if (val == '') {
valid = false;
}
sour = frm['resSour'+idx].value;
alt = frm['resAlt'+idx].value;
if (alt == 'N' && sour == 'N' && val == 'Y')
valid = false;
if (!valid) {
alert("Please indicate whether resource is preservable by selecting Yes or No. If you have selected No to both Sourceable and Alternate, then Preservable cannot by Yes.");
obj.focus();
return false;
}
}
else { //if Preservable selection is not the current selection auto select it
if (alt.length > 0 && sour.length > 0) {
if (alt == 'N' && sour == 'N')
frm['resPres'+idx].selectedIndex = 2;
else
frm['resPres'+idx].selectedIndex = 1;
}
}
var count = parseInt(frm.resCount.value);
//size sum & percentage
var sizeSum = 0;
var licenseSum = 0;
var presCount = 0;
for (var i=0; i<count; i++) {
//size total
val = frm['resSize'+i].value;
if (!(val.length==0)) {
sizeSum = sizeSum + parseFloat(val);
}
//license cost total
val = frm['resLicense'+i].value;
if (!(val.length==0)) {
licenseSum = licenseSum + parseFloat(val);
}
val = frm['resPres'+i].value;
if (val=='Y')
presCount++;
}
//calculate percentage (resources that can be preserved)
var pct = Math.round(100 * presCount / count);
$('#resSizeTotal').text(sizeSum);
$('#resLicenseTotal').text(licenseSum);
$('#resPct').text(pct+'%');
return true;
};
//get a list of resources in json format from a html form with resources list
var getResourceJson = function () {
var frm = document.forms["caForm"];
var tbl = document.getElementById("resources");
//var keys = ['id', 'name', 'type', 'dependOn', 'size', 'sourceable', 'alternate', 'preservable'];
//create json data
var bp = {};
bp.id = frm.resBPID.value;
bp.altIdx = frm.resAltIdx.value;
if (frm.resRiskName.value != 'undefined')
bp.riskName = frm.resRiskName.value;
bp.altIdx = frm.resAltIdx.value;
var count = parseInt(frm.resCount.value);
var resources = [];
for (var i=0; i < count; i++) {
var res = {};
res.resourceName = tbl.rows[i+1].cells[0].innerText;
res.resourceType = tbl.rows[i+1].cells[1].innerText;
res.id = parseInt(frm['resId'+i].value);
res.size = parseFloat(frm['resSize'+i].value);
res.licenseCost = parseFloat(frm['resLicense'+i].value);
res.requiresConversion = frm['resConv'+i].value;
res.sourceable = frm['resSour'+i].value;
res.alternate = frm['resAlt'+i].value;
res.preservable = frm['resPres'+i].value;
resources.push(res);
}
bp.resources = resources;
return bp;
};
var displayRecommendation = function (err, data) {
//display recommendation
data = JSON.parse(data);
var rec = "<div><br><br>";
rec = rec + "<table style='text-align:left'><tr><td><b>Cost projection & Recommendation</b></td><td></td></tr>"
+ "<tr><td class='form-label'>Initial Cost to preserve:</td><td class='form-field-right'>"+ data.businessProcess['Initial Cost'] + "</td></tr>"
+ "<tr><td class='form-label'>Recurring Cost(Per Year):</td><td class='form-field-right'>"+ data.businessProcess['Recurring Cost'] + "</td></tr>"
+ "<tr><td class='form-label'>10 Year Cost:</td><td class='form-field-right'>"+ data.businessProcess['10Yr Cost'] + "</td></tr>"
+ "<tr><td class='form-label'>50 Year Cost:</td><td class='form-field-right'>"+ data.businessProcess['50Yr Cost'] + "</td></tr>"
+ "<tr><td class='form-label'>Recommended:</td><td class='form-field'>"+data.businessProcess.recommended +"</td></tr></table>"
+ "<input type='button' id='btnSaveResources' value='Save Resources' onclick='saveResources()'></div>";
//now add code to display cost detail
var detail = data.businessProcess.costDetail;
var dtlDiv = "<br><br><div>Details of the cost projection calculations are below:<br><br>"
+ "<table><tr><td colspan='9'><b>Cost projection calculation details</b></td></tr>"
+ "<tr class='listHdr'><td>Preservation Phase</td><td>Item</td><td>Recurring?</td><td>Applied On</td>"
+ "<td>Unit</td><td>Unit Cost</td><td>Quantity</td>"
+ "<td>Calculation</td><td>Cost</td></tr>";
for (var i = 0; i < detail.length; i++) {
if (detail[i].preservationPhase === "PLANNING")
detail[i].phaseOrder = 1;
if (detail[i].preservationPhase === "MANAGE")
detail[i].phaseOrder = 2;
if (detail[i].preservationPhase === "DEPLOY")
detail[i].phaseOrder = 3;
}
detail.sort(function (a,b) {
return a.phaseOrder > b.phaseOrder;
});
for (var i = 0; i < detail.length; i++) {
dtlDiv = dtlDiv + "<tr><td class='form-field'>"+detail[i].preservationPhase+"</td><td class='form-field'>"+detail[i].costItem+"</td>"
+"<td class='form-field'>"+detail[i].recurring+"</td>"
+ "<td class='form-field'>"+detail[i].appliedOn+"</td>"
+ "<td class='form-field'>"+detail[i].unit+"</td>"
+ "<td class='form-field-right'>"+detail[i].unitCost+"</td>"
+ "<td class='form-field-right'>"+detail[i].quantity+"</td>"
+ "<td class='form-field'>"+detail[i].calculation+"</td>"
+ "<td class='form-field-right'>"+detail[i].cost+"</td></tr>";
}
dtlDiv = dtlDiv + "</table></div>";
rec = rec + dtlDiv;
$('#recommendation').html(rec);
$('#costDetail').hide();
$('#btnSaveResources').button();
$('#btnCostDtl').button({
icons: {
primary: "ui-icon-info"
},
text: false
});
clearMessage();
//objDiv = document.getElementById('main');
//objDiv.scrollTop = objDiv.scrollHeight;
$('#main').stop().animate({
scrollTop: $("#main")[0].scrollHeight
}, 800);
};
var createArtifactTable = function (containerid, artifactcollection) {
var strTab = "<span class='listCaption'>Business Process Id : "+artifactcollection.businessProcessName+'</span>';
strTab = strTab + "<table class='lists' id='tablArt'>";
strTab = strTab + "<tr class='listHdr'><td>ID</td><td>Name</td><td>Resource</td><td>File Name</td><td>Acquired?</td></tr>";
var list = artifactcollection.artifacts;
for (var i = 0; i < list.length; i++) {
var art = list[i];
strTab = strTab + "<tr><td>"+art.id+"</td><td>"+art.name+"</td><td>"+art.resourceName+"</td><td>"+art.fileName+"</td><td>"+art.acquired+"</td></tr>";
}
strTab = strTab + "</table>";
var bp = {businessProcessId: artifactcollection.businessProcessId};
strTab = strTab + "<br><a href='Javascript:displayArtifactDetail("+JSON.stringify(bp)+")' class='linkBtn'>Add Artifact</a>";
$('#'+containerid).html(strTab);
};
var displayArtifactDetail = function (artifact) {
var strForm = "<form id='frmArt' action='uiapi/artifact/"+artifact.businessProcessId+"/upload' method='POST' enctype='multipart/form-data'>";
strForm = strForm + "<table class='form' id='artDtlTbl' style='text-align:left'><tr><td>Business Process Id: </td><td>"
+ artifact.businessProcessId +"<input type='hidden' id='user' name='user' value='" + userStatus().user + "'></td></tr>";
var art = artifact.artifact;
if (!art) { //new artifact
art = {id:'', name:'', source:''};
}
strForm = strForm + "<tr><td class='form-label'>Id</td><td class='form-field'>"+art.id+"</td></tr>";
strForm = strForm + "<tr><td class='form-label'>Name</td><td class='form-field'><input type='text' name='artifactName' id='artifactName' value='"+art.name+"'></td></tr>";
strForm = strForm + "<tr><td class='form-label'>Resource</td><td class='form-field'><select name='artifactResource' id='artifactResource'></select></td></tr>";
strForm = strForm + "<tr><td class='form-label'>Source</td><td class='form-field'><input type='radio' checked='true' value='local' name='source' id='source'>Local"
+ "<br><input type='file' name='artifactFile' id='artifactFile'></td></tr>";
strForm = strForm + "<tr><td class='form-label'></td><td class='form-field'><input type='radio' value='url' name='source' id='source'>Download from a URL</td></tr>";
strForm = strForm + "<tr><td class='form-label'>URL</td><td class='form-field'><input type='text' name='artifactUrl' id='artifactUrl'></td></tr>";
strForm = strForm + "<tr><td class='form-label'></td><td class='form-field'><input type='submit' value='Submit'></td></tr>";
strForm = strForm + "<tr><td colspan='2' align='center'><div class='progress'><div class='bar'></div><div class='percent'>0%</div ></div></td></tr>";
strForm = strForm + "</table></form>";
$('#artifactForm').html(strForm);
var a = populateResourceSelectList(artifact.businessProcessId, document.getElementById('artifactResource'),
function(target) {
if (document.getElementById('artifactResource').options.length === 1) {
var o=document.createElement("option");
o.text='None';
o.value='0';
document.getElementById('artifactResource').add(o, null);
}
}
);
(function() {
var bar = $('.bar');
var percent = $('.percent');
var progress = $('.progress');
$('#frmArt').ajaxForm({
data: { op: 'save-artifact' },
beforeSubmit: function() {
//put validation logic here.
var form = document.forms["frmArt"];
var valid = true;
if (valid && form.artifactName.value.length === 0) {
alert ("'Name' is a required field.");
valid = false;
}
if (valid && form.artifactResource.value.length === 0) {
alert ("'Resource' is a required field.");
valid = false;
}
return valid;
},
beforeSend: function() {
progress.show();
var percentVal = '0%';
bar.width(percentVal);
percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
//alert('progress');
var percentVal = percentComplete + '%';
bar.width(percentVal);
percent.html(percentVal);
},
success: function(responseText) {
var percentVal = '100%';
bar.width(percentVal);
percent.html(percentVal);
},
error: function(e) {
if (e) {
alert('error - ' + JSON.stringify(e));
}
},
complete: function(xhr, e) {
if (e != 'success') {
alert('error - ' + e);
}
else {
toDialog(JSON.parse(xhr.responseText).messages, "artifactUploadResultDialog", "Artifact upload/save result");
getArtifacts(artifact.businessProcessName, function(artlst) {
if (!artlst)
artlst = [];
createArtifactTable('artifactTabl', {artifacts:artlst, businessProcessId: artifact.businessProcessId});
$('#artifactForm').html('');
});
}
}
});
})();
};
var getArtifactsJson = function () {
var tbl = document.getElementById("tablArt");
//create json data
var artifacts = [];
var count = tbl.rows.length;
for (var i=1; i < count; i++) {
var artifact = {};
artifact.id = tbl.rows[i].cells[0].innerText;
artifact.name = tbl.rows[i].cells[1].innerText;
artifact.source = tbl.rows[i].cells[2].innerText;
artifact.acquired = tbl.rows[i].cells[3].innerText;
artifacts.push(artifact);
}
return artifacts;
};
var displayMetadataTable = function (bpName, artid, container) {
if (artid.length==0) {
$('#'+container).html('');
return;
}
getMetadata(bpName, artid, function (meta) {
var keys = [];
if(meta) {
keys = Object.keys(meta);
}
keys.sort(function (a,b) {
return a.toLowerCase().localeCompare(b.toLowerCase());
});
strTab = "<form id='frmMetaEdit'><input type='hidden' id='rowCount' value='"+(keys.length+1)+"'>"
+ "<input type='hidden' id='bpName' value='"+bpName+"'>"
+ "<input type='hidden' id='artifactid' value='"+artid+"'>"
+ "<table id='tblMetaEdit' class='lists'><tr class='listHdr'><td>Key</td><td>Value</td></tr>";
var count = 0;
for (var i = 0; i < keys.length; i++) {
strTab = strTab + "<tr><td><input type='text' id='key"+i+"' value='"+keys[i]+"' size='40'></td><td><input type='text' id='value"+i+"' value='"+meta[keys[i]]+"' size='60'></td></tr>";
count++;
}
strTab = strTab + "<tr><td><input type='text' id='key"+count+"' value-'' size='40'></td><td><input type='text' id='value"+count+"' value='' size='60'></td></tr>";
strTab = strTab + "</table>";
strTab = strTab + "<br><a href='Javascript:addMetadataRow(\"tblMetaEdit\")' class='linkBtn'>Add Row</a>";
strTab = strTab + " <a href='Javascript:saveMetadata(\"frmMetaEdit\")' class='linkBtn'>Save</a>";
$('#'+container).html(strTab);
});
};
var addMetadataRow = function(tblName) {
var tbl = document.getElementById(tblName);
var count = document.forms['frmMetaEdit'].rowCount.value;
var rownum = tbl.rows.length;
var tr = tbl.insertRow(rownum);
var cell1 = tr.insertCell(0);
var cell2 = tr.insertCell(1);
cell1.innerHTML = "<input type='text' value='' size='40' id='key"+count+"'>";
cell2.innerHTML = "<input type='text' value='' size='60' id='value"+count+"'>";
count++;
document.forms['frmMetaEdit'].rowCount.value = count;
};
//gets file metadata from html form and saves to server
var saveMetadata = function (form) {
if (typeof form === 'string') //if name is passed
form = document.getElementById(form);
var meta = {};
var rows = form.rowCount.value;
var bpName = form.bpName.value;
var artifactid = form.artifactid.value;
for (var i = 0; i < rows; i++) {
var key = form['key'+i].value;
var val = form['value'+i].value;
if (key.length > 0 && val.length > 0) {
meta[key] = val;
}
}
setMetadata({'bpName': bpName, 'artifactId': artifactid, 'metadata': meta}, function (data) {
toDialog(data.messages, "artifactUploadResultDialog", "Metadata update results");
});
};
//build a html table from events json
var buildHistoryTable = function (events, container) {
var strTable = "<table><tr class='listHdr'><td>Event Id</td><td>Event Type</td><td>Event Detail</td><td>Event Timestamp</td><td>Agent</td><td>Outcome</td></tr>";
for (var i = 0; i < events.length; i++) {
var event = events[i];
strTable = strTable + "<tr>" + "<td class='form-field'>" + event.eventIdentifier + "</td>"
+ "<td class='form-field'>" + event.eventType+ "</td>" + "<td class='form-field'>" + event.eventDetail + "</td>"
+ "<td class='form-field'>" + event.eventDateTime + "</td>" + "<td class='form-field'>" + event.agentIdentifier + "</td>"
+ "<td class='form-field'>" + event.eventOutcome + "</td>" + "</tr>";
}
strTable = strTable + "</table>";
container.innerHTML = strTable;
};