drag-scrollbar.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. 'use strict';
  2. var d = require('../../lib/dom')
  3. , h = require('../../lib/helper')
  4. , instances = require('../instances')
  5. , updateGeometry = require('../update-geometry')
  6. , updateScroll = require('../update-scroll');
  7. function bindMouseScrollXHandler(element, i) {
  8. var currentLeft = null;
  9. var currentPageX = null;
  10. function updateScrollLeft(deltaX) {
  11. var newLeft = currentLeft + (deltaX * i.railXRatio);
  12. var maxLeft = Math.max(0, i.scrollbarXRail.getBoundingClientRect().left) + (i.railXRatio * (i.railXWidth - i.scrollbarXWidth));
  13. if (newLeft < 0) {
  14. i.scrollbarXLeft = 0;
  15. } else if (newLeft > maxLeft) {
  16. i.scrollbarXLeft = maxLeft;
  17. } else {
  18. i.scrollbarXLeft = newLeft;
  19. }
  20. var scrollLeft = h.toInt(i.scrollbarXLeft * (i.contentWidth - i.containerWidth) / (i.containerWidth - (i.railXRatio * i.scrollbarXWidth))) - i.negativeScrollAdjustment;
  21. updateScroll(element, 'left', scrollLeft);
  22. }
  23. var mouseMoveHandler = function (e) {
  24. updateScrollLeft(e.pageX - currentPageX);
  25. updateGeometry(element);
  26. e.stopPropagation();
  27. e.preventDefault();
  28. };
  29. var mouseUpHandler = function () {
  30. h.stopScrolling(element, 'x');
  31. i.event.unbind(i.ownerDocument, 'mousemove', mouseMoveHandler);
  32. };
  33. i.event.bind(i.scrollbarX, 'mousedown', function (e) {
  34. currentPageX = e.pageX;
  35. currentLeft = h.toInt(d.css(i.scrollbarX, 'left')) * i.railXRatio;
  36. h.startScrolling(element, 'x');
  37. i.event.bind(i.ownerDocument, 'mousemove', mouseMoveHandler);
  38. i.event.once(i.ownerDocument, 'mouseup', mouseUpHandler);
  39. e.stopPropagation();
  40. e.preventDefault();
  41. });
  42. }
  43. function bindMouseScrollYHandler(element, i) {
  44. var currentTop = null;
  45. var currentPageY = null;
  46. function updateScrollTop(deltaY) {
  47. var newTop = currentTop + (deltaY * i.railYRatio);
  48. var maxTop = Math.max(0, i.scrollbarYRail.getBoundingClientRect().top) + (i.railYRatio * (i.railYHeight - i.scrollbarYHeight));
  49. if (newTop < 0) {
  50. i.scrollbarYTop = 0;
  51. } else if (newTop > maxTop) {
  52. i.scrollbarYTop = maxTop;
  53. } else {
  54. i.scrollbarYTop = newTop;
  55. }
  56. var scrollTop = h.toInt(i.scrollbarYTop * (i.contentHeight - i.containerHeight) / (i.containerHeight - (i.railYRatio * i.scrollbarYHeight)));
  57. updateScroll(element, 'top', scrollTop);
  58. }
  59. var mouseMoveHandler = function (e) {
  60. updateScrollTop(e.pageY - currentPageY);
  61. updateGeometry(element);
  62. e.stopPropagation();
  63. e.preventDefault();
  64. };
  65. var mouseUpHandler = function () {
  66. h.stopScrolling(element, 'y');
  67. i.event.unbind(i.ownerDocument, 'mousemove', mouseMoveHandler);
  68. };
  69. i.event.bind(i.scrollbarY, 'mousedown', function (e) {
  70. currentPageY = e.pageY;
  71. currentTop = h.toInt(d.css(i.scrollbarY, 'top')) * i.railYRatio;
  72. h.startScrolling(element, 'y');
  73. i.event.bind(i.ownerDocument, 'mousemove', mouseMoveHandler);
  74. i.event.once(i.ownerDocument, 'mouseup', mouseUpHandler);
  75. e.stopPropagation();
  76. e.preventDefault();
  77. });
  78. }
  79. module.exports = function (element) {
  80. var i = instances.get(element);
  81. bindMouseScrollXHandler(element, i);
  82. bindMouseScrollYHandler(element, i);
  83. };