Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

AutoLockScrolling.js 3.5 KiB

3 lat temu
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
  6. var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
  7. var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  8. var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  9. var _createClass2 = require('babel-runtime/helpers/createClass');
  10. var _createClass3 = _interopRequireDefault(_createClass2);
  11. var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  12. var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  13. var _inherits2 = require('babel-runtime/helpers/inherits');
  14. var _inherits3 = _interopRequireDefault(_inherits2);
  15. var _react = require('react');
  16. var _propTypes = require('prop-types');
  17. var _propTypes2 = _interopRequireDefault(_propTypes);
  18. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  19. var originalBodyOverflow = null;
  20. var lockingCounter = 0;
  21. var AutoLockScrolling = function (_Component) {
  22. (0, _inherits3.default)(AutoLockScrolling, _Component);
  23. function AutoLockScrolling() {
  24. var _ref;
  25. var _temp, _this, _ret;
  26. (0, _classCallCheck3.default)(this, AutoLockScrolling);
  27. for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
  28. args[_key] = arguments[_key];
  29. }
  30. return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = AutoLockScrolling.__proto__ || (0, _getPrototypeOf2.default)(AutoLockScrolling)).call.apply(_ref, [this].concat(args))), _this), _this.locked = false, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  31. }
  32. (0, _createClass3.default)(AutoLockScrolling, [{
  33. key: 'componentDidMount',
  34. value: function componentDidMount() {
  35. if (this.props.lock === true) {
  36. this.preventScrolling();
  37. }
  38. }
  39. }, {
  40. key: 'componentWillReceiveProps',
  41. value: function componentWillReceiveProps(nextProps) {
  42. if (this.props.lock !== nextProps.lock) {
  43. if (nextProps.lock) {
  44. this.preventScrolling();
  45. } else {
  46. this.allowScrolling();
  47. }
  48. }
  49. }
  50. }, {
  51. key: 'componentWillUnmount',
  52. value: function componentWillUnmount() {
  53. this.allowScrolling();
  54. }
  55. // force to only lock/unlock once
  56. }, {
  57. key: 'preventScrolling',
  58. value: function preventScrolling() {
  59. if (this.locked === true) {
  60. return;
  61. }
  62. lockingCounter = lockingCounter + 1;
  63. this.locked = true;
  64. // only lock the first time the component is mounted.
  65. if (lockingCounter === 1) {
  66. var body = document.getElementsByTagName('body')[0];
  67. originalBodyOverflow = body.style.overflow;
  68. body.style.overflow = 'hidden';
  69. }
  70. }
  71. }, {
  72. key: 'allowScrolling',
  73. value: function allowScrolling() {
  74. if (this.locked === true) {
  75. lockingCounter = lockingCounter - 1;
  76. this.locked = false;
  77. }
  78. if (lockingCounter === 0 && originalBodyOverflow !== null) {
  79. var body = document.getElementsByTagName('body')[0];
  80. body.style.overflow = originalBodyOverflow || '';
  81. originalBodyOverflow = null;
  82. }
  83. }
  84. }, {
  85. key: 'render',
  86. value: function render() {
  87. return null;
  88. }
  89. }]);
  90. return AutoLockScrolling;
  91. }(_react.Component);
  92. AutoLockScrolling.propTypes = process.env.NODE_ENV !== "production" ? {
  93. lock: _propTypes2.default.bool.isRequired
  94. } : {};
  95. exports.default = AutoLockScrolling;