Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
vig
Sublinear Algorithms for VA
pseudo
Commits
70316aee
Commit
70316aee
authored
Sep 14, 2020
by
Kruyff,D.L.W. (Dylan)
Browse files
GUI visual improvement
parent
660d72ed
Changes
17
Show whitespace changes
Inline
Side-by-side
AngularApp/prototype/src/app/labeling-window/labeling-window.component.css
View file @
70316aee
.subplot
{
margin-right
:
20px
;
width
:
150px
;
display
:
flex
;
justify-content
:
center
;
}
.subplot-container
{
display
:
flex
;
overflow
:
auto
;
overflow-x
:
scroll
;
width
:
95%
;
}
button
{
padding
:
0
20px
;
.container
{
display
:
flex
;
justify-content
:
space-between
;
}
.label-button
{
padding
:
10px
20px
;
margin-top
:
20px
;
.train-button
{
height
:
30px
;
}
.button-holder
{
display
:
flex
;
justify-content
:
center
;
flex-direction
:
column
;
}
.label-button
{
width
:
30px
;
height
:
30px
;
}
.correct-selected
{
background-color
:
#4caf50
}
...
...
AngularApp/prototype/src/app/labeling-window/labeling-window.component.html
View file @
70316aee
<div
*ngIf=
"windowSimilarity"
class=
"subplot-container"
>
<div
class=
"container"
>
<div
*ngIf=
"windowSimilarity"
class=
"subplot-container"
>
<div
class=
"subplot"
*ngFor=
"let subplot of subplots"
>
<plotly-plot
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
<div
class=
"button-holder"
>
<button
class=
"correct-button"
[class.correct-selected]=
"labels[subplot.index]"
(click)=
"labelCorrect(subplot.index)"
>
V
</button>
<button
class=
"neutral-button"
[class.neutral-selected]=
"labels[subplot.index] == undefined"
(click)=
"labelUndefined(subplot.index)"
>
-
</button>
<button
class=
"incorrect-button"
[class.incorrect-selected]=
"labels[subplot.index] == false"
(click)=
"labelIncorrect(subplot.index)"
>
X
</button>
<button
class=
"correct-button
label-button
"
[class.correct-selected]=
"labels[subplot.index]"
(click)=
"labelCorrect(subplot.index)"
>
✔
</button>
<button
class=
"neutral-button
label-button
"
[class.neutral-selected]=
"labels[subplot.index] == undefined"
(click)=
"labelUndefined(subplot.index)"
>
•
</button>
<button
class=
"incorrect-button
label-button
"
[class.incorrect-selected]=
"labels[subplot.index] == false"
(click)=
"labelIncorrect(subplot.index)"
>
✖
</button>
</div>
</div>
<div
class=
"button-holder"
>
<button
*ngIf=
"windowSimilarity"
(click)=
"changeTables()"
class=
"label-button"
>
Update tables
</button>
</div>
<button
*ngIf=
"windowSimilarity"
(click)=
"changeTables()"
class=
"train-button"
>
Train
</button>
</div>
AngularApp/prototype/src/app/labeling-window/labeling-window.component.ts
View file @
70316aee
...
...
@@ -106,6 +106,12 @@ export class LabelingWindowComponent implements OnInit {
size
:
9
},
xaxis
:
{
showgrid
:
false
,
zeroline
:
false
,
showticklabels
:
false
,
},
yaxis
:
{
zeroline
:
false
,
showticklabels
:
false
,
}
}
...
...
AngularApp/prototype/src/app/main/main.component.css
View file @
70316aee
...
...
@@ -29,3 +29,18 @@
.show
{
display
:
block
;
}
.left
{
width
:
80%
;
}
.right
{
width
:
20%
;
border-left
:
groove
;
}
.container
{
display
:
flex
;
justify-content
:
space-between
;
height
:
100%
;
}
AngularApp/prototype/src/app/main/main.component.html
View file @
70316aee
<div
style=
"display: flex; justify-content: space-between;
"
>
<div
class=
"left"
style=
"width: 80%"
>
<div
class=
"container
"
>
<div
class=
"left"
>
<app-overview-window
style=
"z-index: 10"
></app-overview-window>
<mat-tab-group
animationDuration=
"0ms"
(selectedTabChange)=
"changeTab($event)"
>
<mat-tab
label=
"Training"
>
<app-table-overview></app-table-overview>
<app-labeling-window></app-labeling-window>
<app-table-overview></app-table-overview>
</mat-tab>
<mat-tab
label=
"Labeled data"
>
<app-labels></app-labels>
...
...
@@ -14,7 +14,7 @@
</mat-tab>
</mat-tab-group>
</div>
<div
style=
"width: 20%;
"
>
<div
class=
"right
"
>
<app-query-window></app-query-window>
<app-progress-view></app-progress-view>
</div>
...
...
AngularApp/prototype/src/app/overview-window/overview-window.component.html
View file @
70316aee
<zingchart-angular
[id]=
"id"
[config]=
"config"
(dblclick)=
"doubleClick($event)"
(mousewheel)=
"zoom($event)"
(click)=
"clicked($event)"
[height]=
"
20
0"
></zingchart-angular>
<zingchart-angular
[id]=
"id"
[config]=
"config"
(dblclick)=
"doubleClick($event)"
(mousewheel)=
"zoom($event)"
(click)=
"clicked($event)"
[height]=
"
15
0"
></zingchart-angular>
AngularApp/prototype/src/app/overview-window/overview-window.component.ts
View file @
70316aee
...
...
@@ -69,11 +69,13 @@ export class OverviewWindowComponent implements OnInit {
this
.
config
=
{
type
:
"
mixed
"
,
preview
:
{
height
:
"
30px
"
,
height
:
"
30px
"
,
position
:
"
0% 100%
"
,
'
auto-fit
'
:
true
},
"
plotarea
"
:
{
"
margin-top
"
:
"
10px
"
"
margin-top
"
:
"
10px
"
,
"
margin-bottom
"
:
"
50%
"
},
scaleX
:
{
zooming
:
true
,
...
...
AngularApp/prototype/src/app/progress-view/progress-view.component.css
View file @
70316aee
.title
{
display
:
flex
;
justify-content
:
center
;
}
.show-candidates-button
{
display
:
flex
;
justify-content
:
center
;
}
.button-holder
{
display
:
flex
;
justify-content
:
center
;
}
.window
{
display
:
flex
;
justify-content
:
center
;
}
AngularApp/prototype/src/app/progress-view/progress-view.component.html
View file @
70316aee
<div
*ngIf=
"data"
class=
"window"
>
<div
class=
"container"
*ngIf=
"data"
>
<span
class=
"title"
><b>
Training Progress
</b></span>
<div
class=
"window"
>
<div
class=
"plots"
>
<plotly-plot
[data]=
"data"
[layout]=
"layout"
(sliderEnd)=
"setSliderValue($event)"
></plotly-plot>
<plotly-plot
[data]=
"data"
[layout]=
"layout"
(sliderChange)=
"setSliderValue($event)"
></plotly-plot>
</div>
</div>
<div
class=
"button-holder"
>
<button
class=
"show-candidates-button"
(click)=
"showCandidates()"
>
Show all {{ amountOfCandidates }} candidates
</button>
</div>
</div>
AngularApp/prototype/src/app/progress-view/progress-view.component.ts
View file @
70316aee
...
...
@@ -11,6 +11,8 @@ export class ProgressViewComponent implements OnInit {
public
data
;
public
layout
;
private
_sliderValue
;
constructor
(
private
cache
:
CacheService
)
{
}
ngOnInit
():
void
{
...
...
@@ -70,8 +72,7 @@ export class ProgressViewComponent implements OnInit {
args
:
[
'
visible
'
,
v
]
});
}
// console.log(averages.length - 1 - highest);
// visibility[averages.length - 1 - highest] = true;
this
.
_sliderValue
=
averages
.
length
-
1
-
highest
;
this
.
data
=
data
;
this
.
layout
=
{
showlegend
:
false
,
...
...
@@ -84,10 +85,13 @@ export class ProgressViewComponent implements OnInit {
pad
:
4
},
xaxis
:
{
showticklabels
:
false
showgrid
:
false
,
zeroline
:
false
,
showticklabels
:
false
,
},
yaxis
:
{
showticklabels
:
false
zeroline
:
false
,
showticklabels
:
false
,
},
height
:
300
,
width
:
200
,
...
...
@@ -127,6 +131,14 @@ export class ProgressViewComponent implements OnInit {
}
public
setSliderValue
(
v
)
{
this
.
cache
.
sliderValue
=
v
.
slider
.
active
;
this
.
_sliderValue
=
v
.
slider
.
active
;
}
public
showCandidates
()
{
this
.
cache
.
sliderValue
=
this
.
_sliderValue
;
}
public
get
amountOfCandidates
()
{
return
this
.
similarity
[
this
.
_sliderValue
.
toString
()].
length
;
}
}
AngularApp/prototype/src/app/query-window/query-window.component.css
View file @
70316aee
.query-container
{
margin
:
auto
;
border
:
2px
solid
black
;
width
:
80%
;
border-bottom
:
groove
;
display
:
flex
;
justify-content
:
center
;
}
...
...
AngularApp/prototype/src/app/query-window/query-window.component.ts
View file @
70316aee
...
...
@@ -44,9 +44,12 @@ export class QueryWindowComponent implements OnInit {
size
:
9
},
xaxis
:
{
showgrid
:
false
,
zeroline
:
false
,
showticklabels
:
false
,
},
yaxis
:
{
zeroline
:
false
,
showticklabels
:
false
,
}
}
...
...
AngularApp/prototype/src/app/table-overview/table-overview.component.css
View file @
70316aee
.window
{
width
:
100%
;
overflow
:
scroll
;
overflow
-x
:
scroll
;
}
.plots
{
display
:
flex
;
}
.subplot
:hover
{
cursor
:
pointer
!important
;
.subplot
{
display
:
grid
;
}
.plotly-plot
,
.button-holder
{
grid-column
:
1
;
grid-row
:
1
;
}
.query-button
{
float
:
right
;
}
.button-holder
{
z-index
:
5
;
}
AngularApp/prototype/src/app/table-overview/table-overview.component.html
View file @
70316aee
<div
*ngIf=
"
ta
ble
s
"
class=
"window"
>
<div
*ngIf=
"
visi
ble"
class=
"window"
>
<div
class=
"plots"
>
<div
class=
"subplot"
*ngFor=
"let subplot of subplots"
>
<plotly-plot
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
...
...
@@ -6,8 +6,10 @@
</div>
<div
class=
"plots"
>
<div
class=
"subplot"
*ngFor=
"let subplot of averages"
>
<plotly-plot
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
<button
(click)=
"setQuery(subplot.data)"
>
Use as query
</button>
<plotly-plot
class=
"plotly-plot"
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
<div
class=
"button-holder"
>
<button
class=
"query-button"
(click)=
"setQuery(subplot.data)"
>
⇄
</button>
</div>
</div>
</div>
</div>
AngularApp/prototype/src/app/table-overview/table-overview.component.ts
View file @
70316aee
...
...
@@ -17,10 +17,6 @@ export class TableOverviewComponent implements OnInit {
this
.
service
.
onNewSimilarity
.
subscribe
(()
=>
this
.
createPlots
());
}
public
get
tables
()
{
return
this
.
service
.
tables
;
}
averagePlot
(
average
):
object
{
return
{
data
:
[
...
...
@@ -165,4 +161,12 @@ export class TableOverviewComponent implements OnInit {
this
.
service
.
queryWindow
=
await
this
.
service
.
getQueryWindow
(
data
[
0
].
y
);
await
this
.
service
.
getSimilarWindows
();
}
public
get
tables
()
{
return
this
.
service
.
tables
;
}
public
get
visible
()
{
return
!
this
.
service
.
querySelectionMode
;
}
}
AngularApp/prototype/src/index.html
View file @
70316aee
<!doctype html>
<html
lang=
"en"
>
<style>
::-webkit-scrollbar-track
{
-webkit-box-shadow
:
inset
0
0
6px
rgba
(
0
,
0
,
0
,
0.3
);
border-radius
:
10px
;
background-color
:
#F5F5F5
;
}
::-webkit-scrollbar
{
width
:
12px
;
background-color
:
#F5F5F5
;
}
::-webkit-scrollbar-thumb
{
border-radius
:
10px
;
-webkit-box-shadow
:
inset
0
0
6px
rgba
(
0
,
0
,
0
,
.3
);
background-color
:
#555
;
}
</style>
<head>
<meta
charset=
"utf-8"
>
<title>
PSEUDo
</title>
...
...
Flaskserver/.idea/workspace.xml
View file @
70316aee
...
...
@@ -2,7 +2,8 @@
<project
version=
"4"
>
<component
name=
"ChangeListManager"
>
<list
default=
"true"
id=
"556080ba-825c-4b55-a92a-867a4df4fb32"
name=
"Default Changelist"
comment=
""
>
<change
beforePath=
"$PROJECT_DIR$/main.py"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/main.py"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/query-window/query-window.component.ts"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/query-window/query-window.component.ts"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/table-overview/table-overview.component.ts"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/table-overview/table-overview.component.ts"
afterDir=
"false"
/>
</list>
<option
name=
"EXCLUDED_CONVERTED_TO_IGNORED"
value=
"true"
/>
<option
name=
"SHOW_DIALOG"
value=
"false"
/>
...
...
@@ -15,8 +16,8 @@
<file
pinned=
"false"
current-in-tab=
"true"
>
<entry
file=
"file://$PROJECT_DIR$/main.py"
>
<provider
selected=
"true"
editor-type-id=
"text-editor"
>
<state
relative-caret-position=
"2
62
"
>
<caret
line=
"16
6
"
column=
"
34
"
lean-forward=
"true"
selection-start-line=
"16
6
"
selection-start-column=
"
34
"
selection-end-line=
"16
6
"
selection-end-column=
"
34
"
/>
<state
relative-caret-position=
"2
448
"
>
<caret
line=
"16
8
"
column=
"
22
"
lean-forward=
"true"
selection-start-line=
"16
8
"
selection-start-column=
"
22
"
selection-end-line=
"16
8
"
selection-end-column=
"
22
"
/>
<folding>
<element
signature=
"e#0#41#0"
expanded=
"true"
/>
</folding>
...
...
@@ -141,15 +142,15 @@
<workItem
from=
"1599487808817"
duration=
"1192000"
/>
<workItem
from=
"1599578907139"
duration=
"8436000"
/>
<workItem
from=
"1599661275060"
duration=
"1249000"
/>
<workItem
from=
"1600001984238"
duration=
"
4555
000"
/>
<workItem
from=
"1600001984238"
duration=
"
5154
000"
/>
</task>
<servers
/>
</component>
<component
name=
"TimeTrackingManager"
>
<option
name=
"totallyTimeSpent"
value=
"9
8611
000"
/>
<option
name=
"totallyTimeSpent"
value=
"9
9210
000"
/>
</component>
<component
name=
"ToolWindowManager"
>
<frame
x=
"-7"
y=
"-7"
width=
"1295"
height=
"695"
extended-state=
"
6
"
/>
<frame
x=
"-7"
y=
"-7"
width=
"1295"
height=
"695"
extended-state=
"
7
"
/>
<editor
active=
"true"
/>
<layout>
<window_info
content_ui=
"combo"
id=
"Project"
order=
"0"
visible=
"true"
weight=
"0.28698465"
/>
...
...
@@ -208,8 +209,8 @@
</entry>
<entry
file=
"file://$PROJECT_DIR$/main.py"
>
<provider
selected=
"true"
editor-type-id=
"text-editor"
>
<state
relative-caret-position=
"2
62
"
>
<caret
line=
"16
6
"
column=
"
34
"
lean-forward=
"true"
selection-start-line=
"16
6
"
selection-start-column=
"
34
"
selection-end-line=
"16
6
"
selection-end-column=
"
34
"
/>
<state
relative-caret-position=
"2
448
"
>
<caret
line=
"16
8
"
column=
"
22
"
lean-forward=
"true"
selection-start-line=
"16
8
"
selection-start-column=
"
22
"
selection-end-line=
"16
8
"
selection-end-column=
"
22
"
/>
<folding>
<element
signature=
"e#0#41#0"
expanded=
"true"
/>
</folding>
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment