Wide Coverage Translation Demo: zoomable panable collapsible syntax trees

This is an experimental solution using JavaScript code from
https://github.com/christos-c/tree-viewer, d3js.org and jquery.com.

1 files changed, 18 insertions, 5 deletions

diff --git a/src/www/js/wc.js b/src/www/js/wc.js
index 67fb742ca..31fc9a950 100644
--- a/src/www/js/wc.js
+++ b/src/www/js/wc.js
@@ -112,7 +112,7 @@ wc.translate=function() {
 		    if(wc.e2) wc.e2.innerHTML=lins[0].text
 		}
 		function get_inflections() {
-		    var tree="MkDocument+%22%22+(Inflection"+wcls+" "+w+") %22%22"
+		    var tree="MkDocument+%22%22+(Inflection"+wcls+"+"+w+")+%22%22"
 		    var l=gftranslate.grammar+f.to.value
 		    gftranslate.call("?command=c-linearize&to="+l+"&tree="+tree,show_inflections)
 		}
@@ -134,12 +134,12 @@ wc.translate=function() {
 	    if(e) {
 		e.innerHTML=prob+"<br>"
 		if(r.tree) {
-		    wc.e2=empty_class("div","e2")
-		    var t=wrap("span",treetext(r.tree))
-		    e.appendChild(t)
+		    wc.e2=node("div",{id:"tree-container","class":"e2"})
+		    e.appendChild(wrap("span",treetext(r.tree)))
+		    /*
 		    var g=gftranslate.jsonurl
 		    var u="format=svg&tree="+encodeURIComponent(r.tree)
-		    var from="&from="+gftranslate.grammar+f.to.value
+		    var from="&from="+r.grammar+f.to.value
 		    r.imgurls=[g+"?command=c-abstrtree&"+u,
 			       g+"?command=c-parsetree&"+u+from]
 		    if(!r.img) {
@@ -153,7 +153,9 @@ wc.translate=function() {
 		    else if(r.img.src!=r.imgurls[r.img_ix]) // language change?
 			r.img.src=r.imgurls[r.img_ix]
 		    wc.e2.appendChild(r.img)
+		    */
 		    e.appendChild(wc.e2)
+		    d3Tree(wc.bracketsToD3(r.jsontree))
 		}
 	    }
 	    if(wc.p /*&& so.rs.length>1*/) show_picks()
@@ -351,6 +353,17 @@ wc.try_google=function() {
     w.focus()
 }
 
+wc.bracketsToD3=function(bs) {
+    if(bs.token) return {name:bs.token}
+    else if(bs.other) return {name:bs.other}
+    else if(bs.fun) {
+	var t={name:bs.fun}
+	if(bs.children/* && bs.children.length>0*/)
+	    t.children=bs.children.map(wc.bracketsToD3)
+	return t
+    }
+    else return {name:"??"}
+}
 
 // Update language selection menus with the languages supported by the grammar
 function init_languages() {