PackagesReroutesAboutlamdera.com

NoRedInk/noredink-ui/20.3.0

NOTE: the latest version is 35.9.3

READMEAboutVersionsSourceModules

Nri.Ui.Highlighter.V1

Highlighter provides a view/model/update to display a view to highlight text.

Current usage in NoRedInk

Currently, highlighter is used in the following places:

  • QuizEngine (see staging.noredink.com/admin/grammar_questions/types)
    • Highlighting Grammar Questions
    • Multi Highlighter Grammar Questions
    • Interface tutorial - parallel structure
    • Try similar for your answer vs correct answer
  • Peer Reviews (Thesis Statement)
    • Step 2: Rate Peers
  • Self Reviews (Thesis Statement)
    • On the "Highlight Your Writing" step.
  • Guided Drafts
    • When a teacher is grading a student's draft (leaving comments).

Types

type alias Model marker =
{ id : String
, highlightables : List (Highlightable marker)
, marker : Tool marker
, mouseDownIndex : Maybe Int
, mouseOverIndex : Maybe Int
, isInitialized : Initialized
, hasChanged : HasChanged
, selectionStartIndex : Maybe Int
, selectionEndIndex : Maybe Int
, focusIndex : Maybe Int
}

Model of a highlighter

type Msg marker
= Pointer PointerMsg
| Keyboard KeyboardMsg
| Focused (Result Error ())
= Down Int
| Out Int
| Over Int
| Move (Maybe String) Int
| Up (Maybe String)
| Ignored

Messages used by highlighter when interacting with a mouse or finger.

Init/View/Update

{ id : String
, highlightables : List (Highlightable marker)
, marker : Tool marker
}
-> Model marker

Setup initial model

Msg marker
-> Model marker
-> ( Model marker, Cmd (Msg marker), Intent )

Update for highlighter returning additional info about whether there was a change

{ config
| id : String
, highlightables : List (Highlightable marker)
, focusIndex : Maybe Int
, marker : Tool marker
}
-> Html (Msg marker)
{ config
| id : String
, highlightables : List (Highlightable marker)
}
-> Html msg
{ config
| id : String
, highlightables : List (Highlightable marker)
}
-> Html msg

Intents

type Intent
= Intent
{ listenTo : ListenTo
, changed : HasChanged
}

Possible intents or "external effects" that the Highlighter can request (see perform).

Check if the highlighter has changed.

= Changed
| NotChanged

Setters

removeHighlights : Model marker -> Model marker

Getters

asFragmentTuples : List (Highlightable marker) -> List ( Maybe marker, String )

Get a list of fragment texts and whether or not they are marked. Useful for encoding answers.

usedMarkers : Sorter marker -> Model marker -> Set marker

Get unique markers that have been used.

text : List (Highlightable marker) -> String

Fetch the text from a series of highlightables.

Events

TODO: Add documentation about how to wire in event listeners and subscriptions so the highlighter is functional!

Modules

About this package serverReroutesreroutes.json
Pages and docs rendering from package.elm-lang.org, © 2012-2020 Evan Czaplicki. © 2026 Lamdera