mirror of
https://github.com/GrammaticalFramework/gf-core.git
synced 2026-04-14 07:19:31 -06:00
New demo: translation quiz. Remove outdated demos/index.txt
This commit is contained in:
hallgren
BIN
demos/TransQuiz/brushed-metal.png
Normal file
BIN
demos/TransQuiz/brushed-metal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
93
demos/TransQuiz/minibar_quiz.css
Normal file
93
demos/TransQuiz/minibar_quiz.css
Normal file
@@ -0,0 +1,93 @@
|
||||
body {
|
||||
background: #eee url("brushed-metal.png");
|
||||
}
|
||||
|
||||
/*th, td { vertical-align: baseline; text-align: left; }*/
|
||||
|
||||
div#surface {
|
||||
min-height: 3ex;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
border: 3px dashed #e0e0e0;
|
||||
}
|
||||
|
||||
div#words {
|
||||
min-height: 3ex;
|
||||
margin: 5px;
|
||||
padding: 6px;
|
||||
border: 3px solid #e0e0e0;
|
||||
}
|
||||
|
||||
div.word, span.word, div#words input[type=button] {
|
||||
display: inline-block;
|
||||
font-family: sans-serif;
|
||||
font-size: 100%;
|
||||
background-color: white;
|
||||
border: 1px solid black;
|
||||
padding: 3px;
|
||||
margin: 3px;
|
||||
}
|
||||
|
||||
/* added for quiz */
|
||||
textarea.quest {
|
||||
width: 452px;
|
||||
height: 35px;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
textarea.explain {
|
||||
width: 452px;
|
||||
height: 70px;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
input.answer1 {
|
||||
width: 442px;
|
||||
height: 20px;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
div.hint {
|
||||
font-family: Verdana;
|
||||
font-weight: bold;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
div.bold {
|
||||
font-weight: bold;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
input.number {
|
||||
text-align:center;
|
||||
font-family: Verdana;
|
||||
font-weight: bold;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
div.shift_left {
|
||||
padding-left: 320px;
|
||||
}
|
||||
/* default for all links */
|
||||
a:link {color: #2E8B57; font-size:16px; font-weight: bold; text-decoration: underline; }
|
||||
a:active {color: #2E8B57; font-size:16px; font-weight: bold; text-decoration: underline; }
|
||||
a:visited {color: #2E8B57; font-size:16px; font-weight: bold; text-decoration: underline; }
|
||||
a:hover {color: #CD853F; font-size:16px; font-weight: bold; text-decoration: none; }
|
||||
|
||||
.invalid { color: red; }
|
||||
|
||||
div.modtime { float: right; }
|
||||
.modtime { color: #444; white-space: nowrap; }
|
||||
|
||||
ul.space>li { margin-top: 0.5ex; }
|
||||
|
||||
div#saldospel input[type=button] { font-size: 100%; }
|
||||
|
||||
div#saldospel input.correct { color: green; }
|
||||
div#saldospel input.incorrect { color: red; }
|
||||
|
||||
#surface input[type=text] { width: 5em; }
|
||||
|
||||
|
||||
span.field { background-color: #eee; }
|
||||
|
||||
637
demos/TransQuiz/minibar_quiz.js
Normal file
637
demos/TransQuiz/minibar_quiz.js
Normal file
@@ -0,0 +1,637 @@
|
||||
// minibar.js, assumes that support.js has also been loaded
|
||||
|
||||
var tree_icon="tree-btn.png";
|
||||
|
||||
/*
|
||||
// This is essentially what happens when you call start_minibar:
|
||||
if(server.grammar_list) grammars=server.grammar_list;
|
||||
else grammars=server.get_grammarlist();
|
||||
show_grammarlist(grammars)
|
||||
select_grammar(grammars[0])
|
||||
grammar_info=server.get_languages()
|
||||
show_languages(grammar_info)
|
||||
new_language()
|
||||
complete_output=get_completions()
|
||||
show_completions(complete_output)
|
||||
*/
|
||||
|
||||
function Minibar(server,opts,target) {
|
||||
// Typically called when the HTML document is loaded
|
||||
|
||||
/* --- Configuration ---------------------------------------------------- */
|
||||
|
||||
// default values for options:
|
||||
this.options={
|
||||
show_abstract: false,
|
||||
show_trees: false,
|
||||
show_grouped_translations: true,
|
||||
delete_button_text: "⌫",
|
||||
default_source_language: null,
|
||||
|
||||
//modified for quiz
|
||||
try_google: false,
|
||||
|
||||
feedback_url: null,
|
||||
|
||||
//modified for quiz
|
||||
random_button: false,
|
||||
|
||||
help_url: null
|
||||
}
|
||||
|
||||
// Apply supplied options
|
||||
if(opts) for(var o in opts) this.options[o]=opts[o];
|
||||
|
||||
/* --- Creating user interface elements --------------------------------- */
|
||||
|
||||
this.surface=div_id("surface");
|
||||
this.extra=div_id("extra");
|
||||
this.menubar=div_id("menubar");
|
||||
this.words=div_id("words");
|
||||
this.translations=div_id("translations");
|
||||
|
||||
this.minibar=element(target || "minibar");
|
||||
this.minibar_contin=element("minibar_contin");
|
||||
this.minibar_buttons=element("minibar_buttons");
|
||||
this.minibar.innerHTML="";
|
||||
|
||||
//modified for quiz
|
||||
with(this) {
|
||||
appendChildren(minibar,[menubar]);
|
||||
appendChildren(minibar_contin,[surface,words]);
|
||||
append_extra_buttons(extra,options);
|
||||
}
|
||||
|
||||
// Filled in and added to minibar later:
|
||||
this.grammar_menu=empty_id("select","grammar_menu");
|
||||
this.from_menu=empty_id("select","from_menu");
|
||||
this.to_menu=empty_id("select","to_menu");
|
||||
|
||||
|
||||
/* --- Minibar client state initialisation ------------------------------ */
|
||||
this.grammar=null;
|
||||
|
||||
//modified for quiz
|
||||
this.current={from: null, to:null, input: ""};
|
||||
|
||||
this.previous=null;
|
||||
|
||||
this.server=server;
|
||||
|
||||
/* --- Main program, this gets things going ----------------------------- */
|
||||
with(this) {
|
||||
if(server.grammar_list) show_grammarlist(server.grammar_list);
|
||||
else server.get_grammarlist(bind(show_grammarlist,this));
|
||||
}
|
||||
}
|
||||
|
||||
/* --- Auxiliary functions ---------------------------------------------- */
|
||||
|
||||
|
||||
Minibar.prototype.show_grammarlist=function(grammars) {
|
||||
debug(this)
|
||||
with(this) {
|
||||
//debug("show_grammarlist ")
|
||||
menubar.innerHTML="";
|
||||
if(grammars.length>1) {
|
||||
function opt(g) { return option(g,g); }
|
||||
appendChildren(grammar_menu,map(opt,grammars));
|
||||
grammar_menu.onchange=
|
||||
bind(function() { select_grammar(grammar_menu.value); },this);
|
||||
appendChildren(menubar,[text("Grammar: "),grammar_menu]);
|
||||
}
|
||||
//modified for quiz
|
||||
appendChildren(menubar,
|
||||
[text(" From: "), from_menu,
|
||||
text(" To: "), to_menu]);
|
||||
//modified for quiz
|
||||
appendChildren(minibar_buttons,
|
||||
[button(options.delete_button_text,bind(delete_last,this),"H"),
|
||||
button("Clear",bind(clear_all,this),"L")]);
|
||||
|
||||
if(options.random_button)
|
||||
menubar.appendChild(button("Random",bind(generate_random,this),"R"));
|
||||
if(options.help_url)
|
||||
menubar.appendChild(button("Help",bind(open_help,this)));
|
||||
|
||||
select_grammar(grammars[0]);
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.select_grammar=function(grammar_name) {
|
||||
var t=this;
|
||||
//debug("select_grammar ");
|
||||
function get_languages() {
|
||||
t.server.get_languages(bind(t.show_languages,t));
|
||||
}
|
||||
t.server.switch_grammar(grammar_name,get_languages);
|
||||
}
|
||||
|
||||
Minibar.prototype.show_languages=function(grammar_info) {
|
||||
var t=this;
|
||||
with(t) {
|
||||
//debug("show_languages ");
|
||||
grammar=grammar_info;
|
||||
|
||||
var new_language=function () {
|
||||
current.from=from_menu.value;
|
||||
|
||||
//modified for quiz
|
||||
//clear_all();
|
||||
}
|
||||
|
||||
//added for quiz
|
||||
var change_tolang=function () {
|
||||
current.to=to_menu.value;
|
||||
|
||||
//var langname = element("to_menu").value;
|
||||
//to_menu.current={to: langname, input: ""};
|
||||
clear_all();
|
||||
}
|
||||
|
||||
from_menu.onchange=bind(new_language,t);
|
||||
update_language_menu(from_menu,grammar);
|
||||
set_initial_language(options,from_menu,grammar);
|
||||
|
||||
//modified and added for quiz
|
||||
//to_menu.onchange=bind(get_translations,t);
|
||||
to_menu.onchange=bind(change_tolang,t);
|
||||
|
||||
update_language_menu(to_menu,grammar);
|
||||
|
||||
//modified for quiz
|
||||
//insertFirst(to_menu,option("All","All"));
|
||||
//to_menu.value="All";
|
||||
|
||||
new_language();
|
||||
|
||||
//added for quiz
|
||||
change_tolang();
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.clear_all1=function() {
|
||||
with(this) {
|
||||
remove_typed_input();
|
||||
current.input="";
|
||||
previous=null;
|
||||
surface.innerHTML="";
|
||||
translations.innerHTML="";
|
||||
}
|
||||
|
||||
//added for quiz
|
||||
document.answer.answer_text.value = "";
|
||||
document.explanation.explanation_text.value= "";
|
||||
document.getElementById("hint_txt").innerHTML = "";
|
||||
}
|
||||
|
||||
Minibar.prototype.clear_all=function() {
|
||||
with(this) {
|
||||
clear_all1();
|
||||
get_completions();
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.get_completions=function() {
|
||||
|
||||
with(this) {
|
||||
//debug("get_completions ");
|
||||
words.innerHTML="...";
|
||||
|
||||
//modified for quiz
|
||||
server.complete(current.to,current.input,bind(show_completions,this));
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.show_completions=function(complete_output) {
|
||||
with(this) {
|
||||
//debug("show_completions ");
|
||||
var completions=complete_output[0].completions;
|
||||
var emptycnt=add_completions(completions)
|
||||
if(true/*emptycnt>0*/) get_translations();
|
||||
else translations.innerHTML="";
|
||||
if(surface.typed && emptycnt==completions.length) {
|
||||
if(surface.typed.value=="") remove_typed_input();
|
||||
}
|
||||
else add_typed_input();
|
||||
}
|
||||
|
||||
//added for quiz :updates the hint and prevents the check_notEmpty alert in show_hint when all words are deleted
|
||||
if (!(document.answer.answer_text.value == null || document.answer.answer_text.value ==""))
|
||||
{ if (hint_times > 0 && hint_times < max_hint_times)
|
||||
show_hint();
|
||||
}
|
||||
else
|
||||
document.getElementById("hint_txt").innerHTML = "";
|
||||
}
|
||||
|
||||
Minibar.prototype.add_completions=function(completions) {
|
||||
with(this) {
|
||||
if(words.timeout) clearTimeout(words.timeout),words.timeout=null;
|
||||
words.innerHTML="";
|
||||
words.completions=completions;
|
||||
words.word=[];
|
||||
var t=surface.typed ? surface.typed.value : "";
|
||||
var emptycnt=0;
|
||||
for(var i=0;i<completions.length;i++) {
|
||||
var s=completions[i];
|
||||
if(s.length>0) {
|
||||
var w=word(s);
|
||||
words.appendChild(w);
|
||||
words.word[i]=w;
|
||||
}
|
||||
else emptycnt++;
|
||||
}
|
||||
filter_completions(t,true);
|
||||
return emptycnt;
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.filter_completions=function(t,dim) {
|
||||
with(this) {
|
||||
if(words.timeout) clearTimeout(words.timeout),words.timeout=null;
|
||||
words.filtered=t;
|
||||
//if(dim) debug('filter "'+t+'"');
|
||||
var w=words.word;
|
||||
words.count=0;
|
||||
var dimmed=0;
|
||||
var prefix=""; // longest common prefix, for completion
|
||||
for(var i=0;i<w.length;i++) {
|
||||
var s=words.completions[i];
|
||||
var keep=hasPrefix(s,t);
|
||||
if(keep) {
|
||||
if(words.count==0) prefix=s;
|
||||
else prefix=(commonPrefix(prefix,s));
|
||||
words.count++;
|
||||
}
|
||||
if(dim) {
|
||||
w[i].style.opacity= keep ? "1" : "0.5";
|
||||
if(keep) w[i].style.display="inline";
|
||||
else dimmed++;
|
||||
}
|
||||
else
|
||||
w[i].style.display=keep ? "inline" : "none";
|
||||
}
|
||||
words.theword=prefix;
|
||||
if(dimmed>0)
|
||||
words.timeout=setTimeout(function(){ filter_completions(t,false)},1000);
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.get_translations=function() {
|
||||
with(this) {
|
||||
var c=current;
|
||||
if(options.show_grouped_translations)
|
||||
server.translategroup(c.from,c.input,bind(show_groupedtranslations,this));
|
||||
else
|
||||
server.translate(c.from,c.input,bind(show_translations,this));
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.target_lang=function() {
|
||||
with(this) return langpart(to_menu.value,grammar.name);
|
||||
}
|
||||
|
||||
Minibar.prototype.add_typed_input=function() {
|
||||
with(this) {
|
||||
var inp;
|
||||
if(surface.typed) inp=surface.typed;
|
||||
else {
|
||||
inp=empty("input","type","text");
|
||||
inp.value="";
|
||||
inp.setAttribute("accesskey","t");
|
||||
inp.style.width="10em";
|
||||
inp.onkeyup=bind(complete_typed,this);
|
||||
surface.appendChild(inp);
|
||||
surface.typed=inp;
|
||||
}
|
||||
inp.focus();
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.remove_typed_input=function() {
|
||||
with(this) {
|
||||
if(surface.typed) {
|
||||
surface.typed.parentNode.removeChild(surface.typed);
|
||||
surface.typed=null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.complete_typed=function(event) {
|
||||
with(this) {
|
||||
//element("debug").innerHTML=show_props(event,"event");
|
||||
var inp=surface.typed;
|
||||
//debug('"'+inp.value+'"');
|
||||
var s=inp.value;
|
||||
var ws=s.split(" ");
|
||||
if(ws.length>1 || event.keyCode==13) {
|
||||
if(ws[0]!=words.filtered) filter_completions(ws[0],true);
|
||||
if(words.count==1) add_word(words.theword);
|
||||
else if(elem(ws[0],words.completions)) add_word(ws[0]);
|
||||
else if(words.theword.length>ws[0].length) inp.value=words.theword;
|
||||
}
|
||||
else if(s!=words.filtered) filter_completions(s,true)
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.generate_random=function() {
|
||||
var t=this;
|
||||
function show_random(random) {
|
||||
t.clear_all1();
|
||||
t.add_words(random[0].text);
|
||||
}
|
||||
|
||||
function lin_random(abs) {
|
||||
t.server.linearize(abs[0].tree,t.current.from,show_random);
|
||||
}
|
||||
t.server.get_random(lin_random);
|
||||
}
|
||||
|
||||
Minibar.prototype.add_words=function(s) {
|
||||
with(this) {
|
||||
var ws=s.split(" ");
|
||||
for(var i=0;i<ws.length;i++)
|
||||
add_word1(ws[i]+" ");
|
||||
get_completions();
|
||||
}
|
||||
//added for quiz
|
||||
document.answer.answer_text.value += s+" ";
|
||||
}
|
||||
|
||||
Minibar.prototype.word=function(s) {
|
||||
var t=this;
|
||||
function click_word() {
|
||||
if(t.surface.typed) t.surface.typed.value="";
|
||||
t.add_word(s);
|
||||
}
|
||||
return button(s,click_word);
|
||||
}
|
||||
|
||||
Minibar.prototype.add_word=function(s) {
|
||||
with(this) {
|
||||
add_word1(s+" ");
|
||||
if(surface.typed) {
|
||||
var s2;
|
||||
if(hasPrefix(s2=surface.typed.value,s)) {
|
||||
s2=s2.substr(s.length);
|
||||
while(s2.length>0 && s2[0]==" ") s2=s2.substr(1);
|
||||
surface.typed.value=s2;
|
||||
}
|
||||
else surface.typed.value="";
|
||||
}
|
||||
get_completions();
|
||||
}
|
||||
|
||||
//added for quiz
|
||||
document.answer.answer_text.value += s+" ";
|
||||
}
|
||||
|
||||
Minibar.prototype.add_word1=function(s) {
|
||||
with(this) {
|
||||
previous={ input: current.input, previous: previous };
|
||||
current.input+=s;
|
||||
var w=span_class("word",text(s));
|
||||
if(surface.typed) surface.insertBefore(w,surface.typed);
|
||||
else surface.appendChild(w);
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.delete_last=function() {
|
||||
with(this) {
|
||||
if(surface.typed && surface.typed.value!="")
|
||||
surface.typed.value="";
|
||||
else if(previous) {
|
||||
current.input=previous.input;
|
||||
previous=previous.previous;
|
||||
if(surface.typed) {
|
||||
surface.removeChild(surface.typed.previousSibling);
|
||||
surface.typed.focus();
|
||||
}
|
||||
else surface.removeChild(surface.lastChild);
|
||||
translations.innerHTML="";
|
||||
|
||||
//added for quiz (to update the user answer area)
|
||||
var last_answer= document.answer.answer_text.value ;
|
||||
document.answer.answer_text.value = remove_last(last_answer);
|
||||
|
||||
get_completions();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//added for quiz
|
||||
function remove_last(txt){
|
||||
var str = remove_unwanted_characters(txt);
|
||||
var ls= str.lastIndexOf(" ");
|
||||
if (ls > -1)
|
||||
return str.substring(0,ls ) + " ";
|
||||
else
|
||||
return "";
|
||||
}
|
||||
|
||||
Minibar.prototype.tdt=function(tree_btn,txt) {
|
||||
with(this) {
|
||||
return options.show_trees ? tda([tree_btn,txt]) : td(txt);
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.show_translations=function(translationResults) {
|
||||
with(this) {
|
||||
var trans=translations;
|
||||
//var to=target_lang(); // wrong
|
||||
var to=to_menu.value;
|
||||
var cnt=translationResults.length;
|
||||
//trans.translations=translations;
|
||||
trans.single_translation=[];
|
||||
trans.innerHTML="";
|
||||
/*
|
||||
trans.appendChild(wrap("h3",text(cnt<1 ? "No translations?" :
|
||||
cnt>1 ? ""+cnt+" translations:":
|
||||
"One translation:")));
|
||||
*/
|
||||
for(p=0;p<cnt;p++) {
|
||||
var tra=translationResults[p];
|
||||
if (tra.translations != null) {
|
||||
for (q = 0; q < tra.translations.length; q++) {
|
||||
var t = tra.translations[q];
|
||||
var lin=t.linearizations;
|
||||
var tbody=empty("tbody");
|
||||
if(options.show_abstract && t.tree)
|
||||
tbody.appendChild(tr([th(text("Abstract: ")),
|
||||
tdt(abstree_button(t.tree),text(" "+t.tree))]));
|
||||
for(var i=0;i<lin.length;i++)
|
||||
if(to=="All" || lin[i].to==to)
|
||||
tbody.appendChild(tr([th(text(langpart(lin[i].to,grammar.name)+": ")),
|
||||
tdt(parsetree_button(t.tree,lin[i].to),
|
||||
text(lin[i].text))]));
|
||||
trans.appendChild(wrap("table",tbody));
|
||||
}
|
||||
}
|
||||
else if(tra.typeErrors) {
|
||||
var errs=tra.typeErrors;
|
||||
for(var i=0;i<errs.length;i++)
|
||||
trans.appendChild(wrap("pre",text(errs[i].msg)))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.show_groupedtranslations=function(translationsResult) {
|
||||
with(this) {
|
||||
var trans=translations;
|
||||
var to=target_lang();
|
||||
//var to=to_menu.value // wrong
|
||||
var cnt=translationsResult.length;
|
||||
//trans.translations=translationsResult;
|
||||
trans.single_translation=[];
|
||||
trans.innerHTML="";
|
||||
for(p=0;p<cnt;p++) {
|
||||
var t=translationsResult[p];
|
||||
if(to=="All" || t.to==to) {
|
||||
var lin=t.linearizations;
|
||||
var tbody=empty("tbody");
|
||||
if(to=="All") tbody.appendChild(tr([th(text(t.to+":"))]));
|
||||
for(var i=0;i<lin.length;i++) {
|
||||
if(to!="All") trans.single_translation[i]=lin[i].text;
|
||||
tbody.appendChild(tr([td(text(lin[i].text))]));
|
||||
if (lin.length > 1) tbody.appendChild(tr([td(text(lin[i].tree))]));
|
||||
}
|
||||
trans.appendChild(wrap("table",tbody));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.append_extra_buttons=function(extra,options) {
|
||||
with(this) {
|
||||
if(options.try_google)
|
||||
extra.appendChild(button("Try Google Translate",bind(try_google,this)));
|
||||
if(options.feedback_url)
|
||||
appendChildren(extra,[text(" "),button("Feedback",bind(open_feedback,this))]);
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.try_google=function() {
|
||||
with(this) {
|
||||
var to=target_lang();
|
||||
var s=current.input;
|
||||
if(surface.typed) s+=surface.typed.value;
|
||||
var url="http://translate.google.com/?sl="
|
||||
+langpart(current.from,grammar.name);
|
||||
if(to!="All") url+="&tl="+to;
|
||||
url+="&q="+encodeURIComponent(s);
|
||||
window.open(url);
|
||||
}
|
||||
}
|
||||
|
||||
Minibar.prototype.open_help=function() {
|
||||
with(this) open_popup(options.help_url,"help");
|
||||
}
|
||||
|
||||
Minibar.prototype.open_feedback=function() {
|
||||
with(this) {
|
||||
// make the minibar state easily accessible from the feedback page:
|
||||
minibar.state={grammar:grammar,current:current,to:to_menu.value,
|
||||
translations:translations};
|
||||
open_popup(options.feedback_url,'feedback');
|
||||
}
|
||||
}
|
||||
|
||||
function update_language_menu(menu,grammar) {
|
||||
// Replace the options in the menu with the languages in the grammar
|
||||
var lang=grammar.languages;
|
||||
menu.innerHTML="";
|
||||
|
||||
for(var i=0; i<lang.length; i++) {
|
||||
var ln=lang[i].name;
|
||||
if(!hasPrefix(ln,"Disamb")) {
|
||||
var lp=langpart(ln,grammar.name);
|
||||
menu.appendChild(option(lp,ln));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function set_initial_language(options,menu,grammar) {
|
||||
if(grammar.userLanguage) menu.value=grammar.userLanguage;
|
||||
else if(options.default_source_language) {
|
||||
for(var i=0;i<menu.options.length;i++) {
|
||||
var o=menu.options[i].value;
|
||||
var l=langpart(o,grammar.name);
|
||||
if(l==options.default_source_language) menu.value=o;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function langpart(conc,abs) { // langpart("FoodsEng","Foods") == "Eng"
|
||||
return hasPrefix(conc,abs) ? conc.substr(abs.length) : conc;
|
||||
}
|
||||
|
||||
function abstree_button(abs) {
|
||||
var i=img(tree_icon);
|
||||
i.setAttribute("onclick","toggle_img(this)");
|
||||
i.other=server.current_grammar_url+"?command=abstrtree&tree="+encodeURIComponent(abs);
|
||||
return i;
|
||||
}
|
||||
|
||||
function parsetree_button(abs,lang) {
|
||||
var i=img(tree_icon);
|
||||
i.setAttribute("onclick","toggle_img(this)");
|
||||
i.other=server.current_grammar_url
|
||||
+"?command=parsetree&from="+lang+"&tree="+encodeURIComponent(abs);
|
||||
return i;
|
||||
}
|
||||
|
||||
function toggle_img(i) {
|
||||
var tmp=i.src;
|
||||
i.src=i.other;
|
||||
i.other=tmp;
|
||||
}
|
||||
|
||||
function open_popup(url,target) {
|
||||
var w=window.open(url,target,'toolbar=no,location=no,status=no,menubar=no');
|
||||
w.focus();
|
||||
}
|
||||
|
||||
function setField(form,name,value) {
|
||||
form[name].value=value;
|
||||
var el=element(name);
|
||||
if(el) el.innerHTML=value;
|
||||
}
|
||||
|
||||
function opener_element(id) { with(window.opener) return element(id); }
|
||||
|
||||
// This function is called from feedback.html
|
||||
function prefill_feedback_form() {
|
||||
var state=opener_element("minibar").state;
|
||||
var trans=state.translations;
|
||||
var gn=state.grammar.name
|
||||
var to=langpart(state.to,gn);
|
||||
|
||||
var form=document.forms.namedItem("feedback");
|
||||
setField(form,"grammar",gn);
|
||||
setField(form,"from",langpart(state.current.from,gn));
|
||||
setField(form,"input",state.current.input);
|
||||
setField(form,"to",to);
|
||||
if(to=="All") element("translation_box").style.display="none";
|
||||
else setField(form,"translation",trans.single_translation.join(" / "));
|
||||
|
||||
// Browser info:
|
||||
form["inner_size"].value=window.innerWidth+"×"+window.innerHeight;
|
||||
form["outer_size"].value=window.outerWidth+"×"+window.outerHeight;
|
||||
form["screen_size"].value=screen.width+"×"+screen.height;
|
||||
form["available_screen_size"].value=screen.availWidth+"×"+screen.availHeight;
|
||||
form["color_depth"].value=screen.colorDepth;
|
||||
form["pixel_depth"].value=screen.pixelDepth;
|
||||
|
||||
window.focus();
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
se.chalmers.cs.gf.gwt.TranslateApp/align-btn.png
|
||||
|
||||
GET /grammars/Foods.pgf?&command=abstrtree&tree=Pred+(This+Fish)+(Very+Fresh)
|
||||
GET /grammars/Foods.pgf?&command=parsetree&tree=Pred+(This+Fish)+Expensive&from=FoodsAfr
|
||||
GET /grammars/Foods.pgf?&command=alignment&tree=Pred+(This+Fish)+Expensive
|
||||
*/
|
||||
56
demos/TransQuiz/pgf_online.js
Normal file
56
demos/TransQuiz/pgf_online.js
Normal file
@@ -0,0 +1,56 @@
|
||||
|
||||
/* --- Grammar access object ------------------------------------------------ */
|
||||
|
||||
function pgf_online(options) {
|
||||
var server = {
|
||||
// State variables (private):
|
||||
grammars_url: "/grammars/",
|
||||
grammar_list: null,
|
||||
current_grammar_url: null,
|
||||
|
||||
// Methods:
|
||||
switch_grammar: function(grammar_url,cont) {
|
||||
this.current_grammar_url=this.grammars_url+grammar_url;
|
||||
if(cont) cont();
|
||||
},
|
||||
get_grammarlist: function(cont) {
|
||||
http_get_json(this.grammars_url+"grammars.cgi",cont);
|
||||
},
|
||||
pgf_call: function(cmd,args,cont) {
|
||||
var url=this.current_grammar_url+"?command="+cmd;
|
||||
for(var arg in args) url+="&"+arg+"="+encodeURIComponent(args[arg]);
|
||||
http_get_json(url,cont);
|
||||
},
|
||||
|
||||
get_languages: function(cont) {
|
||||
this.pgf_call("grammar",{},cont);
|
||||
},
|
||||
|
||||
get_random: function(cont) {
|
||||
this.pgf_call("random",{random:Math.random()},cont);
|
||||
},
|
||||
linearize: function(tree,to,cont) {
|
||||
this.pgf_call("linearize",{tree:tree,to:to},cont);
|
||||
},
|
||||
linearizeAll: function(tree,to,cont) {
|
||||
this.pgf_call("linearizeAll",{tree:tree,to:to},cont);
|
||||
},
|
||||
complete: function(from,input,cont) {
|
||||
this.pgf_call("complete",{from:from,input:input},cont);
|
||||
},
|
||||
parse: function(from,input,cont) {
|
||||
this.pgf_call("parse",{from:from,input:input},cont);
|
||||
},
|
||||
translate: function(from,input,cont) {
|
||||
this.pgf_call("translate",{from:from,input:input},cont);
|
||||
},
|
||||
translategroup: function(from,input,cont) {
|
||||
this.pgf_call("translategroup",{from:from,input:input},cont);
|
||||
}
|
||||
|
||||
};
|
||||
for(var o in options) server[o]=options[o];
|
||||
if(server.grammar_list && server.grammar_list.length>0)
|
||||
server.switch_grammar(server.grammar_list[0]);
|
||||
return server;
|
||||
}
|
||||
49
demos/TransQuiz/quiz_about.html
Normal file
49
demos/TransQuiz/quiz_about.html
Normal file
@@ -0,0 +1,49 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>Quiz About</title>
|
||||
<link rel=stylesheet type="text/css" href="minibar_quiz.css">
|
||||
|
||||
<meta name = "viewport" content = "width = device-width">
|
||||
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
|
||||
<meta charset="UTF-8">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h3>About GF Translation Quiz </h3>
|
||||
|
||||
<p style="font-size:18px;">
|
||||
This project is actually part of my master thesis work at <a href="http://chalmers.se/en/Pages/default.aspx" >Chalmers University of Technology</a>
|
||||
, in the Language Technology group under supervision of Professor <a href="http://www.cse.chalmers.se/~aarne/">Aarne Ranta.</a> The application
|
||||
is an exercise generator to be used in training the lexical, morphological and syntactic aspects of human languages.
|
||||
One important aspect of this application is that it is intended to be as general as possible and specially not
|
||||
to be limited to any specific human language. For this purpose GF’s (The <a href="http://www.grammaticalframework.org/" >Grammatical Framework </a>)
|
||||
Resource Grammar Libraries have been applied as the constructive core of the project. The application also uses the
|
||||
<a href="http://code.google.com/p/grammatical-framework/wiki/GFWebServiceAPI" >GF web services API </a>
|
||||
which has made it possible to apply the PGF API as Web Service, to be more precise the Quiz uses the additional API for JavaScript defined in pgf_online.js provided by the
|
||||
<a href="http://www.grammaticalframework.org:41296/minibar/minibar.html"> Minibar </a> application.
|
||||
The Quiz also relies on the Minibar,
|
||||
in the "Easy Study Mode" of the Quiz, where word magnets from the Minibar are available to help the user construct his/her answer.
|
||||
</p>
|
||||
<p style="font-size:18px;"> The generated exercises are in the preliminary form of sentences
|
||||
in a certain language - selected by the user - which need to be translated to another one - which is also the user's choice.
|
||||
The user may choose the grammar he/she wants to train with as well. More information about how the quiz works can be found from the
|
||||
<a href="quiz_help.html" >link </a> in the Quiz main page.
|
||||
|
||||
</p>
|
||||
|
||||
<br/>
|
||||
Author: <i><b> Elnaz Abolahrar </b></i> (elnaz dot abolahrar at gmail dot com)
|
||||
<br/>
|
||||
Date: December, 2010 - Göteborg, Sweden
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
<br/>
|
||||
<div class="shift_left"><a href="javascript: window.close()">Close page</a></div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
45
demos/TransQuiz/quiz_help.html
Normal file
45
demos/TransQuiz/quiz_help.html
Normal file
@@ -0,0 +1,45 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>Quiz Help</title>
|
||||
<link rel=stylesheet type="text/css" href="minibar_quiz.css">
|
||||
|
||||
<meta name = "viewport" content = "width = device-width">
|
||||
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
|
||||
<meta charset="UTF-8">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a href="quiz_about.html" >About GF Translation Quiz </a>
|
||||
|
||||
<h3>• How the Quiz works? </h3>
|
||||
|
||||
<p style="font-size:18px;">
|
||||
<b>Hint:</b> You will find the Hint button very handy in all quiz modes. In fact it works very much similar to the famous <a href="http://en.wikipedia.org/wiki/Mastermind_(board_game)">Mastermind</a> game. Words in green stand for correct words in their correct place in the sentence, and yellow words mean these words are correct words and are part of the right answer but they are misplaced, while red words stand for words which do not exist in the right answer and are either misspelled or totally wrong lexically or grammatically.
|
||||
<br/><br/>
|
||||
<b>Check Answer:</b> You can check whether your answer is right by either clicking on this button or pressing the Enter/Return key of your keyboard. (Exception: In the "Easy Study Mode" you cannot use the Enter/Return key for checking your answer, because it has another functionality which is adding typed words to your answer.) Please note that by checking your answer you also submit it, and for each question you have only one submission chance to increase your score - further submissions don't have any impact on your score. Use the Hint if you are not sure and of course if it is available. Also note that Check Answer moves you automatically to the next question if your answer is right.
|
||||
<br/><br/>
|
||||
<b>History:</b> At the end of the quiz, either if you end it manually by pressing the "End" button or when the quiz ends itself e.g. when you pass the quiz or at the end of an exam, you will get a "Show Quiz History" button by which you may review and print the whole questions together with your answers and the programs' feedback.
|
||||
</p>
|
||||
<hr>
|
||||
|
||||
<h3>• How different are different Quiz Modes? </h3>
|
||||
|
||||
<p style="font-size:18px;"> <b>Easy Study Mode: </b>
|
||||
In this mode word magnets are available to help you; you can type and/or click on them freely to construct your answer. Use "⌫" (Delete last) <!--img border="0" src="Delete_button.jpg" alt="⌫" width="30" height="17" /--> and "Clear" buttons to delete the last word or all of your answer in case required. Theses words come from the grammar you have chosen, and therefore it keeps you from mistyping words and even making grammatically wrong sentences. Also you have unlimited Hint which is automatically updated as you modify your answer. You can also go to one previous question at a time and of course check your answer's correctness.
|
||||
<br/><br/><b>Medium Study Mode: </b>
|
||||
In this mode you can use the Hint button for a maximum of 3 times for each question, and you have the possibility of going to one previous question at a time as well as checking your answer's correctness.
|
||||
<br/><br/><b>Hard Study Mode: </b>
|
||||
In this mode you can use the Hint button only once for each question, and you may not use the Previous question button however you may check your answer's correctness.
|
||||
<br/><br/><b>Exam Mode: </b>
|
||||
In this mode you cannot use the Hint, Previous question or Check answer buttons, and you will not see your score until the end of the exam.
|
||||
</p>
|
||||
|
||||
<br/>
|
||||
<div class="shift_left"><a href="javascript: window.close()">Close page</a></div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
63
demos/TransQuiz/quiz_pre_start.js
Normal file
63
demos/TransQuiz/quiz_pre_start.js
Normal file
@@ -0,0 +1,63 @@
|
||||
// pre_start: runs on load time before evrything else to prepare the quiz
|
||||
|
||||
function pre_start()
|
||||
{
|
||||
hide_element('history_part');
|
||||
hide_element('toggle_show');
|
||||
|
||||
default_values();
|
||||
|
||||
var quiz_mode=empty_id("select","quiz_mode");
|
||||
|
||||
//adds the "Quiz Mode" and "Restart Quiz" and "End Quiz" and "Start Quiz"
|
||||
appendChildren(minibar.menubar,
|
||||
[empty("br"),
|
||||
text(" Quiz Mode: "), quiz_mode,
|
||||
button("Restart Quiz","restart_quiz()","R"),
|
||||
button("End Quiz","end_quiz(true)","E"),
|
||||
button("Start Quiz","start_quiz()","S")]);
|
||||
|
||||
|
||||
//adds the "Next Question" and "Previous Question" and "Hint" and "Check Answer" buttons
|
||||
var buttons_bar=element("buttons_bar");
|
||||
appendChildren(buttons_bar,
|
||||
[button("< Previous Question","previous_question_quiz()","B", "previous_question"),
|
||||
button("Next Question >","generate_question()","N", "next_question"),
|
||||
button("Hint","show_hint()","H", "hint"),
|
||||
submit_button("Check Answer", "check_answer")]);
|
||||
|
||||
disable_all();
|
||||
|
||||
//hide the minibar word magnets
|
||||
hide_element('minibar_contin');
|
||||
|
||||
//hide the delete and clear buttons
|
||||
hide_element('minibar_buttons');
|
||||
|
||||
mode_options(quiz_mode);
|
||||
}
|
||||
|
||||
|
||||
function mode_options(quiz_mode)
|
||||
{
|
||||
var opt=empty("option");
|
||||
opt.setAttribute("value","Easy Study Mode");
|
||||
opt.innerHTML="Easy Study Mode";
|
||||
quiz_mode.appendChild(opt);
|
||||
|
||||
var opt=empty("option");
|
||||
opt.setAttribute("value","Medium Study Mode");
|
||||
opt.innerHTML="Medium Study Mode";
|
||||
quiz_mode.appendChild(opt);
|
||||
|
||||
var opt=empty("option");
|
||||
opt.setAttribute("value","Hard Study Mode");
|
||||
opt.innerHTML="Hard Study Mode";
|
||||
quiz_mode.appendChild(opt);
|
||||
|
||||
var opt=empty("option");
|
||||
opt.setAttribute("value","Exam Mode");
|
||||
opt.innerHTML="Exam Mode";
|
||||
quiz_mode.appendChild(opt);
|
||||
}
|
||||
|
||||
247
demos/TransQuiz/quiz_support.js
Normal file
247
demos/TransQuiz/quiz_support.js
Normal file
@@ -0,0 +1,247 @@
|
||||
|
||||
function hide_element(elem_id)
|
||||
{
|
||||
document.getElementById(elem_id).style.display="none";
|
||||
}
|
||||
|
||||
function show_element(elem_id)
|
||||
{
|
||||
document.getElementById(elem_id).style.display="";
|
||||
}
|
||||
|
||||
function toggle_info()
|
||||
{
|
||||
if ( info_hidden == true )
|
||||
{
|
||||
show_element("info");
|
||||
hide_element("toggle_show");
|
||||
show_element("toggle_hide");
|
||||
info_hidden = false;
|
||||
}
|
||||
else
|
||||
{
|
||||
hide_element("info");
|
||||
show_element("toggle_show");
|
||||
hide_element("toggle_hide");
|
||||
info_hidden = true;
|
||||
}
|
||||
}
|
||||
|
||||
function show_word_magnets()
|
||||
{
|
||||
if ( words_hidden == true )
|
||||
{
|
||||
show_element("words");
|
||||
words_hidden= false;
|
||||
var buttons_bar=element("buttons_bar")
|
||||
buttons_bar.removeChild(buttons_bar.lastChild);
|
||||
}
|
||||
}
|
||||
|
||||
function hide_word_magnets()
|
||||
{
|
||||
if ( words_hidden == false )
|
||||
{
|
||||
hide_element("words");
|
||||
words_hidden= true;
|
||||
|
||||
//add "Show magnets" button
|
||||
var buttons_bar=element("buttons_bar")
|
||||
appendChildren(buttons_bar,
|
||||
[ button("Show Magnets","show_word_magnets()","M", "show_magnets")]);
|
||||
}
|
||||
}
|
||||
|
||||
function popUp(newPage, pageName)
|
||||
{
|
||||
window.open(newPage, pageName, "dependent = 1, scrollbars=1, location=1, statusbar=1, width=540, height=650, left = 10, top = 20");
|
||||
}
|
||||
|
||||
|
||||
function disable_all()
|
||||
{
|
||||
//disables the "Hint", "Check Answer", "Next Question" and "Previous Question" buttons + user answer area
|
||||
document.getElementById('check_answer').disabled = true;
|
||||
document.getElementById('next_question').disabled = true;
|
||||
document.getElementById('previous_question').disabled = true;
|
||||
document.getElementById('hint').disabled = true;
|
||||
document.getElementById('user_answer').disabled = true;
|
||||
}
|
||||
|
||||
function set_mode()
|
||||
{
|
||||
//disable the grammar - To - From languages, and mode menubar
|
||||
document.getElementById('grammar_menu').disabled = true;
|
||||
document.getElementById('from_menu').disabled = true;
|
||||
document.getElementById('to_menu').disabled = true;
|
||||
document.getElementById('quiz_mode').disabled = true;
|
||||
|
||||
|
||||
selected_mode = element("quiz_mode").value;
|
||||
|
||||
//sets the Quiz mode displayed
|
||||
document.getElementById('mode').value = selected_mode;
|
||||
|
||||
/*-------------------------------------- Modes Settings --------------------------------------*/
|
||||
switch (selected_mode)
|
||||
{
|
||||
case "Easy Study Mode":
|
||||
have_minibar = true;
|
||||
have_prevQuestion = true;
|
||||
have_checkAns = true;
|
||||
max_hint_times = 100;
|
||||
break;
|
||||
|
||||
case "Medium Study Mode":
|
||||
have_minibar = false;
|
||||
have_prevQuestion = true;
|
||||
have_checkAns = true;
|
||||
max_hint_times = 3;
|
||||
break;
|
||||
|
||||
case "Hard Study Mode":
|
||||
have_minibar = false;
|
||||
have_prevQuestion = false;
|
||||
have_checkAns = true;
|
||||
max_hint_times = 1;
|
||||
break;
|
||||
|
||||
case "Exam Mode":
|
||||
have_minibar = false;
|
||||
have_prevQuestion = false;
|
||||
have_checkAns = false;
|
||||
max_hint_times = 0;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function reset_mode()
|
||||
{
|
||||
//enable the grammar - To - From languages, and mode menubar
|
||||
document.getElementById('grammar_menu').disabled = false;
|
||||
document.getElementById('from_menu').disabled = false;
|
||||
document.getElementById('to_menu').disabled = false;
|
||||
document.getElementById('quiz_mode').disabled = false;
|
||||
|
||||
//clears the Quiz mode displayed
|
||||
document.getElementById('mode').value = "";
|
||||
}
|
||||
|
||||
function remove_minibar()
|
||||
{
|
||||
if (have_minibar && is_ended == false )
|
||||
{
|
||||
//hide the minibar word magnets
|
||||
hide_element("minibar_contin");
|
||||
|
||||
//hide the delete and clear buttons
|
||||
hide_element("minibar_buttons");
|
||||
}
|
||||
}
|
||||
|
||||
function remove_unwanted_characters(txt)
|
||||
{
|
||||
//removes digits, special characters and extra spaces from user's answer
|
||||
txt = txt.replace(/[\u0021-\u0026 \u0028-\u0040 \u005b-\u0060 \u007b-\u007e]+/g,' ').replace(/^\s+|\s+$/g,'').replace(/\s+/g,' ');
|
||||
|
||||
//changes the first character to lowercase
|
||||
txt= txt.replace(txt.charAt(0),txt.charAt(0).toLowerCase());
|
||||
|
||||
return txt;
|
||||
}
|
||||
|
||||
function split_to_words(str)
|
||||
{
|
||||
if (!(str == "" || str == null))
|
||||
str = str.split(" ");
|
||||
else
|
||||
str = "";
|
||||
|
||||
return str;
|
||||
}
|
||||
|
||||
function string_matching(serv_answer,use_answer)
|
||||
{
|
||||
var result = new Array();
|
||||
|
||||
//for empty answers
|
||||
if ( use_answer== "" || use_answer== null)
|
||||
result= "";
|
||||
else
|
||||
{
|
||||
var min_length = Math.min(serv_answer.length, use_answer.length);
|
||||
|
||||
var i=0;
|
||||
for (i= 0; i < min_length; i++)
|
||||
{
|
||||
if (serv_answer[i] == use_answer[i])
|
||||
result[i] = 1;
|
||||
else
|
||||
result[i] = 0;
|
||||
}
|
||||
//for answers with extra words (more than the number of words in the right answer)
|
||||
while ( i < use_answer.length)
|
||||
{
|
||||
result[i] = 0;
|
||||
i++;
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
function sum_all(arr) {
|
||||
var s = 0;
|
||||
for (var i = 0; i < arr.length; i++)
|
||||
{
|
||||
s += arr[i];
|
||||
}
|
||||
return s;
|
||||
}
|
||||
|
||||
function find_closest(all_ans)
|
||||
{
|
||||
var best_match = new Array();
|
||||
var comp = new Array();
|
||||
var server_answer2 = new Array();
|
||||
var max=0;
|
||||
var k = 0;
|
||||
for (k= 0; k < all_ans.length; k++)
|
||||
{
|
||||
server_answer = remove_unwanted_characters(all_ans[k]);
|
||||
server_answer2 = split_to_words(server_answer);
|
||||
|
||||
comp = string_matching(server_answer2, user_answer_splited);
|
||||
var sum = sum_all(comp);
|
||||
if (sum >= max)
|
||||
{
|
||||
best_match = server_answer2;
|
||||
max= sum;
|
||||
}
|
||||
}
|
||||
return best_match;
|
||||
}
|
||||
|
||||
function clearing()
|
||||
{
|
||||
//clears the question, answer and the explanation and hint display areas
|
||||
document.question.question_text.value= "...";
|
||||
document.answer.answer_text.value = "";
|
||||
document.explanation.explanation_text.value= "";
|
||||
document.getElementById("hint_txt").innerHTML = "";
|
||||
}
|
||||
|
||||
//checks that the answer field is not empty
|
||||
function check_notEmpty()
|
||||
{
|
||||
if (document.answer.answer_text.value == null || document.answer.answer_text.value =="")
|
||||
{
|
||||
alert(" You have to write something first!");
|
||||
//sets the focus on the answer area
|
||||
document.answer.answer_text.focus();
|
||||
|
||||
return false;
|
||||
}
|
||||
else
|
||||
return true;
|
||||
}
|
||||
285
demos/TransQuiz/support.js
Normal file
285
demos/TransQuiz/support.js
Normal file
@@ -0,0 +1,285 @@
|
||||
/* --- Accessing document elements ------------------------------------------ */
|
||||
|
||||
function element(id) {
|
||||
return document.getElementById(id);
|
||||
}
|
||||
|
||||
/* --- JavaScript tricks ---------------------------------------------------- */
|
||||
|
||||
// To be able to object methods that refer to "this" as callbacks
|
||||
// See section 3.3 of https://github.com/spencertipping/js-in-ten-minutes/raw/master/js-in-ten-minutes.pdf
|
||||
function bind(f, this_value) {
|
||||
return function () {return f.apply (this_value, arguments)};
|
||||
};
|
||||
|
||||
/* --- JSONP ---------------------------------------------------------------- */
|
||||
|
||||
// Inspired by the function jsonp from
|
||||
// http://www.west-wind.com/Weblog/posts/107136.aspx
|
||||
// See also http://niryariv.wordpress.com/2009/05/05/jsonp-quickly/
|
||||
// http://en.wikipedia.org/wiki/JSON#JSONP
|
||||
function jsonp(url,callback)
|
||||
{
|
||||
if (url.indexOf("?") > -1)
|
||||
url += "&jsonp="
|
||||
else
|
||||
url += "?jsonp="
|
||||
url += callback;
|
||||
//url += "&" + new Date().getTime().toString(); // prevent caching
|
||||
|
||||
var script = empty("script");
|
||||
script.setAttribute("src",url);
|
||||
script.setAttribute("type","text/javascript");
|
||||
document.body.appendChild(script);
|
||||
}
|
||||
|
||||
var json = {next:0};
|
||||
|
||||
// Like jsonp, but instead of passing the name of the ballback function, you
|
||||
// pass the callback function directly, making it possible to use anonymous
|
||||
// functions.
|
||||
function jsonpf(url,callback)
|
||||
{
|
||||
var name="callback"+(json.next++);
|
||||
json[name]=function(x) { delete json[name]; callback(x); }
|
||||
jsonp(url,"json."+name);
|
||||
}
|
||||
|
||||
/* --- AJAX ----------------------------------------------------------------- */
|
||||
|
||||
function GetXmlHttpObject(handler)
|
||||
{
|
||||
var objXMLHttp=null
|
||||
if (window.XMLHttpRequest)
|
||||
{
|
||||
objXMLHttp=new XMLHttpRequest()
|
||||
}
|
||||
else if (window.ActiveXObject)
|
||||
{
|
||||
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
|
||||
}
|
||||
return objXMLHttp
|
||||
}
|
||||
|
||||
function ajax_http_get(url,callback) {
|
||||
var http=GetXmlHttpObject()
|
||||
if (http==null) {
|
||||
alert ("Browser does not support HTTP Request")
|
||||
return
|
||||
}
|
||||
var statechange=function() {
|
||||
if (http.readyState==4 || http.readyState=="complete") {
|
||||
if(http.status==200) callback(http.responseText);
|
||||
else alert("Request for "+url+" failed: "
|
||||
+http.status+" "+http.statusText);
|
||||
}
|
||||
}
|
||||
http.onreadystatechange=statechange;
|
||||
http.open("GET",url,true)
|
||||
http.send(null)
|
||||
//dump("http get "+url+"\n")
|
||||
return http
|
||||
}
|
||||
|
||||
// JSON via AJAX
|
||||
function ajax_http_get_json(url,cont) {
|
||||
ajax_http_get(url,function(txt) { cont(eval("("+txt+")")); });
|
||||
}
|
||||
|
||||
function sameOrigin(url) {
|
||||
return hasPrefix(url,location.protocol+"//"+location.host+"/");
|
||||
}
|
||||
|
||||
// Use AJAX when possible, fallback to JSONP
|
||||
function http_get_json(url,cont) {
|
||||
if(sameOrigin(url)) ajax_http_get_json(url,cont);
|
||||
else jsonpf(url,cont);
|
||||
}
|
||||
|
||||
|
||||
/* --- HTML construction ---------------------------------------------------- */
|
||||
function text(s) { return document.createTextNode(s); }
|
||||
|
||||
function node(tag,as,ds) {
|
||||
var n=document.createElement(tag);
|
||||
for(var a in as) n.setAttribute(a,as[a]);
|
||||
for(var i in ds) n.appendChild(ds[i]);
|
||||
return n;
|
||||
}
|
||||
|
||||
function empty(tag,name,value) {
|
||||
var el=node(tag,{},[])
|
||||
if(name && value) el.setAttribute(name,value);
|
||||
return el;
|
||||
}
|
||||
|
||||
function empty_id(tag,id) { return empty(tag,"id",id); }
|
||||
function empty_class(tag,cls) { return empty(tag,"class",cls); }
|
||||
|
||||
function div_id(id) { return empty_id("div",id); }
|
||||
function span_id(id) { return empty_id("span",id); }
|
||||
|
||||
function wrap(tag,contents) { return node(tag,{},[contents]); }
|
||||
|
||||
function wrap_class(tag,cls,contents) {
|
||||
var el=empty_class(tag,cls);
|
||||
if(contents) el.appendChild(contents);
|
||||
return el;
|
||||
}
|
||||
|
||||
function span_class(cls,contents) { return wrap_class("span",cls,contents); }
|
||||
function div_class(cls,contents) { return wrap_class("div",cls,contents); }
|
||||
|
||||
function p(contents) { return wrap("p",contents); }
|
||||
function dt(contents) { return wrap("dt",contents); }
|
||||
function li(contents) { return wrap("li",contents); }
|
||||
|
||||
function th(contents) { return wrap("th",contents); }
|
||||
function td(contents) { return wrap("td",contents); }
|
||||
|
||||
function tr(cells) { return node("tr",{},cells); }
|
||||
|
||||
//modified for quiz (id added)
|
||||
function button(label,action,key ,id) {
|
||||
var el=node("input",{"type":"button","value":label},[]);
|
||||
if(typeof action=="string") el.setAttribute("onclick",action);
|
||||
else el.onclick=action;
|
||||
if(key) el.setAttribute("accesskey",key);
|
||||
if(id) el.setAttribute("id",id);
|
||||
return el;
|
||||
}
|
||||
|
||||
//added for quiz
|
||||
function submit_button(label, id) {
|
||||
var el=empty("input","type","submit");
|
||||
el.setAttribute("value",label);
|
||||
if(id) el.setAttribute("id", id);
|
||||
return el;
|
||||
}
|
||||
|
||||
function option(label,value) {
|
||||
return node("option",{"value":value},[text(label)]);
|
||||
}
|
||||
|
||||
function appendChildren(el,ds) {
|
||||
for(var i in ds) el.appendChild(ds[i]);
|
||||
return el;
|
||||
}
|
||||
|
||||
function insertFirst(parent,child) {
|
||||
parent.insertBefore(child,parent.firstChild);
|
||||
}
|
||||
|
||||
function tda(cs) { return node("td",{},cs); }
|
||||
|
||||
function img(src) { return empty("img","src",src); }
|
||||
|
||||
/* --- Debug ---------------------------------------------------------------- */
|
||||
|
||||
function debug(s) {
|
||||
var d=element("debug");
|
||||
if(d) d.appendChild(text(s+"\n"))
|
||||
}
|
||||
|
||||
function show_props(obj, objName) {
|
||||
var result = "";
|
||||
for (var i in obj) {
|
||||
result += objName + "." + i + " = " + obj[i] + "<br>";
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function field_names(obj) {
|
||||
var result = "";
|
||||
for (var i in obj) {
|
||||
result += " " + i;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
/* --- Data manipulation ---------------------------------------------------- */
|
||||
function swap(a,i,j) { // Note: this doesn't work on strings.
|
||||
var tmp=a[i];
|
||||
a[i]=a[j];
|
||||
a[j]=tmp;
|
||||
return a;
|
||||
}
|
||||
|
||||
function sort(a) {
|
||||
// https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/sort
|
||||
return a.sort();
|
||||
/* // Note: this doesn't work on strings.
|
||||
for(var i=0;i<a.length-1;i++) {
|
||||
var min=i;
|
||||
for(var j=i+1;j<a.length;j++)
|
||||
if(a[j]<a[min]) min=j;
|
||||
if(min!=i) swap(a,i,min);
|
||||
}
|
||||
return a;
|
||||
*/
|
||||
}
|
||||
|
||||
function filter(p,xs) {
|
||||
var ys=[];
|
||||
for(var i=0;i<xs.length;i++)
|
||||
if(p(xs[i])) ys[ys.length]=xs[i];
|
||||
return ys;
|
||||
}
|
||||
|
||||
function implode(cs) { // array of strings to string
|
||||
/*
|
||||
var s="";
|
||||
for(var i=0;i<cs.length;i++)
|
||||
s+=cs[i];
|
||||
return s;
|
||||
*/
|
||||
return cs.join("");
|
||||
}
|
||||
|
||||
function hasPrefix(s,pre) { return s.substr(0,pre.length)==pre; }
|
||||
|
||||
function commonPrefix(s1,s2) {
|
||||
for(var i=0;i<s1.length && i<s2.length && s1[i]==s2[i];i++);
|
||||
return s1.substr(0,i);
|
||||
}
|
||||
|
||||
/*
|
||||
function all(p,xs) {
|
||||
for(var i=0;i<xs.length;i++)
|
||||
if(!p(xs[i])) return false;
|
||||
return true;
|
||||
}
|
||||
*/
|
||||
|
||||
function map(f,xs) {
|
||||
var ys=[];
|
||||
for(var i=0;i<xs.length;i++) ys[i]=f(xs[i]);
|
||||
return ys;
|
||||
}
|
||||
|
||||
// map in continuation passing style
|
||||
function mapc(f,xs,cont) { mapc_from(f,xs,0,[],cont); }
|
||||
|
||||
function mapc_from(f,xs,i,ys,cont) {
|
||||
if(i<xs.length)
|
||||
f(xs[i],function(y){ys[i]=y;mapc_from(f,xs,i+1,ys,cont)});
|
||||
else
|
||||
cont(ys);
|
||||
}
|
||||
|
||||
function overlaps(as,bs) {
|
||||
for(var i=0;i<as.length;i++)
|
||||
if(elem(as[i],bs)) return true;
|
||||
return false;
|
||||
}
|
||||
|
||||
function elem(a,as) {
|
||||
for(var i=0;i<as.length;i++)
|
||||
if(a==as[i]) return true;
|
||||
return false;
|
||||
}
|
||||
|
||||
function shuffle(a) {
|
||||
for(i=0;i<a.length;i++) swap(a,i,Math.floor(Math.random()*a.length))
|
||||
return a;
|
||||
}
|
||||
158
demos/TransQuiz/translation_quiz.html
Normal file
158
demos/TransQuiz/translation_quiz.html
Normal file
@@ -0,0 +1,158 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>GF Translation Quiz</title>
|
||||
|
||||
<link rel=stylesheet type="text/css" href="minibar_quiz.css">
|
||||
|
||||
<meta name = "viewport" content = "width = device-width">
|
||||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/JavaScript" src="support.js"></script>
|
||||
<script type="text/JavaScript" src="minibar_quiz.js"></script>
|
||||
<script type="text/JavaScript" src="pgf_online.js"></script>
|
||||
<script type="text/JavaScript" src="quiz_support.js"></script>
|
||||
<script type="text/javascript" src="translation_quiz.js"></script>
|
||||
<script type="text/JavaScript" src="quiz_pre_start.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body onLoad="pre_start()">
|
||||
|
||||
<div id = "info" >
|
||||
<a href="javascript:popUp('quiz_about.html', 'about')">About GF Translation Quiz</a>
|
||||
<h2 style=" padding-left: 35px;"><i> Welcome to <b>GF Translation Quiz </i></b></h2>
|
||||
|
||||
<p style="font-size:20px;">
|
||||
To start the quiz choose a grammar, From and To languages
|
||||
<br/> as well as a quiz mode, then press the "Start Quiz" button.
|
||||
<br/> <b>Note:</b> You may not change these settings in the middle of
|
||||
<br/> a quiz.
|
||||
The quiz is over when you have done at least
|
||||
<span style="color:#2E8B57;"><b><script type="text/javascript"> document.write(min_no_questions); </script></b></span>
|
||||
<br/>examples with a minimum success of
|
||||
<span style="color:#2E8B57;"><b><script type="text/javascript"> document.write(pass_percentage * 100); </script> % </b></span>
|
||||
. However <br/> you can restart or quit the quiz
|
||||
at any time by clicking <br/>on the "Restart Quiz" or "End Quiz" buttons.
|
||||
</p>
|
||||
|
||||
<a style="font-size:18px;" href="javascript:popUp('quiz_help.html', 'help')">Click here to learn more about how the Quiz works.</a>
|
||||
<br/>
|
||||
|
||||
</div>
|
||||
|
||||
<div id = "toggle_hide"; class="shift_left"; ><a href="javascript: toggle_info()">Hide Information</a></div>
|
||||
<div id = "toggle_show"; class="shift_left"; ><a href="javascript: toggle_info()">Show Information</a></div>
|
||||
|
||||
<hr noshade size=0 />
|
||||
|
||||
<div id = "minibar1" class="bold">
|
||||
</div>
|
||||
|
||||
<hr noshade size=0 />
|
||||
|
||||
<table frame="void" cellpadding="5" >
|
||||
<tr>
|
||||
<td><b>Quiz Question:</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<form name="question">
|
||||
<textarea class="quest" name="question_text" wrap="virtual" readonly="true">
|
||||
</textarea>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<form name="answer" onsubmit="check_answer_quiz(); return false;">
|
||||
<fieldset>
|
||||
|
||||
<legend><b>Your Answer: </b></legend>
|
||||
<div id = "minibar_buttons" class="shift_left";></div>
|
||||
<div id = "minibar_contin"></div>
|
||||
<table cellpadding="2">
|
||||
<tr>
|
||||
<td>
|
||||
<input class="answer1" type="text" id="user_answer" name="answer_text" value="" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div id="hint_txt" class="hint">
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div id = "buttons_bar"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div id = "history_bar"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</fieldset>
|
||||
</form>
|
||||
|
||||
|
||||
<table frame="void" cellpadding="5" >
|
||||
<tr>
|
||||
<td><b>Explanation:</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<form name="explanation">
|
||||
<textarea class="explain" name="explanation_text" wrap="virtual" readonly="true">
|
||||
</textarea>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<table cellpadding="1" cellspacing="10">
|
||||
<tr>
|
||||
<td><b>Current Quiz Mode:</b></td>
|
||||
<td><b>Answered Questions</b></td>
|
||||
<td><b>Your Score</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><input type="text" id="mode" style="border: 0; text-align:left; color:#CD5C5C; background-color:#ccc;" class="number" size="18" readonly="true"/></td>
|
||||
<td><input type="text" id="counter_display" class="number" size="4" readonly="true" value="0" /></td>
|
||||
<td><input type="text" id="score_display" style="color:#2E8B57" class="number" size="3" readonly="true" value="0" /></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div id="history_part">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
var online_options={
|
||||
grammars_url: "http://www.grammaticalframework.org/grammars/"
|
||||
//grammars_url: "http://tournesol.cs.chalmers.se:41296/grammars",
|
||||
//grammars_url: "http://localhost:41296/grammars",
|
||||
//grammar_list: ["Foods.pgf"], // leave undefined to get list from server
|
||||
}
|
||||
|
||||
var server=pgf_online(online_options);
|
||||
|
||||
var minibar_options= {
|
||||
show_abstract: false,
|
||||
show_trees: false,
|
||||
show_grouped_translations: false,
|
||||
default_source_language: "Eng",
|
||||
try_google: false
|
||||
}
|
||||
|
||||
var minibar=new Minibar(server,minibar_options,"minibar1");
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
762
demos/TransQuiz/translation_quiz.js
Normal file
762
demos/TransQuiz/translation_quiz.js
Normal file
@@ -0,0 +1,762 @@
|
||||
// translation_quiz.js, assumes that quiz_support.js has also been loaded
|
||||
|
||||
/*-------------------------------------- Configuration Variables --------------------------------------*/
|
||||
|
||||
var pass_percentage = 0.75;
|
||||
var min_no_questions = 10;
|
||||
var exam_quesNo = 10; // sets the number of questions appearing in an exam
|
||||
var max_answer_times = 1; // the max limit for the user to increase his/her score
|
||||
|
||||
|
||||
/*-------------------------------------- other Variables --------------------------------------*/
|
||||
|
||||
var grammar;
|
||||
var question_lang;
|
||||
var answer_lang;
|
||||
|
||||
//saves the random tree generated by the server in generate_question function to be used by the check_answer
|
||||
var rand_tree;
|
||||
|
||||
var counter;
|
||||
var score;
|
||||
var confirmed_check = new Boolean(true);
|
||||
var prev_pressed = new Boolean();
|
||||
|
||||
var prev_question;
|
||||
var prev_explanation;
|
||||
var prev_answer;
|
||||
var prev_hint;
|
||||
var current_question;
|
||||
var current_answer;
|
||||
var current_explanation= "";
|
||||
var current_hint;
|
||||
|
||||
//for history
|
||||
var quiz_history = [];
|
||||
var history_shown= new Boolean();
|
||||
var index =0;
|
||||
|
||||
//for check answer
|
||||
var answer_was_right= new Boolean();
|
||||
var raw_user_answer;
|
||||
var user_answer;
|
||||
var user_answer_splited;
|
||||
var server_answer;
|
||||
var all_answers = [];
|
||||
var parsed_trees = 0;
|
||||
var words_hidden = new Boolean();
|
||||
|
||||
var answer_times ;
|
||||
var hint_times ;
|
||||
var hint_pressed = new Boolean();
|
||||
var restart_active = new Boolean();
|
||||
var is_ended = new Boolean();
|
||||
var info_hidden = new Boolean();
|
||||
|
||||
//modes variables
|
||||
var have_minibar = new Boolean();
|
||||
var have_prevQuestion = new Boolean();
|
||||
var have_checkAns = new Boolean();
|
||||
var max_hint_times;
|
||||
var selected_mode;
|
||||
|
||||
/*-------------------------------------- Functions --------------------------------------*/
|
||||
|
||||
|
||||
function default_values()
|
||||
{
|
||||
//resets the question, answer and the explanation and hint display areas
|
||||
document.question.question_text.value= "Quiz questions will be displayed here.";
|
||||
document.answer.answer_text.value = " ";
|
||||
document.explanation.explanation_text.value= "Explanations are displayed here.";
|
||||
document.getElementById("hint_txt").innerHTML = "";
|
||||
|
||||
//resets some flags
|
||||
prev_pressed = false;
|
||||
is_ended = false; //refering to the End button or end o quiz by score or end of exam
|
||||
restart_active = false; //refering to the Restart button
|
||||
hint_pressed = false;
|
||||
answer_was_right= false;
|
||||
history_shown= false;
|
||||
|
||||
//resets the counter and score displays and some variables
|
||||
answer_times = 1;
|
||||
counter = 0;
|
||||
score = 0;
|
||||
hint_times =0;
|
||||
document.getElementById('counter_display').value = counter;
|
||||
document.getElementById('score_display').value = score;
|
||||
|
||||
//resets the variables for keeping the history
|
||||
quiz_history = [];
|
||||
index =0;
|
||||
var history=element("history_part");
|
||||
history.innerHTML ="";
|
||||
|
||||
//resets the variables for keeping the parsing and linearization altenatives
|
||||
parsed_trees = 0;
|
||||
all_answers = [];
|
||||
|
||||
//shows the normal user answer area
|
||||
show_element("user_answer");
|
||||
}
|
||||
|
||||
function start_quiz()
|
||||
{
|
||||
//sets the grammar and From and To languages
|
||||
grammar= minibar.grammar_menu.value;
|
||||
question_lang= minibar.from_menu.value;
|
||||
answer_lang= minibar.to_menu.value;
|
||||
|
||||
//removes the start button
|
||||
minibar.menubar.removeChild(minibar.menubar.lastChild);
|
||||
|
||||
set_mode();
|
||||
|
||||
//shows the minibar area and buttons
|
||||
var buttons_bar=element("buttons_bar");
|
||||
if (have_minibar)
|
||||
{
|
||||
//show the minibar word magnets
|
||||
show_element("minibar_contin");
|
||||
|
||||
//show the delete and clear buttons
|
||||
show_element("minibar_buttons");
|
||||
|
||||
//hides the normal user answer area
|
||||
hide_element("user_answer");
|
||||
|
||||
//changes the "Check Answer" button to a none_submit one
|
||||
buttons_bar.removeChild(buttons_bar.lastChild);
|
||||
appendChildren(buttons_bar,
|
||||
[ button("Check Answer","check_answer_quiz()","C", "check_answer")]);
|
||||
}
|
||||
else
|
||||
{
|
||||
//enable the user answer area
|
||||
document.getElementById('user_answer').disabled = false;
|
||||
|
||||
//hide the minibar word magnets
|
||||
hide_element("minibar_contin");
|
||||
|
||||
//hide the delete and clear buttons
|
||||
hide_element("minibar_buttons");
|
||||
|
||||
//changes the "Check Answer" button to a submit one
|
||||
buttons_bar.removeChild(buttons_bar.lastChild);
|
||||
appendChildren(buttons_bar,
|
||||
[ submit_button("Check Answer", "check_answer")]);
|
||||
}
|
||||
|
||||
//conditionally enbles the "Hint", "Check Answer", "Next Question" and "Previous Question" buttons, and the minibar
|
||||
|
||||
if (have_checkAns)
|
||||
document.getElementById('check_answer').disabled = false;
|
||||
else
|
||||
document.getElementById('check_answer').disabled = true;
|
||||
|
||||
if (have_prevQuestion)
|
||||
document.getElementById('previous_question').disabled = false;
|
||||
|
||||
if ( max_hint_times > 0 )
|
||||
document.getElementById('hint').disabled = false;
|
||||
|
||||
document.getElementById('next_question').disabled = false;
|
||||
|
||||
//generates the first quiz question
|
||||
generate_question();
|
||||
|
||||
//resets the restart_active
|
||||
restart_active= true ;
|
||||
|
||||
//hides the information
|
||||
if ( info_hidden == false )
|
||||
toggle_info();
|
||||
}
|
||||
|
||||
function restart_quiz()
|
||||
{
|
||||
//javascript:location.reload(true);
|
||||
|
||||
if (restart_active == true)
|
||||
{
|
||||
var end_confirmed= new Boolean(true);
|
||||
|
||||
if (!is_ended )
|
||||
end_confirmed = confirm(" Are you sure you want to quit this quiz!");
|
||||
|
||||
if (end_confirmed)
|
||||
{
|
||||
end_quiz(false);
|
||||
|
||||
reset_mode();
|
||||
|
||||
//add the start button
|
||||
appendChildren(minibar.menubar,[ button("Start Quiz","start_quiz()","S")]);
|
||||
|
||||
//removes the History button
|
||||
var history_bar=element("history_bar");
|
||||
history_bar.removeChild(history_bar.lastChild);
|
||||
|
||||
default_values();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function generate_question()
|
||||
{
|
||||
//for the exam mode
|
||||
if (selected_mode == "Exam Mode")
|
||||
{
|
||||
if (check_notEmpty())
|
||||
{
|
||||
if (counter > 0)
|
||||
{
|
||||
document.getElementById('score_display').value = "?";
|
||||
|
||||
//save the current user answer for history
|
||||
current_answer = document.answer.answer_text.value;
|
||||
quiz_history[index][1] = current_answer;
|
||||
|
||||
make_all_answers();
|
||||
}
|
||||
else
|
||||
exam_continue();
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
if (prev_pressed == true )
|
||||
{
|
||||
//changes the question, answer and the explanation back to the current one
|
||||
document.question.question_text.value= current_question;
|
||||
document.answer.answer_text.value = current_answer;
|
||||
document.explanation.explanation_text.value= current_explanation;
|
||||
document.getElementById("hint_txt").innerHTML = current_hint;
|
||||
|
||||
prev_pressed = false; // to go back to normal
|
||||
|
||||
//enables the "Previous Question","Hint" and "Check Answer" buttons
|
||||
document.getElementById('previous_question').disabled = false;
|
||||
document.getElementById('check_answer').disabled = false;
|
||||
document.getElementById('hint').disabled = false;
|
||||
}
|
||||
else
|
||||
{
|
||||
// if the user clicks the "Next Question" without cheking his/her previous answer,
|
||||
// asks for user's confirmation before moving to the next question
|
||||
if ( answer_times == 0 )
|
||||
{
|
||||
confirmed_check = confirm("Are you sure you don't want to check your answer's correctness!");
|
||||
|
||||
if ( hint_times == 0 )
|
||||
{
|
||||
//saves the current answer and the explanation which is null(the answer was not checked or hinted)
|
||||
current_answer = document.answer.answer_text.value;
|
||||
|
||||
current_explanation = "You did not check your answer's correctness!";
|
||||
|
||||
current_hint = "";
|
||||
}
|
||||
//save the current user answer for history
|
||||
quiz_history[index][1] = document.answer.answer_text.value;
|
||||
|
||||
//save the current explanation for history
|
||||
quiz_history[index][2] = "You did not check your answer's correctness!";
|
||||
}
|
||||
if (confirmed_check == true )
|
||||
{
|
||||
//save the current question for the "previous question" button and history
|
||||
prev_question = current_question;
|
||||
|
||||
//save the current answer for the "previous question" button
|
||||
prev_answer = current_answer;
|
||||
|
||||
//save the current explanation and hint for the "previous question" button
|
||||
prev_explanation = current_explanation;
|
||||
prev_hint= current_hint;
|
||||
|
||||
//clears the question, answer and the explanation and hint display areas
|
||||
clearing();
|
||||
|
||||
if (have_minibar)
|
||||
{
|
||||
minibar.clear_all();
|
||||
|
||||
//unhides the words area and removes the "Show Magnets" button
|
||||
show_word_magnets();
|
||||
}
|
||||
|
||||
if (answer_was_right) //here it still contains info about the previous question
|
||||
document.explanation.explanation_text.value= current_explanation;
|
||||
|
||||
//resets the times user has answered to the current question
|
||||
answer_times = 0;
|
||||
|
||||
//resets the times user has pressed hint for the current question
|
||||
hint_times = 0;
|
||||
|
||||
document.getElementById('counter_display').value = counter;
|
||||
//increments the counter
|
||||
counter= ++ counter;
|
||||
|
||||
//sends a question retrival request to the server
|
||||
server.get_random(generate_question2);
|
||||
}
|
||||
}
|
||||
}
|
||||
//sets the focus on the answer area
|
||||
document.answer.answer_text.focus();
|
||||
}
|
||||
|
||||
function generate_question2(random_trees)
|
||||
{
|
||||
//we now have a random abstract syntax tree that we need to linearize
|
||||
server.pgf_call("linearizeAll",{tree:random_trees[0].tree,
|
||||
to:question_lang}, generate_question3);
|
||||
rand_tree= random_trees[0].tree;
|
||||
}
|
||||
|
||||
function generate_question3(random_texts)
|
||||
{
|
||||
var no_of_lins = random_texts[0].texts.length;
|
||||
|
||||
//generates a random number, to determine which linearization should be used as the question
|
||||
var which= Math.floor(Math.random()* no_of_lins );
|
||||
if (which >= no_of_lins)
|
||||
which = which - 1;
|
||||
|
||||
//display the new quiz quetion sent by server
|
||||
document.question.question_text.value= counter +". " + random_texts[0].texts[which];
|
||||
|
||||
//save the current question for the "previous question" button and history
|
||||
current_question = document.question.question_text.value;
|
||||
index = quiz_history.length;
|
||||
quiz_history[index] = [];
|
||||
quiz_history[index][0]= current_question;
|
||||
}
|
||||
|
||||
function check_answer_quiz()
|
||||
{
|
||||
if (check_notEmpty())
|
||||
{
|
||||
//resets the user confirmation for moving to next question without checking the answer
|
||||
confirmed_check = true;
|
||||
|
||||
//clears the explanation and Hint display area
|
||||
document.explanation.explanation_text.value = "";
|
||||
document.getElementById("hint_txt").innerHTML = "";
|
||||
|
||||
//save the current user answer for the "peivious question" button and history
|
||||
current_answer = document.answer.answer_text.value;
|
||||
quiz_history[index][1] = current_answer;
|
||||
|
||||
//increments the times the user has answered to the current question
|
||||
answer_times ++;
|
||||
|
||||
//resets the hint_pressed flag
|
||||
hint_pressed = false;
|
||||
|
||||
if ((answer_times + hint_times) <= 1)
|
||||
make_all_answers();
|
||||
else
|
||||
continue_checking();
|
||||
}
|
||||
}
|
||||
|
||||
function make_all_answers()
|
||||
{
|
||||
//resets the variables for keeping the parsing and linearization altenatives
|
||||
parsed_trees = 0;
|
||||
all_answers = [];
|
||||
|
||||
//we now need to linearize the random abstract syntax tree in order to
|
||||
//find all possible correct answers then we check user's answer against these answers.
|
||||
server.pgf_call("linearize",{tree:rand_tree, to:question_lang}, parse_answer);
|
||||
}
|
||||
|
||||
function parse_answer(right_answer)
|
||||
{
|
||||
server.parse(question_lang,right_answer[0].text, parse_answer2);
|
||||
}
|
||||
|
||||
function parse_answer2(parsed_answer)
|
||||
{
|
||||
parsed_trees = parsed_answer[0].trees.length;
|
||||
var j =0;
|
||||
for (j= 0; j < parsed_trees ; j++)
|
||||
{
|
||||
server.linearizeAll(parsed_answer[0].trees[j], answer_lang, collect_answers);
|
||||
}
|
||||
}
|
||||
|
||||
function collect_answers(lin_answer)
|
||||
{
|
||||
var next= 0;
|
||||
var i=0;
|
||||
for (i= 0; i < lin_answer[0].texts.length ; i++)
|
||||
{
|
||||
next = all_answers.length;
|
||||
all_answers[next]= lin_answer[0].texts[i];
|
||||
}
|
||||
|
||||
if ( all_answers.length > (parsed_trees - 1) * i)
|
||||
continue_checking();
|
||||
}
|
||||
|
||||
function continue_checking()
|
||||
{
|
||||
if (selected_mode == "Exam Mode")
|
||||
{
|
||||
check_answer_exam2();
|
||||
exam_continue();
|
||||
}
|
||||
else
|
||||
if (hint_pressed)
|
||||
show_hint2();
|
||||
else
|
||||
check_answer2();
|
||||
}
|
||||
|
||||
function check_answer2()
|
||||
{
|
||||
if (have_minibar)
|
||||
hide_word_magnets();
|
||||
|
||||
raw_user_answer= document.answer.answer_text.value;
|
||||
user_answer = remove_unwanted_characters(raw_user_answer);
|
||||
answer_was_right= false;
|
||||
var k = 0 ;
|
||||
for (k= 0; k < all_answers.length; k++)
|
||||
{
|
||||
server_answer = remove_unwanted_characters(all_answers[k]);
|
||||
|
||||
if ( user_answer == server_answer )
|
||||
{
|
||||
if (answer_times <= max_answer_times)
|
||||
{
|
||||
//increments the score
|
||||
score ++;
|
||||
document.getElementById('score_display').value = score;
|
||||
}
|
||||
|
||||
document.explanation.explanation_text.value = "Yes, that was the correct answer.";
|
||||
answer_was_right= true;
|
||||
|
||||
break;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
if (k >= all_answers.length)
|
||||
{
|
||||
document.explanation.explanation_text.value= "No, the correct answer(s) is(are): \n "
|
||||
+ all_answers;
|
||||
document.getElementById('counter_display').value = counter;
|
||||
}
|
||||
|
||||
//save the current explanation for the "previous question" button and history
|
||||
current_explanation = document.explanation.explanation_text.value;
|
||||
quiz_history[index][2] = current_explanation;
|
||||
|
||||
if ((counter >= min_no_questions) && ((score/counter) >= pass_percentage))
|
||||
{
|
||||
if (answer_was_right)
|
||||
document.explanation.explanation_text.value += "\nAlso, ";
|
||||
else
|
||||
document.explanation.explanation_text.value += "\nHowever, ";
|
||||
|
||||
document.explanation.explanation_text.value += "Congratulations!!! You passed the quiz. Click \"Restart Quiz\" for a new one.";
|
||||
|
||||
document.getElementById('counter_display').value = counter;
|
||||
|
||||
end_quiz(false);
|
||||
}
|
||||
else
|
||||
if (answer_was_right)
|
||||
{
|
||||
//goes to the next question automaticly after getting the correct answer
|
||||
generate_question();
|
||||
}
|
||||
|
||||
//save the current hint for the "previous question" button
|
||||
current_hint = document.getElementById("hint_txt").innerHTML ;
|
||||
}
|
||||
|
||||
function check_answer_exam2()
|
||||
{
|
||||
|
||||
raw_user_answer= document.answer.answer_text.value;
|
||||
user_answer = remove_unwanted_characters(raw_user_answer);
|
||||
|
||||
var k = 0 ;
|
||||
for (k= 0; k < all_answers.length; k++)
|
||||
{
|
||||
server_answer = remove_unwanted_characters(all_answers[k]);
|
||||
|
||||
if ( user_answer == server_answer )
|
||||
{
|
||||
//increments the score
|
||||
score ++;
|
||||
|
||||
//save the current explanation for history
|
||||
current_explanation = "Yes, that was the correct answer.";
|
||||
quiz_history[index][2] = current_explanation;
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (k >= all_answers.length)
|
||||
{
|
||||
//save the current explanation for history
|
||||
current_explanation = "No, the correct answer(s) is(are): \n " + all_answers;
|
||||
quiz_history[index][2] = current_explanation;
|
||||
}
|
||||
}
|
||||
|
||||
function exam_continue()
|
||||
{
|
||||
if (counter >= exam_quesNo)
|
||||
exam_result();
|
||||
else
|
||||
{
|
||||
//clears the question and answer display areas
|
||||
clearing();
|
||||
|
||||
document.getElementById('counter_display').value = counter + "/" + exam_quesNo;
|
||||
//increments the counter
|
||||
counter= ++ counter;
|
||||
|
||||
//sends a question retrival request to the server
|
||||
server.get_random(generate_question2);
|
||||
}
|
||||
}
|
||||
|
||||
function exam_result()
|
||||
{
|
||||
document.getElementById('score_display').value = score;
|
||||
document.getElementById('counter_display').value = counter + "/" + exam_quesNo;
|
||||
document.explanation.explanation_text.value= "That's the end of exam.";
|
||||
end_quiz(false);
|
||||
}
|
||||
|
||||
function show_hint()
|
||||
{
|
||||
if (hint_times < max_hint_times)
|
||||
{
|
||||
if (check_notEmpty())
|
||||
{
|
||||
//clears the explanation and Hint area
|
||||
document.explanation.explanation_text.value = "";
|
||||
document.getElementById("hint_txt").innerHTML = "";
|
||||
|
||||
//increments the times the user has pressed hint button
|
||||
hint_times= ++ hint_times;
|
||||
|
||||
//resets the user confirmation for moving to next question without checking the answer
|
||||
confirmed_check = true;
|
||||
|
||||
//save the current user answer for the "peivious question" button
|
||||
current_answer = document.answer.answer_text.value;
|
||||
|
||||
//sets the hint_pressed flag
|
||||
hint_pressed = true;
|
||||
|
||||
raw_user_answer= document.answer.answer_text.value;
|
||||
user_answer = remove_unwanted_characters(raw_user_answer);
|
||||
user_answer_splited = split_to_words(user_answer);
|
||||
|
||||
if ((answer_times + hint_times) <= 1)
|
||||
make_all_answers();
|
||||
else
|
||||
continue_checking();
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
//Error message (max_hint_times is passed)
|
||||
document.explanation.explanation_text.value = "Sorry, you have already used up your allowed number of hints for this question.";
|
||||
}
|
||||
}
|
||||
|
||||
function show_hint2()
|
||||
{
|
||||
var best_answer = new Array();
|
||||
best_answer= find_closest(all_answers);
|
||||
|
||||
var compared = new Array();
|
||||
compared = string_matching(best_answer, user_answer_splited);
|
||||
|
||||
//preparing the Hint spans
|
||||
var hint = element("hint_txt");
|
||||
hint.innerHTML = "<b>Hint: </b>";
|
||||
var max_length = Math.max(best_answer.length, user_answer_splited.length);
|
||||
for (k= 0; k < max_length; k++)
|
||||
{
|
||||
var id = "word" + k.toString();
|
||||
var word_span= span_id(id);
|
||||
hint.appendChild(word_span);
|
||||
}
|
||||
|
||||
var k=0;
|
||||
var visited = new Array();
|
||||
for (k= 0; k < best_answer.length; k++)
|
||||
{
|
||||
visited[k] = 0;
|
||||
}
|
||||
|
||||
var i= 0; //i is used for the user_answer
|
||||
var myid = "";
|
||||
while ( i < compared.length)
|
||||
{
|
||||
myid = "word" + i.toString();
|
||||
if (compared[i] == 0)
|
||||
{
|
||||
var j =0; //j is used for the server_answer
|
||||
while (j < best_answer.length)
|
||||
{
|
||||
if (visited[j] == 0 && user_answer_splited[i] == best_answer[j] && (j >= compared.length || compared[j] == 0 ))
|
||||
{
|
||||
//yellow for the right word in wrong place
|
||||
document.getElementById(myid).style.color="#FFFF00";
|
||||
visited[j] = 1;
|
||||
break;
|
||||
}
|
||||
j++;
|
||||
}
|
||||
|
||||
if ( j >= best_answer.length)
|
||||
{
|
||||
//red for the totaly wrong word
|
||||
document.getElementById(myid).style.color="#FF0000";
|
||||
}
|
||||
}
|
||||
else
|
||||
{ //green for the right word in right place
|
||||
document.getElementById(myid).style.color="#339933";
|
||||
}
|
||||
document.getElementById(myid).innerHTML = user_answer_splited[i] + " ";
|
||||
i++;
|
||||
}
|
||||
|
||||
while ( i < best_answer.length)
|
||||
{
|
||||
myid = "word" + i.toString();
|
||||
document.getElementById(myid).style.color="#FF0000";
|
||||
document.getElementById(myid).innerHTML = "____ ";
|
||||
i++;
|
||||
}
|
||||
|
||||
//save the current explanation and hint for the "previous question" button
|
||||
current_explanation = document.explanation.explanation_text.value;
|
||||
current_hint = document.getElementById("hint_txt").innerHTML ;
|
||||
}
|
||||
|
||||
function previous_question_quiz()
|
||||
{
|
||||
if ( counter > 1)
|
||||
{
|
||||
if ( answer_times == 0 && hint_times == 0 )
|
||||
{
|
||||
//sets the current answer and the explanation and hint
|
||||
current_answer = document.answer.answer_text.value;
|
||||
current_explanation = "";
|
||||
current_hint = "";
|
||||
}
|
||||
|
||||
//disables the "Previous Question","Hint" and "Check Answer" buttons
|
||||
document.getElementById('previous_question').disabled = true;
|
||||
document.getElementById('check_answer').disabled = true;
|
||||
document.getElementById('hint').disabled = true;
|
||||
|
||||
//changes the question, answer and the explanation
|
||||
document.question.question_text.value= prev_question;
|
||||
document.answer.answer_text.value = prev_answer;
|
||||
document.explanation.explanation_text.value= prev_explanation;
|
||||
document.getElementById("hint_txt").innerHTML = prev_hint;
|
||||
|
||||
prev_pressed = true; // to remember the current question, answer and explanation
|
||||
}
|
||||
}
|
||||
|
||||
function end_quiz(confirm_needed)
|
||||
{
|
||||
if (restart_active == true && is_ended == false)
|
||||
{
|
||||
var end= new Boolean(true);
|
||||
|
||||
if (confirm_needed)
|
||||
end = confirm(" Are you sure you want to quit this quiz!");
|
||||
|
||||
if (end)
|
||||
{
|
||||
if (have_minibar)
|
||||
{
|
||||
//removes the "Show Magnets" button if exists
|
||||
show_word_magnets();
|
||||
//remove the minibar word magnets if there was any
|
||||
remove_minibar();
|
||||
//shows the normal user answer area
|
||||
show_element("user_answer");
|
||||
}
|
||||
disable_all();
|
||||
is_ended = true;
|
||||
|
||||
//adds a Show Quiz History button
|
||||
var history_bar=element("history_bar");
|
||||
appendChildren(history_bar,
|
||||
[ button("Show Quiz History","show_history()","H", "quiz_history")]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function show_history()
|
||||
{
|
||||
var current_grammar = minibar.grammar.name; // minibar.grammar.name gives the grammar name without .pgf
|
||||
var to_lang= langpart(minibar.to_menu.value,current_grammar);
|
||||
var from_lang= langpart(minibar.from_menu.value,current_grammar);
|
||||
var history=element("history_part");
|
||||
if (history_shown == false)
|
||||
{
|
||||
var i=0;
|
||||
for (i= 0; i < quiz_history.length ; i++)
|
||||
{
|
||||
var question = text("Question" + " "+quiz_history[i][0] + "\n");
|
||||
history.appendChild(empty("br"));
|
||||
history.appendChild(question);
|
||||
history.appendChild(empty("br"));
|
||||
|
||||
var answer = text("Your Answer" + ": "+ quiz_history[i][1] + "\n");
|
||||
history.appendChild(answer);
|
||||
history.appendChild(empty("br"));
|
||||
|
||||
var explan = text("Explanation" + ": "+ quiz_history[i][2] + "\n");
|
||||
history.appendChild(explan);
|
||||
history.appendChild(empty("br"));
|
||||
history.appendChild(empty("br"));
|
||||
}
|
||||
history_shown = true;
|
||||
}
|
||||
|
||||
var history_content = history.innerHTML;
|
||||
|
||||
var history_window = window.open('', 'historyPopup', "dependent = 1, scrollbars=1, location=1, statusbar=1, width=540, height=650, left = 10, top = 20");
|
||||
history_window.document.writeln('<html><head><title>Quiz History</title></head><body>');
|
||||
history_window.document.writeln('<h3> Your Quiz History </h3>');
|
||||
history_window.document.write('<b> Quiz Mode: </b>');
|
||||
history_window.document.write(selected_mode+ ", ");
|
||||
history_window.document.write('<b> Grammar: </b> ');
|
||||
history_window.document.write(" "+ current_grammar +", ");
|
||||
history_window.document.write('<b> From: </b>');
|
||||
history_window.document.write(" "+ from_lang + ", ");
|
||||
history_window.document.write('<b> To: </b>');
|
||||
history_window.document.writeln(" "+ to_lang);
|
||||
history_window.document.writeln('<div style="font-size:18px;">');
|
||||
history_window.document.writeln(history_content);
|
||||
history_window.document.writeln('</div>');
|
||||
history_window.document.writeln('<div style="color: #2E8B57; font-size:16px; font-weight: bold;"><a href="javascript: window.print()">Print History</a></div>');
|
||||
history_window.document.writeln('<div style="padding-left: 320px; color: #2E8B57; font-size:16px; font-weight: bold;"><a href="javascript: window.close()">Close page</a></div>');
|
||||
history_window.document.writeln('</body></html>');
|
||||
history_window.document.close();
|
||||
}
|
||||
@@ -7,10 +7,17 @@
|
||||
</CENTER>
|
||||
|
||||
<p>
|
||||
<b>NEW</b>
|
||||
<a href="http://www.grammaticalframework.org/demos/phrasebook/">Tourist
|
||||
Phrasebook</a>
|
||||
|
||||
<p>
|
||||
<strong>NEW</strong>
|
||||
<a href="TransQuiz/">Translation Quiz</a>
|
||||
|
||||
<P>
|
||||
<A HREF="http://www.grammaticalframework.org:41296/minibar/minibar.html">Minibar
|
||||
online</A>
|
||||
| <small><a href="http://www.grammaticalframework.org/~hallgren/hs2js/test/">Minibar offline</a></small>
|
||||
<P>
|
||||
<A HREF="http://www.grammaticalframework.org:41296/fridge">Fridge poetry</A>
|
||||
|
||||
|
||||
@@ -1,37 +0,0 @@
|
||||
Grammatical Framework Demos
|
||||
|
||||
|
||||
|
||||
**NEW** [Fridge poetry http://tournesol.cs.chalmers.se:41296/fridge]
|
||||
|
||||
**NEW** [Word-completing translator http://tournesol.cs.chalmers.se:41296/translate]
|
||||
|
||||
**NEW** [Tramdemo on YouTube http://www.youtube.com/watch?v=1bfaYHWS6zU]:
|
||||
find your way in Gothenburg public transport system, in six languages (film).
|
||||
|
||||
**NEW** [Multilingual Wiki http://csmisc14.cs.chalmers.se/~meza/restWiki/wiki.cgi].
|
||||
|
||||
[Numeral translator for the iPhone index-numbers.html]: number words in 15 languages.
|
||||
|
||||
[Numeral translator http://www.cs.chalmers.se/~bringert/gf/translate/]:
|
||||
number words in 88 languages.
|
||||
|
||||
[Letter editor http://www.cs.chalmers.se/~markus/gramlets/letter-applet.html]: compose
|
||||
a letter in a language you don't know.
|
||||
|
||||
[Pizza http://www.cs.chalmers.se/~bringert/xv/pizza/]: order a pizza by speaking
|
||||
to your web browser.
|
||||
|
||||
[WebALT Math Editor http://webalt.math.helsinki.fi/PublicFiles/CD/Screencast/TextMathEditor%20Demo.swf]:
|
||||
create mathematical exercises in six languages simultaneously (film).
|
||||
|
||||
[WebALT Math translator http://www.jem-thematic.net/en/node/846#comment-209]:
|
||||
translate mathematical exercises in a web service using incremental parsing.
|
||||
|
||||
[GF Language Trainer http://csmisc14.cs.chalmers.se/~bjorn/langtrain.cgi]:
|
||||
translation quizzes in Arabic, English, Russian, Swedish.
|
||||
|
||||
[Library API browser-editor resource-api/editor.html]: construct phrases in
|
||||
the [GF resource library ../lib/resource/doc/synopsis.html]
|
||||
|
||||
[Random library examples ../lib/resource/doc/resdemo.html]
|
||||
Reference in New Issue
Block a user