Skip to content

Commit 3e500bb

Browse files
alexdimaalexdima
committed
Add minimap.background color and honour it and its opacity
1 parent cb0b066 commit 3e500bb

3 files changed

Lines changed: 36 additions & 15 deletions

File tree

‎src/vs/editor/browser/viewParts/minimap/minimap.ts‎

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,8 @@ import { RenderingContext, RestrictedRenderingContext } from 'vs/editor/common/v
2525
import { ViewContext } from 'vs/editor/common/view/viewContext';
2626
import * as viewEvents from 'vs/editor/common/view/viewEvents';
2727
import { ViewLineData } from 'vs/editor/common/viewModel/viewModel';
28-
import { minimapOpacity, minimapSelection, scrollbarShadow, scrollbarSliderActiveBackground, scrollbarSliderBackground, scrollbarSliderHoverBackground } from 'vs/platform/theme/common/colorRegistry';
29-
import { registerThemingParticipant } from 'vs/platform/theme/common/themeService';
28+
import { minimapSelection, scrollbarShadow, scrollbarSliderActiveBackground, scrollbarSliderBackground, scrollbarSliderHoverBackground, minimapBackground } from 'vs/platform/theme/common/colorRegistry';
29+
import { registerThemingParticipant, ITheme } from 'vs/platform/theme/common/themeService';
3030
import { ModelDecorationMinimapOptions } from 'vs/editor/common/model/textModel';
3131
import { Selection } from 'vs/editor/common/core/selection';
3232
import { Color } from 'vs/base/common/color';
@@ -107,7 +107,9 @@ class MinimapOptions {
107107
*/
108108
public readonly canvasOuterHeight: number;
109109

110-
constructor(configuration: IConfiguration) {
110+
public readonly backgroundColor: RGBA8;
111+
112+
constructor(configuration: IConfiguration, theme: ITheme, tokensColorTracker: MinimapTokensColorTracker) {
111113
const options = configuration.options;
112114
const pixelRatio = options.get(EditorOption.pixelRatio);
113115
const layoutInfo = options.get(EditorOption.layoutInfo);
@@ -131,6 +133,16 @@ class MinimapOptions {
131133

132134
this.canvasOuterWidth = this.canvasInnerWidth / pixelRatio;
133135
this.canvasOuterHeight = this.canvasInnerHeight / pixelRatio;
136+
137+
this.backgroundColor = MinimapOptions._getMinimapBackground(theme, tokensColorTracker);
138+
}
139+
140+
private static _getMinimapBackground(theme: ITheme, tokensColorTracker: MinimapTokensColorTracker): RGBA8 {
141+
const themeColor = theme.getColor(minimapBackground);
142+
if (themeColor) {
143+
return new RGBA8(themeColor.rgba.r, themeColor.rgba.g, themeColor.rgba.b, themeColor.rgba.a);
144+
}
145+
return tokensColorTracker.getColor(ColorId.DefaultBackground);
134146
}
135147

136148
public equals(other: MinimapOptions): boolean {
@@ -148,6 +160,7 @@ class MinimapOptions {
148160
&& this.canvasInnerHeight === other.canvasInnerHeight
149161
&& this.canvasOuterWidth === other.canvasOuterWidth
150162
&& this.canvasOuterHeight === other.canvasOuterHeight
163+
&& this.backgroundColor.equals(other.backgroundColor)
151164
);
152165
}
153166
}
@@ -447,13 +460,13 @@ class MinimapBuffers {
447460

448461
export class Minimap extends ViewPart {
449462

463+
private readonly _tokensColorTracker: MinimapTokensColorTracker;
450464
private readonly _domNode: FastDomNode<HTMLElement>;
451465
private readonly _shadow: FastDomNode<HTMLElement>;
452466
private readonly _canvas: FastDomNode<HTMLCanvasElement>;
453467
private readonly _decorationsCanvas: FastDomNode<HTMLCanvasElement>;
454468
private readonly _slider: FastDomNode<HTMLElement>;
455469
private readonly _sliderHorizontal: FastDomNode<HTMLElement>;
456-
private readonly _tokensColorTracker: MinimapTokensColorTracker;
457470
private readonly _mouseDownListener: IDisposable;
458471
private readonly _sliderMouseMoveMonitor: GlobalMouseMoveMonitor<IStandardMouseMoveEventData>;
459472
private readonly _sliderMouseDownListener: IDisposable;
@@ -473,7 +486,8 @@ export class Minimap extends ViewPart {
473486
constructor(context: ViewContext) {
474487
super(context);
475488

476-
this._options = new MinimapOptions(this._context.configuration);
489+
this._tokensColorTracker = MinimapTokensColorTracker.getInstance();
490+
this._options = new MinimapOptions(this._context.configuration, this._context.theme, this._tokensColorTracker);
477491
this._lastRenderData = null;
478492
this._buffers = null;
479493
this._selectionColor = this._context.theme.getColor(minimapSelection);
@@ -512,8 +526,6 @@ export class Minimap extends ViewPart {
512526
this._sliderHorizontal.setClassName('minimap-slider-horizontal');
513527
this._slider.appendChild(this._sliderHorizontal);
514528

515-
this._tokensColorTracker = MinimapTokensColorTracker.getInstance();
516-
517529
this._applyLayout();
518530

519531
this._mouseDownListener = dom.addStandardDisposableListener(this._domNode.domNode, 'mousedown', (e) => {
@@ -664,15 +676,15 @@ export class Minimap extends ViewPart {
664676
this._canvas.domNode.getContext('2d')!,
665677
this._options.canvasInnerWidth,
666678
this._options.canvasInnerHeight,
667-
this._tokensColorTracker.getColor(ColorId.DefaultBackground)
679+
this._options.backgroundColor
668680
);
669681
}
670682
}
671683
return this._buffers ? this._buffers.getBuffer() : null;
672684
}
673685

674686
private _onOptionsMaybeChanged(): boolean {
675-
const opts = new MinimapOptions(this._context.configuration);
687+
const opts = new MinimapOptions(this._context.configuration, this._context.theme, this._tokensColorTracker);
676688
if (this._options.equals(opts)) {
677689
return false;
678690
}
@@ -745,6 +757,7 @@ export class Minimap extends ViewPart {
745757
this._context.model.invalidateMinimapColorCache();
746758
this._selectionColor = this._context.theme.getColor(minimapSelection);
747759
this._renderDecorations = true;
760+
this._onOptionsMaybeChanged();
748761
return true;
749762
}
750763

@@ -942,7 +955,7 @@ export class Minimap extends ViewPart {
942955
// Fetch rendering info from view model for rest of lines that need rendering.
943956
const lineInfo = this._context.model.getMinimapLinesRenderingData(startLineNumber, endLineNumber, needed);
944957
const tabSize = lineInfo.tabSize;
945-
const background = this._tokensColorTracker.getColor(ColorId.DefaultBackground);
958+
const background = this._options.backgroundColor;
946959
const useLighterFont = this._tokensColorTracker.backgroundIsLight();
947960

948961
// Render the rest of lines
@@ -1141,9 +1154,9 @@ export class Minimap extends ViewPart {
11411154
}
11421155

11431156
registerThemingParticipant((theme, collector) => {
1144-
const minimapOpacityValue = theme.getColor(minimapOpacity);
1145-
if (minimapOpacityValue) {
1146-
collector.addRule(`.monaco-editor .minimap { opacity: ${minimapOpacityValue.rgba.a}; will-change: opacity; }`);
1157+
const minimapBackgroundValue = theme.getColor(minimapBackground);
1158+
if (minimapBackgroundValue) {
1159+
collector.addRule(`.monaco-editor .minimap > canvas { opacity: ${minimapBackgroundValue.rgba.a}; will-change: opacity; }`);
11471160
}
11481161
const sliderBackground = theme.getColor(scrollbarSliderBackground);
11491162
if (sliderBackground) {

‎src/vs/editor/common/core/rgba.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,15 @@ export class RGBA8 {
3636
this.a = RGBA8._clamp(a);
3737
}
3838

39+
public equals(other: RGBA8): boolean {
40+
return (
41+
this.r === other.r
42+
&& this.g === other.g
43+
&& this.b === other.b
44+
&& this.a === other.a
45+
);
46+
}
47+
3948
private static _clamp(c: number): number {
4049
if (c < 0) {
4150
return 0;

‎src/vs/platform/theme/common/colorRegistry.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -238,8 +238,6 @@ export const buttonHoverBackground = registerColor('button.hoverBackground', { d
238238
export const badgeBackground = registerColor('badge.background', { dark: '#4D4D4D', light: '#C4C4C4', hc: Color.black }, nls.localize('badgeBackground', "Badge background color. Badges are small information labels, e.g. for search results count."));
239239
export const badgeForeground = registerColor('badge.foreground', { dark: Color.white, light: '#333', hc: Color.white }, nls.localize('badgeForeground', "Badge foreground color. Badges are small information labels, e.g. for search results count."));
240240

241-
export const minimapOpacity = registerColor('minimapOpacity', { dark: null, light: null, hc: null }, nls.localize('minimapOpacity', "Opacity of minimap in hex. Color data is ignored."));
242-
243241
export const scrollbarShadow = registerColor('scrollbar.shadow', { dark: '#000000', light: '#DDDDDD', hc: null }, nls.localize('scrollbarShadow', "Scrollbar shadow to indicate that the view is scrolled."));
244242
export const scrollbarSliderBackground = registerColor('scrollbarSlider.background', { dark: Color.fromHex('#797979').transparent(0.4), light: Color.fromHex('#646464').transparent(0.4), hc: transparent(contrastBorder, 0.6) }, nls.localize('scrollbarSliderBackground', "Scrollbar slider background color."));
245243
export const scrollbarSliderHoverBackground = registerColor('scrollbarSlider.hoverBackground', { dark: Color.fromHex('#646464').transparent(0.7), light: Color.fromHex('#646464').transparent(0.7), hc: transparent(contrastBorder, 0.8) }, nls.localize('scrollbarSliderHoverBackground', "Scrollbar slider background color when hovering."));
@@ -426,6 +424,7 @@ export const minimapFindMatch = registerColor('minimap.findMatchHighlight', { li
426424
export const minimapSelection = registerColor('minimap.selectionHighlight', { light: '#ADD6FF', dark: '#264F78', hc: '#ffffff' }, nls.localize('minimapSelectionHighlight', 'Minimap marker color for the editor selection.'), true);
427425
export const minimapError = registerColor('minimap.errorHighlight', { dark: new Color(new RGBA(255, 18, 18, 0.7)), light: new Color(new RGBA(255, 18, 18, 0.7)), hc: new Color(new RGBA(255, 50, 50, 1)) }, nls.localize('minimapError', 'Minimap marker color for errors.'));
428426
export const minimapWarning = registerColor('minimap.warningHighlight', { dark: editorWarningForeground, light: editorWarningForeground, hc: editorWarningBorder }, nls.localize('overviewRuleWarning', 'Minimap marker color for warnings.'));
427+
export const minimapBackground = registerColor('minimap.background', { dark: null, light: null, hc: null }, nls.localize('minimapBackground', "Minimap background color."));
429428

430429
export const problemsErrorIconForeground = registerColor('problemsErrorIcon.foreground', { dark: editorErrorForeground, light: editorErrorForeground, hc: editorErrorForeground }, nls.localize('problemsErrorIconForeground', "The color used for the problems error icon."));
431430
export const problemsWarningIconForeground = registerColor('problemsWarningIcon.foreground', { dark: editorWarningForeground, light: editorWarningForeground, hc: editorWarningForeground }, nls.localize('problemsWarningIconForeground', "The color used for the problems warning icon."));

0 commit comments

Comments
 (0)