Get_Started_Here.html
- KKozue
Reactor creates its UI controls using the FileMaker Web Viewer. So for each Reactor control, you will draw a Web Viewer in layout mode, and put into the Web Address a Reactor function call (selected from External Functions), with parameters suited to your database.
Simple Example
Helpful Videos:
Creating a Gantt Chart Part 1
Creating a Gantt Chart Part 2
Creating a Gantt Chart Part 3
Web Viewer Settings
In Layout mode, draw a Web Viewer in the position and size you want your BlackBox control to appear. Normally you will set the Web Viewer Line width to “None”.
Put the Reactor BlackBox function, with its parameters changed to contain your field names (or other relevant data), in the Web Address box. In the Web Viewer setup dialog, tick just the first box at the bottom of the dialog:
Field Names
Many of the functions require literal field names (i.e. the field name in quotes) as one or more of the parameters: these are distinctly different from just the fields themselves. In essence Reactor needs to know the name of the field so that the BlackBox control can interact with that field. Therefore you have to pass the field name in quotes and it needs to be the fully qualified Table Occurrence::FieldName form.
Given that you need to pass field names as literal text, you have a choice, either:
Plan on never changing your field names, to avoid breaking your Reactor controls (and any custom web publishing for that matter); OR
if the solution is for FileMaker 10 or greater only, you can use the GetFieldName() function to avoid the problem above. GetFieldName() automatically returns up-to-date names of fields, so if you change any, it will cope. This is definitely the “best practice” as it means you can change field names in your database without breaking your Reactor controls.
Script required for Multi-user solutions
It is possible for Reactor to get stuck (record locked) while trying to update a value, if the record is not committed. This can happen if you are editing a record within the FileMaker layout itself, without the record having been committed, then try to use a control which affects that record.
If the control has trouble writing back to the field, Reactor will try to run a script called "FR_Commit Record", so you need to add a script called that, as shown below. You may need to add a second step to this script to give focus back to the Web Viewer, since the commit record step will take focus away from the Web Viewer.
State
Many Reactor controls have a status parameter which allows you to disable the control (dim it) or even hide it completely. At this time the controls that support the status parameter include Button, PopupMenu, PopupMenuField, LiveField and Slider.
The status parameter is simply literal text “Enabled”, “Disabled” or “Hidden” which can be calculated based on any condition. This is a great way to do validation: the button can be disabled until the data entry is valid at which point the button enables. The record doesn’t have to be committed for these calculations to work - it’s live as the user tabs from field to field. Of course you could abstract and centralise the conditional calculation to a custom function.
If you leave the status parameter out or blank it’ll default to Enabled.
Background Color
The Web Viewer is not transparent, so you are given a choice of background color to avoid a clash with your layout colors. White is the default and many of the common color words are recognised: e.g. Blue, Black, Brown, Green, Gray, Purple, Red etc (all of the CSS color names, which are supported by all major browsers). Alternatively you can denote a color by its RGB values: e.g. “RGB( 255, 0, 0 )” or hex value e.g. “#FF0000”. On a Mac, you can use the utility “DigitalColor Meter” (Applications /Utilities/ DigitalColor Meter) to sample a color on a screen and determine its makeup as an RGB value. To use this application, hover over the color you wish to sample, and note its RGB values.
The following are all equivalent:
Slider ( "Home::Slider" ; "enabled" ; "RGB( 23, 139, 23)" )
Slider ( "Home::Slider" ; "enabled" ; "#008000" )
Slider ( "Home::Slider" ; "enabled" ; "green" )
Note that FileMaker’s own fill color for the Web Viewer cannot be seen in Browse mode, only in Layout mode.
Readability and Comments
Splitting the parameters out over separate lines, and attaching a comment to each line makes for more readable code, and will remind you what each parameter is for. For example:
GanttChart (
GetFieldName ( GanttChart Bars::Start ) ; // start
GetFieldName ( GanttChart Bars::Duration ) ; // duration
GetFieldName ( GanttChart Bars::Color ) // barColor