1.1.0 • Published 5 years ago

@codexteam/reactions v1.1.0

Weekly downloads
1
License
MIT
Repository
github
Last release
5 years ago

Reactions

Light-weight module for gathering users' feedback on a webpage content Allows to build in element, containing buttons - emojis for expressing attitude to a content

Getting started

Installation

npm or Yarn

npm install @codexteam/reactions

or

yarn add @codexteam/reactions

Download from CDN

<script src="https://cdn.jsdelivr.net/npm/@codexteam/reactions"></script>

Usage

Simplified initialization

  1. Connect reactions.js script to your page
  2. Create an instance of Reactions using
new Reactions({parent: '', title: '', reactions: []});

where

nametypedescription
parentstring or HTMLElementelement in which module should be inserted - selector or element instance
titlestringmodule title
reactionsstring[]array of emojis to be inserted in module options

Example

new Reactions({parent: 'body', title: 'What do you think?', reactions: ['👍', '👌', '👎']});

Initialize using reactions tag

  1. Add <reactions> to your page
  2. Provide <reactions> with data-id and data-title to set module id and title
  3. Fill <reactions> with <reaction> each containing emoji to be inserted in module options
  4. Connect reactions.js script to your page
  5. Run Reactions.init()

example:

<reactions data-id='' data-title='What do you think?'>
    <reaction>😁</reaction>
    <reaction>👍</reaction>
    <reaction>😞</reaction>
  </reactions>

Advanced settings

Identify user

Module uses userId property to identify user - by default userId is random number, but it can be specified through setUserId method

nametypedescription
userIdnumberuser identifier

example:

  Reactions.setUserId(1);

Identify module

By default module takes page URL as module identifier, but it also can be specified manually by passing id to reactions constructor

use it for:

  • lists (different modules on one page)
  • binding module to a specific content item, regardless of URL

in this case instance should be created this way

new Reactions({parent: '', title: '', reactions: [], id: ''});

where

nametypedescription
idstring or numbermodule identifier
1.1.0

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago