task-16.js 3.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. // Comparison: sizes
  2. // Сделайте перевод перевод из нашей системы размеров в американскую или любую на выбор.
  3. // Используйте prompt, условия сравнения и alert.
  4. // сразу сделала через выкатывающийся список и объект. prompt - слишком ограниченный функционал,
  5. // условия сравнения - не поняла, для чего он. Размер везде вычесляемое поле с шагом 2.
  6. // Имеется в виду, что нужно не вычислять, а подставлять? делать 7 if?
  7. const coatSizes = { Russian: 40, German: 34, France: 36, Italy: 38, "Great Britain": 8, USA: 6 };
  8. const substituteFnc = () => {
  9. const fromCountry = initialCountryId.value;
  10. const sizesLength = 8;
  11. const sizesArray = [];
  12. sizesArray[0] = coatSizes[fromCountry];
  13. for (let i = 1; i < sizesLength; i++) { sizesArray[i] = sizesArray[0] + i * 2};
  14. const sizesStr = sizesArray.map(item => "<option value="+item+">" + item +"</option>");
  15. initialSizeId.innerHTML=sizesStr;
  16. convertedSizeId.innerHTML = "---";
  17. };
  18. function countSizeFnc () {
  19. const fromCountry = initialCountryId.value;
  20. const toCountry = convertedCountryId.value;
  21. const initialSize = initialSizeId.value;
  22. convertedSizeId.innerHTML = coatSizes[toCountry] + (initialSize - coatSizes[fromCountry]);
  23. };
  24. document.body.insertAdjacentHTML("afterbegin", "<section id=task16 style='display:inline-block'></section>");
  25. task16.insertAdjacentHTML("beforeend", "<form id=sizeForm style='display:inline-block;'></form>");
  26. sizeForm.insertAdjacentHTML("beforeend", "<h2 style='margin-left:auto; margin-right:auto'>Конвертор размеров верхней одежды</h2>");
  27. sizeForm.insertAdjacentHTML("beforeend", "<div id=countries></div>");
  28. sizeForm.insertAdjacentHTML("beforeend", "<div id=sizes style='margin-top:20px'></div>");
  29. countries.insertAdjacentHTML("beforeend", "<span>From </span>");
  30. countries.insertAdjacentHTML("beforeend", "<select id=initialCountryId><option value='hide'> -- Enter initial country --</option><option value='Russian'>Russian</option><option value='German'>German</option><option value='France'>France</option><option value='Italy'>Italy</option><option value='Great Britain'>Great Britain</option><option value='USA'>USA</option></select> ");
  31. countries.insertAdjacentHTML("beforeend", "<span> to </span>");
  32. countries.insertAdjacentHTML("beforeend", "<select id=convertedCountryId><option value='hide'> -- Enter converted country --</option><option value='Russian'>Russian</option><option value='German'>German</option><option value='France'>France</option><option value='Italy'>Italy</option><option value='Great Britain'>Great Britain</option><option value='USA'>USA</option></select> ");
  33. sizes.insertAdjacentHTML("beforeend", "<select id=initialSizeId style='display:inline-block; width:150px; margin-left:40px'><option value='hide'> -- Enter size --</option></select> ");
  34. sizes.insertAdjacentHTML("beforeend", "<output id=convertedSizeId name='result' for='sizeBtn' style='display:inline-block; text-align:center; width:150px; border: 1px solid green; border-radius:3px; margin-left:30px'>---</output>");
  35. sizeForm.insertAdjacentHTML("beforeend", "<button id=sizeBtn type='button' style='display:block; margin-left:auto; margin-right:auto; margin-top:20px'>Convert</button>");
  36. sizeBtn.onclick = countSizeFnc;
  37. initialCountryId.onchange = substituteFnc;
  38. // Comparison: object
  39. // Подумайте о том, как можно применить объекты к предыдущем заданию.
  40. // Сразу подумала. if - это капец 8)