function runHTMLTree() {
    let body = {
        tagName: 'body',
        paired: false,
        attrs: {},
        children: [
            {
                tagName: 'div',
                paired: true,
                children: [
                    {
                        tagName: 'span',
                        paired: true,
                        textContent: 'Enter a data please:',
                        attrs: {},
                    },
                    {
                        tagName: 'br',
                        paired: false
                    },
                    {
                        tagName: 'input',
                        paired: false,
                        attrs: {
                            type: 'text',
                            id: 'name'
                        }
                    },
                    {
                        tagName: 'input',
                        paired: false,
                        attrs: {
                            type: 'text',
                            id: 'surname'
                        },
                    }
                ]
            },
            {
                tagName: 'div',
                paired: true,
                children: [
                    {
                        tagName: 'button',
                        attrs: {
                            id: 'ok'
                        },
                        textContent: 'OK'
                    },
                    {
                        tagName: 'button',
                        attrs: {
                            id: 'cancel'
                        },
                        textContent: 'Cancel'
                    },
                ]
            },
        ]
    };

    console.log(body.children[1].children[1].attrs.id);
    console.log(body.children[1].children[0].attrs.id);
}

function runDeclarativeFields() {
    const text = 'Введите желаемый параметр ноутбука: ';

    let notebook = {
        brand: prompt(`${text} brand`),
        type: prompt(`${text} type`),
        model: prompt(`${text} model`),
        ram: prompt(`${text} ram`),
        size: +prompt(`${text} size`),
        weight: +prompt(`${text} weight`),
        resolution: {
            width: +prompt(`${text} width`),
            height: +prompt(`${text} height`),
        },
    };

    const text1 = 'Введите желаемый параметр телефона: ';
    let phone = {
        brand: prompt(`${text1} brand`),
        model: prompt(`${text1} model`),
        ram: +prompt(`${text1} ram`),
        color: prompt(`${text1} color`),
    };

    const text2 = 'Введите характеристику человека: ';

    let person = {
        name: prompt(`${text2} имя`),
        surname: prompt(`${text2} фамилия`),
        married: confirm('Этот человек замужем/женат?'),
    };
}

function runObjectLinks() {
    const text2 = 'Введите характеристику человека: ';

    let person = {
        name: prompt(`${text2} имя`),
        surname: prompt(`${text2} фамилия`),
        married: confirm('Этот человек замужем/женат?'),
        smartphone: {
            owner: {
                laptop: {
                    owner: {
                        smartphone: confirm('У человека есть смартфон?')
                    },
                }
            }
        }
    };
    console.log(person.smartphone.owner.laptop.owner.smartphone = person.smartphone);
}

function runImperativeArrayFill3() {
    let arr = [];
    arr[0] = +prompt('Введите число');
    arr[1] = +prompt('Введите число');
    arr[2] = +prompt('Введите число');
    console.log(arr);
}

function runWhileConfirm() {
    let result = confirm('Вы голодны?');
    while (result === false) {
        result = confirm('Вы голодны?');
    }
}

function runArrayFill() {
    const arr = [];
    let question = prompt('Введите любое слово');
    while (question !== null && question !== '') {
        arr.push(question);
        question = prompt('Введите любое слово');
    }
}

function runArrayFillNoRush() {
    const arr = [];
    for (let i = 0; i < 5; i++) {
        arr[i] = prompt('Введите поочередно до 10 слов, введено: ' + i);
        if (arr[i] === '') {
            arr[i] = prompt('Введите поочередно до 10 слов');
        } else if (arr[i] === null) {
            alert('Стоп!');
            break;
        }
    }
}

function runInfiniteProbability() {
    let i = 0;
    let counter = 0;
    while (i < 0.9) {
        i = Math.random();
        counter++;
        if (i > 0.9) {
            break;
        }
    }
    alert(`Тело цикла выполнится ${counter++} раз`);
}

function runEmptyLoop() {
    while (prompt() === null) {

    }
}

function runProgressionSum() {
    let sum = 0;
    let n = prompt('Введите max значение прогрессии с шагом 3 (1, 4, 7...)');
    for (let i = 1; i <= n; i += 3) {
        sum += i;
    }
    alert(`Сумма ${sum}`);
}

function runChessOneLine() {
    let str = '';
    for (let i = 1; i < 21; i++) {
        if (i % 3) {
            str += ' ';
        } else {
            str += '#';
        }
    }
    console.log(str);
}

function runNumbers() {
    let str = '<table>';
    document.write(str);
    for (let i = 1; i < 10; i++) {
        str += '<tr>';
        for (let j = 0; j < 10; j++) {
            str += '<td>';
            str += j;
            str += '</td>';
        }
        str += '</tr>';
    }
    str += '</table>';
    document.write(str);
}

function runChess() {
    let dot = '.';
    let grid = '#';

    let str = '<table>';
    document.write(str);

    for (let i = 1; i < 11; i++) {
        str += '<tr>';

        for (let j = 1; j < 10; j++) {
            str += '<td>';
            if ((i + j) % 2) {
                str += dot;
            } else {
                str += grid;
            }
            str += '</td>';
        }

        str += '</tr>';
    }
    str += '</table>';
    document.write(str);
}

function runCubes() {
    let arr = [];
    for (let i = 0; i < 10; i++) {
        arr.push(i ** 3);
    }
}


function runMultiplyTable(){
let table = new Array(10);
for (let i = 1; i < table.length; i++) {
    table[i] = new Array(10);
}
for (let row = 1; row < table.length; row++) {
    console.log(table.length);
    for (let col = 1; col < table[row].length; col++) {
        console.log(table[row].length);
        table[row][col] = row * col;
    }
}
console.log(table[5][7]);
}

function runTriangle() {
    function getPyramid(rows){
        let str = '';
        str += '<table>'

        for (let i = 1; i <= rows; i++) {
            str += '<tr>';
            for (let j = 1; j <= (rows - i); j++) {
                str += '<td>';
                str += '.';
                str += '</td>';
            }

            for(let k = 1; k <= (2*i) -1; k++){
                str += '<td>';
                str += "#";
                str += '</td>';
            }

            for (let j = 1; j <= rows -i ; j++) {
                str += '<td>';
                str += '.';
                str += '</td>';
            }
            str += '</tr>';
        }
        str += '</table>';
        document.write(str);
    }
    getPyramid(prompt('Введите число, чтобы задать высоту треугольника'))
}


const tasksArray = [
    ['html tree', runHTMLTree],
    ['declarative fields', runDeclarativeFields],
    ['object links', runObjectLinks],
    ['imperative array fill', runImperativeArrayFill3],
    ['while confirm', runWhileConfirm],
    ['array fill', runArrayFill],
    ['array fill nopush', runArrayFillNoRush],
    ['infinite probability', runInfiniteProbability],
    ['empty loop', runEmptyLoop],
    ['progression sum', runProgressionSum],
    ['chess one line', runChessOneLine],
    ['numbers', runNumbers],
    ['chess', runChess],
    ['cubes', runCubes],
    ['multiply table', runMultiplyTable],
    ['Задание на синий пояс: Треугольник', runTriangle]

];

let $list = document.querySelector('.list');
tasksArray.forEach(task => {
    const [name, callback] = task;

    const $div = document.createElement('div');
    $div.className = 'div';

    let $button = document.createElement('button');
    $button.textContent = 'Запустить';
    $button.className = 'button';
    $button.onclick = callback;
    $div.appendChild($button);

    const $li = document.createElement('li');
    $li.className = 'li';
    $li.textContent = name;
    $div.appendChild($li);
    $list.appendChild($div);
});