384bc7705a6222daa88c7f6e2194e0ff14fdbc4f
[scpubgit/stemmaweb.git] / root / src / relate.tt
1 [% WRAPPER header.tt
2         pagetitle = "Stemmaweb - Relationship mapper"
3         applicationjs = c.uri_for('/js/relationship.js')
4         applicationstyle = c.uri_for('/css/relationship.css')
5 %]
6 <script type="text/javascript">
7 $(function() {
8   $('#svgbasics').svg({loadURL: '[% svg_string %]', onLoad: svgLoaded});
9   $('#svgenlargement').svg({loadURL: '[% svg_string %]', onLoad: svgEnlargementLoaded});
10 });
11 </script>
12 [% END %]
13
14         <div id="graph_container">      
15         <div id="graph_underlay"></div>
16             <div id="visor"></div>
17             <div id="graph">
18                     <!-- width seems to need to be as wide as the graph -->
19                     <!-- a translation of -487 in the svg itself was needed to adjust the graph to the left of the div -->
20                     <!-- unclear how to cope with height that doesn't fit box -->
21                     <div id="svgbasics" style="height: 100px;"></div>
22                 </div>
23         </div>
24
25         <div id="enlargement_container">        
26                 <div id="enlargement">
27                 <div id="svgenlargement" style="height: 500px;"></div>
28                 </div>
29         </div>
30         
31         <div id="update_workspace_button"></div>
32         
33         <div id="dialog-form" title="Create relation between two nodes..">
34                 <form id="collapse_node_form">
35                 <fieldset>
36                         <input type="hidden" name="source_id" id="source_node_id"/>
37                         <input type="hidden" name="target_id" id="target_node_id"/>
38                         <label for="rel_type">Relation type..&nbsp;</label>
39                         <select name="rel_type" id="rel_type" class=".ui-widget select">
40                         </select>
41                         <br/><br/>
42                         <label for="scope">Scope of relation..&nbsp;</label>
43                         <select name="scope" id="scope" class=".ui-widget select">
44                         </select>
45                         <br/><br/>
46                         <label for="note">Annotation on note..&nbsp;</label>
47                         <input type="text" width="60" name="note" id="note" class=".ui-widget input" />
48                 </fieldset>
49         <div id="status"></div>         
50                 </form>
51         </div>
52         <div id="dialog_overlay"></div>
53
54     <div id="keymap">
55         <ul id="keymaplist">
56         </ul>
57     </div>
58     
59 [% PROCESS footer.tt %]