1
0
forked from GitHub/gf-core

minibar: small code and documentation tweaks

This commit is contained in:
hallgren
2011-08-03 14:24:47 +00:00
parent 8c620229e1
commit a0ec59ccda
6 changed files with 70 additions and 37 deletions

View File

@@ -1,8 +1,7 @@
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <!DOCTYPE html>
<html> <head> <html> <head>
<title>About Minibar</title> <title>About Minibar</title>
<link rel=stylesheet type="text/css" href="minibar.css"> <link rel=stylesheet type="text/css" href="minibar.css">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<meta charset="UTF-8"> <meta charset="UTF-8">
</head> </head>
@@ -33,7 +32,9 @@ Some implementation details:
There seems to be some rendering bugs in Chrome 5.0.342.9 β. There seems to be some rendering bugs in Chrome 5.0.342.9 β.
<li>The implementation consist of two JavaScript files: <li>The implementation consist of two JavaScript files:
<a href="minibar.js">minibar.js</a> and <a href="support.js">support.js</a> <a href="minibar.js">minibar.js</a> and <a href="support.js">support.js</a>
The latter is also used in a small web app based on the The latter is also used in
<a href="http://spraakbanken.gu.se/swe/forskning/saldo/ordspel">a couple of
small web apps</a> based on the
<a href="http://spraakbanken.gu.se/sal/ws/">SALDO web services</a>. <a href="http://spraakbanken.gu.se/sal/ws/">SALDO web services</a>.
<li>To access the GF web service, it uses the <li>To access the GF web service, it uses the
<a href="http://en.wikipedia.org/wiki/JSON#JSONP">JSONP method</a> <a href="http://en.wikipedia.org/wiki/JSON#JSONP">JSONP method</a>
@@ -94,17 +95,17 @@ Some implementation details:
<em>or</em> if what you have entered exactly matches one of the remaining <em>or</em> if what you have entered exactly matches one of the remaining
magnet. magnet.
<li>[Added 2010-05-28] Added a link to make it easy to try the same sentence in <li>[Added 2010-05-28] Added a link to make it easy to try the same sentence in
<a href="http://translate.google.com">Google Translate</a>. <a href="http://translate.google.com">Google Translate</a>.This can be
This can be turned of by passing the option <code>{try_google:false}</code> to turned off by passing the option <code>{try_google:false}</code> to
<code>start_minibar</code>. <code>start_minibar</code>.
<li>[Added 2010-06-02] Added support for Help and Feedback buttons, controlled <li>[Added 2010-06-02] Added support for Help and Feedback buttons, controlled
by the options <code>feedback_url</code> and <code>help_url</code> passed to by the options <code>feedback_url</code> and <code>help_url</code> passed to
<code>start_minibar</code>. <code>start_minibar</code>.
<li>[Added 2010-06-02] New option: <code>default_source_language</code>. <li>[Added 2010-06-02] New option: <code>default_source_language</code>.
<li>[Added 2010-09-10] Minibar now automatically uses <li>[Added 2010-09-10] Minibar now automatically uses
<a href="http://en.wikipedia.org/wiki/Ajax_(programming)">AJAX</a> <a href="http://en.wikipedia.org/wiki/XMLHttpRequest">XHR</a>
instead of JSONP when possible (i.e. when the HTML document and the instead of JSONP when possible (i.e. when the HTML document and the
PGF server are on the same server). PGF service are on the same server).
<li>[Added 2010-09-10] The default input language is now the user's preferred <li>[Added 2010-09-10] The default input language is now the user's preferred
language, if possible. This is implemented by consulting the language, if possible. This is implemented by consulting the
<code>userLanguage</code> field in the grammar info output by pgf-server. <code>userLanguage</code> field in the grammar info output by pgf-server.
@@ -131,7 +132,7 @@ Some implementation details:
<a href="pgf_online.js">pgf_online.js</a>. <a href="pgf_online.js">pgf_online.js</a>.
<li>The minibar code has been rewritten to avoid storing state information <li>The minibar code has been rewritten to avoid storing state information
in the document tree and accessing it by referring to named document in the document tree and accessing it by referring to named document
elements. The code now also avoids using string literals contaning elements. The code now also avoids using string literals containing
the names of top-level functions to specify event handlers for buttons the names of top-level functions to specify event handlers for buttons
and menus. (The code is no longer introspective, so &alpha; conversion and menus. (The code is no longer introspective, so &alpha; conversion
will not change its meaning.) will not change its meaning.)
@@ -150,11 +151,13 @@ Some implementation details:
after every word. On touch-based devices, the on-screen keyboard kept after every word. On touch-based devices, the on-screen keyboard kept
popping up after every word, which was very annoying if you were popping up after every word, which was very annoying if you were
entering a sentence by tapping on the magnets. entering a sentence by tapping on the magnets.
<li>[Changed 2011-08-03] Moved the initialization code in minibar.html to
<a href="minibar_online.js">minibar_online.js</a>.
</ul> </ul>
<hr> <hr>
<small class=modtime> <small class=modtime>
<!-- hhmts start --> Last modified: Mon Apr 11 15:03:31 CEST 2011 <!-- hhmts end --> <!-- hhmts start --> Last modified: Wed Aug 3 16:14:22 CEST 2011 <!-- hhmts end -->
</small> </small>
<address> <address>
<a href="http://www.cs.chalmers.se/~hallgren/">TH</a> <a href="http://www.cs.chalmers.se/~hallgren/">TH</a>

View File

@@ -1,10 +1,12 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>GF web services API examples</title> <title>GF web services API examples</title>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8"> <meta charset="UTF-8">
<style type="text/css"> <style type="text/css">
body { background: #ddd; } body { background: #ddd; }
h1, h2, h3, small, th { font-family: sans-serif; }
dt { background: #ffc; } dt { background: #ffc; }
dt.js { background: #cef; margin-bottom: 1ex; } dt.js { background: #cef; margin-bottom: 1ex; }
@@ -13,6 +15,9 @@ dd { background: white; margin-top: 1ex; margin-bottom: 1ex; }
dl.apiexamples>dt, dl.apiexamples>dd { font-family: monospace; } dl.apiexamples>dt, dl.apiexamples>dd { font-family: monospace; }
dl.apiexamples>dd { white-space: pre; } dl.apiexamples>dd { white-space: pre; }
div.modtime { float: right; }
.modtime { color: #666; white-space: nowrap; }
</style> </style>
<body> <body>
@@ -24,7 +29,7 @@ availiable in the GF shell is also available via the GF web services API.
<p> <p>
The The
<a href="http://code.google.com/p/grammatical-framework/wiki/GFWebServiceAPI">GF <a href="http://code.google.com/p/grammatical-framework/wiki/GFWebServiceAPI">GF
Web Service API</a> page describes the calls supported by the GF web service Web Service API page</a> describes the calls supported by the GF web service
API. Below, we illustrate these calls by examples, and also show API. Below, we illustrate these calls by examples, and also show
how to make these calls from JavaScript using the API defined in how to make these calls from JavaScript using the API defined in
<a href="http://www.grammaticalframework.org/src/runtime/javascript/minibar/pgf_online.js">pgf_online.js</a>. <a href="http://www.grammaticalframework.org/src/runtime/javascript/minibar/pgf_online.js">pgf_online.js</a>.
@@ -63,7 +68,8 @@ incomplete and might be made more complete in a future version...
<dd>["Foods.pgf","Phrasebook.pgf"] <dd>["Foods.pgf","Phrasebook.pgf"]
<dt class=js> // Select which grammar to use <dt class=js> // Select which grammar to use
<br>server.switch_grammar("Foods.pgf") <br>server.switch_grammar("Foods.pgf")
<dt class=js>// Get grammar info (this method could be renamed) <dt class=js>// Get concrete language list and other grammar info
(this method could be renamed)
<br>server.get_languages(callback) <br>server.get_languages(callback)
<dt>http://localhost:41296/grammars/Foods.pgf <dt>http://localhost:41296/grammars/Foods.pgf
<dd>{"name":"Foods", <dd>{"name":"Foods",
@@ -120,7 +126,9 @@ incomplete and might be made more complete in a future version...
"text":""}] "text":""}]
</dl> </dl>
<hr> <hr>
<!-- hhmts start --> Last modified: Mon Apr 11 14:47:59 CEST 2011 <!-- hhmts end --> <div class=modtime><small>
<!-- hhmts start --> Last modified: Wed Aug 3 15:33:17 CEST 2011 <!-- hhmts end -->
</small></div>
<address> <address>
<a href="http://www.cse.chalmers.se/~hallgren/>Thomas Hallgren</a> <a href="http://www.cse.chalmers.se/~hallgren/">TH</a>
</address> </address>

View File

@@ -33,7 +33,7 @@ div.word, span.word, div#words div, div#words input[type=button] {
.invalid { color: red; } .invalid { color: red; }
div.modtime { float: right; } div.modtime { float: right; }
.modtime { color: #444; white-space: nowrap; } .modtime { color: #666; white-space: nowrap; }
ul.space>li { margin-top: 0.75ex; } ul.space>li { margin-top: 0.75ex; }

View File

@@ -1,24 +1,20 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html>
<html> <head> <html>
<head>
<title>Minibar</title> <title>Minibar</title>
<link rel=stylesheet type="text/css" href="minibar.css"> <link rel=stylesheet type="text/css" href="minibar.css">
<script type="text/JavaScript" src="support.js"></script>
<script type="text/JavaScript" src="minibar.js"></script>
<script type="text/JavaScript" src="pgf_online.js"></script>
<meta name = "viewport" content = "width = device-width"> <meta name = "viewport" content = "width = device-width">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<meta charset="UTF-8"> <meta charset="UTF-8">
</head> </head>
<body> <body>
<h2>Minibar online</h2> <h2>Minibar online</h2>
<div id=minibar> <div id=minibar></div>
</div>
<noscript> <noscript>This page doesn't works unless JavaScript is enabled.</noscript>
This page doesn't works unless JavaScript is enabled.
</noscript>
<hr> <hr>
<small> <small>
@@ -27,7 +23,7 @@ This page doesn't works unless JavaScript is enabled.
&amp; <a href="http://www.grammaticalframework.org:41296/translate/">Translator</a>] &amp; <a href="http://www.grammaticalframework.org:41296/translate/">Translator</a>]
</small> </small>
<small class=modtime> <small class=modtime>
HTML <!-- hhmts start --> Last modified: Tue Mar 22 16:11:27 CET 2011 <!-- hhmts end --> HTML <!-- hhmts start --> Last modified: Wed Aug 3 15:09:58 CEST 2011 <!-- hhmts end -->
</small> </small>
<address> <address>
<a href="http://www.cse.chalmers.se/~hallgren/">TH</a> <a href="http://www.cse.chalmers.se/~hallgren/">TH</a>
@@ -54,11 +50,10 @@ var minibar_options= {
show_trees: true, show_trees: true,
show_grouped_translations: false, show_grouped_translations: false,
default_source_language: "Eng", default_source_language: "Eng",
feedback_url: "feedback.html", //feedback_url: "feedback.html",
try_google: true try_google: true
} }
var minibar=new Minibar(server,minibar_options,"minibar"); var minibar=new Minibar(server,minibar_options,"minibar");
</script>
</body> </body>
</html> </html>

View File

@@ -0,0 +1,25 @@
// minibar_demo.js, assumes that minibar.js and pgf_online.js have been loaded.
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
}
if(/^\?\/tmp\//.test(location.search)) {
online_options.grammars_url=location.search.substr(1);
}
var server=pgf_online(online_options);
var minibar_options= {
show_abstract: true,
show_trees: true,
show_grouped_translations: false,
default_source_language: "Eng",
//feedback_url: "feedback.html",
try_google: true
}
var minibar=new Minibar(server,minibar_options,"minibar");

View File

@@ -18,7 +18,9 @@ function pgf_online(options) {
}, },
pgf_call: function(cmd,args,cont) { pgf_call: function(cmd,args,cont) {
var url=this.current_grammar_url+"?command="+cmd; var url=this.current_grammar_url+"?command="+cmd;
for(var arg in args) url+="&"+arg+"="+encodeURIComponent(args[arg]); for(var arg in args)
if(args[arg]!=undefined)
url+="&"+arg+"="+encodeURIComponent(args[arg]);
http_get_json(url,cont); http_get_json(url,cont);
}, },
@@ -26,22 +28,22 @@ function pgf_online(options) {
this.pgf_call("grammar",{},cont); this.pgf_call("grammar",{},cont);
}, },
get_random: function(cont) { get_random: function(cont) { // cat, limit
this.pgf_call("random",{random:Math.random()},cont); this.pgf_call("random",{random:Math.random()},cont);
}, },
linearize: function(tree,to,cont) { linearize: function(tree,to,cont) { // tree, to
this.pgf_call("linearize",{tree:tree,to:to},cont); this.pgf_call("linearize",{tree:tree,to:to},cont);
}, },
complete: function(from,input,cont) { complete: function(from,input,cont) { // from, input, cat, limit
this.pgf_call("complete",{from:from,input:input},cont); this.pgf_call("complete",{from:from,input:input},cont);
}, },
parse: function(from,input,cont) { parse: function(from,input,cont) { // from, input cat
this.pgf_call("parse",{from:from,input:input},cont); this.pgf_call("parse",{from:from,input:input},cont);
}, },
translate: function(from,input,cont) { translate: function(from,input,cont) { // from, input, cat, to
this.pgf_call("translate",{from:from,input:input},cont); this.pgf_call("translate",{from:from,input:input},cont);
}, },
translategroup: function(from,input,cont) { translategroup: function(from,input,cont) { // from, input, cat, to
this.pgf_call("translategroup",{from:from,input:input},cont); this.pgf_call("translategroup",{from:from,input:input},cont);
} }