From d4638f54bad7523907ebb6502af48470351d8f9e Mon Sep 17 00:00:00 2001 From: hallgren Date: Mon, 8 Aug 2011 17:28:24 +0000 Subject: minibar: refactoring for improved modularity Two smaller objects have been factored out from the Minibar object: Input and Translations. These have been placed in two separate files: minibar_input.js and minibar_translations.js. Some common auxiliary functions have also been moved to a separate file: minibar_support.js --- src/runtime/javascript/minibar/minibar.js | 427 ++---------------------------- 1 file changed, 21 insertions(+), 406 deletions(-) (limited to 'src/runtime/javascript/minibar/minibar.js') diff --git a/src/runtime/javascript/minibar/minibar.js b/src/runtime/javascript/minibar/minibar.js index 8580037eb..d0a1a9053 100644 --- a/src/runtime/javascript/minibar/minibar.js +++ b/src/runtime/javascript/minibar/minibar.js @@ -21,8 +21,9 @@ function start_minibar(server,opts,target) { return new Minibar(server,opts,target); } +/* --- Main Minibar object -------------------------------------------------- */ function Minibar(server,opts,target) { - // Typically called when the HTML document is loaded + // Contructor, typically called when the HTML document is loaded /* --- Configuration ---------------------------------------------------- */ @@ -42,30 +43,25 @@ function Minibar(server,opts,target) { // Apply supplied options if(opts) for(var o in opts) this.options[o]=opts[o]; + /* --- Creating the components of the minibar --------------------------- */ + this.translations=new Translations(server,this.options) + this.input=new Input(server,this.options,this.translations) + /* --- Creating user interface elements --------------------------------- */ - this.surface=div_id("surface"); + this.menubar=empty("div"); 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.innerHTML=""; with(this) { - appendChildren(minibar,[menubar,surface,words,translations,extra]); + appendChildren(menubar,[input.menus,translations.menus,input.buttons]) + appendChildren(minibar,[menubar,input.main,translations.main,extra]); 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; - this.current={from: null, input: ""}; - this.previous=null; this.server=server; @@ -76,27 +72,17 @@ function Minibar(server,opts,target) { } } -/* --- Auxiliary functions ---------------------------------------------- */ - Minibar.prototype.show_grammarlist=function(grammars) { - debug(this) + this.grammar_menu=empty_id("select","grammar_menu"); 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]); + insertFirst(menubar,grammar_menu); + insertFirst(menubar,text("Grammar: ")); } - appendChildren(menubar, - [text(" From: "), from_menu, - text(" To: "), to_menu, - 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]); @@ -106,337 +92,20 @@ Minibar.prototype.show_grammarlist=function(grammars) { 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)); + function change_grammar() { + t.server.grammar_info(bind(t.change_grammar,t)); } - t.server.switch_grammar(grammar_name,get_languages); + t.server.switch_grammar(grammar_name,change_grammar); } -Minibar.prototype.show_languages=function(grammar_info) { +Minibar.prototype.change_grammar=function(grammar_info) { var t=this; with(t) { //debug("show_languages "); grammar=grammar_info; - var new_language=function () { - current.from=from_menu.value; - clear_all(); - } - from_menu.onchange=bind(new_language,t); - update_language_menu(from_menu,grammar); - set_initial_language(options,from_menu,grammar); - - to_menu.onchange=bind(get_translations,t); - - update_language_menu(to_menu,grammar); - insertFirst(to_menu,option("All","All")); - to_menu.value="All"; - - new_language(); - } -} - -Minibar.prototype.clear_all1=function() { - with(this) { - remove_typed_input(); - current.input=""; - previous=null; - surface.innerHTML=""; - translations.innerHTML=""; - } -} - -Minibar.prototype.clear_all=function() { - with(this) { - clear_all1(); - get_completions(); - } -} - -Minibar.prototype.get_completions=function() { - with(this) { - //debug("get_completions "); - words.innerHTML="..."; - server.complete({from:current.from,input: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(); - } -} - -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;i0) { - 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;i0) - 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({from:c.from,input:c.input}, - bind(show_groupedtranslations,this)); - else - server.translate({from:c.from,input: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) { - if(!surface.typed) { - var 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({tree:abs[0].tree,to: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;i0 && s2[0]==" ") s2=s2.substr(1); - surface.typed.value=s2; - } - else surface.typed.value=""; - } - get_completions(); - } -} - -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=""; - get_completions(); - } - } -} - -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 1) tbody.appendChild(tr([td(text(lin[i].tree))])); - } - trans.appendChild(wrap("table",tbody)); - } - } + input.change_grammar(grammar) + translations.change_grammar(grammar) } } @@ -469,48 +138,13 @@ Minibar.prototype.open_help=function() { 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}; + minibar.state={grammar:grammar,current:input.current, + to:translations.to_menu.value, + translations: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