You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dlab.apache.org by an...@apache.org on 2019/06/03 10:52:09 UTC
[incubator-dlab] 06/11: [DLAB-655]: added projects to exploratory
creation
This is an automated email from the ASF dual-hosted git repository.
ankovalyshyn pushed a commit to branch feature/projects
in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git
commit ad5f06b16c1140874a96b25e5414db9de5dae01b
Author: Andriana Kovalyshyn <An...@epam.com>
AuthorDate: Fri May 31 16:04:39 2019 +0300
[DLAB-655]: added projects to exploratory creation
---
.../util/patterns.ts} | 33 ++--------------------
.../create-environment.component.scss | 8 ++++++
...ratory-environment-create-dialog.component.html | 20 ++++++-------
...loratory-environment-create-dialog.component.ts | 24 ++++++----------
.../webapp/src/assets/styles/_general.scss | 9 ++++++
.../resources/webapp/src/assets/styles/_theme.scss | 10 +++++--
.../src/main/resources/webapp/src/styles.scss | 5 ++++
7 files changed, 50 insertions(+), 59 deletions(-)
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss b/services/self-service/src/main/resources/webapp/src/app/core/util/patterns.ts
similarity index 59%
copy from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss
copy to services/self-service/src/main/resources/webapp/src/app/core/util/patterns.ts
index 2eb2014..3cb9b12 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/core/util/patterns.ts
@@ -1,4 +1,4 @@
-/*!
+/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
@@ -17,33 +17,6 @@
* under the License.
*/
-.checkbox-group {
- .config-details {
- height: 0;
- opacity: 0;
- visibility: hidden;
- text-align: left;
- &.show {
- height: 200px;
- visibility: visible;
- opacity: 1;
- position: relative;
- margin-top: 10px;
- }
- textarea {
- height: 100%;
- background: #f8f8f8 !important;
- resize: none;
- font-size: 14px;
- line-height: 1.5;
- font-family: Consolas, monospace;
- }
- span {
- &.danger_color {
- position: absolute;
- bottom: -20px;
- left: 0;
- }
- }
- }
+export const PATTERNS = {
+
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss
index 2eb2014..f5b20c8 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/create-environment.component.scss
@@ -47,3 +47,11 @@
}
}
}
+
+.control-group {
+ .error {
+ position: absolute;
+ right: 0;
+ bottom: 3px;
+ }
+}
\ No newline at end of file
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.html
index 4759788..fa55bc9 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.html
@@ -45,10 +45,10 @@
<div class="control-group">
<label class="label">Select template</label>
- <div class="control selector-wrapper">
+ <div class="control selector-wrapper" [ngClass]="{ 'not-active' : !templates.length }">
<mat-form-field>
<mat-label>Select template</mat-label>
- <mat-select formControlName="template_name" disableOptionCentering>
+ <mat-select formControlName="template_name" disableOptionCentering [disabled]="!templates.length">
<mat-option *ngFor="let template of templates"
[value]="template.exploratory_environment_versions[0].version"
(click)="getShapes($event, template)">
@@ -65,10 +65,10 @@
<div class="control-group" *ngIf="images && images.length > 0">
<label class="label">Select {{ DICTIONARY.image }}</label>
<div class="control selector-wrapper">
- <!-- <dropdown-list #imagesList (selectedItem)="selectImage($event)"></dropdown-list> -->
<mat-form-field>
<mat-label>Select {{ DICTIONARY.image }}</mat-label>
<mat-select formControlName="image" (selectionChange)="selectImage($event)" disableOptionCentering>
+ <mat-option [value]="null">None</mat-option>
<mat-option *ngFor="let image of images" [value]="image.name">{{ image.name }}</mat-option>
</mat-select>
<button class="caret">
@@ -85,8 +85,8 @@
&& createExploratoryForm?.controls['environment_name'].dirty
&& createExploratoryForm?.controls['environment_name'].hasError('duplication')" type="text"
class="form-control" placeholder="Enter Name" formControlName="environment_name">
- <span class="danger_color" *ngIf="createExploratoryForm?.controls['environment_name'].hasError('duplication')">This name already exists.</span>
- <span class="danger_color" *ngIf="!createExploratoryForm?.controls.environment_name.valid
+ <span class="error" *ngIf="createExploratoryForm?.controls['environment_name'].hasError('duplication')">This name already exists.</span>
+ <span class="error" *ngIf="!createExploratoryForm?.controls.environment_name.valid
&& createExploratoryForm?.controls['environment_name'].dirty
&& !createExploratoryForm?.controls['environment_name'].hasError('duplication')">Name
<span *ngIf="DICTIONARY.cloud_provider !== 'aws'">cannot be longer than 10 characters and</span> can only contain letters, numbers, hyphens and '_' but can not end with special characters
@@ -96,13 +96,13 @@
<div class="control-group">
<label class="label">{{ DICTIONARY.notebook_instance_size }}</label>
- <div class="control selector-wrapper">
+ <div class="control selector-wrapper" [ngClass]="{ 'not-active': !currentTemplate }">
<mat-form-field>
<mat-label>Select {{ DICTIONARY.notebook_instance_size }}</mat-label>
- <mat-select formControlName="shape" disableOptionCentering>
+ <mat-select formControlName="shape" disableOptionCentering [disabled]="!currentTemplate">
<mat-optgroup *ngFor="let item of (shapes | keys)" [label]="item.key | underscoreless">
<mat-option *ngFor="let list_item of item.value" [value]="item.value">
- <strong>{{ list_item.Size }}</strong> {{ list_item.Type }}
+ <strong class="highlight icon-label">{{ list_item.Size }}</strong> {{ list_item.Type }}
</mat-option>
</mat-optgroup>
</mat-select>
@@ -119,7 +119,7 @@
</label>
<div class="config-details" [ngClass]="{ show: configuration?.nativeElement['checked'] || false }">
<textarea formControlName="configuration_parameters" placeholder="Cluster configuration template, JSON" data-gramm_editor="false"></textarea>
- <span class="danger_color" *ngIf="!createExploratoryForm?.controls.configuration_parameters.valid && createExploratoryForm?.controls['configuration_parameters'].dirty">Configuration parameters is not in a valid format</span>
+ <span class="error" *ngIf="!createExploratoryForm?.controls.configuration_parameters.valid && createExploratoryForm?.controls['configuration_parameters'].dirty">Configuration parameters is not in a valid format</span>
</div>
</div>
<ng-template #not_support>
@@ -130,7 +130,7 @@
<div class="text-center m-top-30">
<button mat-raised-button type="button" class="butt action" (click)="dialogRef.close()">Cancel</button>
- <button mat-raised-button type="submit" [disabled]="!createExploratoryForm?.valid || !this.environment_shape" class="butt butt-success action">Create</button>
+ <button mat-raised-button type="submit" [disabled]="!createExploratoryForm?.valid" class="butt butt-success action">Create</button>
</div>
</form>
</div>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.ts
index f591005..ea04b92 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/exploratory-environment-create-dialog/exploratory-environment-create-dialog.component.ts
@@ -77,7 +77,6 @@ export class ExploratoryEnvironmentCreateComponent implements OnInit {
this.getProjects();
this.initFormModel();
- // this.open();
}
initFormModel(): void {
@@ -104,7 +103,6 @@ export class ExploratoryEnvironmentCreateComponent implements OnInit {
this.currentTemplate = template;
this.shapes = template.exploratory_environment_shapes;
this.getImagesList();
- debugger;
}
providerMaxLength(control) {
@@ -156,8 +154,9 @@ export class ExploratoryEnvironmentCreateComponent implements OnInit {
// this.environment_shape = $event.model.value.type;
// }
- selectImage($event): void {
- this.model.notebookImage = $event.model.value ? $event.model.value.fullName : null;
+ public selectImage($event): void {
+ debugger;
+ // this.model.notebookImage = $event.model.value ? $event.model.value.fullName : null;
}
createExploratoryEnvironment_btnClick($event, data) {
@@ -186,22 +185,15 @@ export class ExploratoryEnvironmentCreateComponent implements OnInit {
// }
public selectConfiguration() {
- if (this.configuration.nativeElement.checked && this.createExploratoryForm) {
- this.createExploratoryForm.controls['configuration_parameters']
- .setValue(JSON.stringify(CLUSTER_CONFIGURATION.SPARK, undefined, 2));
- } else {
- this.createExploratoryForm.controls['configuration_parameters'].setValue('');
- }
+ const value = (this.configuration.nativeElement.checked && this.createExploratoryForm)
+ ? JSON.stringify(CLUSTER_CONFIGURATION.SPARK, undefined, 2) : '';
+
+ this.createExploratoryForm.controls['configuration_parameters'].setValue(value);
}
private getImagesList() {
this.userResourceService.getUserImages(this.currentTemplate.image)
- .subscribe((res: any) => {
- this.images = res.filter(el => el.status === 'CREATED');
-
- // this.changeDetector.detectChanges();
- // this.setDefaultParams();
- },
+ .subscribe((res: any) => this.images = res.filter(el => el.status === 'CREATED'),
error => this.toastr.error(error.message || 'Images list loading failed!', 'Oops!'));
}
}
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/_general.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/_general.scss
index 718da2e..ad9a551 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/_general.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/_general.scss
@@ -156,4 +156,13 @@ button {
padding-right: 5px;
overflow: hidden;
}
+}
+
+.icon-label {
+ display: inline-block;
+ width: 30px;
+ text-align: center;
+ vertical-align: middle;
+ color: #35afd5;
+ line-height: 26px;
}
\ No newline at end of file
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
index ab6949a..1c69be9 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
@@ -88,6 +88,7 @@
}
.caret {
width: 40px;
+ height: 40px;
color: #4ab8dc;
border: none;
border-left: 1px solid #ececec;
@@ -95,7 +96,6 @@
position: absolute;
right: 0;
top: 0px;
- height: 36px;
cursor: pointer;
&.not-allowed {
background-color: #dcdcdc;
@@ -144,6 +144,10 @@
.mat-option {
font-family: 'Open Sans', sans-serif;
+ .mat-option-text {
+ color: #607D8B;
+ font-size: 15px;
+ }
}
.mat-option.mat-selected {
@@ -256,7 +260,7 @@
.mat-reset {
.mat-form-field-type-mat-select:not(.mat-form-field-disabled) {
.mat-form-field-flex {
- line-height: 20px;
+ line-height: 18px;
}
}
.mat-form-field {
@@ -266,7 +270,7 @@
width: 275px;
border: 0;
font-family: 'Open Sans', sans-serif;
- font-size: 16px;
+ font-size: 15px;
font-weight: 300;
.mat-select-value-text {
span {
diff --git a/services/self-service/src/main/resources/webapp/src/styles.scss b/services/self-service/src/main/resources/webapp/src/styles.scss
index a6ff705..78972f4 100644
--- a/services/self-service/src/main/resources/webapp/src/styles.scss
+++ b/services/self-service/src/main/resources/webapp/src/styles.scss
@@ -134,6 +134,11 @@ mat-chip.mat-chip strong {
pointer-events: none;
}
+.not-active {
+ cursor: not-allowed;
+ opacity: .6;
+}
+
.message {
padding: 40px 20px;
text-align: center;
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@dlab.apache.org
For additional commands, e-mail: commits-help@dlab.apache.org