feat: update lesson

This commit is contained in:
Jannat Patel
2022-08-09 18:32:29 +05:30
parent 65edd2ce22
commit a4534d8f3e
9 changed files with 504 additions and 334 deletions

View File

@@ -258,3 +258,36 @@ def save_chapter(course, title, chapter_description, idx, chapter):
chapter_reference.save(ignore_permissions=True)
return doc.name
@frappe.whitelist()
def save_lesson(title, body, chapter, preview, idx, lesson):
if lesson:
doc = frappe.get_doc("Course Lesson", lesson)
else:
doc = frappe.get_doc({
"doctype": "Course Lesson"
})
doc.update({
"chapter": chapter,
"title": title,
"body": body,
"include_in_preview": preview
})
doc.save(ignore_permissions=True)
if lesson:
lesson_reference = frappe.get_doc("Lesson Reference", {"lesson": lesson})
else:
lesson_reference = frappe.get_doc({
"doctype": "Lesson Reference",
"parent": chapter,
"parenttype": "Course Chapter",
"parentfield": "lessons",
"idx": idx
})
lesson_reference.update({"lesson": doc.name})
lesson_reference.save(ignore_permissions=True)
return doc.name

View File

@@ -22,8 +22,10 @@
<div class="w-100 chapter-title-main" {% if course.edit_mode %} contenteditable="true" {% endif %} >{{ chapter.title }}</div>
</div>
{% set lessons = get_lessons(course.name, chapter) %}
<div class="chapter-content {% if not course.edit_mode %} collapse navbar-collapse {% endif %} "
id="{{ get_slugified_chapter_title(chapter.title) }}">
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
@@ -35,25 +37,28 @@
<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>
<a class="btn btn-sm btn-secondary btn-lesson ml-4" href="/courses/{{ course.name }}/learn/0.0"> {{ _("New Lesson") }} </a>
<a class="btn btn-sm btn-secondary btn-lesson ml-4"
href="/courses/{{ course.name }}/learn/{{loop.index}}.{{ lessons | length + 1 }}?edit=1"> {{ _("New Lesson") }} </a>
</div>
{% endif %}
{% set is_instructor = is_instructor(course.name) %}
<div class="lessons">
{% for lesson in get_lessons(course.name, chapter) %}
{% for lesson in lessons %}
{% set active = membership.current_lesson == lesson.name %}
<div class="lesson-info {% if active and not course.edit_mode %} active-lesson {% endif %}">
{% 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-sm mr-2">
<use class="" href="#{{ lesson.icon }}">
</svg>
<span>{{ lesson.title }}</span>
{% if membership %}
<svg class="icon icon-sm lesson-progress-tick {{ get_progress(course.name, lesson.name) != 'Complete' and 'hide' }}">
<use class="" href="#icon-green-check">
@@ -63,10 +68,9 @@
</a>
{% elif is_instructor and not lesson.include_in_preview %}
<a class="lesson-links"
<a class="lesson-links" data-course="{{ course.name }}"
title="This lesson is not available for preview. As you are the Instructor of the course only you can see it."
href="{{ get_lesson_url(course.name, lesson.number) }}{{course.query_parameter}}"
data-course="{{ course.name }}">
href="{{ get_lesson_url(course.name, lesson.number) }}{% if course.edit_mode %}?edit=1{% endif %}{{course.query_parameter}}">
<svg class="icon icon-sm mr-2">
<use class="" href="#icon-lock">

View File

@@ -1421,6 +1421,7 @@ pre {
.attachments-parent {
float: right;
font-size: var(--text-sm);
margin-bottom: 1rem;
}
li {
@@ -1506,10 +1507,8 @@ li {
border: 1px solid var(--gray-400);
padding: 0.5rem;
border-radius: var(--border-radius);
}
[contenteditable] {
outline: none;
white-space: pre-wrap;
}
[contenteditable]:empty:before{

View File

@@ -1,4 +1,7 @@
frappe.ready(() => {
setup_vue_and_file_size();
$(".join-batch").click((e) => {
join_course(e);
});
@@ -17,6 +20,28 @@ frappe.ready(() => {
});
const setup_vue_and_file_size = () => {
frappe.require("/assets/frappe/node_modules/vue/dist/vue.js", () => {
Vue.prototype.__ = window.__;
Vue.prototype.frappe = window.frappe;
});
frappe.provide("frappe.form.formatters");
frappe.form.formatters.FileSize = file_size;
};
const file_size = (value) => {
if(value > 1048576) {
value = flt(flt(value) / 1048576, 1) + "M";
} else if (value > 1024) {
value = flt(flt(value) / 1024, 1) + "K";
}
return value;
};
const join_course = (e) => {
e.preventDefault();
let course = $(e.currentTarget).attr("data-course");

View File

@@ -25,18 +25,18 @@
{% block content %}
<div class="common-page-style lesson-page">
<div class="container course-details-page">
{{ BreadCrumb(course, lesson) }}
<div class="course-content-parent">
<div class="course-details-outline">
{{ widgets.CourseOutline(course=course, membership=membership) }}
</div>
<div class="lesson-pagination-parent">
{{ LessonContent(lesson) }}
{{ Discussions() }}
</div>
<div class="container course-details-page">
{{ BreadCrumb(course, lesson) }}
<div class="course-content-parent">
<div class="course-details-outline">
{{ widgets.CourseOutline(course=course, membership=membership) }}
</div>
<div class="lesson-pagination-parent">
{{ LessonContent(lesson) }}
{% if not lesson.edit_mode %} {{ Discussions() }} {% endif %}
</div>
</div>
</div>
</div>
</div>
{% endblock %}
@@ -58,63 +58,106 @@
{% set instructors = get_instructors(course.name) %}
{% set is_instructor = is_instructor(course.name) %}
<div class="common-card-style lesson-content">
<div class="lesson-title">
<div class="lesson-title">
<div class="course-home-headings title mb-0 {% if membership %} is-member {% endif %}
{% if membership or is_instructor %} eligible-for-submission {% endif %}"
{% if lesson.edit_mode %} data-placeholder="{{ _('Title') }}" contenteditable="true" {% endif %}
data-lesson="{{ lesson.name }}" data-course="{{ course.name }}"
> {% if lesson.title %} {{ lesson.title }} {% endif %} </div>
<span class="lesson-progress {{hide if get_progress(course.name, lesson.name) != 'Complete' else ''}}">{{ _("COMPLETED") }}</span>
<!-- Title -->
<div class="course-home-headings title mb-0 {% if membership %} is-member {% endif %}
{% if membership or is_instructor %} eligible-for-submission {% endif %}" id="title"
{% if lesson.edit_mode %} data-placeholder="{{ _('Title') }}" contenteditable="true" {% endif %}
data-index="{{ lesson_index }}" data-course="{{ course.name }}" data-chapter="{{ chapter }}"
{% if lesson.name %} data-lesson="{{ lesson.name }}" {% endif %}
>{% if lesson.title %}{{ lesson.title }}{% endif %}</div>
<span class="lesson-progress {{ hide if get_progress(course.name, lesson.name) != 'Complete' else ''}}">{{ _("COMPLETED") }}</span>
{% if is_instructor %}
<a class="button is-default button-links ml-auto" href="/lesson?name={{ lesson.name }}"> {{ _("Edit") }} </a>
{% endif %}
</div>
<div class="d-flex align-items-center">
{% set ins_len = instructors | length %}
{% for instructor in instructors %}
{% if ins_len > 1 and loop.index == 1 %}
<div class="avatar-group overlap">
{% endif %}
{{ widgets.Avatar(member=instructor, avatar_class="avatar-small") }}
{% if ins_len > 1 and loop.index == ins_len %}
<!-- Edit Button -->
{% if is_instructor and not lesson.edit_mode %}
<button class="button is-default button-links ml-auto btn-edit"> {{ _("Edit") }} </button>
{% endif %}
</div>
{% endif %}
{% endfor %}
<a class="button-links ml-1" href="{{ get_profile_url(instructors[0].username) }}">
<span class="course-meta">
{% if ins_len == 1 %}
{{ instructors[0].full_name }}
{% else %}
{% set suffix = _("other") if ins_len - 1 == 1 else _("others") %}
{{ instructors[0].full_name.split(" ")[0] }} and {{ ins_len - 1 }} {{ suffix }}
{% endif %}
</span>
</a>
<div class="ml-5 course-meta"> {{ frappe.utils.format_date(lesson.creation, "medium") }} </div>
</div>
<div class="markdown-source lesson-content-card">
{% if membership or lesson.include_in_preview or is_instructor %}
{% if is_instructor and not lesson.include_in_preview %}
<div class="small alert alert-secondary alert-dismissible mt-4 mb-4">
{{ _("This lesson is not available for preview. As you are the Instructor of the course only you can see it.") }}
<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
</div>
{% endif %}
{{ render_html(lesson.body) }}
{% else %}
<div class="">
<div class="button is-primary pull-right join-batch" data-course="{{ course.name | urlencode }}"> {{ _("Start Learning") }} </div>
<div class=""> {{ _("This lesson is not available for preview. Please join the course to access it.") }} </div>
</div>
{% endif %}
</div>
<!-- Instructors -->
<div class="d-flex align-items-center">
{% set ins_len = instructors | length %}
{% for instructor in instructors %}
{% if ins_len > 1 and loop.index == 1 %}
<div class="avatar-group overlap">
{% endif %}
{{ widgets.Avatar(member=instructor, avatar_class="avatar-small") }}
{{ pagination(prev_url, next_url) }}
{% if ins_len > 1 and loop.index == ins_len %}
</div>
{% endif %}
{% endfor %}
<a class="button-links ml-1" href="{{ get_profile_url(instructors[0].username) }}">
<span class="course-meta">
{% if ins_len == 1 %}
{{ instructors[0].full_name }}
{% else %}
{% set suffix = _("other") if ins_len - 1 == 1 else _("others") %}
{{ instructors[0].full_name.split(" ")[0] }} and {{ ins_len - 1 }} {{ suffix }}
{% endif %}
</span>
</a>
<div class="ml-5 course-meta"> {{ frappe.utils.format_date(lesson.creation, "medium") }} </div>
</div>
<!-- Lesson Content -->
<div class="markdown-source lesson-content-card">
{% if membership or lesson.include_in_preview or is_instructor %}
{% if is_instructor and not lesson.include_in_preview and not lesson.edit_mode %}
<div class="small alert alert-secondary alert-dismissible mb-4">
{{ _("This lesson is not available for preview. As you are the Instructor of the course only you can see it.") }}
<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
</div>
{% endif %}
{% if lesson.edit_mode %}
<div class="attachments-parent">
<div class="attachment-controls">
<div class="show-attachments" data-toggle="collapse" data-target="#collapse-attachments" aria-expanded="false">
<svg class="icon icon-sm">
<use class="" href="#icon-attachment">
</svg>
<span class="attachment-count" data-count="0">0 {{ _("attachments") }}</span>
</div>
<div class="add-attachment">
<span class="button is-secondary">
<svg class="icon icon-sm">
<use class="" href="#icon-upload">
</svg>
{{ _("Upload Attachments") }}
</span>
</div>
</div>
<table class="attachments common-card-style collapse hide" id="collapse-attachments"></table>
</div>
<label class="d-flex align-items-center mb-4 small">
<input {% if lesson.include_in_preview %} checked {% endif %}
type="checkbox" id="preview"> {{ _("Show preview of this lesson") }}
</label>
<div contenteditable="true" data-placeholder="{{ _('Enter the lesson content.') }}"
id="body"> {% if lesson.body %} {{ lesson.body }} {% endif %} </div>
<button class="btn btn-primary btn-md mt-8 btn-lesson pull-right"> {{ _("Save") }} </button>
{% else %}
{{ render_html(lesson.body) }}
{% endif %}
{% else %}
<div class="">
<div class="button is-primary pull-right join-batch" data-course="{{ course.name | urlencode }}"> {{ _("Start Learning") }} </div>
<div class=""> {{ _("This lesson is not available for preview. Please join the course to access it.") }} </div>
</div>
{% endif %}
</div>
{% if not lesson.edit_mode %}
{{ pagination(prev_url, next_url) }}
{% endif %}
</div>
{% endmacro %}

View File

@@ -45,12 +45,29 @@ frappe.ready(() => {
clear_work(e);
});
$(".btn-lesson").click((e) => {
save_lesson(e);
});
$(".add-attachment").click((e) => {
show_upload_modal();
});
$(".btn-start-quiz").click((e) => {
$("#start-banner").addClass("hide");
$("#quiz-form").removeClass("hide");
mark_active_question();
});
$(".btn-edit").click((e) => {
window.location.href = `${window.location.href}?edit=1`;
});
$(document).on("click", ".copy-link", (e) => {
frappe.utils.copy_to_clipboard($(e.currentTarget).data("link"));
$(".attachments").collapse("hide");
});
if ($("#quiz-title").data("max-attempts")) {
window.addEventListener("beforeunload", (e) => {
e.returnValue = "";
@@ -59,23 +76,26 @@ frappe.ready(() => {
}
});
const save_current_lesson = () => {
if ($(".title").hasClass("is-member")) {
frappe.call("lms.lms.api.save_current_lesson", {
course_name: $(".title").attr("data-course"),
lesson_name: $(".title").attr("data-lesson")
})
}
if ($(".title").hasClass("is-member")) {
frappe.call("lms.lms.api.save_current_lesson", {
course_name: $(".title").attr("data-course"),
lesson_name: $(".title").attr("data-lesson")
});
}
};
const enable_check = (e) => {
if ($(".option:checked").length) {
$("#check").removeAttr("disabled");
$(".custom-checkbox").removeClass("active-option");
$(".option:checked").closest(".custom-checkbox").addClass("active-option");
}
if ($(".option:checked").length) {
$("#check").removeAttr("disabled");
$(".custom-checkbox").removeClass("active-option");
$(".option:checked").closest(".custom-checkbox").addClass("active-option");
}
};
const mark_active_question = (e = undefined) => {
$(".timer").addClass("hide");
calculate_and_display_time(100);
@@ -92,82 +112,87 @@ const mark_active_question = (e = undefined) => {
initialize_timer();
};
const mark_progress = (e) => {
/* Prevent default only for Next button anchor tag and not for progress checkbox */
if ($(e.currentTarget).prop("nodeName") != "INPUT")
e.preventDefault();
else
return;
/* Prevent default only for Next button anchor tag and not for progress checkbox */
if ($(e.currentTarget).prop("nodeName") != "INPUT")
e.preventDefault();
else
return;
const target = $(e.currentTarget).attr("data-progress") ? $(e.currentTarget) : $("input.mark-progress");
const current_status = $(".lesson-progress").hasClass("hide") ? "Incomplete": "Complete";
const target = $(e.currentTarget).attr("data-progress") ? $(e.currentTarget) : $("input.mark-progress");
const current_status = $(".lesson-progress").hasClass("hide") ? "Incomplete": "Complete";
let status = "Incomplete";
if (target.prop("nodeName") == "INPUT" && target.prop("checked")) {
status = "Complete";
}
let status = "Incomplete";
if (target.prop("nodeName") == "INPUT" && target.prop("checked")) {
status = "Complete";
}
if (status != current_status) {
frappe.call({
method: "lms.lms.doctype.course_lesson.course_lesson.save_progress",
args: {
lesson: $(".title").attr("data-lesson"),
course: $(".title").attr("data-course"),
status: status
},
callback: (data) => {
change_progress_indicators(status, e);
show_certificate_if_course_completed(data);
if (status != current_status) {
frappe.call({
method: "lms.lms.doctype.course_lesson.course_lesson.save_progress",
args: {
lesson: $(".title").attr("data-lesson"),
course: $(".title").attr("data-course"),
status: status
},
callback: (data) => {
change_progress_indicators(status, e);
show_certificate_if_course_completed(data);
move_to_next_lesson(status, e);
}
});
}
else
move_to_next_lesson(status, e);
}
});
}
else
move_to_next_lesson(status, e);
};
const change_progress_indicators = (status, e) => {
if (status == "Complete") {
$(".lesson-progress").removeClass("hide");
$(".active-lesson .lesson-progress-tick").removeClass("hide");
}
else {
$(".lesson-progress").addClass("hide");
$(".active-lesson .lesson-progress-tick").addClass("hide");
}
if (status == "Incomplete" && !$(e.currentTarget).hasClass("next")) {
$(e.currentTarget).addClass("hide");
$("input.mark-progress").prop("checked", false).closest(".custom-checkbox").removeClass("hide");
}
if (status == "Complete") {
$(".lesson-progress").removeClass("hide");
$(".active-lesson .lesson-progress-tick").removeClass("hide");
}
else {
$(".lesson-progress").addClass("hide");
$(".active-lesson .lesson-progress-tick").addClass("hide");
}
if (status == "Incomplete" && !$(e.currentTarget).hasClass("next")) {
$(e.currentTarget).addClass("hide");
$("input.mark-progress").prop("checked", false).closest(".custom-checkbox").removeClass("hide");
}
};
const show_certificate_if_course_completed = (data) => {
if (data.message == 100 && !$(".next").attr("data-next") && $("#certification").hasClass("hide")) {
$("#certification").removeClass("hide");
$(".next").addClass("hide");
}
if (data.message == 100 && !$(".next").attr("data-next") && $("#certification").hasClass("hide")) {
$("#certification").removeClass("hide");
$(".next").addClass("hide");
}
};
const move_to_next_lesson = (status, e) => {
if ($(e.currentTarget).hasClass("next") && $(e.currentTarget).attr("data-href")) {
window.location.href = $(e.currentTarget).attr("data-href");
}
else if (status == "Complete") {
$("input.mark-progress").closest(".custom-checkbox").addClass("hide");
$("div.mark-progress").removeClass("hide");
$(".next").addClass("hide");
}
else {
$("input.mark-progress").closest(".custom-checkbox").removeClass("hide");
$("div.mark-progress").addClass("hide");
$(".next").removeClass("hide");
}
if ($(e.currentTarget).hasClass("next") && $(e.currentTarget).attr("data-href")) {
window.location.href = $(e.currentTarget).attr("data-href");
}
else if (status == "Complete") {
$("input.mark-progress").closest(".custom-checkbox").addClass("hide");
$("div.mark-progress").removeClass("hide");
$(".next").addClass("hide");
}
else {
$("input.mark-progress").closest(".custom-checkbox").removeClass("hide");
$("div.mark-progress").addClass("hide");
$(".next").removeClass("hide");
}
};
const quiz_summary = (e=undefined) => {
e && e.preventDefault();
var quiz_name = $("#quiz-title").text();
var total_questions = $(".question").length;
let quiz_name = $("#quiz-title").text();
let total_questions = $(".question").length;
frappe.call({
method: "lms.lms.doctype.lms_quiz.lms_quiz.quiz_summary",
args: {
@@ -175,7 +200,7 @@ const quiz_summary = (e=undefined) => {
"results": localStorage.getItem(quiz_name)
},
callback: (data) => {
var message = data.message == total_questions ? __("Excellent Work 👏") : __("Better luck next time")
let message = data.message == total_questions ? __("Excellent Work 👏") : __("Better luck next time")
$(".question").addClass("hide");
$("#summary").addClass("hide");
$("#quiz-form").parent().prepend(
@@ -183,20 +208,22 @@ const quiz_summary = (e=undefined) => {
<div class="font-weight-bold">${data.message}/${total_questions}</div></div>`);
$("#try-again").removeClass("hide");
}
})
});
};
const try_quiz_again = (e) => {
window.location.reload();
window.location.reload();
};
const check_answer = (e=undefined) => {
e && e.preventDefault();
clearInterval(self.timer);
$(".timer").addClass("hide");
var quiz_name = $("#quiz-title").text();
var total_questions = $(".question").length;
var current_index = $(".active-question").attr("data-qt-index");
let quiz_name = $("#quiz-title").text();
let total_questions = $(".question").length;
let current_index = $(".active-question").attr("data-qt-index");
$(".explanation").removeClass("hide");
$("#check").addClass("hide");
@@ -212,193 +239,205 @@ const check_answer = (e=undefined) => {
else {
$("#next").removeClass("hide");
}
var [answer, is_correct] = parse_options();
let [answer, is_correct] = parse_options();
add_to_local_storage(quiz_name, current_index, answer, is_correct);
};
const parse_options = () => {
var answer = [];
var is_correct = [];
$(".active-question input").each((i, element) => {
var correct = parseInt($(element).attr("data-correct"));
if ($(element).prop("checked")) {
answer.push(decodeURIComponent($(element).val()));
correct && is_correct.push(1);
correct ? add_icon(element, "check") : add_icon(element, "wrong");
}
else {
correct && is_correct.push(0);
correct ? add_icon(element, "minus-circle-green") : add_icon(element, "minus-circle");
}
})
return [answer, is_correct];
let answer = [];
let is_correct = [];
$(".active-question input").each((i, element) => {
let correct = parseInt($(element).attr("data-correct"));
if ($(element).prop("checked")) {
answer.push(decodeURIComponent($(element).val()));
correct && is_correct.push(1);
correct ? add_icon(element, "check") : add_icon(element, "wrong");
}
else {
correct && is_correct.push(0);
correct ? add_icon(element, "minus-circle-green") : add_icon(element, "minus-circle");
}
});
return [answer, is_correct];
};
const add_icon = (element, icon) => {
$(element).closest(".custom-checkbox").removeClass("active-option");
var label = $(element).siblings(".option-text").text();
$(element).siblings(".option-text").html(`
<div>
<img class="mr-3" src="/assets/lms/icons/${icon}.svg">
${label}
</div>
`);
//$(element).parent().empty().html(`<div class="option-text"><img class="mr-3" src="/assets/lms/icons/${icon}.svg"> ${label}</div>`);
$(element).closest(".custom-checkbox").removeClass("active-option");
let label = $(element).siblings(".option-text").text();
$(element).siblings(".option-text").html(`
<div>
<img class="mr-3" src="/assets/lms/icons/${icon}.svg">
${label}
</div>
`);
//$(element).parent().empty().html(`<div class="option-text"><img class="mr-3" src="/assets/lms/icons/${icon}.svg"> ${label}</div>`);
};
const add_to_local_storage = (quiz_name, current_index, answer, is_correct) => {
var quiz_stored = JSON.parse(localStorage.getItem(quiz_name));
var quiz_obj = {
"question_index": current_index,
"answer": answer.join(),
"is_correct": is_correct
}
quiz_stored ? quiz_stored.push(quiz_obj) : quiz_stored = [quiz_obj]
localStorage.setItem(quiz_name, JSON.stringify(quiz_stored))
let quiz_stored = JSON.parse(localStorage.getItem(quiz_name));
let quiz_obj = {
"question_index": current_index,
"answer": answer.join(),
"is_correct": is_correct
}
quiz_stored ? quiz_stored.push(quiz_obj) : quiz_stored = [quiz_obj]
localStorage.setItem(quiz_name, JSON.stringify(quiz_stored))
};
const create_certificate = (e) => {
e.preventDefault();
course = $(".title").attr("data-course");
frappe.call({
method: "lms.lms.doctype.lms_certificate.lms_certificate.create_certificate",
args: {
"course": course
},
callback: (data) => {
window.location.href = `/courses/${course}/${data.message.name}`;
}
})
e.preventDefault();
course = $(".title").attr("data-course");
frappe.call({
method: "lms.lms.doctype.lms_certificate.lms_certificate.create_certificate",
args: {
"course": course
},
callback: (data) => {
window.location.href = `/courses/${course}/${data.message.name}`;
}
});
};
const attach_work = (e) => {
const target = $(e.currentTarget);
let files = target.siblings(".attach-file").prop("files")
if (files && files.length) {
files = add_files(files)
return_as_dataurl(files)
files.map((file) => {
upload_file(file, target);
})
}
const target = $(e.currentTarget);
let files = target.siblings(".attach-file").prop("files")
if (files && files.length) {
files = add_files(files)
return_as_dataurl(files)
files.map((file) => {
upload_file(file, target);
})
}
};
const upload_file = (file, target) => {
return new Promise((resolve, reject) => {
let xhr = new XMLHttpRequest();
return new Promise((resolve, reject) => {
let xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
if (xhr.readyState == XMLHttpRequest.DONE) {
if (xhr.status === 200) {
let response = JSON.parse(xhr.responseText)
create_lesson_work(response.message, target);
} else if (xhr.status === 403) {
let response = JSON.parse(xhr.responseText);
frappe.msgprint(`Not permitted. ${response._error_message || ''}`);
xhr.onreadystatechange = () => {
if (xhr.readyState == XMLHttpRequest.DONE) {
if (xhr.status === 200) {
let response = JSON.parse(xhr.responseText)
create_lesson_work(response.message, target);
} else if (xhr.status === 403) {
let response = JSON.parse(xhr.responseText);
frappe.msgprint(`Not permitted. ${response._error_message || ''}`);
} else if (xhr.status === 413) {
frappe.msgprint('Size exceeds the maximum allowed file size.');
} else if (xhr.status === 413) {
frappe.msgprint('Size exceeds the maximum allowed file size.');
} else {
frappe.msgprint(xhr.status === 0 ? 'XMLHttpRequest Error' : `${xhr.status} : ${xhr.statusText}`);
} else {
frappe.msgprint(xhr.status === 0 ? 'XMLHttpRequest Error' : `${xhr.status} : ${xhr.statusText}`);
}
}
}
}
}
xhr.open('POST', '/api/method/upload_file', true);
xhr.setRequestHeader('Accept', 'application/json');
xhr.setRequestHeader('X-Frappe-CSRF-Token', frappe.csrf_token);
xhr.open('POST', '/api/method/upload_file', true);
xhr.setRequestHeader('Accept', 'application/json');
xhr.setRequestHeader('X-Frappe-CSRF-Token', frappe.csrf_token);
let form_data = new FormData();
if (file.file_obj) {
form_data.append('file', file.file_obj, `${frappe.session.user}-${file.name}`);
form_data.append('folder', `${$(".title").attr("data-lesson")} ${$(".title").attr("data-course")}`)
}
let form_data = new FormData();
if (file.file_obj) {
form_data.append('file', file.file_obj, `${frappe.session.user}-${file.name}`);
form_data.append('folder', `${$(".title").attr("data-lesson")} ${$(".title").attr("data-course")}`)
}
xhr.send(form_data);
});
};
xhr.send(form_data);
});
}
const create_lesson_work = (file, target) => {
frappe.call({
method: "lms.lms.doctype.lesson_assignment.lesson_assignment.upload_assignment",
args: {
assignment: file.file_url,
lesson: $(".title").attr("data-lesson"),
identifier: target.siblings(".attach-file").attr("id")
},
callback: (data) => {
target.siblings(".attach-file").addClass("hide");
target.siblings(".preview-work").removeClass("hide");
target.siblings(".preview-work").find("a").attr("href", file.file_url).text(file.file_name)
target.addClass("hide");
}
});
frappe.call({
method: "lms.lms.doctype.lesson_assignment.lesson_assignment.upload_assignment",
args: {
assignment: file.file_url,
lesson: $(".title").attr("data-lesson"),
identifier: target.siblings(".attach-file").attr("id")
},
callback: (data) => {
target.siblings(".attach-file").addClass("hide");
target.siblings(".preview-work").removeClass("hide");
target.siblings(".preview-work").find("a").attr("href", file.file_url).text(file.file_name)
target.addClass("hide");
}
});
};
const return_as_dataurl = (files) => {
let promises = files.map(file =>
frappe.dom.file_to_base64(file.file_obj)
.then(dataurl => {
file.dataurl = dataurl;
this.on_success && this.on_success(file);
})
);
return Promise.all(promises);
}
let promises = files.map(file =>
frappe.dom.file_to_base64(file.file_obj)
.then(dataurl => {
file.dataurl = dataurl;
this.on_success && this.on_success(file);
})
);
return Promise.all(promises);
};
const add_files = (files) => {
files = Array.from(files).map(file => {
let is_image = file.type.startsWith('image');
return {
file_obj: file,
cropper_file: file,
crop_box_data: null,
optimize: this.attach_doc_image ? true : false,
name: file.name,
doc: null,
progress: 0,
total: 0,
failed: false,
request_succeeded: false,
error_message: null,
uploading: false,
private: !is_image
}
});
return files
files = Array.from(files).map(file => {
let is_image = file.type.startsWith('image');
return {
file_obj: file,
cropper_file: file,
crop_box_data: null,
optimize: this.attach_doc_image ? true : false,
name: file.name,
doc: null,
progress: 0,
total: 0,
failed: false,
request_succeeded: false,
error_message: null,
uploading: false,
private: !is_image
}
});
return files
};
const clear_work = (e) => {
const target = $(e.currentTarget);
const parent = target.closest(".preview-work");
parent.addClass("hide");
parent.siblings(".attach-file").removeClass("hide").val(null);
parent.siblings(".submit-work").removeClass("hide");
const target = $(e.currentTarget);
const parent = target.closest(".preview-work");
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)
return;
frappe.call({
method: "lms.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: "lms.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"]);
}
}
}
}
});
}
});
};
const initialize_timer = () => {
this.time_left = $(".timer").data("time");
calculate_and_display_time(100, this.time_left);
@@ -423,6 +462,7 @@ const initialize_timer = () => {
}, 100);
};
const calculate_and_display_time = (percent_time) => {
$(".timer .progress-bar").attr("aria-valuenow", percent_time);
$(".timer .progress-bar").attr("aria-valuemax", percent_time);
@@ -430,3 +470,50 @@ const calculate_and_display_time = (percent_time) => {
let progress_color = percent_time < 20 ? "red" : "var(--primary-color)";
$(".timer .progress-bar").css("background-color", progress_color);
};
const save_lesson = (e) => {
let lesson = $("#title").data("lesson");
frappe.call({
method: "lms.lms.doctype.lms_course.lms_course.save_lesson",
args: {
"title": $("#title").text(),
"body": $("#body").text(),
"chapter": $("#title").data("chapter"),
"preview": $("#preview").prop("checked") ? 1 : 0,
"idx": $("#title").data("index"),
"lesson": lesson ? lesson : ""
},
callback: (data) => {
window.location.reload();
}
});
};
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 build_attachment_table = (file_doc) => {
return $(`
<tr class="attachment-row">
<td>${file_doc.file_name}</td>
<td class=""><a class="button is-secondary button-links copy-link" data-link="![](${file_doc.file_url})"
data-name="${file_doc.file_name}" > ${__("Copy Link")} </a></td>
</tr>
`);
};

View File

@@ -10,28 +10,30 @@ def get_context(context):
chapter_index = frappe.form_dict.get("chapter")
lesson_index = frappe.form_dict.get("lesson")
lesson_number = f"{chapter_index}.{lesson_index}"
print(chapter_index, lesson_index, type(chapter_index), type(lesson_index))
if (not chapter_index and chapter_index != 0) or (not lesson_index and lesson_index != 0):
context.lesson_index = lesson_index
context.chapter = frappe.db.get_value("Chapter Reference", {
"idx": chapter_index,
"parent": context.course.name
}, "chapter")
if not chapter_index or not lesson_index:
if context.batch:
index_ = get_lesson_index(context.course, context.batch, frappe.session.user) or "1.1"
else:
index_ = "1.1"
redirect_to_lesson(context.course, index_)
if chapter_index == 0 and lesson_index == 0:
context.lesson = frappe._dict()
context.lesson.edit_mode = True
else:
set_lesson_context(context, lesson_number)
def set_lesson_context(context, lesson_number):
context.lesson = get_current_lesson_details(lesson_number, context)
if not context.lesson:
context.lessom = frappe._dict()
if frappe.form_dict.get("edit"):
context.lesson.edit_mode = True
neighbours = get_neighbours(lesson_number, context.lessons)
context.next_url = get_url(neighbours["next"], context.course)
context.prev_url = get_url(neighbours["prev"], context.course)
meta_info = context.lesson.title + " - " + context.course.title
meta_info = context.lesson.title + " - " + context.course.title if context.lesson.title else "New Lesson"
context.metatags = {
"title": meta_info,
"keywords": meta_info,
@@ -42,7 +44,7 @@ def set_lesson_context(context, lesson_number):
context.page_context = {
"course": context.course.name,
"batch": context.get("batch") and context.batch.name,
"lesson": context.lesson.name,
"lesson": context.lesson.name if context.lesson.name else "New Lesson",
"is_member": context.membership is not None
}

View File

@@ -72,8 +72,9 @@
{% endif %}
</div>
<div {% if course.edit_mode %} data-placeholder="{{ _('Title') }}" contenteditable="true" {% endif %} id="title"
class="course-card-wide-title" data-course="{{ course.name | urlencode }}">{% if course.title %} {{ course.title }} {% endif %}</div>
<div {% if course.edit_mode %} data-placeholder="{{ _('Title') }}" contenteditable="true" {% endif %}
id="title" {% if course.name %} data-course="{{ course.name | urlencode }}" {% endif %}
class="course-card-wide-title">{% 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>

View File

@@ -1,7 +1,5 @@
frappe.ready(() => {
setup_vue_and_file_size();
hide_wrapped_mentor_cards();
$("#cancel-request").click((e) => {
@@ -75,27 +73,6 @@ frappe.ready(() => {
});
const setup_vue_and_file_size = () => {
frappe.require("/assets/frappe/node_modules/vue/dist/vue.js", () => {
Vue.prototype.__ = window.__;
Vue.prototype.frappe = window.frappe;
});
frappe.provide("frappe.form.formatters");
frappe.form.formatters.FileSize = file_size;
};
const file_size = (value) => {
if(value > 1048576) {
value = flt(flt(value) / 1048576, 1) + "M";
} else if (value > 1024) {
value = flt(flt(value) / 1024, 1) + "K";
}
return value;
};
const hide_wrapped_mentor_cards = () => {
let offset_top_prev;
@@ -350,7 +327,6 @@ const add_tag = (e) => {
const save_course = (e) => {
let course = $("#title").data("course");
frappe.call({
method: "lms.lms.doctype.lms_course.lms_course.save_course",
args: {
@@ -360,7 +336,7 @@ const save_course = (e) => {
"video_link": $("#video-link").text(),
"image": $("#image").attr("href"),
"description": $("#description").text(),
"course": course ? course : ""
"course": $("#title").data("course")
},
callback: (data) => {
window.location.href = `/courses/${data.message}?edit=1`;