mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-08 09:38:26 -05:00
Notebook Text Cell Highlight Improvements (#12197)
* 1st iteration * works but multiple highlights * remove comment * Works but multiple selects * wip * cleanup * cleanup * Update TPN * Add mark.js to remote + web * PR feedback * Tweak workbench html files
This commit is contained in:
@@ -24,9 +24,11 @@ import { ICellModel } from 'sql/workbench/services/notebook/browser/models/model
|
||||
import { NotebookModel } from 'sql/workbench/services/notebook/browser/models/notebookModel';
|
||||
import { ISanitizer, defaultSanitizer } from 'sql/workbench/services/notebook/browser/outputs/sanitizer';
|
||||
import { CodeComponent } from 'sql/workbench/contrib/notebook/browser/cellViews/code.component';
|
||||
import { NotebookRange, ICellEditorProvider } from 'sql/workbench/services/notebook/browser/notebookService';
|
||||
import { NotebookRange, ICellEditorProvider, INotebookService } from 'sql/workbench/services/notebook/browser/notebookService';
|
||||
import { IColorTheme } from 'vs/platform/theme/common/themeService';
|
||||
import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
|
||||
import * as Mark from 'mark.js';
|
||||
import { NotebookInput } from 'sql/workbench/contrib/notebook/browser/models/notebookInput';
|
||||
|
||||
export const TEXT_SELECTOR: string = 'text-cell-component';
|
||||
const USER_SELECT_CLASS = 'actionselect';
|
||||
@@ -89,7 +91,9 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
|
||||
@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
|
||||
@Inject(IInstantiationService) private _instantiationService: IInstantiationService,
|
||||
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
|
||||
@Inject(IConfigurationService) private _configurationService: IConfigurationService
|
||||
@Inject(IConfigurationService) private _configurationService: IConfigurationService,
|
||||
@Inject(INotebookService) private _notebookService: INotebookService,
|
||||
|
||||
) {
|
||||
super();
|
||||
this.isEditMode = true;
|
||||
@@ -297,22 +301,31 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
|
||||
|
||||
private addDecoration(range: NotebookRange): void {
|
||||
if (range && this.output && this.output.nativeElement) {
|
||||
let children = this.getHtmlElements();
|
||||
let ele = children[range.startLineNumber - 1];
|
||||
if (ele) {
|
||||
DOM.addClass(ele, 'rangeHighlight');
|
||||
ele.scrollIntoView({ behavior: 'smooth' });
|
||||
let elements = this.getHtmlElements();
|
||||
if (elements?.length >= range.startLineNumber) {
|
||||
let elementContainingText = elements[range.startLineNumber - 1];
|
||||
let mark = new Mark(elementContainingText);
|
||||
let editor = this._notebookService.findNotebookEditor(this.model.notebookUri);
|
||||
if (editor) {
|
||||
let findModel = (editor.notebookParams.input as NotebookInput).notebookFindModel;
|
||||
if (findModel?.findMatches?.length > 0) {
|
||||
let searchString = findModel.findExpression;
|
||||
mark.mark(searchString, {
|
||||
className: 'rangeHighlight'
|
||||
});
|
||||
elementContainingText.scrollIntoView({ behavior: 'smooth' });
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private removeDecoration(range: NotebookRange): void {
|
||||
if (range && this.output && this.output.nativeElement) {
|
||||
let children = this.getHtmlElements();
|
||||
let ele = children[range.startLineNumber - 1];
|
||||
if (ele) {
|
||||
DOM.removeClass(ele, 'rangeHighlight');
|
||||
}
|
||||
let elements = this.getHtmlElements();
|
||||
let elementContainingText = elements[range.startLineNumber - 1];
|
||||
let mark = new Mark(elementContainingText);
|
||||
mark.unmark({ acrossElements: true, className: 'rangeHighlight' });
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -85,6 +85,7 @@
|
||||
'ansi_up': `${window.location.origin}/static/remote/web/node_modules/ansi_up/ansi_up.js`,
|
||||
'iconv-lite-umd': `${window.location.origin}/static/remote/web/node_modules/iconv-lite-umd/lib/iconv-lite-umd.js`,
|
||||
'jschardet': `${window.location.origin}/static/remote/web/node_modules/jschardet/dist/jschardet.min.js`,
|
||||
'mark.js': `${window.location.origin}/static/remote/web/node_modules/mark.js/dist/mark.min.js`
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -69,6 +69,7 @@
|
||||
'ansi_up': `${window.location.origin}/static/node_modules/ansi_up/ansi_up.js`,
|
||||
'iconv-lite-umd': `${window.location.origin}/static/node_modules/iconv-lite-umd/lib/iconv-lite-umd.js`,
|
||||
'jschardet': `${window.location.origin}/static/node_modules/jschardet/dist/jschardet.min.js`,
|
||||
'mark.js': `${window.location.origin}/static/node_modules/mark.js/dist/mark.min.js`
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -477,7 +477,7 @@ var AMDLoader;
|
||||
}
|
||||
var result = moduleId;
|
||||
var results;
|
||||
if ((!AMDLoader.Utilities.endsWith(result, '.js') || result === 'chart.js') && !AMDLoader.Utilities.isAbsolutePath(result)) {
|
||||
if ((!AMDLoader.Utilities.endsWith(result, '.js') || result === 'chart.js' || result === 'mark.js') && !AMDLoader.Utilities.isAbsolutePath(result)) {
|
||||
results = this._applyPaths(result);
|
||||
for (var i = 0, len = results.length; i < len; i++) {
|
||||
if (this.isBuild() && results[i] === 'empty:') {
|
||||
|
||||
Reference in New Issue
Block a user