What is JSON?

JavaScript Object Notation (JSON) is a compact and versatile way to send data over the Internet, especially for sending "just-in-time" information without a page reload, via techniques like AJaX.

How do I write JSON for a New Media Tutorial quiz?

1. Copy the following template into a new document, or just download it from here.
2. Customize the values of each variable--the strings and numbers--to match your screencast.
3. Push as many multiple-choice quizzes as you want into your JSON as indicated below. (Ask your teacher if you want to add free-form quizzes--they are harder to code.)
4. Save your document as quizData.json. If you're using a word processor instead of code editor, make sure you save the document as plain text.
5. Follow your teacher's instructions for sharing or uploading it.

// quizData.json template version 1.5
// Edit this JavaScript Object Notation (JSON) to customize the quiz for NMD screencasts.
// Load this information as an external script in the Web page that has the screencast.
/*__________ Define the quiz manager. __________*/
//We'll start by defining an array, indicated by brackets [].
quizDataObjs = [] ;
/*__________ Set the basic metadata, which will appear via JavaScript in the index.html page. __________*/
quizDataObjs.tutorialTitle = "How to tie a square knot" ;
quizDataObjs.videoBoxWidthInt = 480 ;
quizDataObjs.videoBoxHeightInt = 300 ;
quizDataObjs.endMessageTime = 132 ; // Must be in seconds.
quizDataObjs.videoPathPrimary = "media/tie_square_knot.webm" ;
quizDataObjs.videoPathSecondary = "media/tie_square_knot.mp4" ;
quizDataObjs.badgeMaxPath = "media/tie_square_knot_max.png" ;
// Add a link to your headshot. If there are more than one contributer, separate their quoted paths with a comma.
quizDataObjs.headshotPaths = ["../headshots/rodriguez_jane_thu.jpg"] ;
// If you've added a badge to the system, put its id here as a number inside quotes.
quizDataObjs.badgeIdAsString = "63" ; // Get this from PABO > Edit Badge.
// Did you make the badge? Give yourself credit! (Else omit this line.)
quizDataObjs.badgeDesignCredit = "Badge design by Jane Rodriguez" ;
// Did you make a written script too?
quizDataObjs.scriptExists = false ;
// Do you have any demo files or other resources that go with the video?
quizDataObjs.relatedFilesExist = false ;
// Can you can think of related tutorials in the system?
quizDataObjs.relatedTutorialsExist = true ;
// If so, add them with property-value pairs separated by commas, inside objects enclosed by braces,
// inside the following array enclosed with brackets.
quizDataObjs.relatedTutorialObjs = [
	{
		tutorialName: "How To Prepare Your Computer for Web Projects",
		tutorialLink: "http://tutorials.NMDprojects.net/prepare_web_project",
		tutorialBadgePath: "http://tutorials.NMDprojects.net/prepare_web_project/media/prepare_web_project_max.png"
	},
	{
		tutorialName: "How To Choose Names for Web Development",
		tutorialLink: "http://tutorials.NMDprojects.net/choose_web_names",
		tutorialBadgePath: "http://tutorials.NMDprojects.net/choose_web_names/media/choose_web_names_max.png"
	}
]
/*__________ Customize the welcome message __________*/
quizDataObjs.welcomeMessage = "<h4>" + quizDataObjs.tutorialTitle + "</h4>" ;
quizDataObjs.welcomeMessage += "<p>Level: <em>Beginner/Intermediate/Advanced/Expert</em></p>" ; // Pick one.
quizDataObjs.welcomeMessage += "<p>This tutorial by Jane Rodriguez explains how to tie two ends of rope together." ;
/*__________ Add the quizzes. __________*/
// Below you can push objects, indicated by braces {}, into the array one at a time.
// Each object will define the variables needed to build the quiz.
/*__________ Notes on the quiz variables. __________*/
// The "answers" variable is itself an array, indicated by brackets.
// You don't need to add numbers to the answers--that will happen automatically.
// correctAnswerInt starts with 1 because it's what reader sees. It's NOT the array index.
// Typically you should move returnToTimeInSeconds a second or so after the start of the last clip
// so it doesn't trigger the previous section's quiz by accident.
quizDataObjs.push(
	{
		question: "Which of these knots cannot be used to tie two ends of rope together?",
		answers: [
			"Square knot",
			"Granny knot",
			"Blood knot",
			"Slip knot"
		],
		correctAnswerInt: 4,
		beginAtTimeInSeconds: 31.5,
		returnToTimeInSeconds: 21
	}
) ;
quizDataObjs.push(
	{
		question: "Under what conditions is a square knot useful?",
		answers: [
			"When the two ropes are different sizes",
			"When the two ropes are identical",
			"When splicing fishing line",
			"None of the above"
		],
		correctAnswerInt: 2,
		beginAtTimeInSeconds: 90,
		returnToTimeInSeconds: 69
	}
) ;	
	

When you're done, this external file will automatically load your quiz data into the interactive screencast page. Yay!

Questions? Please contact Jon Ippolito.