From 3adadcd15582f69221e297e1837da9a3ea693f0b Mon Sep 17 00:00:00 2001
From: kritikaasingh <32594199+kritikaasingh@users.noreply.github.com>
Date: Thu, 3 Oct 2019 13:51:12 +0530
Subject: [PATCH 1/2] Update index.js

---
 spa/index.js | 154 ++++++++++++++++++++++++++++++---------------------
 1 file changed, 91 insertions(+), 63 deletions(-)

diff --git a/spa/index.js b/spa/index.js
index 062d888..18c0b0e 100644
--- a/spa/index.js
+++ b/spa/index.js
@@ -1,67 +1,95 @@
 let todos = [
-  {
-    id: 1,
-    name: "Teach Class at Nagarro",
-    done: true
-  },
-  {
-    id: 2,
-    name: "Get Coffee",
-    done: false
-  }
-];
+    {
+      id: 1,
+      name: "Complete The Budget App",
+      done: false,
+      deadline: new Date(2019, 11, 24)
+    },
+    {
+      id: 2,
+      name: "Fork Github Repository",
+      done: false,
+      deadline: new Date(2019, 10, 11)
+    },
 
-function render(state) {
-  return state
-    .map(todo => {
-      // const li = document.createElement('li')
-      // li.classList.add("striked")
-      // document.body.append(li)
-      const classString = todo.done ? `class = "list-group-item striked"` : `class = "list-group-item"`
-      return `<li data-todo="${todo.id}" ${classString}> ${todo.name} </li>`;
+    {
+      id: 3,
+      name: "Implement Data Structures in java",
+      done: false,
+      deadline: new Date(2019, 10, 11)
+    }
+  ];
+  
+  function render(state) {
+    return state
+      .map(todo => {
+        const classString = todo.done ? `list-group-item striked` : `list-group-item`
+        return `<li data-todo="${todo.id}" class="draggable ${classString}" draggable="true"> ${todo.name} <span style="float: right">${todo.deadline}</span></li>`;
+      })
+      .join("");
+  }
+  
+  
+  function paint() {
+    $("ul").html(render(todos));
+  }
+  
+  function addTodo() {
+    // document.getElementById('newTodo') != $('#newTodo')
+    const inputBox = $('#newTodo')
+    const deadlinedate = $('#newTododate')
+    todos.push({
+      id: todos.length + 1,
+      name: inputBox.val(),
+      done: false,
+      deadline: new Date(deadlinedate.val())
     })
-    .join("");
-}
-
-function paint() {
-  $("ul").html(render(todos));
-}
-
-function addTodo() {
-  // document.getElementById('newTodo') != $('#newTodo')
-  const inputBox = $('#newTodo')
-  todos.push({
-    id: todos.length + 1,
-    name: inputBox.val(),
-    done: false
-  })
-
-  inputBox.val('')
-
-  paint()
-}
-
-
-
-function removeTodos() {
-  todos = todos.filter(todo => !todo.done)
-
-  paint()
-}
-
-
-$('ul').on("click", function (e) {
-  const idToFind = e.target.dataset.todo
-  const todo = todos.find(todo => todo.id == idToFind)
-  todo.done = !todo.done
-
-  paint()
-})
-
-$('#newTodo').on("keypress", function (e) {
-  if (e.which == 13) {
-    addTodo()
+  
+    inputBox.val('')
+    deadlinedate.val('')
+  
+    paint()
   }
-})
-
-paint();
+  
+  
+  
+  function removeTodos() {
+    todos = todos.filter(todo => !todo.done)
+  
+    paint()
+  }
+  
+  function sortTodos() {
+    todos.sort(function (a, b) {
+      return (new Date(a.deadline) - new Date(b.deadline))
+    });
+  
+    paint()
+  }
+  
+  
+  $("#sortable").sortable(function(){
+    
+  });
+  
+  function reset() {
+    $("#newTodo").val('');
+    $("#newTododate").val('');
+  }
+  
+  $('ul').on("click", function (e) {
+    const idToFind = e.target.dataset.todo
+    const todo = todos.find(todo => todo.id == idToFind)
+    todo.done = !todo.done
+  
+    paint()
+  })
+  
+  $('#newTodo, #newTododate').on("keypress", function (e) {
+    if (e.which == 13) {
+      addTodo()
+    }
+  })
+  
+  
+  paint();

From 14922e5c7ec241c196b8f430b02a8cfc8961bc7d Mon Sep 17 00:00:00 2001
From: kritikaasingh <32594199+kritikaasingh@users.noreply.github.com>
Date: Thu, 3 Oct 2019 13:51:53 +0530
Subject: [PATCH 2/2] Update index.html

---
 spa/index.html | 49 +++++++++++++++++++++++++++++++------------------
 1 file changed, 31 insertions(+), 18 deletions(-)

diff --git a/spa/index.html b/spa/index.html
index 36f06aa..3b4793d 100644
--- a/spa/index.html
+++ b/spa/index.html
@@ -1,50 +1,63 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <title>Document</title>
-  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
+  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
 </head>
 <style>
   .striked {
     text-decoration: line-through;
   }
-  ul > li:hover {
+  ul>li:hover {
     cursor: pointer;
   }
 </style>
+
 <body>
   <div class="container mt-5">
     <div class="row">
-      <div class="col-8 form-group">
-          <input class="form-control" id="newTodo" type="text" placeholder="Today i must...">
-          <small class="form-text text-muted">Add a new todo</small>
+      <div class="col-sm-8 col-12 form-group">
+        <div class="row">
+          <div class="col-sm-8 col-6">
+            <input class="form-control" id="newTodo" type="text" placeholder="Add What's On Your Mind...!!">
+          </div>
+          <div class="col-sm-4 col-6">
+            <input class="form-control" id="newTododate" type="date">
+          </div>
+        </div>
+        <small class="form-text text-muted">Add a new todo</small>
       </div>
-      <div class="col-4">
-        <div class="flex-row justify-content-center align-items-center"> 
-          <button class="btn btn-primary mt-1 mt-md-0" onclick="addTodo()">ADD +</button>
-          <button class="btn btn-secondary mt-1 mt-md-0" >Reset</button>
+      <div class="col-sm-3 col-12">
+        <div class="flex-row justify-content-center align-items-center">
+          <button class="btn btn-primary mt-1" onclick="addTodo()">ADD +</button>
+          <button class="btn btn-secondary mt-1" onclick="reset()">Reset</button>
           <button class="btn btn-danger mt-1" onclick="removeTodos()">Bin</button>
+          <button class="btn btn-warning mt-1" onclick="sortTodos()">Sort</button>
         </div>
       </div>
     </div>
-    
+
     <div class="row mt-2">
       <div class="col-10 offset-1">
-          <ul class="list-group">
-        
-            </ul>
+        <ul id = "sortable" class="list-group">
+         
+        </ul>
       </div>
-      
+
     </div>
-    
 
   </div>
 
-
-  <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
+  
   <script src="index.js" defer></script>
 </body>
-</html>
\ No newline at end of file
+
+</html>