Advertisement
bebo231312312321

Untitled

Jun 18th, 2023
97
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function solve() {
  2.         const [carModelInput, carYearInput, partNameInput, partNumberInput, conditionInput, imgSrc, confirm, ulInfo, nextBtn] =
  3.                 ['#car-model', '#car-year', '#part-name', '#part-number', '#condition',
  4.                 '#complete-img', '.confirm-list', '.info-list', '#next-btn'].map(selector => document.querySelector(selector));
  5.         nextBtn.addEventListener('click', onNext)
  6.         function onNext(e) {
  7.                 e.preventDefault()
  8.                 const [carModel, carYear, partName, partNumber, condition] = [
  9.                 carModelInput, carYearInput, partNameInput, partNumberInput, conditionInput].map(input => input.value);
  10.                 const isValidInput = [carModel, carYear, partName, partNumber, condition].filter(value => value === "").length === 0 && carYear >= 1980 && carYear <= 2023;
  11.                 if (!isValidInput) return;
  12.                 let partInfo = onCreat(carModel, carYear, partName, partNumber, condition)
  13.                 ulInfo.appendChild(partInfo)
  14.                 clear(carModelInput, carYearInput, partNameInput, partNumberInput, conditionInput);
  15.         }
  16.         function onCreat(carModel, carYear, partName, partNumber, condition) {
  17.                 const liInfo = document.createElement('li');
  18.                 liInfo.classList.add('part-content');
  19.                 const article = document.createElement('article');
  20.                 liInfo.appendChild(article);
  21.  
  22.                 const createParagraph = (text) => {
  23.                         const p = document.createElement('p');
  24.                         p.textContent = text;
  25.                         return p;
  26.                 };
  27.                 article.appendChild(createParagraph(`Car Model: ${carModel}`));
  28.                 article.appendChild(createParagraph(`Car Year: ${carYear}`));
  29.                 article.appendChild(createParagraph(`Part Name: ${partName}`));
  30.                 article.appendChild(createParagraph(`Part Number: ${partNumber}`));
  31.                 article.appendChild(createParagraph(`Condition: ${condition}`));
  32.                 const creatButtons = (text, className, eventListener) => {
  33.                         const button = document.createElement('button');
  34.                         button.textContent = text;
  35.                         button.classList.add(className);
  36.                         button.addEventListener('click', eventListener);
  37.                         return button;
  38.                 };
  39.                 const editBtn = creatButtons('Edit', 'edit-btn', onEdit, 'edit-button');
  40.                 const continueBtn = creatButtons('Continue', 'continue-btn', onContinue, 'continue-button');
  41.                 liInfo.appendChild(editBtn);
  42.                 liInfo.appendChild(continueBtn);
  43.                 function onEdit(e) {
  44.                         const [carModel, carYear, partName, partNumber, condition]
  45.                                 = e.target.parentElement.querySelectorAll('article > p');
  46.  
  47.                         carModelInput.value = carModel.textContent.replace('Car Model: ', '');
  48.                         carYearInput.value = carYear.textContent.replace('Car Year: ', '');
  49.                         partNameInput.value = partName.textContent.replace('Part Name: ', '');
  50.                         partNumberInput.value = partNumber.textContent.replace('Part Number: ', '');
  51.                         conditionInput.value = condition.textContent.replace('Condition: ', '');
  52.                         nextBtn.disabled = false;
  53.                         liInfo.remove();
  54.                 }
  55.                 function onContinue(e) {
  56.                         const currentLi = e.target.parentElement;
  57.                         continueBtn.remove();
  58.                         editBtn.remove();
  59.                         confirm.appendChild(currentLi);
  60.  
  61.                         const confirmBtn = creatButtons('Confirm', 'confirm-btn', onConf);
  62.                         const cancelBtn = creatButtons('Cancel', 'cancel-btn', onCancel);
  63.  
  64.                         currentLi.appendChild(confirmBtn);
  65.                         currentLi.appendChild(cancelBtn);
  66.                 }
  67.                 function onConf(e) {
  68.                         let currentLi = e.target.parentElement
  69.                         imgSrc.style.visibility = "visible"
  70.                         let completeTxt = document.getElementById("complete-text")
  71.                         completeTxt.textContent = "Part is Ordered!"
  72.                         currentLi.remove()
  73.                         nextBtn.disabled = false
  74.                 }
  75.                 function onCancel(e) {
  76.                         let currentLi = e.target.parentElement
  77.                         currentLi.remove()
  78.                         nextBtn.disabled = false
  79.                 }
  80.                 return liInfo
  81.         }
  82.         function clear(...inputs) {
  83.                 inputs.forEach(input => (input.value = ""));
  84.                 nextBtn.disabled = true;
  85.         }
  86. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement