From 4d514c2f37e2cbab0fb032bc166ea7b453c9ca6e Mon Sep 17 00:00:00 2001
From: Adam Goldsmith <adam@adamgoldsmith.name>
Date: Thu, 21 Sep 2017 13:10:00 -0400
Subject: [PATCH] Provide a search box for filtering cards in pile list

---
 script.js | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/script.js b/script.js
index d0244ea..6f1c37d 100644
--- a/script.js
+++ b/script.js
@@ -89,7 +89,24 @@ interact('.card-pile')
   })
   .on('hold', event => {
     let pile = piles[event.target.getAttribute('data-pile')];
+    let searchBox = document.createElement('input');
+    let container = document.createElement('div');
     let cardList = document.createElement('div');
+    searchBox.setAttribute('type', 'search');
+    searchBox.setAttribute('placeholder', 'Filter');
+    searchBox.addEventListener('input', event => {
+      for (var ii = 0; ii < cardList.children.length; ii++) {
+        let input = event.target.value;
+        let cardNum = parseInt(cardList.children[ii].getAttribute('data-num'));
+        let cardData = deckJSON.ObjectStates[0].ContainedObjects.find(c => c.CardID === (cardNum + 100));
+        cardList.children[ii].style.display =
+          (cardData.Nickname.toLowerCase().includes(input.toLowerCase()) ||
+           cardData.Description.toLowerCase().includes(input.toLowerCase())) ?
+          "": "none";
+      }
+    });
+    container.appendChild(searchBox);
+
     pile.forEach(cardNum => {
       let newCard = makeCard(cardNum);
       newCard.classList.add('in-list');
@@ -113,7 +130,8 @@ interact('.card-pile')
       }, {once: true});
       cardList.appendChild(newCard);
     });
-    showModal(cardList);
+    container.appendChild(cardList);
+    showModal(container);
   })
   .on('tap', event => shuffle(piles[event.target.getAttribute('data-pile')]));