Highlight

Background

This action group demonstrates how an action can use the Mark.js JavaScript library in a preview to highlight content in the rendered output.

The “Highlight Helper” action manages the process, and all you need to do is provide some settings - primarily what to search for, and then call the helper.

Actions Overview

Example Text

The actions in this section create new drafts.

Sample Text for Examples

Run this action to create a new draft with some sample text in it that can be used
with the actions in the “Example Highlighters” section.

Example Draft of Simple Highlights

Run this action to create a new draft with some text in it that is used by the
“Highlight match list from a draft” action. Each line in the draft it creates is used
by that action in matching against the content in another draft - try the
“Sample Text for Examples” draft.

Example Highlighters

The actions in this section run against the current draft and produce a preview with
different highlights. All of the highlighters can be used with the “Example Text”
actions to illustrate the results.

Highlight the letters “am”

This action highlights all instances of the text string “am” in a web preview of the
current draft. Highlighting is in the default yellow with black text.

Highlight the entered string

This action displays a prompt allowing you to enter some text (the default is “then he”). The action then highlights all instances of the entered string of text in a web preview of the current draft. Highlighting is in the default yellow with black text.

This action explicitly sets the “strSeparateWordSearch” setting to “false” to ensure the entire string is matched. See “Highlight the entered words” for what the behaviour is if this is not set.

Highlight the entered words

This action displays a prompt allowing you to enter some text (the default is “then he”). The action then highlights all instances of the words, in the entered string of text, in a web preview of the current draft. Highlighting is in the default yellow with black text.

Highlight match list from a draft

This action highlights all instances of a set of text strings from a designated draft.

The highlights are presented in a web preview with an orange background and
black text.

The search strings are taken from a draft, with each line of content being a string of
text to be matched. Usually you would explicitly specify a draft by its UUID, but in
this case, a search based on a hopefully unique title is used.

The “Example Draft of Simple Highlights” action will generate a draft to illustrate the
use of this action.

Highlight end of line comma +2

This action highlights all instances of the a comma at the end of a line, and the two
preceeding characters to the commma. The highlighting is displayed in a web preview of the
current draft. Highlighting is in dark green with white text.

This action uses a string of text that represents a regular expression. This is a
structure of charcters and tokens that can describe sophisticated pattern matches.
Because this is being run on a web page in JavaScript, a JavaScript flavour of regular
expressions is used, at a version compatible with the latets version of Safari that your
device supports.

Highlight entered RegEx

This action displays a prompt allowing you to enter a regular expression string (the default is /^[ABC](\w+)/gmi). The action then highlights all instances that are a match to the regular expression in a web preview of the current draft. Highlighting is in red with yellow text.

The forward slashes if not added to the string at entry will be automatically added by the “Highlight Helper” action when building the output. Making these optional alllows you to optionally specify additional parameters such as in the above example; the example matches any word at the start of the line beginning with an upper or lower case a, b, or c.

For Duplication

Duplicate Me For Highlighting

This action will not do anything if you run it. The intention instead is for you to clone and customise it.

1. Begin by duplicating the action, then move it to another action group.
2. Rename the action, set the icon to whatever you want, and update the description to match what the action will do.
3. In the first step (SCRIPT), follow the instructions. You can set up a simple text match, a text match driven from a list in a draft (specified by its UUID), or through a regular expression (string).

At this point you are ready to test out your custom highlighter action.

Do Not Run Standalone

Any actions in this section should be left alone - but you may of course examine them to see how they work.

Highlight Helper

This is the action the highlighter actions call. It receives settings from the other actions, and then carries out the highlighting.

Legal Stuff & Coffee

This action group is of course entirely free for you to use, but please note that makr.js upon which this is based is released under the MIT license.

Of course, some people do like to give back, and so if you do find this action group useful, you can donate to my coffee fund. I enjoy working when I can from coffee shops where I live (York, UK), and many of my best ideas and results have likely been fuelled by caffeine.

Donate a coffee

• Author: Stephen Millard.
• Web Site: thoughtasylum.com
  
• Drafts Forums: @sylumer
• Twitter: @sylumer