Fixing buggy behavior with dropdowns on touch devices / responsive windows

3 files changed, 12 insertions, 7 deletions

diff --git a/src/main/resources/ui/sqlfiddle/www/css/fiddle_bootstrap_overrides.less b/src/main/resources/ui/sqlfiddle/www/css/fiddle_bootstrap_overrides.less
index 8fad26f..0618745 100644
--- a/src/main/resources/ui/sqlfiddle/www/css/fiddle_bootstrap_overrides.less
+++ b/src/main/resources/ui/sqlfiddle/www/css/fiddle_bootstrap_overrides.less
@@ -1,4 +1,9 @@
 
+// bug with dropdowns on touch devices, ref: http://stackoverflow.com/a/17632577/808921
+.dropdown-backdrop{
+    position: static;
+}
+
 /* Bootstrap overrides */
 
 
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js
index dccfe37..a41dff7 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js
@@ -7,11 +7,11 @@ define (["jquery", "Backbone", "Handlebars", "text!fiddle_backbone/templates/dbT
             this.compiledTemplate = Handlebars.compile(dbTypesTemplate);
         },
         events: {
-            "click ul.dropdown-menu li": "clickDBType"
+            "click ul.dropdown-menu a": "clickDBType"
         },
         clickDBType: function (e) {
             e.preventDefault();
-            this.collection.setSelectedType(parseInt($(e.currentTarget).attr("db_type_id")));
+            this.collection.setSelectedType(parseInt($(e.currentTarget).parent('li').attr("db_type_id")));
         },
         render: function () {
             var selectedDBType = this.collection.getSelectedType();
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/main.js b/src/main/resources/ui/sqlfiddle/www/javascript/main.js
index 8e5ef07..48ffb03 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/main.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/main.js
@@ -237,13 +237,13 @@ require([
     /* COLLAPSING NAV (for responsive UI) */
 
     $(".nav").on('click', 'a', function (e) {
-        if ($(this).parent('li').attr('id') !== 'db_type_id') {
-            $(".nav-collapse.in").collapse('hide');
-        }
-    });
-
 
+        if ($(this).parent('li').attr('id') !== 'db_type_id' &&
+            $(this).parent('li').attr('id') !== 'userOptions') {
 
+            $(".nav-collapse.in").collapse('hide');
 
+        }
+    });
 
 });