Skip to content

Commit 067428f

Browse files
committed
Add title to goto error box, error text uses editor font, microsoft#1927
1 parent d5b9f66 commit 067428f

2 files changed

Lines changed: 76 additions & 46 deletions

File tree

src/vs/editor/contrib/gotoError/browser/gotoError.css

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,10 @@
55
/* marker zone */
66

77
.monaco-editor .marker-widget {
8+
padding-left: 20px;
89
background-color: white;
9-
font-size: 0.9em;
10+
overflow: hidden;
11+
text-overflow: ellipsis;
1012
}
1113

1214
.monaco-editor.vs-dark .marker-widget {
@@ -18,34 +20,37 @@
1820
background-color: #0C141F;
1921
}
2022

21-
.monaco-editor .marker-widget .quickfixhead {
23+
.monaco-editor .marker-widget .descriptioncontainer {
24+
white-space: pre-wrap;
25+
}
26+
27+
.monaco-editor .marker-widget .fixes {
28+
font-size: 0.9em;
29+
position: absolute;
30+
bottom: 0;
31+
}
32+
33+
.monaco-editor .marker-widget .fixes .quickfixhead {
2234
background-image: url('lightbulp.svg');
2335
background-repeat: no-repeat;
2436
padding-left: 20px;
2537
}
2638

27-
.monaco-editor.vs-dark .marker-widget .quickfixhead, .monaco-editor.hc-black .marker-widget .quickfixhead {
39+
.monaco-editor.vs-dark .marker-widget .fixes .quickfixhead,
40+
.monaco-editor.hc-black .marker-widget .fixes .quickfixhead {
2841
background-image: url('lightbulp-dark.svg');
2942
}
3043

31-
.monaco-editor .marker-widget .descriptioncontainer {
32-
height: 3.2em;
33-
overflow: hidden;
34-
text-overflow: ellipsis;
35-
}
36-
37-
.monaco-editor .marker-widget .quickfixentry {
44+
.monaco-editor .marker-widget .fixes .quickfixentry {
3845
text-decoration: underline;
3946
}
4047

41-
.monaco-editor .marker-widget .quickfixentry:hover {
48+
.monaco-editor .marker-widget .fixes .quickfixentry:hover {
4249
cursor: pointer;
4350
color: blue;
4451
}
4552

46-
.monaco-editor.vs-dark .marker-widget .quickfixentry:hover, .monaco-editor.hc-black .marker-widget .quickfixentry:hover {
53+
.monaco-editor.vs-dark .marker-widget .fixes .quickfixentry:hover,
54+
.monaco-editor.hc-black .marker-widget .fixes .quickfixentry:hover {
4755
color: lightblue;
4856
}
49-
50-
51-

src/vs/editor/contrib/gotoError/browser/gotoError.ts

Lines changed: 56 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import * as editorCommon from 'vs/editor/common/editorCommon';
2828
import {CommonEditorRegistry, ContextKey, EditorActionDescriptor} from 'vs/editor/common/editorCommonExtensions';
2929
import {ICodeEditor} from 'vs/editor/browser/editorBrowser';
3030
import {EditorBrowserRegistry} from 'vs/editor/browser/editorBrowserExtensions';
31-
import {IOptions, ZoneWidget} from 'vs/editor/contrib/zoneWidget/browser/zoneWidget';
31+
import {PeekViewWidget} from 'vs/editor/contrib/zoneWidget/browser/peekViewWidget';
3232
import {getCodeActions, IQuickFix2} from 'vs/editor/contrib/quickFix/common/quickFix';
3333

3434
class MarkerModel {
@@ -155,12 +155,18 @@ class MarkerModel {
155155
return null;
156156
}
157157

158-
public indexOf(marker: IMarker): number {
159-
return this._markers.indexOf(marker);
160-
}
158+
public get stats(): { errors: number; others: number; } {
159+
let errors = 0;
160+
let others = 0;
161161

162-
public length(): number {
163-
return this._markers.length;
162+
for (let marker of this._markers) {
163+
if (marker.severity === Severity.Error) {
164+
errors += 1;
165+
} else {
166+
others += 1;
167+
}
168+
}
169+
return { errors, others };
164170
}
165171

166172
public reveal(): void {
@@ -292,26 +298,21 @@ class FixesWidget {
292298
}
293299
}
294300

295-
var zoneOptions: IOptions = {
296-
showFrame: true,
297-
showArrow: true,
298-
isAccessible: true
299-
};
300301

301-
class MarkerNavigationWidget extends ZoneWidget {
302+
class MarkerNavigationWidget extends PeekViewWidget {
302303

303304
private _container: HTMLElement;
304305
private _element: HTMLElement;
305306
private _fixesWidget: FixesWidget;
306307
private _callOnDispose: IDisposable[] = [];
307308

308309
constructor(editor: ICodeEditor, private _model: MarkerModel, private _keybindingService: IKeybindingService) {
309-
super(editor, zoneOptions);
310+
super(editor, undefined, { showArrow: true, showFrame: false, isAccessible: true });
310311
this.create();
311312
this._wireModelAndView();
312313
}
313314

314-
protected _fillContainer(container: HTMLElement): void {
315+
protected _fillBody(container: HTMLElement): void {
315316
this._container = container;
316317

317318
dom.addClass(this._container, 'marker-widget');
@@ -323,8 +324,10 @@ class MarkerNavigationWidget extends ZoneWidget {
323324
this._element.setAttribute('aria-live', 'assertive');
324325
this._element.setAttribute('role', 'alert');
325326
this._container.appendChild(this._element);
327+
this.editor.applyFontInfo(this._element);
326328

327329
this._fixesWidget = new FixesWidget(this._container, this._keybindingService);
330+
this._fixesWidget.domNode.classList.add('fixes');
328331
this._callOnDispose.push(this._fixesWidget);
329332
}
330333

@@ -334,7 +337,31 @@ class MarkerNavigationWidget extends ZoneWidget {
334337
}
335338

336339
private _wireModelAndView(): void {
340+
// listen to events
337341
this._model.onCurrentMarkerChanged(this.showAtMarker, this, this._callOnDispose);
342+
343+
// update title based on stats
344+
let {errors, others} = this._model.stats;
345+
if (errors === 0 && others === 0) {
346+
this.setTitle(nls.localize('title.no', "No Problems"));
347+
} else {
348+
let msgErrors: string;
349+
if (errors > 1) {
350+
msgErrors = nls.localize('errors.n', "{0} Errors", errors);
351+
} else if (errors > 0) {
352+
msgErrors = nls.localize('errors.1', "1 Error");
353+
}
354+
let msgOthers: string;
355+
if (others > 1) {
356+
msgOthers = nls.localize('others.n', "{0} Others", others);
357+
} else if (others > 0) {
358+
msgOthers = nls.localize('others.1', "1 Warning");
359+
}
360+
361+
this.setTitle(msgErrors && msgOthers
362+
? nls.localize('both', "{0}, {1}", msgErrors, msgOthers)
363+
: msgErrors || msgOthers);
364+
}
338365
}
339366

340367
public showAtMarker(marker: IMarker): void {
@@ -343,7 +370,7 @@ class MarkerNavigationWidget extends ZoneWidget {
343370
return;
344371
}
345372

346-
// set color
373+
// update frame color
347374
switch (marker.severity) {
348375
case Severity.Error:
349376
this.options.frameColor = '#ff5a5a';
@@ -355,19 +382,17 @@ class MarkerNavigationWidget extends ZoneWidget {
355382
}
356383

357384
// update label and show
358-
let text = strings.format('({0}/{1}) ', this._model.indexOf(marker) + 1, this._model.length());
359-
if (marker.source) {
360-
text = `${text}[${marker.source}] `;
361-
}
362385
dom.clearNode(this._element);
363-
this._element.appendChild(document.createTextNode(text));
364386
this._element.appendChild(renderHtml(marker.message));
365387

366-
this._fixesWidget
367-
.update(getCodeActions(this.editor.getModel(), Range.lift(marker)))
368-
.then(() => this.show(new Position(marker.startLineNumber, marker.startColumn), 4));
388+
const range = Range.lift(marker);
389+
const lines = strings.computeLineStarts(marker.message).length;
390+
this._model.withoutWatchingEditorPosition(() => this.show(range.getStartPosition(), lines + 2));
369391

370-
this._model.withoutWatchingEditorPosition(() => this.show(new Position(marker.startLineNumber, marker.startColumn), 3));
392+
// check for fixes and update widget
393+
this._fixesWidget
394+
.update(getCodeActions(this.editor.getModel(), range))
395+
.then(() => this.show(range.getStartPosition(), lines + 3));
371396
}
372397

373398
public dispose(): void {
@@ -437,6 +462,7 @@ class MarkerController implements editorCommon.IEditorContribution {
437462
private _cleanUp(): void {
438463
this._markersNavigationVisible.reset();
439464
this._callOnClose = dispose(this._callOnClose);
465+
this._zone.dispose();
440466
this._zone = null;
441467
this._model = null;
442468
}
@@ -453,20 +479,19 @@ class MarkerController implements editorCommon.IEditorContribution {
453479
this._markersNavigationVisible.set(true);
454480

455481
this._callOnClose.push(this._model);
456-
this._callOnClose.push(this._zone);
457-
458-
this._callOnClose.push(this._editor.onDidChangeModel(() => {
459-
this._cleanUp();
460-
}));
461482

483+
this._callOnClose.push(this._editor.onDidChangeModel(() => this._cleanUp()));
484+
this._callOnClose.push(this._zone.onDidClose(() => this._cleanUp()));
462485
this._model.onCurrentMarkerChanged(marker => !marker && this._cleanUp(), undefined, this._callOnClose);
463486
this._markerService.onMarkerChanged(this._onMarkerChanged, this, this._callOnClose);
464487
return this._model;
465488
}
466489

467490
public closeMarkersNavigation(): void {
468-
this._cleanUp();
469-
this._editor.focus();
491+
if (this._zone) {
492+
this._zone.dispose();
493+
this._editor.focus();
494+
}
470495
}
471496

472497
private _onMarkerChanged(changedResources: URI[]): void {

0 commit comments

Comments
 (0)