From 96b06ad5d8c2f1fe5d539c2b7d6788cc15d5652e Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 15:24:33 -0600 Subject: [PATCH 01/10] Done upto Exercise 2 --- boxes.js | 33 ++++++++++++++++++++++++++++++++- 1 file changed, 32 insertions(+), 1 deletion(-) diff --git a/boxes.js b/boxes.js index 6b2b3db..26ac9c7 100644 --- a/boxes.js +++ b/boxes.js @@ -1 +1,32 @@ -console.log("hello world"); +'use strict'; + +$(function () { + + alert('DOM ready!'); + + var $secret = $('#secretBox'); + $secret.css('background-color', 'white'); + $secret.append('

secret box!

'); + + $('#row1 div').each(function() { + + $(this).toggleClass('boxType3'); + }); + + $('#row4 div:last-child').css('display', 'none'); + + $('.boxType1').each(function() { + + $(this).css('background-color', 'white'); + }); + + $('#row2 div:nth-child(-n+2)').each(function() { + + $(this).removeClass(); + }); + + $('#container div:not(.row)').not('#secretBox').each(function() { + + $(this).css('width', '2px'); + }); +}); From e2a07866de99f8d46f5ca3b43acce3c11ff82d7e Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 15:28:06 -0600 Subject: [PATCH 02/10] 3.1 --- boxes.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/boxes.js b/boxes.js index 26ac9c7..3c85d53 100644 --- a/boxes.js +++ b/boxes.js @@ -29,4 +29,9 @@ $(function () { $(this).css('width', '2px'); }); + + $('#container').on('click', function(event) { + + console.log(event.pageX, event.pageY); + }); }); From fdf89c2b4ca9cd0ab29da28cb029637e6022d783 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 15:32:38 -0600 Subject: [PATCH 03/10] 3.2 done --- boxes.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/boxes.js b/boxes.js index 3c85d53..78db78c 100644 --- a/boxes.js +++ b/boxes.js @@ -34,4 +34,12 @@ $(function () { console.log(event.pageX, event.pageY); }); + + $('.boxType1').append('Click Me'); + + $('a').on('click', function(event) { + + alert('You can never leave!'); + event.preventDefault(); + }); }); From e6b7e576ec66db8ff2b03e4a869c53beba4eaa6b Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 15:38:01 -0600 Subject: [PATCH 04/10] 3.3 done --- boxes.js | 19 +++++++++++++++---- 1 file changed, 15 insertions(+), 4 deletions(-) diff --git a/boxes.js b/boxes.js index 78db78c..495eccd 100644 --- a/boxes.js +++ b/boxes.js @@ -25,10 +25,10 @@ $(function () { $(this).removeClass(); }); - $('#container div:not(.row)').not('#secretBox').each(function() { - - $(this).css('width', '2px'); - }); + // $('#container div:not(.row)').not('#secretBox').each(function() { + // + // $(this).css('width', '2px'); + // }); $('#container').on('click', function(event) { @@ -42,4 +42,15 @@ $(function () { alert('You can never leave!'); event.preventDefault(); }); + + $('.box').on('click', function() { + + if ($(this).hasClass('kitten')) { + $(this).empty(); + } else { + $(this).append(''); + } + + $(this).toggleClass('kitten'); + }); }); From d365871efc37596b5446b6e06b6f59057c1e57e3 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 15:50:42 -0600 Subject: [PATCH 05/10] Finished exercise 3 --- boxes.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/boxes.js b/boxes.js index 495eccd..e46aaa3 100644 --- a/boxes.js +++ b/boxes.js @@ -32,7 +32,17 @@ $(function () { $('#container').on('click', function(event) { + //console.log(event.target === this); console.log(event.pageX, event.pageY); + + if (event.target === this) { + + $(this).css('background-color', 'LimeGreen'); + } else { + + $(this).css('background-color', 'black'); + $(event.target).css('background-color', 'white'); + } }); $('.boxType1').append('Click Me'); From e42659a88b898bbe26ce8cff668f5ac290aa5b54 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 16:02:28 -0600 Subject: [PATCH 06/10] Alittle bigger boxes for 2.6 so that text can fit inside --- boxes.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/boxes.js b/boxes.js index e46aaa3..24d8c3a 100644 --- a/boxes.js +++ b/boxes.js @@ -25,10 +25,10 @@ $(function () { $(this).removeClass(); }); - // $('#container div:not(.row)').not('#secretBox').each(function() { - // - // $(this).css('width', '2px'); - // }); + $('#container div:not(.row)').not('#secretBox').each(function() { + + $(this).css('width', '52px'); + }); $('#container').on('click', function(event) { From 3f758accfbad49e08a1773dedbc16fbebbe57ac8 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 16:06:03 -0600 Subject: [PATCH 07/10] for 2.5 modified to use removeAttr, though I believe it correct, it does not modify the appearance of the elements --- boxes.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/boxes.js b/boxes.js index 24d8c3a..7f91fed 100644 --- a/boxes.js +++ b/boxes.js @@ -22,7 +22,8 @@ $(function () { $('#row2 div:nth-child(-n+2)').each(function() { - $(this).removeClass(); + //$(this).removeClass(); + $(this).removeAttr('style'); }); $('#container div:not(.row)').not('#secretBox').each(function() { From 72b69e52b0a6db2ae89146b161bee062312d3621 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 16:13:52 -0600 Subject: [PATCH 08/10] for 2.6 removed unnecessary each statement --- boxes.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/boxes.js b/boxes.js index 7f91fed..bdf12b2 100644 --- a/boxes.js +++ b/boxes.js @@ -26,10 +26,7 @@ $(function () { $(this).removeAttr('style'); }); - $('#container div:not(.row)').not('#secretBox').each(function() { - - $(this).css('width', '52px'); - }); + $('#container div:not(.row)').not('#secretBox').css('width', '52px'); $('#container').on('click', function(event) { From d2519a585eff22aada0fb0e2ce7cfbd22f199635 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 16:18:03 -0600 Subject: [PATCH 09/10] Refacted some code. --- boxes.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/boxes.js b/boxes.js index bdf12b2..cc0eca5 100644 --- a/boxes.js +++ b/boxes.js @@ -20,11 +20,7 @@ $(function () { $(this).css('background-color', 'white'); }); - $('#row2 div:nth-child(-n+2)').each(function() { - - //$(this).removeClass(); - $(this).removeAttr('style'); - }); + $('#row2 div:nth-child(-n+2)').removeClass(); $('#container div:not(.row)').not('#secretBox').css('width', '52px'); From d62950306eb0eee71b4e1371a1c4dd33142407f2 Mon Sep 17 00:00:00 2001 From: Jeremy Date: Mon, 6 Jun 2016 16:20:11 -0600 Subject: [PATCH 10/10] Refactor and label --- boxes.js | 20 ++++++++++++-------- 1 file changed, 12 insertions(+), 8 deletions(-) diff --git a/boxes.js b/boxes.js index cc0eca5..2cd1863 100644 --- a/boxes.js +++ b/boxes.js @@ -1,29 +1,31 @@ 'use strict'; +// Exercise 1 $(function () { alert('DOM ready!'); + //2.1 var $secret = $('#secretBox'); $secret.css('background-color', 'white'); $secret.append('

secret box!

'); - $('#row1 div').each(function() { - - $(this).toggleClass('boxType3'); - }); + //2.2 + $('#row1 div').toggleClass('boxType3'); + //2.3 $('#row4 div:last-child').css('display', 'none'); - $('.boxType1').each(function() { - - $(this).css('background-color', 'white'); - }); + //2.4 + $('.boxType1').css('background-color', 'white'); + //2.5 $('#row2 div:nth-child(-n+2)').removeClass(); + //2.6 $('#container div:not(.row)').not('#secretBox').css('width', '52px'); + //3.1 && 3.4 $('#container').on('click', function(event) { //console.log(event.target === this); @@ -39,6 +41,7 @@ $(function () { } }); + //3.2 $('.boxType1').append('Click Me'); $('a').on('click', function(event) { @@ -47,6 +50,7 @@ $(function () { event.preventDefault(); }); + //3.3 $('.box').on('click', function() { if ($(this).hasClass('kitten')) {