Browse

Search and explore your courses.

const setAuthors = () => { var all_authors = JSON.parse(localStorage.getItem("all_authors")); if (all_authors && all_authors.length > 0) { var authorsList = document.getElementById("authors"); var radioHtml = '<label class="active_filter_item" onclick="setAuthors();setVideos();"><input type="radio" name="filter" value="" checked /><div class="center_content"><div style="width: 0;" class="user"></div>All Authors</div></label>'; all_authors.forEach(function (author, index) { radioHtml += '<label onclick="applyFilterInput(' + author.id + ')" ><input type="radio" name="filter" value="' + author.id + '"/><div class="center_content"><div class="user" style="background-image: url(\'' + author.avatar_url + "');\"></div>" + author.title + "</div></label>"; }); authorsList.innerHTML = radioHtml; } }; const setVideos = () => { var all_videos = JSON.parse(localStorage.getItem("all_videos")); if (all_videos && all_videos.length > 0) { var videosList = document.getElementById("all_videos_content"); var radioHtml = ""; all_videos.forEach(function (video, index) { radioHtml += '<div class="content_media"><div data-filterable="' + video.author_id + '" class="banner-container-image swiper-slide content_media_video" style="background-image: url(' + video.main_poster + ');"></div><a data-v-0bf20b93="" href="' + video.url + '" class="card-title">' + video.title + "</a></div>"; }); videosList.innerHTML = radioHtml; } }; const el_filters = document.querySelectorAll('[name="year"], [name="type"]'), el_filterable = document.querySelectorAll("[data-filterable]"); const applyFilter = () => { // Filter checked inputs const el_checked = [...el_filters].filter((el) => el.checked && el.value); // Collect checked inputs values to array const filters = [...el_checked].map((el) => el.value); // Get elements to filter const el_filtered = [...el_filterable].filter((el) => { const props = el.getAttribute("data-filterable").trim().split(/\s+/); return filters.every((fi) => props.includes(fi)); }); // Hide all el_filterable.forEach((el) => el.classList.add("is-hidden")); // Show filtered el_filtered.forEach((el) => el.classList.remove("is-hidden")); }; setAuthors(); setVideos(); // Assign event listener el_filters.forEach((el) => el.addEventListener("change", applyFilter)); // Init applyFilter(); const searchVideos = (e) => { setAuthors(); if (e.value === "") { setVideos(); } else { var all_videos = JSON.parse(localStorage.getItem("all_videos")); if (all_videos && all_videos.length > 0) { var videosList = document.getElementById("all_videos_content"); var radioHtml = ""; all_videos .filter((x) => x.title.toLowerCase().includes(e.value.toLowerCase())) .forEach(function (video, index) { radioHtml += '<div class="content_media"><div data-filterable="' + video.author_id + '" class="banner-container-image swiper-slide content_media_video" style="background-image: url(' + video.main_poster + ');"></div><a data-v-0bf20b93="" href="' + video.url + '" class="card-title">' + video.title + "</a></div>"; }); videosList.innerHTML = radioHtml; } } }; const applyFilterInput = (_id) => { var all_authors = JSON.parse(localStorage.getItem("all_authors")); if (all_authors && all_authors.length > 0) { var authorsList = document.getElementById("authors"); var radioHtml = '<label onclick="setAuthors();setVideos();"><input type="radio" name="filter" value="" checked /><div class="center_content"><div style="width: 0;" class="user"></div>All Authors</div></label>'; all_authors.forEach(function (author, index) { radioHtml += '<label class="' + (_id === author.id ? "active_filter_item" : "") + '" onclick="applyFilterInput(' + author.id + ')" ><input type="radio" name="filter" value="' + author.id + '"/><div class="center_content"><div class="user" style="background-image: url(\'' + author.avatar_url + "');\"></div>" + author.title + "</div></label>"; }); authorsList.innerHTML = radioHtml; } var all_videos = JSON.parse(localStorage.getItem("all_videos")); if (all_videos && all_videos.length > 0) { var videosList = document.getElementById("all_videos_content"); var radioHtml = ""; all_videos .filter((x) => x.author_id === _id) .forEach(function (video, index) { radioHtml += '<div class="content_media"><div data-filterable="' + video.author_id + '" class="banner-container-image swiper-slide content_media_video" style="background-image: url(' + video.main_poster + ');"></div><a data-v-0bf20b93="" href="' + video.url + '" class="card-title">' + video.title + "</a></div>"; }); videosList.innerHTML = radioHtml; } document.getElementById("myInput").value = ""; };