123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117 |
- // switch: sizes
- // Сделайте задание Comparison: sizes из предыдущего ДЗ используя switch
- const f1 = (rootId) => {
- let fromCountry;
- let toCountry;
- const sizesLength = 8;
- // Ранее у меня список начальных значений размеров находился в объекте
- // coatSizes = { Russian: 40, German: 34, France: 36, Italy: 38, "Great Britain": 8, USA: 6 };
- // теперь он находится в функции chooseCountrySize(country) со switch,
- // которая используется 2 раза:
- // - для выбора начального размера страны, с которой конвертируем
- // - для выбора начального размера страны, в которую конвертируем
- function chooseCountrySize(country) {
- let initialSize;
- switch (country) {
- case 'Russian':
- initialSize = 40;
- break;
- case 'German':
- initialSize = 34;
- break;
- case 'France':
- initialSize = 36;
- break;
- case 'Italy':
- initialSize = 38;
- break;
- case 'Great Britain':
- initialSize = 8;
- break;
- case 'USA':
- initialSize = 6;
- break;
- }
- return initialSize;
- }
- //Подставляет размерную сетку той страны, с которой конвертируем
- const substituteFnc = () => {
- fromCountry = fromCountryId.value;
- const sizesArray = [];
- sizesArray[0] = chooseCountrySize(fromCountry);
- for (let i = 1; i < sizesLength; i++) { sizesArray[i] = sizesArray[0] + i * 2 };
- const sizesStr = sizesArray.map(item => "<option value=" + item + ">" + item + "</option>");
- fromSizeId.innerHTML = sizesStr;
- convertedSizeId.innerHTML = "---";
- };
- //Вычисляет размер той страны, в которую конвертируем
- function countSizeFnc() {
- toCountry = convertedCountryId.value;
- const fromSize = fromSizeId.value;
- convertedSizeId.innerHTML = chooseCountrySize(toCountry) + (fromSize - chooseCountrySize(fromCountry));
- };
- //Блок создания формы
- const task01block = document.createElement('div');
- task01block.style = "display:inline-block";
- const task01title = document.createElement('h2');
- task01title.innerText = 'Task-01 Comparison: sizes';
-
- //Блок создания формы
- const countries = document.createElement('div');
- const sizes = document.createElement('div');
- const from = document.createElement('span');
- const fromCountryId = document.createElement('select');
- const to = document.createElement('span');
- const convertedCountryId = document.createElement('select');
- const fromSizeId = document.createElement('select');
- const convertedSizeId = document.createElement('output');
- const sizeBtn = document.createElement('button');
- sizes.style = "margin-top:20px";
- from.innerText = 'From';
- fromCountryId.innerHTML = "<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>";
- fromCountryId.style = "margin-left:10px; margin-right:10px";
- to.innerText = 'to';
- convertedCountryId.style = "margin-left:10px";
- convertedCountryId.innerHTML = "<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>";
- fromSizeId.style = "display:inline-block; width:150px; margin-left:40px"
- fromSizeId.innerHTML = "<option value='hide'> -- Enter size --</option>";
- convertedSizeId.innerHTML = "---";
- convertedSizeId.style = "display:inline-block; text-align:center; width:150px; border: 1px solid green; border-radius:3px; margin-left:30px;"
- convertedSizeId.name = "result";
- convertedSizeId.for = "sizeBtn";
- sizeBtn.innerText = "Convert";
- sizeBtn.style = "display:block; margin-left:auto; margin-right:auto; margin-top:20px";
- sizeBtn.type = "button";
-
-
- // guessYearBtn.innerText = "Run Vanga";
- // guessYearBtn.style = 'margin-bottom:20px';
- rootId.appendChild(task01block);
- task01block.appendChild(task01title);
- task01block.appendChild(countries);
- task01block.appendChild(sizes);
- countries.appendChild(from);
- countries.appendChild(fromCountryId);
- countries.appendChild(to);
- countries.appendChild(convertedCountryId);
- sizes.appendChild(fromSizeId);
- sizes.appendChild(convertedSizeId);
- task01block.appendChild(sizeBtn);
- sizeBtn.onclick = countSizeFnc;
- fromCountryId.onchange = substituteFnc;
- //Сброс результата при изменении одного из полей
- fromSizeId.onchange = () => { convertedSizeId.innerHTML = "---"; };
- convertedCountryId.onchange = () => { convertedSizeId.innerHTML = "---"; };
- }
- f1(root);
- export default f1;
|