summaryrefslogtreecommitdiffstats
path: root/cds-ui
diff options
context:
space:
mode:
Diffstat (limited to 'cds-ui')
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html6
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss9
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts135
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html4
4 files changed, 99 insertions, 55 deletions
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html
index 2b88bcfcf..1ce5bf5b7 100644
--- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html
+++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html
@@ -23,9 +23,9 @@ limitations under the License.
<!-- <div style="width:inherit; height: inherit; position: fixed;z-index: 1; background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);"></div> -->
<div style="display: flex;">
<div>
- <i class="fa fa-folder" aria-hidden="true" style="color:#3f51b5; font-size: 20px;margin: 3px; cursor: pointer;" (click)="enableNameInputEl('createFolder')"></i>
- <i class="fa fa-file" aria-hidden="true" style="color:#3f51b5; font-size: 18px; margin: 3px; cursor: pointer;" (click)="enableNameInputEl('createFile')"></i>
- <i class="fa fa-trash" aria-hidden="true" style="color:#3f51b5; font-size: 20px; margin: 3px; cursor: pointer;" (click)="deleteFolderOrFile('deleteFile')"></i>
+ <i class="fa fa-folder" aria-hidden="true" style="color:#3f51b5; font-size: 20px;margin: 3px; cursor: pointer;" [ngClass] ="{'fa-disabled': selectedFileObj.type == 'file' || selectedFileObj.type == ''}" (click)="enableNameInputEl('createFolder')"></i>
+ <i class="fa fa-file" aria-hidden="true" style="color:#3f51b5; font-size: 18px; margin: 3px; cursor: pointer;" [ngClass] ="{'fa-disabled' : selectedFileObj.type == 'file' ||selectedFileObj.type == ''}" (click)="enableNameInputEl('createFile')"></i>
+ <i class="fa fa-trash" aria-hidden="true" style="color:#3f51b5; font-size: 20px; margin: 3px; cursor: pointer;" [ngClass] ="{'fa-disabled' : selectedFileObj.type == ''}" (click)="deleteFolderOrFile('deleteFile')"></i>
</div>
<div>
<input *ngIf="isNameTextboxEnablled" type="text" (focusout)="createFolderOrFile($event)"/>
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss
index ad2e03833..fac43eb43 100644
--- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss
+++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss
@@ -63,4 +63,13 @@ limitations under the License.
.background-highlight {
background-color: #3f51b5 !important;
color: white !important;
+ }
+
+ .fa-disabled {
+ opacity: 0.6;
+ pointer-events: none;
+ }
+
+ .mat-tree-node {
+ min-height: 40px !important;
} \ No newline at end of file
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts
index eaac8cbde..57d934b9a 100644
--- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts
+++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts
@@ -85,9 +85,11 @@ export class EditorComponent implements OnInit {
activeNode: any;
selectedFolder: string;
activationBlueprint: string;
- isNameTextboxEnablled : boolean = false;
- fileAction : string;
- filetoDelete : string;
+ isNameTextboxEnablled: boolean = false;
+ fileAction: string;
+ filetoDelete: string;
+ currentFilePath: string = '';
+ selectedFileObj = { name: '', type: '' };
private transformer = (node: Node, level: number) => {
return {
@@ -118,9 +120,6 @@ export class EditorComponent implements OnInit {
this.dataSource.data = this.filesTree;
}
- fileClicked(file) {
- console.log('selected file:' + file);
- }
editorContent() {
this.editor.setTheme("eclipse");
this.editor.getEditor().setOptions({
@@ -162,7 +161,8 @@ export class EditorComponent implements OnInit {
this.filesData.forEach(fileNode => {
if (this.selectedFile && fileNode.name.includes(this.blueprintName.trim()) && fileNode.name.includes(this.selectedFile.trim())) {
fileNode.data = this.text;
- } else if (this.selectedFile && fileNode.name.includes(this.selectedFile.trim())) {
+ } else if (this.selectedFile && fileNode.name.includes(this.currentFilePath)) {
+ // this.selectedFile && fileNode.name.includes(this.selectedFile.trim())) {
fileNode.data = this.text;
}
});
@@ -184,8 +184,13 @@ export class EditorComponent implements OnInit {
}
selectFileToView(file) {
+ this.currentFilePath = '';
+ this.expandParents(file);
+ this.selectedFileObj.name = file.name;
+ this.selectedFileObj.type = 'file';
this.selectedFile = file.name;
this.filetoDelete = file.name;
+ this.currentFilePath = this.currentFilePath + this.selectedFile;
this.filesData.forEach((fileNode) => {
if (fileNode.name.includes(file.name)) {
this.text = fileNode.data;
@@ -247,48 +252,47 @@ export class EditorComponent implements OnInit {
}
selectFolder(node) {
+ this.currentFilePath = '';
+ this.expandParents(node);
this.selectedFolder = node.name;
this.filetoDelete = node.name;
- console.log(node);
- // this.createFolderOrFile(node.name, 'folder');
+ this.selectedFileObj.name = node.name;
+ this.selectedFileObj.type = 'folder';
+ this.currentFilePath = this.currentFilePath + this.selectedFolder + '/';
}
createFolderOrFile(name) {
- let newFilesData: [any] = this.filesData;
- let newFileNode = {
- name: '',
- data: ''
- }
- let newFileNode1 = {
- name: '',
- data: ''
- }
- for(let i=0; i< this.filesData.length; i++) {
- if (this.filesData[i].name.includes(this.selectedFolder)) {
- if(this.fileAction == 'createFolder') {
- newFileNode.name = this.filesData[i].name + name.srcElement.value + '/';
- newFileNode.data = '';
-
- newFileNode1.name = this.filesData[i].name + name.srcElement.value + '/README.md'
- newFileNode1.data = name.srcElement.value + ' Folder';
- } else {
- newFileNode.name = this.filesData[i].name + name.srcElement.value;
- newFileNode.data = '';
- }
- break;
+ if (name && name.srcElement.value !== null && name.srcElement.value !== '') {
+ let newFilesData: [any] = this.filesData;
+ let newFileNode = {
+ name: '',
+ data: ''
+ }
+ let newFileNode1 = {
+ name: '',
+ data: ''
+ }
+ if (this.fileAction == 'createFolder') {
+ newFileNode.name = this.currentFilePath + name.srcElement.value + '/'
+ newFileNode.data = '';
+ newFileNode1.name = this.currentFilePath + name.srcElement.value + '/README.md'
+ newFileNode1.data = name.srcElement.value + ' Folder';
+ this.filesData.push(newFileNode);
+ this.filesData.push(newFileNode1);
+ } else {
+ newFileNode.name = this.currentFilePath + name.srcElement.value;
+ newFileNode.data = '';
+ this.filesData.push(newFileNode);
}
+ this.arrangeTreeData(this.filesData);
}
-
- this.filesData.splice(this.findIndexForNewNode()+1, 0, newFileNode);
- this.filesData.splice(this.findIndexForNewNode()+1, 0, newFileNode1);
- this.arrangeTreeData(this.filesData);
}
findIndexForNewNode() {
let indexForNewNode;
- for(let i=0; i< this.filesData.length; i++) {
+ for (let i = 0; i < this.filesData.length; i++) {
if (this.filesData[i].name.includes(this.selectedFolder)) {
- indexForNewNode = i;
+ indexForNewNode = i;
}
}
return indexForNewNode;
@@ -300,7 +304,6 @@ export class EditorComponent implements OnInit {
paths.forEach((path) => {
const pathParts = path.name.split('/');
- // pathParts.shift();
let currentLevel = tree;
pathParts.forEach((part) => {
@@ -313,16 +316,16 @@ export class EditorComponent implements OnInit {
name: part,
children: [],
data: path.data,
- path : path.name
+ path: path.name
};
- if(part.trim() == this.blueprintName.trim()) {
- this.activationBlueprint = path.data;
- newPart.data = JSON.parse(this.activationBlueprint.toString());
+ if (part.trim() == this.blueprintName.trim()) {
+ this.activationBlueprint = path.data;
+ newPart.data = JSON.parse(this.activationBlueprint.toString());
console.log('newpart', newPart);
}
- if(newPart.name !== '') {
- currentLevel.push(newPart);
- currentLevel = newPart.children;
+ if (newPart.name !== '') {
+ currentLevel.push(newPart);
+ currentLevel = newPart.children;
}
}
});
@@ -333,20 +336,52 @@ export class EditorComponent implements OnInit {
this.updateBlueprint();
}
- enableNameInputEl(action) {
+ enableNameInputEl(action) {
this.fileAction = action;
- if (action == 'createFolder' || action == 'createFile') {
+ if (action == 'createFolder' || action == 'createFile') {
this.isNameTextboxEnablled = true;
}
}
deleteFolderOrFile(action) {
- for(let i=0;i< this.filesData.length ; i++) {
- if(this.filesData[i].name.includes(this.filetoDelete.trim())) {
+ for (let i = 0; i < this.filesData.length; i++) {
+ if (this.filesData[i].name.includes(this.filetoDelete.trim()) && this.filesData[i].name.includes(this.currentFilePath)) {
this.filesData.splice(i, 1);
- i = i-1;
+ i = i - 1;
}
}
this.arrangeTreeData(this.filesData);
}
+
+ expandParents(node) {
+ const parent = this.getParent(node);
+ this.treeControl.expand(parent);
+
+ if (parent && parent.level > 0) {
+ this.expandParents(parent);
+ }
+
+ console.log(this.currentFilePath);
+ }
+
+ getParent(node) {
+ const { treeControl } = this;
+ const currentLevel = treeControl.getLevel(node);
+
+ if (currentLevel < 1) {
+ // this.currentFilePath = this.currentFilePath + this.selectedFolder;
+ return null;
+ }
+
+ const startIndex = treeControl.dataNodes.indexOf(node) - 1;
+
+ for (let i = startIndex; i >= 0; i--) {
+ const currentNode = treeControl.dataNodes[i];
+
+ if (treeControl.getLevel(currentNode) < currentLevel) {
+ this.currentFilePath = currentNode.name + '/' + this.currentFilePath;
+ return currentNode;
+ }
+ }
+ }
}
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html
index a77be5ba0..754ba214c 100644
--- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html
+++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html
@@ -33,12 +33,12 @@ limitations under the License.
<div style="width: 100%;height: 3em;">
<div style="display: flex;flex-direction: row-reverse">
<button class="btn-active" (click)="downloadCBA()">Download</button>
- <button [disabled]="!isEnriched" [ngClass]="{ 'mat-button-active': isEnriched, 'mat-button-disablled': !isEnriched}" mat-button [matMenuTriggerFor]="menu">Deploy</button>
+ <button class="mat-button-active" mat-button [matMenuTriggerFor]="menu">Deploy</button>
<mat-menu #menu="matMenu">
<button mat-menu-item>Deploy</button>
<button mat-menu-item>Test</button>
</mat-menu>
- <button [disabled]="!isEnriched" [ngClass]="{ 'btn-active': isEnriched, 'btn-disablled': !isEnriched}" class="btn-active">Publish</button>
+ <button [disabled]="!isEnriched" class="btn-active">Publish</button>
<button class="btn-active">Save</button>
<button class="btn-active">Enrich</button>