64493a1ae3e81120321881dc99df3616e0fa61f2e8b8c62dfb28b33e6550dff92efc315ff6a85a3392f5b8d886d77e70bbb837f4e85294edcb9ede7f2bdf8f 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. /*---------------------------------------------------------------------------------------------
  2. * Copyright (c) Microsoft Corporation. All rights reserved.
  3. * Licensed under the MIT License. See License.txt in the project root for license information.
  4. *--------------------------------------------------------------------------------------------*/
  5. /**
  6. * The minimal size of the slider (such that it can still be clickable) -- it is artificially enlarged.
  7. */
  8. const MINIMUM_SLIDER_SIZE = 20;
  9. export class ScrollbarState {
  10. constructor(arrowSize, scrollbarSize, oppositeScrollbarSize, visibleSize, scrollSize, scrollPosition) {
  11. this._scrollbarSize = Math.round(scrollbarSize);
  12. this._oppositeScrollbarSize = Math.round(oppositeScrollbarSize);
  13. this._arrowSize = Math.round(arrowSize);
  14. this._visibleSize = visibleSize;
  15. this._scrollSize = scrollSize;
  16. this._scrollPosition = scrollPosition;
  17. this._computedAvailableSize = 0;
  18. this._computedIsNeeded = false;
  19. this._computedSliderSize = 0;
  20. this._computedSliderRatio = 0;
  21. this._computedSliderPosition = 0;
  22. this._refreshComputedValues();
  23. }
  24. clone() {
  25. return new ScrollbarState(this._arrowSize, this._scrollbarSize, this._oppositeScrollbarSize, this._visibleSize, this._scrollSize, this._scrollPosition);
  26. }
  27. setVisibleSize(visibleSize) {
  28. const iVisibleSize = Math.round(visibleSize);
  29. if (this._visibleSize !== iVisibleSize) {
  30. this._visibleSize = iVisibleSize;
  31. this._refreshComputedValues();
  32. return true;
  33. }
  34. return false;
  35. }
  36. setScrollSize(scrollSize) {
  37. const iScrollSize = Math.round(scrollSize);
  38. if (this._scrollSize !== iScrollSize) {
  39. this._scrollSize = iScrollSize;
  40. this._refreshComputedValues();
  41. return true;
  42. }
  43. return false;
  44. }
  45. setScrollPosition(scrollPosition) {
  46. const iScrollPosition = Math.round(scrollPosition);
  47. if (this._scrollPosition !== iScrollPosition) {
  48. this._scrollPosition = iScrollPosition;
  49. this._refreshComputedValues();
  50. return true;
  51. }
  52. return false;
  53. }
  54. setScrollbarSize(scrollbarSize) {
  55. this._scrollbarSize = Math.round(scrollbarSize);
  56. }
  57. setOppositeScrollbarSize(oppositeScrollbarSize) {
  58. this._oppositeScrollbarSize = Math.round(oppositeScrollbarSize);
  59. }
  60. static _computeValues(oppositeScrollbarSize, arrowSize, visibleSize, scrollSize, scrollPosition) {
  61. const computedAvailableSize = Math.max(0, visibleSize - oppositeScrollbarSize);
  62. const computedRepresentableSize = Math.max(0, computedAvailableSize - 2 * arrowSize);
  63. const computedIsNeeded = (scrollSize > 0 && scrollSize > visibleSize);
  64. if (!computedIsNeeded) {
  65. // There is no need for a slider
  66. return {
  67. computedAvailableSize: Math.round(computedAvailableSize),
  68. computedIsNeeded: computedIsNeeded,
  69. computedSliderSize: Math.round(computedRepresentableSize),
  70. computedSliderRatio: 0,
  71. computedSliderPosition: 0,
  72. };
  73. }
  74. // We must artificially increase the size of the slider if needed, since the slider would be too small to grab with the mouse otherwise
  75. const computedSliderSize = Math.round(Math.max(MINIMUM_SLIDER_SIZE, Math.floor(visibleSize * computedRepresentableSize / scrollSize)));
  76. // The slider can move from 0 to `computedRepresentableSize` - `computedSliderSize`
  77. // in the same way `scrollPosition` can move from 0 to `scrollSize` - `visibleSize`.
  78. const computedSliderRatio = (computedRepresentableSize - computedSliderSize) / (scrollSize - visibleSize);
  79. const computedSliderPosition = (scrollPosition * computedSliderRatio);
  80. return {
  81. computedAvailableSize: Math.round(computedAvailableSize),
  82. computedIsNeeded: computedIsNeeded,
  83. computedSliderSize: Math.round(computedSliderSize),
  84. computedSliderRatio: computedSliderRatio,
  85. computedSliderPosition: Math.round(computedSliderPosition),
  86. };
  87. }
  88. _refreshComputedValues() {
  89. const r = ScrollbarState._computeValues(this._oppositeScrollbarSize, this._arrowSize, this._visibleSize, this._scrollSize, this._scrollPosition);
  90. this._computedAvailableSize = r.computedAvailableSize;
  91. this._computedIsNeeded = r.computedIsNeeded;
  92. this._computedSliderSize = r.computedSliderSize;
  93. this._computedSliderRatio = r.computedSliderRatio;
  94. this._computedSliderPosition = r.computedSliderPosition;
  95. }
  96. getArrowSize() {
  97. return this._arrowSize;
  98. }
  99. getScrollPosition() {
  100. return this._scrollPosition;
  101. }
  102. getRectangleLargeSize() {
  103. return this._computedAvailableSize;
  104. }
  105. getRectangleSmallSize() {
  106. return this._scrollbarSize;
  107. }
  108. isNeeded() {
  109. return this._computedIsNeeded;
  110. }
  111. getSliderSize() {
  112. return this._computedSliderSize;
  113. }
  114. getSliderPosition() {
  115. return this._computedSliderPosition;
  116. }
  117. /**
  118. * Compute a desired `scrollPosition` such that `offset` ends up in the center of the slider.
  119. * `offset` is based on the same coordinate system as the `sliderPosition`.
  120. */
  121. getDesiredScrollPositionFromOffset(offset) {
  122. if (!this._computedIsNeeded) {
  123. // no need for a slider
  124. return 0;
  125. }
  126. const desiredSliderPosition = offset - this._arrowSize - this._computedSliderSize / 2;
  127. return Math.round(desiredSliderPosition / this._computedSliderRatio);
  128. }
  129. /**
  130. * Compute a desired `scrollPosition` from if offset is before or after the slider position.
  131. * If offset is before slider, treat as a page up (or left). If after, page down (or right).
  132. * `offset` and `_computedSliderPosition` are based on the same coordinate system.
  133. * `_visibleSize` corresponds to a "page" of lines in the returned coordinate system.
  134. */
  135. getDesiredScrollPositionFromOffsetPaged(offset) {
  136. if (!this._computedIsNeeded) {
  137. // no need for a slider
  138. return 0;
  139. }
  140. const correctedOffset = offset - this._arrowSize; // compensate if has arrows
  141. let desiredScrollPosition = this._scrollPosition;
  142. if (correctedOffset < this._computedSliderPosition) {
  143. desiredScrollPosition -= this._visibleSize; // page up/left
  144. }
  145. else {
  146. desiredScrollPosition += this._visibleSize; // page down/right
  147. }
  148. return desiredScrollPosition;
  149. }
  150. /**
  151. * Compute a desired `scrollPosition` such that the slider moves by `delta`.
  152. */
  153. getDesiredScrollPositionFromDelta(delta) {
  154. if (!this._computedIsNeeded) {
  155. // no need for a slider
  156. return 0;
  157. }
  158. const desiredSliderPosition = this._computedSliderPosition + delta;
  159. return Math.round(desiredSliderPosition / this._computedSliderRatio);
  160. }
  161. }