document.addEventListener("DOMContentLoaded", function () {

    var add = document.getElementById("addButton");

    var task = document.getElementById("Input");

    var list = document.getElementById("list");

    var body = document.querySelector("body");

    var form = document.querySelector("#form");

​

​

​

    //add first

    (function () {

        var newTask1 = document.createElement("li");

        newTask1.dataset.priority = "3";

        var all = document.querySelectorAll("li");

        var index = all.length;

​

        for (var i = 0; i < all.length; i++) {

            if (parseInt(newTask1.dataset.priority) < parseInt(all[i].dataset.priority)) {

                index = i;

                break;

            }

        }

​

        list.insertBefore(newTask1, all[index]);

        var taskName = document.createElement("h3");

        newTask1.appendChild(taskName);

        taskName.innerHTML = "Register to Full Stack Web Course";

        var priorSpan = document.createElement("span");

        taskName.appendChild(priorSpan);

        priorSpan.innerHTML = "Normal";

        taskName.style.color = "green";

​

        taskName.addEventListener("click", function () {

            taskName.classList.add("done");

            priorSpan.classList.add("done");

​

        });

    })();

​

    //add second

    (function () {

        var newTask1 = document.createElement("li");

        newTask1.dataset.priority = "2";

        var all = document.querySelectorAll("li");

        var index = all.length;

​

        for (var i = 0; i < all.length; i++) {

            if (parseInt(newTask1.dataset.priority) < parseInt(all[i].dataset.priority)) {

                index = i;

                break;

            }

        }

​

        list.insertBefore(newTask1, all[index]);

        var taskName = document.createElement("h3");

        newTask1.appendChild(taskName);

        taskName.innerHTML = "Attend Selection Day";

        var priorSpan = document.createElement("span");

        taskName.appendChild(priorSpan);

        priorSpan.innerHTML = "Critical";

        taskName.style.color = "orange";

​

        taskName.addEventListener("click", function () {

            taskName.classList.add("done");

            priorSpan.classList.add("done");

​

        });

    })();

​

    //add third

    (function () {

        var newTask1 = document.createElement("li");

        newTask1.dataset.priority = "4";

        var all = document.querySelectorAll("li");

        var index = all.length;

​

        for (var i = 0; i < all.length; i++) {

            if (parseInt(newTask1.dataset.priority) < parseInt(all[i].dataset.priority)) {

                index = i;

                break;

            }

        }

​

        list.insertBefore(newTask1, all[index]);

        var taskName = document.createElement("h3");

        newTask1.appendChild(taskName);

        taskName.innerHTML = "Go see X-Men apocalypse movie";

        var priorSpan = document.createElement("span");

        taskName.appendChild(priorSpan);

        priorSpan.innerHTML = "If You Can";

        taskName.style.color = "blue";

​

        taskName.addEventListener("click", function () {

            taskName.classList.add("done");

            priorSpan.classList.add("done");

​

        });

    })();

​

    //Add task

    add.addEventListener("click",addFunction);

​

    document.getElementById("Input")

        .addEventListener("keyup", function(event) {

            event.preventDefault();

            if (event.keyCode == 13) {

                document.getElementById("addButton").click();

            }

        });

​

    function addFunction () {

        if (task.value.length >= 6 &&

            task.value.length <= 42) {

​

            //Add task to the list

            var newTask = document.createElement("li");

            var x = document.getElementById("prioritySelect").selectedIndex;

            newTask.dataset.priority = document.getElementsByTagName("option")[x].value;

            console.log(document.getElementsByTagName("option")[x].value);

            var all = document.querySelectorAll("li");

            var index = all.length;

​

            for (var i = 0; i < all.length; i++) {

                if (parseInt(newTask.dataset.priority) < parseInt(all[i].dataset.priority)) {

                    index = i;

                    break;

                }

            }

            for (var j = index - 1; j >= 0; j--) {

                if (parseInt(newTask.dataset.priority) == parseInt(all[j].dataset.priority)) {

                    if(task.value.localeCompare(all[j].innerText)==-1) index = j;

                }

            }

​

            list.insertBefore(newTask, all[index]);

            var taskName = document.createElement("h3");

            newTask.appendChild(taskName);

            taskName.innerHTML = task.value;

            var priorSpan = document.createElement("span");

            taskName.appendChild(priorSpan);

            priorSpan.innerHTML = newTask.dataset.priority;

​

            if(priorSpan.innerHTML == '1'){

                priorSpan.innerHTML = 'Urgent';

                taskName.style.color = "red"

            }

            if(priorSpan.innerHTML == '2'){

                priorSpan.innerHTML = 'Critical';

                taskName.style.color = "orange";

​

            }

            if(priorSpan.innerHTML == '3'){

                priorSpan.innerHTML = 'Normal';

                taskName.style.color = "green";

            }

            if(priorSpan.innerHTML == '4'){

                priorSpan.innerHTML = 'If You Can';

                taskName.style.color = "blue";

            }

​

            //Mark completed in grey

            taskName.addEventListener("click", function () {

                taskName.classList.add("done");

                priorSpan.classList.add("done");

​

            });

​

            task.value = "";

            document.getElementById("prioritySelect").selectedIndex = "2";

​

        } else {

​

            event.preventDefault();

            alert("Task should have from 6 to 42 characters");

        }

    }

​

});

​