diff --git a/content.js b/content.js index fbf73a771f06d110a1b780443a3f4f7bdd010338..66be82439e284a6ffac80c0d8b4b1d82318e7cff 100644 --- a/content.js +++ b/content.js @@ -267,6 +267,35 @@ let Content = { concepts: ["Inspector", "DOM", "CSS", "list"], order: 6 }, + radio_points: { + instructions: "Select the amount of points you would like to have and whether you will be awarded points. You might need to remove a <em>disabled</em> for the desired point amount.", + html: "<div id=\"radio-inputs\"><form method=\"post\" action=\"#\" id=\"award-points-form\">Award points?<br>No <input type=\"radio\" name=\"give-points\" value=\"no\"><br>Yes <input type=\"radio\" name=\"give-points\" value=\"yes\"><br><hr>How many points?<br>No Points <input type=\"radio\" name=\"point-amount\" value=\"0\" checked=\"\"><br>Half points <input type=\"radio\" name=\"point-amount\" value=\"5\"><br>Full Points <input type=\"radio\" name=\"point-amount\" value=\"10\" disabled=\"\"><br><input type=\"submit\" id=\"award-points\" value=\"Award Points\"></form></div>", + selector: "#award-points-form", + events: "submit", + points: function ($element, config, event) { + const form = document.getElementById('award-points-form'); + const givePoints = form.elements['give-points'].value; + const pointAmount = parseInt(form.elements['point-amount'].value); + + event.preventDefault(); + if(givePoints === 'yes') { + return { + points: pointAmount, + feedback: 'Congratulations! You got ' + pointAmount + ' points.' + }; + } else { + return { + points: 0, + feedback: 'You selected not to have points.' + }; + } + }, + maxPoints: 10, + title: "Radio Points", + description: "Points for selecting correct radio inputs", + concepts: ["HTML", "Input", "radio", "disabled", "checked"], + order: 7 + }, }; module.exports = Content;