Merge pull request #5973 from avalonmediasystem/dropdown_focus

Prevent keyboard opening for playlist dropdown on mobile devices

app/assets/javascripts/player_listeners.js

@@ -17,6 +17,7 @@
 let canvasIndex = -1;
 let currentSectionLabel = undefined;
 let addToPlaylistListenersAdded = false;
+let searchFieldListenerAdded = false
 let firstLoad = true;
 let streamId = '';
 let isMobile = false;
@@ -324,6 +325,23 @@ function addToPlaylistListeners(sectionIds, mediaObjectId) {
     }
   });
 
+  // Set playlist search box to readonly in mobile browsers to prevent
+  // keyboard from popping up when opening playlist dropdown.
+  $('.select2-selection').on("click", function () {
+    const IS_TOUCH_ONLY = navigator.maxTouchPoints && navigator.maxTouchPoints > 2 && !window.matchMedia("(pointer: fine").matches;
+    let searchField = $('.select2-search__field');
+    if ((/Mobi|iPhone/i.test(window.navigator.userAgent) || IS_TOUCH_ONLY) && searchField.length > 0) {
+      searchField.attr('readonly', 'readonly')
+      if (!searchFieldListenerAdded) {
+        searchField.on('click', function(e) {
+          searchField.removeAttr('readonly').select();
+        });
+
+        searchFieldListenerAdded = true
+      }
+    }
+  });
+
   addToPlaylistListenersAdded = true;
 }