From 3638bc5422bd74468af992d95584df66aa809693 Mon Sep 17 00:00:00 2001
From: alexcherman <sashacherman@gmail.com>
Date: Thu, 22 Aug 2019 14:53:02 +0200
Subject: [PATCH] Fix IE 11 issue on wallet page

---
 _layouts/wallet-container.html | 41 ++++++++++++++++++----------------
 _sass/_wallet-selector.scss    |  1 +
 js/main.js                     | 16 ++++++++-----
 js/walletSelector.js           | 19 +++++++++++-----
 4 files changed, 46 insertions(+), 31 deletions(-)

diff --git a/_layouts/wallet-container.html b/_layouts/wallet-container.html
index 6c2eaaf9..6a64b841 100644
--- a/_layouts/wallet-container.html
+++ b/_layouts/wallet-container.html
@@ -224,24 +224,25 @@ max_wallet_text_length: 418  ## Unicode characters
 </div>
 
 <script data-proofer-ignore>
-  var tabSelectors = document.querySelectorAll('.os-selector-tab');
-  var linksList = document.querySelectorAll('.wallet-link');
+  var tabSelectors = Array.prototype.slice.call(document.querySelectorAll('.os-selector-tab'));
+  var linksList = Array.prototype.slice.call(document.querySelectorAll('.wallet-link'));
 
   function selectRelevantTab(os) {
-    tabSelectors.forEach(function(tab) {
+    for (var i = 0; i < tabSelectors.length; i++) {
+      var tab = tabSelectors[i];
       if (tab.dataset.tab === os) tab.classList.add('active');
       else tab.classList.remove('active');
-    });
+    }
 
     var tabContents = document.querySelectorAll('.os-selector-content');
-    tabContents.forEach(function(content) {
+    for (var j = 0; j < tabContents.length; j++) {
+      var content = tabContents[j];
       if (content.dataset.content === os) content.classList.add('visible');
       else content.classList.remove('visible');
-    });
-
+    }
     var walletAccordionButton = document.getElementById('walletAccordionButton');
     var walletAccordion = document.getElementById('walletAccordion');
-    changeAccordionButtonText(walletAccordionButton, os)
+    changeAccordionButtonText(walletAccordionButton, os);
     walletAccordionButton.dataset.buttonOs = os;
     walletAccordion.classList.remove('open');
   }
@@ -253,7 +254,7 @@ max_wallet_text_length: 418  ## Unicode characters
 
     for (var i = 0; i < tabSelectors.length; i++) {
       var tabName = tabSelectors[i].dataset.tab;
-      if (urlPath.includes(tabName)) {
+      if (urlPath.indexOf(tabName) > -1) {
         selectRelevantTab(tabName);
         break;
       }
@@ -271,18 +272,18 @@ max_wallet_text_length: 418  ## Unicode characters
       link.addEventListener('click', function(e) {
         var href = this.getAttribute("href");
         location.href = href + window.location.search;
-        e.preventDefault()
+        e.preventDefault();
       });
     });
 
-    var accordionButtons = document.querySelectorAll('.acc-btn');
+    var accordionButtons = Array.prototype.slice.call(document.querySelectorAll('.acc-btn'));
     accordionButtons.forEach(function(button) {
       button.addEventListener('click', function() {
         this.parentNode.classList.toggle('open');
       });
     });
 
-    var tableSortButtons = document.querySelectorAll('.table-sort-btn');
+    var tableSortButtons = Array.prototype.slice.call(document.querySelectorAll('.table-sort-btn'));
     tableSortButtons.forEach(function(button) {
       button.addEventListener('click', function() {
         sortTableColumn(button.dataset.sort);
@@ -295,9 +296,10 @@ max_wallet_text_length: 418  ## Unicode characters
     var platforms = document.querySelectorAll('[data-tab]');
     var isPlatformSelected = false;
 
-    platforms.forEach(function(platform) {
-      if(filters.includes(platform.dataset.tab)) isPlatformSelected = true;
-    });
+    for (var i = 0; i < platforms.length; i++) {
+      var platform = platforms[i]; 
+      if(filters.indexOf(platform.dataset.tab) > -1) isPlatformSelected = true;
+    }
 
     return isPlatformSelected;
   }
@@ -305,15 +307,16 @@ max_wallet_text_length: 418  ## Unicode characters
   function displaySimilarWallets() {
     var parameters = queryStringToArray();
     if (!checkIfPlatformSelected(parameters)) return;
-
     var currentWalletId = document.querySelector('.wallet').dataset.id;    
-    linksList.forEach(function(link) {
+
+    for (var i = 0; i < linksList.length; i++) {
+      var link = linksList[i];
       var categories = link.dataset.categories.split(' ');
       var linkId = link.dataset.id;
-
+  
       if (checkIfFiltersInclude(categories, parameters) && linkId !== currentWalletId) link.classList.add('visible');
       else link.classList.remove('visible');
-    });
+    }
 
     var visibleWalletsLinks = document.querySelectorAll('.wallet-link.visible');
     var walletsTable = document.querySelector('.wallet-selector-section');
diff --git a/_sass/_wallet-selector.scss b/_sass/_wallet-selector.scss
index 167e9303..cfeb8c34 100644
--- a/_sass/_wallet-selector.scss
+++ b/_sass/_wallet-selector.scss
@@ -280,6 +280,7 @@
 
 .wallet-selector-content {
   width: 100%;
+  max-width: 920px;
 }
 .wallet-selector-title {
   margin: 0 0 40px;
diff --git a/js/main.js b/js/main.js
index d094c67d..a614a5ba 100644
--- a/js/main.js
+++ b/js/main.js
@@ -702,7 +702,7 @@ function updateQueryStringParameter(key, value) {
 function checkIfFiltersInclude(categories, filters) {
   for (var i = 0; i < filters.length; i++) {
     var filter = filters[i];
-    if (!categories.includes(filter) && filter !== '') return false;
+    if (categories.indexOf(filter) === -1 && filter !== '') return false;
   }
   return true;
 }
@@ -715,10 +715,12 @@ function queryStringToArray() {
   var categories = ['platform', 'user', 'important', 'features'];
   var result = [];
   var pairs = location.search.slice(1).split('&');
-  pairs.forEach(function(pair) {
+
+  for (var i = 0; i < pairs.length; i++) {
+    var pair = pairs[i];
     pair = pair.split('=');
-    if (pair[1] && categories.includes(pair[0])) result = result.concat(pair[1].split(','));
-  });
+    if (pair[1] && categories.indexOf(pair[0]) > -1) result = result.concat(pair[1].split(','));
+  }
 
   return result;
 }
@@ -735,9 +737,11 @@ function sortTableColumn(selectedOption) {
   tableAccordion.classList.remove('open');
 
   var tableCells = document.querySelectorAll('.wallet-table-data[data-cell]');
-  tableCells.forEach(function(cell) {
+
+  for (var i = 0; i < tableCells.length; i++) {
+    var cell = tableCells[i];
     if (cell.dataset.cell === selectedOption) {
       cell.classList.remove('hidden');
     } else cell.classList.add('hidden');
-  });
+  }
 }
\ No newline at end of file
diff --git a/js/walletSelector.js b/js/walletSelector.js
index f84796a8..596c103b 100644
--- a/js/walletSelector.js
+++ b/js/walletSelector.js
@@ -183,9 +183,11 @@ function onSkipButtonClick() {
 
 function disableInputs(isDisabled) {
   var checkboxes = document.querySelectorAll('.js-wallet-selector:not(.platform-radio)');
-  checkboxes.forEach(function(checkbox) {
+
+  for (var i = 0; i < checkboxes.length; i++) {
+    var checkbox = checkboxes[i];
     checkbox.disabled = isDisabled;
-  });
+  }
 }
 
 function checkIfPlatformSelected(filters) {
@@ -236,10 +238,12 @@ function displaySelectedOs() {
 
 function displaySelectorSection(relevantSectionName) {
   var sectionsList = document.querySelectorAll('[data-section-name]');
-  sectionsList.forEach(function(section) {
+
+  for (var i = 0; i < sectionsList.length; i++) {
+    var section = sectionsList[i];
     if (section.dataset.sectionName ===  relevantSectionName) section.classList.add('visible');
     else section.classList.remove('visible');
-  });
+  }
 }
 
 function displayRelevantSelectortSection(filters) {
@@ -309,9 +313,12 @@ function displayDiscoverBox(currentStep) {
   
 function collectCheckedInputsValues(selectedInputs) {
   var selectedInputsValues = [];
-  selectedInputs.forEach(function(selectedInput) {
+
+  for (var i = 0; i < selectedInputs.length; i++) {
+    var selectedInput = selectedInputs[i];
     selectedInputsValues.push(selectedInput.value);
-  });
+  }
+  
   return selectedInputsValues;
 }