Merge pull request #1057 from OpenBCI/development

retiutut · web-flow · commit ae85ed2a34c6 · 2022-05-12T09:11:18.000-05:00
Second Team Review of 5.1.0
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -17,6 +17,9 @@
 * Update Band Power widget and add Average Band Power data type to Networking Widget
 * Update ControlP5 Library to 2.3.3 and change ScrollableList behavior to be more consistent with other front-end libraries
 * Remove old multi-line filter buttons in TopNav that draw incorrectly on some PCs #1013
+* Minor UI/UX improvements to Spectrogram widget to increase clarity for all users
+* Add slower options for FFT data smoothing
+* Fix certain Textfield and TextArea fonts not drawing correctly on some Macs
 
 # v5.0.9
 
diff --git a/OpenBCI_GUI/ADS1299SettingsController.pde b/OpenBCI_GUI/ADS1299SettingsController.pde
@@ -387,7 +387,7 @@ class ADS1299SettingsController {
             .setPosition(0, 0)
             .setCaptionLabel("")
             .setSize(120, 20)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
diff --git a/OpenBCI_GUI/ConsoleLog.pde b/OpenBCI_GUI/ConsoleLog.pde
@@ -65,11 +65,11 @@ static class ConsoleWindow extends PApplet implements Runnable {
 
         clipboardCopy = new ClipHelper();
         cp5 = new ControlP5(this);
-
+        PFont textAreaFont = createFont("Arial", 12, true);
         consoleTextArea = cp5.addTextarea("ConsoleWindow")
             .setPosition(0, headerHeight)
             .setSize(width, height - headerHeight)
-            .setFont(p5)
+            .setFont(textAreaFont)
             .setLineHeight(18)
             .setColor(color(242))
             .setColorBackground(color(42, 100))
diff --git a/OpenBCI_GUI/ControlPanel.pde b/OpenBCI_GUI/ControlPanel.pde
@@ -142,11 +142,13 @@ class ControlPanel {
     public void open(){
         isOpen = true;
         topNav.controlPanelCollapser.setOn();
+        topNav.setDropdownMenuIsOpen(true);
     }
 
     public void close(){
         isOpen = false;
         topNav.controlPanelCollapser.setOff();
+        topNav.setDropdownMenuIsOpen(false);
     }
 
     public String getWifiSearchStyle() {
@@ -492,6 +494,7 @@ class SerialBox {
 
     private void createAutoConnectButton(String name, String text, int _x, int _y, int _w, int _h) {
         autoConnectButton = createSBButton(name, text, _x, _y, _w, _h);
+        autoConnectButton.setColorBackground(TURN_ON_GREEN);
         autoConnectButton.onRelease(new CallbackListener() {
             public void controlEvent(CallbackEvent theEvent) {
                 controlPanel.comPortBox.attemptAutoConnectCyton();
@@ -999,7 +1002,7 @@ class WifiBox {
             .setPosition(x + 90, y + 100)
             .setCaptionLabel("")
             .setSize(w - padding*2, 26)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
@@ -1295,7 +1298,7 @@ class SessionDataBox {
             .setPosition(x + 60, y + 32)
             .setCaptionLabel("")
             .setSize(187, 26)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
@@ -2097,7 +2100,7 @@ class GaleaBox {
             .setPosition(x + w - padding*2 - 60*2, y + 16 + padding*2)
             .setCaptionLabel("")
             .setSize(120 + padding, 26)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
@@ -2296,7 +2299,7 @@ class BrainFlowStreamerBox {
             .setPosition(x + padding * 3, y + HEADER_H + padding*2)
             .setCaptionLabel("")
             .setSize(120, OBJECT_H)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
@@ -2327,7 +2330,7 @@ class BrainFlowStreamerBox {
             .setPosition(x + padding*5 + w/2, y + HEADER_H + padding*2)
             .setCaptionLabel("")
             .setSize(50, OBJECT_H)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
@@ -2527,7 +2530,7 @@ class StreamingBoardBox {
             .setPosition(x + padding * 3, y + headerH + padding*2)
             .setCaptionLabel("")
             .setSize(w / 3, objectH)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
@@ -2544,7 +2547,7 @@ class StreamingBoardBox {
             .setPosition(x + padding*5 + w/2, y + headerH + padding*2)
             .setCaptionLabel("")
             .setSize(w / 5 + padding, objectH)
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)
             .setColor(color(26, 26, 26))
             .setColorBackground(color(255, 255, 255)) // text field bg color
diff --git a/OpenBCI_GUI/FilterUI.pde b/OpenBCI_GUI/FilterUI.pde
@@ -315,9 +315,9 @@ class FilterUIPopup extends PApplet implements Runnable {
     private void createAllCp5Objects() {
         calculateXYForHeaderColumnsAndFooter();
         
-        createFilterSettingsSaveButton("saveFilterSettingsButton", "Save Settings", footerObjX[0], footerObjY, headerObjWidth, uiObjectHeight);
-        createFilterSettingsLoadButton("loadFilterSettingsButton", "Load Settings", footerObjX[1], footerObjY, headerObjWidth, uiObjectHeight);
-        createFilterSettingsDefaultButton("defaultFilterSettingsButton", "Reset Settings", footerObjX[2], footerObjY, headerObjWidth, uiObjectHeight);
+        createFilterSettingsSaveButton("saveFilterSettingsButton", "Save", footerObjX[0], footerObjY, headerObjWidth, uiObjectHeight);
+        createFilterSettingsLoadButton("loadFilterSettingsButton", "Load", footerObjX[1], footerObjY, headerObjWidth, uiObjectHeight);
+        createFilterSettingsDefaultButton("defaultFilterSettingsButton", "Reset", footerObjX[2], footerObjY, headerObjWidth, uiObjectHeight);
         
         createOnOffButtons();
         createTextfields();
diff --git a/OpenBCI_GUI/Interactivity.pde b/OpenBCI_GUI/Interactivity.pde
@@ -286,7 +286,7 @@ synchronized void mousePressed() {
             //if clicked out of panel
             else {
                 println("OpenBCI_GUI: mousePressed: outside of CP clicked");
-                controlPanel.isOpen = false;
+                controlPanel.close();
                 topNav.controlPanelCollapser.setOff();
             }
         }
diff --git a/OpenBCI_GUI/OpenBCI_GUI.pde b/OpenBCI_GUI/OpenBCI_GUI.pde
@@ -1007,7 +1007,7 @@ void introAnimation() {
     if ((millis() >= settings.introAnimationInit + settings.introAnimationDuration)
         && controlPanel != null) {
         systemMode = SYSTEMMODE_PREINIT;
-        controlPanel.isOpen = true;
+        controlPanel.open();
     }
     popStyle();
 }
diff --git a/OpenBCI_GUI/PopupMessage.pde b/OpenBCI_GUI/PopupMessage.pde
@@ -74,7 +74,9 @@ class PopupMessage extends PApplet implements Runnable {
             .setFont(p1)
             .toUpperCase(false)
             .setSize(20)
-            .setText(buttonMessage);
+            .setText(buttonMessage)
+            .getStyle()
+            .setMarginTop(-2);
     }
 
     @Override
diff --git a/OpenBCI_GUI/SessionSettings.pde b/OpenBCI_GUI/SessionSettings.pde
@@ -129,7 +129,7 @@ class SessionSettings {
     String[] fftMaxFrqArray = {"20 Hz", "40 Hz", "60 Hz", "100 Hz", "120 Hz", "250 Hz", "500 Hz", "800 Hz"};
     String[] fftVertScaleArray = {"10 uV", "50 uV", "100 uV", "1000 uV"};
     String[] fftLogLinArray = {"Log", "Linear"}; //share this with spectrogram also
-    String[] fftSmoothingArray = {"0.0", "0.5", "0.75", "0.9", "0.95", "0.98"};
+    String[] fftSmoothingArray = {"0.0", "0.5", "0.75", "0.9", "0.95", "0.98", "0.99", "0.999"};
     String[] fftFilterArray = {"Filtered", "Unfilt."};
 
     //Used to set text in dropdown menus when loading Accelerometer settings
@@ -159,7 +159,7 @@ class SessionSettings {
 
     //Used to set text in dropdown menus when loading Spectrogram Setings
     String[] spectMaxFrqArray = {"20 Hz", "40 Hz", "60 Hz", "100 Hz", "120 Hz", "250 Hz"};
-    String[] spectSampleRateArray = {"1 Hz", "5 hz", "10 Hz", "20 Hz", "40 Hz"};
+    String[] spectSampleRateArray = {"30 Min.", "6 Min.", "3 Min.", "1.5 Min.", "1 Min."};
 
     //Load Accel. dropdown variables
     int loadAccelVertScale;
diff --git a/OpenBCI_GUI/TopNav.pde b/OpenBCI_GUI/TopNav.pde
@@ -52,6 +52,8 @@ class TopNav {
     private final int SUBNAV_BUT_H = 26;
     private final int TOPNAV_BUT_H = SUBNAV_BUT_H;
 
+    private boolean topNavDropdownMenuIsOpen = false;
+
     TopNav() {
         int controlPanel_W = 256;
 
@@ -97,7 +99,7 @@ class TopNav {
         if (needToMakeSmoothingButton) {
             int pos_x = (int)filtersButton.getPosition()[0] + filtersButton.getWidth() + PAD_3;
             //Make smoothing button wider than most other topnav buttons to fit text comfortably
-            createSmoothingButton(getSmoothingString(), pos_x, SUBNAV_BUT_Y, SUBNAV_BUT_W + 40, SUBNAV_BUT_H, h4, 14, SUBNAV_LIGHTBLUE, WHITE);
+            createSmoothingButton(getSmoothingString(), pos_x, SUBNAV_BUT_Y, SUBNAV_BUT_W + 48, SUBNAV_BUT_H, h4, 14, SUBNAV_LIGHTBLUE, WHITE);
         }
         
         
@@ -469,7 +471,7 @@ class TopNav {
                 //make Help button and Settings button mutually exclusive
                 if (!tutorialSelector.isVisible) {
                     configSelector.toggleVisibility();
-                }   
+                }
             }
         });
         settingsButton.setDescription("Save and Load GUI Settings! Click Default to revert to factory settings.");
@@ -528,6 +530,14 @@ class TopNav {
         toggleDataStreamingButton.setLock(_b);
         filtersButton.setLock(_b);
     }
+
+    public boolean getDropdownMenuIsOpen() {
+        return topNavDropdownMenuIsOpen;
+    }
+
+    public void setDropdownMenuIsOpen(boolean b) {
+        topNavDropdownMenuIsOpen = b;
+    }
 }
 
 class LayoutSelector {
@@ -621,6 +631,7 @@ class LayoutSelector {
 
     void toggleVisibility() {
         isVisible = !isVisible;
+        topNav.setDropdownMenuIsOpen(isVisible);
         if (isVisible) {
             //the very convoluted way of locking all controllers of a single controlP5 instance...
             for (int i = 0; i < wm.widgets.size(); i++) {
@@ -804,6 +815,7 @@ class ConfigSelector {
 
     void toggleVisibility() {
         isVisible = !isVisible;
+        topNav.setDropdownMenuIsOpen(isVisible);
         if (systemMode >= SYSTEMMODE_POSTINIT) {
             if (isVisible) {
                 //the very convoluted way of locking all controllers of a single controlP5 instance...
@@ -1049,6 +1061,7 @@ class TutorialSelector {
 
     void toggleVisibility() {
         isVisible = !isVisible;
+        topNav.setDropdownMenuIsOpen(isVisible);
         if (systemMode >= SYSTEMMODE_POSTINIT) {
             if (isVisible) {
                 //the very convoluted way of locking all controllers of a single controlP5 instance...
diff --git a/OpenBCI_GUI/W_Accelerometer.pde b/OpenBCI_GUI/W_Accelerometer.pde
@@ -104,7 +104,9 @@ class W_Accelerometer extends Widget {
         }
         
         //ignore top left button interaction when widgetSelector dropdown is active
-        lockElementOnOverlapCheck(accelModeButton);
+        List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+        cp5ElementsToCheck.add((controlP5.Controller)accelModeButton);
+        lockElementsOnOverlapCheck(cp5ElementsToCheck);
         
         if(!accelBoard.canDeactivateAccelerometer() && !(currentBoard instanceof BoardCyton)) {
             accelModeButton.getCaptionLabel().setText("Accel. On");
diff --git a/OpenBCI_GUI/W_AnalogRead.pde b/OpenBCI_GUI/W_AnalogRead.pde
@@ -104,7 +104,9 @@ class W_AnalogRead extends Widget {
         }
 
         //ignore top left button interaction when widgetSelector dropdown is active
-        lockElementOnOverlapCheck(analogModeButton);
+        List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+        cp5ElementsToCheck.add((controlP5.Controller)analogModeButton);
+        lockElementsOnOverlapCheck(cp5ElementsToCheck);
 
         if (!analogBoard.canDeactivateAnalog()) {
             analogModeButton.setLock(true);
diff --git a/OpenBCI_GUI/W_BandPower.pde b/OpenBCI_GUI/W_BandPower.pde
@@ -32,12 +32,15 @@ class W_BandPower extends Widget {
     public ChannelSelect bpChanSelect;
     boolean prevChanSelectIsVisible = false;
 
+    List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+
     W_BandPower(PApplet _parent) {
         super(_parent); //calls the parent CONSTRUCTOR method of Widget (DON'T REMOVE)
 
         //Add channel select dropdown to this widget
         bpChanSelect = new ChannelSelect(pApplet, this, x, y, w, navH, "BP_Channels");
         bpChanSelect.activateAllButtons();
+        cp5ElementsToCheck.addAll(bpChanSelect.getCp5ElementsForOverlapCheck());
         
         //Add settings dropdowns
         addDropdown("Smoothing", "Smooth", Arrays.asList(settings.fftSmoothingArray), smoothFac_ind); //smoothFac_ind is a global variable at the top of W_HeadPlot.pde
@@ -116,6 +119,10 @@ class W_BandPower extends Widget {
         bp_points.add(BETA + 0.5, activePower[BETA], "BETA\n13-32Hz");
         bp_points.add(GAMMA + 0.5, activePower[GAMMA], "GAMMA\n32-100Hz");
         bp_plot.setPoints(bp_points);
+
+        if (bpChanSelect.isVisible()) {
+            lockElementsOnOverlapCheck(cp5ElementsToCheck);
+        }
     } //end of update
 
     void draw() {
diff --git a/OpenBCI_GUI/W_DigitalRead.pde b/OpenBCI_GUI/W_DigitalRead.pde
@@ -93,7 +93,9 @@ class W_DigitalRead extends Widget {
         }
 
         //ignore top left button interaction when widgetSelector dropdown is active
-        lockElementOnOverlapCheck(digitalModeButton);
+        List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+        cp5ElementsToCheck.add((controlP5.Controller)digitalModeButton);
+        lockElementsOnOverlapCheck(cp5ElementsToCheck);
 
         if (!digitalBoard.canDeactivateDigital()) {
             digitalModeButton.setLock(true);
diff --git a/OpenBCI_GUI/W_FFT.pde b/OpenBCI_GUI/W_FFT.pde
@@ -46,12 +46,15 @@ class W_fft extends Widget {
     int FFT_indexLim = int(1.0*xMax*(getNfftSafe()/currentBoard.getSampleRate()));   // maxim value of FFT index
     int yLim = yLimOptions[2];  //maximum value of y axis ... 100 uV
 
+    List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+
     W_fft(PApplet _parent){
         super(_parent); //calls the parent CONSTRUCTOR method of Widget (DON'T REMOVE)
 
         //Add channel select dropdown to this widget
         fftChanSelect = new ChannelSelect(pApplet, this, x, y, w, navH, "BP_Channels");
         fftChanSelect.activateAllButtons();
+        cp5ElementsToCheck.addAll(fftChanSelect.getCp5ElementsForOverlapCheck());
 
         //Default FFT plot settings
         settings.fftMaxFrqSave = 2;
@@ -131,6 +134,10 @@ class W_fft extends Widget {
             flexGPlotSizeAndPosition();
             prevChanSelectIsVisible = fftChanSelect.isVisible();
         }
+
+        if (fftChanSelect.isVisible()) {
+            lockElementsOnOverlapCheck(cp5ElementsToCheck);
+        }
     }
 
     void draw(){
diff --git a/OpenBCI_GUI/W_Focus.pde b/OpenBCI_GUI/W_Focus.pde
@@ -66,14 +66,19 @@ class W_Focus extends Widget {
     private int graphPadding = 30;
     private color cBack, cDark, cMark, cFocus, cWave, cPanel;
 
+    List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+
     W_Focus(PApplet _parent) {
         super(_parent); //calls the parent CONSTRUCTOR method of Widget (DON'T REMOVE)
 
          //Add channel select dropdown to this widget
         focusChanSelect = new ChannelSelect(pApplet, this, x, y, w, navH, "FocusChannelSelect");
         focusChanSelect.activateAllButtons();
+        cp5ElementsToCheck.addAll(focusChanSelect.getCp5ElementsForOverlapCheck());
 
         auditoryNeurofeedback = new AuditoryNeurofeedback(x + PAD_FIVE, y + PAD_FIVE, w/2 - PAD_FIVE*2, navBarHeight/2);
+        cp5ElementsToCheck.add((controlP5.Controller)auditoryNeurofeedback.startStopButton);
+        cp5ElementsToCheck.add((controlP5.Controller)auditoryNeurofeedback.modeButton);
 
         exgChannels = currentBoard.getEXGChannels();
         channelCount = currentBoard.getNumEXGChannels();
@@ -132,10 +137,7 @@ class W_Focus extends Widget {
             predictionExceedsThreshold = metricPrediction > focusThreshold.getValue();
         }
 
-        //ignore top left button interaction when widgetSelector dropdown is active
-        lockElementOnOverlapCheck(auditoryNeurofeedback.startStopButton);
-
-        //put your code here...
+        lockElementsOnOverlapCheck(cp5ElementsToCheck);
     }
 
     public void draw() {
diff --git a/OpenBCI_GUI/W_HeadPlot.pde b/OpenBCI_GUI/W_HeadPlot.pde
@@ -12,7 +12,7 @@
 ///////////////////////////////////////////////////,
 
 
-float[] smoothFac = new float[]{0.0, 0.5, 0.75, 0.9, 0.95, 0.98}; //used by FFT & Headplot
+float[] smoothFac = new float[]{0.0, 0.5, 0.75, 0.9, 0.95, 0.98, 0.99, 0.999}; //used by FFT & Headplot
 int smoothFac_ind = 3;    //initial index into the smoothFac array = 0.75 to start .. used by FFT & Head Plots
 
 class W_HeadPlot extends Widget {
diff --git a/OpenBCI_GUI/W_Networking.pde b/OpenBCI_GUI/W_Networking.pde
@@ -496,7 +496,7 @@ class W_Networking extends Widget {
         cp5_networking.addTextfield(name)
             .align(10,100,10,100)                   // Alignment
             .setSize(120,20)                         // Size of textfield
-            .setFont(f2)
+            .setFont(createFont("Arial", 15, true))
             .setFocus(false)                        // Deselects textfield
             .setColor(color(26,26,26))
             .setColorBackground(color(255,255,255)) // text field bg color
diff --git a/OpenBCI_GUI/W_PulseSensor.pde b/OpenBCI_GUI/W_PulseSensor.pde
@@ -112,7 +112,9 @@ class W_PulseSensor extends Widget {
         }
 
         //ignore top left button interaction when widgetSelector dropdown is active
-        lockElementOnOverlapCheck(analogModeButton);
+        List<controlP5.Controller> cp5ElementsToCheck = new ArrayList<controlP5.Controller>();
+        cp5ElementsToCheck.add((controlP5.Controller)analogModeButton);
+        lockElementsOnOverlapCheck(cp5ElementsToCheck);
 
         if (!analogBoard.canDeactivateAnalog()) {
             analogModeButton.setLock(true);
diff --git a/OpenBCI_GUI/W_Spectrogram.pde b/OpenBCI_GUI/W_Spectrogram.pde
diff --git a/OpenBCI_GUI/W_TimeSeries.pde b/OpenBCI_GUI/W_TimeSeries.pde
diff --git a/OpenBCI_GUI/Widget.pde b/OpenBCI_GUI/Widget.pde

Original file line number	Diff line number	Diff line change
`@@ -286,7 +286,7 @@ synchronized void mousePressed() {`
`286`	`286`	`//if clicked out of panel`
`287`	`287`	`else {`
`288`	`288`	`println("OpenBCI_GUI: mousePressed: outside of CP clicked");`
`289`		`- controlPanel.isOpen = false;`
	`289`	`+ controlPanel.close();`
`290`	`290`	`topNav.controlPanelCollapser.setOff();`
`291`	`291`	`}`
`292`	`292`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1007,7 +1007,7 @@ void introAnimation() {`
`1007`	`1007`	`if ((millis() >= settings.introAnimationInit + settings.introAnimationDuration)`
`1008`	`1008`	`&& controlPanel != null) {`
`1009`	`1009`	`systemMode = SYSTEMMODE_PREINIT;`
`1010`		`- controlPanel.isOpen = true;`
	`1010`	`+ controlPanel.open();`
`1011`	`1011`	`}`
`1012`	`1012`	`popStyle();`
`1013`	`1013`	`}`