You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

486 lines
15 KiB

$(function () {
// Search Items
$(".searchbar > input").on("keyup", function () {
var rex = new RegExp($(this).val(), "i");
$(".todo-listing .todo-item").hide();
$(".todo-listing .todo-item")
.filter(function () {
return rex.test($(this).text());
})
.show();
});
});
// #####################################################
// Notification Badge
// #####################################################
function dynamicNumberNotify(setTaskSectionCount) {
var taskSectionCount = setTaskSectionCount;
// Get Parents Div(s)
var get_ParentsDiv = $(".todo-item");
var get_TaskAllListParentsDiv = $(".todo-item.all-todo-list");
var get_TaskCompletedListParentsDiv = $(".todo-item.current-task-done");
var get_TaskImportantListParentsDiv = $(".todo-item.current-task-important");
// Get Parents Div(s) Counts
var get_TastListCount = get_TaskAllListParentsDiv.length;
var get_CompletedTaskElementsCount = get_TaskCompletedListParentsDiv.length;
var get_ImportantTaskElementsCount = get_TaskImportantListParentsDiv.length;
// Get Badge Div(s)
var getBadgeAllTaskDiv = $("#all-todo-list .todo-badge");
var getBadgeCompletedTaskListDiv = $("#current-task-done .todo-badge");
var getBadgeImportantTaskListDiv = $("#current-task-important .todo-badge");
if (taskSectionCount === "allList") {
if (get_TastListCount === 0) {
getBadgeAllTaskDiv.text("");
return;
}
if (get_TastListCount > 9) {
getBadgeAllTaskDiv.css({
padding: "2px 0px",
height: "25px",
width: "25px",
});
} else if (get_TastListCount <= 9) {
getBadgeAllTaskDiv.removeAttr("style");
}
getBadgeAllTaskDiv.text(get_TastListCount);
} else if (taskSectionCount === "completedList") {
if (get_CompletedTaskElementsCount === 0) {
getBadgeCompletedTaskListDiv.text("");
return;
}
if (get_CompletedTaskElementsCount > 9) {
getBadgeCompletedTaskListDiv.css({
padding: "2px 0px",
height: "25px",
width: "25px",
});
} else if (get_CompletedTaskElementsCount <= 9) {
getBadgeCompletedTaskListDiv.removeAttr("style");
}
getBadgeCompletedTaskListDiv.text(get_CompletedTaskElementsCount);
} else if (taskSectionCount === "importantList") {
if (get_ImportantTaskElementsCount === 0) {
getBadgeImportantTaskListDiv.text("");
return;
}
if (get_ImportantTaskElementsCount > 9) {
getBadgeImportantTaskListDiv.css({
padding: "2px 0px",
height: "25px",
width: "25px",
});
} else if (get_ImportantTaskElementsCount <= 9) {
getBadgeImportantTaskListDiv.removeAttr("style");
}
getBadgeImportantTaskListDiv.text(get_ImportantTaskElementsCount);
}
}
new dynamicNumberNotify("allList");
new dynamicNumberNotify("completedList");
new dynamicNumberNotify("importantList");
// #####################################################
// Quill data
// #####################################################
var quill = new Quill("#taskdescription", {
modules: {
toolbar: [
[{ header: [1, 2, false] }],
["bold", "italic", "underline"],
["image", "code-block"],
],
},
placeholder: "Add description here...",
theme: "snow", // or 'bubble'
});
$("#addTaskModal").on("hidden.bs.modal", function (e) {
// do something...
$(this).find("input,textarea,select").val("").end();
quill.deleteText(0, 2000);
});
$("#add-task").on("click", function (event) {
event.preventDefault();
$(".add-tsk").show();
$(".edit-tsk").hide();
$("#addTaskModal").modal("show");
});
// #####################################################
// Checkbox checked event
// #####################################################
function donecheckCheckbox() {
$('.todo-item input[type="checkbox"]').click(function () {
if ($(this).is(":checked")) {
$(this).parents(".todo-item").addClass("current-task-done");
} else if ($(this).is(":not(:checked)")) {
$(this).parents(".todo-item").removeClass("current-task-done");
}
new dynamicNumberNotify("completedList");
});
}
// #####################################################
// Remove current task
// #####################################################
function removeDropdown() {
$(".dropdown-action .dropdown-menu .remove.dropdown-item").click(function () {
if (!$(this).parents(".todo-item").hasClass("current-todo-delete")) {
var getTaskParent = $(this).parents(".todo-item");
var getTaskClass = getTaskParent.attr("class");
var getFirstClass = getTaskClass.split(" ")[1];
var getSecondClass = getTaskClass.split(" ")[2];
var getThirdClass = getTaskClass.split(" ")[3];
if (getFirstClass === "all-todo-list") {
getTaskParent.removeClass(getFirstClass);
}
if (
getSecondClass === "current-task-done" ||
getSecondClass === "current-task-important"
) {
getTaskParent.removeClass(getSecondClass);
}
if (
getThirdClass === "current-task-done" ||
getThirdClass === "current-task-important"
) {
getTaskParent.removeClass(getThirdClass);
}
$(this).parents(".todo-item").addClass("current-todo-delete");
} else if ($(this).parents(".todo-item").hasClass("current-todo-delete")) {
$(this).parents(".todo-item").removeClass("current-todo-delete");
}
new dynamicNumberNotify("allList");
new dynamicNumberNotify("completedList");
new dynamicNumberNotify("importantList");
});
}
// #####################################################
// Remove current task permanently
// #####################################################
function deletePermanentlyDropdown() {
$(".dropdown-action .dropdown-menu .permanent-delete.dropdown-item").on(
"click",
function (event) {
event.preventDefault();
if ($(this).parents(".todo-item").hasClass("current-todo-delete")) {
$(this).parents(".todo-item").remove();
}
}
);
}
// #####################################################
// Move current task with other tasks
// #####################################################
function reviveTaskDropdown() {
$(".dropdown-action .dropdown-menu .revive.dropdown-item").on(
"click",
function (event) {
event.preventDefault();
if ($(this).parents(".todo-item").hasClass("current-todo-delete")) {
var getTaskParent = $(this).parents(".todo-item");
var getTaskClass = getTaskParent.attr("class");
var getFirstClass = getTaskClass.split(" ")[1];
$(this).parents(".todo-item").removeClass(getFirstClass);
$(this).parents(".todo-item").addClass("all-todo-list");
$(this).parents(".todo-item").hide();
}
new dynamicNumberNotify("allList");
new dynamicNumberNotify("completedList");
new dynamicNumberNotify("importantList");
}
);
}
// #####################################################
// Make task Important
// #####################################################
function importantTaskDropdown() {
$(".important").click(function () {
if (!$(this).parents(".todo-item").hasClass("current-task-important")) {
$(this).parents(".todo-item").addClass("current-task-important");
$(this).html("Back to List");
} else if (
$(this).parents(".todo-item").hasClass("current-task-important")
) {
$(this).parents(".todo-item").removeClass("current-task-important");
$(this).html("Important");
$(".list-group-item-action#all-todo-list").trigger("click");
}
new dynamicNumberNotify("importantList");
});
}
// #####################################################
// Edit Current task
// #####################################################
function editTaskDropdown() {
$(".dropdown-action .dropdown-menu .edit.dropdown-item").click(function () {
event.preventDefault();
var $_outerThis = $(this);
$(".add-tsk").hide();
$(".edit-tsk").show();
var $_taskTitle = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-header")
.attr("data-todo-header");
var $_taskText = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-subtext")
.attr("data-todosubtextText");
var $_taskJson = JSON.parse($_taskText);
$("#task").val($_taskTitle);
quill.setContents($_taskJson);
$(".edit-tsk")
.off("click")
.on("click", function (event) {
var $_innerThis = $(this);
var $_task = document.getElementById("task").value;
var $_taskDescription =
document.getElementById("taskdescription").value;
// Get current date
var today = new Date();
var dd = String(today.getDate()).padStart(2, "0");
var mm = String(today.getMonth()); //January is 0!
var yyyy = today.getFullYear();
var monthNames = [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
];
today = dd + " " + monthNames[mm] + " " + yyyy;
// getting text of task title and task description
var $_taskDescriptionText = quill.getText();
var $_taskDescriptionInnerHTML = quill.root.innerHTML;
var delta = quill.getContents();
var $_textDelta = JSON.stringify(delta);
var length = 125;
var trimmedString =
$_taskDescriptionText.length > length
? $_taskDescriptionText.substring(0, length - 3) + "..."
: $_taskDescriptionText;
var $_taskEditedTitle = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-header")
.html($_task);
var $_taskEditedText = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-subtext")
.html(trimmedString);
var $_taskEditedText = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-time")
.html(today);
var $_taskEditedTitleDataAttr = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-header")
.attr("data-todo-header", $_task);
var $_taskEditedTextDataAttr = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-subtext")
.attr("data-todosubtextText", $_textDelta);
var $_taskEditedTextDataAttr = $_outerThis
.parents(".todo-item")
.children()
.find(".todo-subtext")
.attr("data-todosubtext-html", $_taskDescriptionInnerHTML);
$("#addTaskModal").modal("hide");
});
$("#addTaskModal").modal("show");
});
}
// #####################################################
// Click on current task get more detail
// #####################################################
function taskItem() {
$(".todo-item .content-todo").on("click", function (event) {
event.preventDefault();
var $_taskTitle = $(this)
.parents(".todo-item")
.children()
.find(".todo-header")
.attr("data-todo-header");
var $todoHtml = $(this).find(".todo-subtext").attr("data-todosubtext-html");
$(".task-heading").text($_taskTitle);
$(".task-text").html($todoHtml);
$("#todoShowListItem").modal("show");
});
}
var $btns = $(".list-group-item-action").click(function () {
if (this.id == "all-todo-list") {
var $el = $("." + this.id).fadeIn();
$("#all-todo-container > div").not($el).hide();
} else if (this.id == "current-todo-delete") {
var $el = $("." + this.id).fadeIn();
$("#all-todo-container > div").not($el).hide();
} else {
var $el = $("." + this.id).fadeIn();
$("#all-todo-container > div").not($el).hide();
}
$btns.removeClass("active");
$(this).addClass("active");
});
donecheckCheckbox();
removeDropdown();
deletePermanentlyDropdown();
reviveTaskDropdown();
importantTaskDropdown();
editTaskDropdown();
taskItem();
// #####################################################
// Add New Task
// #####################################################
$(".add-tsk").click(function (e) {
// Setting current date
var today = new Date();
var dd = String(today.getDate()).padStart(2, "0");
var mm = String(today.getMonth()); //January is 0!
var time = String(today.getTime());
var yyyy = today.getFullYear();
var monthNames = [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
];
today = dd + " " + monthNames[mm] + " " + yyyy;
var cdate = dd + mm + time;
var $_task = document.getElementById("task").value;
var $_taskDescriptionText = quill.getText();
var $_taskDescriptionInnerHTML = quill.root.innerHTML;
var delta = quill.getContents();
var $_textDelta = JSON.stringify(delta);
$html =
'<div class="todo-item all-todo-listtodo-item all-todo-list p-3 border-bottom position-relative">' +
'<div class="inner-item d-flex align-items-start">' +
'<div class="w-100">' +
'<div class="checkbox checkbox-info d-flex align-items-start">' +
'<input type="checkbox" class="material-inputs" id="' +
cdate +
'">' +
'<label for="' +
cdate +
'"></label>' +
"<div>" +
'<h5 class="font-medium font-16 todo-header mb-0" data-todo-header="' +
$_task +
'">' +
$_task +
"</h5>" +
"<div class='todo-subtext text-muted' data-todosubtext-html='" +
$_taskDescriptionInnerHTML +
"' data-todosubtextText='" +
$_textDelta +
"'> " +
$_taskDescriptionText +
"</div>" +
'<span class="todo-time font-12 text-muted"><i class="icon-calender mr-1"></i>' +
today +
"</span>" +
"</div>" +
'<div class="ml-auto">' +
'<div class="dropdown-action">' +
'<div class="dropdown todo-action-dropdown">' +
'<button class="btn btn-link text-dark p-1 dropdown-toggle text-decoration-none todo-action-dropdown" type="button" id="more-action-1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' +
'<i class="icon-options-vertical"></i>' +
"</button>" +
'<div class="dropdown-menu dropdown-menu-right" aria-labelledby="more-action-1">' +
'<a class="edit dropdown-item" href="javascript:void(0);"><i class="fas fa-edit text-info mr-1"></i> Edit</a>' +
'<a class="important dropdown-item" href="javascript:void(0);"><i class="fas fa-star text-warning mr-1"></i> Important</a>' +
'<a class="remove dropdown-item" href="javascript:void(0);"><i class="far fa-trash-alt text-danger mr-1"></i>Remove</a>' +
'<a class="permanent-delete dropdown-item" href="javascript:void(0);">Permanent Delete</a>' +
'<a class="revive dropdown-item" href="javascript:void(0);">Revive Task</a>' +
"</div>" +
"</div>" +
"</div>" +
"</div>" +
"</div>" +
"</div>" +
"</div>" +
"</div>";
$("#all-todo-container").prepend($html);
$("#addTaskModal").modal("hide");
donecheckCheckbox();
removeDropdown();
deletePermanentlyDropdown();
reviveTaskDropdown();
editTaskDropdown();
taskItem();
importantTaskDropdown();
new dynamicNumberNotify("allList");
$(".list-group-item-action#all-todo-list").trigger("click");
$(".add-tsk").attr("disabled", "disabled");
});
$("#task").keyup(function () {
var empty = false;
$("#task").each(function () {
if ($(this).val() == "") {
empty = true;
}
});
if (empty) {
$(".add-tsk").attr("disabled", "disabled");
} else {
$(".add-tsk").removeAttr("disabled");
}
});