General

A question was recently posted about the limitation of FileMaker’s native scripting which only allows importing single images from a mobile device’s camera app. Using a WebView and simple JavaScript, we can utilize a HTML form which can import multiple images. Those images are then converted to Base64 text and passes to a FileMaker Script which then parses them out into multiple records. This method will work in the FileMaker app, in FileMaker Go, or in WebDirect for iOS and Android users.

I started out by searching for a suitable form and existing JavaScript for the image capture. I found a lot of samples, but had issue getting JS file objects converted over to Base64. This sample was perfect as it already had code which turned the images into JSON and Base64 which would be super easy to parse in my FileMaker script.

I created a simple database to store the HTML data which the webview would render. I then added another field for the actual images. When the form is submitted, it calls FileMaker.PerformScriptWithOption and passes the JSON data. The FM script then performs some substitution on the form data so it parses properly so that it can decode the Base64 data into the container field.

You can download our sample file here. The file has a default user/pass of admin/admin.

Another option to research for multiple uploads is elemental_dropzone. Usability is similar for file browser image selection, but the JavaScript looks to be more complex.

Contact us if you’d like to discuss any of your complex FileMaker Pro needs!

6/8/2023 – Sample file updated, initial version only properly parsed PNG images, now parses JPEG files too.

We recently did a project where HTML emails were generated with a list of stops for a delivery route. During the testing phase, we found that creating map links across devices was not so simple.

Apple Maps Link

Apple’s iOS URL handler is maps: but the preferred method is to use https://maps.apple.com/ with the location data. If you use this URL instead, it will open in the Apple Maps app on iOS/macOS or redirect to Google Maps on Windows/Android.

To display a map for a specific address, you would use a link like <A href=”http://maps.apple.com/?address=1,Infinite+Loop,Cupertino,California”>Map</A>

To display a map with a given latitude and longitude, you would use a link like <A href=”http://maps.apple.com/?ll=50.894967,4.341626″>Map</A>

For more information on Apple Maps links, check out the Apple Developer Documentation.

Google Maps Link

Sometimes mobile users don’t like the Apple Maps application and would prefer to use Google Maps instead. On iOS, there is no way to set a default Maps application so the workaround is to use a universal URL, simpliar to the Apple Maps URL. If the Google Maps app is installed on iOS or Android, the link will open in the app, otherwise it will open the map in the default web brower.

To display a map for a specific address, you would use a link like <A href=”https://www.google.com/maps/search/?api=1&query=1,Infinite+Loop,Cupertino,California”>Map</A>

To display a map with a given latitude and longitude, you would use a link like <A href=”https://www.google.com/maps/search/?api=1&query=50.894967%2C4.341626″>Map</A>

For more information on Google Maps links, check out the Google Maps Platform Documentation.

Encoding

Note that all maps links should be properly URL encoded. Each mail application handles links differently and you must encode or you may face issues. If you are using Claris FileMaker Pro, a function like GetAsURLEncoded can be used to encode your link data.

Preferences are always nice

If possible, add a preference for each email recipient so that you can dynamically create the map link based on their desired map provider.

While our primary development efforts at NRG revolve around shipping and carrier APIs, we often assist other Claris developers with projects related to other APIs. Contact our sales department for more information on our custom development services.