Downloaded Instacart's templates and deleted folders from churned customers.
This commit is contained in:
@ -1,125 +0,0 @@
|
||||
<style>
|
||||
.course-carousel-container .catalog-card:not(:first-child) {
|
||||
display: none;
|
||||
}
|
||||
.course-carousel-container .catalog-card {
|
||||
visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
{% assign filterInProgress = filterInProgress | default: false %}
|
||||
{% assign sortByPriority = sortByPriority | default: false %}
|
||||
{% assign displayedCount = 0 %}
|
||||
|
||||
{% if items.any? %}
|
||||
<div class="course-carousel-container">
|
||||
{% for course in items %}
|
||||
{% if filterInProgress %}
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
{% include "cards_course" with course %}
|
||||
{% assign displayedCount = displayedCount | plus: 1 %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% include "cards_course" with course
|
||||
, hiddenByDefault: false %}
|
||||
{% assign displayedCount = displayedCount | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if displayedCount == 0 %}
|
||||
{% include "courses_zero_state"
|
||||
, message: 'Nothing found! Start some lessons to fill this gap.'
|
||||
, messageEs: '¡Nada encontrado! Comienza algunas lecciones para llenar este vacío.' %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state"
|
||||
, message: message %}
|
||||
{% endif %}
|
||||
|
||||
<script>
|
||||
const coursesCarousel = $('.course-carousel-container');
|
||||
|
||||
$(document).ready(function(){
|
||||
const maxItems = 5;
|
||||
const cards = coursesCarousel.find('.catalog-card').get();
|
||||
|
||||
{% if sortByPriority %}
|
||||
|
||||
cards.sort(function(a, b) {
|
||||
const aPriority = extractPriority(a);
|
||||
const bPriority = extractPriority(b);
|
||||
return bPriority - aPriority;
|
||||
});
|
||||
|
||||
// Re-append sorted cards to container
|
||||
$.each(cards, function(index, card) {
|
||||
coursesCarousel.append(card);
|
||||
});
|
||||
|
||||
{% endif %}
|
||||
|
||||
for(let i = 5; i < cards.length; i++) {
|
||||
cards[i].remove();
|
||||
}
|
||||
|
||||
let initialSlide = 0;
|
||||
|
||||
// Go to 2nd slide if width is higher than breakpoint
|
||||
if ($(window).width() > {{breakpoint}}) {
|
||||
initialSlide = 1;
|
||||
}
|
||||
|
||||
coursesCarousel.slick({
|
||||
centerMode: true,
|
||||
dots: false,
|
||||
infinite: false,
|
||||
speed: 300,
|
||||
slidesToShow: 2,
|
||||
slidesToScroll: 1,
|
||||
initialSlide: initialSlide,
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: {{breakpoint}},
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
for (let i = 0; i < 5; i++) {
|
||||
cards[i].classList.add('card-visible');
|
||||
}
|
||||
|
||||
// Redirect to slide 1 if user slides to slide 0 above breakpoint
|
||||
setInterval(function() {
|
||||
if ($(window).width() > {{breakpoint}}) {
|
||||
const currentSlide = coursesCarousel.slick('slickCurrentSlide');
|
||||
if (currentSlide === 0) {
|
||||
console.log('redirecting from slide 0 to slide 1');
|
||||
coursesCarousel.slick('slickGoTo', 1);
|
||||
}
|
||||
}
|
||||
}, 100);
|
||||
});
|
||||
|
||||
function extractPriority(element){
|
||||
const priority = $(element).attr('priority');
|
||||
return priority ? Number(priority) : 0;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@media (max-width: {{breakpoint}}px) {
|
||||
.course-carousel-container .catalog-card {
|
||||
margin: 0 10px 32px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user