minibar&gfse: first working grammar extension interface in minibar

There are still some user interface wrinkles to iron out.

src/www/gfse/editor.css

@@ -117,3 +117,20 @@ div#minibar {
     padding: 5px;
     background: #ccc url("../minibar/brushed-metal.png");
 }
+
+table.page_overlay {
+    position: absolute;
+    top: 0; left: 0;
+    width: 100%; height: 100%;
+    background: rgba(0,0,0,0.5);
+}
+table.page_overlay>tr>td { text-align: center; vertical-align: middle; }
+
+div.grammar_extension {
+    display: inline-block;
+    border: 1px solid black;
+    background: #9df;
+    padding: 2ex;
+    margin: 2ex;
+    box-shadow: 10px 10px 10px rgba(0,0,0,0.3);
+}

src/www/gfse/editor.js

@@ -202,12 +202,18 @@ function show_compile_error(res,err_ind) {
     }
 }
 
-function compile_button(g,err_ind) {
+function compile_grammar(g,err_ind,cont) {
-    function compile() {
+    function show_error(res) {
-	replaceInnerHTML(err_ind,"Compiling...");
+	show_compile_error(res,err_ind);
-	replaceInnerHTML(compiler_output,"<h3>Compiling...</h3>");
+	if(cont) cont(res)
-	upload(g,function(res) { show_compile_error(res,err_ind) });
     }
+    replaceInnerHTML(err_ind,"Compiling...");
+    replaceInnerHTML(compiler_output,"<h3>Compiling...</h3>");
+    upload(g,show_error);
+}
+
+function compile_button(g,err_ind) {
+    function compile() { compile_grammar(g,err_ind) }
     var b=button("Compile",compile);
     b.title="Upload the grammar to the server to check it in GF for errors";
     return b;
@@ -215,18 +221,23 @@ function compile_button(g,err_ind) {
 
 function minibar_button(g,files,err_ind) {
     var b2;
-    function show_editor() { edit_grammar(g); }
 
-    function extend_grammar(cat0,fun_type0) {
+    function page_overlay(inner) {
+	return wrap_class("table","page_overlay",tr(td(inner)))
+    }
+
+    function extend_grammar(cat0,fun_type0,update_minibar) {
 	var fname0="New"+cat0;
 	var fun=parse_fun(fname0+" : " + fun_type0).ok;
 	var lins=[];
 	var dc=defined_cats(g),df=inherited_funs(g);
 	var cs=g.concretes
+	var ext=div_class("grammar_extension")
+	var overlay=page_overlay(ext);
 
 	function draw_extension() {
 	    var cat=fun.type[fun.type.length-1]
-	    files.innerHTML="<h4>Extending "+cat+"</h4>"
+	    ext.innerHTML="<h4>Extending "+cat+"</h4>"
 	    var ef=editable("span",draw_fun(g,fun,dc,df),g,edit_fun,
 			    "Edit this function")
 	    var tbl=empty_class("table","extension");
@@ -241,9 +252,9 @@ function minibar_button(g,files,err_ind) {
 				"Edit this linearization"))
 		tbl.appendChild(tr([th(text(concname(cs[i].langcode))),td(l)]));
 	    }
-	    files.appendChild(tbl);
+	    ext.appendChild(tbl);
-	    files.appendChild(button("OK",save_extension))
+	    ext.appendChild(button("OK",save_extension))
-	    files.appendChild(button("Cancel",cancel_extension))
+	    ext.appendChild(button("Cancel",cancel_extension))
 	}
 	function edit_fun(g,el) {
 	    function replace(s) {
@@ -260,21 +271,55 @@ function minibar_button(g,files,err_ind) {
 	}
 	function edit_lin(lc) {
 	    return function (g,el) {
-		function replace(s) {
+		function check(s,cont) {
-		    lins[lc]=s;
+		    function replace() {
-		    draw_extension();
+			lins[lc]=s;
-		    return null;
+			draw_extension();
+			return null;
+		    }
+		    function check2(msg) { if(msg) cont(msg); else replace(); }
+		    check_exp(s,check2);
 		}
-		string_editor(el,lins[lc] || "",replace);
+		string_editor(el,lins[lc] || "",check,true);
 	    }
 	}
-	function save_extension() { }
+	function save_extension() {
-	function cancel_extension() {
+	    function extend_grammar(newg) {
-	    goto_minibar();
+		newg.abstract.funs.push(fun);
+		var cs=newg.concretes
+		for(var ci in cs) {
+		    var lc=cs[ci].langcode
+		    if(lins[lc]) {
+			var lin={fun: fun.name, args: arg_names(fun.type),
+				 lin: lins[lc]}
+			cs[ci].lins.push(lin)
+		    }
+		}
+	    }
+	    function save_if_ok(res) {
+		if(res.errorcode=="OK") {
+		    extend_grammar(g);
+		    save_grammar(g);
+		    document.body.removeChild(overlay)
+		    if(update_minibar) update_minibar();
+		    //goto_minibar();
+		}
+	    }
+	    // This is not functional programming, so copy the grammar first...
+	    var newg=JSON.parse(JSON.stringify(g));
+	    extend_grammar(newg)
+	    compile_grammar(newg,err_ind,save_if_ok);
 	}
+	function cancel_extension() {
+	    document.body.removeChild(overlay)
+	    //goto_minibar();
+	}
+	document.body.appendChild(overlay)
 	draw_extension();
     }
 
+    function show_editor() { edit_grammar(g); }
+
     function goto_minibar() {
 	clear(files);
 	files.appendChild(div_id("minibar"));
@@ -299,15 +344,8 @@ function minibar_button(g,files,err_ind) {
 	    insertAfter(b2,b);
 	}
     }
-    function goto_minibar_if_ok(res) {
+    function goto_minibar_if_ok(res) { if(res.errorcode=="OK") goto_minibar(); }
-	show_compile_error(res,err_ind);
+    function compile() { compile_grammar(g,err_ind,goto_minibar_if_ok) }
-	if(res.errorcode=="OK") goto_minibar();
-    }
-    function compile() {
-	replaceInnerHTML(err_ind,"Compiling...");
-	replaceInnerHTML(compiler_output,"<h3>Compiling...</h3>");
-	upload(g,goto_minibar_if_ok);
-    }
     var b=button("Minibar",compile);
     b.title="Upload the grammar and test it in the minibar";
     return b;
@@ -315,15 +353,10 @@ function minibar_button(g,files,err_ind) {
 
 function quiz_button(g,err_ind) {
     function goto_quiz(res) {
-	show_compile_error(res,err_ind);
 	if(res.errorcode=="OK")
 	    location.href="../TransQuiz/translation_quiz.html?"+local.get("dir")+"/"
     }
-    function compile() {
+    function compile() { compile_grammar(g,err_ind,goto_quiz) }
-	replaceInnerHTML(err_ind,"Compiling...");
-	replaceInnerHTML(compiler_output,"<h3>Compiling...</h3>");
-	upload(g,goto_quiz);
-    }
     var b=button("Quiz",compile);
     b.title="Upload the grammar and go to the translation quiz";
     return b;

src/www/minibar/minibar_input.js

@@ -390,9 +390,15 @@ Input.prototype.show_replacements=function(brackets,parent,tree) {
 		}
 		var ps=cat_info.producers;
 		clear(t.words);
-		if(t.options.extend_grammar) {
+		var extf=t.options.extend_grammar;
+		if(extf) {
+		    function update() {
+			console.log("update minibar")
+			t.grammar.browse={}; // clear cache
+			t.show_replacements(brackets,parent,tree)
+		    }
 		    extb=button("New "+cat+"...",
-				function() { t.options.extend_grammar(cat,fun_type)})
+				function() { extf(cat,fun_type,update)})
 		    t.words.appendChild(extb)
 		}
 		if(ps)

src/www/minibar/support.js

@@ -175,7 +175,7 @@ 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); }
+function tr(cells)    { return wrap("tr",cells); }
 
 function button(label,action,key) {
     var el=node("input",{"type":"button","value":label},[]);