An interesting thing about technology is that sometimes we don't know how it's going to be used. It happened to us recently - during the Builder plugin development we realized that the Inspector required a major update in order to be able to manage the configuration of form controls. After we finished the Inspector upgrade, we found that the tool provides some amazing opportunities that we can (and should) apply to the CMS.

In case you don't know what the Inspector is - it's a small popup tool that opens when you click a component in the CMS area. Although the Inspector is not very widely used in the back-end, we have always been planning it as a core instrument for our Rapid Application Development vision, which we're currently implementing in the Builder plugin. In fact, Inspector is one of the most important elements in October's future, and this time we made huge efforts to make it limitless, fast and reliable.

The first version of the Inspector was quite limited - only string, dropdown and checkbox property types were supported. After the upgrade, the Inspector now supports more editors and even allows users to create data items. Inspector is now also designed with a modular architecture, so we can add new editor types if needed. The comprehensive Inspector description is published in the documentation. And the good news - the new Inspector configuration is completely backwards compatible with the old Inspector.

What's new in Inspector

• Autocomplete editor - an extension of the string editor with autocompletion feature.
• Set editor - allows the selection of predefined items with checkboxes.
• Text editor - allows entering long multi-line text values.
• String list editors - allows users to create arrays of strings.
• Object editor - create objects with predefined properties editable by users.
• Object list editor - allows users to create multiple objects with predefined properties.
• Dictionary - allows you to create key-value lists.
• Complex validation rules - besides the existing required and regular expression validators we've added integer, float and length/count validators.

Technically speaking, the Inspector loads a data schema and converts it to a nice user interface. When users are finished editing, Inspector returns the entered values in JSON format. The CMS component property definitions are completely compatible with the Inspector, so you can now define configuration of any complexity for your components. We know that it might be quite difficult to wrap your head around this complex concept, so keep reading for some examples.

Set editor

The set editor is displayed as a checkbox list. Set items can be defined in the property configuration or loaded dynamically, similar to the classic drop-down property.

Object editor

The object editor allows you to organize properties into groups. For example, imagine that you have a component that specifies a geographical location and a corresponding address.

Object list

With object lists, users can create multiple objects with the Inspector. For example the previous address object example can be extended so that users can create multiple addresses.

Dictionary editor

With the dictionary editor users can create name-value pairs. For example, they can create a list of drop-down options:

We haven't updated the components documentation yet, so feel free to explore the Inspector documentation - the component configuration is compatible with the JSON format expected by the Inspector, so you just need to convert examples from JSON to PHP arrays.

This massive upgrade adds another brick to the road that leads us to the ultimate goal of October - to be the simplest, most powerful and flexible CMS for developers and end users.

Happy inspecting!