source: trunk/www/views/experiments/explorer/view/plotter.jsp @ 5924

Last change on this file since 5924 was 5924, checked in by Nicklas Nordborg, 10 years ago

References #1655: GUI improvements

Plot functions for spot data and in experiment explorer.

  • Property svn:eol-style set to native
  • Property svn:keywords set to Date Id
File size: 14.9 KB
Line 
1<%-- $Id: plotter.jsp 5924 2012-01-13 13:10:52Z nicklas $
2  ------------------------------------------------------------------
3  BioArray Software Environment (BASE) - http:// base.thep.lu.se/
4
5  This file is part of BASE - BioArray Software Environment.
6  Available at http://base.thep.lu.se/
7
8  BASE is free software; you can redistribute it and/or
9  modify it under the terms of the GNU General Public License
10  as published by the Free Software Foundation; either version 3
11  of the License, or (at your option) any later version.
12
13  BASE is distributed in the hope that it will be useful,
14  but WITHOUT ANY WARRANTY; without even the implied warranty of
15  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
16  GNU General Public License for more details.
17
18  You should have received a copy of the GNU General Public License
19  along with BASE. If not, see <http://www.gnu.org/licenses/>.
20  ------------------------------------------------------------------
21
22  @author Nicklas
23  @version 2.0
24--%>
25<%@ page pageEncoding="UTF-8" session="false"
26  import="net.sf.basedb.core.SessionControl"
27  import="net.sf.basedb.core.DbControl"
28  import="net.sf.basedb.core.Experiment"
29  import="net.sf.basedb.core.BioAssaySet"
30  import="net.sf.basedb.core.BioAssay"
31  import="net.sf.basedb.core.RawDataType"
32  import="net.sf.basedb.core.RawDataProperty"
33  import="net.sf.basedb.core.Formula"
34  import="net.sf.basedb.core.IntensityTransform"
35  import="net.sf.basedb.core.AnnotationType"
36  import="net.sf.basedb.core.ItemQuery"
37  import="net.sf.basedb.core.ItemResultList"
38  import="net.sf.basedb.core.Include"
39  import="net.sf.basedb.core.Permission"
40  import="net.sf.basedb.core.Item"
41  import="net.sf.basedb.core.data.ReporterData"
42  import="net.sf.basedb.core.query.Orders"
43  import="net.sf.basedb.core.query.Hql"
44  import="net.sf.basedb.core.query.Restrictions"
45  import="net.sf.basedb.core.query.Restriction"
46  import="net.sf.basedb.core.query.Expressions"
47  import="net.sf.basedb.clients.web.ExperimentExplorer"
48  import="net.sf.basedb.clients.web.Base"
49  import="net.sf.basedb.clients.web.DynamicUtil"
50  import="net.sf.basedb.clients.web.util.HTML"
51  import="net.sf.basedb.util.Values"
52  import="net.sf.basedb.clients.web.WebException"
53  import="net.sf.basedb.clients.web.taglib.table.TableColumn"
54  import="java.util.List"
55  import="java.util.LinkedList"
56%>
57<%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
58<%@ taglib prefix="t" uri="/WEB-INF/tab.tld" %>
59<%!
60private static void addFormulaOption(StringBuilder options, String formula, String title, String description)
61{
62  options.append("<option value=\"").append(HTML.encodeTags(formula)).append("\"");
63  options.append(" title=\"").append(HTML.encodeTags(description)).append("\"");
64  options.append(">").append(HTML.encodeTags(title)).append("\n");
65}
66%>
67<%
68final SessionControl sc = Base.getExistingSessionControl(pageContext, true);
69final float scale = Base.getScale(sc);
70final String ID = sc.getId();
71final DbControl dc = sc.newDbControl();
72try
73{
74  final int bioAssaySetId = Values.getInt(request.getParameter("bioAssaySetId"));
75  final int reporterIndex = Values.getInt(request.getParameter("reporterIndex"));
76  final int positionIndex = Values.getInt(request.getParameter("positionIndex"));
77  final String plotType = Values.getString(request.getParameter("type"), "assay");
78  final int annotationTypeId = Values.getInt(request.getParameter("annotationTypeId"));
79  final boolean needAverageMethod = positionIndex == ExperimentExplorer.SPOT_AVG;
80 
81  final BioAssaySet bas = BioAssaySet.getById(dc, bioAssaySetId);
82  final RawDataType rdt = bas.getRawDataType();
83  final Experiment experiment = bas.getExperiment();
84  final int maxRawMappings = bas.getMaxRawMappingsForSpot();
85  final IntensityTransform transform = bas.getIntensityTransform();
86  final ExperimentExplorer explorer = ExperimentExplorer.getExplorer(bas);
87  final ReporterData reporter = explorer.getReporter(dc, reporterIndex);
88  final List<AnnotationType> annotationTypes = explorer.getAnnotationTypes(dc, true);
89 
90  List<TableColumn> formulas = new LinkedList<TableColumn>();
91  DynamicUtil.addSpotColumns(formulas, dc, rdt.getChannels(), transform);
92  DynamicUtil.addFormulaColumns(formulas, dc, rdt, Formula.Type.COLUMN_EXPRESSION, 
93      transform, "", "", maxRawMappings == 1);
94  DynamicUtil.addExtraColumns(formulas, dc, bas, "ev", "#", "[Xtra] ");
95  if (maxRawMappings == 1)
96  {
97    DynamicUtil.addRawDataColumns(formulas, dc, rdt, "", "", "[Raw] ");
98  }
99 
100  StringBuilder formulaOptions = new StringBuilder();
101  for (TableColumn tc : formulas)
102  {
103    if (tc.getJepExpression() != null && tc.getDatatype().isNumerical())
104    {
105      if (!needAverageMethod || tc.getAverageMethod() != Formula.AverageMethod.NONE)
106      {
107        String jepExpression = tc.getJepExpression();
108        addFormulaOption(formulaOptions, jepExpression, tc.getTitle(), tc.getDescription());
109      }
110    }
111  }
112 
113  String title = HTML.encodeTags("Plot " + bas.getName());
114  final boolean hasCreateFilePermission = sc.hasPermission(Permission.CREATE, Item.FILE);
115  %>
116  <base:page type="popup" title="<%=title%>">
117  <base:head styles="tabcontrol.css" scripts="tabcontrol.js">
118  <script language="JavaScript">
119
120  var averageMethods = new Array();
121  <%
122  for (TableColumn tc : formulas)
123  {
124    if (tc.getJepExpression() != null && tc.getDatatype().isNumerical())
125    {
126      if (!needAverageMethod || tc.getAverageMethod() != Formula.AverageMethod.NONE)
127      {
128        %>
129        averageMethods[averageMethods.length] = '<%=tc.getAverageMethod().name()%>';
130        <%
131      }
132    }
133  }
134  %>
135 
136  function validate()
137  {
138    var frm = document.forms['plot'];
139    if (Main.trimString(frm.yFormula.value) == '')
140    {
141      alert("You must enter an expression for the Y axis");
142      frm.yFormula.focus();
143      return false;
144    }
145    return true;
146  }
147 
148  function getPlotType()
149  {
150    var frm = document.forms['plot'];
151    return Forms.getCheckedRadio(frm.plotType).value;
152  }
153
154  function plotTypeOnChange()
155  {
156    var plotType = getPlotType();
157    var frm = document.forms['plot'];
158    var isAssayPlot = plotType == 'assay';
159    frm.annotationTypeId.disabled = isAssayPlot;
160    frm.subtype.disabled = !isAssayPlot;
161  }
162 
163  function presetOnChange(list, formula, label)
164  {
165    var index = list.selectedIndex;
166    var frm = list.form;
167    if (frm.averageMethod)
168    {
169      var avgMethod = averageMethods[index-1];
170      Forms.selectListOption(frm.averageMethod, avgMethod);
171    }
172    formula.value = list[index].value;
173    if (label && list[index].value != '') label.value = list[index].text;
174    list.selectedIndex = 0;
175  }
176   
177  function generatePlotUrl(fullSize)
178  {
179    if (validate())
180    {
181      var frm = document.forms['plot'];
182      var url = getRoot() + 'views/experiments/explorer/plot';
183      url += '?ID=<%=ID%>&bioAssaySetId=<%=bioAssaySetId%>';
184      url += '&reporterIndex=<%=reporterIndex%>&positionIndex=<%=positionIndex%>';
185      url += '&title='+Main.encodeURI(frm.title.value);
186      url += '&subTitle='+Main.encodeURI(frm.subTitle.value);
187      if (fullSize)
188      {
189        url += '&width='+frm.width.value;
190        url += '&height='+frm.height.value;
191      }
192     
193      url += '&y='+Main.encodeURI(frm.yFormula.value);
194      url += '&yLog='+(frm.yLog.checked ? 1 : 0);
195      url += '&yLabel='+Main.encodeURI(frm.yLabel.value);
196     
197      var plotType = getPlotType();
198      url += '&type='+plotType;
199      url += '&showXLabels='+(frm.hideXLabels.checked ? 0 : 1);
200     
201      if (plotType == 'assay')
202      {
203        url += '&subtype=' + frm.subtype[frm.subtype.selectedIndex].value;
204        if (frm.averageMethod)
205        {
206          url += '&averageMethod=' + frm.averageMethod[frm.averageMethod.selectedIndex].value;
207        }
208      }
209      else if (plotType == 'annotation')
210      {
211        url += '&annotationTypeId=' + frm.annotationTypeId[frm.annotationTypeId.selectedIndex].value;
212      }
213      url += '&' + new Date().getTime();
214      return url;
215    }
216  }
217 
218  function openExpressionBuilder(title, frmName, inputName, formulaType)
219  {
220    if (!document.forms[frmName][inputName].disabled)
221    {
222      var restrictions = formulaType == '<%=Formula.Type.COLUMN_RESTRICTION.name()%>';
223      Main.expressionBuilder('<%=ID%>', title, frmName, inputName, formulaType, '<%=rdt.getId()%>', <%=rdt.getChannels()%>, restrictions, <%=bas.getId()%>);
224    }
225  }
226 
227  function previewPlot()
228  {
229    var url = generatePlotUrl(false);
230    if (url)
231    {
232      url += '&width=540&height=360';
233
234      var overlayImg = document.getElementById('overlay');
235      overlayImg.src = getRoot()+'images/plot_generating.gif';
236     
237      var previewImg = document.getElementById('preview');
238      previewImg.realImg = new Image();
239      previewImg.realImg.onload = changePreviewImage;
240      previewImg.realImg.src = url;
241    }
242  }
243 
244  function changePreviewImage()
245  {
246    var previewImg = document.getElementById('preview');
247    previewImg.src = previewImg.realImg.src;
248    previewImg.realImg = null;
249    var overlayImg = document.getElementById('overlay');
250    overlayImg.src = getRoot() + 'images/blankbutton.gif';
251  }
252 
253  function viewPlot()
254  {
255    var url = generatePlotUrl(true);
256    if (url)
257    {
258      var frm = document.forms['plot'];
259      var width = parseInt(frm.width.value);
260      var height = parseInt(frm.height.value);
261      if (!width || width < 600) width = 600;
262      if (!height || height < 400) height = 400;
263      Main.openPopup('../../plotter/view.jsp?ID=<%=ID%>&title='+Main.encodeURI(frm.title.value), 'ViewPlot', width+150, height+100);
264    }
265  }
266 
267  function downloadPlot()
268  {
269    var url = generatePlotUrl(true);
270    if (url)
271    {
272      Main.openPopup('../../plotter/download.jsp?ID=<%=ID%>', 'DownloadPlot', 300, 200);
273    }
274  }
275 
276  function savePlotAs()
277  {
278    var url = generatePlotUrl(true);
279    if (url)
280    {
281      Main.openPopup('../../plotter/save_as.jsp?ID=<%=ID%>', 'SavePlotAs', 450, 300);
282    }
283  }
284 
285  function init()
286  {
287    plotTypeOnChange();
288  }
289  </script>
290  </base:head>
291  <base:body onload="init()">
292  <h1><%=title%> <base:help helpid="explorer.plotter" /></h1>
293  <form name="plot">
294  <div class="content bottomborder">
295    <div class="absolutefull rightborder" style="right: 550px;">
296 
297      <table class="fullform input100 smaller">
298      <tbody>
299      <tr>
300        <th>Plot title</th>
301        <td colspan="2"><input type="text" class="text" maxlength="255" name="title" 
302          value="<%=HTML.encodeTags(bas.getName())%>"></td>
303      </tr>
304      <tr>
305        <th class="subprompt">Subtitle</th>
306        <td colspan="2"><input type="text" class="text" maxlength="255" name="subTitle" 
307          value="<%=HTML.encodeTags(reporter.getName())%>"></td>
308      </tr>
309        <tr>
310          <th>Width</th>
311          <td colspan="2"><input type="text" class="text" style="width: 10em;" maxlength="10" name="width" 
312            value="900" onkeypress="return Numbers.integerOnly(event)"> (not used by preview)</td>
313        </tr>
314        <tr>
315          <th>Height</th>
316          <td colspan="2"><input type="text" class="text" style="width: 10em;" maxlength="10" name="height" 
317            value="600" onkeypress="return Numbers.integerOnly(event)"></td>
318        </tr>
319        <tr>
320          <th class="subprompt"></th>
321          <td colspan="2"></td>
322        </tr>
323      </tbody>
324     
325      <tbody class="simplesection">
326        <tr>
327          <th>Y-axis</th>
328          <td>
329          <select name="yPresets" style="width: 25em;"
330            onchange="presetOnChange(this, this.form.yFormula, this.form.yLabel)" 
331            >
332            <option value="">- select from list or enter formula below -
333            <%=formulaOptions.toString()%>
334          </select>
335          </td>
336          <td></td>
337        </tr>
338        <tr>
339          <th class="subprompt">Expression</th>
340          <td><input type="text" class="text required" maxlength="255" name="yFormula"></td>
341          <td>
342            <base:icon
343              image="expression_builder.gif"
344              tooltip="Use the Expression builder"
345              onclick="openExpressionBuilder('Y-axis expression', 'plot', 'yFormula', 'COLUMN_EXPRESSION')"
346            />
347          </td>
348        </tr>
349        <tr>
350          <th class="subprompt">Label</th>
351          <td><input type="text" class="text" maxlength="255" name="yLabel"></td>
352          <td></td>
353        </tr>
354        <tr>
355          <th class="subprompt"><label for="yLog">Log scale</label></th>
356          <td><input type="checkbox" name="yLog" id="yLog" value="1"></td>
357          <td></td>
358        </tr>
359        <%
360        if (positionIndex == ExperimentExplorer.SPOT_AVG)
361        {
362          %>
363          <tr>
364            <th class="subprompt">Average method</td>
365            <td>
366              <select name="averageMethod">
367              <%
368              for (Formula.AverageMethod method : Formula.AverageMethod.values())
369              {
370                if (method != Formula.AverageMethod.NONE)
371                {
372                  %>
373                  <option value="<%=method.name()%>"><%=method.toString()%></option>
374                  <%
375                }
376              }
377              %>
378              </select>
379            </td>
380            <td></td>
381          </tr>
382          <% 
383        }
384        %>
385        <tr>
386          <th>X-axis</th>
387          <td>
388            <input type="radio" name="plotType" value="assay" onchange="plotTypeOnChange()"
389              id="plotTypeAssay" <%=plotType.equals("assay") ? "checked" : ""%>
390              ><label for="plotTypeAssay"
391              title="Creates a line/bar plot with bioassays along the x axis">Bioassays</label>
392            <input type="radio" name="plotType" value="annotation" onchange="plotTypeOnChange()"
393              id="plotTypeAnnotation" <%=plotType.equals("annotation") ? "checked" : ""%>
394              ><label for="plotTypeAnnotation" 
395              title="Creates a box plot with annotation values along the x axis">Annotation</label>
396          </td>
397          <td></td>
398        </tr>
399        <tr>
400          <th class="subprompt">Annotation</td>
401          <td>
402            <select name="annotationTypeId" class="selectionlist">
403            <%
404            for (AnnotationType at : annotationTypes)
405            {
406              String selected = at.getId() == annotationTypeId ? "selected" : "";
407              %>
408              <option value="<%=at.getId()%>" <%=selected%>><%=HTML.encodeTags(at.getName())%>
409              <%
410            }
411            %>
412            </select>
413          </td>
414          <td></td>
415        </tr>
416        <tr>
417          <th class="subprompt"><label for="hideXLabels">No labels</label></th>
418          <td><input type="checkbox" name="hideXLabels" id="hideXLabels" value="1"></td>
419          <td></td>
420        </tr>
421        <tr>
422          <th>Plot type</th>
423          <td>
424            <select name="subtype">
425            <option value="line">Line plot</option>
426            <option value="bar">Bar plot</option>
427            </select>
428          <td></td>
429        </tr>
430      </tbody>
431
432      <tr class="dynamic">
433        <th></th>
434        <td colspan="2"></td>
435      </tr>
436      </table>
437
438    </div>
439    <div class="absolutefull filled" style="width: 550px; left: auto;">
440      <img src="../../../../images/plot_empty.png" id="preview" 
441        style="position: absolute; top: 5px; z-index: 1;">
442      <img src="../../../../images/plot_select.png" id="overlay" 
443        style="position: absolute; top: 5px; z-index: 2;">
444    </div>
445 
446  </div>
447  </form>
448 
449  <base:buttongroup subclass="dialogbuttons">
450    <base:button title="Preview" onclick="previewPlot()" 
451      image="plotter_preview.gif" tooltip="Generate a preview of the plot" 
452    />
453    <base:button title="View&hellip;" onclick="viewPlot()" 
454      image="plotter.gif" tooltip="View a fullsized version of the plot (in a popup)" 
455    />
456    <base:button title="Download&hellip;" onclick="downloadPlot()" 
457      image="download.gif"
458      tooltip="Downlad a fullsized version of the plot to your computer" 
459    />
460    <base:button title="Save as&hellip;" onclick="savePlotAs()" 
461      image="saveas.gif"
462      disabled="<%=!hasCreateFilePermission%>"
463      tooltip="<%=hasCreateFilePermission ? 
464        "Save a fullsized version of the plot on the BASE server" :
465        "You don't have permission to create files" %>" 
466    />
467    <base:button onclick="window.close()" title="Close" />
468  </base:buttongroup>
469 
470  </base:body>
471  </base:page>
472  <%
473}
474finally
475{
476  if (dc != null) dc.close();
477}
478%>
Note: See TracBrowser for help on using the repository browser.