feat: add and update a chapter

lms/lms/doctype/lms_course/lms_course.py

@@ -228,23 +228,33 @@ def save_course(tags, title, short_introduction, video_link, image, description,
 
 
 @frappe.whitelist()
-def save_chapter(course, chapter, chapter_description, idx):
+def save_chapter(course, title, chapter_description, idx, chapter):
-    chapter = frappe.get_doc({
+    if chapter:
-        "doctype": "Course Chapter",
+        doc = frappe.get_doc("Course Chapter", chapter)
+    else:
+        doc = frappe.get_doc({
+            "doctype": "Course Chapter"
+        })
+
+    doc.update({
         "course": course,
-        "title": chapter,
+        "title": title,
         "description": chapter_description
     })
-    chapter.save(ignore_permissions=True)
+    doc.save(ignore_permissions=True)
 
+    if chapter:
+        chapter_reference = frappe.get_doc("Chapter Reference", {"chapter": chapter})
+    else:
         chapter_reference =  frappe.get_doc({
         "doctype": "Chapter Reference",
         "parent": course,
-        "chapter": chapter.name,
         "parenttype": "LMS Course",
         "parentfield": "chapters",
         "idx": idx
     })
+
+    chapter_reference.update({"chapter": doc.name})
     chapter_reference.save(ignore_permissions=True)
 
-    return chapter.name
+    return doc.name

lms/lms/widgets/CourseOutline.html

@@ -1,19 +1,29 @@
-{% if get_chapters(course.name) | length %}
 <div class="course-home-outline">
+
+    {% if course.edit_mode and course.name %}
+    <div>
+        <button class="btn btn-md btn-secondary btn-chapter pull-right"> {{ _("New Chapter") }} </button>
+    </div>
+    {% endif %}
+
     <div class="course-home-headings">
         {{ _("Course Content") }}
     </div>
+
+    {% if get_chapters(course.name) | length %}
+
     {% for chapter in get_chapters(course.name) %}
-    <div class="">
+    <div class="chapter-parent">
-        <div class="chapter-title" data-target="#{{ get_slugified_chapter_title(chapter.title) }}"
+        <div class="chapter-title" {% if not course.edit_mode %}  data-toggle="collapse" aria-expanded="false"
-        data-toggle="collapse" aria-expanded="false">
+        data-target="#{{ get_slugified_chapter_title(chapter.title) }}" {% endif %} >
             {% if not course.edit_mode %}
             <img class="chapter-icon" src="/assets/lms/icons/chevron-right.svg">
             {% endif %}
             <div class="w-100 chapter-title-main" {% if course.edit_mode %} contenteditable="true" {% endif %} >{{ chapter.title }}</div>
         </div>
 
-        <div class="chapter-content collapse navbar-collapse" id="{{ get_slugified_chapter_title(chapter.title) }}">
+        <div class="chapter-content {% if not course.edit_mode %} collapse navbar-collapse {% endif %} "
+        id="{{ get_slugified_chapter_title(chapter.title) }}">
 
             {% if chapter.description or course.edit_mode %}
             <div {% if course.edit_mode %} contenteditable="true" {% endif %} class="chapter-description
@@ -22,7 +32,12 @@
             {% endif %}
 
             {% if course.edit_mode %}
-            <button class="btn btn-sm btn-secondary d-block btn-save-chapter mt-2 mb-8"> {{ _('Save') }} </button>
+            <div class="mt-2 mb-8">
+                <button class="btn btn-sm btn-secondary btn-save-chapter"
+                data-index="{{ loop.index }}" data-chapter="{{ chapter.name }}"> {{ _('Save') }} </button>
+                <button class="btn btn-sm btn-secondary btn-lesson ml-4"> {{ _("New Lesson") }}  </button>
+            </div>
+
             {% endif %}
 
             {% set is_instructor = is_instructor(course.name) %}
@@ -78,24 +93,23 @@
     </div>
     {% endfor %}
 
-    <div>
+    {% endif %}
-        <button class="btn btn-md btn-secondary btn-chapter" data-index=" {{ chapters | length + 1 }} "> {{ _("Add Chapter") }} </button>
+
 </div>
+{{ widgets.NoPreviewModal(course=course) }}
+
+
+<div class="course-home-outline">
+
+
+
+
+
+
 </div>
 
 <!-- No Preview Modal -->
-{{ widgets.NoPreviewModal(course=course) }}
 
-{% elif course.edit_mode and course.name %}
-<div class="course-home-outline">
-    <div class="course-home-headings">
-      {{ _("Course Content") }}
-    </div>
-    <div>
-        <button class="btn btn-md btn-secondary btn-chapter" data-index="1"> {{ _("Add Chapter") }} </button>
-    </div>
-</div>
-{% endif %}
 
 <script>
 

lms/public/js/common_functions.js

@@ -7,6 +7,14 @@ frappe.ready(() => {
         notify_user(e);
     });
 
+    $(".btn-chapter").click((e) => {
+        add_chapter(e);
+    });
+
+    $(document).on("click", ".btn-save-chapter", (e) => {
+        save_chapter(e);
+    });
+
 });
 
 const join_course = (e) => {
@@ -40,6 +48,7 @@ const join_course = (e) => {
     })
 };
 
+
 const notify_user = (e) => {
     e.preventDefault();
     var course = decodeURIComponent($(e.currentTarget).attr("data-course"));
@@ -65,3 +74,43 @@ const notify_user = (e) => {
         }
     })
 };
+
+
+const add_chapter = (e) => {
+    let next_index = $("[data-index]").last().data("index");
+
+    $(`<div class="chapter-parent">
+        <div contenteditable="true" data-placeholder="${__('Chapter Name')}" class="chapter-title-main"></div>
+        <div class="small my-2" contenteditable="true" data-placeholder="${__('Short Description')}"
+        id="chapter-description"></div>
+        <button class="btn btn-sm btn-secondary d-block btn-save-chapter mb-8"
+        data-index="${next_index}"> ${__('Save')} </button>
+        </div>`).insertAfter(`.chapter-parent:last`);
+
+    $(".btn-chapter").attr("disabled", true);
+    $([document.documentElement, document.body]).animate({
+        scrollTop: $(".chapter-parent:last").offset().top
+    }, 1000);
+
+    $(".chapter-parent:last").find(".chapter-title-main").focus();
+};
+
+
+const save_chapter = (e) => {
+    let target = $(e.currentTarget);
+    let parent = target.closest(".chapter-parent");
+
+    frappe.call({
+        method: "lms.lms.doctype.lms_course.lms_course.save_chapter",
+        args: {
+            "course": $("#title").data("course"),
+            "title": parent.find(".chapter-title-main").text(),
+            "chapter_description": parent.find("#chapter-description").text(),
+            "idx": target.data("index"),
+            "chapter": target.data("chapter") ? target.data("chapter") : ""
+        },
+        callback: (data) => {
+            window.location.reload();
+        }
+    });
+};

lms/www/courses/course.html

@@ -1,5 +1,6 @@
 {% extends "templates/base.html" %}
-{% block title %}{{ course.title }}
+{% block title %}
+    {{  course.title if course.title else _("New Course") }}
 {% endblock %}
 
 {% block head_include %}
@@ -16,16 +17,19 @@
                 <div class="course-body-container">
                     {{ CourseHeaderOverlay(course) }}
                     {{ Description(course) }}
+                    {{ Save(course) }}
                     {{ widgets.CourseOutline(course=course, membership=membership, is_user_interested=is_user_interested) }}
+                    {% if not course.edit_mode %}
                     {{ widgets.Reviews(course=course, membership=membership) }}
+                    {% endif %}
                 </div>
               </div>
         </div>
     </div>
-  {{ RelatedCourses(course) }}
 </div>
 {% endblock %}
 
+
 {% macro CourseHomeHeader(course) %}
 <div class="course-head-container">
     <div class="container pt-8 pb-10">
@@ -36,30 +40,59 @@
     </div>
 </div>
 {% endmacro %}
-<!-- BreadCrumb -->
 
+
+<!-- BreadCrumb -->
 {% macro BreadCrumb(course) %}
 <div class="breadcrumb">
     <a class="dark-links" href="/courses">{{ _("All Courses") }}</a>
     <img class="ml-1 mr-1" src="/assets/lms/icons/chevron-right.svg">
-  <span class="breadcrumb-destination">{{ course.title }}</span>
+    <span class="breadcrumb-destination">{{ course.title if course.title else _("New Course") }}</span>
 </div>
 {% endmacro %}
-<!-- Course Card -->
 
+
+<!-- Course Card -->
 {% macro CourseCardWide(course) %}
+
 <div class="d-flex align-items-center mt-8">
     {% for tag in get_tags(course.name) %}
-    <div class="course-card-pills">{{ tag }}</div>
+    <div class="course-card-pills" {% if course.edit_mode %} contenteditable="true" {% endif %}>{{ tag }}
+        {% if course.edit_mode %}
+        <span class="btn-delete-tag">
+            <svg class="icon  icon-sm">
+                <use class="" href="#icon-close"></use>
+            </svg>
+        </span>
+        {% endif %}
+    </div>
     {% endfor %}
-</div>
+    {% if course.edit_mode %}
-<div class="course-card-wide-title">
+    <button class="btn btn-default btn-sm btn-tag"> {{ _("Add Tag") }} </button>
-    {{ course.title }}
+    {% endif %}
-</div>
-<div class="">
-    {{ course.short_introduction }}
 </div>
 
+<div {% if course.edit_mode %} data-placeholder="{{ _('Title') }}" contenteditable="true" {% endif %}
+class="course-card-wide-title" id="title" data-course="{{ course.name | urlencode }}">{% if course.title %} {{ course.title }} {% endif %}</div>
+
+<div {% if course.edit_mode %} contenteditable="true" data-placeholder="{{ _('Short Introduction') }}"
+{% endif %} id="intro" >{% if course.short_introduction %} {{ course.short_introduction }} {% endif %}</div>
+
+{% if course.edit_mode %}
+    <div class="d-block mt-1" contenteditable="true" id="video-link"
+    data-placeholder=" {{ _('Preview Video Link') }} ">{% if course.video_link %}{{ course.video_link }}{% endif %}</div>
+
+    <div class="course-image-attachment {% if not course.image %} hide {% endif %} ">
+        <a href="{{ course.image }}" id="image" target="_blank"> {{ course.image }} </a>
+        <button class="btn btn-sm btn-default btn-clear ml-4"> {{ _("Clear") }} </button>
+    </div>
+
+    {% if not course.image %}
+    <a class="btn btn-default btn-sm btn-attach mt-4 {% if course.image %} hide {% endif %}"> {{ _("Attach Image") }} </a>
+    {% endif %}
+{% endif %}
+
+{% if not course.edit_mode %}
 <div class="mt-8">
     <div class="bold-heading">{{ _("Instructors") }}:</div>
     {% for instructor in get_instructors(course.name) %}
@@ -71,8 +104,9 @@
     </div>
     {% endfor %}
 </div>
+{% endif %}
 
-{% if membership %}
+{% if membership and not course.edit_mode %}
 {% set progress = frappe.utils.cint(membership.progress) %}
 <div class="mt-8">
     <div class="progress-percent m-0">{{ progress }}% {{ _("Completed") }}</div>
@@ -85,7 +119,10 @@
 {% endif %}
 {% endmacro%}
 
+
+<!-- Overlay -->
 {% macro CourseHeaderOverlay(course) %}
+{% if not course.edit_mode %}
 <div class="course-overlay-card">
 
     {% if course.video_link %}
@@ -110,24 +147,11 @@
             {{ _("Your course is currently under review. Once the review is complete, the System Admins will publish it on the website.") }}
         </div>
         {% endif %}
+
         {% if no_of_attempts and no_of_attempts >= course.max_attempts %}
         <p> {{ _("You have exceeded the maximum number of attempts allowed to appear for evaluations of this course.") }} </p>
         {% endif %}
 
-    {% if is_instructor(course.name) %}
-    <div class="vertically-center mb-4">
-        <a class="button is-default button-links mr-2" href="/course?name={{ course.name }}"> {{ _("Edit") }} </a>
-        <a class="button is-default button-links mr-2" href="/chapter">
-            <svg class="icon icon-sm mr-1"><use href="#icon-add"></use></svg>
-            {{ _("Add Chapter") }}
-        </a>
-        <a class="button is-default button-links mr-2" href="/lesson">
-            <svg class="icon icon-sm mr-1"><use href="#icon-add"></use></svg>
-            {{ _("Add Lesson") }}
-        </a>
-    </div>
-    {% endif %}
-
         <div class="vertically-center mb-3">
             <svg class="icon icon-md mr-1">
                 <use class="" href="#icon-users">
@@ -157,8 +181,7 @@
         {% endif %}
 
         {% set lesson_index = get_lesson_index(membership.current_lesson) if membership and
-      membership.current_lesson
+        membership.current_lesson else "1.1" if first_lesson_exists(course.name) else None %}
-      else '1.1' %}
 
         {% if show_start_learing_cta %}
         <div class="button wide-button is-primary join-batch" data-course="{{ course.name | urlencode }}">
@@ -172,7 +195,7 @@
             <img class="ml-2" src="/assets/lms/icons/white-arrow.svg" />
         </div>
 
-    {% elif is_instructor(course.name) %}
+        {% elif is_instructor(course.name) and lesson_index %}
         <a class="button wide-button is-primary" id="continue-learning"
         href="{{ get_lesson_url(course.name, lesson_index) }}{{ course.query_parameter }}">
         {{ _("Checkout Course") }} <img class="ml-2" src="/assets/lms/icons/white-arrow.svg" />
@@ -196,16 +219,20 @@
         {{ _("Continue Learning") }} <img class="ml-2" src="/assets/lms/icons/white-arrow.svg" />
         </a>
         {% endif %}
+
         {% set progress = frappe.utils.cint(membership.progress) %}
+
         {% if membership and course.enable_certification %}
         {% if certificate %}
         <a class="button wide-button is-secondary mt-3" href="/courses/{{ course.name }}/{{ certificate }}">
         {{ _("Get Certificate") }}
         </a>
+
         {% elif eligible_for_evaluation %}
         <a class="button wide-button is-secondary mt-3" id="apply-certificate" data-course="{{ course.name }}">
             {{ _("Apply for Certificate") }}
         </a>
+
         {% elif course.grant_certificate_after == "Completion" and progress == 100 %}
         <div class="button wide-button is-secondary mt-3" id="certification" data-course="{{ course.name }}">
         {{ _("Get Certificate") }}
@@ -213,6 +240,10 @@
         {% endif %}
         {% endif %}
 
+        {% if is_instructor(course.name) %}
+        <a class="btn btn-secondary btn-block" href="/courses/{{ course.name }}?edit=1"> {{ _("Edit Course") }} </a>
+        {% endif %}
+
     </div>
 </div>
 
@@ -259,12 +290,25 @@
         </div>
     </div>
 </div>
+{% endif %}
 {% endmacro %}
 
+
+<!-- Description -->
 {% macro Description(course) %}
-<div class="course-description-section">
+<div class="course-description-section" {% if course.edit_mode %} style="min-height: 100px" {% endif %}
-  {{ frappe.utils.md_to_html(course.description) }}
+{% if course.edit_mode %} contenteditable="true" {% endif %} id="description"
+data-placeholder="Description">{% if course.description %}{{ frappe.utils.md_to_html(course.description) }}{% endif %}</div>
+{% endmacro %}
+
+
+<!-- Save -->
+{% macro Save(course) %}
+{% if course.edit_mode %}
+<div>
+    <button class="btn btn-primary btn-md btn-save-course my-4"> {{ _("Save") }} </button>
 </div>
+{% endif %}
 {% endmacro %}
 
 {% macro CourseCreator(course) %}

lms/www/courses/course.py

@@ -6,11 +6,9 @@ def get_context(context):
     context.no_cache = 1
 
     try:
-        print(frappe.form_dict)
         course_name = frappe.form_dict["course"]
     except KeyError:
-        frappe.local.flags.redirect_location = "/courses"
+        redirect_to_courses_list()
-        raise frappe.Redirect
 
     if course_name == "new-course":
         context.course = frappe._dict()
@@ -26,6 +24,11 @@ def set_course_context(context, course_name):
         "price_certificate", "currency", "max_attempts", "duration"],
         as_dict=True)
 
+    if frappe.form_dict.get("edit"):
+        if not is_instructor(course.name):
+            redirect_to_courses_list()
+        course.edit_mode = True
+
     if course is None:
         frappe.local.flags.redirect_location = "/courses"
         raise frappe.Redirect
@@ -51,9 +54,6 @@ def set_course_context(context, course_name):
     if context.course.upcoming:
         context.is_user_interested = get_user_interest(context.course.name)
 
-    if frappe.form_dict.get("edit"):
-        context.course.edit_mode = True
-
     context.metatags = {
         "title": course.title,
         "image": course.image,
@@ -69,3 +69,7 @@ def get_user_interest(course):
 
 def show_start_learing_cta(course, membership, restriction):
     return not course.disable_self_learning and not membership and not course.upcoming and not restriction.get("restrict") and not is_instructor(course.name)
+
+def redirect_to_courses_list():
+    frappe.local.flags.redirect_location = "/courses"
+    raise frappe.Redirect