Skip to content

Commit

Permalink
add call to API, bug fixes and styling fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
Amy Chen committed Mar 18, 2024
1 parent 792e2c6 commit 8ec3f85
Show file tree
Hide file tree
Showing 4 changed files with 149 additions and 38 deletions.
12 changes: 7 additions & 5 deletions portal/eproms/templates/eproms/assessment_engine/ae_macros.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -228,10 +228,9 @@ <h4>{{_("Your Support Team")}}</h4>
</div>
{%- endmacro -%}
{%- macro empro_no_contact_notice() -%}
<div class="no-contact-list-wrapper">
<b>Note:</b> You have chosen not to be contacted about <span id="noContactTriggerList"><b>fatigue</b>, <b>general pain</b>, <b>insomnia</b></span>. Your care team will not discuss these issues this month.
<div class="no-contact-list-wrapper hide">
<b>Note:</b> You have chosen not to be contacted about <span id="noContactTriggerList"></span>. Your care team will not discuss these issues this month.
</div>
<br/>
{%- endmacro -%}
{%- macro empro_modal_hardTrigger_supportTeam_block(organization="") -%}
<div class="item">
Expand Down Expand Up @@ -386,8 +385,11 @@ <h2 class="title">{{_("We want to check with you ...")}}</h2>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-empro-primary btn-submit">Submit</button>
<button class="btn btn-default btn-dismiss">Dismiss</button>
<div>
<button class="btn btn-empro-primary btn-submit">Submit</button>
<button class="btn btn-default btn-dismiss">Dismiss</button>
</div>
<div class="saving-indicator-container hide"><i class="fa fa-spinner fa-spin"></i> {{_("Saving data...")}}</div>
</div>
</div>
</div>
Expand Down
143 changes: 111 additions & 32 deletions portal/static/js/src/empro.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,14 @@ var emproObj = function () {
this.softTriggerDomains = [];
this.optOutDomains = [];
this.selectedOptOutDomains = [];
this.submittedOptOutDomains = [];
this.optOutSubmitData = null;
this.hasHardTrigger = false;
this.hasSoftTrigger = false;
this.userId = 0;
this.visitMonth = 0;
this.authorDate = null;
this.cachedAccessKey = null;
};
emproObj.prototype.getDomainDisplay = function (domain) {
if (!domain) return "";
Expand Down Expand Up @@ -65,16 +69,15 @@ emproObj.prototype.initThankyouModal = function (autoShow) {
$("#emproModal").modal(autoShow ? "show" : "hide");
};
emproObj.prototype.populateSelectedOptoutUI = function () {
if (EmproObj.selectedOptOutDomains.length === 0) {
$(".no-contact-list-wrapper").hide();
if (!this.submittedOptOutDomains || this.submittedOptOutDomains.length === 0) {
return;
}
console.log("selected opt out domains ", this.selectedOptOutDomains);
var contentHTML = this.selectedOptOutDomains
console.log("submitted opt out domains: ", this.submittedOptOutDomains);
var contentHTML = this.submittedOptOutDomains
.map((domain) => this.getDomainDisplay(domain))
.join(", ");
$("#emproModal #noContactTriggerList").html("<b>" + contentHTML + "</b>");
$(".no-contact-list-wrapper").show();
$(".no-contact-list-wrapper").removeClass("hide");
};
emproObj.prototype.populateOptoutInputItems = function () {
if (!this.hasThankyouModal()) {
Expand All @@ -86,26 +89,73 @@ emproObj.prototype.populateOptoutInputItems = function () {
optOutDomainsListElement.html("");
this.optOutDomains.forEach((domain) => {
optOutDomainsListElement.append(`
<div class="item"><input type="checkbox" class="ck-input" value="${domain}"><span>${this.getDomainDisplay(
domain
)}</span></div>
<div class="item">
<input type="checkbox" class="ck-input ck-input-${domain}" value="${domain}">
<span class="ck-display" data-domain="${domain}">${this.getDomainDisplay(
domain
)}</span>
</div>
`);
});
};
emproObj.prototype.initOptOutElementEvents = function () {
if (!this.hasOptOutModal()) {
emproObj.prototype.setOptoutSubmitData = function () {
if (!EmproObj.selectedOptOutDomains || !EmproObj.selectedOptOutDomains.length)
return;
var triggerObject = {};
EmproObj.selectedOptOutDomains.forEach((item) => {
triggerObject[item] = {
_opt_out_next_visit: "true",
};
});
var submitData = {
user_id: EmproObj.userId,
visit_month: EmproObj.visitMonth,
triggers: {
domains: triggerObject,
},
};
console.log("Optout data to be submitted: ", submitData);
EmproObj.optOutSubmitData = submitData;
};
emproObj.prototype.onBeforeSubmitOptoutData = function () {
// reset error
$("#emproOptOutModal .error-message").addClass("hide");
// set data in the correct format for submission to API
EmproObj.setOptoutSubmitData();
// disable buttons
$("#emproOptOutModal .btn-submit").attr("disabled", true);
$("#emproOptOutModal .btn-dismiss").attr("disabled", true);
// display saving in progress indicator icon
$("#emproOptOutModal .saving-indicator-container").removeClass("hide");
};
emproObj.prototype.onAfterSubmitOptoutData = function (data) {
// enable buttons
$("#emproOptOutModal .btn-submit").attr("disabled", false);
$("#emproOptOutModal .btn-dismiss").attr("disabled", false);
// hide saving in progress indicator icon
$("#emproOptOutModal .saving-indicator-container").addClass("hide");
// show error if any
if (data && data.error) {
document.querySelector("#emproOptOutModal .error-message").innerText =
"System error: Unable to save your choices.";
$("#emproOptOutModal .error-message").removeClass("hide");
return false;
}

EmproObj.submittedOptOutDomains = EmproObj.selectedOptOutDomains;
EmproObj.populateSelectedOptoutUI();
EmproObj.initOptOutModal(false);
EmproObj.initThankyouModal(true);
return true;
};
emproObj.prototype.initObservers = function () {
let errorObserver = new MutationObserver(function (mutations) {
for (let mutation of mutations) {
console.log("mutation? ", mutation);
// console.log("mutation? ", mutation);
if (mutation.type === "childList") {
// do something here if error occurred
document
.querySelector("#emproOptOutModal .continue-container")
.classList.remove("hide");
console.log("mutation ", mutation);
}
}
});
Expand All @@ -117,31 +167,39 @@ emproObj.prototype.initOptOutElementEvents = function () {
childList: true,
}
);
$(window).on("unload", function () {
errorObserver.disconnect();
});
//other observers if needed
};
emproObj.prototype.initOptOutElementEvents = function () {
if (!this.hasOptOutModal()) {
return;
}
EmproObj.initObservers();

$("#emproOptOutModal .btn-submit").on("click", function (e) {
e.preventDefault();
e.stopPropagation();
EmproObj.populateSelectedOptoutUI();
if (EmproObj.selectedOptOutDomains.length) {
var submitData = {
user_id: EmproObj.userId,
visit_month: EmproObj.visitMonth,
opt_out_domains: EmproObj.selectedOptOutDomains,
};
// TODO: call API to save
console.log("data to be submitted ", submitData);
}
// TODO, call API to save selected opt out domains,
// if call failed, display error, e.g. $("#emproOptOutModal .error-message").html(message), else go to the thank you modal
// EmproObj.initOptOutModal(false);
//EmproObj.initThankyouModal(true);
document.querySelector("#emproOptOutModal .error-message").innerText =
"Error! Not able to save your choices.";
EmproObj.onBeforeSubmitOptoutData();
tnthAjax.setOptoutTriggers(
EmproObj.userId,
{
data: JSON.stringify(EmproObj.optOutSubmitData),
max_attempts: 1
},
(data) => {
return EmproObj.onAfterSubmitOptoutData(data);
}
);
});

$("#emproOptOutModal .btn-dismiss").on("click", function (e) {
e.stopPropagation();
EmproObj.initOptOutModal(false);
EmproObj.initThankyouModal(true);
});

$("#emproOptOutModal .ck-input").on("click", function () {
if ($(this).is(":checked")) {
if (
Expand All @@ -155,6 +213,15 @@ emproObj.prototype.initOptOutElementEvents = function () {
);
}
});

$("#emproOptOutModal .ck-display").on("click", function () {
var domain = $(this).attr("data-domain");
var associatedCkInput = $("#emproOptOutModal .ck-input-"+domain);
if (associatedCkInput.is(":checked"))
associatedCkInput.prop("checked", false);
else
associatedCkInput.prop("checked", true);
});
$("#emproOptOutModal .continue-button").on("click", function () {
EmproObj.initThankyouModal(true);
});
Expand Down Expand Up @@ -252,16 +319,26 @@ emproObj.prototype.init = function () {
let assessmentCompleted =
String(status).toLowerCase() === "completed";
console.log(
"today ",
today,
"author date ",
authoredDate,
" assessment completed ",
assessmentCompleted
);

this.authorDate = authoredDate;

/*
* associating each thank you modal popup accessed by assessment date
*/
let cachedAccessKey = `EMPRO_MODAL_ACCESSED_${this.userId}_${today}_${authoredDate}`;
this.cachedAccessKey = cachedAccessKey;

const clearCacheData = getUrlParameter("clearCache");
if (clearCacheData) {
localStorage.removeItem(this.cachedAccessKey);
}
/*
* automatically pops up thank you modal IF sub-study assessment is completed,
* and sub-study assessment is completed today and the thank you modal has not already popped up today
Expand All @@ -280,7 +357,7 @@ emproObj.prototype.init = function () {
*/
localStorage.setItem(cachedAccessKey, `true`);

console.log("Opt out domain? ", this.optOutDomains);
// console.log("Opt out domain? ", this.optOutDomains);
if (this.optOutDomains.length > 0) {
this.populateOptoutInputItems();
this.initOptOutElementEvents();
Expand Down Expand Up @@ -312,6 +389,10 @@ emproObj.prototype.processTriggerData = function (data) {
}
var self = this;
console.log("trigger data ", data);

// set visit month related to trigger data
this.visitMonth = data.visit_month;

for (let key in data.triggers.domain) {
if (!Object.keys(data.triggers.domain[key]).length) {
continue;
Expand Down Expand Up @@ -388,8 +469,6 @@ emproObj.prototype.initTriggerDomains = function (callbackFunc) {
*/
this.initTriggerItemsVis();

this.visitMonth = data.visit_month;

callback(data);

//console.log("self.domains? ", self.domains);
Expand Down
16 changes: 16 additions & 0 deletions portal/static/js/src/modules/TnthAjax.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -378,6 +378,22 @@ export default { /*global $ */
return true;
});
},
"setOptoutTriggers": function(userId, params, callback) {
callback = callback || function() {};
params = params || {};
if (!userId) {
callback({error: true});
return false;
}
this.sendRequest(`/api/patient/${userId}/triggers/opt_out`, "POST", userId, params, (data) => {
if (!data || data.error) {
callback({"error": true});
return false;
}
callback(data);
return true;
});
},
"getCliniciansList": function(orgIds, callback) {
callback = callback || function() {};
orgIds = orgIds || [];
Expand Down
16 changes: 15 additions & 1 deletion portal/static/less/eproms.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4075,6 +4075,13 @@ section.header {
.continue-container {
margin-top: 8px;
}
.saving-indicator-container {
margin-top: 16px;
}
.no-contact-list-wrapper {
margin-top: 20px;
color: @warningColor;
}
}
.modal-footer {
background: @bodyBgColor;
Expand Down Expand Up @@ -4161,11 +4168,14 @@ section.header {
}
ul {
padding-left: 20px;
margin-bottom: 20px;
//margin-bottom: 20px;
}
li:not(:last-of-type) {
margin-bottom: 8px;
}
li:last-of-type {
margin-bottom: 16px;
}
}
.buttons-container {
margin-top: 24px;
Expand Down Expand Up @@ -4259,6 +4269,10 @@ section.header {
&:not(:last-of-type) {
margin-bottom:8px;
}
.ck-display:hover {
cursor: pointer;
color: @emproBtnPrimaryColor;
}
}
}
.modal-footer {
Expand Down

0 comments on commit 8ec3f85

Please sign in to comment.