eduvia/lms
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: ui for course creation

Browse Source
This commit is contained in:
Jannat Patel
2022-08-10 19:45:58 +05:30
parent a4534d8f3e
commit 301664ce93
10 changed files with 144 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lms/lms/utils.py
View File

@@ -387,3 +387,7 @@ def first_lesson_exists(course):
return False
return True
def redirect_to_courses_list():
frappe.local.flags.redirect_location = "/courses"
raise frappe.Redirect

12
lms/lms/widgets/CourseOutline.html
View File

@@ -13,7 +13,7 @@
{% if get_chapters(course.name) | length %}
{% for chapter in get_chapters(course.name) %}
<div class="chapter-parent">
<div class="chapter-parent {% if course.edit_mode %} chapter-edit {% endif %} ">
<div class="chapter-title" {% if not course.edit_mode %} data-toggle="collapse" aria-expanded="false"
data-target="#{{ get_slugified_chapter_title(chapter.title) }}" {% endif %} >
{% if not course.edit_mode %}
@@ -34,7 +34,7 @@
{% endif %}
{% if course.edit_mode %}
<div class="mt-2 mb-8">
<div class="mt-2">
<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"
@@ -43,8 +43,14 @@
{% endif %}
{% set is_instructor = is_instructor(course.name) %}
{% if lessons | length %}
<div class="lessons">
{% if course.edit_mode %}
<b class="course-meta"> {{ _("Lessons") }}: </b>
{% endif %}
{% 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 %}">
@@ -93,6 +99,8 @@
{% endfor %}
</div>
{% endif %}
</div>
</div>
{% endfor %}

76
lms/public/css/style.css
View File

@@ -60,6 +60,7 @@ input[type=checkbox] {
font-weight: 600;
color: var(--gray-900);
width: fit-content;
box-shadow: var(--shadow-sm);
}
.dark-pills {
@@ -378,7 +379,6 @@ input[type=checkbox] {
.chapter-title {
cursor: pointer;
border-radius: var(--border-radius-lg);
padding: 0.5rem 0;
color: var(--gray-900);
display: flex;
align-items: center;
@@ -409,11 +409,10 @@ input[type=checkbox] {
}
.lesson-links {
display: flex;
align-items: center;
padding: 0.5rem;
color: var(--gray-900);
font-size: var(--text-base);
display: flex;
align-items: center;
padding: 0.5rem;
color: var(--gray-900);
}
.lesson-links:hover {
@@ -424,7 +423,7 @@ input[type=checkbox] {
}
.lessons {
margin-left: 2rem;
margin-left: 1.5rem;
}
.member-card {
@@ -439,9 +438,9 @@ input[type=checkbox] {
}
.break {
flex-basis: 100%;
flex-grow: 1;
margin: .5rem 0;
flex-basis: 100%;
flex-grow: 1;
margin: 0.5rem 0;
}
.course-home-headings {
@@ -594,7 +593,8 @@ input[type=checkbox] {
}
.course-content-parent .course-home-headings {
margin: 0px 0px 1rem;
margin: 0 0 1rem;
width: 100%;
}
.lesson-pagination {
@@ -1149,8 +1149,8 @@ pre {
}
.course-head-container {
color: var(--gray-900);
background-color: var(--gray-200);
color: var(--gray-900);
background-color: var(--gray-50);
}
.seperator {
@@ -1419,9 +1419,7 @@ pre {
}
.attachments-parent {
float: right;
font-size: var(--text-sm);
margin-bottom: 1rem;
color: var(--text-color);
}
li {
@@ -1504,26 +1502,58 @@ li {
}
[contenteditable] {
border: 1px solid var(--gray-400);
padding: 0.5rem;
border-radius: var(--border-radius);
outline: none;
white-space: pre-wrap;
background-color: var(--bg-light-gray);
border-radius: var(--border-radius);
border: 1px dashed var(--gray-400);
padding: 0.5rem 0.75rem;
}
[contenteditable]:empty:before{
[contenteditable]:empty:before {
content: attr(data-placeholder);
color: var(--gray-600);
}
.course-image-attachment {
margin-top: 1rem;
border: 1px solid var(--gray-400);
background-color: var(--bg-light-gray);
border-radius: var(--border-radius);
padding: 0.25rem 0.5rem;
border: 1px dashed var(--gray-400);
padding: 0.5rem 0.75rem;
width: fit-content;
}
.btn-delete-tag {
cursor: pointer;
}
.chapter-edit {
border: 1px solid var(--dark-border-color);
border-radius: var(--border-radius);
padding: 1rem;
margin-bottom: 1rem;
}
.chapter-edit .lessons {
margin-left: 0;
margin-top: 2rem;
}
.chapter-parent {
margin-bottom: 1rem;
}
.chapter-edit .chapter-title {
padding: 0.5rem 0;
}
.course-card-pills[contenteditable] {
box-shadow: none;
}
.preview {
display: flex;
align-items: center;
font-size: var(--text-md);
margin-top: 1rem;
}

35
lms/public/js/common_functions.js
View File

@@ -1,5 +1,7 @@
frappe.ready(() => {
frappe.provide("frappe.ui.form");
setup_vue_and_file_size();
$(".join-batch").click((e) => {
@@ -18,6 +20,10 @@ frappe.ready(() => {
save_chapter(e);
});
if ($("#body").length) {
make_editor();
}
});
@@ -104,11 +110,11 @@ const notify_user = (e) => {
const add_chapter = (e) => {
let next_index = $("[data-index]").last().data("index");
$(`<div class="chapter-parent">
$(`<div class="chapter-parent chapter-edit">
<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"
class="chapter-description"></div>
<button class="btn btn-sm btn-secondary d-block btn-save-chapter"
data-index="${next_index}"> ${__('Save')} </button>
</div>`).insertAfter(`.chapter-parent:last`);
@@ -130,7 +136,7 @@ const save_chapter = (e) => {
args: {
"course": $("#title").data("course"),
"title": parent.find(".chapter-title-main").text(),
"chapter_description": parent.find("#chapter-description").text(),
"chapter_description": parent.find(".chapter-description").text(),
"idx": target.data("index"),
"chapter": target.data("chapter") ? target.data("chapter") : ""
},
@@ -139,3 +145,24 @@ const save_chapter = (e) => {
}
});
};
const make_editor = () => {
this.code_field_group = new frappe.ui.FieldGroup({
fields: [
{
fieldname: "code_md",
fieldtype: "Code",
options: "Markdown",
wrap: true,
max_lines: Infinity,
min_lines: 20,
default: "Jannat Patel",
depends_on: 'eval:doc.type=="Markdown"',
}
],
body: $("#body").get(0),
});
this.code_field_group.make();
$("#body .form-section:last").removeClass("empty-section");
}

67
lms/www/batch/learn.html
View File

@@ -113,36 +113,7 @@
{% 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>
{{ EditLesson(lesson) }}
{% else %}
{{ render_html(lesson.body) }}
{% endif %}
@@ -203,6 +174,42 @@
</div>
{% endmacro %}
{% macro EditLesson(lesson) %}
<div contenteditable="true" data-placeholder="{{ _('Enter the lesson content.') }}"
> {% if lesson.body %} {{ lesson.body }} {% endif %} </div>
<div id="body"></div>
<label class="preview">
<input {% if lesson.include_in_preview %} checked {% endif %}
type="checkbox" id="preview"> {{ _("Show preview of this lesson") }}
</label>
<div class="mt-8">
<button class="btn btn-primary btn-md btn-lesson pull-right"> {{ _("Save") }} </button>
<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="btn btn-md btn-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>
</div>
{% endmacro %}
{% macro Discussions() %}
{% set topics_count = frappe.db.count("Discussion Topic",
{"reference_doctype": "Course Lesson", "reference_docname": lesson.name}) %}

3
lms/www/batch/learn.js
View File

@@ -1,6 +1,7 @@
frappe.ready(() => {
localStorage.removeItem($("#quiz-title").text());
fetch_assignments();
save_current_lesson();
@@ -478,7 +479,7 @@ const save_lesson = (e) => {
method: "lms.lms.doctype.lms_course.lms_course.save_lesson",
args: {
"title": $("#title").text(),
"body": $("#body").text(),
"body": $("#body").find("br").replaceWith("\n\n").end().text(),
"chapter": $("#title").data("chapter"),
"preview": $("#preview").prop("checked") ? 1 : 0,
"idx": $("#title").data("index"),

5
lms/www/batch/learn.py
View File

@@ -1,7 +1,6 @@
from re import I
import frappe
from lms.www.utils import get_common_context, redirect_to_lesson
from lms.lms.utils import get_lesson_url
from lms.lms.utils import get_lesson_url, is_instructor, redirect_to_courses_list
from frappe.utils import cstr, flt
def get_context(context):
@@ -28,6 +27,8 @@ def get_context(context):
context.lessom = frappe._dict()
if frappe.form_dict.get("edit"):
if not is_instructor(context.course.name):
redirect_to_courses_list()
context.lesson.edit_mode = True
neighbours = get_neighbours(lesson_number, context.lessons)

3
lms/www/courses/course.html
View File

@@ -307,7 +307,8 @@ data-placeholder="Description">{% if course.description %}{{ frappe.utils.md_to_
{% macro Save(course) %}
{% if course.edit_mode %}
<div>
<button class="btn btn-primary btn-md btn-save-course my-4"> {{ _("Save") }} </button>
<button class="btn btn-primary btn-md btn-save-course my-4">
{{ _("Save Course Details") }} </button>
</div>
{% endif %}
{% endmacro %}

2
lms/www/courses/course.js
View File

@@ -322,7 +322,7 @@ const clear_image = () => {
const add_tag = (e) => {
$(`<div class="course-card-pills" contenteditable="true"
data-placeholder="${__('Tags')}"></div>`).insertBefore(`.btn-tag`);
data-placeholder="${__('Tag')}"></div>`).insertBefore(`.btn-tag`);
};

7
lms/www/courses/course.py
View File

@@ -1,6 +1,6 @@
import frappe
from lms.lms.doctype.lms_settings.lms_settings import check_profile_restriction
from lms.lms.utils import get_membership, is_instructor, is_certified, get_evaluation_details
from lms.lms.utils import get_membership, is_instructor, is_certified, get_evaluation_details, redirect_to_courses_list
def get_context(context):
context.no_cache = 1
@@ -72,8 +72,3 @@ 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