Key Features Now Available via m-Painter Source
Click here to access current documentation for this feature.
This document's aim is to cover some of the notable features now available within the HTML editor/source mode via m-Painter.
- Familiarity — Any developers accustomed to utilizing Microsoft Visual Studio will feel right at home as the back-end plugin that m-Painter utilizes (Monaco) is based off the same concept.
- Basic Features Improved — Finding, replacing, indenting, and formatting the layout overall are significantly improved within this text editor.
- Improved organization of application asset files — Best practice coding includes separating application assets (CSS and JavaScript) away from the application's HTML. m-Painter now lets you do this. Via the source mode, click the JS or CSS tab, and a new window will appear. This separate file will be invoked by your application but the resulting code will be located in a different file. This file will be located in either /mrcclasses/DATADICTIONARY/APP/js or /mrcclasses/DATADICTIONARY/APP/css. Promote to production will automatically promote these files during a typical promotion event.
- Diff — You can now run a Diff check when accessing the version's history source. Simply click the "diff tool button and m-painter will illustrate the differences between the selected and current version. Please note this is only for visual reference.
- Typeahead suggestions — Within the source, m-Painter will assist by adding code snippets based on what you have typed. To activate, simply start typing and press enter when the option you want is selected. Doing so will add the applicable code block where your cursor is currently located. Some valid typeahead suggestions currently available are: Freemarker syntax (if, else, assign, lookup), popular jQuery, imports, Bootstrap (row, card).In this example, you can see I have typed in "if" and pressed enter:
As you can see, m-Painter as added all the necessary code syntax for me to now customize. - Document Formatting — This is handy if you would like to clean up the look of your document by aligning the text in a standard way. To do so, right click on the page and select "Format Document."
- Section collapse — You can quickly collapse any section of code by finding the first line of that section. Directly between the line number and the text, you will find a chevron pointing down. Clicking on that arrow, will cause that entire section of HTML to collapse into a single line. Repeat the process to expand said selection.
- Additional Features — Pressing F1 will cause a dialog window to appear with many features that are included into the plugin by default. Please share with us if you find any of these options to be particularly useful.
- Theming — This editor comes with 3 standard themes: VS: (Standard), VS-Dark (Dark), and HC-Black (High Contrast Black). The default is VS-Dark. If you would like to change this, please go to Admin -> Edit Dictionary Files -> Dictionary Configuration, and change the "mrc Editor Theme" option.