Running a Gloop template
While writing your Gloop template, you will want quick feedback on how it actually looks like in a web browser when rendered. To do this, you can "run" your Gloop template.
A running Gloop template will be temporarily exposed by the server to a randomly generated URL. This URL is where you can view the rendered web page. It is accessible until you decide to terminate the running Gloop template. To make things even more convenient, editing a running template automatically makes the browser reload the rendered web page.
There are many ways you can run a Gloop template:
- using the context menu from the Navigator;
- using the context menu from the step editor;
- using toolbar in the step editor; and
- using the shortcut key in Martini Desktop; in Martini Online.
Setting template inputs
When you run a Gloop template, an input dialog will appear. This input dialog allows you to set the template's input properties. Inputs are typically used in order to configure how a Gloop template will behave, and be rendered as a web page.
Inputs can be set under the Main tab, using the Input Model section. To set a property's value, select it and either click on its value cell, or press . Provide the property's value when the text field appears, and press to apply your edit.
If you already have input data written in JSON, XML or YAML format, you can easily feed this data to the input dialog using the Import button. If your input data is partial, you can select a property in the tree and set its value by pasting the JSON, XML, or YAML content from your clipboard.
Martini Desktop also allows you to set where the Gloop template will be opened upon running. You can choose to open it in Martini Desktop's internal browser (default option), or an external browser (which is your machine's configured default browser).
Using CSS
In some cases, you might want to run your template with a particular CSS for testing purposes.
A common scenario would be when running a component template1 which does not have a <head> tag
containing the necessary CSS imports. To provide a CSS for testing purposes,
you can go to the input dialog's CSS tab to configure the CSS you want to use for your template when it runs.
You can set the CSS either by pasting CSS rules from your clipboard, or the CSS's source URL.
The URL can either be an absolute URL, or a relative path to to the Martini package's
web directory. For example, if your CSS file is at
todo-app/web/bootstrap.min.css (where todo-app is the name of the Martini package);
then your relative path should be /todo-app/bootstrap.min.css. The web directory is excluded in the path.
When run, the configured CSS and/or CSS imports will be injected to your Gloop template's <head> tag.
Using scripts
Similar to injecting CSS, it can be helpful to include extra scripts in your template for testing purposes. This is done through the Scripts tab of the input dialog.
Your JavaScript can be provided by pasting code from your clipboard, or the JavaScript's source URL.
The URL can either be an absolute URL, or a relative path to to the Martini package's
web directory. For example, if your JS file is at
examples/web/script.js (where examples is the name of the Martini package);
then your relative path should be examples/script.js. The web directory is excluded in the path.
Viewing the rendered web page
When you run a Gloop template, Martini will show a preview of the rendered web page (unless you unchecked the Open in Browser checkbox). This preview automatically reloads when you save the template after applying your changes.
You can open an accidentally closed template preview using the following procedure:
- Switch to the Debug perspective.
- Go the the Debug view.
- Right click the running Gloop template.
- Click either Open Gloop Template Preview, or Show Gloop Template Preview QR Code. The latter prompts a dialog with a QR code to open. This QR code can be scanned by a mobile device so you could view the rendered web page from there.