Tons of Solutions Engineering work done today for the rest of the CS team! Headway, Howard Hanna, Engels, Brighton, etc. Also completed Datasnippers auth flow and worked on Anthology's script. Cloned Anthology's courses (900..) and will clone Full Story on Monday.

This commit is contained in:
Norm Rasmussen
2024-01-05 17:07:59 -05:00
parent ce261975ca
commit a5fe4bd2c8
3157 changed files with 554269 additions and 16 deletions

View File

@ -0,0 +1,198 @@
{% include "header" %}
{% include "course_version_outdated_alert", courses: courses.enrolled %}
{% include "sub_navigation" %}
<main class="np-main np-courses np-subpage-container np-max-width">
<div class="row row-with-thumbnails">
<div class="col-xs-12">
<div class="filters-container courses-filters">
<div class="filters-heading">APPLY FILTERS<i class="fa fa-chevron-down"></i>
</div>
<div class="filters-content">
<div class="filter-column status-column">
<div class="filter-column-title">STATUS</div>
<div class="filters-list">
<div class="filter-item status-filter">
<input
type="checkbox"
name="completed"
value="completed">
<label for="completed">Completed
<span></span>
</label>
</div>
<div class="filter-item status-filter">
<input
type="checkbox"
name="in-progress"
value="in-progress">
<label for="in-progress">In Progress
<span></span>
</label>
</div>
<div class="filter-item status-filter">
<input
type="checkbox"
name="in-progress"
value="not-started">
<label for="not-started">Not Started
<span></span>
</label>
</div>
</div>
</div>
<div class="filter-column categories-column">
<div class="filter-column-title">CATEGORY</div>
<div class="filters-list">
{% for category in categories.enrolled %}
<script>
console.log("{{category.name}}")
</script>
<div class="filter-item category-filter">
<input
type="checkbox"
name="{{category.name}}"
value="{{category.name}}">
<label for="{{category.name}}">{{ category.name }}
<span></span>
</label>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
</div>
</div>
{% include "courses_index", class: "col-xs-12 col-sm-6 col-md-4 col-lg-3 course-column" %}
</main>
{% include "footer" %}
<script>
window.onload = () => {
let url = new URL(window.location.href);
let params = new URLSearchParams(url.search);
if (params.has('category')) {
let allParams = params.getAll('category')
allParams.forEach((param) => {
document.querySelector(`.filter-item input[value='${param}']`).click()
})
}
addCountToFilters()
addActiveNavigationClass()
}
$("input[type='checkbox']").change(function(e) {
filterCourses()
})
$("document").ready(function() {
document
.querySelector(".filters-heading")
.addEventListener("click", function() {
this.classList.toggle("active");
var panel = this.nextElementSibling;
if (panel.style.maxHeight) {
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + 32 + "px";
}
})
document
.querySelector(".filters-heading")
.click()
})
function filterCourses() {
// hide all courses
$(".course-column").hide()
// get all checked filters
let selectedStatusFilters = []
let selectedCategoryFilters = []
$(".status-column input[type='checkbox']:checked").each((index, filter) => {
selectedStatusFilters.push(filter.value)
})
$(".categories-column input[type='checkbox']:checked").each((index, filter) => {
selectedCategoryFilters.push(filter.value)
})
// loop over courses and get filters
$(".course-column").each((index, course) => {
const courseStatus = $(course).data("progress")
const courseCategory = $(course).data("category")
if (selectedStatusFilters.length && selectedCategoryFilters.length) {
if ($.inArray(courseCategory, selectedCategoryFilters) !== -1 && $.inArray(courseStatus, selectedStatusFilters) !== -1) {
$(course).show()
}
} else if (! selectedStatusFilters.length && selectedCategoryFilters.length) {
if ($.inArray(courseCategory, selectedCategoryFilters) !== -1) {
$(course).show()
}
} else if (selectedStatusFilters.length && ! selectedCategoryFilters.length) {
if ($.inArray(courseStatus, selectedStatusFilters) !== -1) {
$(course).show()
}
} else {
$(course).show()
}
})
}
function addCountToFilters() {
const allFiltersFromCourses = []
$(".course-column").each((index, course) => {
if ($(course).attr("data-progress")) {
allFiltersFromCourses.push($(course).attr("data-progress"))
}
if ($(course).attr("data-category")) {
allFiltersFromCourses.push($(course).attr("data-category"))
}
})
$(".filter-item").each((index, filter) => {
const filterValue = $(filter).find("input").val()
const filterCount = getFilterCount(filterValue, allFiltersFromCourses)
if ($(filter).hasClass("category-filter")) {
if (filterCount == 0) {
$(filter).hide()
} else {
$(filter).find("label > span").text(`(${filterCount})`)
}
} else {
$(filter).find("label > span").text(`(${filterCount})`)
}
})
}
const getFilterCount = (value, array) => {
let count = 0;
array.forEach(filter => {
if (filter == value) {
count++;
}
});
return count
}
function addActiveNavigationClass() {
$('a[href="/app/courses"]').addClass("np-sub-navigation-content-item-active").removeClass("np-sub-navigation-content-item-inactive")
}
</script>