Merge pull request #341 from pateljannat/ux-fixes

fix: replaced some dialogs with alerts

lms/hooks.py

@@ -214,7 +214,6 @@ profile_mandatory_fields = [
     "bio",
     "linkedin",
     "education",
-    "work_experience",
     "skill",
     "preferred_functions",
     "preferred_industries",

lms/lms/web_form/chapter/chapter.js

@@ -1,6 +1,9 @@
 frappe.ready(function() {
     frappe.web_form.after_save = () => {
-        frappe.msgprint(__("Chapter has been saved successfully. Go back to the course and add this chapter to the chapters table."))
+        frappe.show_alert({
+            message:__("Chapter has been saved successfully. Go back to the course and add this chapter to the chapters table."),
+            indicator:'green'
+        }, 3);
         setTimeout(() => {
             window.location.href = `/courses/${frappe.web_form.doc.course}`;
         }, 3000);

lms/lms/web_form/lesson/lesson.js

@@ -49,10 +49,13 @@ const show_upload_modal = () => {
 };
 
 const show_success_message = () => {
-    frappe.msgprint(__(`Lesson has been saved successfully. Go back to the chapter and add this lesson to the lessons table.`));
+    frappe.show_alert({
+        message: __(`Lesson has been saved successfully. Go back to the chapter and add this lesson to the lessons table.`),
+        indicator:'green'
+    }, 3);
     setTimeout(() => {
         window.location.href = `/courses/${this.course}`;
-    }, 2000);
+    }, 3000);
 };
 
 const add_file_upload_component = () => {

lms/lms/web_form/profile/profile.json

@@ -22,7 +22,7 @@
  "is_standard": 1,
  "login_required": 1,
  "max_attachment_size": 0,
- "modified": "2022-02-23 09:32:37.352930",
+ "modified": "2022-06-06 10:38:37.784113",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "profile",
@@ -83,7 +83,7 @@
    "max_length": 0,
    "max_value": 0,
    "read_only": 0,
-   "reqd": 0,
+   "reqd": 1,
    "show_in_filter": 0
   },
   {
@@ -244,7 +244,7 @@
    "max_value": 0,
    "options": "Work Experience",
    "read_only": 0,
-   "reqd": 1,
+   "reqd": 0,
    "show_in_filter": 0
   },
   {

lms/lms/widgets/CourseOutline.html

@@ -29,13 +29,12 @@
             {% if membership or lesson.include_in_preview %}
             <a class="lesson-links" href="{{ get_lesson_url(course.name, lesson.number) }}{{course.query_parameter}}"
                 data-course="{{ course.name }}">
-                <svg class="icon icon-md mr-2">
+                <svg class="icon icon-sm mr-2">
                 <use class="" href="#{{ lesson.icon }}">
                 </svg>
-                {{ lesson.title }}
+                <span>{{ lesson.title }}</span>
-
                 {% if membership %}
-                <svg class="icon icon-md lesson-progress-tick {{ get_progress(course.name, lesson.name) != 'Complete' and 'hide' }}">
+                <svg class="icon icon-sm lesson-progress-tick {{ get_progress(course.name, lesson.name) != 'Complete' and 'hide' }}">
                     <use class="" href="#icon-green-check">
                 </svg>
                 {% endif %}
@@ -48,7 +47,7 @@
                 href="{{ get_lesson_url(course.name, lesson.number) }}{{course.query_parameter}}"
                 data-course="{{ course.name }}">
 
-                <svg class="icon icon-md">
+                <svg class="icon icon-sm">
                     <use class="" href="#icon-lock">
                 </svg>
                 <div>{{ lesson.title }}</div>
@@ -57,7 +56,7 @@
             {% else %}
             <div class="no-preview" title="This lesson is not available for preview" data-course="{{ course.name }}">
                 <div class="lesson-links">
-                <svg class="icon icon-md">
+                <svg class="icon icon-sm">
                     <use class="" href="#icon-lock-gray">
                 </svg>
                 <div>{{ lesson.title }}</div>

lms/public/css/style.css

@@ -411,20 +411,17 @@ input[type=checkbox] {
   display: flex;
   align-items: center;
   padding: 0.5rem;
-  color: inherit;
+  color: var(--gray-900);
+  font-size: var(--text-base);
 }
 
 .lesson-links:hover {
   cursor: pointer;
   text-decoration: none;
-  color: inherit;
+  color: var(--gray-900);
   border-radius: var(--border-radius-md);
 }
 
-.course-content-parent .lesson-links {
-  font-size: var(--text-base);
-}
-
 .lessons {
   margin-left: 2rem;
 }
@@ -540,11 +537,6 @@ input[type=checkbox] {
   flex-direction: column;
 }
 
-.question-card {
-  flex-direction: column;
-  padding: 1.25rem;
-}
-
 .question p {
   margin-bottom: 0;
 }
@@ -574,12 +566,13 @@ input[type=checkbox] {
   margin-top: 1rem;
 }
 
-.lesson-content-card {
+.lesson-content {
-  margin: 3rem 0;
+    padding: 1.5rem;
+    flex-direction: column;
 }
 
-.lesson-page {
+.lesson-content-card {
-    background-color: #FFFFFF;
+    margin: 2rem 0 3rem;
 }
 
 .lesson-content-card .alert-dismissible .close {
@@ -607,7 +600,6 @@ input[type=checkbox] {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin: 2rem 0 4rem;
 }
 
 .lesson-pagination-parent {
@@ -1450,3 +1442,7 @@ li {
 .no-preview {
     color: var(--gray-600);
 }
+
+.discussions-parent .empty-state {
+    background-color: var(--gray-200);
+}

lms/public/js/common_functions.js

@@ -28,13 +28,13 @@ const join_course = (e) => {
         "callback": (data) => {
             if (data.message == "OK") {
                 $(".no-preview-modal").modal("hide");
-                frappe.msgprint({
+                frappe.show_alert({
-                    "title": __("Successfully Enrolled"),
+                    message: __("You are now a student of this course."),
-                    "message": __("You are now a student of this course.")
+                    indicator:'green'
-                });
+                }, 3);
                 setTimeout(function () {
                     window.location.href = `/courses/${course}/learn/1.1`;
-                }, 2000);
+                }, 3000);
             }
         }
     })
@@ -55,10 +55,13 @@ const notify_user = (e) => {
         },
         callback: (data) => {
             $(".no-preview-modal").modal("hide");
-            frappe.msgprint(__("You have opted to be notified for this course. You will receive an email when the course becomes available."));
+            frappe.show_alert({
+                message: __("You have opted to be notified for this course. You will receive an email when the course becomes available."),
+                indicator:'green'
+            }, 3);
             setTimeout(() => {
                 window.location.reload();
-            }, 2000);
+            }, 3000);
         }
     })
 };

lms/templates/quiz.html

@@ -1,5 +1,5 @@
 {% if attempts_exceeded %}
-<div class="common-card-style text-center p-5" style="flex-direction: column;">
+<div class="text-center">
     <div class="font-weight-bold mb-4" style="font-size: var(--text-lg);">{{ quiz.title }}</div>
     <div> {{ _("You have already exceeded the maximum number of attempts allowed for this quiz.") }} </div>
     <div> {{ _("Your latest score is {0}.").format(last_attempt_score) }} </div>
@@ -7,7 +7,7 @@
 {% else %}
 <div id="quiz-title" class="hide" data-max-attempts="{{ quiz.max_attempts }}">{{ quiz.title }}</div>
 
-<div class="common-card-style question-card">
+<div class="">
     <div id="start-banner" class="text-center">
         <div class="font-weight-bold mb-3" style="font-size: var(--text-lg);"> {{ quiz.title }} </div>
         <div class="mb-3">{{ _("There are {0} questions in this quiz.").format(quiz.questions | length) }}{% if quiz.max_attempts %}
@@ -70,7 +70,7 @@
 
         <button class="button pull-right is-default" id="check" disabled>{{ _("Check") }}</button>
         <div class="button is-secondary hide" id="next">{{ _("Next Question") }}</div>
-        <div class="button is-secondary is-default hide" id="summary">{{ _("Summary") }}</div>
+        <div class="button is-secondary is-default hide" id="summary">{{ _("Submit") }}</div>
         <small id="submission-message" class="font-weight-bold hide"> {{ _("Please join the course to submit the Quiz.") }} </small>
         <div class="button is-secondary hide" id="try-again">{{ _("Try Again") }}</div>
     </div>

lms/www/batch/learn.html

@@ -22,9 +22,6 @@
       </div>
       <div class="lesson-pagination-parent">
         {{ LessonContent(lesson) }}
-        {% if membership %}
-        {{ pagination(prev_url, next_url) }}
-        {% endif %}
         {{ Discussions() }}
       </div>
     </div>
@@ -45,7 +42,7 @@
 {% macro LessonContent(lesson) %}
 {% set instructors = get_instructors(course.name) %}
 {% set is_instructor = is_instructor(course.name) %}
-<div class="lesson-content">
+<div class="common-card-style lesson-content">
   <div class="lesson-title">
     <div class="course-home-headings title mb-0
     {% if membership %} is-member {% endif %}
@@ -100,6 +97,8 @@
     {% endif %}
   </div>
 
+  {{ pagination(prev_url, next_url) }}
+
 </div>
 {% endmacro %}
 
@@ -145,10 +144,12 @@
 {% endmacro %}
 
 {% macro Discussions() %}
+{% set topics_count = frappe.db.count("Discussion Topic",
+    {"reference_doctype": "Course Lesson", "reference_docname": lesson.name}) %}
 {% set is_instructor = frappe.session.user == course.instructor %}
 {% set condition = is_instructor if is_instructor else membership %}
 {% set doctype, docname = "Course Lesson", lesson.name %}
-{% set title = "Questions" %}
+{% set title = "Questions" if topics_count else "" %}
 {% set cta_title = "Ask a Question" %}
 {% set button_name = "Start Learning" %}
 {% set redirect_to = "/courses/" + course.name %}

lms/www/courses/course.js

@@ -161,22 +161,27 @@ const element_not_in_viewport = (el) => {
 };
 
 const submit_for_review = (e) => {
-  let course = $(e.currentTarget).data("course");
+    let course = $(e.currentTarget).data("course");
-  frappe.call({
+    frappe.call({
-    method: "lms.lms.doctype.lms_course.lms_course.submit_for_review",
+        method: "lms.lms.doctype.lms_course.lms_course.submit_for_review",
-    args: {
+        args: {
-      "course": course
+            "course": course
-    },
+        },
-    callback: (data) => {
+        callback: (data) => {
-      if (data.message == "No Chp") {
+            if (data.message == "No Chp") {
-        frappe.msgprint(__(`There are no chapters in this course.
+                frappe.msgprint(__(`There are no chapters in this course.
-          Please add chapters and lessons to your course before you submit it for review.`));
+                Please add chapters and lessons to your course before you submit it for review.`));
-      } else if (data.message == "OK") {
+            } else if (data.message == "OK") {
-        frappe.msgprint(__("Your course has been submitted for review."))
+                frappe.show_alert({
-        window.location.reload();
+                    message: __("Your course has been submitted for review."),
-      }
+                    indicator:'green'
-    }
+                }, 3);
-  })
+                setTimeout(() => {
+                    window.location.reload();
+                }, 3000);
+            }
+        }
+    });
 };
 
 const apply_cetificate = (e) => {
@@ -199,10 +204,13 @@ const submit_slot = (e) => {
         },
         callback: (data) => {
             $("#slot-modal").modal("hide");
-            frappe.msgprint(__("Your slot has been booked. Prepare well for the evaluations."));
+            frappe.show_alert({
+                message: __("Your slot has been booked. Prepare well for the evaluations."),
+                indicator:'green'
+            }, 3);
             setTimeout(() => {
                 window.location.reload();
-            }, 2000);
+            }, 3000);
         }
     });
 };

lms/www/jobs/job.js

@@ -18,15 +18,18 @@ const open_report_dialog = (e) => {
 };
 
 const report = (e) => {
-  frappe.call({
+    frappe.call({
-    method: "lms.job.doctype.job_opportunity.job_opportunity.report",
+        method: "lms.job.doctype.job_opportunity.job_opportunity.report",
-    args: {
+        args: {
-      "job": $(e.currentTarget).data("job"),
+            "job": $(e.currentTarget).data("job"),
-      "reason": $(".report-field").val()
+            "reason": $(".report-field").val()
-    },
+        },
-    callback: (data) => {
+        callback: (data) => {
-      $(".report-modal").modal("hide");
+            $(".report-modal").modal("hide");
-      frappe.msgprint(__("Thanks for informing us about this post. The admin will look into it and take an appropriate action soon."))
+            frappe.show_alert({
-    }
+                message: __("Thanks for informing us about this post. The admin will look into it and take an appropriate action soon."),
-  })
+                indicator:'green'
+            }, 5);
+        }
+    });
 }