From bbe689f676c68f619006cad69268cf61aa6f4073 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Tue, 20 Dec 2016 16:44:34 -0800
Subject: [PATCH 1/9] Watch for hover event on each item bullet

See issue #119
---
 public/javascripts/task-dropdown.js    | 7 +++++++
 views/layouts/authenticated-layout.pug | 1 +
 2 files changed, 8 insertions(+)
 create mode 100644 public/javascripts/task-dropdown.js

diff --git a/public/javascripts/task-dropdown.js b/public/javascripts/task-dropdown.js
new file mode 100644
index 0000000..58a77d5
--- /dev/null
+++ b/public/javascripts/task-dropdown.js
@@ -0,0 +1,7 @@
+const taskMenuTriggers = document.querySelectorAll('.item__toggle')
+
+taskMenuTriggers.forEach( trigger => {
+  trigger.addEventListener('mouseenter', event => console.log( 'I AM SO TRIGGERED RIGHT NOW!' ))
+  trigger.addEventListener('mouseout', event => console.log( 'NEVERMIND. I AM CHILLIN' ))
+})
+
diff --git a/views/layouts/authenticated-layout.pug b/views/layouts/authenticated-layout.pug
index ff7a8d6..1f19c6b 100644
--- a/views/layouts/authenticated-layout.pug
+++ b/views/layouts/authenticated-layout.pug
@@ -58,3 +58,4 @@ html
     script(src='/javascripts/starred.js')
     script(src='/javascripts/weekly-review.js')
     script(src='/javascripts/client.js')
+    script(src='/javascripts/task-dropdown.js')

From 23b21384882f0fcde1bd8f78f1c3e780dfc50c71 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Wed, 21 Dec 2016 10:34:36 -0800
Subject: [PATCH 2/9] Create the item-dropdown

- html structure
- styling
---
 public/stylesheets/item-menu.css       | 49 ++++++++++++++++++++++++++
 views/items/item-menu.pug              |  8 +++++
 views/items/mixins.pug                 |  6 ++--
 views/layouts/authenticated-layout.pug |  3 +-
 4 files changed, 63 insertions(+), 3 deletions(-)
 create mode 100644 public/stylesheets/item-menu.css
 create mode 100644 views/items/item-menu.pug

diff --git a/public/stylesheets/item-menu.css b/public/stylesheets/item-menu.css
new file mode 100644
index 0000000..f4d6410
--- /dev/null
+++ b/public/stylesheets/item-menu.css
@@ -0,0 +1,49 @@
+.item__menu {
+  display: none;
+  position: absolute;
+  transform: translateX(-45%);
+  margin-top: 10px;
+  background-color: #e8e8e8;
+  padding: 10px 5px;
+  width: 80px;
+  margin-bottom: 10px;
+  border-radius: 4px;
+  border: 1px solid #bbb ;
+  z-index: 8;
+}
+
+.item__menu::before {
+  content: '';
+  position: absolute;
+  top: -15px;
+  left: 50%;
+  transform: translateX(-50%);
+  border-bottom: 15px solid hsl(0, 0%, 91%);
+  border-left: 15px solid transparent;
+  border-right: 15px solid transparent;
+}
+
+.item__menu ul {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}  
+
+.item__menu li {
+  border-top: 1px solid #bbb;
+  padding: 5px 0;
+}
+
+.item__menu li:hover {
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+.item__menu li:first-child {
+  border-top: none;
+  padding-top: 0;
+}
+
+.item__menu li:last-child {
+  padding-bottom: 0;
+}
diff --git a/views/items/item-menu.pug b/views/items/item-menu.pug
new file mode 100644
index 0000000..4859e9b
--- /dev/null
+++ b/views/items/item-menu.pug
@@ -0,0 +1,8 @@
+item-menu
+  ul
+    li Complete
+    li Add Note
+    li Share
+    li Export
+    li Duplicate
+    li Delete
diff --git a/views/items/mixins.pug b/views/items/mixins.pug
index bf18523..ab9f5f2 100644
--- a/views/items/mixins.pug
+++ b/views/items/mixins.pug
@@ -14,11 +14,13 @@ mixin display( nodes, depth )
       .item__heading(data-id=entry.id, data-completed=entry.completed)
         .item__toggle(aria-hidden='true', data-id=entry.id, data-completed=entry.completed)
           |&#9679;
-        .item__title(data-id=entry.id, data-completed=entry.completed)
+          .item__menu
+            include item-menu.pug
+      .item__title(data-id=entry.id, data-completed=entry.completed, class={completed: entry.completed})
           span(data-id=entry.id)=entry.title
           input.item__edit-title.item--hidden(data-id=entry.id, type='text', name='edit-title', value=entry.title)
       .item__description(data-id=entry.id)
           span(data-id=entry.id)=entry.description
           input.item__edit-description.item--hidden(data-id=entry.id, type='text', name='edit-description', value=entry.description)
       .item__children
-        +display( entry.children, depth + 1 )
\ No newline at end of file
+        +display( entry.children, depth + 1 )
diff --git a/views/layouts/authenticated-layout.pug b/views/layouts/authenticated-layout.pug
index 1f19c6b..9d83e5e 100644
--- a/views/layouts/authenticated-layout.pug
+++ b/views/layouts/authenticated-layout.pug
@@ -14,7 +14,8 @@ html
     link(rel='stylesheet', href='/stylesheets/authenticated.css')
     link(rel='stylesheet', href='/stylesheets/weekly-review.css')
     link(rel='stylesheet', href='/stylesheets/exportmodal.css')
-
+    link(rel='stylesheet', href='/stylesheets/item-menu.css')
+ 
   body
     nav.navbar
       .navbar__header

From b6dcd38be694bfb39192af7cdc7c7e966a5d4882 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Wed, 21 Dec 2016 11:57:56 -0800
Subject: [PATCH 3/9] Reveal item Menu On Bullet Hover

Connect item menu element to event listener
---
 public/javascripts/task-dropdown.js  | 8 ++++++--
 public/stylesheets/authenticated.css | 1 +
 public/stylesheets/item-menu.css     | 5 +++--
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/public/javascripts/task-dropdown.js b/public/javascripts/task-dropdown.js
index 58a77d5..7e6ef11 100644
--- a/public/javascripts/task-dropdown.js
+++ b/public/javascripts/task-dropdown.js
@@ -1,7 +1,11 @@
 const taskMenuTriggers = document.querySelectorAll('.item__toggle')
 
 taskMenuTriggers.forEach( trigger => {
-  trigger.addEventListener('mouseenter', event => console.log( 'I AM SO TRIGGERED RIGHT NOW!' ))
-  trigger.addEventListener('mouseout', event => console.log( 'NEVERMIND. I AM CHILLIN' ))
+  trigger.addEventListener('mouseenter', event => {
+    event.target.children[0].style.display = 'block'
+  })
+  trigger.addEventListener('mouseleave', event => {
+    event.target.children[0].style.display = 'none'
+  })
 })
 
diff --git a/public/stylesheets/authenticated.css b/public/stylesheets/authenticated.css
index 0f1d3a4..dda89b4 100644
--- a/public/stylesheets/authenticated.css
+++ b/public/stylesheets/authenticated.css
@@ -69,6 +69,7 @@
 }
 
 .item__toggle {
+  position: relative;
   display: inline;
   font-size: 14px;
   padding: 0 6px;
diff --git a/public/stylesheets/item-menu.css b/public/stylesheets/item-menu.css
index f4d6410..e4e0488 100644
--- a/public/stylesheets/item-menu.css
+++ b/public/stylesheets/item-menu.css
@@ -1,8 +1,9 @@
 .item__menu {
   display: none;
   position: absolute;
-  transform: translateX(-45%);
-  margin-top: 10px;
+  left: 50%;
+  transform: translateX(-50%);
+  margin-top: 14px;
   background-color: #e8e8e8;
   padding: 10px 5px;
   width: 80px;

From bbb63d4fba880bba85df0548b7c3dbf9de297c42 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Wed, 21 Dec 2016 13:41:39 -0800
Subject: [PATCH 4/9] Pacify the great Jrob

Abide by the canonical code style.
---
 public/javascripts/task-dropdown.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/public/javascripts/task-dropdown.js b/public/javascripts/task-dropdown.js
index 7e6ef11..041239d 100644
--- a/public/javascripts/task-dropdown.js
+++ b/public/javascripts/task-dropdown.js
@@ -1,11 +1,11 @@
-const taskMenuTriggers = document.querySelectorAll('.item__toggle')
+const taskMenuTriggers = document.querySelectorAll( '.item__toggle' )
 
 taskMenuTriggers.forEach( trigger => {
-  trigger.addEventListener('mouseenter', event => {
-    event.target.children[0].style.display = 'block'
+  trigger.addEventListener( 'mouseenter', event => {
+    event.target.children[ 0 ].style.display = 'block'
   })
-  trigger.addEventListener('mouseleave', event => {
-    event.target.children[0].style.display = 'none'
+  trigger.addEventListener( 'mouseleave', event => {
+    event.target.children[ 0 ].style.display = 'none'
   })
 })
 

From 1a3f47fd7e565ca7e2f1ac45eb9e702e94b1e4fd Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Wed, 21 Dec 2016 14:44:05 -0800
Subject: [PATCH 5/9] Correct Mistaken Pug Syntax

Include need no name
---
 views/items/item-menu.pug | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/views/items/item-menu.pug b/views/items/item-menu.pug
index 4859e9b..dd54579 100644
--- a/views/items/item-menu.pug
+++ b/views/items/item-menu.pug
@@ -1,8 +1,7 @@
-item-menu
-  ul
-    li Complete
-    li Add Note
-    li Share
-    li Export
-    li Duplicate
-    li Delete
+ul
+  li Complete
+  li Add Note
+  li Share
+  li Export
+  li Duplicate
+  li Delete

From ef72f0005e4bc73bfd0fccf30b774d9bd5ddf9d7 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Thu, 22 Dec 2016 08:58:44 -0800
Subject: [PATCH 6/9] Added whitespace in task dropdown event listeners

---
 public/javascripts/task-dropdown.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/public/javascripts/task-dropdown.js b/public/javascripts/task-dropdown.js
index 041239d..ee3f115 100644
--- a/public/javascripts/task-dropdown.js
+++ b/public/javascripts/task-dropdown.js
@@ -4,6 +4,7 @@ taskMenuTriggers.forEach( trigger => {
   trigger.addEventListener( 'mouseenter', event => {
     event.target.children[ 0 ].style.display = 'block'
   })
+
   trigger.addEventListener( 'mouseleave', event => {
     event.target.children[ 0 ].style.display = 'none'
   })

From 4a76befcd76a15442794e51c246f8340ec451def Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Wed, 21 Dec 2016 17:53:06 -0800
Subject: [PATCH 7/9] Target Item Accosiated with Menu Clicked From

---
 public/javascripts/items.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/public/javascripts/items.js b/public/javascripts/items.js
index 2c69885..5f65949 100644
--- a/public/javascripts/items.js
+++ b/public/javascripts/items.js
@@ -50,9 +50,12 @@ const descriptionEdited = event => {
 
 const completedClicked = event => {
   const element = $( event.target )
-  const id = element.data( 'id' )
+  const id = element.context.parentNode.parentNode.parentNode
   const completed = ! element.data( 'completed' )
 
+  console.log( id )  
+
+  /*
   fetch( `/items/${id}`, params({ completed: completed } ) )
     .then( result => result.json() )
     .then( checkJsonForSuccessField )
@@ -64,9 +67,8 @@ const completedClicked = event => {
         } else {
           parent.removeClass( 'item__title--completed' )
         }
-      }
-    )
-  }
+    }) */
+}
 
   const getFilterStatus = () => {
     const pageURL= decodeURIComponent(window.location.search)
@@ -133,7 +135,7 @@ $(document).ready( () => {
   $( '.item__title > span' ).click( clickToUpdate( 'item__title' ))
   $( '.item__edit-description' ).keypress( descriptionEdited )
   $( '.item__description > span' ).click( clickToUpdate( 'item__description' ))
-  $( '.item__toggle' ).click( completedClicked )
+  $( '.item__menu ul li:first-child' ).click( completedClicked )
   $( '.dropdown__toggle' ).click( dropdownToggle )
   $( '.star' ).click( starredToggle )
   getFilterStatus()

From 90e2ca6e70b62174037c53a059d9ee5646401ea0 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Thu, 22 Dec 2016 10:37:16 -0800
Subject: [PATCH 8/9] Shift Item Completion Functionality
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

between UI components —from item bullet point
to 'Complete' li in the item menu
---
 public/javascripts/items.js | 7 ++-----
 views/items/item-menu.pug   | 2 +-
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/public/javascripts/items.js b/public/javascripts/items.js
index 5f65949..2007651 100644
--- a/public/javascripts/items.js
+++ b/public/javascripts/items.js
@@ -50,12 +50,9 @@ const descriptionEdited = event => {
 
 const completedClicked = event => {
   const element = $( event.target )
-  const id = element.context.parentNode.parentNode.parentNode
+  const id = element.parent().data().id
   const completed = ! element.data( 'completed' )
 
-  console.log( id )  
-
-  /*
   fetch( `/items/${id}`, params({ completed: completed } ) )
     .then( result => result.json() )
     .then( checkJsonForSuccessField )
@@ -67,7 +64,7 @@ const completedClicked = event => {
         } else {
           parent.removeClass( 'item__title--completed' )
         }
-    }) */
+    }) 
 }
 
   const getFilterStatus = () => {
diff --git a/views/items/item-menu.pug b/views/items/item-menu.pug
index dd54579..426167b 100644
--- a/views/items/item-menu.pug
+++ b/views/items/item-menu.pug
@@ -1,4 +1,4 @@
-ul
+ul(data-id=entry.id)
   li Complete
   li Add Note
   li Share

From a627b1c5e75f0d6213d49963f02e218748b7b2a3 Mon Sep 17 00:00:00 2001
From: TJ Walker <tjfwalker+git@gmail.com>
Date: Thu, 22 Dec 2016 14:19:21 -0800
Subject: [PATCH 9/9] =?UTF-8?q?Refactor=20in=20Observance=20of=20JrobCodeS?=
 =?UTF-8?q?tyle=E2=84=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Conciliate the supreme Jrob =]
---
 public/javascripts/items.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/public/javascripts/items.js b/public/javascripts/items.js
index 2007651..506ac51 100644
--- a/public/javascripts/items.js
+++ b/public/javascripts/items.js
@@ -50,7 +50,7 @@ const descriptionEdited = event => {
 
 const completedClicked = event => {
   const element = $( event.target )
-  const id = element.parent().data().id
+  const id = element.parent().data( 'id' )
   const completed = ! element.data( 'completed' )
 
   fetch( `/items/${id}`, params({ completed: completed } ) )