Skip to content

Controls in Firefly

Aaron Geller edited this page May 27, 2021 · 25 revisions

Flying with the mouse or keyboard

When you launch Firefly in the default configuration, you can use the mouse to rotate your view and zoom in and out. To rotate the view, left click and drag. To zoom, use the mouse wheel (or two-finger scroll). The default view uses the "Trackball controls" from the three.js library. Within this Trackball mode, your center is fixed, but can be moved with a right-click and drag. You are always looking toward that center. And you can rotate your view around that center.

Similar intuitive controls should work on a mobile device, though this has not been fully tested.

If you press the space bar, or use the user interface (see below) to uncheck the center "Lock" button, or you provide your own initial camera rotation using the python tool (see here). You will switch to the "Fly controls" from the three.js library. Fly controls utilize the keyboard:

  • WASD move
  • R|F up|down
  • shift reduces your speed by a factor of 10 (hold shift while pressing another key)

Fly mode gives you more freedom to move about. You are not constrained to a center position as you are in Trackball mode. (If you are in Fly mode, pressing the space bar will switch you to Trackball mode, and vice versa.)

One workflow could be to switch to Fly controls. Fly around to a region of interest. Then press the space bar (or click the "Lock" button on the user interface, see below). This switches you to Trackball mode and locks the center on your region of interest. Within Trackball mode, you can now view that region of interest from any angle, while always facing it.

User Interface

User Interface

Firefly also contains a user interface (pictured above) that enables further control over what data is displayed. (This Controls interface is fully customizable, from within the python data converter; see here).

Within these Controls, you will find various sections that can be expanded by dropdown arrows, and within these sections you will have buttons, sliders and/or input boxes. For all input boxes, you must hit ``enter" on your keyboard for the value to be recorded by Firefly. The various sections of these Controls include the following:

The top bar

This contains the word Controls and an X or "hamburger" symbol. Click in here to show or hide the Controls panel. If you click and drag in the top bar, you can move the Controls panel.

Fullscreen

Click on the green Fullscreen button to resize the window into fullscreen mode. Use the escape key to go back to the previous view.

Take Snapshot

This button will take a snapshot of the current view (without the Controls panel). There are two text boxes with numbers that you can change (here showing 1920, 1200). These define the width and height, respectively of the snapshot. When you click this button, you should be prompted to download the snapshot as a png file. This feature may work best in Firefox.

Save Preset

This button will save a file names "preset.json" to your computer. This preset file contains all the information needed to restart Firefly from the current configuration. In some browsers, this file will be downloaded automatically to your Downloads folder. You can move this file wherever you want, and rename it (but do not change it's contents.)

Reset to Default

Click this button to reset all values to the defaults that were used when Firefly launched.

Reset to Preset

Click this button to reset all values to a preset file that you either created with the python reader (see here), or by clicking the Save Preset button. When you click Reset to Preset, you will be prompted to locate a preset file on your computer. Once you select it, Firefly will reset to the configuration saved in the preset file.

Load New Data

Click this button to select a new data set to display in Firefly. Once clicked, you will be prompted to select a directory on your computer that contains the json files produced by FIREreader.py. Note, after you select the directory, some browsers may show a default warning message that you are about to upload many files to the site and to only do so if you trust the site. Please allow Firefly to upload these files. Also, note that for most browsers, you will only be able to select a directory that is within your data directory. Please keep your json files there.

Camera Controls

Upon startup this sub-panel will be collapsed (of the same size as the previous three buttons). Click on the downward facing arrow on the right side to expand the sub-panel, as shown in the image above. Within the Camera Controls, you will see the current values of the Center, Camera and Rotation. These are updated as you change the view (with your mouse or keyboard; see above). You cannot edit these fields directly.

Next to the Center text boxes, you will see a checkbox labelled "Lock". This will allow you to switch between Trackball and Fly controls. Please see the first section in this page for more details.

Below, you will see three buttons. "Save" allows you to mark the current location, which you can return to if you click the "Reset" button. "Recenter" resets only the center back to the initial value (or the previous save, if clicked).

Below those buttons, is the "Friction" slider and text entry box. For Trackball mode, this controls the rate that the camera stops moving after you release the mouse. For Fly mode this controls the speed that you move around while pressing the keyboard control buttons.

Finally, there is a "Stereo" checkbox, slider and text entry box. If you click the checkbox, the renderer changes to stereoscopic side-by-side mode. The slider and text entry box controls the separation between the cameras in the stereoscopic mode. This can be used with a 3D display and glasses that can overlay the two images to produce a 3D image.

Decimation

Below the Camera Controls is the Decimation slider and text entry box. Larger values of decimation causes less particles to be drawn. (The minimum value is 1.)

Particles

Each particle type will receive it's own control sub-panel. In the example above, we show two different particle types: Gas and Stars. Initially these sub-panels will be collapsed (as shown for Stars above). Within this collapsed view, from left to right, you have a switch to turn the particles on or off, a slider and text box to change the particle size, and a colored box to change the change the particle's color.

If you click on the downward facing triangle on the right side of the sub-panel, you can expand the sub-panel to review additional controls (as shown for Gas above). Within this expanded sub-panel the first item is a slider and text box for "N", which controls the number of particles that will be drawn. (The default is to draw all, and you can slide this to lower values to draw less.) This is analogous to the global Decimation slider, but works on each particle separately.

If you provide velocities to Firefly, you will get controls to "Plot Velocity Vectors", which a checkbox and a dropdown menu. If you click the checkbox, the points will be converted to lines (by default), where the forward direction is whiter, and the backward direction becomes more transparent. You may need to increase the particle size to see the vectors. You can also change the velocity vector plotting style to be either lines, arrows or triangles. (The pointed side of the triangles or arrows point in the direction of the velocity vector.)

If you choose to define Filters within the python script (see here), you will also see a dropdown, slider and text entry boxes for each of the filters you indicated. These filters define what data should be drawn on the screen. The dropdown menu allows you to choose between different filters. The slider and text entry boxes define the limits of the filters. Only particles that have parameters within the black region of the slider will be drawn. If you enter text in the text boxes, the filter slider limits will be redefined.