To better support widget management and development, we introduced a completely reimagined Widget Studio in Telligent Community 9.0, featuring staged editing and importing, live previewing, visual difference comparisons, a developer mode for editing factory defaults, and significant usability improvements such as a unified interface for navigation and multi-widget editing, full screen support, automatic saving, indexed navigation, and keyboard shortcuts.
Since the release of Telligent Community 9.0, we’ve received feedback from developers on how to further improve the widget editing experience. Among these improvements are autocompletion and documentation improvements, immediate script evaluation, and advanced global search. Most of these are now available in Telligent Community 9.1, while some are coming soon in version 9.2.
Autocomplete
API Autocomplete
While velocity script (the primary language in which widgets are written) provides access to the platform API in the form of widget extensions, it can be challenging to remember API names and parameters. Widget Studio now provides autocomplete suggestions while typing.
While typing, Widget Studio will automatically suggest API extensions, methods, and properties, as well as listing parameters supported by a selected method. These suggestions include abbreviated summaries of the associated documentation with links to view more in-depth documentation.
Not only do API suggestions include all built-in platform APIs, but they also include installed custom extensions and widget-specific private APIs exposed to the current widget if that widget is from a scripted plugin extension.
When methods are selected from suggestions, their entire signature (including all possible optional parameters) are completed. This behavior can be configured in Widget Studio Settings.
Snippet Autocomplete
In addition to API suggestions, Widget Studio suggests completions of other variables, strings, and tokens previously used in a document.
Widget Studio also suggests snippets of velocity directives, like #if, #set, #foreach, and even Telligent-specific directives like #registerEndOfPageHtml. Snippets apply a template form of the directive with slots to fill in. For example, typing #for<tab>, will initiate snippet completion of a #foreach loop.
Autocompletion is included in Telligent Community 9.1.
Documentation Browser
Automatic widget API documentation has been included in Widget Studio for a few major versions, though it has always been displayed in a separate pop-up window. In Telligent Community 9.1, Widget API documentation is displayed directly inside of Widget Studio within a dockable panel at the bottom of Widget Studio.
Dockable panels can be vertically resized and will automatically hide when moused out of. Dockable panels can also be pinned to stay open and resize the editor tabs’ above. In this way, the documentation panel can automatically hide when not needed or stay pinned open for more extended use.
Like API autocompletion, the documentation panel includes all built-in platform APIs, any installed custom extensions, and any private APIs exposed to the currently viewed widget if that widget is from a scripted plugin extension.
The documentation browser is linked to from API autocompletion suggestions. API documentation is also searchable, and includes content and links to basic widget editing documentation.
The new documentation browser is included in Telligent Community 9.1.
Script Sandbox
Another common developer tool is an immediate window to experiment with and evaluate code snippets. Widget Studio now includes a Script Sandbox as a dockable panel in Telligent Community 9.1.
The Script Sandbox enables you to test velocity script (including embedded HTML, velocity directives like #for loops and #if branches and even widget API calls) in an ad-hoc manner.
Script entered into the left pane is evaluated and logged to the right pane by selecting Run or using CTRL+ENTER, including both the raw and rendered output of the script. By default, the sandbox evaluates the entire content of the left pane. If only a subset of the left pane is highlighted, then only that subset will be evaluated and logged.
The Script Sandbox remembers its current content and previously-logged evaluations across Widget Studio sessions and supports reviewing and re-evaluating previously logged evaluations.
The Script Sandbox supports full API and snippet autocompletion.
Unlike widget rendering, exceptions raised during script evaluation are not logged in the community exception report, but are instead listed directly within the sandbox’s log with details.
Also unlike widget rendering, objects returned from methods or properties are rendered as trees which can be navigated into for inspection.
Like the documentation panel, the Script Sandbox is resizable and can be pinned open or hide automatically.
The Script Sandbox is included in Telligent Community 9.1.
Widget Search
While the search component of Widget Studio’s widget browser included in Telligent Community 9.0 is useful for quick navigation to widgets and their components, it is not designed as a useful tool for searching widget sources. Developers often need traditional searching across files. For example, search can be a useful tool for investigating other uses of an API or for locating the widget implementation of a portion of the UI based on a known language resource string.
Widget Studio now includes a global widget search dockable panel.
Widget search supports searching across various scopes, including the current widget (matching any currently focused editor tab), across all widgets, and any subset of all widgets, scoped by default or custom state, factory default provider, and theme.
Additionally, widget search supports searching by exact match or regular expression, with optional case sensitivity, and staged state options.
Widget search can also scope its results by widget component types, such as content, configuration, attachments, and language resources.
Search results include both the line number and excerpt surrounding the result. When selected, search results navigate directly to the line number of the component whether code or a language resource.
Widget search will be included in Telligent Community 9.2.
Other improvements and bug fixes
We’ve also included the following improvements and bug fixes:
- Widget Studio supports optional word wrap in all code editors and can be enabled in Widget Studio Settings in 9.1.
- Improvements have been made to maintaining scroll position across saves and tab navigation in 9.1.
- Tab reordering via drag-and-drop is more stable in 9.1.
- CTRL+S (or CMD+S) now forces an immediate save instead of waiting for the auto save in 9.1.
- Immediate actions such as save, publish, delete, and revert now happen immediately instead of being delayed similarly to auto-saves in 9.1.
- Edge cases around resizing of resource editors have been resolved in 9.1.
- Issues related to importing themed widgets have been resolved in 9.1.
- A number of edge cases around attachment renaming have been resolved in 9.2.
If you haven't already, try Telligent Community 9.1. Thank you for your continued feedback. If you have questions, please join the discussion on the developer forum.
