;(function(){
    "use strict";

    document.addEventListener('DOMContentLoaded', htmlReady);

    function htmlReady(){


        var incomplitedList = document.querySelector('.ba-incomplited-list'),
            complitedList = document.querySelector('.ba-complited-list'),
            newTaskInput = document.querySelector('[name="new-task"]'),
            addButton = document.querySelector('[data-action="add"]');

        addButton.addEventListener('click', function(){
            if(newTaskInput.value === ''){
                return;
            }

            var newTaskLi = document.createElement('li'),
                checkBox = document.createElement('input'),
                editInput = document.createElement('input'),
                buttonEdit = document.createElement('button'),
                buttonDelete = document.createElement('button');

            checkBox.type = 'checkbox';
            editInput.type = 'text';
            editInput.value = newTaskInput.value;
            editInput.disabled = true;

            buttonEdit.innerText = 'Edit';
            buttonEdit.dataset.action = 'edit';

            buttonDelete.innerText = 'Delete';
            buttonDelete.dataset.action = 'delete';

            newTaskLi.appendChild(checkBox);
            newTaskLi.appendChild(editInput);
            newTaskLi.appendChild(buttonEdit);
            newTaskLi.appendChild(buttonDelete);

            incomplitedList.appendChild(newTaskLi);

        });

        document.addEventListener('click', function(event){
            var actionButton = event.target;

            if(actionButton.dataset.action === 'edit'){
                var currentInput = actionButton.parentNode.querySelector('[type="text"]');

                currentInput.disabled = currentInput.disabled ? false : true;
                currentInput.focus();
            }
            if(actionButton.dataset.action === 'delete'){
                var currentTask = actionButton.parentNode;

                currentTask.remove();
            }
        });

        document.addEventListener('change', function(event){
            var checkBox = event.target;

            if(checkBox.type === 'checkbox'){
                var currentTask = checkBox.parentNode;

                if(checkBox.checked){
                    complitedList.appendChild(currentTask);
                } else {
                    incomplitedList.appendChild(currentTask);
                }
            }
        });
    }
})();