113 lines
4.1 KiB
HTML
113 lines
4.1 KiB
HTML
{% set membership = course.get_membership(frappe.session.user) %}
|
|
|
|
<div class="common-card-style course-card">
|
|
<div class="course-image {% if not course.image %}default-image{% endif %}" {% if course.image %}
|
|
style="background-image: url( {{ course.image }} );" {% endif %}>
|
|
<div class="course-tags">
|
|
{% for tag in course.get_tags() %}
|
|
<div class="course-card-pills">{{ tag }}</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% if not course.image %}
|
|
<div class="default-image-text">{{ course.title[0] }}</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="course-card-content">
|
|
|
|
<div class="course-card-meta muted-text">
|
|
{% if course.get_chapters() | length %}
|
|
<span>
|
|
{{ course.get_chapters() | length }} Chapters
|
|
</span>
|
|
{% endif %}
|
|
{% if course.get_chapters() | length and course.get_upcoming_batches() | length %}
|
|
<span class="font-weight-bold ml-3 mr-3"> . </span>
|
|
{% endif %}
|
|
{% if course.get_upcoming_batches() | length %}
|
|
<span class="">
|
|
{{ course.get_upcoming_batches() | length }} Open Batches
|
|
</span>
|
|
{% endif %}
|
|
{% set certificate = course.is_certified() %}
|
|
{% if certificate and show_progress_indicators %}
|
|
<a class="muted-text dark-links pull-right zindex" href="/courses/{{ course.name }}/{{ certificate }}">View
|
|
Certificate</a>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="course-card-title">{{ course.title }}</div>
|
|
{% if membership and show_progress_indicators %}
|
|
{% set progress = course.get_course_progress() %}
|
|
<div class="progress mb-5 zindex" title="{{ frappe.utils.rounded(progress) }}%">
|
|
<div class="progress-bar" role="progressbar" style="width: {{ progress }}%" aria-valuenow="{{ progress }}"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
{% else %}
|
|
<div class="card-divider"></div>
|
|
{% endif %}
|
|
|
|
<div class="course-card-meta-2">
|
|
<span class="zindex">
|
|
{{ widgets.Avatar(member=course.get_instructor(), avatar_class="avatar-small") }}
|
|
<a class="button-links" href="/users/{{ course.get_instructor().username}}">
|
|
<span class="course-instructor">
|
|
{{ course.get_instructor().full_name }}
|
|
</span>
|
|
</a>
|
|
</span>
|
|
<span class="course-student-count">
|
|
{% if course.get_students() | length %}
|
|
<span class="mr-4">
|
|
<img class="icon-background" src="/assets/community/icons/user.svg" />
|
|
{{ course.get_students() | length }}
|
|
</span>
|
|
{% endif %}
|
|
{% set avg_rating = course.get_average_rating() %}
|
|
{% if avg_rating %}
|
|
<span class="">
|
|
<img class="icon-background" src="/assets/community/icons/rating.svg" />
|
|
{{ avg_rating }}
|
|
</span>
|
|
{% endif %}
|
|
</span>
|
|
</div>
|
|
|
|
{% set lesson_index = course.get_lesson_index(membership.current_lesson) if membership and
|
|
membership.current_lesson
|
|
else '1.1' %}
|
|
|
|
{% set query_parameter = "?batch=" + membership.batch if membership and membership.batch else "" %}
|
|
|
|
{% if course.upcoming %}
|
|
<div class="view-course-link is-secondary border">
|
|
Upcoming Course <img class="ml-3" src="/assets/community/icons/black-arrow.svg" />
|
|
</div>
|
|
<a class="stretched-link" href="/courses/{{ course.name }}"></a>
|
|
|
|
{% elif membership %}
|
|
<div class="view-course-link is-primary">
|
|
Continue Course <img class="ml-3" src="/assets/community/icons/white-arrow.svg" />
|
|
</div>
|
|
<a class="stretched-link" href="{{ course.get_learn_url(lesson_index) }}{{ query_parameter }}"></a>
|
|
|
|
{% else %}
|
|
<div class="view-course-link is-default">
|
|
View Course <img class="ml-3" src="/assets/community/icons/black-arrow.svg" />
|
|
</div>
|
|
<a class="stretched-link" href="/courses/{{ course.name }}"></a>
|
|
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<script>
|
|
frappe.ready(() => {
|
|
$(".course-card-title").each((i, element) => {
|
|
var title = $(element).text();
|
|
var length = $(window).width() <= 375 ? 60 : 65;
|
|
var suffix = title.length > length ? "..." : "";
|
|
$(element).text(title.substring(0, length) + suffix);
|
|
})
|
|
})
|
|
</script>
|