diff --git a/database/migrations/2020_06_23_170816_create_todo_items_table.php b/database/migrations/2020_06_23_170816_create_todo_items_table.php
index 5dd97c8..13fea0d 100755
--- a/database/migrations/2020_06_23_170816_create_todo_items_table.php
+++ b/database/migrations/2020_06_23_170816_create_todo_items_table.php
@@ -22,7 +22,7 @@ class CreateTodoItemsTable extends Migration
$table->boolean('complete')->default(false);
});
Schema::table('todo_items', function (Blueprint $table) {
- $table->foreign('todo_id')->references('id')->on('todos');
+ $table->foreign('todo_id')->references('id')->on('todos')->onDelete('cascade');
});
}
diff --git a/resources/views/home.blade.php b/resources/views/home.blade.php
index 70e589b..6dda00e 100755
--- a/resources/views/home.blade.php
+++ b/resources/views/home.blade.php
@@ -70,6 +70,46 @@
+
@@ -185,6 +225,8 @@
let todo = null;
let todoItem = null;
+ let todoModalIsShown = false;
+
$(document).bind('keydown', function (e) {
// CTRL + S
if (e.ctrlKey && e.which === 83) {
@@ -200,7 +242,11 @@
// ALT + N
if (e.altKey && e.which === 78) {
- $("#todo-create-modal").modal('show');
+ if (!todoModalIsShown) {
+ $("#todo-create-modal").modal('show');
+ } else {
+ openAddTodoItemModal();
+ }
return false;
}
});
@@ -249,7 +295,7 @@
loadTodoItemList();
$("#todo-view-modal-title").html(t.name);
- $("#todo-view-modal-description").html(t.description);
+ $("#todo-view-modal-description").html((t.description != null && t.description != "") ? todo.description : "
No Description");
$("#todo-view-modal").modal('show');
});
@@ -352,61 +398,188 @@
});
}
+ // Create New Todo Function
+ const createNewTodo = function (e = null) {
+ if (e != null) {
+ e.preventDefault();
+ }
+
+ const name = $("#todo-create-field-name");
+ const description = $("#todo-create-field-description");
+
+ $.ajax({
+ type: "POST",
+ url: "/web/todo",
+ headers: {
+ 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
+ },
+ data: JSON.stringify({
+ "name": name.val(),
+ "description": description.val(),
+ }),
+ contentType: "application/json",
+ dataType: "json",
+ async: true,
+ beforeSend: function () {
+ $("#todo-create-modal-save-loading-indicator").show();
+ $("#todo-create-modal-save-button-label").hide();
+ },
+ success: function (result) {
+ $("#todo-create-modal-save-loading-indicator").hide();
+ $("#todo-create-modal-save-button-label").show();
+
+ name.val(null);
+ description.val(null);
+
+ toastr.success(result.message);
+
+ $("#todo-create-modal").modal('hide');
+
+ loadTodoList();
+ },
+ error: function (result) {
+ $("#todo-create-modal-save-loading-indicator").hide();
+ $("#todo-create-modal-save-button-label").show();
+
+ toastr.error(result.responseJSON.message);
+ }
+ });
+ }
+
+ // Edit Todo
+ const editTodo = function (e = null) {
+ if (e != null) {
+ e.preventDefault();
+ }
+
+ const name = $("#todo-edit-modal-field-name");
+ const description = $("#todo-edit-modal-field-description");
+
+ $.ajax({
+ type: "PUT",
+ url: "/web/todo",
+ headers: {
+ 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
+ },
+ data: JSON.stringify({
+ "id": todo.id,
+ "name": name.val(),
+ "description": description.val(),
+ }),
+ contentType: "application/json",
+ dataType: "json",
+ async: true,
+ beforeSend: function () {
+ $("#todo-edit-modal-save-loading-indicator").show();
+ $("#todo-edit-modal-save-button-label").hide();
+ },
+ success: function (result) {
+ $("#todo-edit-modal-save-loading-indicator").hide();
+ $("#todo-edit-modal-save-button-label").show();
+
+ todo.name = name.val();
+ todo.description = description.val();
+
+ name.val(null);
+ description.val(null);
+
+ toastr.success(result.message);
+
+ $("#todo-view-modal-title").html(todo.name);
+ $("#todo-view-modal-description").html(todo.description);
+
+ $("#todo-edit-modal").modal('hide');
+ $("#todo-view-modal").modal('show');
+
+ loadTodoList();
+ },
+ error: function (result) {
+ $("#todo-edit-modal-save-loading-indicator").hide();
+ $("#todo-edit-modal-save-button-label").show();
+
+ toastr.error(result.responseJSON.message);
+ }
+ });
+ }
+
+ // Open Add Todo Item Modal
+ const openAddTodoItemModal = function () {
+ $("#todo-view-modal").modal('hide');
+ $("#todo-item-create-modal-field-name").focus();
+ $("#todo-item-create-modal").modal('show');
+ }
+
$(document).ready(function () {
+ $('#todo-view-modal').on('shown.bs.modal', function (e) {
+ todoModalIsShown = true;
+ })
+ $('#todo-view-modal').on('hide.bs.modal', function (e) {
+ todoModalIsShown = false;
+ })
// Prepare Data From Backend
loadTodoList();
// Component Initialization
$("#todo-create-modal-save-loading-indicator").hide();
+ $("#todo-edit-modal-save-loading-indicator").hide();
$("#todo-item-create-modal-save-loading-indicator").hide();
$("#todo-item-edit-modal-save-loading-indicator").hide();
// Create Todo Submit Action
- $("#todo-create-modal-form").on("submit", function (e) {
- e.preventDefault();
+ $("#todo-create-modal-form").on("submit", createNewTodo);
- const name = $("#todo-create-field-name");
- const description = $("#todo-create-field-description");
+ // Create Todo by CTRL + ENTER at Todo Description
+ $("#todo-create-field-description").keydown(function (e) {
+ if (e.ctrlKey && e.keyCode == 13) {
+ createNewTodo();
+ }
+ });
+ // Delete Todo Button
+ $("#todo-view-modal-delete-button").on("click", function (e) {
$.ajax({
- type: "POST",
- url: "/web/todo",
+ type: "DELETE",
+ url: "/web/todo/" + todo.id,
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
},
- data: JSON.stringify({
- "name": name.val(),
- "description": description.val(),
- }),
contentType: "application/json",
- dataType: "json",
async: true,
- beforeSend: function () {
- $("#todo-create-modal-save-loading-indicator").show();
- $("#todo-create-modal-save-button-label").hide();
- },
success: function (result) {
- $("#todo-create-modal-save-loading-indicator").hide();
- $("#todo-create-modal-save-button-label").show();
-
- name.val(null);
- description.val(null);
-
- toastr.success(result.message);
-
- $("#todo-create-modal").modal('hide');
-
+ $("#todo-view-modal").modal('hide');
loadTodoList();
},
error: function (result) {
- $("#todo-create-modal-save-loading-indicator").hide();
- $("#todo-create-modal-save-button-label").show();
-
toastr.error(result.responseJSON.message);
}
});
});
+ // Edit Button for Todo
+ $("#todo-edit-modal-form").on("submit", editTodo);
+
+ // Edit Todo by CTRL + ENTER at Todo Description
+ $("#todo-edit-modal-field-description").keydown(function (e) {
+ if (e.ctrlKey && e.keyCode == 13) {
+ editTodo();
+ }
+ });
+
+ // Edit Button for Show Edit Modal
+ $("#todo-view-modal-edit-button").on("click", function () {
+ $("#todo-view-modal").modal('hide');
+ $("#todo-edit-modal").modal('show');
+
+ $("#todo-edit-modal-field-name").val(todo.name);
+ $("#todo-edit-modal-field-description").val(todo.description);
+ });
+
+ // Cancel Edit Todo
+ $("#todo-edit-modal-cancel-button").on("click", function () {
+ $("#todo-edit-modal").modal('hide');
+ $("#todo-view-modal").modal('show');
+ });
+
// Create Todo Item Submit Action
$("#todo-item-create-modal-form").on("submit", function (e) {
e.preventDefault();
@@ -505,10 +678,7 @@
});
// Button Add Todo Item
- $("#todo-view-modal-add-todo-item-button").click(function () {
- $("#todo-view-modal").modal('hide');
- $("#todo-item-create-modal").modal('show');
- });
+ $("#todo-view-modal-add-todo-item-button").click(openAddTodoItemModal);
// Button Cancel On Create Todo Item Modal
$("#todo-item-create-modal-cancel-button").click(function () {