{"id":1420,"date":"2008-02-29T03:45:26","date_gmt":"2008-02-29T09:45:26","guid":{"rendered":"http:\/\/www.mrc-productivity.com\/legacy\/?page_id=1420"},"modified":"2023-12-06T14:31:25","modified_gmt":"2023-12-06T20:31:25","slug":"m-painter-manual","status":"publish","type":"page","link":"https:\/\/www.mrc-productivity.com\/legacy\/m-painter-app-prop\/m-painter-manual","title":{"rendered":"m-Painter Manual"},"content":{"rendered":"<p><!-- Begin Content --><\/p>\n<p><script type=\"text\/javascript\">\/\/ <![CDATA[\nfunction cellMenu(dir) {   if (dir === 'in') {     \/\/jQuery('#cellMenu').css('visibility','hidden');     jQuery('#rowMenu').css('visibility','hidden');     jQuery('#colMenu').css('visibility','hidden');     jQuery('#tableMenu').css('visibility','hidden');   } else {     \/\/jQuery('#cellMenu').css('visibility','visible');     jQuery('#rowMenu').css('visibility','visible');     jQuery('#colMenu').css('visibility','visible');     jQuery('#tableMenu').css('visibility','visible');   } } function rowMenu(dir) {   if (dir === 'in') {     jQuery('#cellMenu').css('visibility','hidden');     \/\/jQuery('#rowMenu').css('visibility','hidden');     jQuery('#colMenu').css('visibility','hidden');     jQuery('#tableMenu').css('visibility','hidden');   } else {     jQuery('#cellMenu').css('visibility','visible');     \/\/jQuery('#rowMenu').css('visibility','visible');     jQuery('#colMenu').css('visibility','visible');     jQuery('#tableMenu').css('visibility','visible');   } } function colMenu(dir) {   if (dir === 'in') {     jQuery('#cellMenu').css('visibility','hidden');     jQuery('#rowMenu').css('visibility','hidden');     \/\/jQuery('#colMenu').css('visibility','hidden');     jQuery('#tableMenu').css('visibility','hidden');   } else {     jQuery('#cellMenu').css('visibility','visible');     jQuery('#rowMenu').css('visibility','visible');     \/\/jQuery('#colMenu').css('visibility','visible');     jQuery('#tableMenu').css('visibility','visible');   } } function tableMenu(dir) {   if (dir === 'in') {     jQuery('#cellMenu').css('visibility','hidden');     jQuery('#rowMenu').css('visibility','hidden');     jQuery('#colMenu').css('visibility','hidden');     \/\/jQuery('#tableMenu').css('visibility','hidden');   } else {     jQuery('#cellMenu').css('visibility','visible');     jQuery('#rowMenu').css('visibility','visible');     jQuery('#colMenu').css('visibility','visible');     \/\/jQuery('#tableMenu').css('visibility','visible');   } }\n\/\/ ]]><\/script><\/p>\n<style>\n.border{display:inline};<br \/>\n<\/style>\n<h1>m-Painter Manual<\/h1>\n<p><i>Click <a href=\"https:\/\/www.mrc-productivity.com\/docs\/knowledge-base\/m-painter-manual\">here<\/a> to access current documentation for this feature.<\/i><\/p>\n<ul style=\"list-style-type: none;\">\n<li><a href=\"#Intro\">Introduction<\/a><\/li>\n<li><a href=\"#Toolbar\">m-Painter Toolbar<\/a><\/li>\n<li class=\"padleft\"><a href=\"#File\">File Menu<\/a><\/li>\n<li class=\"padleft\"><a href=\"#View\">View Menu<\/a><\/li>\n<li class=\"padleft\"><a href=\"#Edit\">Edit Menu<\/a><\/li>\n<li class=\"padleft\"><a href=\"#Help\">Help Menu<\/a><\/li>\n<li class=\"padleft\"><a href=\"#Insert\">Insert Tab<\/a><\/li>\n<li class=\"padleft\"><a href=\"#Inputs\">Inputs Tab<\/a><\/li>\n<li class=\"padleft\"><a href=\"#Formatting\">Formatting Tab<\/a><\/li>\n<li><a href=\"#Context\">Context Menu<\/a><\/li>\n<li><a href=\"#Browsers\">Supported Browsers<\/a><\/li>\n<\/ul>\n<h3><a class=\"anchor\" name=\"Intro\"><\/a>Introduction<\/h3>\n<p>After building an application, you have the opportunity to open m-Painter and modify the look and the feel of your HTML presentation layer. In addition, you will be able to edit the pages in a WYSIWYG environment (<strong>W<\/strong>hat <strong>Y<\/strong>ou <strong>S<\/strong>ee <strong>I<\/strong>s <strong>W<\/strong>hat <strong>Y<\/strong>ou <strong>G<\/strong>et). This means, no more looking at hundreds of lines of HTML to create your pages!<\/p>\n<p>You can access m-Painter in two different ways:<\/p>\n<ol>\n<li class=\"padleft\">From the Manage Applications screen, click the <img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual1.jpg\"> icon next to the appropriate application.<\/li>\n<li class=\"padleft\">From the &quot;Build &amp; Compile&quot; screen, click this button:<img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual2.jpg\"><\/li>\n<\/ol>\n<p><strong>Note:<\/strong> The application has to have been compiled to access m-Painter.<\/p>\n<p>Below is a screen shot of a freshly compiled multiple record inquiry opened in m-Painter:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual3.jpg\"><\/p>\n<h3><a class=\"anchor\" name=\"Toolbar\"><\/a>The m-Painter Toolbar<\/h3>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual4.jpg\"><\/p>\n<p>As can be seen, the m-Painter toolbar groups all functions together in tabs and menus.<\/p>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"File\"><\/a>File menu &#8212; This menu contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual5.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual6.jpg\"> &#8212; <strong>Open File<\/strong> &#8212; Opens a window that allows you to easily find and open another file associated with the current application such as a report prompt page, the application&#39;s Java file, or mobile device and separate language presentation layers.Note: Not all output choices are supported by the WYSIWYG feature.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual7.jpg\"> &#8212; <strong>Execute<\/strong> &#8212; Runs the current application in a new window.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual8.jpg\"> &#8212; <strong>Save As<\/strong> &#8212; Opens a prompt to save a copy of the current application page with a unique name. After a successful save, this newly named page will be opened for immediate editing. For more information regarding page name functionality, click <a href=\"\/legacy\/m-painter-app-prop\/how-to-use-page-name-to-show-different-outputs-for-one-application\">here<\/a>.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual9.jpg\"> &#8212; <a class=\"anchor\" name=\"Versions\"><\/a><strong>Versions<\/strong> &#8212; Opens a window which lists all previous saved versions of the current application&#39;s page. After clicking this button, the following window will be seen:<br \/>\n<img decoding=\"async\" class=\"border unpadleft\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual10.jpg\"><\/p>\n<p>All previous versions are listed in the top dropdown, along with date saved, user who saved the page, and if this was generated by m-Power&#39;s compile process. Versions can also be deleted by clicking the red X next to each one. Once a version is selected, it will be displayed in the center of the window as shown below:<\/p>\n<p><img decoding=\"async\" class=\"border unpadleft\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual11.jpg\"><\/p>\n<p>The source button can also be clicked to view any inline or code changes that are not easily seen in WYSIWYG mode. If this is the desired version, click OK and confirm that you would like to replace the current version.<\/p>\n<p><strong>Note:<\/strong> As long as the current version has been saved, it can be retrieved from the Versions window using the same method.<\/p>\n<p><strong>Note:<\/strong> There are no limits to the number of revisions saved. Unless manually deleted, every version of the current page will be available in this list.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual12.jpg\"> &#8212; <strong>Revert<\/strong> &#8212; (Only available in Source mode) Undo any changes caused by saving or toggling between source and WYSIWYG mode. After clicking, the changes that have been reverted are highlighted as seen below:<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual13.jpg\"><\/p>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"View\"><\/a>View menu &#8212; This menu contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual14.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual15.jpg\"> &#8212; <strong>Design<\/strong> &#8212; When not in Design mode, opens the WYSIWYG mode for easy editing.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual16.jpg\"> &#8212; <strong>Source<\/strong> &#8212; When not in Source mode, opens the current html file in a color-coded text editor.<\/li>\n<\/ul>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"Edit\"><\/a>Edit menu &#8212; This menu contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual18.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual19.jpg\"> &#8212; <strong>Find<\/strong> &#8212; (Only available in source mode) Search for key words within the HTML source view.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual20.jpg\"> &#8212; <strong>Cut<\/strong> &#8212; Cut selected text, images, and fields.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual21.jpg\"> &#8212; <strong>Copy<\/strong> &#8212; Copy selected text, images, and fields.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual22.jpg\"> &#8212; <strong>Paste<\/strong> &#8212; Paste selected text, images, and fields.<\/li>\n<\/ul>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"Help\"><\/a>Help menu &#8212; This menu contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual23.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual24.jpg\"> &#8212; <strong>m-Painter Docs<\/strong> &#8212; This opens the online manual to the section about m-Painter for reference or to answer any particular questions you may encounter.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual25.jpg\"> &#8212; <strong>FAQ<\/strong> &#8212; This opens the frequently asked questions area of the m-Power website.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual26.jpg\"> &#8212; <strong>Customer Portal<\/strong> &#8212; This opens the customer portal for submitting helpdesk questions, enhancement requests, or to download the latest version of m-Power.<strong>Note:<\/strong> This link requires your customer sign-in information.<\/li>\n<\/ul>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"Insert\"><\/a>Insert tab &#8212; This tab contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual40.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual27.jpg\"> &#8212; <strong>Save<\/strong> &#8212; This saves your changes to the server.<strong>Note:<\/strong> This is available on all three tabs.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual28.jpg\"> &#8212; <strong>Undo &amp; Redo<\/strong> &#8212; Undo and redo, respectively, any recent changes.<strong>Note:<\/strong> This is available on all three tabs.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual29.jpg\"> &#8212; <strong>Link<\/strong> &#8212; Inserts a new link or edits an existing link. After selecting a field\/text, you will be able to click on this button to add a hyperlink. Full documentation on inserting and editing links can be found <a href=\"\/legacy\/m-painter-app-prop\/working-with-links\">here<\/a>.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual32.jpg\"> &#8212; <strong>Image<\/strong> &#8212; Adds an image to the current presentation layer from a file on your computer or a web address. The default folder is \/mrcjava\/image.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual33.jpg\"> &#8212; <strong>Table<\/strong> &#8212; Adds a table to the current presentation layer. When right-clicking on a pre-existing table, m-Power lets you edit some characteristics of the table.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual34.jpg\"> &#8212; <strong>Field<\/strong> &#8212; Adds selected fields and common properties into your application, in addition to the fields that already exist.<strong>Note:<\/strong> In Reports, you have the ability to select the level of the field (Detail, Last Row of Detail, Subtotal, or Grand Total level).<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual38.jpg\"> &#8212; <strong>Calc<\/strong> &#8212; (Only available in Reports) Inserts a runtime calculation. Runtime calculations are most useful when trying to determine averages on sub-total or grand-total lines. See <a href=\"\/legacy\/m-painter-app-prop\/using-the-run-time-calculator\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual39.jpg\"> &#8212; <strong>Graph<\/strong> &#8212; (Only available in Report templates that include a graph) Inserts a new graph or updates the settings for an existing graph. See <a href=\"\/legacy\/graphs\/introduction-to-m-power-graphing\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual35.jpg\"> &#8212; <strong>Import<\/strong> &#8212; This allows you to bring multiple applications into one application. You can import whole applications or single pieces of information, such as fields. See <a href=\"\/legacy\/m-painter-app-prop\/working-with-the-m-painter-import-panel\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual36.jpg\"> &#8212; <strong>Map<\/strong> &#8212; Inserts a new Google Map or updates an existing Google Map. This feature lets you integrate a live Google Map into your application. See <a href=\"\/legacy\/m-painter-app-prop\/how-to-add-google-maps-to-your-applications\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual37.jpg\"> &#8212; <strong>Widget<\/strong> &#8212; Inserts a widget into the presentation layer or updates the widget already in the presentation layer. This feature allows you to better organize your on-screen data. See <a href=\"\/legacy\/m-painter-app-prop\/working-with-the-m-painter-widget-panel\">this link<\/a> for more information.<\/li>\n<\/ul>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"Inputs\"><\/a>Inputs tab &#8212; This tab contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual41.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual27.jpg\"> &#8212; <strong>Save<\/strong> &#8212; This saves your changes to the server.<strong>Note:<\/strong> This is available on all three tabs.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual28.jpg\"> &#8212; <strong>Undo &amp; Redo<\/strong> &#8212; Undo and redo, respectively, any recent changes.<strong>Note:<\/strong> This is available on all three tabs.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual42.jpg\"> &#8212; <strong>Option List<\/strong> &#8212; Creates a drop-down list, radio buttons, button list, or checkboxes for a text input in the current presentation layer. It can only be selected after you have selected an input box. Selecting an existing option list also allows the opportunity to change or remove the option list. See <a href=\"\/legacy\/m-painter-app-prop\/create-dropdowns-in-m-painter\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual43.jpg\"> &#8212; <strong>Calendar<\/strong> &#8212; Inserts a calendar picker to a text input or updates an existing one. This feature is available when any input box is selected and allows end-users to select a date rather than type it themselves. See <a href=\"\/legacy\/m-painter-app-prop\/create-calendar-helper-in-m-painter\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual44.jpg\"> &#8212; <strong>Lookup<\/strong> &#8212; Inserts a new lookup window or updates an existing one. This feature is a great alternative to dropdown lists for end-users who need to choose from hundreds to thousands of records. See <a href=\"\/legacy\/m-painter-app-prop\/create-lookup-window-in-m-painter\">this link<\/a> for more information.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual45.jpg\"> &#8212; <strong>AJAX<\/strong> &#8212; (Not available in Retrievals) Inserts a built-in AJAX feature to the current presentation layer. This feature allows you to add the ability for this application to connect to the server without a user directly submitting a form. See <a href=\"\/legacy\/m-painter-app-prop\/using-ajax-helpers\">this link<\/a> for more information.<\/li>\n<\/ul>\n<p><a class=\"anchor\" style=\"text-decoration: underline;\" name=\"Formatting\"><\/a>Formatting tab &#8212; This tab contains:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual46.jpg\"><\/p>\n<ul>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual27.jpg\"> &#8212; <strong>Save<\/strong> &#8212; This saves your changes to the server.<strong>Note:<\/strong> This is available on all three tabs.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual28.jpg\"> &#8212; <strong>Undo &amp; Redo<\/strong> &#8212; Undo and redo, respectively, any recent changes.<strong>Note:<\/strong> This is available on all three tabs.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual47.jpg\"> &#8212; <strong>Styles<\/strong> &#8212; Applies a preset style to the selected field or text. To use, first highlight the desired text or left click on the field. Then, select a style from this dropdown to automatically style the selection.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual48.jpg\"> &#8212; <strong>Format<\/strong> &#8212; Applies a paragraph format to the selected text or field. To use, first highlight the desired text or left click on the field. Then, select a paragraph format from this dropdown to automatically format the selection.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual49.jpg\"> &#8212; <strong>Font<\/strong> &#8212; Applies a different font to the selected text or field. To use, first highlight the desired text or left click on the field. Then, select the desired font name from this dropdown to automatically format the selection.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual50.jpg\"> &#8212; <strong>Font Size<\/strong> &#8212; Applies a different font size to the selected text or field. To use, first highlight the desired text or left click on the field. Then, select the desired font size from this dropdown to automatically format the selection.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual51.jpg\"> &#8212; <strong>Text Color<\/strong> &#8212; Applies a different text color to the selected text or field. To use, first highlight the desired text or left click on the field. Then, select the desired text color from this dropdown to automatically format the selection.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual52.jpg\"> &#8212; <strong>Background Color<\/strong> &#8212; Applies a different background color to the selected text or field. To use, first highlight the desired text or left click on the field. Then, select the desired background color from this dropdown to automatically format the selection.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual53.jpg\"> &#8212; <strong>Bold, Italic, &amp; Underline<\/strong> &#8212; Applies font formatting of bold, italics, or underline respectively. To use, first highlight the desired text or left click on the field. Then, select the desired option from these three buttons to automatically format the selection.<strong>Note:<\/strong> To remove this formatting, highlight the text or left click on the field and unselect the button.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual54.jpg\"> &#8212; <strong>Numbered List &amp; Bulleted List<\/strong> &#8212; Adds an ordered or unordered list to the current presentation layer. To use, left click where the list is desired and then click one of these buttons. To remove, left click where the current list is and then click the appropriate button.<\/li>\n<li class=\"padleft\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual55.jpg\"> &#8212; <strong>Left, Center, &amp; Right Justify<\/strong> &#8212; Changes the positioning of your text. To use, highlight text or left click on a field and then select the appropriate justification desired.<strong>Note:<\/strong> This new text positioning is relative to the container the text is in, i.e. a field value will be center justified relative to the table cell that contains this field value.<\/li>\n<\/ul>\n<h3><a class=\"anchor\" name=\"Context\"><\/a>Context Menu<\/h3>\n<p>There are several features that can be accessed directly within the WYSIWYG mode of m-Painter by right-clicking on certain objects, which will open m-Painter&#39;s context menu, as shown below:<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual75.jpg\"><\/p>\n<table class=\"\" style=\"border: 1px solid black; width: 100%;\">\n<tbody>\n<tr style=\"font-weight: bold;\">\n<td style=\"vertical-align: middle; text-align: center;\">When you<br \/>\nright-click on:<\/td>\n<td style=\"vertical-align: middle; text-align: center;\">You will see:<br \/>\n<span style=\"font-weight: normal; font-size: 10px;\">(Hover over the menu to see more information)<\/span><\/td>\n<td style=\"vertical-align: middle; text-align: center;\">Sub-menu?<br \/>\n<span style=\"font-weight: normal; font-size: 10px;\">(Hover over the sub-menu to see more information)<\/span><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\" rowspan=\"5\">Anything<\/td>\n<td style=\"vertical-align: middle; text-align: center;\" rowspan=\"5\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual63.jpg\" usemap=\"#anything\"><\/p>\n<map name=\"anything\">\n<area title=\"Copies the current clipboard contents to the cursor's location on the page\" coords=\"0,0,195,34\" shape=\"rect\" href=\"javascript:void(0)\">\n<area onmouseover=\"window.cellMenu('in');\" onmouseout=\"window.cellMenu('out');\" coords=\"0,34,195,68\" shape=\"rect\" href=\"javascript:void(0)\">\n<area onmouseover=\"window.rowMenu('in');\" onmouseout=\"window.rowMenu('out');\" coords=\"0,68,195,102\" shape=\"rect\" href=\"javascript:void(0)\">\n<area onmouseover=\"window.colMenu('in');\" onmouseout=\"window.colMenu('out');\" coords=\"0,102,195,134\" shape=\"rect\" href=\"javascript:void(0)\">\n<area onmouseover=\"window.tableMenu('in');\" onmouseout=\"window.tableMenu('out');\" coords=\"0,134,195,166\" shape=\"rect\" href=\"javascript:void(0)\"> <\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" id=\"cellMenu\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual64.jpg\" usemap=\"#cell\"><\/p>\n<map name=\"cell\">\n<area title=\"Opens the current cell's HTML for easy viewing and editing\" coords=\"0,0,195,32\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Merges selected cells together into one cell\" coords=\"0,32,195,64\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Merges the current cell with the cell directly to the right\" coords=\"0,64,195,96\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Merges the current cell with the cell directly below\" coords=\"0,96,195,128\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Splits the current cell into two cells, side by side\" coords=\"0,128,195,160\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Splits the current cell into two cells, one on top of the other\" coords=\"0,160,195,192\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Allows for conditional coloring of cell\" coords=\"0,192,195,224\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the properties window for the current cell\" coords=\"0,224,195,256\" shape=\"rect\" href=\"javascript:void(0)\"> <\/map>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" id=\"rowMenu\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual65.jpg\" usemap=\"#row\"><\/p>\n<map name=\"row\">\n<area title=\"Opens the current row's HTML for easy viewing and editing\" coords=\"0,0,195,33\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Hides the row from displaying at runtime\" coords=\"0,33,195,66\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Inserts a row above the current row\" coords=\"0,66,195,99\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Inserts a row below the current row\" coords=\"0,99,195,132\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Completely removes the row from the HTML\" coords=\"0,132,195,162\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Allows for conditional coloring of cell\" coords=\"0,162,195,194\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" id=\"colMenu\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual66.jpg\" usemap=\"#col\"><\/p>\n<map name=\"col\">\n<area title=\"Inserts a column to the left of the current cell\" coords=\"0,0,195,32\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Inserts a column to the right of the current cell\" coords=\"0,32,195,64\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Deletes the current column from the HTML completely\" coords=\"0,64,195,96\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" id=\"tableMenu\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual67.jpg\" usemap=\"#table\"><\/p>\n<map name=\"table\">\n<area title=\"Deletes the current table from the HTML completely\" coords=\"0,0,195,32\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens a window of the current table's HTML for easy viewing and editing\" coords=\"0,32,195,64\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the properties window for the current table\" coords=\"0,64,195,96\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Hides the current table from displaying at runtime\" coords=\"0,96,195,128\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\">Selected Text<br \/>\nor Field Value<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual68.jpg\" usemap=\"#text\"><\/p>\n<map name=\"text\">\n<area title=\"Cuts the currently selected text or field value to the clipboard\" coords=\"0,0,195,33\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Copies the currently selected text or field value to the clipboard\" coords=\"0,33,195,66\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Pastes the current contents of the clipboard in place of the currently selected text or field value\" coords=\"0,66,195,99\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the Insert\/Edit Link window in order to insert or edit a link on the currently selected text or field value\" coords=\"0,99,195,132\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\">Radio, Checkbox,<br \/>\nButton, etc.<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual69.jpg\" usemap=\"#button\"><\/p>\n<map name=\"button\">\n<area title=\"Opens the properties for the currently selected element\" coords=\"0,0,195,35\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<p>OR<\/p>\n<p><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual74.jpg\" usemap=\"#radio\"><\/p>\n<map name=\"radio\">\n<area title=\"Pastes the current clipboard contents to the cursor's location on the page\" coords=\"0,0,130,28\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Firefox Only: Sets the current object to be selected at runtime\" coords=\"0,28,130,55\" shape=\"rect\" href=\"javascript:void(0)\"> <\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\">Text Input<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual70.jpg\" usemap=\"#input\"><\/p>\n<map name=\"input\">\n<area title=\"Makes the field required at runtime\" coords=\"0,0,195,33\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the properties window for the current text input\" coords=\"0,33,195,66\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Edit Div\" coords=\"0,66,195,99\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Remove Div\" coords=\"0,99,195,132\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Form UI\" coords=\"0,132,195,165\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the Insert\/Edit Option List window for inserting or editing an option list on the current text input\" coords=\"0,165,195,198\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Convert to Text area\" coords=\"0,198,195,231\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the Insert\/Edit AJAX Feature window for inserting or editing an AJAX feature on the current text input\" coords=\"0,231,195,264\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Opens the Insert\/Edit Calendar Helper window for inserting or editing a calendar helper on the current text input\" coords=\"0,264,195,297\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\">Link<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual71.jpg\" usemap=\"#link\"><\/p>\n<map name=\"link\">\n<area title=\"Opens the Insert\/Edit Link window in order to insert or edit a link on the currently selected text or field value\" coords=\"0,0,195,33\" shape=\"rect\" href=\"javascript:void(0)\">\n<area title=\"Removes the current link from the HTML\" coords=\"0,33,195,66\" shape=\"rect\" href=\"javascript:void(0)\"><\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\">Graph<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual72.jpg\" usemap=\"#graph\"><\/p>\n<map name=\"graph\">\n<area title=\"Opens the Graph Properties window for the current graph\" coords=\"0,0,195,36\" shape=\"rect\" href=\"javascript:void(0)\"> <\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"vertical-align: middle; text-align: center;\">Image<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><img decoding=\"async\" class=\"border\" alt=\"\" src=\"\/legacy\/images\/mpaintermanual73.jpg\" usemap=\"#image\"><\/p>\n<map name=\"image\">\n<area title=\"Opens the Image Properties window for the current image\" coords=\"0,0,195,36\" shape=\"rect\" href=\"javascript:void(0)\"> <\/map>\n<\/td>\n<td style=\"vertical-align: middle; text-align: center;\"><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h3><a class=\"anchor\" name=\"Browsers\"><\/a>Supported Browsers<\/h3>\n<p>m-Painter currently supports the following browsers:<\/p>\n<p>Internet Explorer 11 +<br \/>\nGoogle Chrome Version 40+<br \/>\nMozilla Firefox Version 40+<\/p>\n<p><!-- End Content --><\/p>\n","protected":false},"excerpt":{"rendered":"<p>m-Painter Manual Click here to access current documentation for this feature. Introduction m-Painter Toolbar File Menu View Menu Edit Menu Help Menu Insert Tab Inputs Tab Formatting Tab Context Menu Supported Browsers Introduction After building an application, you have the opportunity to open m-Painter and modify the look and the feel of your HTML presentation [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1410,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1420","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/pages\/1420","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/comments?post=1420"}],"version-history":[{"count":71,"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/pages\/1420\/revisions"}],"predecessor-version":[{"id":9586,"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/pages\/1420\/revisions\/9586"}],"up":[{"embeddable":true,"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/pages\/1410"}],"wp:attachment":[{"href":"https:\/\/www.mrc-productivity.com\/legacy\/wp-json\/wp\/v2\/media?parent=1420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}