diff --git a/school/hooks.py b/school/hooks.py index 929dbd4f..63c792cb 100644 --- a/school/hooks.py +++ b/school/hooks.py @@ -184,7 +184,8 @@ jinja = { "school.lms.utils.is_eligible_to_review", "school.lms.utils.get_initial_members", "school.lms.utils.get_sorted_reviews", - "school.lms.utils.is_instructor" + "school.lms.utils.is_instructor", + "school.lms.utils.convert_number_to_character" ], "filters": [] } diff --git a/school/lms/utils.py b/school/lms/utils.py index 9246bc5a..1eae98e7 100644 --- a/school/lms/utils.py +++ b/school/lms/utils.py @@ -2,6 +2,7 @@ import re import frappe from frappe.utils import flt, cint, cstr from school.lms.md import markdown_to_html +import string RE_SLUG_NOTALLOWED = re.compile("[^a-z0-9]+") @@ -292,3 +293,6 @@ def get_initial_members(course): def is_instructor(course): return len(list(filter(lambda x: x.name == frappe.session.user, get_instructors(course)))) > 0 + +def convert_number_to_character(number): + return string.ascii_uppercase[number] diff --git a/school/lms/widgets/Reviews.html b/school/lms/widgets/Reviews.html index bc785845..92e61a3a 100644 --- a/school/lms/widgets/Reviews.html +++ b/school/lms/widgets/Reviews.html @@ -57,7 +57,7 @@
- + {{ review.owner_details.full_name }} diff --git a/school/public/css/style.css b/school/public/css/style.css index 8118bd51..97903fc5 100644 --- a/school/public/css/style.css +++ b/school/public/css/style.css @@ -308,11 +308,6 @@ input[type=checkbox] { width: 100px; } -.custom-checkbox { - display: flex; - align-items: center; -} - .custom-checkbox>label>input { visibility: hidden; } @@ -324,6 +319,10 @@ input[type=checkbox] { border-radius: var(--border-radius-md); } +.empty-checkbox { + margin-right: 0.5rem; +} + .custom-checkbox>label>input:checked+.empty-checkbox { background: url(/assets/school/icons/tick.svg); background-repeat: no-repeat; @@ -331,6 +330,8 @@ input[type=checkbox] { } .quiz-label { + display: flex; + align-items: center; margin-bottom: 0; cursor: pointer; } @@ -823,12 +824,16 @@ input[type=checkbox] { display: flex; align-items: center; justify-content: space-between; + margin-top: 5rem; } .question { flex-direction: column; - width: 85%; - margin: 0 auto; +} + +.question-card { + flex-direction: column; + padding: 1.25rem; } .question p { @@ -887,6 +892,7 @@ input[type=checkbox] { .lesson-pagination { display: flex; justify-content: space-between; + align-items: center; margin: 24px 0px 0px; } @@ -1683,7 +1689,7 @@ pre { } } -.review-author { +.bold-heading { font-size: var(--text-lg); color: var(--gray-900); font-weight: 600; @@ -1715,3 +1721,36 @@ pre { .reviews-parent .progress-bar { background-color: var(--gray-600); } + +.question-header { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 2rem; +} + +.question-number { + padding: 0.25rem 0.75rem; + border-radius: 50%; + box-shadow: var(--shadow-sm); +} + +.option-text { + padding: 0.75rem; + box-shadow: var(--shadow-sm); + border-radius: var(--border-radius-md); + flex: 1; +} + +.active-option .option-text { + background-color: var(--blue-50); + border: 1px solid var(--blue-500); +} + +.question-text { + font-size: var(--text-lg); + color: var(--gray-900); + font-weight: 600; + flex-grow: 1; + margin-left: 1rem; +} diff --git a/school/templates/quiz.html b/school/templates/quiz.html index 640f0569..84dcf1eb 100644 --- a/school/templates/quiz.html +++ b/school/templates/quiz.html @@ -2,43 +2,42 @@
-
+
{% for question in quiz.questions %} + {% set instruction = _("Choose all answers that apply") if question.multiple else _("Choose 1 answer") %}
-

{{ frappe.utils.md_to_html(question.question) }}

- - {% if question.multiple %} - Choose all answers that apply: - {% else %} - Choose 1 answer: - {% endif %} - -
- - {% set options = [question.option_1, question.option_2, question.option_3, question.option_4] %} - - {% for option in options %} - {% if option %} - -
- +
+
{{ loop.index }}
+
+
{{ instruction }}
+ {{ frappe.utils.md_to_html(question.question) }} +
- {% set explanation = question['explanation_' + loop.index | string] %} - {% if explanation %} - {{ explanation }} - {% endif %} -
+ + {% set options = [question.option_1, question.option_2, question.option_3, question.option_4] %} + {% for option in options %} + {% if option %} +
+
+ +
+ + {% set explanation = question['explanation_' + loop.index | string] %} + {% if explanation %} + {{ explanation }} + {% endif %} +
{% endif %} {% endfor %} @@ -51,8 +50,8 @@
Summary
Please join the course to submit the Quiz. +
Try Again
-
Try Again

diff --git a/school/www/batch/learn.html b/school/www/batch/learn.html index 444e6676..34a5bd52 100644 --- a/school/www/batch/learn.html +++ b/school/www/batch/learn.html @@ -108,7 +108,7 @@ {% set progress = get_progress(course.name, lesson.name) %}
diff --git a/school/www/batch/learn.js b/school/www/batch/learn.js index 7260a9a7..52aa0c61 100644 --- a/school/www/batch/learn.js +++ b/school/www/batch/learn.js @@ -43,7 +43,7 @@ frappe.ready(() => { $(".clear-work").click((e) => { clear_work(e); - }) + }); }); @@ -57,8 +57,10 @@ const save_current_lesson = () => { }; const enable_check = (e) => { - if ($(".option:checked").length && $("#check").attr("disabled")) { + if ($(".option:checked").length) { $("#check").removeAttr("disabled"); + $(".custom-checkbox").removeClass("active-option"); + $(".option:checked").closest(".custom-checkbox").addClass("active-option"); } }; @@ -164,7 +166,7 @@ const quiz_summary = (e) => { callback: (data) => { var message = data.message == total_questions ? "Excellent Work" : "You were almost there." $(".question").addClass("hide"); - $(".quiz-footer").addClass("hide"); + $("#summary").addClass("hide"); $("#quiz-form").parent().prepend( `

${message} 👏

${data.message}/${total_questions} correct.
`); @@ -222,8 +224,9 @@ const parse_options = () => { }; const add_icon = (element, icon) => { - var label = $(element).parent().find(".label-area p").text(); - $(element).parent().empty().html(` ${label}`); + $(element).closest(".custom-checkbox").removeClass("active-option"); + var label = $(element).siblings(".option-text").text(); + $(element).parent().empty().html(`
${label}
`); }; const add_to_local_storage = (quiz_name, current_index, answer, is_correct) => { @@ -354,27 +357,27 @@ const clear_work = (e) => { parent.addClass("hide"); parent.siblings(".attach-file").removeClass("hide").val(null); parent.siblings(".submit-work").removeClass("hide"); -} +}; const fetch_assignments = () => { - if ($(".attach-file").length > 0) { - frappe.call({ - method: "school.lms.doctype.lesson_assignment.lesson_assignment.get_assignment", - args: { - "lesson": $(".title").attr("data-lesson") - }, - callback: (data) => { - if (data.message && data.message.length) { - const assignments = data.message; - for (let i in assignments) { - let target = $(`#${assignments[i]["id"]}`); - target.addClass("hide"); - target.siblings(".submit-work").addClass("hide"); - target.siblings(".preview-work").removeClass("hide"); - target.siblings(".preview-work").find("a").attr("href", assignments[i]["assignment"]).text(assignments[i]["file_name"]); - } + if ($(".attach-file").length <= 0) + return; + frappe.call({ + method: "school.lms.doctype.lesson_assignment.lesson_assignment.get_assignment", + args: { + "lesson": $(".title").attr("data-lesson") + }, + callback: (data) => { + if (data.message && data.message.length) { + const assignments = data.message; + for (let i in assignments) { + let target = $(`#${assignments[i]["id"]}`); + target.addClass("hide"); + target.siblings(".submit-work").addClass("hide"); + target.siblings(".preview-work").removeClass("hide"); + target.siblings(".preview-work").find("a").attr("href", assignments[i]["assignment"]).text(assignments[i]["file_name"]); } } - }) - } -} + } + }); +};