norm/Gainsight
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Backedup supplier's templates. GSU tests.

Browse Source
This commit is contained in:
Norm Rasmussen
2024-10-25 16:17:46 -04:00
parent 3626ead591
commit d93059e8c0
25 changed files with 803 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
Custom_Templates/customer_templates/Walmart Supplier Prod/_getting-started-carousel.html.liquid
View File

@ -1,10 +1,29 @@
<div class="carousel-wrapper">
<div class="carousel-heading">Getting Started</div>
<div class="carousel-filter-wrapper">
<div class="filter-container">
<div class="filter" id="filterToggle">Filter</div>
</div>
<div class="filter-content" id="filterContent">
<div class="filter-option">
<input class="filter-checkbox" type="checkbox" id="gs-not-started">
<label class="filter-name">Not Started</label>
</div>
<div class="filter-option">
<input class="filter-checkbox" type="checkbox" id="gs-in-progress">
<label class="filter-name">In Progress</label>
</div>
<div class="filter-option">
<input class="filter-checkbox" type="checkbox" id="gs-completed">
<label class="filter-name">Completed</label>
</div>
</div>
</div>
<div class="getting-started-carousel">
{% for course in courses.in_catalog %}
{% for category in course.categories %}
{% if category.name == 'Getting Started' %}
<div class="carousel-cards-container">
<div class="carousel-cards-container gettin-started-courses" progress="{% if course.progress == 100 %}completed{% elsif course.progress == 0 %}not-started{% else %}in-progress{% endif %}">
{% include 'cards_course' %}
</div>
{% endif %}
@ -20,8 +39,7 @@
</style>
<script>
$(document).ready(function(){
$(document).ready(function() {
$(".getting-started-carousel").slick({
slidesToShow: 3,
cssEase: 'linear',
@ -45,6 +63,31 @@ $(document).ready(function(){
}
}
]
});
});
document.getElementById("filterToggle").addEventListener("click", function() {
const filterWrapper = document.querySelector('.carousel-filter-wrapper');
filterWrapper.classList.toggle("filter-active");
});
function filterCards() {
const selectedFilters = Array.from(document.querySelectorAll('.filter-checkbox:checked')).map(checkbox => checkbox.id.replace('gs-', ''));
const cards = document.querySelectorAll('.gettin-started-courses');
$(".getting-started-carousel").slick('slickUnfilter');
if (selectedFilters.length === 0) {
$(".getting-started-carousel").slick('slickUnfilter');
} else {
$(".getting-started-carousel").slick('slickFilter', function(index, element) {
const cardProgress = element.getAttribute('progress');
return selectedFilters.includes(cardProgress);
});
}
}
document.querySelectorAll('#filterContent .filter-checkbox').forEach(checkbox => {
checkbox.addEventListener('change', filterCards);
});
});
</script>