quodatum/graphxq
1
0
Fork 0
mirror of https://github.com/Quodatum/graphxq.git synced 2025-11-04 06:21:57 +00:00
Code Issues Projects Releases Wiki Activity

intial panzoom svg

Browse source
This commit is contained in:
Andy Bunce 2012-09-14 22:13:11 +01:00
parent 563bdec1f8
commit 74916f723f
4 changed files with 33 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/graphxq.xqm
View file

@ -49,12 +49,19 @@ function graphxq-svg($dot,$url,$dl) {
return ($down[$dl],$svg) return ($down[$dl],$svg)
}; };
(:~
: display dot edit form
: @param src load from url
:)
declare declare
%rest:GET %rest:path("graphxq/dot") %rest:GET %rest:path("graphxq/dot")
%output:method("html5") %output:method("html5")
function dotform(){ %rest:form-param("src","{$src}")
function dotform($src){
let $dot:= getdot("digraph {{a -> b}}",$src)
let $map:=map{"list-shapes":=dotui:shapes(""), let $map:=map{"list-shapes":=dotui:shapes(""),
"list-colors":=dotui:colors("")} "list-colors":=dotui:colors(""),
"dot":=$dot}
return render("graphxq/views/dotform.xml",$map) return render("graphxq/views/dotform.xml",$map)
}; };
@ -97,7 +104,15 @@ declare %private function get-svg($dot as xs:string) as node(){
}; };
declare function render($template,$locals){ declare function render($template,$locals){
let $default:=map{"sidebar":="Sidebar..." , let $sidebar:=<div>
<ul>
<div>Smples:</div>
<li> <a href="dot?src=graphxq/samples/process.gv">process</a></li>
<li><a href="/restxq/graphxq/dot?src=graphxq/samples/unix.gv">unix</a></li>
<li> <a href="/restxq/graphxq/dot?src=graphxq/samples/root.gv">root (slow)</a></li>
</ul>
</div>
let $default:=map{"sidebar":=$sidebar ,
"usermenu":=<div>users</div>, "usermenu":=<div>users</div>,
"title":=request:path(), "title":=request:path(),
"messages":=()} "messages":=()}

1
src/graphxq/app.js
View file

@ -71,6 +71,7 @@ function getsvg(dl){
var n = document.importNode(data.documentElement,true); var n = document.importNode(data.documentElement,true);
$("#svgdiv").empty().append(n); $("#svgdiv").empty().append(n);
$("#svgsrc").empty().text(str); $("#svgsrc").empty().text(str);
$("#svgdiv svg").svgPan("graph1");
} }
}); });
}; };

7
src/graphxq/jquery-svgpan.js vendored
View file

@ -163,9 +163,10 @@
offsetX = evt.pageX - offset.left; offsetX = evt.pageX - offset.left;
offsetY = evt.pageY - offset.top; offsetY = evt.pageY - offset.top;
} }
p.x = evt.originalEvent.clientX - root.getBoundingClientRect().left;
p.x = offsetX; p.y = evt.originalEvent.clientY - root.getBoundingClientRect().top;
p.y = offsetY; // p.x = offsetX;
// p.y = offsetY;
return p; return p;
}, },

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

@ -8,17 +8,14 @@
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane active" id="tab-dot"> <div class="tab-pane active" id="tab-dot">
<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>
<form id="dotForm" action= "svg" method="post" target="_new" class="well"> <form id="dotForm" action= "svg" method="post" target="_new" class="well">
<label>digraph " <label>digraph "
<input type="text" name="title" placeholder="title" class="input-small" />"{{ <input type="text" name="title" placeholder="title" class="input-small" />"
</label> </label>
<span style="margin-right:-5px;padding-right:2px;">{{</span>
<textarea id="dot" name="dot" rows="2" style="width:94%;min-height:20em">digraph {{ a -> b}}</textarea>}} <textarea id="dot" name="dot" rows="2" style="width:90%;min-height:20em"
>{$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>
@ -58,6 +55,11 @@
</div> </div>
</div> </div>
<div class="span6"> <div class="span6">
<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>
<div id="svgdiv" style="width:100%;height:30em;border:1px solid red;min-height:20em;">svg here</div> <div id="svgdiv" style="width:100%;height:30em;border:1px solid red;min-height:20em;">svg here</div>
</div> </div>
<script> <script>