easy-marker v1.1.23

easy-marker

easy-marker is a library for marking text in html. An example is as follows:

Install

npm i easy-marker

Usage

import EasyMarker from 'easy-marker'

const easyMarker = new EasyMarker
const container = document.querySelector('xxxx')
easyMarker.create(container)

API

• EasyMarker
  • new EasyMarker(options)
  • instance
    • .create(containerElement, [scrollContainerElement], [excludeElements])
    • .getSelectText() ⇒ string
    • .highlightLine(selection, [id], [meta])
    • .highlightLines(lines)
    • .cancelHighlightLine(id) ⇒ boolean
    • .onHighlightLineClick(cb)
    • .destroy()
  • static
    • .create(containerElement, [scrollContainerElement], [excludeElements]) ⇒ EasyMarker
  • inner
    • ~menuClickHandler : function
    • ~highlightLineClickHandler : function

new EasyMarker(options)

Creates an instance of EasyMarker.

Example

const em = new EasyMarker({
  menuTopOffset:'2rem',
  menuItems: [
    {
      text: '划线笔记',
      handler: function (data) {
        console.log('划线笔记', data, this)
        this.highlightLine(data,1)
      }
    },
    {
      text: '分享',
      handler: (data) => {console.log('分享',data)}
    },
    {
      text: '复制',
      handler: (data) => {console.log('分享',data)}
    }
  ]
 )

 em.create(document.querySelector('.article-body'),
   document.body,
   document.querySelectorAll('.article-body>:not(.text)')

easyMarker.create(containerElement, scrollContainerElement, excludeElements)

Initialization

Kind: instance method of EasyMarker

easyMarker.getSelectText() ⇒ string

Get the selected text

Kind: instance method of EasyMarker

easyMarker.highlightLine(selection, id, meta)

Highlight the lines between the specified nodes

Kind: instance method of EasyMarker

Example

const id = 2;
const selection = {
  anchorNode: textNodeA,
  anchorOffset: 1,
  focusNode: textNodeB,
  focusOffset: 2
};
const meta = { someKey: 'someValue' };
em.highlightLine(selection, id, meta);

easyMarker.highlightLines(lines)

Highlight multiple lines

Kind: instance method of EasyMarker

Example

const id = 2;
const selection = {
  anchorNode: textNodeA,
  anchorOffset: 1,
  focusNode: textNodeB,
  focusOffset: 2
};
const meta = { someKey: 'someValue' };
em.highlightLines([{selection, id, meta}]);

easyMarker.cancelHighlightLine(id) ⇒ boolean

Cancel highlight

Kind: instance method of EasyMarker

easyMarker.onHighlightLineClick(cb)

Highlight line click handler

Kind: instance method of EasyMarker

easyMarker.destroy()

Destroy instance

Kind: instance method of EasyMarker

EasyMarker.create(containerElement, scrollContainerElement, excludeElements) ⇒ EasyMarker

Initialization factory

Kind: static method of EasyMarker

EasyMarker~menuClickHandler : function

Menu item click handler

Kind: inner typedef of EasyMarker

EasyMarker~highlightLineClickHandler : function

Menu item click handler

Kind: inner typedef of EasyMarker