Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix multiple scalar issues: #283

Merged
merged 2 commits into from
Feb 27, 2018
Merged

Fix multiple scalar issues: #283

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2fa8137
Fix multiple scalar issues:
nickyfantasy Feb 27, 2018
f52913c
simply use index for key because scalar has different tag info struct…
nickyfantasy Feb 27, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions frontend/src/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ export default {

+prefix-classes('visual-dl-page-')
.container
padding-right 250px
padding-right 300px
position relative
background $-left-background-color
.left
Expand All @@ -60,7 +60,7 @@ export default {
box-sizing border-box
.right
overflow scroll
width 250px
width 300px
min-height 300px
position absolute
right 0
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/histogram/ui/ChartPage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<div class="visual-dl-chart-page-box">
<ui-chart
v-for="tagInfo in filteredPageList"
:key="tagInfo.run + tagInfo.tag.displayName"
:key="tagInfo.tag"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should avoid using non-primitive value as the key. Vue will complain this.
Let's just use Varun's index suggestion.

:tagInfo="tagInfo"
:runs="config.runs"
:chartType="config.chartType"
Expand Down
6 changes: 2 additions & 4 deletions frontend/src/histogram/ui/Config.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
:color="config.running ? 'primary' : 'error'"
v-model="config.running"
@click="toggleAllRuns"
dark
dark block
>
{{config.running ? 'Running' : 'Stopped'}}
</v-btn>
Expand Down Expand Up @@ -60,10 +60,8 @@ export default {
@import '../../style/variables';
+prefix-classes('visual-dl-histogram-')
.config-com
width 90%
margin 20px auto
padding 20px
.run-toggle
width 100%
margin-top 20px

.label
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/images/ui/ChartPage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<ui-image
class="visual-dl-chart-image"
v-for="tagInfo in filteredPageList"
:key="tagInfo.run + tagInfo.tag.displayName"
:key="tagInfo.tag"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should avoid using non-primitive value as the key.

:tagInfo="tagInfo"
:isActualImageSize="config.isActualImageSize"
:runs="config.runs"
Expand Down
7 changes: 3 additions & 4 deletions frontend/src/images/ui/Config.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,8 @@
<v-btn :color="config.running ? 'primary' : 'error'"
v-model="config.running"
@click="toggleAllRuns"
dark
class="visual-dl-image-run-toggle"
dark block
>
{{config.running ? 'Running' : 'Stopped'}}
</v-btn>
Expand Down Expand Up @@ -52,10 +53,8 @@ export default {
@import '../../style/variables';
+prefix-classes('visual-dl-image-')
.config-com
width 90%
margin 20px auto
padding 20px
.run-toggle
width 100%
margin-top 20px

.label
Expand Down
23 changes: 4 additions & 19 deletions frontend/src/scalars/Scalars.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@
<div class="visual-dl-page-container">
<div class="visual-dl-page-left">
<ui-chart-page
:config="filteredConfig"
:config="config"
:runsItems="runsItems"
:tagList="filteredTagsList"
:title="'Tags matching' + config.groupNameReg"
></ui-chart-page>
<ui-chart-page
v-for="item in groupedTags"
:key="item.group"
:config="filteredConfig"
:config="config"
:runsItems="runsItems"
:tagList="item.tags"
:title="item.group"
Expand Down Expand Up @@ -49,8 +49,8 @@ export default {
smoothing: 0.6,
horizontal: 'step',
sortingMethod: 'default',
downloadLink: [],
outlier: [],
downloadLink: false,
outlier: false,
runs: [],
running: true
},
Expand Down Expand Up @@ -113,21 +113,6 @@ export default {
};
});
},
filteredConfig() {
let transformArr = ['downloadLink', 'outlier'];
let config = this.config || {};
let filteredConfig = {};
Object.keys(config).forEach(key => {
let val = config[key];
if (transformArr.indexOf(key) > -1) {
filteredConfig[key] = isArray(val) && val[0] === 'yes';
}
else {
filteredConfig[key] = val;
}
});
return filteredConfig;
},
},
created() {
getPluginScalarsTags().then(({errno, data}) => {
Expand Down
31 changes: 14 additions & 17 deletions frontend/src/scalars/ui/Chart.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,20 @@
<div ref="chartBox" class="visual-dl-chart-box" :style="computedStyle">
</div>
<div class="visual-dl-chart-actions">
<v-btn flat @click="expandArea">
<v-btn flat @click="expandArea" class="chart-expand">
<v-icon size="20">settings_overscan</v-icon>
</v-btn>
<v-select
v-if="downloadLink"
style="width:100px;"
hint="download type"
class="download-selector"
:items="runsItems"
v-model="downloadType"
item-text="name"
item-value="value"
/>
<v-btn
<v-btn flat
v-if="downloadLink"
class="download-button"
@click="handleDownLoad">
<v-icon size="20">file_download</v-icon>
</v-btn>
Expand Down Expand Up @@ -70,7 +72,7 @@ export default {
}
],
// choose run type for download file
downloadType: '',
downloadType: {},
isExpand: false,
originData: []
};
Expand Down Expand Up @@ -123,7 +125,7 @@ export default {
if (this.runsItems.length === 0) {
return;
}
this.downloadType = this.runsItems[0].value;
this.downloadType = this.runsItems[0];
},
// Create a Scalar Chart, initialize it with default settings, then load datas
Expand Down Expand Up @@ -581,19 +583,14 @@ export default {
background: #fff;
padding: 10px;
.visual-dl-chart-actions
height 50px
margin-left 10%
.sm-form-item
vertical-align: middle
.chart-expand
float left
.download-selector
float left
width 100px
margin-top 0px
display block
.sm-button
margin-top -10px
.download-button
float left
display block
height 20px
line-height 20px
margin-top 10px
padding 0 10px
</style>

2 changes: 1 addition & 1 deletion frontend/src/scalars/ui/ChartPage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@
<div ref="chartPageBox" class="visual-dl-chart-page-box">
<ui-chart
v-for="tagInfo in filteredTagList"
:key="tagInfo.tag"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should avoid using non-primitive value as the key.

:tagInfo="tagInfo"
:key="tagInfo.run + tagInfo.tag.displayName"
:groupNameReg="config.groupNameReg"
:smoothing="config.smoothing"
:horizontal="config.horizontal"
Expand Down
28 changes: 19 additions & 9 deletions frontend/src/scalars/ui/Config.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,14 @@
dark
></v-text-field>

<div>
<v-slider label="Smoothing" :max="0.999" :min="0" :step="0.001" v-model="config.smoothing" dark></v-slider>
<div class="visual-dl-page-slider-block">
<v-slider label="Smoothing"
:max="0.999"
:min="0"
:step="0.001"
v-model="config.smoothing"
class="visual-dl-page-smoothing-slider"
dark></v-slider>
<span>{{config.smoothing}}</span>
</div>

Expand All @@ -18,31 +24,32 @@
<v-radio label="Wall" value="wall"></v-radio>
</v-radio-group>

<label class="label">Tooltip sorting method</label>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need to display this Label.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

v-selector has this label embedded

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we need to null the v-model in order for the label to show up then.

<v-select
:items="sortingMethodItems"
v-model="config.sortingMethod"
label="Tooltip sorting method"
single-line
bottom
dark
></v-select>

<v-checkbox label="Show data download links" v-model="config.downloadLink" dark></v-checkbox>
<v-checkbox label="Ignore outliers in chart scaling" v-model="config.outlier" dark></v-checkbox>

<label>Runs</label>

<v-checkbox v-for="item in runsItems"
:key="item.name"
:label="item.name"
:value="item.value"
v-model="config.runs"
dark
class="visual-dl-page-config-checkbox"
></v-checkbox>

<v-btn :color="config.running ? 'primary' : 'error'"
v-model="config.running"
@click="toggleAllRuns"
dark
class="visual-dl-page-run-toggle"
dark block
>
{{config.running ? 'Running' : 'Stopped'}}
</v-btn>
Expand Down Expand Up @@ -100,10 +107,13 @@ export default {
+prefix-classes('visual-dl-page-')
.config-com
width 90%
margin 20px auto
padding 20px
.slider-block
display flex
align-items center
.smoothing-slider
display inline
.run-toggle
width 100%
margin-top 20px
</style>
Expand Down