diff --git a/public/images/beaker.png b/public/images/beaker.png index dab2f46..047cd55 100644 Binary files a/public/images/beaker.png and b/public/images/beaker.png differ diff --git a/public/scripts/get.js b/public/scripts/get.js index 9bf80cf..0be71f3 100644 --- a/public/scripts/get.js +++ b/public/scripts/get.js @@ -20,8 +20,10 @@ $(document).ready(function() { shape = r.set(). push(ellipse). push(r.text(0, 30, node.label || node.id)); + shape.translate( $("#content").width()/2, 300 ); return shape; } + $('.beaker-image').css( "background-color", $('color').text() ); $('edge').each( function( index ) { var strings = $(this).text().split(","); if ( $(this).attr("color_d") == "#333" ) { @@ -29,15 +31,17 @@ $(document).ready(function() { } else { g.addNode( strings[1], { color : $(this).attr("color_d"), render : render } ); } - if ( $(this).attr("color_s") == "#333" ) { - g.addNode( strings[0], { color : getRandomColor(), render : render } ); - } else { - g.addNode( strings[0], { color : $(this).attr("color_s"), render : render } ); - } - if ( $(this).attr("weight") != "1" ) { - g.addEdge( strings[1], strings[0], { directed: true, label: $(this).attr("weight") } ); - } else { - g.addEdge( strings[1], strings[0], { directed: true } ); + if ( strings[0] != strings[1] ) { + if ( $(this).attr("color_s") == "#333" ) { + g.addNode( strings[0], { color : getRandomColor(), render : render } ); + } else { + g.addNode( strings[0], { color : $(this).attr("color_s"), render : render } ); + } + if ( $(this).attr("weight") != "1" ) { + g.addEdge( strings[1], strings[0], { directed: true, label: $(this).attr("weight") } ); + } else { + g.addEdge( strings[1], strings[0], { directed: true } ); + } } } ); for(e in g.edges) { diff --git a/public/styles/application.css b/public/styles/application.css index 066e414..85f62e0 100644 --- a/public/styles/application.css +++ b/public/styles/application.css @@ -38,6 +38,20 @@ svg { padding-top: 15px; } +.beaker-image { + background: url(../images/beaker.png) left top; + display: block; + float: left; + margin-top: 5px; + width: 32px; + height: 32px; +} + +.beaker-text { + display: block; + float: left; +} + .brand-image { background: url(../images/mixer.gif) left top; width: 32px; diff --git a/source/chemAPI.d b/source/chemAPI.d index 87bc3d3..a6d95c7 100644 --- a/source/chemAPI.d +++ b/source/chemAPI.d @@ -57,7 +57,13 @@ class ChemAPI : IChemAPI { } if ( reagents[id].object.keys.canFind( "parents" ) ) { foreach( j ; reagents[id]["parents"].array ) { - parents ~= `` ~ reagents[j.str]["name"].str ~ ``; + string rname; + if ( reagents[j.str].object.keys.canFind("name") ) { + rname = reagents[j.str]["name"].str; + } else { + rname = reagents[j.str]["id"].str; + } + parents ~= `` ~ rname ~ ``; } } if ( parents.length <= 0 ) { @@ -65,7 +71,13 @@ class ChemAPI : IChemAPI { } if ( reagents[id].object.keys.canFind( "required_reagents" ) ) { foreach( j ; reagents[id]["required_reagents"].object.keys ) { - children ~= `` ~ reagents[j]["name"].str ~ ``; + string rname; + if ( reagents[j].object.keys.canFind("name") ) { + rname = reagents[j]["name"].str; + } else { + rname = reagents[j]["id"].str; + } + children ~= `` ~ rname ~ ``; } } if ( children.length <= 0 ) { @@ -84,7 +96,7 @@ class ChemAPI : IChemAPI { children = ["Unknown"]; color = "#FFF"; } - render!("get.dt", html, name, description, parents, children ); + render!("get.dt", html, name, description, parents, children, color ); } void index() { render!("index.dt", sorted_reagents); diff --git a/views/get.dt b/views/get.dt index 67ec770..0eabc20 100644 --- a/views/get.dt +++ b/views/get.dt @@ -1,7 +1,8 @@ extends layout block body - h1!= name + .beaker-image + h1.beaker-name != name p!= description hr #canvas.canvas @@ -18,6 +19,7 @@ block body - foreach( str ; parents ) tr td!= str + color(hidden)!= color |!= html block after