// Numbas version: finer_feedback_settings
{"name": "Ann's copy of Use canvas to draw a rectangle", "extensions": [], "custom_part_types": [], "resources": [], "navigation": {"allowregen": true, "showfrontpage": false, "preventleave": false, "typeendtoleave": false}, "question_groups": [{"pickingStrategy": "all-ordered", "questions": [{"showQuestionGroupNames": false, "functions": {"rectangle": {"language": "javascript", "parameters": [["w", "number"], ["h", "number"]], "definition": "\n      var c = document.createElement('canvas');\n        $(c).attr('width',w+40).attr('height',h+40);\n        var context = c.getContext('2d');\n        \n        //fill in rectangle with a light shade\n        context.fillStyle = '#eee';\n        context.fillRect(5,5,w,h);\n        \n        //draw outline\n        context.strokeStyle = '#000';\n        context.lineWidth = 3;\n        context.strokeRect(5,5,w,h);\n        \n        //draw labels\n        context.fillStyle = '#000';\n        context.font = '20px sans-serif';\n        var wstring = w+'m';\n        var tw = context.measureText(wstring).width;\n        console.log(tw);\n        context.fillText(wstring,5+(w-tw)/2,5+h+25);\n        \n        var hstring = h+'m';\n        var hw = context.measureText(hstring).width;\n        context.save();\n        context.translate(5+w+25,5+(h+hw)/2);\n        context.rotate(-Math.PI/2);\n        context.fillText(hstring,0,0);\n        \n        return c;\n      ", "type": "html"}}, "rulesets": {}, "tags": ["canvas", "demo", "function", "graphic"], "name": "Ann's copy of Use canvas to draw a rectangle", "preamble": {"css": "", "js": ""}, "ungrouped_variables": ["h", "w"], "variable_groups": [], "variablesTest": {"condition": "", "maxRuns": 100}, "type": "question", "advice": "", "parts": [{"prompt": "<p>What is the rectangle's perimeter, in metres?</p>", "marks": 1, "minValue": "2(w+h)", "allowFractions": false, "maxValue": "2(w+h)", "showPrecisionHint": false, "correctAnswerFraction": false, "showCorrectAnswer": true, "type": "numberentry", "scripts": {}}, {"prompt": "<p>What is the rectangle's area, in metres?</p>", "marks": 1, "minValue": "w*h", "allowFractions": false, "maxValue": "w*h", "showPrecisionHint": false, "correctAnswerFraction": false, "showCorrectAnswer": true, "type": "numberentry", "scripts": {}}], "metadata": {"description": "<p>The custom function <code>rectangle(width,height)</code> draws a rectangle with the given dimensions, along with some labels.</p>", "licence": "Creative Commons Attribution 4.0 International", "notes": "<p>Doesn't work in IE8, because it doesn't support the canvas element.</p>"}, "question_groups": [{"pickingStrategy": "all-ordered", "name": "", "questions": [], "pickQuestions": 0}], "statement": "<p>This rectangle is <strong>{w} metres</strong> wide and <strong>{h} metres</strong> long.</p>\n  <p style=\"text-align: center;\">{rectangle(w,h)}</p>", "variables": {"w": {"description": "", "name": "w", "templateType": "anything", "definition": "random(100..200#5)", "group": "Ungrouped variables"}, "h": {"description": "", "name": "h", "templateType": "anything", "definition": "random(50..100#5)", "group": "Ungrouped variables"}}, "contributors": [{"name": "Christian Lawson-Perfect", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/7/"}, {"name": "Ann Smith", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/2295/"}]}]}], "contributors": [{"name": "Christian Lawson-Perfect", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/7/"}, {"name": "Ann Smith", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/2295/"}]}