ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 10:58:30 -05:00
Code Issues Packages Projects Releases Wiki Activity

Allow for Notebook Cell Unselection (#3460)

Browse Source 
* Allow for cell unselection

* PR Feedback: use event.stopPropagation() when multiple events can fire

* Ensure markdown goes into Preview mode when  cell not selected
This commit is contained in:
Chris LaFreniere
2018-12-05 13:22:56 -08:00
committed by GitHub
parent 814cd73019
commit de5a91a13f
3 changed files with 18 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/sql/parts/notebook/cellViews/textCell.component.ts
View File

@@ -82,9 +82,7 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
if (propName === 'activeCellId') { if (propName === 'activeCellId') {
let changedProp = changes[propName]; let changedProp = changes[propName];
this._activeCellId = changedProp.currentValue; this._activeCellId = changedProp.currentValue;
if (this._activeCellId) { this.toggleEditMode(false);
this.toggleEditMode(false);
}
break; break;
} }
} }
@@ -117,7 +115,7 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
} }
return content; return content;
} }
// Todo: implement layout // Todo: implement layout
public layout() { public layout() {

4
src/sql/parts/notebook/notebook.component.html
View File

@@ -7,9 +7,9 @@
<div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: column"> <div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: column">
<div #toolbar class="editor-toolbar actionbar-container" style="flex: 0 0 auto; display: flex; flex-flow: row; width: 100%; align-items: center; height: 36px"> <div #toolbar class="editor-toolbar actionbar-container" style="flex: 0 0 auto; display: flex; flex-flow: row; width: 100%; align-items: center; height: 36px">
</div> </div>
<div class="scrollable" style="flex: 1 1 auto; position: relative"> <div class="scrollable" style="flex: 1 1 auto; position: relative" (click)="unselectActiveCell()">
<loading-spinner [loading]="isLoading"></loading-spinner> <loading-spinner [loading]="isLoading"></loading-spinner>
<div class="notebook-cell" *ngFor="let cell of cells" (click)="selectCell(cell)" [class.active]="cell.active" (keydown)="onKeyDown($event)"> <div class="notebook-cell" *ngFor="let cell of cells" (click)="selectCell(cell, $event)" [class.active]="cell.active" (keydown)="onKeyDown($event)">
<code-cell-component *ngIf="cell.cellType === 'code'" [cellModel]="cell" [model]="model" [activeCellId]="activeCellId"> <code-cell-component *ngIf="cell.cellType === 'code'" [cellModel]="cell" [model]="model" [activeCellId]="activeCellId">
</code-cell-component> </code-cell-component>
<text-cell-component *ngIf="cell.cellType === 'markdown'" [cellModel]="cell" [model]="model" [activeCellId]="activeCellId"> <text-cell-component *ngIf="cell.cellType === 'markdown'" [cellModel]="cell" [model]="model" [activeCellId]="activeCellId">

15
src/sql/parts/notebook/notebook.component.ts
View File

@@ -140,7 +140,10 @@ export class NotebookComponent extends AngularDisposable implements OnInit, OnDe
toolbarEl.style.borderBottomColor = theme.getColor(themeColors.SIDE_BAR_BACKGROUND, true).toString(); toolbarEl.style.borderBottomColor = theme.getColor(themeColors.SIDE_BAR_BACKGROUND, true).toString();
} }
public selectCell(cell: ICellModel) { public selectCell(cell: ICellModel, event?: Event) {
if (event) {
event.stopPropagation();
}
if (cell !== this._activeCell) { if (cell !== this._activeCell) {
if (this._activeCell) { if (this._activeCell) {
this._activeCell.active = false; this._activeCell.active = false;
@@ -153,6 +156,16 @@ export class NotebookComponent extends AngularDisposable implements OnInit, OnDe
} }
} }
public unselectActiveCell() {
if (this._activeCell) {
this._activeCell.active = false;
}
this._activeCell = null;
this._model.activeCell = null;
this._activeCellId = null;
this._changeRef.detectChanges();
}
// Add cell based on cell type // Add cell based on cell type
public addCell(cellType: CellType) public addCell(cellType: CellType)
{ {