tandem-front-end
Version:
Visual editor for web components
44 lines • 2.35 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var lodash_1 = require("lodash");
var React = require("react");
var tandem_common_1 = require("tandem-common");
var recompose_1 = require("recompose");
var DEFAULT_MIN = 0;
var DEFAULT_MAX = 100;
exports.default = recompose_1.compose(recompose_1.pure, recompose_1.withState("percent", "setPercent", function (_a) {
var _b = _a.min, min = _b === void 0 ? DEFAULT_MIN : _b, _c = _a.max, max = _c === void 0 ? DEFAULT_MAX : _c, value = _a.value;
return lodash_1.clamp((value || 0) / (max - min), 0, 1);
}), recompose_1.withHandlers(function () {
var _slider;
return {
setSlider: function () { return function (slider) {
_slider = slider;
}; },
onMouseDown: function (_a) {
var _b = _a.min, min = _b === void 0 ? DEFAULT_MIN : _b, _c = _a.max, max = _c === void 0 ? DEFAULT_MAX : _c, setPercent = _a.setPercent, onChange = _a.onChange, onChangeComplete = _a.onChangeComplete;
return function (event) {
var changeCallback = function (callback) {
return function (event) {
var sliderRect = _slider.getBoundingClientRect();
var relativeLeft = event.clientX - sliderRect.left;
var percent = relativeLeft / sliderRect.width;
var change = max - min;
percent = lodash_1.clamp(relativeLeft / sliderRect.width * change / change, 0, 1);
percent = Number(percent.toFixed(3));
setPercent(percent);
if (callback) {
callback(percent);
}
};
};
tandem_common_1.startDOMDrag(event, function () { }, changeCallback(onChange), changeCallback(onChangeComplete));
};
}
};
}), function (Base) { return function (_a) {
var percent = _a.percent, setSlider = _a.setSlider, onMouseDown = _a.onMouseDown, grabberStyle = _a.grabberStyle;
return (React.createElement("span", { ref: setSlider },
React.createElement(Base, { onMouseDown: onMouseDown, grabberProps: { style: { left: percent * 100 + "%" } } })));
}; });
//# sourceMappingURL=controller.js.map