IU-DATA

Progress Button

1 - Presentation & features

This add-on allows you to add a button with a progress indication during the execution of your procedure linked to it.

Simply made with a web viewer, it is possible to configure the web viewer completely independently with a simple copy and paste. Responsive, the size is determined by the size of the web viewer.

Features :

This add-on uses the JavaScript libraries ladda.js and spin.js.

2 - Installation / Configuration / Parameters

2.1 Installation

  1. Close FileMaker Pro

  2. Copy the folder IUD_ProgressButton_v1_AddOn to the following directory :

     - macOs : ~/Library/Application Support/FileMaker/Extensions/AddonModules/
 - Windows : AppData\Local\FileMaker\Extensions\AddonModules\

  3. In FileMaker Pro, open the solution on which you want to add the Add-On

  4. In layout mode, open the left side panel on the Add-ons tab, click on the button add  

  5. Under the IU-DATA category, select Progress Button then click on Choose  

  6. Drag and drop the Progress Button add-on on the layout where you want to add-it.

2.1 Configuration

The add-on can work without any context thanks by using the global field IUD_ProgressButton::gct_WV_FinalCode.

  1. Copy and paste the web viewer containing the add-on calculation formula on the desired model.

  2. Modify the parameter _webViewerName inside the web viewer's calculation, to specify your web viewer's name

  3. Modify the parameter _scriptFMPToCall inside the web viewer's calculation, to specify FileMaker's script name to call

  4. Modify the other parameters.

Example of code associated with the web viewer :

Let (
[
_code = z_IUD_PROGRESSBUTTON::gct_WV_FinalCode;
_WebViewerName = "WV_ProgressButton";
_ScriptFMPToCall = "IUD_fmps_ProgressButton_action" ;

_button_Effect = "slide-down" ;
_button_Progress = 1 ;
_button_Color = "custom" ;
_button_Custom_Color = "#9AD0C0" ;
_button_Progress_Custom_Color = "#E1DD14" ;
_button_BorderRadius = 0 ;

_text = "IU-DATA" ;
_text_Size = "14vw" ;
_text_Weight = "normal" ;
_text_Color = "#FFFFFF" ;

_body_BackgroundColor = "#ffffff" ;

_button_Custom_Color_Hover = IUDATA_LightenColorHEX ( _button_Custom_Color ; 21 ) ;

_finalCode = Substitute ( _code ; 

		["{{button_Effect}}" ; _button_Effect ];
		["{{button_Color}}" ; _button_Color ];
		["{{button_Custom_Color}}" ; _button_Custom_Color ];
		["{{button_Custom_Color_Hover}}" ; _button_Custom_Color_Hover ];
		["{{button_Progress_Custom_Color}}" ; _button_Progress_Custom_Color ];
		["{{button_BorderRadius}}" ; _button_BorderRadius ];

		["{{WebViewerName}}" ; _WebViewerName ];
		["{{ScriptFMPToCall}}" ; _ScriptFMPToCall ];
		["{{isProgress}}" ; _button_Progress ];

		["{{text}}" ; _text ];
		["{{text_Color}}" ; _text_Color ];
		["{{text_Weight}}" ; _text_Weight ];
		["{{text_Size}}" ; _text_Size ];

		["{{body_backgroundColor}}" ; _body_BackgroundColor ]
)

]
;
"data:text/html;charset=utf-8,¶" & _finalCode
)

Please note : If your database on which you want to install the add-on is hosted with FileMaker Server. You might need to refresh the globale calculation field IUD_ProgressButton::gct_WV_FinalCode. Otherwise the webviewer that contains the add-on will remain empty. To refresh this field, you can set the field IUD_ProgressButton::WV_HTML by it's own value inside a script that is launch at the start of your application.

2.2 Parameters

Editable parameter values :

⚠️   if you modify the names of the parameters, you will have to report your modifications to _finalCode if necessary

⚠️   Parameters not to be modified :

3 - Tables / Scripts / Custom functions / Value lists

3.1 - Tables

3.2 - Scripts

3.3 - Custom functions

The following functions description can be found inside their calculation definition.

3.4 - Value lists

4 - Dependencies

Ladda 0.9.8 ( Licence MIT )

https://lab.hakim.se/ladda

Spin ( Licence MIT )

https://lab.hakim.se/ladda

5 - Compatibility

Operating systems :

FileMaker :

FileMaker WebDirect :

Please note that on FileMaker Go 19 the Progress Button activation inside the web viewer require a double tap.

6 - End User Licence Agreement

Important Note: Please read this EULA carefully. Downloading, installing, using or modifying this add-on signifies that the end user and their organization accept this EULA.

Definitions :

Contract terms :
IU-DATA authorizes the end user and his organization or household to use, modify, copy the add-on at their convenience. IU-DATA authorizes the end user and his organization to use for commercial purposes the add-on, when the add-on is an integral part of a solution whose spectrum of use is much wider than that defined by the functionalities of the add-on alone. On the other hand, IU-DATA does not authorize the end user and his organization to use for commercial or distribution purposes the add-on, modified or not as a final product.

The end user and his organization / household have free assistance for a period of 2 months from the date of purchase of this add-on, for any questions related to the use and configuration of this add-on.
Full access to FileMaker sources as well as to the source code used in the web viewer gives to the end user and his organization / household full control over modifying this add-on. It is therefore natural that we cannot intervene free of charge on the add-on whose code has been altered compared to the original version that IU-DATA delivered. Likewise, IU-DATA cannot be held responsible for any malfunction of any libraries mentioned in paragraph 4 - Dependencies, as well as malfunctions of the add-on following use on an operating system or a FileMaker platform other than those mentioned in paragraph 5 - Compatibilities.

Contact :
For any questions, please contact us to this address: product@iu-data.com

7 - Realization

Creation and development :

Icon design :

8 - Change Log

01/03/2022 - Progress Button v2.0.0 - Add FileMaker WebDirect Compatibilty

16/02/2021 - Progress Button v1.0.0 - 1st release


© IU-DATA 2021