Advertisement
bebo231312312321

Untitled

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