Advertisement
Pijomir

Ski lift

Feb 13th, 2024
625
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function solve() {
  2.     let firstNameElement = document.getElementById('first-name');
  3.     let lastNameElement = document.getElementById('last-name');
  4.     let peopleCountElement = document.getElementById('people-count');
  5.     let fromDateElement = document.getElementById('from-date');
  6.     let daysCountElement = document.getElementById('days-count');
  7.     let nextButtonElement = document.getElementById('next-btn');
  8.     let ticketInfoList = document.querySelector('.ticket-info-list');
  9.     let confirmTicketList = document.querySelector('.confirm-ticket');
  10.  
  11.     nextButtonElement.addEventListener('click', onNextBtnClick);
  12.  
  13.     function createElements(typeOfEl, content) {
  14.         if (!content) {
  15.             return document.createElement(typeOfEl);
  16.         } else {
  17.             let element = document.createElement(typeOfEl);
  18.             element.textContent = content;
  19.             return element;
  20.         }
  21.     }
  22.  
  23.     function onNextBtnClick(e) {
  24.         e.preventDefault();
  25.         let firstName = firstNameElement.value;
  26.         let lastName = lastNameElement.value;
  27.         let peopleCount = Number(peopleCountElement.value);
  28.         let fromDate = fromDateElement.value;
  29.         let daysCount = Number(daysCountElement.value);
  30.         if (!firstName || !lastName || !peopleCount || !fromDate || !daysCount) {
  31.             return;
  32.         }
  33.  
  34.         let liElement = createElements('li');
  35.         liElement.className = 'ticket';
  36.         let articleElement = createElements('article');
  37.         articleElement.appendChild(createElements('h3', `Name: ${firstName} ${lastName}`));
  38.         articleElement.appendChild(createElements('p', `From date: ${fromDate}`));
  39.         articleElement.appendChild(createElements('p', `For ${daysCount} days`));
  40.         articleElement.appendChild(createElements('p', `For ${peopleCount} people`));
  41.         liElement.appendChild(articleElement);
  42.  
  43.         let editButtonElement = createElements('button', 'Edit');
  44.         editButtonElement.className = 'edit-btn';
  45.         editButtonElement.addEventListener('click', () => onEditBtnClick(firstName, lastName, peopleCount, fromDate, daysCount));
  46.  
  47.         let continueButtonElement = createElements('button', 'Continue');
  48.         continueButtonElement.className = 'continue-btn';
  49.         continueButtonElement.addEventListener('click', () => onContinueBtnClick(firstName, lastName, peopleCount, fromDate, daysCount));
  50.  
  51.         liElement.appendChild(editButtonElement);
  52.         liElement.appendChild(continueButtonElement);
  53.  
  54.         ticketInfoList.appendChild(liElement);
  55.  
  56.         nextButtonElement.parentElement.reset();
  57.         nextButtonElement.disabled = true;
  58.     }
  59.  
  60.     function onEditBtnClick(firstName, lastName, peopleCount, fromDate, daysCount) {
  61.         firstNameElement.value = firstName;
  62.         lastNameElement.value = lastName;
  63.         peopleCountElement.value = peopleCount;
  64.         fromDateElement.value = fromDate;
  65.         daysCountElement.value = daysCount;
  66.  
  67.         ticketInfoList.textContent = '';
  68.         nextButtonElement.disabled = false;
  69.     }
  70.  
  71.     function onContinueBtnClick(firstName, lastName, peopleCount, fromDate, daysCount) {
  72.         let liElement = createElements('li');
  73.         liElement.className = 'ticket';
  74.         let articleElement = createElements('article');
  75.         articleElement.appendChild(createElements('h3', `Name: ${firstName} ${lastName}`));
  76.         articleElement.appendChild(createElements('p', `From date: ${fromDate}`));
  77.         articleElement.appendChild(createElements('p', `For ${daysCount} days`));
  78.         articleElement.appendChild(createElements('p', `For ${peopleCount} people`));
  79.         liElement.appendChild(articleElement);
  80.  
  81.         let confirmButtonElement = createElements('button', 'Confirm');
  82.         confirmButtonElement.className = 'confirm-btn';
  83.         confirmButtonElement.addEventListener('click', onConfirmBtnClick);
  84.  
  85.         let cancelButtonElement = createElements('button', 'Cancel');
  86.         cancelButtonElement.className = 'cancel-btn';
  87.         cancelButtonElement.addEventListener('click', onCancelBtnClick);
  88.  
  89.         liElement.appendChild(confirmButtonElement);
  90.         liElement.appendChild(cancelButtonElement);
  91.  
  92.         confirmTicketList.appendChild(liElement);
  93.  
  94.         ticketInfoList.textContent = '';
  95.     }
  96.  
  97.     function onConfirmBtnClick() {
  98.         document.getElementById('main').remove();
  99.  
  100.         let h1Element = document.createElement('h1');
  101.         h1Element.id = 'thank-you';
  102.         h1Element.textContent = 'Thank you, have a nice day!';
  103.  
  104.         let backButtonElement = document.createElement('button');
  105.         backButtonElement.id = 'back-btn';
  106.         backButtonElement.textContent = 'Back';
  107.         backButtonElement.addEventListener('click', () => {
  108.             location.reload()
  109.         });
  110.  
  111.         document.getElementById('body').appendChild(h1Element);
  112.         document.getElementById('body').appendChild(backButtonElement);
  113.     }
  114.  
  115.     function onCancelBtnClick() {
  116.         confirmTicketList.textContent = '';
  117.         nextButtonElement.disabled = false;
  118.     }
  119. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement