Code

Reaction Button jQuery Plugin Makes Everything Reactable

Reaction Button jQuery Plugin Makes Everything Reactable

This jQuery plugin adds reaction icons to anything on a web page.

Features

With this add-on you can add reaction icons to everything you have in mind. Posts, private messages, photos, comments, profiles, videos, paragraphs, whole pages, products…

Customization

You can change the following properties of the plugin;
  • Icons are designed as vectors in Photoshop can be completely editable
  • default behavior of the reaction button
  • restful API compatibility with auto mode or fixed HTTP verb
  • server HTTP status codes can be programmed by attaching event listener
  • can change the number of summary icons
  • eligible screen side on mobile
  • opening under or over the object
  • Installation with native JavaScript, jQuery or HTML data parameters
  • simple installation with HTML knowledge only

Eager Loading

With this plugin, you don’t need to think about how many reactable items you have on your page and how much it will load your server. This plugin spends a single network request for all of them, no matter how many items on your page. It distributes the results to the item to which it belongs. Activate only by adding data- * parameter to the body tag. Remove items from the queue by adding a parameter to the items you don’t want to update. It’s that easy.

Usage As Input Field

This plugin can behave like an html form input field. Here’s the code you need to write into a form; <div class="reactable" data-toggle="reactable" data-name="user-reaction"> <span class="label">-</span> </div>

Retrieve the user-selected reaction from the “user-reaction” variable on the posted page.

Installation

The plugin setup is very easy.
  1. Open the html file you want to run the plugin.
  2. Place the following code between the head tags.
    including code
  3. Set the file paths to your own system.
  4. Place the installation tags using the html as below where you want to insert the reaction icons. inline initialization

Besides these, CodeIgniter compliant PHP controllers, model files and SQL file will be provided in the package.

Future Features

  1. [done] Add an optional update frequency counter in each instance and create a single network request for all of them if there are multiple instances on a page.
  2. [done] Play a sound effect when the user’s reaction is successfully added.
  3. [done] Add tooltip implementation for titles.
  4. [done] Add pop down effect on the chosen reaction icon.
  5. [done] Add immediate start option for batch update module. (This feature will removes the need to find previous reactions of items when creating pages.)
  6. [done] Add html selectbox input behaviour to the plugin.

Changelog

v1.0.0
Revealed.

v1.1.0
new - Added batch update feature. (eager loading)
new - Sound effect added.
new - Tooltip titles added.
new - Added pop down effect on icons.
Improved chosen icon effect.
A few minor bugs fixed.

v1.1.8
new - Added tooltip that summarizes all the reactions was added.
A few minor improvements were appended.

v1.2.0
new - Added immediate start option for batch update module.

v1.4.6
new - Added behaviour like html input element.
A few minor bug fixed and improvements appended.
by
by
by
by
by
by