From 2beb75b3c1f66b7460413df98290daaf52c62e02 Mon Sep 17 00:00:00 2001 From: Chris Trevino Date: Tue, 24 Mar 2020 19:41:52 -0500 Subject: [PATCH 1/4] changes --- 01week/helloworld.js | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 01week/helloworld.js diff --git a/01week/helloworld.js b/01week/helloworld.js new file mode 100644 index 000000000..3ae23b3df --- /dev/null +++ b/01week/helloworld.js @@ -0,0 +1,3 @@ +node"use strict" + + console.log("Hello World!"); \ No newline at end of file From 3f482adfbd35066151f2223268150c73b8f13974 Mon Sep 17 00:00:00 2001 From: Chris Trevino Date: Tue, 24 Mar 2020 19:49:19 -0500 Subject: [PATCH 2/4] 1stprogram --- 01week/helloworld.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/01week/helloworld.js b/01week/helloworld.js index 3ae23b3df..8274abb6f 100644 --- a/01week/helloworld.js +++ b/01week/helloworld.js @@ -1,3 +1,3 @@ -node"use strict" +"use strict" console.log("Hello World!"); \ No newline at end of file From 710f89644f0c361f0194ccf1726fa92216d21e09 Mon Sep 17 00:00:00 2001 From: Chris Trevino Date: Wed, 8 Apr 2020 10:05:56 -0500 Subject: [PATCH 3/4] updates --- 03week/toDo.js | 65 ++++++++++++++++++++++++++++++++++++++++++++++++ 03week/todo.html | 24 ++++++++++++++++++ 2 files changed, 89 insertions(+) create mode 100644 03week/toDo.js create mode 100644 03week/todo.html diff --git a/03week/toDo.js b/03week/toDo.js new file mode 100644 index 000000000..83aa35ac2 --- /dev/null +++ b/03week/toDo.js @@ -0,0 +1,65 @@ + console.log("Loaded todo.js file"); + + // when the add button gets clicked + // append the text to the button of the list + + let addButton = document.getElementById('addButton'); //<= this is grabbing element id add button/HTML + addButton.addEventListener('click', function () { + console.log("clicked the add button") ; + //read the value from the input box + let inputElement = document.getElementById('inputText') ; + let todoText = inputElement.value; + inputElement.value = ''; + + //create an li element + let li = document.createElement('li'); + + //create a span element + let span = document.createElement('span'); + //update the inner text of the span element + span.innerText = todoText; + + //create a delete button + let deleteButton = document.createElement('button'); + //update the inner text of the delete button + deleteButton.innerHTMl = 'delete'; + //add a class to the delete button + deleteButton.classList.add('delete'); + + //add the li to the button of the ul element + let ul = document.querySelector('ul'); + ul.appendChild(li) + + //add the span and the delete button as children of the newly created li + li.appendChild(span); + setupSpanEvent(span); + li.appendChild(deleteButton); + setupDeleteEvent(deleteButton); + + + }) + + //when a delete button get clicked + //delete its parent list item + + let allDeletes = document.querySelectorAll('delete'); + for(let i=o; i < allDeletes.length; i++) { + let deleteButton = allDeletes[i]; + setupDeleteEvent(deleteButton); + + } + + function setupDeleteEvent(deleteButton){ + deleteButton.addEventListener('click', function(){ + console.log('Delete got clicked, parent li is' , deleteButton.parentElement) ; + let parentLi = deleteButton.parentElement; + parentLi.remove(); + let parentUl = parentLi.parentElement; + console.log('The parent UL:', parentUl); + parentUl.removeChild(parentLi); + + }); + } + + + diff --git a/03week/todo.html b/03week/todo.html new file mode 100644 index 000000000..fa850a303 --- /dev/null +++ b/03week/todo.html @@ -0,0 +1,24 @@ + + + + + + To Do List + + +

The Best ToDo Tracker

+
+
    + +
+
+ + + + + \ No newline at end of file From b818a4e77a444706270bf043cc774f42a7c78e1d Mon Sep 17 00:00:00 2001 From: Chris Trevino Date: Wed, 8 Apr 2020 11:27:09 -0500 Subject: [PATCH 4/4] changes --- 03week/toDo.js | 34 +++++++++++++++++++++++++++------- 1 file changed, 27 insertions(+), 7 deletions(-) diff --git a/03week/toDo.js b/03week/toDo.js index 83aa35ac2..66ebf56ea 100644 --- a/03week/toDo.js +++ b/03week/toDo.js @@ -21,10 +21,12 @@ //create a delete button let deleteButton = document.createElement('button'); + //add the size if the button but thanks to google i figured it out + deleteButton.style.width = 'fit-content'; //update the inner text of the delete button - deleteButton.innerHTMl = 'delete'; + deleteButton.innerText = "delete"; //add a class to the delete button - deleteButton.classList.add('delete'); + deleteButton.classList.add("delete"); //add the li to the button of the ul element let ul = document.querySelector('ul'); @@ -51,15 +53,33 @@ function setupDeleteEvent(deleteButton){ deleteButton.addEventListener('click', function(){ - console.log('Delete got clicked, parent li is' , deleteButton.parentElement) ; + console.log('Delete got clicked, parent li is', deleteButton.parentElement) ; let parentLi = deleteButton.parentElement; parentLi.remove(); - let parentUl = parentLi.parentElement; - console.log('The parent UL:', parentUl); - parentUl.removeChild(parentLi); + // let parentUl = parentLi.parentElement; + // console.log('The parent UL:', parentUl); + // parentUl.removeChild(parentLi); }); } - + //when the span is clicked + //class done should be added to it + + let allSpans = document.querySelectorAll("span") ; + //console.log("Alls spans:", allSpans); + for(let i = 0; i < allSpans.length; i++) { + let span = allSpans[i]; + setupSpanEvent(span); + + } + + //this function add a click event to the span + function setupSpanEvent(span) { + span.addEventListener('click', function() { + console.log("this span got clicked", span); + span.classList.toggle ("done"); + }) + } +