Next tuesday 25th january around 21.30 we'll be upgrading to GitLab version 14.7

Commit ced94cba authored by Kruyff,D.L.W. (Dylan)'s avatar Kruyff,D.L.W. (Dylan)
Browse files

added loading bar and fast track selection

parent 90bc7822
......@@ -23,6 +23,7 @@ import { TrainingWindowComponent } from './training-window/training-window.compo
import {MatCheckboxModule} from '@angular/material/checkbox';
import { StateManagementComponent } from './state-management/state-management.component';
import {AngularSplitModule} from 'angular-split';
import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
PlotlyModule.plotlyjs = PlotlyJS;
......@@ -51,6 +52,7 @@ PlotlyModule.plotlyjs = PlotlyJS;
ZingchartAngularModule,
MatSliderModule,
AngularSplitModule,
MatProgressSpinnerModule
],
providers: [],
bootstrap: [AppComponent]
......
......@@ -7,14 +7,17 @@
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,0.5);
z-index: 2;
background-color: rgba(0,0,0,0.7);
z-index: 8;
cursor: pointer;
}
.loading-progress {
display: flex;
flex-direction: column;
justify-content: center;
background-color: white;
z-index: 3;
z-index: 9;
width: 400px;
height: 200px;
position: absolute;
......@@ -22,6 +25,7 @@
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0,0,0,0);
margin: auto;
}
......@@ -91,3 +95,11 @@ mat-tab-group {
app-overview-window {
height: 100%;
}
.center {
margin-left: auto;
margin-right: auto;
color: white;
font-weight: bold;
margin-bottom: 10px;
}
......@@ -42,12 +42,9 @@
</as-split-area>
</as-split>
</div>
<div class="overlay" [class.show]="greyOut" *ngIf="loadingProgress != 100"></div>
<div class="loading-progress" *ngIf="loadingProgress != 100">
<span *ngIf="loadingProgress == 0">Retrieving data</span>
<span *ngIf="loadingProgress == 30">Creating windows</span>
<span *ngIf="loadingProgress == 60">Creating initial tables</span>
<mat-progress-bar mode="determinate" [value]="loadingProgress">
</mat-progress-bar>
<div class="overlay" [class.show]="greyOut" *ngIf="greyOut"></div>
<div class="loading-progress" *ngIf="greyOut">
<mat-spinner class="center" [diameter]="40"></mat-spinner>
<div class="center">{{loadingText}}</div>
</div>
......@@ -12,10 +12,10 @@ export class MainComponent {
}
public get greyOut() {
return this.state.querySelectionMode;
return this.state.loadingText !== '';
}
public get loadingProgress(): number {
return this.state.loadingProgress;
public get loadingText(): string {
return this.state.loadingText.toUpperCase();
}
}
......@@ -182,3 +182,8 @@ path {
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.content {
display: flex;
flex-direction: column;
}
......@@ -4,12 +4,15 @@
<div class="channel_header">
Channels
</div>
<div class="list">
<div class="list-element" *ngFor="let index of allChannels">
<label class="container">{{ names[index] }}
<input type="checkbox" [checked]="isInSelection(index)" (click)="changeSelection(index)">
<span class="checkmark" [ngStyle]="isInSelection(index) && {'background-color': getColor(index)} || {}"></span>
</label>
<div class="content">
<button (click)="setSelection()">Set</button>
<div class="list">
<div class="list-element" *ngFor="let index of allChannels">
<label class="container">{{ names[index] }}
<input type="checkbox" [checked]="isInSelection(index)" (click)="changeSelection(index)">
<span class="checkmark" [ngStyle]="isInSelection(index) && {'background-color': getColor(index)} || {}"></span>
</label>
</div>
</div>
</div>
</as-split-area>
......
......@@ -23,11 +23,13 @@ export class OverviewWindowComponent implements OnInit {
public allChannels: number[];
private _minx;
private _maxx;
public currentSelection;
public data;
public layout;
constructor(private state: StateService, private el: ElementRef) {
this.currentSelection = this.state.selection;
}
async ngOnInit(): Promise<void> {
......@@ -35,7 +37,10 @@ export class OverviewWindowComponent implements OnInit {
// this.state.onNewData.subscribe(() => this.dostuff3());
this.state.onNewData.subscribe(() => this.initializePlot());
this.state.onNewLshData.subscribe(() => this.updatePlot());
this.state.onNewSelection.subscribe(() => this.updateChannels());
this.state.onNewSelection.subscribe(() => {
this.currentSelection = this.state.selection;
this.updateChannels();
});
this.state.onNewSlider.subscribe(() => this.updateCandidates());
}
......@@ -473,7 +478,7 @@ export class OverviewWindowComponent implements OnInit {
}
isInSelection(i): boolean {
return this.state.selection.includes(i);
return this.currentSelection.includes(i);
}
getColor(i): string {
......@@ -482,14 +487,16 @@ export class OverviewWindowComponent implements OnInit {
changeSelection(i: number): void {
if (this.isInSelection(i)) {
this.state.selection = this.state.selection.filter((v) => v !== i);
this.currentSelection = this.currentSelection.filter((v) => v !== i);
} else {
const selection = this.state.selection;
selection.push(i);
this.state.selection = selection;
this.currentSelection.push(i);
}
}
setSelection(): void {
this.state.selection = this.currentSelection;
}
get height(): number {
return Math.max(75 * this.state.selection.length + 50, this.initialHeight);
}
......
......@@ -27,6 +27,7 @@ export class StateService {
public nrOfTables = 5;
public hashSize = 5;
public stepSize = 200;
public loadingText = '';
/**
* These are all GUI variables
......@@ -97,7 +98,9 @@ export class StateService {
async lshInitial(): Promise<void> {
this._weights = Array(this._queryWindow.length).fill(1);
const t0 = new Date().getTime();
this.loadingText = 'Creating LSH model';
this.lshData = await this.api.lshInitial(this._queryWindow);
this.loadingText = '';
this.computedTime = new Date().getTime() - t0;
this._lshParameters = this.lshData.parameters;
}
......@@ -106,9 +109,12 @@ export class StateService {
* This function performs every other iteration of LSH
*/
async update(labels, hashFunctions): Promise<void> {
this.loadingText = 'Calculating new model parameters';
this._weights = await this.api.getWeights(this._queryWindow, labels, this._weights, hashFunctions);
const t0 = new Date().getTime();
this.loadingText = 'Creating LSH model';
this.lshData = await this.api.lshUpdate(this._queryWindow, this._weights, this._lshParameters);
this.loadingText = '';
this.computedTime = new Date().getTime() - t0;
}
......
......@@ -20,56 +20,16 @@
</component>
<component name="ChangeListManager">
<list default="true" id="556080ba-825c-4b55-a92a-867a4df4fb32" name="Default Changelist" comment="">
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/api.service.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/api.service.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/app.module.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/app.module.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/main/main.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/main/main.component.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/progress-view/progress-view.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/progress-view/progress-view.component.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state-management/state-management.component.css" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state-management/state-management.component.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state-management/state-management.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state-management/state-management.component.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state-management/state-management.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state-management/state-management.component.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/main/main.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/main/main.component.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/overview-window/overview-window.component.css" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/overview-window/overview-window.component.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/overview-window/overview-window.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/overview-window/overview-window.component.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/overview-window/overview-window.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/overview-window/overview-window.component.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state.service.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../AngularApp/prototype/src/app/state.service.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/main.py" beforeDir="false" afterPath="$PROJECT_DIR$/main.py" afterDir="false" />
<change beforePath="$PROJECT_DIR$/preprocessing.py" beforeDir="false" afterPath="$PROJECT_DIR$/preprocessing.py" afterDir="false" />
<change beforePath="$PROJECT_DIR$/pseudo.py" beforeDir="false" afterPath="$PROJECT_DIR$/pseudo.py" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=128, d=20-checkpoint.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=128, d=20-checkpoint.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=128, d=35-checkpoint.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=128, d=35-checkpoint.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=128, d=70-checkpoint.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=256, d=35-Copy1-checkpoint.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on EEG data, M=50.000, T=256, d=35-checkpoint.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on Gas Sensor data, T=200, d=16-checkpoint.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on Gas Sensor data, T=200, d=16-checkpoint.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on Gas Sensor data, T=50, d=16-checkpoint.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/.ipynb_checkpoints/Compare Recall and Precision on Gas Sensor data, T=50, d=16-checkpoint.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=100.000, T=128, d=35.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=100.000, T=128, d=35.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=25.000, T=128, d=35.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=25.000, T=128, d=35.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=128, d=20.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=128, d=20.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=128, d=35.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=128, d=35.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=128, d=70.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=256, d=35-Copy1.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=50.000, T=256, d=35.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=75.000, T=128, d=35.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on EEG data, M=75.000, T=128, d=35.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=100, d=16.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=100, d=16.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=150, d=16.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=150, d=16.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=200, d=16.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=200, d=16.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=50, d=16.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Compare Recall and Precision on Gas Sensor data, T=50, d=16.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/data/12kb-similarity-search.h5" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/data/12kb-similarity-search.h5" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/data/cae_12kb.h5" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/data/cae_12kb.h5" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_100000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_100000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_25000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_25000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_50000_128_20.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_50000_128_20.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_50000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_50000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_50000_256_20.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_50000_256_20.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_75000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_eeg_75000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_gas_200000_100_16.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_gas_200000_100_16.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/accuracy_gas_200000_50_16.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/accuracy_gas_200000_50_16.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_eeg_100000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_eeg_100000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_eeg_25000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_eeg_25000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_eeg_50000_128_20.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_eeg_50000_128_20.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_eeg_50000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_eeg_50000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_eeg_50000_256_20.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_eeg_50000_256_20.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_eeg_75000_128_35.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_eeg_75000_128_35.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_gas_200000_100_16.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_gas_200000_100_16.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/images/time_gas_200000_50_16.png" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/images/time_gas_200000_50_16.png" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/old2/.ipynb_checkpoints/Compare similarity search strategies UTS on PEAX data-checkpoint.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/old2/Compare similarity search strategies UTS on PEAX data.ipynb" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/../experiments/Results &amp; Graphs.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/../experiments/Results &amp; Graphs.ipynb" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
......
......@@ -79,7 +79,7 @@ def preprocess(data, r=None):
subset = []
t0 = time()
if r is None:
r = data.shape[2]
r = 19.375 # r = data.shape[2]
started = False
first = 0
last = r * 2
......
This diff is collapsed.
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment