13. Using the Web Viewer
Introducing the Web Viewer
The Web Viewer is a layout element that uses the platform’s native Web controls (Internet Explorer on Windows and Safari/Web Kit on OS X) to display web pages.
Although it displays web pages, the Web Viewer is not a browser. Some of a browser’s features, such as built-in history, are not present. However, by the same token, any basic functionality built into the Web controls or added by the user is available. This includes plug-ins such as Flash.
You can use the Web Viewer to display a static address that you hard-code into the layout such as your own website. You can also use the Web Viewer to display data from a URL stored in a given database record—perhaps the home page of a client or a Contact Us page with updated names and phone numbers. You can also use built-in templates to merge a database field, such as a tracking number, with a request to a delivery service to display the delivery status.
The Web Viewer is frequently used in a tab control. It fills with web data when necessary—for example, in a tab control, when its tab is clicked. In general, Web Viewers do not unduly slow down FileMaker, but they do involve Internet access and imaging, both of which can take time. There is no cancel button or feature for the Web Viewer: You simply go to another record, another layout, or another tab. The current Web Viewer will stop loading, and if another one is visible, it will load.
Exploring the Web Viewer in Contacts
You can see Web Viewers in action in Starter Solutions such as Contacts. Figure 13.1 shows an address being typed into the address field of a new record. As soon as you tab or click out of the address field, the Web Viewer maps the address.
Figure 13.1. Start to map an address.
As you tab out of another field, the map may shift, as shown in Figure 13.2.
Figure 13.2. Add the city to the address.
NoteThis behavior of the map is part of the mapping software. In Figure 13.1, it assumed New York City; the correct city (Plattsburgh) is mapped in Figure 13.2. This lets you see that this map is truly being drawn in real time based on the database fields. Your own tests with streets, cities, and states may vary. Main Street can be mapped for many states and for many localities within a given state.
Creating and Editing a Web Viewer
A Web Viewer can display a specific URL that you hard-code in the layout, or it can display dynamic data from the database. Furthermore, you can use a variety of built-in templates in the Web Viewer to construct URLs for a variety of common web destinations such as FedEx tracking, Wikipedia, and the like. All of these techniques are described in this section.
Creating a Web Viewer
To add a Web Viewer to a layout, begin by entering Layout mode. Then, select the Web Viewer tool, as shown in Figure 13.3, and draw the Web Viewer just as you would draw a tab, portal, or other object. Alternatively, you can use Insert, Web Viewer.
Figure 13.3. Add a Web Viewer to a layout.
Either way, the Web Viewer Setup dialog shown in Figure 13.4 opens.
Figure 13.4. Set the web address.
Setting a Web Viewer to a Constant URL
To open a constant URL, simply type it into the Web Address field. When you go back to Browse mode, it opens automatically, provided you have an Internet connection.
The check boxes at the bottom of the Web Viewer Setup dialog are described later in this chapter in the “Setting Web Viewer Options” section, p. 373.
Constructing a URL Dynamically Based on a Search
Another way to build a web address is to interactively search for the data you want to retrieve. For example, you will see a FedEx template, but there isn’t a corresponding UPS tracking template. Go to the UPS site and experiment with tracking a package (you’ll need a valid UPS tracking number to do this). When you have retrieved the data, copy the URL that was generated and use it in a calculation to construct the URL you want to create. Use the calculation text functions, such as Left, Middle, and Right, to replace the tracking number you searched for with data from a field in your database.
Setting Up a Web Viewer with the Templates
The templates in the Web Viewer Setup dialog let you construct complex URLs from templates and specific database fields. You choose the template you are interested in, and the fields it contains are shown at the right of the dialog, as you see in Figure 13.5. For each field, you can select a database field to use or create a calculation for the field.
Figure 13.5. Explore fields in a template.
The default Google template appears quite complex, but if you click the Specify button next to the Web Address calculation field, you can open the Specify Calculation window and add some line feeds to rearrange the calculation, as shown in Figure 13.6.
Figure 13.6. Make the Google mapping template more readable.
Note that all that has been done here is some reformatting. You can see that prompts enclosed as comments (/*Address=*/, for example) have been inserted into the calculation. Because they are comments, they have no effect on the calculation’s evaluation. In fact, if you enter no data at all, this complex calculation does, in fact, produce a Google map.
You can remove the comments and adjust the calculation so that it uses the Contacts Starter Solution fields to map the address already specified in Contact Management, as shown in the following calculation code:
"http://local.google.com/maps?" & "q=" &
"Address=" & Contacts::Work Address 1 & "," &
"City=" & Contacts::Work City & "," &
"State=" & Contacts::State
Whether you modify the web address with the fields at the right or by typing in a calculation for the web address, the result is the same: The Web Viewer displays the data as you specified.
TipKeep in mind that you can specify a URL that does not exist or that contains an error, so be careful when you construct the URL, and always test the resulting Web Viewer.
Setting Web Viewer Options
You can set five Web Viewer options, shown at the bottom of the Web Viewer Setup dialog shown previously in Figure 13.4:
• Allow Interaction with Web Viewer Content—If you turn off this option, the web page displays but no links are active. This can be the appropriate setting if the web page contains static information—for example, a known site’s known page containing contact information. You can “trap” a user there, and the user will not be able to wander off to other places on the Web.
• Display Content in Find Mode—By default, this option is off. When the user is in Find mode, it is often the case that the Web Viewer should be blank. When a Find operation completes, its result can be used to display data in the Web Viewer. However, if the Web Viewer is based on a global or on data that will be entered during the Find setup, you might want to make the Web Viewer active at that time.
• Display Progress Bar—This feature provides a small progress bar across the bottom of the window. It is on by default.
• Display Status Messages—This option controls whether status messages appear. It is on by default.
• Automatically Encode URL—Sometimes, URLs contain characters that are not part of the standard ASCII character set. In such cases, the characters are encoded by specifying the bytes as a number that follows an ampersand (&) or a pound sign (#). FileMaker uses standard encoding practices so that when a space follows & or a number follows #, nothing is changed because these combinations specify nonprinting characters. When a space does not follow & or a number does not follow #, these are assumed to be literal characters, and they are encoded. Typically, you want to enable this option.
Controlling the Web Viewer with the SET WEB VIEWER Script Step
The Web Viewer itself provides no controls, but you can add your own controls. The addition of the Web Viewer to FileMaker layouts was one of the catalysts for providing object names. To control a Web Viewer, you must name it in the Position tab of the Inspector.
Then you can use the Set Web Viewer script step in ScriptMaker to control it, as shown in Figure 13.7.
Figure 13.7. Use the Set Web Viewer script step.
Many of the options are simple—Go Forward, Go Back, and so forth. Reset sets the Web Viewer to its initial URL. You also can specify a URL to go to. If you choose the Go to URL option, the Web Viewer Setup dialog (shown previously in Figure 13.4) opens.
Figure 13.8. Use a script to control the Web Viewer.
Figure 13.8 shows an all-purpose script that you can use for Web Viewer controls. It takes a variety of parameters. Depending on which one is sent, one of the standard actions is performed. Go is used to go to a URL entered in a database field.
For more information on script parameters, see Chapter 16, “Advanced Scripting Techniques.”
For more information on the Inspector and auto-resizing, see Chapter 4, “Working with Layouts.”
FileMaker Extra: Using the Web Viewer for Files
Any URL that can be processed by the appropriate control can be displayed in a Web Viewer. That means you can use a File URL to display files in the Web Viewer. This capability provides an additional way of displaying graphics files in FileMaker. You can add them to container fields themselves, or you can place references to them in container fields. You can also store the file location in a database field either as a File URL or as the filename part of the File URL. Then you can construct a File URL as you want.
For example, Figure 13.9 shows a Web Viewer with a calculated URL based on a path, folder, and filename (the file is one of the illustrations from this book). The calculated filename is shown in Figure 13.9, but you can simply place that calculation inside the Web Viewer itself. If you change the field containing the server address or path, you will quickly pick up another file.
Figure 13.9. Use File URLs to display a file in a Web Viewer.
This technique handles an issue with file references in which they break when the files move. In a case like this, you can store the prefix in a global or database field and then concatenate it with the unchanging filename, as necessary.