From 39545dc7137e3439062af8eeff7995dc1b7e7336 Mon Sep 17 00:00:00 2001 From: manjesh317 <42302544+manjesh317@users.noreply.github.com> Date: Tue, 8 Oct 2019 17:06:26 +0530 Subject: [PATCH 1/2] Update index.html --- spa/index.html | 61 ++++++++++++++++++++++++++------------------------ 1 file changed, 32 insertions(+), 29 deletions(-) diff --git a/spa/index.html b/spa/index.html index 36f06aa..d4a32d2 100644 --- a/spa/index.html +++ b/spa/index.html @@ -1,3 +1,5 @@ + + @@ -14,37 +16,38 @@ ul > li:hover { cursor: pointer; } + #button{ +display: inline-block; +background-color:#fc999b; +color:#ffffff; +border-radius: 5px; +text-align:center; +margin-top:2px; +padding: 5px 15px; +} -
-
-
- - Add a new todo -
-
-
- - - -
-
-
- -
-
-
    - -
-
- -
- - -
- - + + +
+

ToDo List

+

double click to cross an item off.

+ +
+ +
+ +
Add
+
+
    + + + +
    + + + - \ No newline at end of file + From 68eea5e4979fea305ed33abd92ca41d056a4d4c3 Mon Sep 17 00:00:00 2001 From: manjesh317 <42302544+manjesh317@users.noreply.github.com> Date: Tue, 8 Oct 2019 17:13:31 +0530 Subject: [PATCH 2/2] Update index.js --- spa/index.js | 93 +++++++++++++++------------------------------------- 1 file changed, 26 insertions(+), 67 deletions(-) diff --git a/spa/index.js b/spa/index.js index 062d888..c57903b 100644 --- a/spa/index.js +++ b/spa/index.js @@ -1,67 +1,26 @@ -let todos = [ - { - id: 1, - name: "Teach Class at Nagarro", - done: true - }, - { - id: 2, - name: "Get Coffee", - done: false - } -]; - -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 `
  1. ${todo.name}
    2. `; - }) - .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() - } -}) - -paint(); +$(document).ready( + function(){ + $('#button').click( + function(){ + var toAdd = $('input[name=ListItem]').val(); + $('ol').append('
  2. ' + toAdd + '
    3. '); + }); + + $("input[name=ListItem]").keyup(function(event){ + if(event.keyCode == 13){ + $("#button").click(); + } + }); + + $(document).on('dblclick','li', function(){ + $(this).toggleClass('strike').fadeOut('slow'); + }); + + $('input').focus(function() { + $(this).val(''); + }); + + $('ol').sortable(); + + } +);