Formatter

OmniOutliner provides controls for determining how data is displayed as text in your document. For example, an outline may contain columns that display numeric values as percentages or as currency values. Or a column may contain dates, whose representation could be altered to display them in many ways, from long format (Sunday, October 1, 2017) to short format (10/1/17), or any customized variation.

Scripts use the Formatter class to determine and control the formatting for columns in an outline. Specifically, there are three types of Formatters scripts can use:

This webpage describes how to create and apply formatters, especially when adding columns to an OmniOutliner outline.

Date Formatter

This first section will examine how create and use Date Formatters, especially when applying their format to columns.

Before we cover the Date Formatter, it is important to mention the JavaScript’s built-in Date object. The Date object can be used to generate date strings and date objects, and is fully documented at the w3cschools.com website.

When used as a class method Date() the result will be a string. When used as a constructor new Date() the result will be a date object. (see below)

typeof Date() typeof new Date()

The JavaScript Date Object is often used in scripts to generate a string or object for the current date.

Date Formatter Class Properties

Here are the properties of the Formater.Date class:

var newColumn = document.outline.addColumn( Column.Type.Date, document.editors[0].afterColumn(document.outline.outlineColumn), function(column){ column.title = "Date" column.formatter = Formatter.Date.iso8601 } )
omnioutliner:///omnijs-run?script=var%20newColumn%20%3D%20document%2Eoutline%2EaddColumn%28%0A%09Column%2EType%2EDate%2C%0A%09document%2Eeditors%5B0%5D%2EafterColumn%28document%2Eoutline%2EoutlineColumn%29%2C%20%0A%09function%28column%29%7B%0A%09%09column%2Etitle%20%3D%20%22Date%22%0A%09%09column%2Eformatter%20%3D%20Formatter%2EDate%2Eiso8601%0A%09%7D%0A%29

Date Formatter Instance Properties

Here are the properties of an instance of the Formater.Date class:

var newColumn = document.outline.addColumn( Column.Type.Date, document.editors[0].afterColumn(document.outline.outlineColumn), function(column){ column.title = "Date" column.formatter = Formatter.Date.calendar.gregorian } )
omnioutliner:///omnijs-run?script=var%20newColumn%20%3D%20document%2Eoutline%2EaddColumn%28%0A%09Column%2EType%2EDate%2C%0A%09document%2Eeditors%5B0%5D%2EafterColumn%28document%2Eoutline%2EoutlineColumn%29%2C%20%0A%09function%28column%29%7B%0A%09%09column%2Etitle%20%3D%20%22Date%22%0A%09%09column%2Eformatter%20%3D%20Formatter%2EDate%2Ecalendar%2Egregorian%0A%09%7D%0A%29

Properties of the Calendar class include: buddhist, chinese, coptic, ethiopicAmeteAlem, ethiopicAmeteMihret, gregorian, hebrew, indian, islamic, islamicCivil, islamicTabular, islamicUmmAlQura, iso8601, japanese, persian, republicOfChina, and identifier. [see the documentation of the Calendar class for more information]

var newColumn = document.outline.addColumn( Column.Type.Date, document.editors[0].afterColumn(document.outline.outlineColumn), function(column){ column.title = "Date" column.formatter = Formatter.Date.calendar.gregorian column.formatter.timeZone = new TimeZone('PST') } )
omnioutliner:///omnijs-run?script=var%20newColumn%20%3D%20document%2Eoutline%2EaddColumn%28%0A%09Column%2EType%2EDate%2C%0A%09document%2Eeditors%5B0%5D%2EafterColumn%28document%2Eoutline%2EoutlineColumn%29%2C%20%0A%09function%28column%29%7B%0A%09%09column%2Etitle%20%3D%20%22Date%22%0A%09%09column%2Eformatter%20%3D%20Formatter%2EDate%2Ecalendar%2Egregorian%0A%09%09column%2Eformatter%2EtimeZone%20%3D%20new%20TimeZone%28%27PST%27%29%0A%09%7D%0A%29

Date Formatter Class Methods (functions)

Here are the methods (functions) of the Formater.Date class:

var newColumn = document.outline.addColumn( Column.Type.Date, document.editors[0].afterColumn(document.outline.outlineColumn), function(column){ column.title = "Date" column.formatter = Formatter.Date.withStyle(Formatter.Date.Style.Full) } )
omnioutliner:///omnijs-run?script=var%20newColumn%20%3D%20document%2Eoutline%2EaddColumn%28%0A%09Column%2EType%2EDate%2C%0A%09document%2Eeditors%5B0%5D%2EafterColumn%28document%2Eoutline%2EoutlineColumn%29%2C%20%0A%09function%28column%29%7B%0A%09%09column%2Etitle%20%3D%20%22Date%22%0A%09%09column%2Eformatter%20%3D%20Formatter%2EDate%2EwithStyle%28Formatter%2EDate%2EStyle%2EFull%29%0A%09%7D%0A%29

Here are some of the possible combinations of date/time formatting. NOTE: including time is optional, and time and date formats are not required to be the same.

Date Formatter Instance Methods (functions)

Here are the methods (functions) of an instance of the Formater.Date class:

fmatr = Formatter.Date.withStyle(Formatter.Date.Style.Long, Formatter.Date.Style.Short) dateObj = new Date() dateStr = fmatr.stringFromDate(dateObj) fmatr.dateFromString(dateStr)
 

Calendar

The calendar used by the formatter is indicated with one of the following properties:

Decimal Formatter

The Decimal Formatter is used when a column is to display numeric data.

Decimal Formatter Class Properties

Here are the properties of the Formater.Decimal class:

Formatter.Decimal.currencyCodes
fmatr = Formatter.Decimal.custom fmatr = Formatter.Decimal.decimal fmatr = Formatter.Decimal.percent fmatr = Formatter.Decimal.percentWithDecimal fmatr = Formatter.Decimal.plain fmatr = Formatter.Decimal.thousandsAndDecimal

Decimal Formatter Instance Properties

Here are the properties of an instance of the Formater.Decimal class:

Decimal Formatter Class Methods (functions)

Here are the methods (functions) of the Formater.Decimal class:

fmatr = Formatter.Decimal.currency('SEK') dVal = Decimal.fromString('12345') fmatr.stringFromDecimal(dVal) //-> SEK12,345.00

Decimal Formatter Instance Methods (functions)

Here are the methods (functions) of an instance of the Formater.Decimal class:

var newColumn = document.outline.addColumn( Column.Type.Number, document.editors[0].afterColumn(document.outline.outlineColumn), function(column){ column.title = "Percent" column.formatter = Formatter.Decimal.percent } )
omnioutliner:///omnijs-run?script=var%20newColumn%20%3D%20document%2Eoutline%2EaddColumn%28%0A%09Column%2EType%2ENumber%2C%0A%09document%2Eeditors%5B0%5D%2EafterColumn%28document%2Eoutline%2EoutlineColumn%29%2C%20%0A%09function%28column%29%7B%0A%09%09column%2Etitle%20%3D%20%22Percent%22%0A%09%09column%2Eformatter%20%3D%20Formatter%2EDecimal%2Epercent%0A%09%7D%0A%29

Duration Formatter

The Duration Formatter is used when a column is to display time-based data.

Duration Formatter Constructor (function)

Here is the constructor (function) of the Formater.Duration class:

Duration Formatter Instance Properties

Here are the properties of an instance of the Formatter.Duration class:

Duration Formatter Instance Methods (functions)

Here are the methods (functions) of an instance of the Formater.Duration class:

var newColumn = document.outline.addColumn( Column.Type.Duration, document.editors[0].afterColumn(document.outline.outlineColumn), function(column){ column.title = "HPD" newFormatter = new Formatter.Duration() column.formatter = newFormatter } )
omnioutliner:///omnijs-run?script=var%20newColumn%20%3D%20document%2Eoutline%2EaddColumn%28%0A%09Column%2EType%2EDuration%2C%0A%09document%2Eeditors%5B0%5D%2EafterColumn%28document%2Eoutline%2EoutlineColumn%29%2C%20%0A%09function%28column%29%7B%0A%09%09column%2Etitle%20%3D%20%22HPD%22%0A%09%09newFormatter%20%3D%20new%20Formatter%2EDuration%28%29%0A%09%09column%2Eformatter%20%3D%20newFormatter%0A%09%7D%0A%29

Example Plug-In

Here’s an example plug-in that appends a numeric column after the last column on the right side of the document. The action displays a text input form to prompt the user to title the column.

/*{ "type": "action", "targets": ["omnioutliner"], "author": "Otto Automator", "identifier": "com.omni-automation.oo.add-numeric-column", "version": "1.0", "description": "Append a new numeric column to the end of the outline.", "label": "Append Numeric Column", "shortLabel": "Append Numeric Column" }*/ (() => { var action = new PlugIn.Action(function(selection, sender){ // CONSTRUCT THE FORM var inputForm = new Form() // CREATE FORM ELEMENTS: TEXT INPUT textInputField = new Form.Field.String( "columnTitle", "Title", null ) // ADD THE ELEMENTS TO THE FORM inputForm.addField(textInputField) // DISPLAY THE FORM DIALOG var formPromise = inputForm.show("Enter the column title:","Add") // VALIDATE FORM CONTENT inputForm.validate = function(formObject){ // EXTRACT VALUES FROM THE FORM’S VALUES OBJECT columnTitle = formObject.values['columnTitle'] // HAS TEXT BEEN ENTERED IN THE INPUT FIELD? textStatus = (columnTitle && columnTitle.length > 0) ? true:false // RETURN VALIDATION return textStatus } // PROCESS FORM RESULTS formPromise.then(function(formObject){ // EXTRACT VALUES FROM THE FORM’S VALUES OBJECT var columnTitle = formObject.values['columnTitle'] // CREATE AND FORMAT THE COLUMN tree = document.outline editor = document.editors[0] tree.addColumn( Column.Type.Number, editor.afterColumn(columns[columns.length]), function(column){ column.title = columnTitle editor.setSummaryForColumn(column, Column.Summary.Total) editor.setWidthForColumn(column, 64) column.style.set(Style.Attribute.ParagraphAlignment, TextAlignment.Right) column.formatter = Formatter.Decimal.plain } ) }) // PROCESS FORM CANCELLATION formPromise.catch(function(err){ console.log("form cancelled", err.message) }) }); action.validate = function(selection, sender){ // validation code // selection options: columns, document, editor, items, nodes, outline, styles return true }; return action; })();
UNDER CONSTRUCTION

This webpage is in the process of being developed. Any content may change and may not be accurate or complete at this time.

DISCLAIMER