From d66110f84eec765bb26ebaa716bbce79d6c90913 Mon Sep 17 00:00:00 2001
From: hallgren <hallgren@chalmers.se>
Date: Mon, 21 Nov 2011 15:24:29 +0000
Subject: [PATCH] gfse: example-based: some usability improvements

Instead of showing nothing, show disabled buttons and some expanatory text to
provide guidance for users getting started with example-based grammar writing.
---
 src/www/gfse/cloud2.js        |  4 ++--
 src/www/gfse/editor.css       |  2 +-
 src/www/gfse/editor.js        |  1 +
 src/www/gfse/example_based.js | 38 ++++++++++++++++++++++++-----------
 4 files changed, 30 insertions(+), 15 deletions(-)

diff --git a/src/www/gfse/cloud2.js b/src/www/gfse/cloud2.js
index 60e57f9ba..8a6f198f3 100644
--- a/src/www/gfse/cloud2.js
+++ b/src/www/gfse/cloud2.js
@@ -31,10 +31,10 @@ function upload(g) {
 	var form=node("form",{method:"post",action:"/cloud"},
 		      [hidden("dir",dir),hidden("command","make"),
 		       hidden(g.basename+".gf",show_abstract(g))])
-	var files = [g.basename+".gf"]
+	//var files = [g.basename+".gf"]
 	for(var i in g.concretes) {
 	    var cname=g.basename+g.concretes[i].langcode+".gf";
-	    files.push(cname);
+	    //files.push(cname);
 	    form.appendChild(hidden(cname,
 				    show_concrete(g.basename)(g.concretes[i])));
 	}
diff --git a/src/www/gfse/editor.css b/src/www/gfse/editor.css
index ef12fe8f5..ec92a8e01 100644
--- a/src/www/gfse/editor.css
+++ b/src/www/gfse/editor.css
@@ -52,7 +52,7 @@ div.template:hover
 .edit { color: orange; }
 .delete { color: red; }
 .error_message,.inError { color: red; }
-.template, .template .sep { color: #999; }
+.template, .template .sep, .unimportant { color: #999; }
 form { display: inline-block; }
 
 table.tabs {
diff --git a/src/www/gfse/editor.js b/src/www/gfse/editor.js
index 95c72d972..7f2112b6b 100644
--- a/src/www/gfse/editor.js
+++ b/src/www/gfse/editor.js
@@ -990,6 +990,7 @@ function inError(msg,el) {
 function kw(txt) { return wrap_class("span","kw",text(txt)); }
 function sep(txt) { return wrap_class("span","sep",text(txt)); }
 function ident(txt) { return wrap_class("span","ident",text(txt)); }
+function unimportant(txt) { return wrap_class("small","unimportant",text(txt)); }
 function indent(cs) { return div_class("indent",cs); }
 
 function indent_sortable(cs,sort) {
diff --git a/src/www/gfse/example_based.js b/src/www/gfse/example_based.js
index 966dcbecd..cd5d256b5 100644
--- a/src/www/gfse/example_based.js
+++ b/src/www/gfse/example_based.js
@@ -78,15 +78,24 @@ function exb_extra(g,ci) {
     function ask_poss() { ask_possibilities(g,ci) }
 
     if(navigator.onLine && g.concretes.length>1 && conc.example_based && !example_based[ci]) ask_poss();
-    return parser[conc.langcode] && g.concretes.length>1
-	? indent([text("Example based editing: "),
-		  conc.example_based
-		  ? node("span",{},[button("Stop",stop_exb),
-				    text(" Example language: "),
-				    exblangmenu()
-				   ])
-		  : button("Start",ask_poss)])
-	: text("")
+    var sb=button("Start",ask_poss)
+    if(parser[conc.langcode] && g.concretes.length>1)
+	return indent([wrap("small",text("Example-based editing: ")),
+		       conc.example_based
+		         ? node("span",{},
+				[button("Stop",stop_exb),
+				 wrap("small",text(" Example language: ")),
+				 exblangmenu()
+				])
+		         : sb])
+    else {
+	sb.disabled=true;
+	var why= g.concretes.length>1
+	    ? " ("+concname(conc.langcode)+" is not supported yet)"
+	    : " (Add another language to take examples from first.)"
+	return indent([unimportant("Example-based grammar editing: "), sb,
+	          unimportant(why)])
+    }
 }
 
 function fun_lincat(g,conc,fun) {
@@ -158,10 +167,15 @@ function exb_linbuttons(g,ci,f) {
     }
     var buttons=[];
     if(conc.example_based && eb) {
-	if(eb.exready[fun] && fun_lincat(g,conc,fun))
-	    buttons.push(button("By example",by_example))
-	if(eb.testable[fun] && f.eb_lin) {
+	if(f.template) {
+	    var byex=button("By example",by_example);
+	    if(!(eb.exready[fun] && fun_lincat(g,conc,fun)))
+		byex.disabled=true
+	    buttons.push(byex)
+	}
+	else {
 	    var b=button("Test it",test_it);
+	    if(!eb.testable[fun] || !f.eb_lin) b.disabled=true;
 	    buttons.push(b)
 	}
 	var exb_output=node("span",{"class":"exb_output"},[]);