{"id":33816,"date":"2017-10-19T03:01:45","date_gmt":"2017-10-18T17:01:45","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=33816"},"modified":"2017-10-19T05:20:39","modified_gmt":"2017-10-18T19:20:39","slug":"htmljavascript-esl-scenario-question-answer-game-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/htmljavascript-esl-scenario-question-answer-game-tutorial\/","title":{"rendered":"HTML\/Javascript ESL Scenario Question Answer Game Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/q_and_a.html\"><img decoding=\"async\" style=\"float:left; border: 15px solid pink;\" alt=\"HTML\/Javascript ESL Scenario Question Answer Game Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/q_and_a.png\" title=\"HTML\/Javascript ESL Scenario Question Answer Game Tutorial\"  \/><\/a><p class=\"wp-caption-text\">HTML\/Javascript ESL Scenario Question Answer Game Tutorial<\/p><\/div>\n<p>We have a new <a target=_blank title='ESL information from Wikipedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/English_as_a_second_or_foreign_language'>ESL<\/a> (or &#8220;English as a Second or Foreign Language&#8221;) game on the topic of Scenario Question Answer, and getting the missing component, with some English sentences we present in the game.  We thank How English Works by Michael Swan and Catherine Walter (ISBN: 978-0-19-431456-5) for ideas here.<\/p>\n<p>The web application has a simple two array structure &#8230;<\/p>\n<ul>\n<li>a &#8220;scenarios&#8221; Javascript array<\/li>\n<li>a &#8220;sentences&#8221; Javascript array using the &#8220;?&#8221; delimitation to separate <i>scenerio index<\/i>?<i>fully defined question<\/i>?<i>contextual question<\/i>?<i>answer<\/i><\/li>\n<\/ul>\n<p> &#8230; leaving us four concepts &#8230;<\/p>\n<ul>\n<li>scenerio index<\/li>\n<li>fully defined question<\/li>\n<li>contextual question<\/li>\n<li>answer<\/li>\n<\/ul>\n<p> &#8230; one of which is made to be &#8220;unknown&#8221; (for the user to guess) into a &#8230;<\/p>\n<ul>\n<li>HTML select element dropdown the user can correctly select from to &#8220;run&#8221; the game &#8230; and the relevant &#8220;knowns&#8221; are written into &#8230;<\/li>\n<li>HTML textarea readonly=readonly elements<\/li>\n<\/ul>\n<p>The Scenario Question Answer game is just written in HTML (with inline Javascript and inline CSS) that you can download with <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/q_and_a.html_GETME\" title=\"q_and_a.html\">q_and_a.html<\/a> and\/or try yourself at this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/q_and_a.html\" title=\"Click picture\">live run<\/a> link.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d33816' onclick='var dv=document.getElementById(\"d33816\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/esl\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d33816' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>We have a new ESL (or &#8220;English as a Second or Foreign Language&#8221;) game on the topic of Scenario Question Answer, and getting the missing component, with some English sentences we present in the game. We thank How English Works &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/htmljavascript-esl-scenario-question-answer-game-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,14,37],"tags":[2367,103,396,476,576,652,997,2085,2366,1866,1262,1319],"class_list":["post-33816","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-tutorials","tag-answer","tag-array","tag-esl","tag-game","tag-html","tag-javascript","tag-programming","tag-question","tag-readonly","tag-select","tag-textarea","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/33816"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=33816"}],"version-history":[{"count":6,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/33816\/revisions"}],"predecessor-version":[{"id":33826,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/33816\/revisions\/33826"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=33816"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=33816"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=33816"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}