JSFiddle - React, Tailwind, and code Playground

by Roman Zhak

JavaScript

var subs = {}, o = {}, timeOutId, eventsMap = {
     wheel: true,
     mousewheel: true
 }, slice = Array.prototype.slice;

 o.on = function (type, callback, target) {
     if (type in eventsMap) {
         (target || document).addEventListener(type, callback, false);
         return this;
     }
     subs[type] = callback;
     return this;
 }

 o.off = function (type) {
     if (subs[type]) delete subs[type];
 }

 o.trigger = function (type) {
     if (subs[type]) subs[type].apply(this, slice.call(arguments, 1));
 };


 o.on('wheel', function (evt) {
     watch(evt.wheelDelta);
 });

 o.on('stop', function (val) {
     console.log('Stopped with %d', val);
 });

 o.on('change', function (val) {
     console.log('Smooth values %d', val);
 });

 function watch(value) {
     clearTimeout(timeOutId);
     o.trigger('change', value);
     timeOutId = setTimeout(function () {
         o.trigger('stop', value)
     }, 100)
 }