website: quickview variable selection

Author: huiwanpnnl

docs/guides/quickview/file_selection.md

@@ -16,22 +16,23 @@ from the file system.
 
 ![File loading window](./screenshots/file_loading_dialogue.png){ width="95%", align=center }
 
-The user can single-click a file name and then click the "simulation" or "connectivity"
-button to clarify file type, and repeat these two clicks to have both files specified.
+User can single-click a file name and then click the "simulation" or "connectivity"
+button in the bottom-left corner to clarify file type,
+and repeat these two clicks to have both files specified.
 
 Alternatively, if a filename starts with "connecitivity", then
-the user can double-click the file to have it automatically recognized as a connectivity file.
+the user can **double-click** the file to have it automatically recognized as a connectivity file.
 Double-clicking a filename not starting with "connectivity" will
 have it treated as a simulation file.
 
 After both connectivity and simulation files are selected,
 the `Load Files` button in the bottom-right corner will light up.
-Single-click the button to start file loading.
+A single click will start file loading.
 
 If the files are loaded correctly, the UI will change into a layout like
 the example below, with the [Variable Selection control panel](./variable_selection)
-on the left showing a list of recognized variables in the simulation file(s)
-and the viewport on the right showing a brief introduction to QuickView.
+on the **left** showing a **list of parsed variables** in the simulation file(s)
+and the viewport on the **right** showing a **brief introduction to QuickView**.
 The user can now start to search for and load variables to inspect.
 
 ![File loaded](./screenshots/file_loaded.png){ width="95%", align=center }

docs/guides/quickview/screenshots/variables_none_or_all.png

@@ -1 +1,40 @@
-# Selecting variables for analysis
+# Selecting Variables to Inspect
+
+QuickView's capabilities of variable search and selection
+has been enhanced substantially compared to the earlier version.
+The enhancement was motivated partly by the generalization of
+the tool to handle arbitrarily shaped arrays defined on the cubed sphere,
+and partly due to the wish to help users navigate through simulation
+files containing many (e.g., hundreds of) variables.
+
+Here, we use a file with more than one thousand variables as an example
+to explain the search and selection capabilities.
+
+The left screenshot below shows the Variable Selection panel
+right after the files have been loaded.
+- The checkboxes to the left of each variable name can be used
+  to select or unselect the corresponding variables.
+- The first checkbox, to the left of `Name` and below the eye icon,
+  can be used to select or unselect all variables.
+
+When all variables are selected, we get the right screenshot below.
+- The **wide blue button** at the top of the contol panel indicates there is
+  a total of 1385 variables displayable in the file.
+- The **colorful tabs** correspond to different variable shapes (dimension
+  combinations). The different cominations, as well as the number
+  of displayable variables in each group, are shown in the tabs.
+
+Note that at this point, QuickView has *not* loaded all the variables into memory.
+It has finished a scan and *is ready to load* these variables.
+The user can deselect groups of variables by clicking on the close buttons
+on the right of each tab.
+
+![File loaded](./screenshots/variables_none_or_all.png){ width="95%", align=center }
+
+Talk points:
+
+- filter box; filter by dimension name, dimension combination, and variable name
+- eye icon: cycle through lists of selected, unselected, and all variables in the filtered list.
+- clicking on a tab applys filter by shape combination.
+- close button in filter box clears filter (make cross always visible) 
+