Magnolia Compatibility


6.2(warning)
6.1(tick)
5.7(tick)
5.6(tick)

Using this set of schema files you can enable the IntelliSense features of IDEs for Magnolia light development. This makes it easier for new developers to be familiar with the configurations available for templates, dialogs, virtual URI Mappings, rest endpoints, and content types. The schemas include property descriptions and in some cases default values or value examples (suggestions).

Installation

Use one of two branches depending on UI version

Download and install Visual Studio Code. Install the YAML Language Support by Red Hat plugin.

From Preferences > Settings > JSON > Schemas

"yaml.schemas": {
    "http://localhost:8080/definition-schemas/dialog.schema.json": ["/**/dialogs/*"]
}

Download and install Eclipse IDE. Install the Wild Web Developer plugin. 

Uninstall other YAML editors or adjust your file associations appropriately.

From Preferences > YAML > YAML Schemas > Schemas

Usage

Once the schemas are configured the editor should begin to offer relevant suggestions based on what is typed. What suggestions are offered is determined by the parent folder (or registry) in which the file is contained.

For example, if a new page template being created you should see options like this:

These are the standard configuration options for pages, components and areas. See Template definition

The Red Hat plugin for VS Code can suggest configuration items and provide a description of how the property should be used. In some cases values are suggested. How helpful the plugin can be depends on having some base knowledge about configuration is arranged. Configuration like dialogs and templates can be more complex than some of the other definition types. This is due to the amount of nesting that can sometimes take place in design. 

General Tips

  • Complex nesting of configuration can lead to loss of useful content assist. You will probably will always get something suggested but it's important to look closely to make sure the suggestions  look designed rather than random. 
  • Know the basic structure of the definition so that you can put yourself back on track with content assist. If it's not working perhaps you are off by a space or two in either direction. Keep that in mind. Remember we are working with YAML so which column you are in has meaning. 

Dialogs

Creating dialogs in VS Code is made easier by the presence of the dialog schema provided by Magnolia. To use the plugin effectively you may have to adapt your editing style a bit and understand about the plugin's short comings (or quirks). 

  • Dialogs typically require two main configurations. A form and an actions block.

    Magnolia 6.1+ does not require the actions block if you simply want to use the default save and cancel.

  • When creating a form with multiple tabs content assist when only be available for the first tab. 

    Create the last tab first when creating multiple tabs. This way as you create the tabs you will always be positioned at the first tab in the list. Where the real help is.

Like the VS Code plugin the Wild Web Developer plugin offers code assist capabilities for Eclipse IDE. 

General Tips

  • You can adjust tabs to spaces in: Preferences > JSON > JSON Files > Editor
  • This editor is not quite as good keeping you in the correct column. However, it's much easier to get the assist to come back to relevant suggestions using this plugin.
  • Keep in mind this plugin is still in the incubation phase. There should be improvements coming soon

Dialogs

Creating dialogs in Eclipse is made easier by the presence of the dialog schema provided by Magnolia. To use the plugin effectively you may have to adapt a bit and understand about it short comings. 

  • Dialogs typically require two main configurations. A form and an actions block.

    Magnolia 6.1+ does not require the actions block if you simply want to use the default save and cancel.

  • When creating a form with multiple tabs content assist when only be available for the first tab. 

    Create the last tab first when creating multiple tabs. This way as you create the tabs you will always be positioned at the first tab in the list. Where the real help is.

References