diff --git a/lms/hooks.py b/lms/hooks.py index 1a4c774a..81783b67 100644 --- a/lms/hooks.py +++ b/lms/hooks.py @@ -232,8 +232,7 @@ lms_markdown_macro_renderers = { "Quiz": "lms.plugins.quiz_renderer", "YouTubeVideo": "lms.plugins.youtube_video_renderer", "Video": "lms.plugins.video_renderer", - "Assignment": "lms.plugins.assignment_renderer", - "Image": "lms.plugin.image_renderer" + "Assignment": "lms.plugins.assignment_renderer" } # page_renderer to manage profile pages diff --git a/lms/lms/web_form/lesson/lesson.js b/lms/lms/web_form/lesson/lesson.js index 4347f730..e0467118 100644 --- a/lms/lms/web_form/lesson/lesson.js +++ b/lms/lms/web_form/lesson/lesson.js @@ -1,9 +1,44 @@ frappe.ready(function() { - frappe.web_form.after_save = () => { - frappe.call({ + + frappe.web_form.after_load = () => { + add_file_upload_component(); + }; + + 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")); + }); + +}); + +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.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.`)); @@ -12,5 +47,42 @@ frappe.ready(function() { }, 3000); } }); - }; -}); +}; + +const add_file_upload_component = () => { + $(get_attachment_controls_html()).insertBefore($(`[data-fieldname="include_in_preview"]`).first()); +}; + +const get_attachment_controls_html = () => { + return ` +
+
+ +
+ + + + + {{ _("Upload Image") }} + +
+
+
+
+ `; +}; + +const build_attachment_table = (file_doc) => { + return $(` + + ${file_doc.file_name} + {{ _("Copy Link") }} + + `); +}; diff --git a/lms/plugins.py b/lms/plugins.py index 479d45e7..cd03d2a6 100644 --- a/lms/plugins.py +++ b/lms/plugins.py @@ -142,6 +142,3 @@ def show_custom_signup(): or frappe.db.get_single_value("LMS Settings", "privacy_policy")): return "lms/templates/signup-form.html" return "frappe/templates/signup.html" - -def image_renderer(src); - return f"" diff --git a/lms/public/css/style.css b/lms/public/css/style.css index 9c1b0986..3fa90c9e 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 @@ + + + + + + + +