quodatum/graphxq
1
0
Fork 0
mirror of https://github.com/Quodatum/graphxq.git synced 2025-09-14 20:05:50 +01:00
Code Issues Projects Releases Wiki Activity

clean up

Browse source
This commit is contained in:
Andy Bunce 2013-01-22 22:17:44 +00:00
parent 32b10ad30b
commit 1ceb15b446
12 changed files with 294 additions and 325 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
src/graphxq/app.css
View file

@ -23,6 +23,9 @@ body {
} }
.navbar-fixed-top {
margin-bottom: 4px;
}
.quick-links { .quick-links {
list-style: none outside none; list-style: none outside none;
margin: 0; margin: 0;
@ -44,21 +47,6 @@ body {
top: 5px; top: 5px;
} }
/* XML verbatim */
.xmlverb-default { color: #333333; background-color: #ffffff;
font-size: 10pt;
font-family:"Courier New", Courier, mono; }
.xmlverb-element-name { color: #990000 }
.xmlverb-element-nsprefix { color: #666600 }
.xmlverb-attr-name { color: #660000 }
.xmlverb-attr-content { color: #000099; font-weight: bold }
.xmlverb-ns-name { color: #666600 }
.xmlverb-ns-uri { color: #330099 }
.xmlverb-text { color: #000000; font-weight: bold }
.xmlverb-comment { color: #006600; font-style: italic }
.xmlverb-pi-name { color: #006600; font-style: italic }
.xmlverb-pi-content { color: #006666; font-style: italic }
.xd { background-color: #cccccc; margin: 0px }
#editor { #editor {
margin: 0; margin: 0;
@ -69,45 +57,4 @@ body {
min-height:10em; min-height:10em;
} }
table.ret * th {
border: 1px solid white;
margin: 2px;
padding-left: 5px;
padding-right: 5px;
background-color: #BFCAEB;
text-align: left;
}
table.ret * td {
border: 1px solid white;
margin: 2px;
padding: 2px;
background-color: #EBEEF5;
vertical-align: top;
font-size: 9pt;
}
table.ret caption {
margin-top: 10px;
margin: 2px;
padding-left: 5px;
padding-right: 5px;
background-color: #EBEEF5;
text-align: left;
}
table.ret {
border-bottom: 1px solid #BFCAEB;
margin: 0px;
padding: 0px;
}
.break {
word-break: break-all;
-moz-hyphens: auto;
hyphens: auto;
}
.doctype{
display:inline-block;
width:6em;
text-align: center
}
form.form-table label {text-align:right}

15
src/graphxq/app.js
View file

@ -45,6 +45,21 @@ jQuery(function($) { $.extend({
} }
}); }); }); });
$(function(){
$('a[data-action="lDom"]').click(function (){
$("#leftPane").css('display','inline').removeAttr('class').addClass("span12");
$("#rightPane").removeAttr('class').css("display","none");
});
$('a[data-action="equality"]').click(function (){
$("#leftPane").css('display','inline').removeAttr('class').addClass("span6");
$("#rightPane").css('display','inline').removeAttr('class').addClass("span6");
});
$('a[data-action="rDom"]').click(function (){
$("#rightPane").css('display','inline').removeAttr('class').addClass("span12");
$("#leftPane").removeAttr('class').css("display","none");
});
});
$(document).ready(function(){ $(document).ready(function(){
$("#bnup").on("click",getsvg); $("#bnup").on("click",getsvg);

76
src/graphxq/graphxq.xqm
View file

@ -16,6 +16,7 @@ import module namespace request = "http://exquery.org/ns/request";
declare namespace svg= "http://www.w3.org/2000/svg"; declare namespace svg= "http://www.w3.org/2000/svg";
declare namespace rest = 'http://exquery.org/ns/restxq'; declare namespace rest = 'http://exquery.org/ns/restxq';
(:~ shared page wrapper :)
declare variable $grxq:layout:=fn:resolve-uri("views/layout.xml"); declare variable $grxq:layout:=fn:resolve-uri("views/layout.xml");
(:~ (:~
@ -24,15 +25,8 @@ declare variable $grxq:layout:=fn:resolve-uri("views/layout.xml");
declare declare
%rest:GET %rest:path("graphxq") %rest:GET %rest:path("graphxq")
%output:method("html") %output:version("5.0") %output:method("html") %output:version("5.0")
%rest:form-param("dot","{$dot}","") function about(){
%rest:form-param("url","{$url}") render("views/about.xml",map{"title":="GraphXQ"})
function graphxq($dot,$url) {
let $edot:=if($url) then "" else fn:encode-for-uri($dot)
let $dot2:=getdot($dot,$url)
let $svg:=dot2svg($dot)
let $map:=map{"dot":=$dot,"url":=$url,"svg":=$svg,"edot":=$edot}
let $page:=render("views/page1.xml",$map)
return $page
}; };
(:~ (:~
@ -70,9 +64,12 @@ declare
function dotform($src){ function dotform($src){
let $dot:= getdot("digraph {{a -> b}}",$src) let $dot:= getdot("digraph {{a -> b}}",$src)
let $svgwidget:=fn:doc("views/widget.svg") let $svgwidget:=fn:doc("views/widget.svg")
let $toolbar:=fn:doc("views/toolbar.xml")
let $map:=map{"list-shapes":=dotui:shapes(""), let $map:=map{"list-shapes":=dotui:shapes(""),
"list-colors":=dotui:colors(""), "list-colors":=dotui:colors(""),
"svgwidget":=$svgwidget, "svgwidget":=$svgwidget,
"toolbar":=$toolbar,
"title":="DOT editor",
"dot":=$dot} "dot":=$dot}
return render("views/dotform.xml",$map) return render("views/dotform.xml",$map)
}; };
@ -80,40 +77,35 @@ function dotform($src){
declare declare
%rest:GET %rest:path("graphxq/dotml") %rest:GET %rest:path("graphxq/dotml")
%output:method("html") %output:version("5.0") %output:method("html") %output:version("5.0")
function dotmlform(){ %rest:form-param("src","{$src}")
render("views/dotmlform.xml",map{}) function dotmlform($src){
let $svgwidget:=fn:doc("views/widget.svg")
let $toolbar:=fn:doc("views/toolbar.xml")
let $default:=<graph xmlns="http://www.martin-loetzsch.de/DOTML"><node id="test"/></graph>
let $dotml:= getdotml($default ,$src)
let $dotml:= fn:serialize($dotml)
let $v:=map{ "svgwidget":=$svgwidget,
"toolbar":=$toolbar,
"title":="DOTML editor",
"dotml":=$dotml}
return render("views/dotmlform.xml",$v)
}; };
(:~ static about page :)
declare
%rest:GET %rest:path("graphxq/about")
%output:method("html") %output:version("5.0")
function about(){
render("views/about.xml",map{})
};
(:~ static api page :) (:~ static api page :)
declare declare
%rest:GET %rest:path("graphxq/api") %rest:GET %rest:path("graphxq/api")
%output:method("html") %output:version("5.0") %output:method("html") %output:version("5.0")
function api(){ function api(){
render("views/api.xml",map{}) render("views/api.xml",map{"title":="API information"})
};
declare
%rest:GET %rest:path("graphxq/search")
%output:method("html") %output:version("5.0")
%rest:form-param("q", "{$q}")
function search($q ) {
let $map:=map{"q":=$q}
return render("views/search.xml",$map)
}; };
declare declare
%rest:GET %rest:path("graphxq/library") %rest:GET %rest:path("graphxq/library")
%output:method("html") %output:version("5.0") %output:method("html") %output:version("5.0")
function library( ) { function library( ) {
let $map:=map{ } let $map:=map{"title":="Samples"}
return render("views/library.xml",$map) return render("views/library.xml",$map)
}; };
@ -137,15 +129,21 @@ function api-dotml($dotml ) as node()
declare %private function getdot($dot as xs:string,$url) as xs:string{ declare %private function getdot($dot as xs:string,$url) as xs:string{
if($url) then if($url) then
try{fn:unparsed-text(fn:resolve-uri($url))} catch * { "digraph {{ failed to load remote }}" } try{fn:unparsed-text(fn:resolve-uri($url))} catch * { "digraph {{ failed to load remote }}" }
else else
$dot $dot
}; };
(:~ if url is defined then treat as url and fetch else use dotml :) (:~ if url is defined then treat as url and fetch else use dotml :)
declare %private function getdotml($dotml as xs:string,$url) as xs:string{ declare %private function getdotml($dotml as node(),$url) as node()
{
if($url) then if($url) then
try{fn:unparsed-text(fn:resolve-uri($url))} catch * { "digraph {{ failed to load remote }}" } try{
else fn:doc(fn:resolve-uri($url))
} catch * {
<graph xmlns="http://www.martin-loetzsch.de/DOTML">
<node id="fail"/>
</graph> }
else
$dotml $dotml
}; };
@ -161,18 +159,8 @@ declare %private function dot2svg($dot as xs:string) as node(){
: @params locals map of page variables : @params locals map of page variables
:) :)
declare function render($template as xs:string,$locals){ declare function render($template as xs:string,$locals){
let $sidebar:=<div>
<ul> let $default:=map{"usermenu":=<div>users</div>,
<div>Samples:</div>
<li> <a href="dot?src=samples/dot/process.gv">process</a></li>
<li><a href="dot?src=samples/dot/unix.gv">unix</a></li>
<li><a href="dot?src=samples/dot/root.gv">root (slow)</a></li>
<li><a href="dotml?src=samples/dotml/sample1.xml">dotml sample</a></li>
</ul>
</div>
let $default:=map{"sidebar":=$sidebar ,
"usermenu":=<div>users</div>,
"title":=request:path(), "title":=request:path(),
"messages":=()} "messages":=()}
let $locals:=map:new(($default,$locals)) let $locals:=map:new(($default,$locals))

10
src/graphxq/samples/dotml/cluster.xml Normal file
View file

@ -0,0 +1,10 @@
<graph xmlns="http://www.martin-loetzsch.de/DOTML"
file-name="graphs/bgcolor" rankdir="LR" bgcolor="#80FF80">
<node id="a"/>
<cluster id="c1" bgcolor="#FF8080">
<node id="b"/>
<node id="c"/>
<edge from="b" to="c"/>
</cluster>
<edge from="a" to="b"/>
</graph>

49
src/graphxq/views/about.xml
View file

@ -1,34 +1,53 @@
<div> <div>
<div > <div class="hero-unit">
<h1>About GraphXQ</h1> <h1>GraphXQ</h1>
<p> <p>A web interface to <a href="http://www.graphviz.org/" target="_blank">Graphviz</a>.
This application provides a web interface to <a href="http://www.graphviz.org/">Graphviz</a>. Graph descriptions can be entered in the
</p> <a href="http://www.graphviz.org/content/dot-language" target="_blank">Dot</a> language
<p> or in <a href="http://www.martin-loetzsch.de/DOTML" target="_blank">DOTML</a>.
The server side is written entirely in XQuery. It uses the A REST interface is provided (<a href="api">API</a>) that enables SVG generation to be used as a service.</p>
</div>
<div class="row">
<div class="span4">
<h2>Server</h2>
<p>The server side is written entirely in XQuery. It uses the
<a href="http://basex.org" target="_blank">BaseX</a> implementation. <a <a href="http://basex.org" target="_blank">BaseX</a> implementation. <a
href="http://docs.basex.org/wiki/RESTXQ" target="_blank">RestXQ</a> href="http://docs.basex.org/wiki/RESTXQ" target="_blank">RestXQ</a>
is used to map XQuery annotations to web server behavior. is used to map XQuery annotations to web server behavior.
</p> </p>
<p> <p> The graphviz <code>dot</code> executable is used to generate SVG from the DOT source.
This application includes DOTML developed by Martin Loetzsch The resultant SVG is viewed in an interface that provides pan and zoom functionality.
(<a href="http://www.martin-loetzsch.de/DOTML" target="_blank">http://www.martin-loetzsch.de/DOTML</a>). The SVG may also be viewed standalone or downloaded.</p>
DotML is a XML based syntax for the input language of the 'Dot' graph drawing tool from the AT&amp;T GraphViz suite. It can be transformed to the native syntax of the 'Dot' tool using XSLT. <p>This application includes DOTML developed by Martin Loetzsch.
</p> DOTML is a XML based syntax for the input language of the 'Dot'.</p>
</div>
<div class="span4">
<h2>Client</h2>
<p>The client side targets modern browsers. It was tested against Firefox 15 and Chrome 21. <p>The client side targets modern browsers. It was tested against Firefox 15 and Chrome 21.
</p> </p>
<p>Twitter <a href="http://twitter.github.com/bootstrap/index.html" <p>Twitter <a href="http://twitter.github.com/bootstrap/index.html"
target="_blank">Bootstrap</a> is used for the client side styling. target="_blank">Bootstrap</a> is used for the client side styling.
</p> </p>
<p>Client libraries are loaded from CDN where possible. In particular <p>Javascript libraries are loaded from CDN where possible. In particular
<a href="http://cdnjs.com" target="_blank">cdnjs.com</a> is used.</p> <a href="http://cdnjs.com" target="_blank">cdnjs.com</a> is used.</p>
<p>The resultant SVG is viewed in an interface that provides pan and zoom functionality.
The SVG may also be viewed standalone or downloaded.</p>
</div>
<div class="span4">
<h2>Bugs</h2> <h2>Bugs</h2>
<p>The SVG pan and zoom has problems, especially in Firefox. In part this maybe due <p>The SVG pan and zoom has problems, especially in Firefox. In part this maybe due
to firefox bugs</p> to firefox bugs</p>
<p>For reference this shows how the SVG <a href="/graphxq/viewbox/viewBox.svg">viewbox</a> <p>For reference this shows how the SVG <a href="/graphxq/viewbox/viewBox.svg">viewbox</a>
works.</p> works.</p>
</div> </div>
</div>
<hr/>
<footer>
<p>&#169; Andy Bunce 2013</p>
<ul class="quick-links"> <ul class="quick-links">
<!-- <!--
<li><iframe class="github-btn" <li><iframe class="github-btn"
@ -50,4 +69,6 @@ works.</p>
src="http://platform.twitter.com/widgets/tweet_button.html?count=horizontal&amp;id=twitter-widget-0&amp;lang=en&amp;original_referer=https%3A%2F%2Fgithub.com%2Fapb2006%2Fgraphxq&amp;size=m&amp;text=graphxq #xquery&amp;url=https%3A%2F%2Fgithub.com%2Fapb2006%2Fxqwebdoc&amp;via=apb1704" src="http://platform.twitter.com/widgets/tweet_button.html?count=horizontal&amp;id=twitter-widget-0&amp;lang=en&amp;original_referer=https%3A%2F%2Fgithub.com%2Fapb2006%2Fgraphxq&amp;size=m&amp;text=graphxq #xquery&amp;url=https%3A%2F%2Fgithub.com%2Fapb2006%2Fxqwebdoc&amp;via=apb1704"
allowtransparency="true" scrolling="no" frameborder="0"></iframe></li> allowtransparency="true" scrolling="no" frameborder="0"></iframe></li>
</ul> </ul>
</footer>
</div> </div>

96
src/graphxq/views/dotform.xml
View file

@ -1,51 +1,84 @@
<div class="row-fluid" > <div>
<div class="span6 extend"> <div class="row-fluid" style="height:24px">
{$toolbar}
</div>
<div class="row-fluid">
<div class="span6 extend" id="leftPane">
<ul class="nav nav-tabs"> <ul class="nav nav-tabs">
<li class="active"><a href="#tab-dot" data-toggle="tab">Dot</a></li> <li class="active">
<li><a href="#tab-defaults" data-toggle="tab">Defaults</a></li> <a href="#tab-dot" data-toggle="tab">Dot</a>
<li><a href="#tab-xml" data-toggle="tab">Raw XML</a></li> </li>
<li>
<a href="#tab-defaults" data-toggle="tab">Defaults</a>
</li>
<li>
<a href="#tab-xml" data-toggle="tab">Raw XML</a>
</li>
</ul> </ul>
<div class="tab-content" style="overflow:hidden;"> <div class="tab-content" style="overflow:hidden;">
<div class="tab-pane active " id="tab-dot" > <div class="tab-pane active " id="tab-dot">
<form id="dotForm" action= "svg" method="post" target="_new" class="well " > <form id="dotForm" action="svg" method="post" target="_new"
<label>digraph " class="well ">
<input type="text" name="title" placeholder="title" class="input-small" />" <label>
digraph "
<input type="text" name="title" placeholder="title" class="input-small" />
"
</label> </label>
<span style="margin-right:-5px;padding-right:2px;">{{</span> <span style="margin-right:-5px;padding-right:2px;">{{</span>
<textarea id="dot" name="dot" rows="100" style="width:90%;overflow:scroll" <textarea id="dot" name="dot" rows="100"
>{$dot}</textarea><span style="margin-right:-5px;">}}</span> style="width:90%;overflow:scroll">{$dot}</textarea>
<span style="margin-right:-5px;">}}</span>
<label class="checkbox"> <label class="checkbox">
<input name="dl" type="checkbox"/> Download <input name="dl" type="checkbox" />
Download
</label> </label>
</form > </form>
</div> </div>
<div class="tab-pane well" id="tab-defaults"> <div class="tab-pane well" id="tab-defaults">
<form id="frm-defaults" class="form-table"> <form id="frm-defaults" class="form-table">
<label>Title:<input type="text" value="" name="dotTitle" size="15"/></label> <label>
Title:
<input type="text" value="" name="dotTitle" size="15" />
</label>
<label>RankDir: <label>
<select name="rankdir" > RankDir:
<option value="rankdir=TB;" selected="selected" >TB (top -> bottom)</option> <select name="rankdir">
<option value="rankdir=TB;" selected="selected">TB (top
-> bottom)
</option>
<option value="rankdir=LR;">LR (left -> right)</option> <option value="rankdir=LR;">LR (left -> right)</option>
</select> </select>
</label> </label>
<label>Default Shape:<select name="shape" >{$list-shapes}</select></label> <label>
<label>Color:<select id="lstColors" width="10">{$list-colors}</select></label> Default Shape:
<select name="shape">{$list-shapes}</select>
</label>
<label>
Color:
<select id="lstColors" width="10">{$list-colors}</select>
</label>
<label>Background:<select name="bgcolor" >{$list-colors}</select></label> <label>
<label>Filter:<select name="filter" > Background:
<option value="Bumpy" >Bumpy</option> <select name="bgcolor">{$list-colors}</select>
<option value="" selected="selected" >(None)</option> </label>
<label>
Filter:
<select name="filter">
<option value="Bumpy">Bumpy</option>
<option value="" selected="selected">(None)</option>
<option value="grey_bevel_shadow">grey_bevel_shadow</option> <option value="grey_bevel_shadow">grey_bevel_shadow</option>
<option value="Bevel">Bevel</option> <option value="Bevel">Bevel</option>
<option value="MyFilter" >MyFilter</option> <option value="MyFilter">MyFilter</option>
<option value="MyShadow">MyShadow</option> <option value="MyShadow">MyShadow</option>
</select></label> </select>
</form> </label>
</form>
</div> </div>
@ -54,13 +87,9 @@
</div> </div>
</div> </div>
</div> </div>
<div class="span6"> <div class="span6" id="rightPane">
<div class="btn-group"> <div id="svgdiv" class="extend"
<button id="bnup" class="btn btn-mini" ><i class="icon-refresh"></i>Redraw</button> style="width:100%;height:30em;border: 1px solid #E3E3E3;min-height:20em;">{$svgwidget}</div>
<button id="bnsvg" class="btn btn-mini" ><i class="icon-fullscreen"></i>SVG</button>
<button id="bndn" class="btn btn-mini"><i class="icon-download-alt"></i>download</button>
</div>
<div id="svgdiv" class="extend" style="width:100%;height:30em;border: 1px solid #E3E3E3;min-height:20em;">{$svgwidget}</div>
</div> </div>
@ -69,4 +98,5 @@
getsvg(false) getsvg(false)
}}) }})
</script> </script>
</div>
</div> </div>

29
src/graphxq/views/dotmlform.xml
View file

@ -1,28 +1,17 @@
<div> <div>
<div class="row-fluid" style="height:1em"> <div class="row-fluid" style="height:24px">
ffdfd gffff gfgffgf {$toolbar}
</div> </div>
<div class="row-fluid" style="height:20em"> <div class="row-fluid" style="height:20em" >
<div class="span5"> <div class="span6" id="leftPane">
<form method="post" action="api/dotml" style="background-color:#EEEEEE;padding:8px;"> <form method="post" action="api/dotml" style="background-color:#EEEEEE;">
<div> <button type="submit">Redraw</button></div> <div> <button type="submit">Redraw</button></div>
<textarea name="dotml" rows="12" cols="80"> <textarea name="dotml" rows="100" style="width:90%;overflow:scroll">{$dotml}</textarea>
&lt;graph xmlns="http://www.martin-loetzsch.de/DOTML"
bgcolor="#80FF80" &gt;
&lt;node id="a" /&gt;
&lt;node id="b"/&gt;
&lt;node id="c"/&gt;
&lt;edge from="a" to="c" decorate="false" label="decorate='false'"/&gt;
&lt;edge from="b" to="c" decorate="true" label="decorate='true'"/&gt;
&lt;/graph&gt;
</textarea>
</form > </form >
</div> </div>
<div class="span5"> <div class="span6" id="rightPane">
<div style="width:100%;height:100%;border:5px solid red;">?</div> <div id="svgdiv" class="extend" style="width:100%;height:30em;border: 1px solid #E3E3E3;min-height:20em;">{$svgwidget}</div>
</div> </div>
</div> </div>
</div> </div>

32
src/graphxq/views/layout.xml
View file

@ -50,44 +50,19 @@
<div class="nav-collapse collapse"> <div class="nav-collapse collapse">
<ul class="nav"> <ul class="nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
New
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li> <li>
<a href="dot"><i class="icon-edit"></i> Dot</a> <a href="dot"><i class="icon-edit"></i> Dot</a>
</li> </li>
<li> <li>
<a href="dotml"><i class="icon-align-center"></i> DotML</a> <a href="dotml"><i class="icon-align-center"></i> DotML</a>
</li> </li>
</ul>
</li>
<li > <li >
<a href="library">Library</a> <a href="library"><i class="icon-book"></i> Library</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
About
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li>
<a href="about"><i class="icon-edit"></i> About</a>
</li> </li>
<li> <li>
<a href="api"><i class="icon-align-center"></i> API</a> <a href="api"><i class="icon-wrench"></i> API</a>
</li> </li>
</ul> </ul>
</li>
</ul>
<div class="btn-group pull-right">
<a href="##" rel="tooltip" title="Make the Directories side dominant" class="btn btn-mini" data-action="dirDom" data-placement="left"><i class="icon icon-indent-left"></i></a>
<a href="##" rel="tooltip" title="Make both sides equal" class="btn btn-mini" data-placement="left" data-action="equality"><i class="icon icon-resize-horizontal"></i></a>
<a href="##" rel="tooltip" title="Make the Documents side dominant" class="btn btn-mini" data-placement="left" data-action="fileDom"><i class="icon icon-indent-right"></i></a>
</div>
<div class="btn-group pull-right" style="margin-top:0px"> <div class="btn-group pull-right" style="margin-top:0px">
{$usermenu} {$usermenu}
@ -101,8 +76,7 @@
</div> </div>
<div class="container-fluid"> <div class="container-fluid">
<div class="row-fluid"> <div class="row-fluid">
<div id="content" class="span10">{$body}</div> {$body}
<div id="sidebar" class="span2 well">{$sidebar}</div>
</div> </div>
</div> </div>

29
src/graphxq/views/library.xml
View file

@ -1,5 +1,26 @@
<div> <div>
<!-- q,collection, hits --> <!-- q,collection, hits -->
<h1>No Library yet</h1> <h2>Samples</h2>
<ul>
</div> <li>
<a href="dot?src=samples/dot/process.gv">process</a>
(dot)
</li>
<li>
<a href="dot?src=samples/dot/unix.gv">unix</a>
(dot)
</li>
<li>
<a href="dot?src=samples/dot/root.gv">root (slow)</a>
(dot)
</li>
<li>
<a href="dotml?src=samples/dotml/sample1.xml">dotml </a>
(dotml)
</li>
<li>
<a href="dotml?src=samples/dotml/cluster.xml"> cluster</a>
(dotml)
</li>
</ul>
</div>

35
src/graphxq/views/page1.xml
View file

@ -1,35 +0,0 @@
<div>
<h1>RestXQ interface to graphviz</h1>
<p>Enter a string in the dot language
Examples: <a href="?dot=digraph {{ a -> b}}">digraph {{ a -> b}}</a>,
<a href="?hedge={{github|https://github.com/apb2006/hedgetree}}(ab({{tree|%23treexml}}))">another </a>
.</p>
<p> Or enter a Url to a xml document examples:
<a href="?url=graphxq/samples/process.dot">process</a>,
<a href="?">hedgeweb</a>
<a href="?url=https://raw.github.com/apb2006/hedgetree/master/src/hedgetree/samples/hedgeweb.xml">remote</a>
</p>
<form method="get" action="." style="background-color:#EEEEEE;padding:8px;">
<textarea name="dot" rows="2" cols="80">{$dot}</textarea>
<p></p>
<p>Or enter the url to a node XML source
<input name="url" value="{$url}" style="width:30em"/></p>
<button type="submit">Redraw</button>
</form >
<h2 id="isvg">Inline SVG</h2>
<div style="width:300px;height:200px">{$svg}</div>
<h2 id="svg">Object referencing <a href="svg?dot={$edot}&amp;url={$url}">svg</a>,
( <a href="svg?dl=1&amp;dot={$edot}&amp;url={$url}">download</a> svg)</h2>
<object height="150" width="300" data="svg?dot={$edot}&amp;url={$url}"
style="border:5px solid red;" type="image/svg+xml">
SVG Here
</object>
<h2 id="svgxml">SVG xml</h2>
<pre>
{fn:serialize($svg)}
</pre>
</div>

6
src/graphxq/views/search.xml
View file

@ -1,6 +0,0 @@
<div>
<!-- q,collection, hits -->
<h1>No Search Results yet</h1>
<p><b>Search results for: </b>{$q} <b> In collection: </b></p>
<ol></ol>
</div>

15
src/graphxq/views/toolbar.xml Normal file
View file

@ -0,0 +1,15 @@
<div>
<div class="btn-group">
<button id="bnup" class="btn btn-mini" ><i class="icon-refresh"></i>Redraw</button>
<button id="bnsvg" class="btn btn-mini" ><i class="icon-fullscreen"></i>SVG</button>
<button id="bndn" class="btn btn-mini"><i class="icon-download-alt"></i>download</button>
</div>
<!--
http://stackoverflow.com/questions/12101781/splitter-for-twitter-bootstrap
-->
<div class="btn-group pull-right">
<a rel="tooltip" title="Make the left side dominant" class="btn btn-mini" data-action="lDom" data-placement="left"><i class="icon icon-indent-left"></i></a>
<a rel="tooltip" title="Make both sides equal" class="btn btn-mini" data-placement="left" data-action="equality"><i class="icon icon-resize-horizontal"></i></a>
<a rel="tooltip" title="Make the right side dominant" class="btn btn-mini" data-placement="left" data-action="rDom"><i class="icon icon-indent-right"></i></a>
</div>
</div>