Skip to content

Commit

Permalink
Merge pull request #2451 from QuizandSurveyMaster/CU-867968jpx-email-…
Browse files Browse the repository at this point in the history 
…and-result-page-redesign

Cu 867968jpx email and result page redesign
  • Loading branch information
@zubairraeen
zubairraeen authored Jan 25, 2024
2 parents c76b968 + c50375d commit f82ebe5
Show file tree
Hide file tree
Showing 7 changed files with 253 additions and 93 deletions.
6 changes: 5 additions & 1 deletion css/qsm-admin-question.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -288,8 +288,12 @@
}
.answers-single>div.answer-correct-div {
min-width: auto;
width: 70px;
width: 80px;
height: 26px;
padding: 5px 0;
background: #fff;
border: 1px solid #bdbdbd7a;
border-radius: 4px;
}
.answers-single>div.answer-text-div {
width: 560px;
Expand Down
67 changes: 46 additions & 21 deletions css/qsm-admin.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -467,7 +467,7 @@ span.qsm-quiz-name {
align-items: center;
justify-content: flex-end;
background-color: #fff;
padding: 10px 35px;
padding: 10px;
border-bottom: 1px solid #dfd4d4;
}
#qsm_emails .delete-email-button {
Expand All @@ -477,6 +477,11 @@ span.qsm-quiz-name {
cursor: pointer;
transition-duration: 200ms;
}
.delete-page-button {
border: none;
background: transparent;
cursor: pointer;
}
#qsm_emails .delete-email-button:hover {
transform: scale(1.2);
}
Expand All @@ -485,14 +490,12 @@ span.qsm-quiz-name {
flex-direction: column;
}
.results-page-when, .results-page-show, .email-when, .email-show {
padding: 10px;
background-color: #f1f1f1;
border: 1px solid #dfd4d4;
margin: 15px 0;
padding: 15px;
min-width: 60%;
}
.results-page-when, .email-when {
margin-right: 15px;
border-right: 1px solid #dfd4d4;
}
.results-page-content-header, .email-content-header {
margin-bottom: 10px;
Expand All @@ -501,32 +504,58 @@ span.qsm-quiz-name {
margin-bottom: 5px;
display: block;
}
.results-page-content-header h4, .results-page-content-header p, .email-content-header h4, .email-content-header p {
margin: 0;
.results-page-content-header h4,
.email-content-header h4{
font-size: 20px;
margin: 5px 0 15px;
font-weight: 400;
}
.results-page-condition, .email-condition {
display: flex;
flex-direction: column;
margin-bottom: 15px;
border-radius: 10px;
background: #F8F9F9;
padding: 10px;
position: relative;
}
.results-page-condition>select, .results-page-condition>input, .email-condition>select, .email-condition>input {
min-width: auto !important;
max-width: 100%;
.qsm-result-condition-title,
.qsm-email-condition-title {
font-size: 16px;
}
input[type="text"].results-page-redirect {
min-width: 100%;
}
.qsm-result-condition-mode,
.qsm-email-condition-mode {
margin-bottom: 15px;
}
.results-page-condition .qsm-result-condition-container select, .qsm_tab_content .results-page-condition .qsm-result-condition-container input[type="text"], .email-condition .qsm-email-condition-container select, .qsm_tab_content .email-condition .qsm-email-condition-container input[type="text"] {
min-width: auto;
width: 100%;
border-radius: 4px;
border-color: #1e1e1e;
}
.results-page-condition .qsm-result-condition-container, .email-condition .qsm-email-condition-container {
display: flex;
flex-wrap: wrap;
gap: 3px;
}
.delete-condition-button {
background: none;
border: 1px solid #1dd969;
color: #dc3232;
cursor: pointer;
transition-duration: 200ms;
padding: 6px;
position: absolute;
right: 0;
top: 10px;
}
.delete-condition-button:hover {
transform: scale(1.1);
}
.email-show .label {
display: block;
}
.qsm-email-reply-to{
margin-top: 10px;
}
.results-page-show textarea, .to-email, .subject, .email-template {
width: 100%;
margin-bottom: 10px;
Expand All @@ -540,12 +569,8 @@ span.qsm-quiz-name {
width: calc(50% - 15px);
min-width: unset;
}
.results-page-condition, .email-condition {
align-items: center;
flex-direction: row;
}
.results-page-condition>select, .results-page-condition>input, .email-condition>select, .email-condition>input {
max-width: 23%;
.results-page-condition .qsm-result-condition-container, .email-condition .qsm-email-condition-container {
flex-wrap: nowrap;
}
.delete-condition-button {
border: none;
Expand Down
113 changes: 98 additions & 15 deletions js/qsm-admin.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1486,10 +1486,11 @@ var QSMContact;
};
$(this).find('.email-condition').each(function () {
email.conditions.push({
'category': $(this).children('.email-condition-category').val(),
'criteria': $(this).children('.email-condition-criteria').val(),
'operator': $(this).children('.email-condition-operator').val(),
'value': $(this).children('.email-condition-value').val()
'category': $(this).find('.email-condition-category').val(),
'extra_condition': $(this).find('.email-extra-condition-category').val(),
'criteria': $(this).find('.email-condition-criteria').val(),
'operator': $(this).find('.email-condition-operator').val(),
'value': $(this).find('.email-condition-value').val()
});
});
emails.push(email);
Expand Down Expand Up @@ -1539,18 +1540,34 @@ var QSMContact;
})
.fail(QSMAdmin.displayjQueryError);
},
addCondition: function ($email, category, criteria, operator, value) {
addCondition: function ($email, category, extra_condition, criteria, operator, value) {
var template = wp.template('email-condition');
$email.find('.email-when-conditions').append(template({
'category': category,
'extra_condition': extra_condition,
'criteria': criteria,
'operator': operator,
'value': value
}));
jQuery(document).trigger('qsm_after_add_email_condition', [$email, category, criteria, operator, value]);
$email.find('.email-condition').each(function () {
let extraCategory = jQuery(this).find('.email-extra-condition-category');
if ('quiz' == jQuery(this).find('.email-condition-category').val() || '' == jQuery(this).find('.email-condition-category').val()) {
extraCategory.hide();
jQuery(this).find('.email-condition-operator').show();
jQuery(this).find('option.qsm-questions-criteria').show();
jQuery(this).find('option.qsm-score-criteria').show()
} else if ('category' == jQuery(this).find('.email-condition-category').val()) {
jQuery(this).find('.option.qsm-questions-criteria').hide();
extraCategory.find('option').hide();
extraCategory.find('.qsm-condition-category').show();
jQuery(this).find('option.qsm-score-criteria').show()
jQuery(this).find('.email-condition-operator').show();
}
});
jQuery(document).trigger('qsm_after_add_email_condition', [$email, category, extra_condition, criteria, operator, value]);
},
newCondition: function ($email) {
QSMAdminEmails.addCondition($email, '', 'score', 'equal', 0);
QSMAdminEmails.addCondition($email, 'quiz', '', 'score', 'equal', 0);
},
addEmail: function (conditions, to, subject, content, replyTo) {
QSMAdminEmails.total += 1;
Expand All @@ -1560,6 +1577,7 @@ var QSMContact;
QSMAdminEmails.addCondition(
$('.qsm-email:last-child'),
condition.category,
condition.extra_condition,
condition.criteria,
condition.operator,
condition.value
Expand All @@ -1583,6 +1601,7 @@ var QSMContact;
newEmail: function () {
var conditions = [{
'category': '',
'extra_condition': '',
'criteria': 'score',
'operator': 'greater',
'value': '0'
Expand Down Expand Up @@ -3454,10 +3473,11 @@ var import_button;
}
$(this).find('.results-page-condition').each(function () {
page.conditions.push({
'category': $(this).children('.results-page-condition-category').val(),
'criteria': $(this).children('.results-page-condition-criteria').val(),
'operator': $(this).children('.results-page-condition-operator').val(),
'value': $(this).children('.results-page-condition-value').val()
'category': $(this).find('.results-page-condition-category').val(),
'extra_condition': $(this).find('.results-page-extra-condition-category').val(),
'criteria': $(this).find('.results-page-condition-criteria').val(),
'operator': $(this).find('.results-page-condition-operator').val(),
'value': $(this).find('.results-page-condition-value').val()
});
});
pages.push(page);
Expand Down Expand Up @@ -3506,18 +3526,35 @@ var import_button;
})
.fail(QSMAdmin.displayjQueryError);
},
addCondition: function ($page, category, criteria, operator, value) {
addCondition: function ($page, category, extra_condition, criteria, operator, value) {
var template = wp.template('results-page-condition');
$page.find('.results-page-when-conditions').append(template({
'category': category,
'extra_condition': extra_condition,
'criteria': criteria,
'criteria': criteria,
'operator': operator,
'value': value
}));
jQuery(document).trigger('qsm_after_add_result_condition', [$page, category, criteria, operator, value]);
$page.find('.results-page-condition').each(function () {
let extraCategory = jQuery(this).find('.results-page-extra-condition-category');
if ('quiz' == jQuery(this).find('.results-page-condition-category').val() || '' == jQuery(this).find('.results-page-condition-category').val()) {
extraCategory.hide();
jQuery(this).find('.results-page-condition-operator').show();
jQuery(this).find('option.qsm-questions-criteria').show();
jQuery(this).find('option.qsm-score-criteria').show()
} else if ('category' == jQuery(this).find('.results-page-condition-category').val()) {
jQuery(this).find('.option.qsm-questions-criteria').hide();
extraCategory.find('option').hide();
extraCategory.find('.qsm-condition-category').show();
jQuery(this).find('option.qsm-score-criteria').show()
jQuery(this).find('.results-page-condition-operator').show();
}
});
jQuery(document).trigger('qsm_after_add_result_condition', [$page, category, extra_condition, criteria, operator, value]);
},
newCondition: function ($page) {
QSMAdminResults.addCondition($page, '', 'score', 'equal', 0);
QSMAdminResults.addCondition($page, 'quiz', '', 'score', 'equal', 0);
},
addResultsPage: function (conditions, page, redirect) {
QSMAdminResults.total += 1;
Expand All @@ -3527,6 +3564,7 @@ var import_button;
QSMAdminResults.addCondition(
$('.results-page:last-child'),
condition.category,
condition.extra_condition,
condition.criteria,
condition.operator,
condition.value
Expand All @@ -3547,7 +3585,8 @@ var import_button;
},
newResultsPage: function () {
var conditions = [{
'category': '',
'category': 'quiz',
'extra-condition': '',
'criteria': 'score',
'operator': 'greater',
'value': '0'
Expand Down Expand Up @@ -3583,4 +3622,48 @@ var import_button;
});
}
}
function qsmHandleConditionChange(containerClass, extraCategoryClass, operatorClass, criteriaClass, defaultValueClass) {
jQuery(document).on('change', '.' + containerClass + '-category', function () {
let container = jQuery(this).closest('.' + containerClass);
let extraCategory = container.find('.' + extraCategoryClass);

if ('quiz' == jQuery(this).val() || '' == jQuery(this).val()) {
extraCategory.hide();
container.find('.' + operatorClass).show();
container.find('.' + criteriaClass).show();
container.find('.' + defaultValueClass).show();
container.find('.' + operatorClass + ' option').hide().prop("selected", false);
container.find('.' + operatorClass + ' option.default_operator').show().prop("selected", true);
container.find('option.qsm-score-criteria').show();
container.find('.' + criteriaClass + ' option.qsm-points-criteria').prop("selected", true);
} else if ('category' == jQuery(this).val()) {
extraCategory.show();
container.find('.' + criteriaClass).show();
container.find('.' + operatorClass).show();
extraCategory.find('option').prop("selected", false).hide();
extraCategory.find('.qsm-condition-category').show();
container.find('.' + defaultValueClass).show();
container.find('.' + criteriaClass + ' option.qsm-points-criteria').prop("selected", true);
extraCategory.find('option:visible:first').prop("selected", true);
container.find('.' + operatorClass + ' option').hide().prop("selected", true);
container.find('.' + operatorClass + ' option.default_operator').show().prop("selected", true);
container.find('option.qsm-score-criteria').show();
}
});
}

function qsmHandleOperatorChange(containerClass, defaultValueClass) {
jQuery(document).on('change', '.' + containerClass + '-operator', function () {
let selectedOption = jQuery(this).find('option:selected');
if (selectedOption.hasClass('default_operator')) {
jQuery(this).closest('.' + containerClass).find('.' + defaultValueClass).show();
}
});
}

// Usage
qsmHandleConditionChange('results-page-condition', 'results-page-extra-condition-category', 'results-page-condition-operator', 'results-page-condition-criteria', 'condition-default-value');
qsmHandleOperatorChange('results-page-condition', 'condition-default-value');
qsmHandleConditionChange('email-condition', 'email-extra-condition-category', 'email-condition-operator', 'email-condition-criteria', 'condition-default-value');
qsmHandleOperatorChange('email-condition', 'condition-default-value');
}(jQuery));
Loading

0 comments on commit f82ebe5

Please sign in to comment.