// ==UserScript==// @name         ZT Better Filters// @namespace    ZTBF// @version      0.2.1// @description  Ajoute une zone de filtres de recherche pour Zone-Telechargement// @author       Drigtime// @include      /http(|s):\/\/(|(|w|0|1|2|3|4|5|6|7|8|9)*w(|w|0|1|2|3|4|5|6|7|8|9)*\.)zone\-telechargement[.*]/// @icon         https://www.google.com/s2/favicons?sz=64&domain=zone-telechargement.yachts// @grant        none// ==/UserScript==(async function () {'use strict';// get the current url parametersconst urlParams = new URLSearchParams(window.location.search);if (urlParams.get("id")) {// if we are on a movie/serie page, do nothingreturn;}const mainContainer = document.querySelector("#dle-content");const categories = [];const years = [];const genres = [];// loop on each new-cat to get the categorie filter and its sub-categories filtersconst ztCategoriesContainer = document.querySelectorAll("#new-cat");for (const categorieContainer of ztCategoriesContainer) {const categorieTitle = categorieContainer.querySelector("#new-title-cat > div:nth-child(2) > a");const categorie = { title: categorieTitle.innerText, value: categorieTitle.href.split("p=")[1], subCategories: [] };const ztSubCategoriesContainer = categorieContainer.querySelectorAll("#new-subcat > ul > li > a");for (const subCategorieContainer of ztSubCategoriesContainer) {categorie.subCategories.push({ title: subCategorieContainer.innerText, value: subCategorieContainer.href.split("s=")[1] });}categories.push(categorie);}// loop on each annee de sortie to get the year filterconst ztYearsContainer = document.querySelectorAll("#am > div:nth-child(1) > div.s_left > div > div > div.container > div.leftside > div:nth-child(2) > div > div.dcont > div > table:nth-child(2) > tbody > tr > td > form > select > option");for (const yearContainer of ztYearsContainer) {years.push({ title: yearContainer.innerText, value: yearContainer.value.split("year=")[1] });}// loop on each movie/serie genres to get the genre filterconst ztGenresContainer = document.querySelectorAll("#am > div:nth-child(1) > div.s_left > div > div > div.container > div.leftside > div:nth-child(2) > div > div.dcont > div > table:nth-child(4) > tbody > tr > td > a");for (const genreContainer of ztGenresContainer) {genres.push({ title: genreContainer.innerText, value: genreContainer.href.split("genre=")[1] });}// append mainContainer with a new area for filters (before the first div)const newContainer = document.createElement("form");newContainer.id = "ztbf-container";newContainer.style = "margin-bottom:8px; margin-bottom: 8px; border: solid; padding: 0.5rem; border-radius: 0.5rem;";mainContainer.insertBefore(newContainer, mainContainer.firstChild);// create the filtersconst filtersContainer = document.createElement("div");filtersContainer.id = "ztbf-filters";filtersContainer.style = "display: grid;grid-template-columns: repeat(4, 1fr);grid-column-gap: 1rem;grid-row-gap: .5rem;";newContainer.appendChild(filtersContainer);// create the categories filter with select elementconst categoriesContainer = document.createElement("div");categoriesContainer.id = "ztbf-categories";filtersContainer.appendChild(categoriesContainer);const categoriesTitle = document.createElement("div");categoriesTitle.id = "ztbf-categories-title";categoriesTitle.style = "font-weight:bold;font-family: arial; font-size: 14px;";categoriesTitle.innerText = "Catégories";categoriesContainer.appendChild(categoriesTitle);const categoriesSelect = document.createElement("select");categoriesSelect.id = "ztbf-categories-select";categoriesSelect.name = "p";categoriesSelect.style = "width:100%;";categoriesContainer.appendChild(categoriesSelect);const categoriesSelectOption = document.createElement("option");categoriesSelectOption.value = "";categoriesSelectOption.innerText = "Toutes les catégories";categoriesSelect.appendChild(categoriesSelectOption);for (const categorie of categories) {const categorieSelectOption = document.createElement("option");categorieSelectOption.value = categorie.value;categorieSelectOption.innerText = categorie.title;categoriesSelect.appendChild(categorieSelectOption);}// create the sub categorie filter with select element, change the options based on the selected categorieconst subCategoriesContainer = document.createElement("div");subCategoriesContainer.id = "ztbf-sub-categories";filtersContainer.appendChild(subCategoriesContainer);const subCategoriesTitle = document.createElement("div");subCategoriesTitle.id = "ztbf-sub-categories-title";subCategoriesTitle.style = "font-weight:bold;font-family: arial; font-size: 14px;";subCategoriesTitle.innerText = "Sous-Catégories";subCategoriesContainer.appendChild(subCategoriesTitle);const subCategoriesSelect = document.createElement("select");subCategoriesSelect.id = "ztbf-sub-categories-select";subCategoriesSelect.name = "s";subCategoriesSelect.style = "width:100%;";subCategoriesContainer.appendChild(subCategoriesSelect);const subCategoriesSelectOption = document.createElement("option");subCategoriesSelectOption.value = "";subCategoriesSelectOption.innerText = "Toutes les sous-catégories";subCategoriesSelect.appendChild(subCategoriesSelectOption);// on categoriesSelect change, change the subCategoriesSelect optionscategoriesSelect.addEventListener("change", () => {const selectedCategorie = categories.find(categorie => categorie.value === categoriesSelect.value);subCategoriesSelect.innerHTML = "";subCategoriesSelect.appendChild(subCategoriesSelectOption);if (selectedCategorie) {if (selectedCategorie.subCategories.length > 0) {subCategoriesContainer.style.display = "block";for (const subCategorie of selectedCategorie.subCategories) {const subCategorieSelectOption = document.createElement("option");subCategorieSelectOption.value = subCategorie.value;subCategorieSelectOption.innerText = subCategorie.title;subCategoriesSelect.appendChild(subCategorieSelectOption);}} else {subCategoriesContainer.style.display = "none";}}});// create the year filter with select elementconst yearContainer = document.createElement("div");yearContainer.id = "ztbf-year";filtersContainer.appendChild(yearContainer);const yearTitle = document.createElement("div");yearTitle.id = "ztbf-year-title";yearTitle.style = "font-weight:bold;font-family: arial; font-size: 14px;";yearTitle.innerText = "Année de sortie";yearContainer.appendChild(yearTitle);const yearSelect = document.createElement("select");yearSelect.id = "ztbf-year-select";yearSelect.name = "year";yearSelect.style = "width:100%;";yearContainer.appendChild(yearSelect);const yearSelectOption = document.createElement("option");yearSelectOption.value = "";yearSelectOption.innerText = "Toutes les années";yearSelect.appendChild(yearSelectOption);for (const year of years) {const yearSelectOption = document.createElement("option");yearSelectOption.value = year.value;yearSelectOption.innerText = year.title;yearSelect.appendChild(yearSelectOption);}// create the genre filter with select element, change the options based on the selected categorie, only appear if movie/serie categorie is selectedconst genreContainer = document.createElement("div");genreContainer.id = "ztbf-genre";filtersContainer.appendChild(genreContainer);const genreTitle = document.createElement("div");genreTitle.id = "ztbf-genre-title";genreTitle.style = "font-weight:bold;font-family: arial; font-size: 14px;";genreTitle.innerText = "Genre";genreContainer.appendChild(genreTitle);const genreSelect = document.createElement("select");genreSelect.id = "ztbf-genre-select";genreSelect.name = "genre";genreSelect.style = "width:100%;";genreContainer.appendChild(genreSelect);const genreSelectOption = document.createElement("option");genreSelectOption.value = "";genreSelectOption.innerText = "Tous les genres";genreSelect.appendChild(genreSelectOption);for (const genre of genres) {const genreSelectOption = document.createElement("option");genreSelectOption.value = genre.value;genreSelectOption.innerText = genre.title;genreSelect.appendChild(genreSelectOption);}// on categoriesSelect change, change the genreSelect optionscategoriesSelect.addEventListener("change", () => {const selectedCategorie = categories.find(categorie => categorie.value === categoriesSelect.value);if (selectedCategorie && (selectedCategorie.value === "films" || selectedCategorie.value === "series")) {genreContainer.style.display = "block";yearContainer.style.display = "block";} else {genreContainer.style.display = "none";yearContainer.style.display = "none";}});// create the search filterconst searchContainer = document.createElement("div");searchContainer.id = "ztbf-search";searchContainer.style = "grid-column: 1 / span 4;";filtersContainer.appendChild(searchContainer);const searchTitle = document.createElement("div");searchTitle.id = "ztbf-search-title";searchTitle.style = "font-weight:bold;font-family: arial; font-size: 14px;";searchTitle.innerText = "Recherche";searchContainer.appendChild(searchTitle);const searchInput = document.createElement("input");searchInput.id = "ztbf-search-input";searchInput.name = "search";searchInput.style = "width:100%;";searchInput.placeholder = "Recherche";searchContainer.appendChild(searchInput);const formButtonContainer = document.createElement("div");formButtonContainer.id = "ztbf-form-button-container";formButtonContainer.style = "display: flex; justify-content: center; gap: .5rem; margin-top: .5rem;";newContainer.appendChild(formButtonContainer);const searchButton = document.createElement("button");searchButton.id = "ztbf-search-button";searchButton.innerText = "Rechercher";formButtonContainer.appendChild(searchButton);// create the reset filterconst resetContainer = document.createElement("div");resetContainer.id = "ztbf-reset";formButtonContainer.appendChild(resetContainer);const resetButton = document.createElement("button");resetButton.id = "ztbf-reset-button";resetButton.innerText = "Réinitialiser";resetContainer.appendChild(resetButton);// on searchButton click, submit the formsearchButton.addEventListener("click", () => {filtersContainer.submit();});// on resetButton click, reset the filtersresetButton.addEventListener("click", () => {categoriesSelect.value = "";categoriesSelect.dispatchEvent(new Event("change"));yearSelect.value = "";genreSelect.value = "";searchInput.value = "";filtersContainer.submit();});// set the current url parameters to the filterscategoriesSelect.value = urlParams.get("p");categoriesSelect.dispatchEvent(new Event("change"));subCategoriesSelect.value = urlParams.get("s");yearSelect.value = urlParams.get("year");genreSelect.value = urlParams.get("genre");searchInput.value = urlParams.get("search");})();