99c110b3355b90c67b71dd6848a5a57b79644280f5954b79060bf8bc2289586da2a5dc4051710f39f90b13e9ada7b45bb3f3aeda19dcafb459fd57f38827ef 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  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. import { createFastDomNode } from '../../../../base/browser/fastDomNode.js';
  6. import { OverviewZoneManager } from '../../../common/viewModel/overviewZoneManager.js';
  7. import { ViewEventHandler } from '../../../common/viewEventHandler.js';
  8. export class OverviewRuler extends ViewEventHandler {
  9. constructor(context, cssClassName) {
  10. super();
  11. this._context = context;
  12. const options = this._context.configuration.options;
  13. this._domNode = createFastDomNode(document.createElement('canvas'));
  14. this._domNode.setClassName(cssClassName);
  15. this._domNode.setPosition('absolute');
  16. this._domNode.setLayerHinting(true);
  17. this._domNode.setContain('strict');
  18. this._zoneManager = new OverviewZoneManager((lineNumber) => this._context.viewLayout.getVerticalOffsetForLineNumber(lineNumber));
  19. this._zoneManager.setDOMWidth(0);
  20. this._zoneManager.setDOMHeight(0);
  21. this._zoneManager.setOuterHeight(this._context.viewLayout.getScrollHeight());
  22. this._zoneManager.setLineHeight(options.get(61 /* EditorOption.lineHeight */));
  23. this._zoneManager.setPixelRatio(options.get(131 /* EditorOption.pixelRatio */));
  24. this._context.addEventHandler(this);
  25. }
  26. dispose() {
  27. this._context.removeEventHandler(this);
  28. super.dispose();
  29. }
  30. // ---- begin view event handlers
  31. onConfigurationChanged(e) {
  32. const options = this._context.configuration.options;
  33. if (e.hasChanged(61 /* EditorOption.lineHeight */)) {
  34. this._zoneManager.setLineHeight(options.get(61 /* EditorOption.lineHeight */));
  35. this._render();
  36. }
  37. if (e.hasChanged(131 /* EditorOption.pixelRatio */)) {
  38. this._zoneManager.setPixelRatio(options.get(131 /* EditorOption.pixelRatio */));
  39. this._domNode.setWidth(this._zoneManager.getDOMWidth());
  40. this._domNode.setHeight(this._zoneManager.getDOMHeight());
  41. this._domNode.domNode.width = this._zoneManager.getCanvasWidth();
  42. this._domNode.domNode.height = this._zoneManager.getCanvasHeight();
  43. this._render();
  44. }
  45. return true;
  46. }
  47. onFlushed(e) {
  48. this._render();
  49. return true;
  50. }
  51. onScrollChanged(e) {
  52. if (e.scrollHeightChanged) {
  53. this._zoneManager.setOuterHeight(e.scrollHeight);
  54. this._render();
  55. }
  56. return true;
  57. }
  58. onZonesChanged(e) {
  59. this._render();
  60. return true;
  61. }
  62. // ---- end view event handlers
  63. getDomNode() {
  64. return this._domNode.domNode;
  65. }
  66. setLayout(position) {
  67. this._domNode.setTop(position.top);
  68. this._domNode.setRight(position.right);
  69. let hasChanged = false;
  70. hasChanged = this._zoneManager.setDOMWidth(position.width) || hasChanged;
  71. hasChanged = this._zoneManager.setDOMHeight(position.height) || hasChanged;
  72. if (hasChanged) {
  73. this._domNode.setWidth(this._zoneManager.getDOMWidth());
  74. this._domNode.setHeight(this._zoneManager.getDOMHeight());
  75. this._domNode.domNode.width = this._zoneManager.getCanvasWidth();
  76. this._domNode.domNode.height = this._zoneManager.getCanvasHeight();
  77. this._render();
  78. }
  79. }
  80. setZones(zones) {
  81. this._zoneManager.setZones(zones);
  82. this._render();
  83. }
  84. _render() {
  85. if (this._zoneManager.getOuterHeight() === 0) {
  86. return false;
  87. }
  88. const width = this._zoneManager.getCanvasWidth();
  89. const height = this._zoneManager.getCanvasHeight();
  90. const colorZones = this._zoneManager.resolveColorZones();
  91. const id2Color = this._zoneManager.getId2Color();
  92. const ctx = this._domNode.domNode.getContext('2d');
  93. ctx.clearRect(0, 0, width, height);
  94. if (colorZones.length > 0) {
  95. this._renderOneLane(ctx, colorZones, id2Color, width);
  96. }
  97. return true;
  98. }
  99. _renderOneLane(ctx, colorZones, id2Color, width) {
  100. let currentColorId = 0;
  101. let currentFrom = 0;
  102. let currentTo = 0;
  103. for (const zone of colorZones) {
  104. const zoneColorId = zone.colorId;
  105. const zoneFrom = zone.from;
  106. const zoneTo = zone.to;
  107. if (zoneColorId !== currentColorId) {
  108. ctx.fillRect(0, currentFrom, width, currentTo - currentFrom);
  109. currentColorId = zoneColorId;
  110. ctx.fillStyle = id2Color[currentColorId];
  111. currentFrom = zoneFrom;
  112. currentTo = zoneTo;
  113. }
  114. else {
  115. if (currentTo >= zoneFrom) {
  116. currentTo = Math.max(currentTo, zoneTo);
  117. }
  118. else {
  119. ctx.fillRect(0, currentFrom, width, currentTo - currentFrom);
  120. currentFrom = zoneFrom;
  121. currentTo = zoneTo;
  122. }
  123. }
  124. }
  125. ctx.fillRect(0, currentFrom, width, currentTo - currentFrom);
  126. }
  127. }