source: trunk/grails-app/views/visualize/index.gsp @ 1996

Last change on this file since 1996 was 1996, checked in by tjeerd@…, 11 years ago

First commit at interface visualization screen

File size: 4.3 KB
Line 
1<html>
2<head>
3        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
4        <meta name="layout" content="main"/>
5        <title>Visualization</title>
6       
7        <!--[if lt IE 9]><g:javascript src="jqplot/excanvas.js" /><![endif]-->
8        <g:javascript src="jqplot/jquery.jqplot.min.js" />
9        <link rel="stylesheet" type="text/css" href="<g:resource dir='css' file='jquery.jqplot.min.css' />" />
10       
11        <!-- jqPlot plugins -->
12        <g:javascript src="jqplot/plugins/jqplot.barRenderer.min.js" />
13        <g:javascript src="jqplot/plugins/jqplot.categoryAxisRenderer.min.js" />
14        <g:javascript src="jqplot/plugins/jqplot.pointLabels.min.js" />
15        <g:javascript src="jqplot/plugins/jqplot.canvasTextRenderer.min.js" /> 
16        <g:javascript src="jqplot/plugins/jqplot.canvasAxisLabelRenderer.min.js" />     
17
18        <g:javascript src="visualization.js" />
19        <link rel="stylesheet" type="text/css" href="<g:resource dir='css' file='visualization.css' />" />
20       
21        <script type="text/javascript">
22                // We store urls here because they depend on the grails configuration.
23                // This way, the URLs are always correct
24                var visualizationUrls = {
25                        "getStudies": "<g:createLink action="getStudies" />",
26                        "getFields": "<g:createLink action="getFields" />",
27                        "getVisualizationTypes": "<g:createLink action="getVisualizationTypes" />",
28                        "getData": "<g:createLink action="getData" />"
29                };
30        </script>
31</head>
32<body>
33       
34    <div id="data">
35        <div id="menu_container">
36            <form id="visualizationForm">
37                <div class="menu_spacer"> </div>
38                <div class="menu_item menu_item_fill" id="menu_study">
39                    <div class="menu_item_label">Studies <img src="./images/spinner.gif" class="spinner" /></div>
40                    <div class="menu_item_info"></div>
41                    <div class="formulier"><label for="study">Study</label><g:select from="${studies}" optionKey="id" optionValue="title" name="study" onChange="changeStudy();" noSelection="${['':'[SELECT OPTION]']}"/></div>
42                </div>
43                <div class="menu_arrow"> </div>
44                <div class="menu_item" id="menu_row">
45                    <div class="menu_item_label">Rows <img src="./images/spinner.gif" class="spinner" /></div>
46                    <div class="menu_item_info"></div>
47                    <div class="formulier"><label for="rows">Rows</label> <select id="rows" name="rows" onChange="changeFields('menu_row');"></select></div>
48                </div>
49                <div class="menu_item" id="menu_column">
50                    <div class="menu_item_label">Columns <img src="./images/spinner.gif" class="spinner" /></div>
51                    <div class="menu_item_info"></div>
52                    <div class="formulier"><label for="columns">Columns</label> <select id="columns" name="columns" onChange="changeFields('menu_column');"></select></div>
53                </div>
54                <div class="menu_arrow"> </div>
55                <div class="menu_item" id="menu_vis">
56                    <div class="menu_item_label">Type <img src="./images/spinner.gif" class="spinner" /></div>
57                    <div class="menu_item_info"></div>
58                    <div class="formulier"><label for="types">Type</label><select id="types" name="types" onChange="changeVis();"></select></div>
59                </div>
60                <div class="menu_arrow"> </div>
61                <div class="menu_item" id="menu_go">
62                    <input type="button" value="Visualize" onClick="visualize();"/><br /><input type="checkbox" name="autovis" id="autovis" CHECKED/><span style="font-size: small;">auto</span></div>
63                <div class="menu_spacer"> </div>
64            </form>
65        </div>
66
67        <div id="visualization_container">
68
69            <h1>Visualize your study</h1>
70
71            <div id="messages">
72                <g:if test="${flash.error}">
73                    <div class="errormessage">
74                        ${flash.error.toString().encodeAsHTML()}
75                    </div>
76                </g:if>
77                <g:if test="${flash.message}">
78                    <div class="message">
79                        ${flash.message.toString().encodeAsHTML()}
80                    </div>
81                </g:if>
82
83                <div id="ajaxError">
84                </div>
85            </div>
86
87            <div id="visualization">
88            </div>
89        </div>
90    </div>
91</body>
92</html>
93
94
95
Note: See TracBrowser for help on using the repository browser.