From 57b2d0d3d43ffa60e47159bba05932f70c6fe6bf Mon Sep 17 00:00:00 2001
From: tsao <tsao@photoshelter.com>
Date: Fri, 27 Jul 2018 14:55:08 -0400
Subject: [PATCH 1/3] Add logic to go up the dom tree until target is a direct
 child of sortable-list. Make hybrid

---
 sortable-list.html | 40 +++++++++++++++++++++++++++++-----------
 1 file changed, 29 insertions(+), 11 deletions(-)

diff --git a/sortable-list.html b/sortable-list.html
index 82c24dd..fc943e0 100644
--- a/sortable-list.html
+++ b/sortable-list.html
@@ -25,6 +25,9 @@
       :host {
         display: block;
       }
+      :host ::slotted(*) {
+        @apply --sortable-list-item;
+      }
     </style>
     <slot></slot>
   </template>
@@ -50,19 +53,29 @@
       evt.preventDefault();
       evt.dataTransfer.dropEffect = "move";
 
-      var current = Number(getIndex(evt.target));
+      // Move up the dom tree until you find the direct child of SORTABLE-LIST
+      var target = evt.target;
+      while(!target.parentNode.tagName !=== 'SORTABLE-LIST') {
+        target = target.parentNode;
+      }
+
+      var current = Number(getIndex(target));
       var move = Number(evt.dataTransfer.getData("index"));
 
       // set the underlying Array model new order
       if (move !== current) {
-
-        var userTemplate = this.querySelector("template[is='dom-repeat']");
-
-        var data = userTemplate.items;
+        var repeat;
+        if(Polymer.Element){
+          // 2.x
+          repeat = this.querySelector('dom-repeat');
+        }else {
+          repeat = this.querySelector("template[is='dom-repeat']");
+        }
+
+        var data = repeat.items;
         var item = data.splice(move, 1);
         data.splice(current, null, item[0]);
-
-        userTemplate.notifySplices('items', [
+        repeat.notifySplices('items', [
           { index: move, removed: [item], addedCount: 0, object: data, type: "splice" },
           { index: current, removed: [], addedCount: 1, object: data, type: "splice" }
         ]);
@@ -91,10 +104,15 @@
 
         this.async(function() {
           self.addEventListener('drop', handledrop, false);
-
-          var template = this.querySelector("template[is='dom-repeat']");
-
-          template.addEventListener('dom-change', function() {
+          var repeat;
+          
+          if(Polymer.Element){
+            // 2.x
+            repeat = this.querySelector('dom-repeat');
+          }else {
+            repeat = this.querySelector("template[is='dom-repeat']";
+          }
+          repeat.addEventListener('dom-change', function() {
             self._addlisteners();
           });
 

From 87c1b1422c9f7587ef74306fa2ca353edebc3394 Mon Sep 17 00:00:00 2001
From: tsao <tsao@photoshelter.com>
Date: Fri, 27 Jul 2018 15:30:39 -0400
Subject: [PATCH 2/3] typo fix

---
 sortable-list.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/sortable-list.html b/sortable-list.html
index fc943e0..12cb509 100644
--- a/sortable-list.html
+++ b/sortable-list.html
@@ -55,7 +55,7 @@
 
       // Move up the dom tree until you find the direct child of SORTABLE-LIST
       var target = evt.target;
-      while(!target.parentNode.tagName !=== 'SORTABLE-LIST') {
+      while(!target.parentNode.tagName !== 'SORTABLE-LIST') {
         target = target.parentNode;
       }
 
@@ -105,12 +105,12 @@
         this.async(function() {
           self.addEventListener('drop', handledrop, false);
           var repeat;
-          
+
           if(Polymer.Element){
             // 2.x
             repeat = this.querySelector('dom-repeat');
           }else {
-            repeat = this.querySelector("template[is='dom-repeat']";
+            repeat = this.querySelector("template[is='dom-repeat']");
           }
           repeat.addEventListener('dom-change', function() {
             self._addlisteners();

From 2d252e657fd81b3abfabe588f821ff23ce4f6acf Mon Sep 17 00:00:00 2001
From: tsao <tsao@photoshelter.com>
Date: Fri, 27 Jul 2018 15:44:18 -0400
Subject: [PATCH 3/3] wip

---
 sortable-list.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/sortable-list.html b/sortable-list.html
index 12cb509..f1fcece 100644
--- a/sortable-list.html
+++ b/sortable-list.html
@@ -55,7 +55,7 @@
 
       // Move up the dom tree until you find the direct child of SORTABLE-LIST
       var target = evt.target;
-      while(!target.parentNode.tagName !== 'SORTABLE-LIST') {
+      while(target.parentNode.tagName !== 'SORTABLE-LIST') {
         target = target.parentNode;
       }