diff --git a/lms/lms/doctype/course_lesson/course_lesson.json b/lms/lms/doctype/course_lesson/course_lesson.json index c38059ac..5d19f852 100644 --- a/lms/lms/doctype/course_lesson/course_lesson.json +++ b/lms/lms/doctype/course_lesson/course_lesson.json @@ -10,9 +10,9 @@ "field_order": [ "chapter", "course", - "include_in_preview", "column_break_4", "title", + "include_in_preview", "index_label", "section_break_6", "body", @@ -75,7 +75,6 @@ "fetch_from": "chapter.course", "fieldname": "course", "fieldtype": "Link", - "hidden": 1, "label": "Course", "options": "LMS Course", "read_only": 1 @@ -83,7 +82,7 @@ ], "index_web_pages_for_search": 1, "links": [], - "modified": "2022-03-14 18:56:31.969801", + "modified": "2022-04-22 12:59:23.641915", "modified_by": "Administrator", "module": "LMS", "name": "Course Lesson", diff --git a/lms/lms/web_form/lesson/lesson.js b/lms/lms/web_form/lesson/lesson.js index 4347f730..ad73a38c 100644 --- a/lms/lms/web_form/lesson/lesson.js +++ b/lms/lms/web_form/lesson/lesson.js @@ -1,16 +1,94 @@ frappe.ready(function() { - frappe.web_form.after_save = () => { - frappe.call({ + + frappe.web_form.after_load = () => { + add_file_upload_component(); + fetch_course(); + }; + + frappe.web_form.after_save = () => { + show_success_message(); + }; + + $(document).on("click", ".add-attachment", (e) => { + show_upload_modal(); + }); + + $(document).on("click", ".copy-link", (e) => { + frappe.utils.copy_to_clipboard($(e.currentTarget).data("link")); + $(".attachments").collapse("hide"); + }); + +}); + +const fetch_course = () => { + frappe.call({ method: "lms.lms.doctype.course_lesson.course_lesson.get_lesson_info", args: { - "chapter": frappe.web_form.doc.chapter + "chapter": frappe.web_form.doc.chapter }, callback: (data) => { - frappe.msgprint(__(`Lesson has been saved successfully. Go back to the chapter and add this lesson to the lessons table.`)); - setTimeout(() => { - window.location.href = `/courses/${data.message}`; - }, 3000); + this.course = data.message; } }); - }; -}); +} + +const show_upload_modal = () => { + new frappe.ui.FileUploader({ + folder: "Home/Attachments", + restrictions: { + allowed_file_types: ['image/*'] + }, + on_success: (file_doc) => { + $(".attachments").append(build_attachment_table(file_doc)); + let count = $(".attachment-count").data("count") + 1; + $(".attachment-count").data("count", count); + $(".attachment-count").html(__(`${count} attachments`)); + $(".attachments").removeClass("hide"); + }, + }); +}; + +const show_success_message = () => { + frappe.msgprint(__(`Lesson has been saved successfully. Go back to the chapter and add this lesson to the lessons table.`)); + setTimeout(() => { + window.location.href = `/courses/${this.course}`; + }, 2000); +}; + +const add_file_upload_component = () => { + $(get_attachment_controls_html()).insertBefore($(`[data-fieldname="include_in_preview"]`).first()); +}; + +const get_attachment_controls_html = () => { + return ` +
+
+ +
+ + + + + {{ _("Upload Attachments") }} + +
+
+
+
+ `; +}; + +const build_attachment_table = (file_doc) => { + return $(` + + ${file_doc.file_name} + {{ _("Copy Link") }} + + `); +}; diff --git a/lms/lms/web_form/lesson/lesson.json b/lms/lms/web_form/lesson/lesson.json index 2c519587..346c4459 100644 --- a/lms/lms/web_form/lesson/lesson.json +++ b/lms/lms/web_form/lesson/lesson.json @@ -11,17 +11,17 @@ "apply_document_permissions": 1, "button_label": "Save", "creation": "2022-03-07 18:41:42.549831", - "custom_css": "", + "custom_css": "#introduction {\n font-size: var(--text-base);\n}", "doc_type": "Course Lesson", "docstatus": 0, "doctype": "Web Form", "idx": 0, - "introduction_text": "



Create lessons for your course. You can add some additional content to the lesson using a special syntax. The table below mentions all types of dynamic content that you can add to the lessons and the syntax for the same.


Content TypeSyntax
Video{{ Video(\"url_of_source\") }}
YouTube Video{{ YouTubeVideo(\"unique_embed_id\") }}
Exercise{{ Exercise(\"exercise_name\") }}
Quiz{{ Quiz(\"lms_quiz_name\") }}
Assignment{{ Assignment(\"id-filetype\") }}
", + "introduction_text": "
\n

Create lessons for your course. For adding content, use markdown syntax. You can add some additional content to the lesson using a special syntax. The table below mentions all types of dynamic content that you can add to the lessons and the syntax for the same.

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n Content Type\n \n Syntax \n
Assignment {{ Assignment(\"id-filetype\") }}
Quiz {{ Quiz(\"lms_quiz_name\") }}
YouTube Video {{ YouTubeVideo(\"unique_embed_id\") }}
\n

Note: You can also attach videos from Vimeo by including the iframe embed of the video to the lesson.

\n
", "is_multi_step_form": 0, "is_standard": 1, "login_required": 1, "max_attachment_size": 0, - "modified": "2022-03-14 18:49:33.526455", + "modified": "2022-04-25 10:26:12.691050", "modified_by": "Administrator", "module": "LMS", "name": "lesson", @@ -34,7 +34,7 @@ "show_in_grid": 0, "show_sidebar": 0, "sidebar_items": [], - "success_url": "/lesson", + "success_url": "", "title": "Lesson", "web_form_fields": [ { @@ -80,7 +80,7 @@ "fieldname": "body", "fieldtype": "Text", "hidden": 0, - "label": "Body", + "label": "Content", "max_length": 0, "max_value": 0, "read_only": 0, diff --git a/lms/public/css/style.css b/lms/public/css/style.css index 9a7660be..a93fa209 100644 --- a/lms/public/css/style.css +++ b/lms/public/css/style.css @@ -1414,3 +1414,32 @@ pre { .btn-outline-primary { border: 1px solid var(--primary-color); } + +.show-attachments { + padding-right: 0.5rem; + display: flex; + align-items: center; +} + +.attachment-controls { + display: flex; + align-items: center; + width: fit-content; + cursor: pointer; +} + +.attachments { + flex-direction: column; + padding: 0.5rem 0; + margin-top: 1rem; + position: absolute; + z-index: 1; + width: fit-content; + border-collapse: separate; + border-spacing: 1rem 0.5rem; +} + +.attachments-parent { + float: right; + font-size: var(--text-sm); +} diff --git a/lms/public/icons/symbol-defs.svg b/lms/public/icons/symbol-defs.svg index 0090c5c8..53708e2d 100644 --- a/lms/public/icons/symbol-defs.svg +++ b/lms/public/icons/symbol-defs.svg @@ -28,4 +28,17 @@ + + + + + + + +