[Refactor] Split drawList functions into separate files

This commit is contained in:
FoxRefire
2024-04-13 05:15:33 +09:00
parent 2aa50c9d86
commit d783c4dd80
3 changed files with 40 additions and 40 deletions

View File

@@ -57,4 +57,5 @@
</div>
</body>
<script src="popup.js"></script>
<script src="popup_drawList.js"></script>
</html>

View File

@@ -2,46 +2,6 @@ let psshs=chrome.extension.getBackgroundPage().getPsshs();
let requests=chrome.extension.getBackgroundPage().getRequests();
let userInputs={};
function drawList(arr,_searchBox,_list,_userInputs){
const elements = arr;
const searchBox = document.getElementById(_searchBox);
const list = document.getElementById(_list);
elements.forEach((element, index) => {
const li = document.createElement('li');
li.textContent = element;
li.addEventListener('click', () => {
userInputs[_userInputs]=index;
document.getElementById(_userInputs).value=element;
document.getElementById(_userInputs+'Index').value=index;
document.getElementById('selectPssh').style.display='none';
document.getElementById('selectRequest').style.display='none';
document.getElementById('home').style.display='block';
});
list.appendChild(li);
});
searchBox.addEventListener('input', (event) => {
const searchValue = event.target.value.toLowerCase();
list.innerHTML = '';
elements.forEach((element, index) => {
if (element.toLowerCase().includes(searchValue)) {
const li = document.createElement('li');
li.textContent = element;
li.addEventListener('click', () => {
userInputs[_userInputs]=index;
document.getElementById(_userInputs).value=element;
document.getElementById(_userInputs+'Index').value=index;
document.getElementById('selectPssh').style.display='none';
document.getElementById('selectRequest').style.display='none';
document.getElementById('home').style.display='block';
});
list.appendChild(li);
}
});
});
}
function selectPssh(){
document.getElementById('home').style.display='none';
document.getElementById('selectPssh').style.display='block';

39
popup_drawList.js Normal file
View File

@@ -0,0 +1,39 @@
function drawList(arr,_searchBox,_list,_userInputs){
const elements = arr;
const searchBox = document.getElementById(_searchBox);
const list = document.getElementById(_list);
elements.forEach((element, index) => {
const li = document.createElement('li');
li.textContent = element;
li.addEventListener('click', () => {
userInputs[_userInputs]=index;
document.getElementById(_userInputs).value=element;
document.getElementById(_userInputs+'Index').value=index;
document.getElementById('selectPssh').style.display='none';
document.getElementById('selectRequest').style.display='none';
document.getElementById('home').style.display='block';
});
list.appendChild(li);
});
searchBox.addEventListener('input', (event) => {
const searchValue = event.target.value.toLowerCase();
list.innerHTML = '';
elements.forEach((element, index) => {
if (element.toLowerCase().includes(searchValue)) {
const li = document.createElement('li');
li.textContent = element;
li.addEventListener('click', () => {
userInputs[_userInputs]=index;
document.getElementById(_userInputs).value=element;
document.getElementById(_userInputs+'Index').value=index;
document.getElementById('selectPssh').style.display='none';
document.getElementById('selectRequest').style.display='none';
document.getElementById('home').style.display='block';
});
list.appendChild(li);
}
});
});
}