Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Khan Quiz Creator 1.0
ID	5877150254104576
Created	11 years ago, 1398691092638
Updated	11 years ago, 1405434036684
Code	// Khan Quiz Creator 1.0 - Jacob Mikkelsen // Be sure to check my profile for the latest version // Hi, and welcome to the Khan Quiz Creator! // I developed this program to allow students to create their own quizzes // for topics with missing exercises, as well as creating fun quizzes for friends! // For details on creating your own quiz, scroll down a little bit // past the QUESTION CONSTRUCTOR section to QUIZ DATA ENTRY // If you're having trouble trying to create a quiz or have any other questions // don't hesitate to ask away in the comments section // Similarly, if you have any feedback, or features you'd like to see, drop it // in the comments section and I'll see what I can do! ///// QUESTION CONSTRUCTOR ///// var Question = function( QuestionText, Answers ) { this.QuestionText = QuestionText; this.Answers = Answers; this.AnswerCount = Answers.length; }; var Questions = []; ///// QUIZ DATA ENTRY ///// // You made it! So you want to make a quiz, eh? Well, it's quite easy // Here you can set the title of the quiz var Title = "\"Khan Quiz Creator\" Quiz"; // Here you can set the number of questions to ask in the quiz // - If the number is < 1, all questions will be asked // - Be careful not to ask more questions than you've entered! var QuestionCount = 0; // Here we have the questions themselves, you can copy, paste, and edit the // template to add your own questions! // - The Question Text is the question itself, "What is 2 + 2?" // - The answers are the options the user will pick // from when they are given the question // - IMPORTANT: The first answer in the list is the correct answer! // - You can have any number of answers, though I wouldn't recommend more than 8! Questions.push( new Question( // Question Text "What can I do with the Khan Quiz Creator?", [ // Answers "Make awesome quizzes!", "Slay zombies", "Fly kites", "Summon dragons" ] ) ); Questions.push( new Question( // Question "Can it support more than 4 answers?", [ // Answers "Obviously!", "Nope", "No", "Nein", "いいえ", "Non", "Nee", "Ni" ] ) ); Questions.push( new Question( // Question Text "What should I do if I have problems making my own quiz?", [ // Answers "Ask for help!", "Sulk", "Give up", "Get grumpy" ] ) ); Questions.push( new Question( // Question Text "I have an idea or feature request, what should I do?", [ // Answers "Leave a comment!", "Keep it to yourself", "Sell it to the government", "Forget about it" ] ) ); Questions.push( new Question( // Question Text "Can I make my own quiz?", [ // Answers "Absolutely! Spin it off!", "Impossible", "Nope, not allowed", "Nuh-uh" ] ) ); Questions.push( new Question( // Question Text "Where can I find instructions on making my own quiz?", [ // Answers "Check the code!", "20,000 leagues under the sea", "Behind the sofa cushion", "Under your keyboard" ] ) ); Questions.push( new Question( // Question Text "Okay, time for a real question!\n\nWhat's 1+1?", [ // Answers "2", "3", "4", "1" ] ) ); Questions.push( new Question( // Question Text "What's new in Khan Quiz Creator 1.0?", [ // Answers "Word wrapping, an improved layout, and more!", "Nothing special", "Eh", "Not much" ] ) ); ///// OTHER CONSTRUCTORS ///// var QuizManager = function(){ var CurrentQuestion; var SelectedAnswer = -1; var CorrectCount = 0; var SkippedCount = 0; var IncorrectCount = 0; // Answered values // -1 Unanswered // 0 Wrong answer // 1 Correct answer var Answered = -1; }; var debugButtons = false; var DrawButtonDebug = function( Rect ){ noStroke(); fill(255, 0, 0, 128); rect(Rect.X, Rect.Y, Rect.Width, Rect.Height); }; var Rect = function( X, Y, Width, Height, Radius, Enabled ) { this.X = X; this.Y = Y; this.Width = Width; this.Height = Height; this.Radius = Radius; // If we have 6 or more arguments use Enabled argument, otherwise set to true if (arguments.length >= 6){ this.Enabled = Enabled; } else { this.Enabled = true; } }; Rect.prototype.mimic = function( Rect ){ this.X = Rect.X; this.Y = Rect.Y; this.Width = Rect.Width; this.Height = Rect.Height; this.Radius = Rect.Radius; }; Rect.prototype.draw = function() { if (this.Enabled){ rect(this.X, this.Y, this.Width, this.Height, this.Radius); } }; Rect.prototype.enable = function(){ this.Enabled = true; }; Rect.prototype.disable = function(){ this.Enabled = false; }; Rect.prototype.debug = function(){ if (debugButtons){ if (this.Enabled){ DrawButtonDebug(new Rect(this.X, this.Y, this.Width, this.Height)); } } }; var EllipseToRect = function( Ellipse ){ var xPosition = Ellipse.X - Ellipse.Diameter / 2; var yPosition = Ellipse.Y - Ellipse.Diameter / 2; var Width = Ellipse.Diameter; var Height = Ellipse.Diameter; return new Rect(xPosition, yPosition, Width, Height); }; var RadioButton = function(X, Y, Diameter, Selected, Hitbox){ this.X = X; this.Y = Y; this.Diameter = Diameter; this.Selected = Selected; this.Hitbox = EllipseToRect(this); }; RadioButton.prototype.draw = function(){ // Draw button circle fill(255, 255, 255); stroke(0, 0, 0); ellipse(this.X, this.Y, this.Diameter, this.Diameter); // If selected, draw selection circle if (this.Selected){ var dotDiameter = this.Diameter/3; noStroke(); fill(0, 0, 0); ellipse(this.X, this.Y, dotDiameter, dotDiameter); } }; var RadioButtons = []; ///// VARIABLES ///// // Global variables that affect the functionality or appearance of the quiz, // but not the content (questions and answers) // If 0, limit by number of questions available if ( QuestionCount < 1 ){ QuestionCount = Questions.length; } if ( QuestionCount > Questions.length){ println("Warning! You are trying to quiz " + QuestionCount + " problems but have only provided " + Questions.length + " questions!"); } var TitleBarColor = color(59, 143, 163); var FeedbackColor = color(119, 119, 119); var Feedback = ""; var AnswerRegionStroke = color(119, 119, 119); var AnswerRegionFill = color(238, 238, 238); /* EndColors were going to be used for the end gradient of the buttons, but this difficult when they're rounded.../ var CheckAnswerStrokeColor = color(115, 115, 6); var CheckAnswerStartColor = color(138, 185, 8); //var CheckAnswerEndColor = color(113, 153, 7); var SkipStrokeColor = color(46, 57, 72); var SkipStartColor = color(58, 71, 89); //var SkipEndColor = color(44, 54, 67); var NextStrokeColor = CheckAnswerStrokeColor; var NextStartColor = CheckAnswerStartColor; //var NextEndColor = CheckAnswerEndColor; var AnswerRegion = new Rect(20, 200, width - 40, 180); var CheckAnswerButton = new Rect(); var NextQuestionButton = new Rect(); var SkipButton = new Rect(); var RetryButton = new Rect(); / Don't really like using these guys.../ var RadioButtonsRandom = []; var DisplaySmiley = true; / Want to put State in QuizManager / var State = "Quiz"; ///// FUNCTIONS ///// var textHeight = function(){ return round(textDescent() + textAscent()); }; var WordWrap = function( Text, X, Y, Xtent, Debug ){ var words = Text.split(" "); var wrapped = words[0]; for (var i = 1; i < words.length; i++){ if (textWidth(wrapped + " " + words[i]) < Xtent - X){ wrapped += " " + words[i]; } else { wrapped += "\n" + words[i]; } } fill(0, 0, 0); text(wrapped, X, Y); // Debug display does not account for horizontal text alignments other than LEFT if (Debug){ noStroke(); fill(255, 0, 0, 128); rect(X, 0, Xtent - X, height); } }; var ClearArray = function( Array ){ for (var i = Array.length; i > 0; i--){ Array.pop(); } }; var RandomizeArray = function( Array ){ // Fisher-Yates Shuffle // http://bost.ocks.org/mike/shuffle/ var randomizedArray = Array; var lastElement = randomizedArray.length; while (lastElement > 0){ var randomElement = floor(random(0, lastElement)); lastElement--; var temp = randomizedArray[lastElement]; randomizedArray[lastElement] = randomizedArray[randomElement]; randomizedArray[randomElement] = temp; } return randomizedArray; }; var SetupRadioButtons = function(Question){ // Clear old radio buttons and selection ClearArray(RadioButtons); QuizManager.SelectedAnswer = -1; // Add new radio buttons for (var i = 0; i < Question.AnswerCount; i++){ RadioButtons.push( new RadioButton()); } // Clear array of randomly ordered radio buttons ClearArray(RadioButtonsRandom); for (var i = 0; i < Question.AnswerCount; i++){ RadioButtonsRandom.push(i); } RadioButtonsRandom = RandomizeArray(RadioButtonsRandom); }; var SetupAnswerRegion = function(){ var buttonWidth = 120; var buttonHeight = 30; var xOffset = 10; var yOffset = 10; var xPosition = AnswerRegion.X + AnswerRegion.Width - buttonWidth - xOffset; var yPosition = AnswerRegion.Y + AnswerRegion.Height - buttonHeight - yOffset; CheckAnswerButton = new Rect(xPosition, yPosition, buttonWidth, buttonHeight, 4); NextQuestionButton.mimic(CheckAnswerButton); SkipButton.X = xPosition - buttonWidth - xOffset; SkipButton.Y = yPosition; SkipButton.Width = buttonWidth; SkipButton.Height = buttonHeight; SkipButton.Radius = 4; }; var DrawAnswerRegion = function( Question ){ // Display Text var feedbackOffsetY = 5; fill(FeedbackColor); textSize(16); textAlign(RIGHT, BASELINE); text( Feedback, CheckAnswerButton.X + CheckAnswerButton.Width, CheckAnswerButton.Y - feedbackOffsetY); // The space between the top of the answer box and the top of the Feedback text var AnswerSpace = CheckAnswerButton.Y - textHeight() - feedbackOffsetY - AnswerRegion.Y; // Answers textAlign(LEFT, CENTER); textSize(16); // Divide box into equal portions based on number of answers var ySpacing = AnswerSpace / Question.AnswerCount; stroke(0, 0, 0); for ( var i = 0; i < Question.AnswerCount; i++ ) { var padding = 5; // Position answers at equal intervals, offset by the AnswerRegion's y position // and half of ySpacing (to offset them equally from the top and bottom) var yPosition = AnswerRegion.Y + ySpacing RadioButtonsRandom[i] + ySpacing/2; RadioButtons[i].Diameter = 10; RadioButtons[i].X = AnswerRegion.X + RadioButtons[i].Diameter/2 + padding; RadioButtons[i].Y = yPosition; RadioButtons[i].Hitbox.Width = textWidth(Question.Answers[i]) + RadioButtons[i].Diameter + padding2; if ( textHeight() > RadioButtons[i].Diameter){ RadioButtons[i].Hitbox.Height = textHeight(); } else { RadioButtons[i].Hitbox.Height = RadioButtons[i].Diameter; } RadioButtons[i].Hitbox.X = AnswerRegion.X; RadioButtons[i].Hitbox.Y = yPosition - RadioButtons[i].Hitbox.Height/2; RadioButtons[i].draw(); fill(0, 0, 0); WordWrap( Question.Answers[i], RadioButtons[i].X + RadioButtons[i].Diameter/2 + padding, yPosition, AnswerRegion.X + AnswerRegion.Width); } var NextText = "Next Question"; if (QuizManager.CurrentQuestion === QuestionCount - 1){ NextText = "Finish!"; } if ( QuizManager.Answered === 1 ){ // Next Question // Box stroke(NextStrokeColor); fill(NextStartColor); NextQuestionButton.draw(); // Text fill(255, 255, 255); textAlign(CENTER, CENTER); text( NextText, NextQuestionButton.X + NextQuestionButton.Width/2, NextQuestionButton.Y + NextQuestionButton.Height/2); } else { // Check Answer // Box stroke(CheckAnswerStrokeColor); fill(CheckAnswerStartColor); CheckAnswerButton.draw(); // Text fill(255, 255, 255); textAlign(CENTER, CENTER); text( "Check Answer", CheckAnswerButton.X + CheckAnswerButton.Width/2, CheckAnswerButton.Y + CheckAnswerButton.Height/2); } if (QuizManager.Answered < 1){ // Skip // Box stroke(SkipStrokeColor); fill(SkipStartColor); SkipButton.draw(); // Text fill(255, 255, 255); textAlign(CENTER, CENTER); text( "Skip", SkipButton.X + SkipButton.Width/2, SkipButton.Y + SkipButton.Height/2); } }; var PrepareNewQuestion = function(){ DisplaySmiley = false; SetupAnswerRegion(); SetupRadioButtons(Questions[QuizManager.CurrentQuestion]); Feedback = ""; CheckAnswerButton.enable(); NextQuestionButton.disable(); SkipButton.enable(); QuizManager.Answered = -1; }; var NewQuestion = function(){ QuizManager.CurrentQuestion++; if (QuizManager.CurrentQuestion < QuestionCount){ // Haven't answered all questions, go to Quiz state State = "Quiz"; PrepareNewQuestion(); } else { // Answered all questions, go to End state State = "End"; } }; var ResetQuiz = function(){ State = "Quiz"; Questions = RandomizeArray(Questions); QuizManager.CurrentQuestion = 0; QuizManager.CorrectCount = 0; QuizManager.SkippedCount = 0; QuizManager.IncorrectCount = 0; PrepareNewQuestion(); }; var DrawSmiley = function(){ var x = 225; var y = 355; var size = 30; var pupilSize = size 0.14; stroke(0, 0, 0); strokeWeight(0.06 * size); fill(255, 255, 0); ellipse(x, y, size, size); arc(x, y, 0.6 * size, 0.56 * size, 0, 180); noStroke(); fill(0, 0, 0); ellipse(x - 0.2 * size, y - 0.2 * size, pupilSize, pupilSize); ellipse(x + 0.2 * size, y - 0.2 * size, pupilSize, pupilSize); strokeWeight(1); }; var DrawRadioButtons = function(){ for (var i = 0; i < RadioButtons.length; i++){ RadioButtons[i].draw(); } }; var DrawQuestion = function( Question ) { textAlign(LEFT, TOP); fill(0, 0, 0); // Question textSize(20); WordWrap(Question.QuestionText, 20, 45, width-20); }; var DrawStatistics = function(){ var xPosition = 295; var yPosition = AnswerRegion.Y - 5; var xOffset = 20; fill(CheckAnswerStartColor); textAlign(CENTER, BASELINE); text(QuizManager.CorrectCount, xPosition, yPosition); fill(0, 0, 0); text("/", xPosition + xOffset, yPosition); xPosition += xOffset; fill(11, 16, 84); text(QuizManager.SkippedCount, xPosition + xOffset, yPosition); xPosition += xOffset; fill(0, 0, 0); text("/", xPosition + xOffset, yPosition); xPosition += xOffset; fill(255, 0, 0); text(QuizManager.IncorrectCount, xPosition + xOffset, yPosition); }; var DrawTitleBar = function(){ // Background noStroke(); fill(TitleBarColor); var TitleBar = new Rect(0, 0, width, 35); TitleBar.draw(); // Text fill(255, 255, 255); textAlign(CENTER,TOP); textSize(30); text(Title, width/2, 0); }; var ClearCanvas = function(){ // Clear previous content background(255, 255, 255); }; var RefreshCanvas = function() { ClearCanvas(); DrawTitleBar(); // Draw answer box // Background stroke(AnswerRegionStroke); fill(AnswerRegionFill); AnswerRegion.draw(); DrawQuestion(Questions[QuizManager.CurrentQuestion]); DrawStatistics(); DrawAnswerRegion(Questions[QuizManager.CurrentQuestion]); //DrawAnswerButton(); if (DisplaySmiley){ DrawSmiley(); } if (debugButtons){ for (var i = 0; i < RadioButtons.length; i++){ DrawButtonDebug(RadioButtons[i].Hitbox); } CheckAnswerButton.debug(); NextQuestionButton.debug(); SkipButton.debug(); } }; var ResetRadioButtons = function() { for (var i = 0; i < RadioButtons.length; i++){ RadioButtons[i].Selected = false; } }; var CheckMouseCollision = function(Rect){ var mouseCollision = false; if (Rect.Enabled){ if (mouseY > Rect.Y && mouseY <= Rect.Y + Rect.Height){ if (mouseX > Rect.X && mouseX <= Rect.X + Rect.Width){ mouseCollision = true; } } } return mouseCollision; }; var CheckAnswer = function(){ switch (QuizManager.SelectedAnswer){ case 0: Feedback = "Correct!"; DisplaySmiley = true; if (QuizManager.Answered < 1){ // Question has not been answered at all if (QuizManager.Answered < 0){ // Question has not been answered incorrectly QuizManager.CorrectCount++; } QuizManager.Answered = 1; } NextQuestionButton.enable(); CheckAnswerButton.disable(); SkipButton.disable(); break; case -1: Feedback = "Please select an answer"; break; default: if (QuizManager.Answered === -1){ QuizManager.IncorrectCount++; QuizManager.Answered = 0; } Feedback = "Incorrect"; break; } RefreshCanvas(); }; var DrawEndScreen = function(){ ClearCanvas(); DrawTitleBar(); var xPos = 20; var yPos = 150; var ySpacing = 20; fill(0, 0, 0); textSize(30); text("Congratulations!", 200, 100); textSize(18); textAlign(LEFT,TOP); text("You answered " + QuestionCount + " questions", xPos, yPos); yPos += ySpacing; fill(CheckAnswerStartColor); text(QuizManager.CorrectCount + " Correctly", xPos, yPos); yPos += ySpacing; fill(255, 0, 0); text(QuizManager.IncorrectCount + " Incorrectly", xPos, yPos); yPos += ySpacing; fill(SkipStartColor); text(QuizManager.SkippedCount + " Skipped", xPos, yPos); yPos += ySpacing; RetryButton = new Rect(); RetryButton.Width = 120; RetryButton.Height = 30; RetryButton.X = (width - RetryButton.Width)/2; RetryButton.Y = 275; RetryButton.Radius = 4; fill(CheckAnswerStartColor); stroke(CheckAnswerStrokeColor); RetryButton.draw(); fill(255, 255, 255); textAlign(CENTER,CENTER); text( "Retry", RetryButton.X + RetryButton.Width/2, RetryButton.Y + RetryButton.Height/2); RetryButton.debug(); }; var mousePressed = function(){ switch (State){ case "Quiz": if (CheckMouseCollision(AnswerRegion)){ // Clicked inside AnswerRegion if (CheckMouseCollision(NextQuestionButton)){ // Clicked inside NextQuestionButton if(QuizManager.Answered === 1){ // User has already been answered correctly NewQuestion(); break; } } if(CheckMouseCollision(CheckAnswerButton)){ // Clicked on CheckAnswerButton if (QuizManager.Answered < 1){ // User has not answered the question correctly CheckAnswer(); break; } } if(CheckMouseCollision(SkipButton)){ // Clicked on NextQuestionButton if (QuizManager.Answered === -1){ QuizManager.SkippedCount++; QuizManager.Answered = 0; } NewQuestion(); break; } if (QuizManager.Answered < 1){ // User has not yet answered correctly for (var i = 0; i < RadioButtons.length; i++){ // Loop through RadioButtons if(CheckMouseCollision(RadioButtons[i].Hitbox)){ // Clicked on a radio button ResetRadioButtons(); RadioButtons[i].Selected = true; QuizManager.SelectedAnswer = i; break; } } } } break; case "End": if (CheckMouseCollision(RetryButton)){ ResetQuiz(); } break; default: println("Error! Invalid state: " + State); break; } }; ///// MAIN ///// ResetQuiz(); var draw = function() { switch (State){ case "Quiz": RefreshCanvas(); break; case "End": DrawEndScreen(); break; } };
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgMDpyqe4Cgw
Votes	206
Spin-Offs	72
Type	PJS
Width	400
Height	400
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Jacob Mikkelsen
Author Name	JacobMikkelsen
Author ID	kaid_1139413682757131498066895
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739450310770
Updated	10 months ago, 1739450316604
Source Deleted	unknown