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

fix: overlay position when related courses

Browse Source
This commit is contained in:
Jannat Patel
2022-02-22 11:15:02 +05:30
parent c3fac64280
commit 6c64181bf4
5 changed files with 64 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
school/www/courses/course.html
View File

@@ -6,13 +6,15 @@
{% endblock %}
{% block content %}
<div class="common-page-style pt-0">
{{ CourseHomeHeader(course) }}
<div class="container course-home-page">
<div class="course-body-container">
{{ Description(course) }}
{{ widgets.CourseOutline(course=course, membership=membership) }}
{{ CourseCreator(course) }}
{{ widgets.Reviews(course=course, membership=membership) }}
<div class="course-home-top-container">
{{ CourseHomeHeader(course) }}
{{ CourseHeaderOverlay(course) }}
<div class="container course-home-page">
<div class="course-body-container">
{{ Description(course) }}
{{ widgets.CourseOutline(course=course, membership=membership) }}
{{ widgets.Reviews(course=course, membership=membership) }}
</div>
</div>
</div>
{{ RelatedCourses(course) }}
@@ -26,7 +28,6 @@
<div class="container pt-10 pb-10">
{{ BreadCrumb(course) }}
{{ CourseCardWide(course) }}
{{ CourseHeaderOverlay(course) }}
</div>
</div>
@@ -125,6 +126,14 @@
You have opted to be notified for this course. You will receive an email when the course becomes available.
</div>
<div class="course-home-headings"> {{ course.title }} </div>
{% if get_lessons(course.name) | length %}
<div class="mt-3">
<img class="mr-3" src="/assets/school/icons/book.svg">
{{ get_lessons(course.name) | length }} {{ _("Lessons") }}
</div>
{% endif %}
{% if get_students(course.name) | length %}
{% set initial_members = get_initial_members(course.name) %}
<div class="overlay-student-count">
@@ -188,13 +197,6 @@
</div>
{% endif %}
<div class="overlay-heading"> {{ _("Course Include:") }} </div>
{% if get_lessons(course.name) | length %}
<div class="mt-3">
<img class="mr-3" src="/assets/school/icons/book.svg">
{{ get_lessons(course.name) | length }} {{ _("Lessons") }}
</div>
{% endif %}
</div>
</div>

30
school/www/courses/course.js
View File

@@ -41,6 +41,12 @@ frappe.ready(() => {
create_certificate(e);
});
$(document).scroll(function() {
let timer;
clearTimeout(timer);
timer = setTimeout(() => { handle_overlay_display.apply(this, arguments); }, 500);
});
})
var check_mentor_request = () => {
@@ -226,3 +232,27 @@ const create_certificate = (e) => {
}
})
};
const element_not_in_viewport = (el) => {
const rect = el.getBoundingClientRect();
return rect.bottom < 0 || rect.right < 0 || rect.left > window.innerWidth || rect.top > window.innerHeight;
}
const handle_overlay_display = () => {
const element = $(".related-courses").length && $(".related-courses")[0];
if (element && element_not_in_viewport(element)) {
$(".course-overlay-card").css({
"position": "fixed",
"top": "30%",
"bottom": "inherit"
});
}
else if (element && !element_not_in_viewport(element)) {
$(".course-overlay-card").css({
"position": "absolute",
"top": "inherit",
"bottom": "5%"
});
}
}