<commit_before><!DOCTYPE html>
<html lang="en">
    <head>
        <title> </title>
        <meta charset="utf-8">

    <style>

button {
	color: #fff;
	font-size: 11px;
  border: none;
}

.container {
  width: 300px;
	margin: 0;
	padding: 0;
}

h1 {
	margin: 0;
	color: #000;
  font-weight: bold;
  font-size: 10pt;
  padding: 0px;
  -webkit-column-break-before: always;
}

.hidden {
	display: none;
}


ul {
	margin: 0;
	padding: 0;
}

li {
	padding: 0px;
	position: relative;
}

li:before {
	position:absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding:10px;
	font-size: 11px;
	text-align: center;
}

.delete {
	background-color: #000;
	margin: 0;
	position: absolute;
	right: 0px;
	top:0px;
}


textarea {
	display: block;
	overflow: auto;
  vertical-align: top;
	margin: 5px;
	padding: 5px;
	font-size: 13px;
}


#add {
	background: #000;
	margin: 0px;
}


    </style>
    </head>
    <body>

      <div class="container">

      			<h1 id="title">Today&rsquo;s Goals</h1>

      			<p id="notice" class="hidden">You have no goals for today.</p>

      			<ul id="list">
      				<li>Buy apples <button class="delete">X</button></li>
      				<li>Buy bananas<button class="delete">X</button></li>
      				<li>Eat apples and bananas <button class="delete">X</button></li>
      			</ul>

      			<textarea id="task-input" name="description" rows="1" placeholder="Enter new goal here"></textarea>

      			<button id="add">Add to list</button>


      </div>


          <script>
          (function() {


            var doc           = document,
                notification  = doc.getElementById("notice").classList,
                addButton     = doc.getElementById("add"),
                listWrapper   = doc.getElementById("list"),
                allItems      = doc.getElementsByTagName("li"),
                allDelButtons	= listWrapper.getElementsByTagName("button"),
                addTask       = function() {

                  var taskItem	= doc.createElement("li"),
                      userInput	= doc.getElementById("task-input").value;

                  if (!userInput.length) {

                    alert("You need to enter a goal first.");

                  } else {

                    taskItem.innerHTML = userInput + " <button class=\"delete\">X</button>";

                    listWrapper.appendChild( taskItem );

                    doc.getElementById("task-input").value = "";

                    loadRemoveOptions();


                    if (allItems.length) {
                      notification.add("hidden");
                    }

                  }

                },
                loadRemoveOptions	= function() {

                  for (var i = 0, l = allItems.length; i < l; i++) {
                    allDelButtons[i].addEventListener("click", removeTask, false);
                  }

                },
                removeTask = function() {

                  var taskToDelete = this.parentNode,
                      confirmRemoval = true;
                      taskToDelete.outerHTML = "";
              };


            loadRemoveOptions();

            addButton.addEventListener("click", addTask, false);

          }());
          </script>

  </body>
</html><commit_msg>todo localstorage<commit_after><!DOCTYPE html>
<html>
<head>

<style>
h1 {
    font-size: 1.5em;
}
ul {
    padding: 10px;
}
.done {
    text-decoration: line-through;
}
</style>

<script type="text/javascript">
function appendTaskToList(val) {
    $('#list').append("<li>" + val + "  <a href='#' class='done-btn'>Done</a> <a href='#' class='cancel-btn'>Cancel Task</a></li>");
}


if (localStorage['tasks']) {
    var tasks = JSON.parse(localStorage['tasks']);
}else {
    var tasks = [];
}

for(var i=0;i<tasks.length;i++) {
    appendTaskToList(tasks[i]);
}

var addTask = function(){
    // get value from #name input
    var val = $('#name').val();

    // add the task to the array
    tasks.push(val);

    // save to local storage
    localStorage["tasks"] = JSON.stringify(tasks);

    // append the name to the list
    appendTaskToList(val);

    // reset the input field and focus it.
    $('#name').val("").focus();
}

$('#add-btn').click(addTask);
$('#name').keyup(function(e){
    if (e.keyCode === 13) {
        addTask();
    }
});


// approach 1
/*$('.done-btn').click(function(){
    $(this).parent('li').addClass('done');
});*/

// correct approach
$('.done-btn').live( 'click', function() {
  $(this).parent('li').addClass('done');
});

$('.cancel-btn').live( 'click', function() {
  $(this).parent('li').fadeOut();
});
</script>
</head>
<body>
  <h1>TodoList</h1>
  <input type='text' id='name' placeholder='<NAME>'>
  <a href='#' id='add-btn'>Add Task</a>
  <ul id='list'>
  </ul>
</body>
</html>
{'fraction_non_alphanumeric': 0.17276166456494324, 'fraction_numerical': 0.011559478772593527, 'mean_word_length': 2.0802588996763753, 'pattern_counts': {'":': 0, '<': 70, '<?xml version=': 0, '>': 68, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '587929', 'n_tokens_mistral': 1636, 'n_tokens_neox': 1498, 'n_words': 323}