User:LeafWolf233/common.js

/*--For the custom filter on the character table (Ver. 1.1)--*/

/*-Varibles-*/ //datas from the table const table = document.querySelectorAll("tr"); //buttons const tantouFilter = document.querySelector("div#Tantou"); const wakiFilter = document.querySelector("div#Wakizashi"); const uchiFilter = document.querySelector("div#Uchigatana"); const tachiFilter = document.querySelector("div#Tachi"); const ootachiFilter = document.querySelector("div#Ootachi"); const yariFilter = document.querySelector("div#Yari"); const nagiFilter = document.querySelector("div#Naginata"); const tsurugiFilter = document.querySelector("div#Tsurugi"); const tokuFilter = document.querySelector("div#Toku"); const kiwameFilter = document.querySelector("div#Kiwame");

//arraies that store differrent types of clicked buttons const types = []; const kiwameStatus = []; const allButtons = [types, kiwameStatus]; //path for buttons' image const waki = "https://vignette.wikia.nocookie.net/a-normal-playground/images/b/b8/Wakizashi.png"; const wakiClicked = "https://vignette.wikia.nocookie.net/a-normal-playground/images/1/1f/Wakizashi-full.png"; const yari = "https://vignette.wikia.nocookie.net/a-normal-playground/images/b/b4/Yari.png"; const kiwame = "https://vignette.wikia.nocookie.net/a-normal-playground/images/5/56/Kiwame.png"; const generalClicked = "https://vignette.wikia.nocookie.net/a-normal-playground/images/f/fe/R5.png"; //for testing purpose

/*-Calling functions-*/ //bind events to buttons wakiFilter.addEventListener("click", function {mainButton(this, types, waki, wakiClicked)}); //yariFilter.addEventListener("click", function {filter(this, type, yari, generalClicked)}); //kiwameFilter.addEventListener("click", function {filter(this, kiwameStats, kiwame, generalClicked)});

/*-Functions-*/ //main function function mainButton(clickedElement, buttonArray, unclickedImageSrc, clickedImageSrc){ //store button's img element and img's src for future use currentImg = clickedElement.querySelector("img"); currentImgSrc = currentImg.getAttribute("src"); //is the button being clicked isFiltered = (currentImgSrc === clickedImageSrc); //reset the table for the convience of filtering resetTable; //button was clicked, undo the filtering if(isFiltered){ currentImg.setAttribute("src", unclickedImageSrc); //remove the id from the array removeFromArray(clickedElement.id); //if no other button is in clicked status, end the function if(checkMainArrayEmptiness){ return; }else{ filter; }   }else{ //button isn't clicked, start filtering currentImg.setAttribute("src", clickedImageSrc); //store id into array buttonArray.push(clickedElement.id); filter; } }

//filtering the table based on the array which store all clicked button function filter{ var selection = []; var length = allButtons.length; }

//check whether this column has all the values from array, return true if is, vise versa function checkIDInArray(input){ for(q = 0; q < clickedButtons.length; q++){ if(!input.includes(clickedButtons[q])){ return false; }   }    return true; }

//remove id from the array based on the input function removeFromArray(inputID){ var temp = clickedButtons.indexOf(inputID); if(temp !== -1){ clickedButtons.splice(inputID, 1); } }

//reset the filtering on table function resetTable{ for(i = 0; i < table.length; i++){ table[i].style.display = ""; } }

// function checkButtonEmptiness{ for(i = 0; i < allButtons.length; i++){ if(allButtons.length !== 0){ return false; }       return true; } }

/* function filter(clickedElement, data, unclickedImageSrc, clickedImageSrc){ //store button's img and img's src for future use currentImg = clickedElement.querySelector("img"); currentImgSrc = currentImg.getAttribute("src"); //is the button being clicked isFiltered = (currentImgSrc === clickedImageSrc); if(isFiltered){ //button was clicked, undo the filtering currentImg.setAttribute("src", unclickedImageSrc); for(i = 0; i < data.length; i++){ if(!data[i].innerHTML.includes(clickedElement.id)){ data[i].parentElement.style.display = ""; }       }    }else{ //button isn't clicked, start filtering currentImg.setAttribute("src", clickedImageSrc); for(i = 0; i < data.length; i++){ if(!data[i].innerHTML.includes(clickedElement.id)){ data[i].parentElement.style.display = "none"; }       }    } }