Selaa lähdekoodia

Fix up keypresses in dialog box

Enter key:
- If in multi-line text area, let the text area add a newline
- If in single-line text area, let the dialog box be closed

Tab key:
- Try to focus on the next text element
- Fails gracefully if not possible
Bentley James Oakes 7 vuotta sitten
vanhempi
commit
eb9065f755
1 muutettua tiedostoa jossa 39 lisäystä ja 21 poistoa
  1. 39 21
      client/gui_utils.js

+ 39 - 21
client/gui_utils.js

@@ -309,27 +309,21 @@ GUIUtils = function(){
 				
 				return true;
 			}
-            // https://media.giphy.com/media/12XMGIWtrHBl5e/giphy.gif
-			else if( event.keyCode == KEY_ENTER )
-			{
-                if (rows > 1) {
-                    // only for multi-line input fields
-                    var cursorPos = event.target.selectionStart;
-                    input.val( 
-                            input.val().substring(0,cursorPos)+'\r\n'+
-                            input.val().substring(cursorPos));
-                    input.get(0).setSelectionRange(cursorPos+1,cursorPos+1);
+
+            else if (event.keyCode == KEY_ENTER) {
+                //for single row fields, don't create a new line
+                if (rows == 1) {
+                    event.preventDefault();
                 }
-				event.stopPropagation();
-                event.preventDefault();
-				return true;
-			}
+            }
 		});
-        input.keyup( function (event) {
-			if( event.keyCode == KEY_ENTER )
-			{
-				event.stopPropagation();
-                event.preventDefault();
+        input.keyup(function (event) {
+            if (event.keyCode == KEY_ENTER) {
+                //don't send the enter key for multi-line fields
+                //this closes the window
+                if (rows > 1) {
+                    event.stopPropagation();
+                }
             }
         });
 		return input;
@@ -462,8 +456,32 @@ GUIUtils = function(){
 			dialog.append(cancel);
 		}
 
-		BehaviorManager.setActiveBehaviourStatechart(__SC_DIALOG);
-		BehaviorManager.handleUserEvent(__EVENT_SHOW_DIALOG);
+        dialog.keydown(function (event) {
+
+            //tab through the fields
+            if (event.key == "Tab") {
+
+                try {
+                    let table_row = event.target.parentElement.parentElement;
+                    let nextEle = table_row.nextElementSibling;
+
+                    // at end, so select first element
+                    if (nextEle == null) {
+                        nextEle = table_row.parentElement.firstElementChild;
+                    }
+
+                    //get the actual text field
+                    let nextField = nextEle.children[1].children[0];
+                    nextField.focus();
+                } catch (err) {
+                    console.debug("Tab event failed: " + err);
+                }
+
+            }
+        });
+
+        BehaviorManager.setActiveBehaviourStatechart(__SC_DIALOG);
+        BehaviorManager.handleUserEvent(__EVENT_SHOW_DIALOG);
 	};
 	
 	/*