1
0
forked from GitHub/gf-core

minibar: documentation and API work

This commit is contained in:
hallgren
2011-08-11 16:28:49 +00:00
parent 19d84b6de0
commit b2512234dd
6 changed files with 48 additions and 26 deletions

View File

@@ -160,11 +160,13 @@ Some implementation details:
<a href="minibar_translations.js">minibar_translations.js</a>.
Some common auxiliary functions have also been moved to a separate file:
<a href="minibar_support.js">minibar_support.js</a>.
<li>[Added 2011-08-09] Added some <a href="minibar-api.html">Minibar API</a>
documentation.
</ul>
<hr>
<small class=modtime>
<!-- hhmts start --> Last modified: Mon Aug 8 19:27:14 CEST 2011 <!-- hhmts end -->
<!-- hhmts start --> Last modified: Thu Aug 11 17:07:13 CEST 2011 <!-- hhmts end -->
</small>
<address>
<a href="http://www.cs.chalmers.se/~hallgren/">TH</a>

View File

@@ -29,7 +29,7 @@ div.modtime { float: right; }
<body>
<h1>Minibar API</h1>
The minibar is structured as three object:
The Minibar web app consists of the following objects:
<ul>
<li><a href="#Minibar">Minibar</a>
@@ -42,10 +42,10 @@ They are described below.
<h2 id=Minibar>The Minibar object</h2>
<p>
This is the complete Minibar web app. It is defined in
This object implements the complete Minibar web app. It is defined in
<a href="minibar.js">minibar.js</a>. It also uses the <code>Input</code>
and <code>Translations</code> objects, and some auxiliary functions defined
in <a href="minibar_support.js">minibar_support.js</a>
and <code>Translations</code> objects described below, and some auxiliary
functions defined in <a href="minibar_support.js">minibar_support.js</a>
and <a href="support.js">support.js</a>, so to use it in an
HTML file, you would normally include at least the following:
@@ -116,7 +116,7 @@ HTML file, you would normally include at least the following:
<h3>Constructor</h3>
<code>var input=new Input(server,options,translations)</code>
<code>var input=new Input(server,translations,options)</code>
<ul>
<li><code>server</code> is the PGF service object
@@ -134,17 +134,22 @@ HTML file, you would normally include at least the following:
</table>
<li><code>translations</code> is the object that is notified when the input
has changed. In the minibar, this is the object that display translations.
has changed. In the minibar, this is the object that display translations, but
other apps might of course use the entered text for other purposes.
The following methods will be called:
<ul>
<li><code>translations.clear()</code>
<li><code>translations.clear()</code> is called when there no entered
text.
<li><code>translations.translateFrom({from:<var>conc</var>,input:<var>string</code>})</code>
is called when the user has entered some text. The <code>from</code>
property is the name of the concrete syntax and the <code>input</code>
property is the entered text.
</ul>
</ul>
<h3>Properties and user interface</h3>
The <code>input</code> object created by the <code>Input</code>constructor
The <code>input</code> object created by the <code>Input</code> constructor
contains two field that the caller should add to the user interface:
<ul>
<li><code>input.main</code> is the main user interface where the current
@@ -221,7 +226,7 @@ should add to the user interface:
<hr>
<div class=modtime>
<small class=modtime>
HTML <!-- hhmts start --> Last modified: Tue Aug 9 17:55:19 CEST 2011 <!-- hhmts end -->
HTML <!-- hhmts start --> Last modified: Thu Aug 11 17:14:37 CEST 2011 <!-- hhmts end -->
</small>
</div>

View File

@@ -18,25 +18,21 @@ show_completions(complete_output)
// For backward compatibility:
function start_minibar(server,opts,target) {
return new Minibar(server,opts,target);
if(target) opts.target=target;
return new Minibar(server,opts);
}
/* --- Main Minibar object -------------------------------------------------- */
function Minibar(server,opts,target) {
function Minibar(server,opts) {
// Contructor, 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,
target: "minibar",
try_google: true,
feedback_url: null,
random_button: true,
help_url: null
}
@@ -45,14 +41,14 @@ function Minibar(server,opts,target) {
/* --- Creating the components of the minibar --------------------------- */
this.translations=new Translations(server,this.options)
this.input=new Input(server,this.options,this.translations)
this.input=new Input(server,this.translations,this.options)
/* --- Creating user interface elements --------------------------------- */
this.menubar=empty("div");
this.extra=div_id("extra");
this.minibar=element(target || "minibar");
this.minibar=element(this.options.target);
this.minibar.innerHTML="";
with(this) {
appendChildren(menubar,[input.menus,translations.menus,input.buttons])

View File

@@ -1,11 +1,21 @@
/* --- Input object --------------------------------------------------------- */
function Input(server,options,translations) {
// Input object constructor
this.options=options;
function Input(server,translations,opts) { // Input object constructor
this.server=server;
this.translations=translations;
// Default values for options:
this.options={
delete_button_text: "⌫",
default_source_language: null,
random_button: true,
}
// Apply supplied options
if(opts) for(var o in opts) this.options[o]=opts[o];
// User interface elements
this.main=empty("div");
this.menus=empty("span");
this.buttons=empty("span");

View File

@@ -22,4 +22,4 @@ var minibar_options= {
//feedback_url: "feedback.html",
try_google: true
}
var minibar=new Minibar(server,minibar_options,"minibar");
var minibar=new Minibar(server,minibar_options);

View File

@@ -1,8 +1,17 @@
/* --- Translations object -------------------------------------------------- */
function Translations(server,options) {
function Translations(server,opts) {
this.server=server;
this.options=options;
// Default values for options:
this.options={
show_abstract: false,
show_trees: false,
show_grouped_translations: true,
}
// Apply supplied options
if(opts) for(var o in opts) this.options[o]=opts[o];
this.main=empty("div");
this.menus=empty("span");