Monkeybread Software - MBS FileMaker Plugin: JSON to HTML

Components	All	New	MacOS		Windows		Linux		iOS
Examples	Mac & Win		Server	Client	Guides	Statistic	FMM	Blog	Deprecated	Old

MBS FileMaker Plugin Example Databases

JSON to HTML

All examples are included with download of MBS FileMaker Plugin.

JSON to HTML.fmp12

Overview
Tables	1
Relationships	0
Layouts	1
Scripts	4
Value Lists	0
Custom Functions	0
Custom Menus	24

File Options
Default custom menu set	[Standard FileMaker Menus]
When opening file
Minimum allowed version	12.0
Login using	Account Name; Account= Admin
Allow user to save password	Off
Require iOS passcode	Off
Switch to layout	Off
Hide all toolbars	Off
Script triggers
OnFirstWindowOpen	Off
OnLastWindowClose	Off
OnWindowOpen	Off
OnWindowClose	Off
OnFileAVPlayerChange	Off
Thumbnail Settings
Generate Thumbnails	On; Temporary

Tables

Table Name	Statistics	Occurrences in Relationship Graph
JSON to HTML	4 fields defined, 2 records	JSON to HTML

Fields

Table Name: JSON to HTML - 4 Fields
Field Name	Type	Options	Comments	On Layouts	In Relationships	In Scripts	In Value Lists
JSON Input	Normal, Text	Auto-Enter: Allow editing Context table: JSON to HTML Calculation: MBS("JSON.Colorize"; Self; JSON to HTML::Dark Mode) Validation: Only during data entry Storage: Repetitions: 1 Indexing: None Automatically create indexes as needed Index Language: German		JSON to HTML		Colorize JSON Colorize JSON dark mode Update
JSON Output	Normal, Text	Auto-Enter: Allow editing Context table: JSON to HTML Calculation: Let([ html = MBS("JSON.ToHTML"; JSON to HTML::JSON Input; 0; JSON to HTML::CSS); html = MBS("XML.Colorize"; html; JSON to HTML::Dark Mode) ]; html) Validation: Only during data entry Storage: Repetitions: 1 Indexing: None Automatically create indexes as needed Index Language: German		JSON to HTML		Clear
CSS	Normal, Text	Auto-Enter: Allow editing Validation: Only during data entry Storage: Global Repetitions: 1 Index Language: German		JSON to HTML
Dark Mode	Normal, Number	Auto-Enter: Allow editing Validation: Only during data entry Storage: Repetitions: 1 Indexing: None Automatically create indexes as needed Index Language: German		JSON to HTML		Colorize JSON Colorize JSON dark mode

Layout Objects: JSON to HTML

Regular Fields

Field Name: JSON to HTML::JSON Input

Layout Name:

JSON to HTML

Top: 52 pt
Left: 138 pt
Bottom: 330 pt
Right: 510 pt

Anchoring: Left, Top

Field Format:

Edit Box

Field Behavior:

Allow field to be entered: In Find mode, In Browse mode
Touch keyboard type: Default for Data Type
Go to next field using: Tab key

Yes

Conditional Formatting	Condition	Format
1.	Formula: JSON to HTML::Dark Mode	self:normal .self { background-color: rgba(0%,0%,0%,1); } self:normal .icon { -fm-icon-color: rgba(0%,0%,0%,0); }

Field Name: JSON to HTML::JSON Output

Layout Name:

JSON to HTML

Top: 336 pt
Left: 138 pt
Bottom: 501 pt
Right: 510 pt

Anchoring: Left, Top

Field Format:

Edit Box

Field Behavior:

Allow field to be entered: In Find mode, In Browse mode
Touch keyboard type: Default for Data Type
Go to next field using: Tab key

Yes

Conditional Formatting	Condition	Format
1.	Formula: JSON to HTML::Dark Mode	self:normal .self { background-color: rgba(0%,0%,0%,1); } self:normal .icon { -fm-icon-color: rgba(0%,0%,0%,0); }

Field Name: JSON to HTML::CSS

Layout Name:

JSON to HTML

Top: 36 pt
Left: 135 pt
Bottom: 465 pt
Right: 511 pt

Anchoring: Left, Top

Field Format:

Edit Box

Field Behavior:

Allow field to be entered: In Find mode, In Browse mode
Touch keyboard type: Default for Data Type
Go to next field using: Tab key

Type:

Text: Update

Layout Name:

JSON to HTML

Top: 277 pt
Left: 17 pt
Bottom: 312 pt
Right: 106 pt

Anchoring: Left, Top

Set Field [ JSON to HTML::JSON Input; JSON to HTML::JSON Input ]

Fields:

JSON to HTML::JSON Input
JSON to HTML::JSON Input

Popover Buttons

Popover Button Properties		Coordinates
Type: Text: CSS Layout Name: JSON to HTML		Top: 231 pt Left: 17 pt Bottom: 266 pt Right: 106 pt Anchoring: Left, Top
Popover Properties		Coordinates
Show Title Bar: Yes Title: "Popover" Position: Right		Top: 18 pt Left: 117 pt Bottom: 480 pt Right: 526 pt Anchoring: Left, Top
Popover Content
Tab Controls	Slide Controls	Fields	Buttons	Portals	Web Viewer Controls	Charts
		Field Objects JSON to HTML::CSS at (36, 135, 465, 511)

Web Viewer Controls

Web Viewer Control Properties

Coordinates

Web Address

Layout Name:

JSON to HTML

Additional Properties:

Allow interaction with web viewer content
Display progress bar
Display status messages
Automatically encode URL

Top: 52 pt
Left: 519 pt
Bottom: 501 pt
Right: 1010 pt

Anchoring: Left and Right, Top and Bottom

"data:text/html;charset=utf-8;base64," & Base64Encode ( JSON to HTML::JSON Output )

Script Hierarchy

Colorize JSON

Colorize JSON dark mode

Clear

Update

Next Script: [Colorize JSON dark mode]

Script Name	Colorize JSON
Run script with full access privileges	Off
Siri Shortcut Visible	Off
Include In Menu	Yes
Layouts that use this script
Scripts that use this script
Script Definition
Script Steps	Set Field [ JSON to HTML::Dark Mode; 0 ] Set Field [ JSON to HTML::JSON Input; MBS("JSON.Colorize"; JSON to HTML::JSON Input) ]
Fields used in this script	JSON to HTML::Dark Mode JSON to HTML::JSON Input
Scripts used in this script
Layouts used in this script
Tables used in this script	JSON to HTML
Table occurrences used by this script	JSON to HTML
Custom Functions used by this script
Custom menu set used by this script

Previous Script: [Colorize JSON]

Next Script: [Clear]

Script Name	Colorize JSON dark mode
Run script with full access privileges	Off
Siri Shortcut Visible	Off
Include In Menu	Yes
Layouts that use this script
Scripts that use this script
Script Definition
Script Steps	Set Field [ JSON to HTML::Dark Mode; 1 ] Set Field [ JSON to HTML::JSON Input; MBS("JSON.Colorize"; JSON to HTML::JSON Input; JSON to HTML::Dark Mode) ]
Fields used in this script	JSON to HTML::Dark Mode JSON to HTML::JSON Input
Scripts used in this script
Layouts used in this script
Tables used in this script	JSON to HTML
Table occurrences used by this script	JSON to HTML
Custom Functions used by this script
Custom menu set used by this script

Previous Script: [Colorize JSON dark mode]

Next Script: [Update]

Script Name	Clear
Run script with full access privileges	Off
Siri Shortcut Visible	Off
Include In Menu	Yes
Layouts that use this script
Scripts that use this script
Script Definition
Script Steps	Replace Field Contents [ JSON to HTML::JSON Output; Replace with calculation: "" ] [ No dialog ]
Fields used in this script	JSON to HTML::JSON Output
Scripts used in this script
Layouts used in this script
Tables used in this script	JSON to HTML
Table occurrences used by this script	JSON to HTML
Custom Functions used by this script
Custom menu set used by this script

Previous Script: [Clear]

Script Name	Update
Run script with full access privileges	Off
Siri Shortcut Visible	Off
Include In Menu	Yes
Layouts that use this script
Scripts that use this script
Script Definition
Script Steps	Set Error Capture [ On ] #we just set field to itself to trigger calculation Set Field [ JSON to HTML::JSON Input; JSON to HTML::JSON Input ]
Fields used in this script	JSON to HTML::JSON Input
Scripts used in this script
Layouts used in this script
Tables used in this script	JSON to HTML
Table occurrences used by this script	JSON to HTML
Custom Functions used by this script
Custom menu set used by this script

Download example: JSON to HTML

Used functions: