minibar: restructured code and improved user interface

* Keyboard input and completion should now work much more smoothly:
  + When you press space, the current word will be completed (if incomplete)
    and a new magnet will be created. If there is more than one possible
    completion, no magnet is created, but the common prefix of the possible
    completions is added to the text box.
  + Instead of asking the server for possible completions every time a new
    letter is added to the curent word, minibar only ask for completions for
    whole words and then filters the list locally when more letters are entered,
    speeding things up when server responses are slow.

* Code restructuring:
  + The PGF server API has been moved to its own file: pgf_online.js. This
    allows it to be reused in other applicaitons without importing the entire
    minibar. It also allows minibar to be used with different server interfaces.
  + The minibar code has been rewritten to avoid storing state information
    in the document tree and accessing it by referring to named document
    elements. The code now also avoids using string literals contaning
    the names of top-level functions to specify event handlers for buttons
    and menus. (The code is no longer introspective, so alpha conversion will
    not change its meaning.)
This commit is contained in:
hallgren
2010-10-26 12:42:33 +00:00
parent 41edd0a84f
commit 4f7255dae2
4 changed files with 498 additions and 430 deletions

View File

@@ -1,25 +1,17 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <head>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<meta charset="UTF-8">
<title>Phrasebook</title>
<link rel=stylesheet type="text/css" href="minibar.css">
<script type="text/JavaScript" src="support.js"></script>
<script type="text/JavaScript" src="pgf_online.js"></script>
<script type="text/JavaScript" src="minibar.js"></script>
<script type="text/JavaScript">
var phrasebook_options={
// server: "http://localhost:41296",
// server: "http://tournesol.cs.chalmers.se:41296",
server: "http://www.grammaticalframework.org:41296",
grammar_list: ["Phrasebook.pgf"],
delete_button_text: "Del",
help_url: "http://www.grammaticalframework.org/examples/phrasebook/help-phrasebook.html",
feedback_url: "feedback.html",
default_source_language: "Eng"
}
</script>
<meta name = "viewport" content = "width = device-width">
</head>
</head>
<body onload="start_minibar(phrasebook_options)">
<body>
<div id=minibar></div>
@@ -27,11 +19,32 @@ var phrasebook_options={
<small>
Powered by <a href="http://www.grammaticalframework.org">GF</a>,
Powered by <a href="http://www.grammaticalframework.org/">GF</a>,
see <a href="http://www.grammaticalframework.org/examples/phrasebook/doc-phrasebook.html">doc</a>.
</small>
<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: ["Phrasebook.pgf"], // leave undefined to get list from server
}
var server=pgf_online(online_options);
var phrasebook_options={
delete_button_text: "Del",
help_url: "http://www.grammaticalframework.org/examples/phrasebook/help-phrasebook.html",
feedback_url: "feedback.html",
default_source_language: "Eng"
}
start_minibar(server,phrasebook_options)
</script>
</body>
</html>