From e9aae343883ed49252c8dddbce5d9e7d85a1cdad Mon Sep 17 00:00:00 2001
From: Andrew n marshall <Anm@anm.me>
Date: Thu, 31 May 2018 16:37:09 -0700
Subject: [PATCH] Adaptive popup size for FieldDropdowns (#1897)

Replace the fixed dropdown height with one responsive to the document's viewport.

This is adapted from Bohdan-Tereta's proposed solution:
https://github.com/google/blockly/pull/1483#issuecomment-381638639

It is sub-optimal, in that is does not adapt to field height (variable
due to workspace zoom), and it does not fully utilize the space above
or below the field if the block is near the top or the bottom.
---
 core/css.js            |  3 ---
 core/field_dropdown.js | 11 ++++++-----
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/core/css.js b/core/css.js
index 73da38c43..4a2eca012 100644
--- a/core/css.js
+++ b/core/css.js
@@ -567,9 +567,6 @@ Blockly.Css.CONTENT = [
 
   '.blocklyDropdownMenu {',
     'padding: 0 !important;',
-    /* max-height value is same as the constant
-     * Blockly.FieldDropdown.MAX_MENU_HEIGHT defined in field_dropdown.js. */
-    'max-height: 300px !important;',
   '}',
 
   /* Override the default Closure URL. */
diff --git a/core/field_dropdown.js b/core/field_dropdown.js
index d7f092e05..273a135c6 100644
--- a/core/field_dropdown.js
+++ b/core/field_dropdown.js
@@ -84,10 +84,9 @@ Blockly.FieldDropdown.fromJson = function(options) {
 Blockly.FieldDropdown.CHECKMARK_OVERHANG = 25;
 
 /**
- * Maximum height of the dropdown menu,it's also referenced in css.js as
- * part of .blocklyDropdownMenu.
+ * Maximum height of the dropdown menu, as a percentage of the viewport height.
  */
-Blockly.FieldDropdown.MAX_MENU_HEIGHT = 300;
+Blockly.FieldDropdown.MAX_MENU_HEIGHT_VH = 0.45;
 
 /**
  * Android can't (in 2014) display "▾", so use "▼" instead.
@@ -258,8 +257,10 @@ Blockly.FieldDropdown.prototype.positionMenu_ = function(menu) {
   this.createWidget_(menu);
   var menuSize = Blockly.utils.uiMenu.getSize(menu);
 
-  if (menuSize.height > Blockly.FieldDropdown.MAX_MENU_HEIGHT) {
-    menuSize.height = Blockly.FieldDropdown.MAX_MENU_HEIGHT;
+  var menuMaxHeightPx = Blockly.FieldDropdown.MAX_MENU_HEIGHT_VH
+      * document.documentElement.clientHeight;
+  if (menuSize.height > menuMaxHeightPx) {
+    menuSize.height = menuMaxHeightPx;
   }
 
   if (this.sourceBlock_.RTL) {