Skip to content

Commit a551b07

Browse files
ObadaSObadaS
authored
Merge pull request #2228 from codalab/submission-page-display
Fix submission upload page display
2 parents 09d7ef3 + b0f6ccc commit a551b07

1 file changed

Lines changed: 54 additions & 24 deletions

File tree

‎src/static/riot/competitions/detail/submission_upload.tag‎

Lines changed: 54 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,33 @@
11
<submission-upload>
22
<div class="ui sixteen wide column submission-container">
33

4+
<!-- Submission upload button -->
45
<div class="submission-form">
56
<h1>Submission upload</h1>
67
<div if="{_.get(selected_phase, 'status') === 'Previous'}" class="ui red message">This phase has ended and no longer accepts submissions!</div>
78
<div if="{_.get(selected_phase, 'status') === 'Next'}" class="ui yellow message">This phase hasn't started yet!</div>
89
<form class="ui form coda-animated {error: errors}" ref="form" enctype="multipart/form-data">
910
<div class="submission-form" ref="fact_sheet_form" if="{ opts.fact_sheet !== null}">
1011
<h2>Metadata or Fact Sheet</h2>
11-
<div class="submission-form-question" each="{ question in opts.fact_sheet }">
12-
<span if="{ question.type === 'text' }">
13-
<label if="{question.is_required == 'true'}" class="required-answer" for="{ question.key }">{ question.title }:</label>
14-
<label if="{question.is_required == 'false'}" for="{ question.key }">{ question.title }:</label>
15-
<input type="text" name="{ question.key }">
16-
</span>
17-
<span if="{ question.type === 'checkbox' }">
18-
<label for="{ question.key }">{ question.title }:</label>
19-
<input type="hidden" name="{ question.key }" value="false">
20-
<input type="checkbox" name="{ question.key }" value="true">
21-
</span>
22-
<span if="{ question.type == 'select' }">
23-
<label for="{ question.key }">{ question.title }:</label>
24-
<select name="{ question.key }">
25-
<option each="{ selection_opt in question.selection }" value="{ selection_opt }">{ selection_opt }</option>
26-
</select>
27-
</span>
12+
<div class="fact-sheet-scroll">
13+
<div class="submission-form-question" each="{ question in opts.fact_sheet }">
14+
<span if="{ question.type === 'text' }">
15+
<label if="{question.is_required == 'true'}" class="required-answer" for="{ question.key }">{ question.title }:</label>
16+
<label if="{question.is_required == 'false'}" for="{ question.key }">{ question.title }:</label>
17+
<input type="text" name="{ question.key }">
18+
</span>
19+
<span if="{ question.type === 'checkbox' }">
20+
<label for="{ question.key }">{ question.title }:</label>
21+
<input type="hidden" name="{ question.key }" value="false">
22+
<input type="checkbox" name="{ question.key }" value="true">
23+
</span>
24+
<span if="{ question.type == 'select' }">
25+
<label for="{ question.key }">{ question.title }:</label>
26+
<select name="{ question.key }">
27+
<option each="{ selection_opt in question.selection }" value="{ selection_opt }">{ selection_opt }</option>
28+
</select>
29+
</span>
30+
</div>
2831
</div>
2932
</div>
3033

@@ -70,12 +73,14 @@
7073
</form>
7174
</div>
7275

76+
<!-- Upload progress bar -->
7377
<div class="ui indicating progress" ref="progress">
7478
<div class="bar">
7579
<div class="progress">{ upload_progress }%</div>
7680
</div>
7781
</div>
7882

83+
<!-- Submission Output-->
7984
<div class="ui styled fluid accordion submission-output-container {hidden: _.isEmpty(selected_submission) || selected_phase.hide_output || _.isEmpty(selected_submission.filename)}"
8085
ref="accordion">
8186
<div class="title">
@@ -85,7 +90,15 @@
8590
<div class="ui basic segment">
8691
<div class="content">
8792
<div id="submission-output" class="ui" ref="submission-output">
88-
<div class="header">Output</div>
93+
<!-- Header : Output + Autoscroll toggle -->
94+
<div class="header output-header">
95+
<span class="output-title">Output</span>
96+
<div class="ui checkbox autoscroll-toggle" ref="autoscroll_checkbox">
97+
<input type="checkbox" checked/>
98+
<label>Autoscroll Output</label>
99+
</div>
100+
</div>
101+
<!-- Output logs -->
89102
<div class="content">
90103
<div if="{!ingestion_during_scoring}">
91104
<div if="{_.isEmpty(children)}">
@@ -94,10 +107,6 @@
94107
ref="submission_output"
95108
detailed_result_url="{detailed_result_urls[selected_submission.id]}"
96109
show_graph="{opts.competition.enable_detailed_results}"></log_window>
97-
<div class="ui checkbox" ref="autoscroll_checkbox">
98-
<input type="checkbox" checked/>
99-
<label>Autoscroll Output</label>
100-
</div>
101110
</div>
102111
<div if="{children}">
103112
<div class="ui secondary menu submission-tabs">
@@ -147,11 +156,11 @@
147156
</div>
148157
</div>
149158
</div>
159+
150160
<script>
151161
var self = this
152162

153163
self.mixin(ProgressBarMixin)
154-
155164
self.chart = undefined
156165
self.errors = {}
157166
self.lines = {}
@@ -468,7 +477,6 @@
468477
}
469478
dropdown.attr('disabled', 'disabled')
470479

471-
472480
// Call start_submission with dataset key
473481
// start_submission returns submission key
474482
CODALAB.api.create_submission({
@@ -582,6 +590,23 @@
582590
font-weight 600
583591

584592
#submission-output
593+
594+
.output-header
595+
display flex
596+
align-items center
597+
justify-content space-between
598+
gap 12px
599+
600+
.output-title
601+
font-weight 700
602+
603+
.autoscroll-toggle
604+
margin 0
605+
white-space nowrap
606+
607+
label
608+
font-weight normal
609+
585610
.submission-tabs
586611
overflow-x scroll
587612
padding-bottom 10px
@@ -615,5 +640,10 @@
615640
display block
616641
height 250px
617642

643+
.fact-sheet-scroll
644+
max-height: min(50vh, 520px)
645+
overflow-y: auto
646+
padding-right: 8px
647+
618648
</style>
619649
</submission-upload>

0 commit comments

Comments
 (0)