Files
puzzle-scoreboard/app/views/completions/_form.html.slim
sto 95c336be65
Some checks failed
CI / scan_ruby (push) Has been cancelled
CI / scan_js (push) Has been cancelled
CI / lint (push) Has been cancelled
CI / test (push) Has been cancelled
Shiny forms
2026-08-11 09:33:06 +02:00

216 lines
10 KiB
Plaintext

- if @public && @puzzles.length == @contestant.completions.length
/ Case when all puzzles are already solved by the contestant.
h4
= t("completions.form.validate_name", name: @contestant.name)
.mt-3.alert.alert-warning
= t("completions.form.all_finished", name: @contestant.name)
- else
= form_with model: completion, url: url, method: method do |form|
/ If a message is present, for online contests, display it.
- if @message
= form.hidden_field :message_id, value: @message.id
.row
.col
h4 = t("messages.singular").capitalize
.alert.alert-secondary.mt-3
b
= @message.author
br
= @message.text
/ Section title.
.row.mt-3
.col
h4
- if @public
= t("completions.form.validate_name", name: @contestant.name)
- else
= t("completions.singular").capitalize
/ If no contestant is selected, display a select to choose one.
- if @contestants.present?
.row.mt-3
.col
.form-floating
= form.select :contestant_id, @contestants.map { |contestant| [contestant.form_name, contestant.id] }, {}, class: "form-select"
= form.label :contestant_id
/ If a closest contestant was computed, pre-select it.
- if @closest_contestant
javascript:
el = document.querySelector('select[name="completion[contestant_id]"]');
el.value = "#{@closest_contestant.id}"
/ If the contest has more than one puzzle to solve, display a select to choose one.
- if @puzzles.size > 1
.row.mt-3
.col
.form-floating
= form.select :puzzle_id, @puzzles.map { |puzzle| ["#{puzzle.name} - #{puzzle.brand}", puzzle.id] }, {}, class: "form-select"
= form.label :puzzle_id
- elsif @puzzles.size == 1
= form.hidden_field :puzzle_id, value: @puzzles.first.id
- else
= form.hidden_field :puzzle_id
/ Radio button for whether the puzzle is completed or not.
.row.mt-3
.col
.form-text style="font-size: 18px;"
= t("completions.form.completed_question")
.form-text.mb-2
i
= t("completions.form.completed_note")
- if @completion.completed
input.btn-check type="radio" name="completed_radio" id="completed_radio_yes" value="yes" checked=""
- else
input.btn-check type="radio" name="completed_radio" id="completed_radio_yes" value="yes"
label.btn.btn-light for="completed_radio_yes" = t("completions.form.completed_yes")
- if @completion.completed == false
input.btn-check type="radio" name="completed_radio" id="completed_radio_no" value="no" checked=""
- else
input.btn-check type="radio" name="completed_radio" id="completed_radio_no" value="no"
label.ms-2.btn.btn-light for="completed_radio_no" = t("completions.form.completed_no")
javascript:
savetime = "";
ispatch = #{method == :patch};
// Actions for radio buttons.
completed_radio_yes_el = document.getElementById('completed_radio_yes');
completed_radio_yes_el?.addEventListener('click', () => {
const timeEl = document.getElementById('time');
const missingPiecesEl = document.getElementById('missing_pieces');
const remainingPiecesEl = document.getElementById('remaining_pieces');
const refreshEl = document.getElementById('refresh');
const submitEl = document.getElementById('submit');
if (ispatch) timeEl.value = '#{@completion.display_time_from_start}';
else timeEl.value = savetime;
timeEl.parentElement.parentElement.parentElement.style.display = '';
missingPiecesEl.style.display = 'block';
remainingPiecesEl.style.display = 'none';
submitEl.style.display = '';
if (refreshEl) refreshEl.style.display = '';
});
completed_radio_no_el = document.getElementById('completed_radio_no');
completed_radio_no_el?.addEventListener('click', () => {
const timeEl = document.getElementById('time');
const missingPiecesEl = document.getElementById('missing_pieces');
const remainingPiecesEl = document.getElementById('remaining_pieces');
const refreshEl = document.getElementById('refresh');
const submitEl = document.getElementById('submit');
savetime = timeEl.value;
timeEl.value = '#{display_time(@contest.duration_seconds)}';
timeEl.parentElement.parentElement.parentElement.style.display = '';
missingPiecesEl.style.display = 'none';
remainingPiecesEl.style.display = 'block';
submitEl.style.display = 'none';
if (refreshEl) refreshEl.style.display = 'none';
});
/ Text field for recording the completion time.
.row.mt-4 style="display: #{@completion.completed != nil ? "" : "none"};"
.col
.form-floating
= form.text_field :display_time_from_start, autocomplete: "off", class: "form-control", id: "time"
= form.label :display_time_from_start, class: "required"
- unless method == :patch || @contest.start_time == nil
.col.mt-2
a.btn.btn-primary id="refresh" style="display: #{@completion.completed ? "" : "none"}"
= t("helpers.buttons.refresh")
.form-text
= t("activerecord.attributes.completion.display_time_from_start_description")
/ Refresh logic.
- if @contest.start_time.present? && method != :patch
javascript:
startTime = #{@contest.start_time.present? ? @contest.start_time.to_i : "null"};
pauseTime = #{@contest.pause_time.present? ? @contest.pause_time.to_i : "null"};
function updateTime() {
const timeEl = document.getElementById('time');
if (timeEl) {
if (startTime) {
let s = Math.floor((Date.now() - 1000 * startTime) / 1000);
if (pauseTime) s = Math.floor(pauseTime - startTime);
let ss = s % 60;
let mm = Math.floor(s / 60) % 60;
let hh = Math.floor(s / 3600);
timeEl.value = `${hh}:${mm < 10 ? `0${mm}` : mm}:${ss < 10 ? `0${ss}` : ss}`;
savetime = timeEl.value;
}
}
}
refreshButton = document.getElementById("refresh");
refreshButton?.addEventListener('click', updateTime);
- if @completion.display_time_from_start == nil
javascript:
updateTime();
/ Text field for recording the missing pieces, if any.
.row.mt-3 id="missing_pieces" style="display: #{@completion.completed ? "" : "none"};"
.col
.form-floating
= form.text_field :missing_pieces, autocomplete: "off", class: "form-control"
= form.label :missing_pieces
/ Text field for recording the remaining pieces.
.row.mt-3 id="remaining_pieces" style="display: #{@completion.completed == false ? "" : "none"};"
.col
.form-text.mb-2 style="font-size: 18px;"
= t("completions.form.remaining_pieces_question")
/ Radio buttons for choice of whether counting assembled or remaining pieces
- if @pieces_radio == "assembled"
input.btn-check type="radio" name="pieces_radio" id="pieces_radio_assembled" value="assembled" checked=""
- else
input.btn-check type="radio" name="pieces_radio" id="pieces_radio_assembled" value="assembled"
label.btn.btn-light for="pieces_radio_assembled" = t("completions.form.pieces_radio_assembled")
- if @pieces_radio == "remaining"
input.btn-check type="radio" name="pieces_radio" id="pieces_radio_remaining" value="remaining" checked=""
- else
input.btn-check type="radio" name="pieces_radio" id="pieces_radio_remaining" value="remaining"
label.ms-2.btn.btn-light for="pieces_radio_remaining" = t("completions.form.pieces_radio_remaining")
/ Remaining_pieces_field
.form-floating.mt-3 id="remaining_pieces_field" style="display: #{@pieces_radio != nil ? "" : "none"};"
= form.text_field :remaining_pieces, autocomplete: "off", class: "form-control"
- if @pieces_radio == "assembled"
= form.label :remaining_pieces
= t("completions.form.pieces_radio_assembled")
- else
= form.label :remaining_pieces
= t("completions.form.pieces_radio_remaining")
javascript:
pieces_assembled_label = '#{t("completions.form.pieces_radio_assembled")}';
pieces_remaining_label = '#{t("completions.form.pieces_radio_remaining")}';
pieces_radio_assembled_el = document.getElementById('pieces_radio_assembled');
pieces_radio_assembled_el?.addEventListener('click', () => {
pieces_remaining_el = document.getElementById('remaining_pieces_field');
pieces_remaining_el.style.display = '';
pieces_remaining_el.getElementsByTagName('label')[0].innerHTML = pieces_assembled_label;
document.getElementById('submit').style.display = '';
});
pieces_radio_remaining_el = document.getElementById('pieces_radio_remaining');
pieces_radio_remaining_el?.addEventListener('click', () => {
pieces_remaining_el = document.getElementById('remaining_pieces_field');
pieces_remaining_el.style.display = '';
pieces_remaining_el.getElementsByTagName('label')[0].innerHTML = pieces_remaining_label;
document.getElementById('submit').style.display = '';
});
/ Hidden field for the organizer code, to ensure only organizer can use this form.
- if @public
.row
.col
.form-floating
= form.hidden_field :code, autocomplete: "off", class: "form-control"
/ Submit button.
.row.mt-3 id="submit" style="display: #{@completion.completed != nil ? "" : "none"};"
.col
= form.submit submit_text, class: "btn btn-primary"