JSFiddle - React, Tailwind, and code Playground
JavaScript
//may the 'handleEvent' be with you, Luke!
(function(global){ //а зачем global, если ты его не юзаешь?
"use strict";
var dragger; //а зачем?
function GraphDragger(element){
var button,
that = this,
event,
parentSlide;
button = element.querySelector("[role=dragger]");
button.parent = this;
for(event in touch.events) {
if(touch.events.hasOwnProperty(event)) {
button.addEventListener(touch.events[event], this[event]);
}
}
button.addEventListener("click", function(event) {
event.stopPropagation();
that.reset();
}, true);
element.parent = this;
this.element = element;
this.button = button;
this.x = 0;
this.width = parseInt(getComputedStyle(element).width, 10);
this.baseX = parseInt(getComputedStyle(element).left, 10);
this.currentPosition = this.baseX;
this.isPressed = false;
this.isEnable = true;
parentSlide = utils.getElementParent(element, "article").id;
app.screen.onleave(parentSlide, this.reset);
}
GraphDragger.prototype.start = function(event) {
if(touch.isTouch) {
event = event.changedTouches[0];
}
var that = this.parent; //вверх!
if(that.isEnable) {
that.x = event.pageX;
that.isPressed = true;
}
};
GraphDragger.prototype.move = function(event) {
if(touch.isTouch) {
event = event.changedTouches[0];
}
var that = this.parent, //вверх!
deltaX = event.pageX - that.x,
translate = "translate3d(" + deltaX + "px, 0, 0)";
if(that.isPressed && deltaX > 0) {
that.element.style.webkitTransform = translate;
that.currentPosition = that.baseX + deltaX;
if(that.currentPosition > that.width + 50) {
that.isPressed = false;
that.element.style.left = "474px"; //может лучше класс?
that.baseX = that.baseX + deltaX;
that.element.style.webkitTransform = "";
...