-
diff --git a/src/sql/workbench/parts/notebook/cellViews/output.component.ts b/src/sql/workbench/parts/notebook/cellViews/output.component.ts
index 647b83adff..73c656e2a0 100644
--- a/src/sql/workbench/parts/notebook/cellViews/output.component.ts
+++ b/src/sql/workbench/parts/notebook/cellViews/output.component.ts
@@ -5,7 +5,7 @@
import 'vs/css!./code';
import 'vs/css!./media/output';
-import { OnInit, Component, Input, Inject, ElementRef, ViewChild } from '@angular/core';
+import { OnInit, Component, Input, Inject, ElementRef, ViewChild, SimpleChange } from '@angular/core';
import { AngularDisposable } from 'sql/base/node/lifecycle';
import { nb } from 'azdata';
import { ICellModel } from 'sql/workbench/parts/notebook/models/modelInterfaces';
@@ -14,8 +14,10 @@ import { MimeModel } from 'sql/workbench/parts/notebook/outputs/common/mimemodel
import * as outputProcessor from 'sql/workbench/parts/notebook/outputs/common/outputProcessor';
import { RenderMimeRegistry } from 'sql/workbench/parts/notebook/outputs/registry';
import { IThemeService } from 'vs/platform/theme/common/themeService';
+import * as DOM from 'vs/base/browser/dom';
export const OUTPUT_SELECTOR: string = 'output-component';
+const USER_SELECT_CLASS ='actionselect';
@Component({
selector: OUTPUT_SELECTOR,
@@ -28,6 +30,7 @@ export class OutputComponent extends AngularDisposable implements OnInit {
private _trusted: boolean;
private _initialized: boolean = false;
private readonly _minimumHeight = 30;
+ private _activeCellId: string;
registry: RenderMimeRegistry;
@@ -47,6 +50,27 @@ export class OutputComponent extends AngularDisposable implements OnInit {
});
}
+ ngOnChanges(changes: { [propKey: string]: SimpleChange }) {
+
+ for (let propName in changes) {
+ if (propName === 'activeCellId') {
+ this.toggleUserSelect(this.isActive());
+ break;
+ }
+ }
+ }
+
+ private toggleUserSelect(userSelect: boolean): void {
+ if (!this.outputElement) {
+ return;
+ }
+ if (userSelect) {
+ DOM.addClass(this.outputElement.nativeElement, USER_SELECT_CLASS);
+ } else {
+ DOM.removeClass(this.outputElement.nativeElement, USER_SELECT_CLASS);
+ }
+ }
+
private renderOutput() {
let node = this.outputElement.nativeElement;
let output = this.cellOutput;
@@ -63,14 +87,21 @@ export class OutputComponent extends AngularDisposable implements OnInit {
return this._trusted;
}
- @Input()
- set trustedMode(value: boolean) {
+ @Input() set trustedMode(value: boolean) {
this._trusted = value;
if (this._initialized) {
this.renderOutput();
}
}
+ @Input() set activeCellId(value: string) {
+ this._activeCellId = value;
+ }
+
+ get activeCellId(): string {
+ return this._activeCellId;
+ }
+
protected createRenderedMimetype(options: MimeModel.IOptions, node: HTMLElement): void {
let mimeType = this.registry.preferredMimeType(
options.data,
@@ -100,4 +131,7 @@ export class OutputComponent extends AngularDisposable implements OnInit {
//this.setState({ node: node });
}
}
+ protected isActive() {
+ return this.cellModel && this.cellModel.id === this.activeCellId;
+ }
}
diff --git a/src/sql/workbench/parts/notebook/cellViews/outputArea.component.html b/src/sql/workbench/parts/notebook/cellViews/outputArea.component.html
index fddff39107..cb94a63a59 100644
--- a/src/sql/workbench/parts/notebook/cellViews/outputArea.component.html
+++ b/src/sql/workbench/parts/notebook/cellViews/outputArea.component.html
@@ -6,7 +6,7 @@
-->
\ No newline at end of file
diff --git a/src/sql/workbench/parts/notebook/cellViews/outputArea.component.ts b/src/sql/workbench/parts/notebook/cellViews/outputArea.component.ts
index ccdfe22df0..268de7c40d 100644
--- a/src/sql/workbench/parts/notebook/cellViews/outputArea.component.ts
+++ b/src/sql/workbench/parts/notebook/cellViews/outputArea.component.ts
@@ -20,6 +20,8 @@ export class OutputAreaComponent extends AngularDisposable implements OnInit {
@ViewChild('outputarea', { read: ElementRef }) private outputArea: ElementRef;
@Input() cellModel: ICellModel;
+ private _activeCellId: string;
+
private readonly _minimumHeight = 30;
constructor(
@@ -41,6 +43,14 @@ export class OutputAreaComponent extends AngularDisposable implements OnInit {
}
}
+ @Input() set activeCellId(value: string) {
+ this._activeCellId = value;
+ }
+
+ get activeCellId(): string {
+ return this._activeCellId;
+ }
+
private updateTheme(theme: IColorTheme): void {
let outputElement =
this.outputArea.nativeElement;
outputElement.style.borderTopColor = theme.getColor(themeColors.SIDE_BAR_BACKGROUND, true).toString();
diff --git a/src/sql/workbench/parts/notebook/cellViews/outputArea.css b/src/sql/workbench/parts/notebook/cellViews/outputArea.css
index 77d02f4755..7b16cea451 100644
--- a/src/sql/workbench/parts/notebook/cellViews/outputArea.css
+++ b/src/sql/workbench/parts/notebook/cellViews/outputArea.css
@@ -10,4 +10,8 @@ output-area-component .notebook-output {
border-top-width: 0px;
user-select: text;
padding: 5px 20px 0px;
+}
+
+.output-userselect.actionselect {
+ user-select: text;
}
\ No newline at end of file
diff --git a/src/sql/workbench/parts/notebook/cellViews/textCell.component.html b/src/sql/workbench/parts/notebook/cellViews/textCell.component.html
index c6a18bb4db..e86b271c91 100644
--- a/src/sql/workbench/parts/notebook/cellViews/textCell.component.html
+++ b/src/sql/workbench/parts/notebook/cellViews/textCell.component.html
@@ -11,7 +11,7 @@
-
+
diff --git a/src/sql/workbench/parts/notebook/cellViews/textCell.component.ts b/src/sql/workbench/parts/notebook/cellViews/textCell.component.ts
index 0013824d25..8c73a97b2f 100644
--- a/src/sql/workbench/parts/notebook/cellViews/textCell.component.ts
+++ b/src/sql/workbench/parts/notebook/cellViews/textCell.component.ts
@@ -15,6 +15,7 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti
import { Emitter } from 'vs/base/common/event';
import { URI } from 'vs/base/common/uri';
import { IOpenerService } from 'vs/platform/opener/common/opener';
+import * as DOM from 'vs/base/browser/dom';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { CellView } from 'sql/workbench/parts/notebook/cellViews/interfaces';
@@ -24,6 +25,7 @@ import { NotebookModel } from 'sql/workbench/parts/notebook/models/notebookModel
import { CellToggleMoreActions } from 'sql/workbench/parts/notebook/cellToggleMoreActions';
export const TEXT_SELECTOR: string = 'text-cell-component';
+const USER_SELECT_CLASS ='actionselect';
@Component({
selector: TEXT_SELECTOR,
@@ -112,6 +114,7 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
if (propName === 'activeCellId') {
let changedProp = changes[propName];
this._activeCellId = changedProp.currentValue;
+ this.toggleUserSelect(this.isActive());
// If the activeCellId is undefined (i.e. in an active cell update), don't unnecessarily set editMode to false;
// it will be set to true in a subsequent call to toggleEditMode()
if (changedProp.previousValue !== undefined) {
@@ -202,6 +205,17 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
}
}
+ private toggleUserSelect(userSelect: boolean): void {
+ if (!this.output) {
+ return;
+ }
+ if (userSelect) {
+ DOM.addClass(this.output.nativeElement, USER_SELECT_CLASS);
+ } else {
+ DOM.removeClass(this.output.nativeElement, USER_SELECT_CLASS);
+ }
+ }
+
private setFocusAndScroll(): void {
this.toggleEditMode(this.isActive());
diff --git a/src/sql/workbench/parts/notebook/cellViews/textCell.css b/src/sql/workbench/parts/notebook/cellViews/textCell.css
index 4f218a1ffe..aa789602fb 100644
--- a/src/sql/workbench/parts/notebook/cellViews/textCell.css
+++ b/src/sql/workbench/parts/notebook/cellViews/textCell.css
@@ -8,7 +8,11 @@ text-cell-component {
}
text-cell-component .notebook-preview {
- user-select: initial;
+ user-select: none;
padding-left: 8px;
padding-right: 8px;
+}
+
+.notebook-preview.actionselect {
+ user-select: text;
}
\ No newline at end of file