I have been trying to get the following issue resolved for the past 2 weeks and am getting nowhere, hopefully someone can point me in the right direction;
I have a single page application that uses JS and jQuery alongwith xml logic conditions and actions.
With JS allowing for functions to act asynchronously is great but I need to solve an issue;
When a user clicks an element the js goes through the xml and finds nodes related to the element ID, checks if the condition set is met and fires associated actions. A snippet of XML iis shown below;
<block id="10000005" triggerID="125">
<ConditionsAndActions name="Default" setIndex="0">
<Conditions>
</Conditions>
<Actions>
<Action actionIndex="0" type="AskForConfirmation" message="Are you sure?"/>
<Action actionIndex="0" type="NewRecord" />
</Actions>
</ConditionsAndActions>
</block>
The abiove indicates when '#btn125' is clicked fire AskForConfirmation function then if user clicks the confirmation button, process the manual record function.
The actions are traversed by a loop and I need to for AskForConfirmation stop the loop continuing until either user completed acknowledgement or if user gives a negative response or a 30 second period lapses then the loop is abandoned.
I have tried setTimeout using a variable to control firing the next action without success and cannot get my head around async/await if this is feasable please guide me on how to do it.
I include the action firing loop below;
function triggerActions(callType, tags, iC1, iC2, iC3, iC4) {
for (var iA1 = 0; iA1 < tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes.length; iA1++) {
if (tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].nodeName === "Actions") {
for (var iA2 = 0; iA2 < tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes.length; iA2++) {
if ($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("type") !== null) {
switch ($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("type")) {
case "ChangeVisibility":
if (debugMode) {
loggingAction('log','NOTIFICATION : ' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("element") + ' visibility amended.');
}
eval('$("#' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("element") + '").' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].chidNodes[iA1].childNodes[iA2]).attr("effect") + '();');
break;
case "commentBox":
if (debugMode) {
loggingAction('log','NOTIFICATION : Comment box for ' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("name") + ' found in configuration');
loggingAction('log','comment log');
}
break;
case "DisplayAlert":
if (debugMode) {
loggingAction('log','NOTIFICATION : Lightbox stating: ' + variableConversion(($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("message"))) + ' output');
}
var alertMessage = '<h2 class="text-center">ALERT:</h2><p class="text-center">' + variableConversion(($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("message"))) + '</p>';
$.colorbox({
html: alertMessage
});
$('#cboxContent').removeClass('errorMessage');
break;
case "DataQuery":
if (debugMode && (($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("destination")).length !== 0)) {
destination = '{{' + ($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("destination")) + '}}';
loggingAction('log','NOTIFICATION : Data Query initiated with destination = "' + destination + '", destinationControl = "' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("destinationControl") + '",query number = "' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("queryNumber") + '", parameters ="' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("parameters") + ' " and values = "' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("values") + '".');
}
getRunQuery($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("destination"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("destinationControl"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("parameters"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("queryNumber"), sessionID);
break;
case "DataSource":
if (debugMode) {
loggingAction('log','NOTIFICATION : Data Source Action');
}
break;
case "DispositionCall":
sendDisposition($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("outcome"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("callbackNumber"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("callbackNumberControl"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("callbackTime"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("callbackTimeControl"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("personalCallback"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("returnData"));
break;
case "GetRecord":
var URN = ($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2])).attr("URN");
if (gridValueSelected.length > 0) {
URN = gridValueSelected;
}
if (debugMode) {
loggingAction('info','INFORMATION : Get Record request initiated with URN return of "' + URN + '".');
}
rid = generateRID(), message = 'type: "GetRecord", RID: ' + rid + ', SID: ' + sessionID + ', URN:"' + URN + '"';
activeRequests.push(rid + ':GetRecord');
socket.send(message);
if (debugMode) {
loggingAction('info','INFORMATION : Get Record message sent to server "' + message + '".');
}
break;
case "GoAvailable":
if (debugMode) {
if (debugMode) { loggingAction('log','NOTIFICATION : Setting Agent status to Available.'); }
rid = generateRID(), message = 'type:"GoAvailable",RID:' + rid + ',SID:' + sessionID;
serverComms("outbound", message, rid, "GoAvailable");
if (debugMode) { loggingAction('log','NOTIFICATION : Message sent to server - "' + message + '".'); }
}
break;
case "HangUp":
if (debugMode) {
loggingAction('log','NOTIFICATION : Hang up call requested.');
}
$.colorbox({
html: '<h2 class="confirmation text-center">Confirmation:</h2><p class="confirmation text-center">Call hung up.</p>'
});
$('#cboxContent').removeClass('errorMessage');
break;
case "LogOut":
if (debugMode) {
loggingAction('log','NOTIFICATION : Agent has requested to Log out of script.');
}
logOut();
break;
case "MoveToPanel":
if (debugMode) {
loggingAction('log','NOTIFICATION : Action to Move to Panel #pnl' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("panelID") + ' triggered.');
}
var parser = new DOMParser(),
xmlLogic = parser.parseFromString(scriptXML, "text/xml"),
tags = xmlLogic.getElementsByTagName('*');
$(document).ready(function () {
for (var i0 = 1; i0 < tags.length; i0++) {
switch (tags[i0].nodeName) {
case "Button":
updateVariableOutput('#' + $(tags[i0]).attr("id"), $(tags[i0]).attr("name"));
break;
case "inputField":
updateVariableOutput('#' + $(tags[i0]).attr("id"), $(tags[i0]).attr("label"));
break;
case "textBlock":
updateVariableOutput('#' + $(tags[i0]).attr("id"), $(tags[i0]).attr("text"));
break;
}
}
});
eval('$("#pnl' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("panelID") + '").parent().children().hide(); $("#pnl' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("panelID") + '").show();');
gridValueSelected = '';
$('.selectedRow').removeClass('selectedRow');
$('table').children().remove();
$('table').removeClass('jsgrid');
break;
case "MoveToScriptWindow":
if (debugMode) {
loggingAction('log','NOTIFICATION :Action to Move to Window "#win' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("panelID") + '" has been triggered.');
}
eval('$("#win' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("panelID") + '").parent().children().hide(); $("#win' + $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("panelID") + '").show();');
gridValueSelected = '';
$('.selectedRow').removeClass('selectedRow');
$('table').children().remove();
$('table').removeClass('jsgrid');
break;
case "OpenBrowserWindow":
openNewWindow($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("URL"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("toolbar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("addressBar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("toolbar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("addressBar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("toolbar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("addressBar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("toolbar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("addressBar"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("width"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("height"));
if (debugMode) {
loggingAction('log','INFORMATION : "' + variableConversion($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("URL")) + '" opened in new window.');
}
break;
case "SetFieldParameter":
if (debugMode) {
loggingAction('log','NOTIFICATION : Field Parameter Set');
}
break;
case "SetTextBox":
if (debugMode) {
loggingAction('log','NOTIFICATION : Set Text Box Action');
}
break;
case "SetVariable":
if (gridValueSelected !== '') {
var variableName = $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("variable")
if (debugMode) {
loggingAction('log','NOTIFICATION : The variable to have selected grid value associated with it is "' + variableName + '".');
}
variableNameSplit = variableName.split('.');
if (debugMode) {
loggingAction('info','INFORMATION : The Object to recieve the variable is "' + variableNameSplit[1] + '".');
loggingAction('info','INFORMATION : The key for the variable is "' + variableNameSplit[1] + '".');
}
if ((variableNameSplit[0] === 'Script') || (variableNameSplit[0] === 'SCRIPT')) {
addScriptVariable(variableNameSplit[1], gridValueSelected);
}
} else {
loggingAction('log','NOTIFICATION : Set Variable Value function initiated.');
if ($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("value") !== '') {
var variableName = $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("variable"),
variableValue = variableConversion($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("value"));
if (debugMode) {
loggingAction('log','NOTIFICATION : ' + variableName + ' set to "' + variableValue + '".');
}
eval(variableName + '="' + variableValue + '"');
} else if ($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("controlID") !== '') {
var variableName = $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("variable"),
variableValue = $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("controlID");
variableValue = eval('$("#txt' + variableValue + '").val()');
if (debugMode) {
loggingAction('log',' NOTIFICATION : The value of the variable to be passed to ' + variableName + ' is "' + variableValue + '".');
}
eval(variableName + '="' + variableValue + '"');
}
}
break;
case "UpdateWebFrame":
if (debugMode) {
loggingAction('info','INFORMATION : iFrame update initiated to load ' + variableConversion($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("URL")) + '.')
}
updateIFrame($(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("URL"), $(tags[0].childNodes[iC1].childNodes[iC2].childNodes[iC3].childNodes[iA1].childNodes[iA2]).attr("destinationControl"));
break;
}
}
}
}
}
}
A simplified example of what I'm looking to achieve is below;
JS;
var blocker = 'no';
function askForConfirmation() {
$('#Interaction').fadeIn();
}
function manualRecord() {
console.log('Request new record')}
function responseReceived(acknowledgemntValue){
$('#Interaction').fadeOut();
}
$(document).ready(function(){
$('#btn69').click(function(){
askForConfirmation();
});
$('#accept').click(function(){
blocker = 'no';
responseReceived();
alert(blocker);
});
$('#decline').click(function(){
blocker = 'yes';
responseReceived();
alert(blocker);
});
});
html;
<!DOCTYPE html>
<head>
<title>Sandbox</title>
</head>
<body>
<header>
<h2>Sandbox testing</h2>
</header>
<main>
<button id="btn69">Request Manual Record</button>
<div id="Interaction" style="display:none;">
<p>Please confirm you wish to create manual record</p>
<p><button id="accept">Accept</button><button id="decline">Decline</button></p>
</div>
<div id="blockerState"></div>
</main>
<footer>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="sandscript.js"></script>
</footer>
</body>
I removed the issue by tracking the action number and adding a counter mechanism to track status which is updated on action completion then fires the next action