source: branches/uk_ac_ebi_Tab2MageImporter/jsp/uk/ac/ebi/nugo/plugins/experiment.jsp @ 524

Last change on this file since 524 was 524, checked in by mbayer, 14 years ago

have made more changes to the UI to satisfy IE requirements
also fixed a couple of minor bugs relating to the UI

File size: 21.8 KB
Line 
1<%@ page import="net.sf.basedb.core.*"%>
2<%@ page import="net.sf.basedb.clients.web.*"%>
3<%@ page import="net.sf.basedb.util.*"%>
4<%@ page import="java.util.*"%>
5
6<jsp:useBean id="inputDataBean" class="uk.ac.ebi.nugo.plugins.DataBean" scope="application"/>
7<!-- submits the form data back to the bean assuming that each form element is matched to a variable in the bean by the same name -->
8<jsp:setProperty name="inputDataBean" property="*"/>
9
10<%
11final SessionControl sc = Base.getExistingSessionControl(pageContext, true);
12final String ID = sc.getId();
13final String requestID = request.getParameter("requestId");
14
15//we also need to figure out the name/id of the currently selected experiment that this import is getting initiated from
16ItemContext cc = sc.getCurrentContext(Item.EXPERIMENT);
17int experimentID = cc.getId();
18DbControl dc = sc.newDbControl();
19Experiment experiment = Experiment.getById(dc,experimentID);
20String expName = experiment.getName();
21dc.close();
22
23//set the experiment id in the bean so we can get at it later in the plugin
24inputDataBean.setExperimentId(new Integer(experimentID).toString());
25 %>
26
27<html>
28
29<head>
30
31<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/styles.css" />
32<link rel="stylesheet" type="text/css" href="/base/include/styles/main.css">
33<link rel="stylesheet" type="text/css" href="/base/include/styles/size_m.css">
34
35<script language="JavaScript" src="<%= request.getContextPath()%>/include/scripts/main.js" type="text/javascript"></script>
36
37<script type="text/javascript">
38    function getScale()
39    {
40      return 1.0;
41    }
42    function selectArrayDesignOnClick()
43    {
44      var frm = document.forms['experimentData'];
45      var url = '<%= request.getContextPath()%>/lims/arraydesigns/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setArrayDesignCallback';
46      if (frm.accession.length > 0)
47      {
48        var id = Math.abs(parseInt(frm.accession[0].value));       
49        url += '&item_id='+id;
50      }
51      Main.openPopup(url, 'SelectArrayDesign', 1000, 700);
52    }
53    function setArrayDesignCallback(id, name)
54    {
55      var frm = document.forms['experimentData'];
56      var list = frm.accession;
57      if (list.length < 1 || list[0].value == '0') // >
58      {
59        Forms.addListOption(list, 0, new Option());
60      }
61      list[0].value = name;
62      list[0].text = name;
63      list.selectedIndex = 0;
64      parentsChanged = true;
65    }
66  //submits form
67  function submit()
68  {
69    document.experimentData.submit();
70  }
71
72    //function to display or hide a given element
73    function showHideItems(myItem, myButton)
74    {
75       //this is the ID of the hidden item
76      var myItem = document.getElementById(myItem);
77
78      //this is the ID of the plus/minus button image
79      var myButton = document.getElementById(myButton);
80
81        if (myItem.style.display != "none")
82        {
83            //items are currently displayed, so hide them
84            myItem.style.display = "none";
85            swapImage(myButton,"plus");
86        }
87        else
88        {
89            //items are currently hidden, so display them
90            myItem.style.display = "block";
91            swapImage(myButton,"minus");
92        }
93    }
94
95    //function to swap an image based on its current state
96    function swapImage(myImage, state)
97    {
98        if (state == "minus")
99        {
100            myImage.src = "<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/hide.gif";
101        }
102
103        else
104        {
105            myImage.src = "<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif";
106      }
107    }
108
109</script>
110
111</head>
112
113<!-- /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// -->
114
115<body>
116
117
118
119 
120
121<h2>Tab2MAGE Importer -- Your Experiment</h2>
122Page 1 of 3
123<p>
124
125Please configure your experiment for upload by answering the questions on this and the following two pages.
126The answers you provide will be used to automatically create a new experiment in BASE and your raw data will be imported
127into this. All the associated objects (Hybridizations, Scans, Extracts etc.) will also be created.
128<p>
129
130<form name="experimentData" action="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/protocols.jsp" method="post">
131<input type="hidden" name="ID" value="<%=ID%>"> 
132
133<table cellpadding="0" cellspacing="0">
134
135  <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
136  <tr >
137    <td class="boldText">Domain:</td>
138    <td class="input"><input type="text" size="45" name="domain" value="scri.ac.uk" /></td>
139    <td class="helpText">The domain tag provides information on the originator of the output MAGE-ML document. This field can contain
140    any suitable string, such as the originating internet domain name (e.g. "ebi.ac.uk").</td>
141  </tr>
142 
143  <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
144  <tr >
145    <td class="boldText">Array Acession:</td>
146
147    <td class="input">
148
149    <div id="accession" class="selectionlist required">
150    <table class="noBorder"  cellspacing="0" cellpadding="5">
151      <tr class="noBorder">
152        <td style="border-style: none;"><select name="accession" onchange="arrayDesignOnChange()"></select></td>
153        <td style="border-style: none;">
154        <div class="buttonclass"
155          onmouseover="this.className='buttonclass_hover';"
156          onmouseout="this.className='buttonclass';"
157          onclick="selectArrayDesignOnClick()">
158        <div class="buttonclass_inner">Select&hellip;</div>
159        </div>
160        </td>
161      </tr>
162    </table>
163    </div>
164    </td>
165
166    <td class="helpText">Please select an existing array design from BASE or create a
167    new one. For ArrayExpress submissions, the array design name becomes
168    the array accession identifier. Accession numbers for experiments
169    submitted to ArrayExpress should have the format E-XXXX-n.</td>
170
171  </tr>
172
173
174
175      <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
176    <tr >
177      <td class="boldText">Quality Control:</td>
178      <td class="input"><select multiple name="qualityControl" size="7">
179        <option selected="selected">biological replicate</option>
180        <option>dye swap quality control</option>
181        <option>peer review quality control</option>
182        <option>real time PCR quality control</option>
183        <option>reverse transcription PCR quality control</option>
184        <option selected="selected">spike quality control</option>
185        <option>technical replicate</option>
186      </select></td>
187      <td class="helpText">A list of terms taken from the <a
188        href="http://mged.sourceforge.net/ontologies/MGEDontology.php"
189        target="_blank">MGED ontology</a>. Multiple values can be selected
190      by holding down the Ctrl key and clicking on items.</td>
191    </tr>
192
193    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
194    <tr>
195      <td class="boldText">Experiment Design Type:</td>
196      <td class="input">
197
198      <table class="noBorder" cellpadding="3">
199
200        <tr>
201          <td valign="top" style="border-style: none;">Biological Property<br />
202          </td>
203          <td colspan="2" style="border-style: none;"><a
204            onclick="showHideItems('BiologicalProperty', 'buttonBiologicalProperty');"
205            title="Show/hide items"> <img
206            src="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif"
207            border="0" id="buttonBiologicalProperty"
208            name="buttonBiologicalProperty" /></a> <!-- begin div containing hidden items -->
209          <div id="BiologicalProperty" style="display:none"><select
210            multiple="multiple" name="biologicalProperty" size="16">
211            <option selected="selected">cell_component_comparison_design</option>
212            <option>cell_cycle_design</option>
213            <option>cell_type_comparison_design</option>
214            <option>cellular_process_design</option>
215            <option>development_or_differentiation_design</option>
216            <option>imprinting_design</option>
217            <option>individual_genetic_characteristics_design</option>
218            <option>innate_behavior_design</option>
219            <option>is_expressed_design</option>
220            <option>organism_part_comparison_design</option>
221            <option>organism_status_design</option>
222            <option>physiological_process_design</option>
223            <option>sex_design</option>
224            <option>species_design</option>
225            <option>strain_or_line_design</option>
226            <option>unknown_experiment_design_type</option>
227          </select></div>
228          </td>
229        </tr>
230
231        <tr>
232          <td style="border-style: none;">BioMolecular Annotation</td>
233          <td style="border-style: none;"><a
234            onclick="showHideItems('BioMolecularAnnotation', 'buttonBioMolecularAnnotation');"
235            title="Show/hide items"> <img
236            src="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif"
237            border="0" id="buttonBioMolecularAnnotation"
238            name="buttonBioMolecularAnnotation" /></a> <!-- begin div containing hidden items -->
239          <div id="BioMolecularAnnotation" style="display:none"><select
240            multiple="multiple" name="bioMolecularAnnotation"  size="11">
241            <option selected="selected">RNA_stability_design</option>
242            <option>binding_site_identification_design</option>
243            <option>co-expression_design</option>
244            <option>comparative_genome_hybridization_design</option>
245            <option>genotyping_design</option>
246            <option>operon_identification_design</option>
247            <option>secreted_protein_identification_design</option>
248            <option>tiling_path_design</option>
249            <option>transcript_identification_design</option>
250            <option>translational_bias_design</option>
251            <option>unknown_experiment_design_type</option>
252          </select></div>
253          </td>
254        </tr>
255
256        <tr>
257          <td style="border-style: none;">Epidemiological Design</td>
258          <td style="border-style: none;"><a
259            onclick="showHideItems('EpidemiologicalDesign', 'buttonEpidemiologicalDesign');"
260            title="Show/hide items"> <img
261            src="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif"
262            border="0" id="buttonEpidemiologicalDesign"
263            name="buttonEpidemiologicalDesign" /></a> <!-- begin div containing hidden items -->
264          <div id="EpidemiologicalDesign" style="display:none"><select
265            multiple="multiple" name="epidemiologicalDesign"  size="4">
266            <option>clinical_history_design</option>
267            <option>disease_state_design</option>
268            <option selected="selected">family_history_design</option>
269            <option>unknown_experiment_design_type</option>
270          </select></div>
271          </td>
272        </tr>
273
274        <tr>
275          <td style="border-style: none;">Methodological Design</td>
276          <td style="border-style: none;"><a
277            onclick="showHideItems('MethodologicalDesign', 'buttonMethodologicalDesign');"
278            title="Show/hide items"> <img
279            src="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif"
280            border="0" id="buttonMethodologicalDesign"
281            name="buttonMethodologicalDesign" /></a> <!-- begin div containing hidden items -->
282          <div id="MethodologicalDesign" style="display:none"><select
283            multiple="multiple" name="methodologicalDesign" size="18">
284            <option>all_pairs</option>
285            <option>array_platform_variation_design</option>
286            <option>dye_swap_design</option>
287            <option>ex_vivo_design</option>
288            <option>hardware_variation_design</option>
289            <option>in_vitro_design</option>
290            <option>in_vivo_design</option>
291            <option>loop_design</option>
292            <option>normalization_testing_design</option>
293            <option>operator_variation_design</option>
294            <option>optimization_design</option>
295            <option>quality_control_testing_design</option>
296            <option>reference_design</option>
297            <option>replicate_design</option>
298            <option>self_vs_self_design</option>
299            <option>software_variation_design</option>
300            <option>time_series_design</option>
301            <option>unknown_experiment_design_type</option>
302          </select></div>
303          </td>
304        </tr>
305
306        <tr>
307          <td style="border-style: none;">Perturbational Design</td>
308          <td style="border-style: none;"><a
309            onclick="showHideItems('PerturbationalDesign', 'buttonPerturbationalDesign');"
310            title="Show/hide items"> <img
311            src="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif"
312            border="0" id="buttonPerturbationalDesign"
313            name="buttonPerturbationalDesign" /></a> <!-- begin div containing hidden items -->
314          <div id="PerturbationalDesign" style="display:none"><select
315            multiple="multiple" name="perturbationalDesign" size="12">
316            <option>cellular_modification_design</option>
317            <option>compound_treatment_design</option>
318            <option>disease_state_design</option>
319            <option>dose_response_design</option>
320            <option>genetic_modification_design</option>
321            <option>growth_condition_design</option>
322            <option>injury_design</option>
323            <option>non-targeted_transgenic_variation_design</option>
324            <option>pathogenicity_design</option>
325            <option>stimulated_design_type</option>
326            <option>stimulus_or_stress_design</option>
327            <option>unknown_experiment_design_type</option>
328          </select></div>
329          </td>
330        </tr>
331
332        <tr>
333          <td style="border-style: none;">Technological Design</td>
334          <td style="border-style: none;"><a
335            onclick="showHideItems('TechnologicalDesign', 'buttonTechnologicalDesign');"
336            title="Show/hide items"> <img
337            src="<%= request.getContextPath()%>/plugins/uk/ac/ebi/nugo/plugins/show.gif"
338            border="0" id="buttonTechnologicalDesign"
339            name="buttonTechnologicalDesign" /></a> <!-- begin div containing hidden items -->
340          <div id="TechnologicalDesign" style="display:none"><select
341            multiple="multiple" name="technologicalDesign" size="4">
342            <option>binding_site_identification_design</option>
343            <option>cellular_modification_design</option>
344            <option>comparative_genome_hybridization_design</option>
345            <option>transcript_identification_design</option>
346          </select></div>
347          </td>
348        </tr>
349
350      </table>
351
352
353      </td>
354      <td class="helpText">A list of terms taken from the <a
355        href="http://mged.sourceforge.net/ontologies/MGEDontology.php"
356        target="_blank">MGED ontology</a>.
357      <p>Click "expand" for an item to see list boxes with specific
358      choices.<br />
359      <br />
360      Multiple values can be selected by holding down the Ctrl key and
361      clicking on items.
362      </td>
363    </tr>
364
365    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
366    <tr>
367      <td class="boldText">Experiment Name:</td>
368      <td class="input"><textarea rows="4" cols="30"
369        name="experimentName"><%=expName %></textarea></td>
370      <td class="helpText">The name you have chosen for the Experiment.</td>
371    </tr>
372
373    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
374    <tr>
375      <td class="boldText">Experiment Description:</td>
376      <td class="input"><textarea rows="4" cols="30"
377        name="description">description goes here</textarea></td>
378      <td class="helpText">A short paragraph describing the purpose of the experiment.</td>
379    </tr>
380
381    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
382    <tr>
383      <td class="boldText">Release Date:</td>
384      <td class="input"><input type="text" size="10"
385        name="releaseDate" value="2007-12-03" /></td>
386      <td class="helpText">Date for public release, in the format YYYY-MM-DD.</td>
387    </tr>
388    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
389    <tr>
390      <td class="boldText">Submission Date:</td>
391      <td class="input"><input type="text" size="10"
392        name="submissionDate" value="2007-12-03" /></td>
393      <td class="helpText">Date of submission, in the format YYYY-MM-DD.</td>
394    </tr>
395    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
396    <tr>
397      <td class="boldText">Submitter:</td>
398      <td class="input"><input type="text" size="45" name="submitter"
399        value="Joe Bloggs" /></td>
400      <td class="helpText">The name of the person responsible for submitting the
401      experiment to the database.</td>
402    </tr>
403    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
404    <tr>
405      <td class="boldText">Organization:</td>
406      <td class="input"><input type="text" size="45"
407        name="organization" value="SCRI" /></td>
408      <td class="helpText">The organization to which the submitter is affiliated.</td>
409    </tr>
410    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
411
412    <tr>
413      <td class="boldText">Publication Details:</td>
414      <td class="input"></td>
415      <td class="helpText">Publication details for any manuscript
416      associated with the experiment.</td>
417    </tr>
418
419    <tr>
420      <td class="plainLabel" style="border-style: none;">Title:</td>
421      <td class="input" style="border-style: none;"><textarea rows="3" cols="30"
422        name="publicationTitle" >My Ropey Paper</textarea></td>
423      <td style="border-style: none;"></td>
424    </tr>
425    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
426    <tr>
427      <td class="plainLabel" style="border-style: none;">Authors:</td>
428      <td class="input" style="border-style: none;"><textarea rows="3" cols="30" name="authors">Bloggs, Joe</textarea></td>
429      <td  class="helpText" style="border-style: none;">The authors list is a semicolon-delimited list of names.</td>
430    </tr>
431    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
432    <tr>
433      <td class="plainLabel" style="border-style: none;">Journal:</td>
434      <td class="input" style="border-style: none;"><textarea rows="3" cols="30" name="journal">The Journal of Irreproducible Results</textarea></td>
435      <td  class="helpText" style="border-style: none;">The journal field should contain a standard Pubmed journal
436      abbreviated name. </td>
437    </tr>
438    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
439    <tr>
440      <td class="plainLabel" style="border-style: none;">Volume:</td>
441      <td class="input" style="border-style: none;"><input type="text" size="10" name="volume"
442        value="5" /></td>
443      <td style="border-style: none;"></td>
444    </tr>
445    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
446    <tr>
447      <td class="plainLabel" style="border-style: none;">Issue:</td>
448      <td class="input" style="border-style: none;"><input type="text" size="10" name="issue"
449        value="2" /></td>
450      <td style="border-style: none;"></td>
451    </tr>
452    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
453    <tr>
454      <td class="plainLabel" style="border-style: none;">Pages:</td>
455      <td class="input" style="border-style: none;"><input type="text" size="10" name="pages"
456        value="1234-1235" /></td>
457      <td style="border-style: none;"></td>
458    </tr>
459    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
460    <tr>
461      <td class="plainLabel" style="border-style: none;">Year:</td>
462      <td class="input" style="border-style: none;"><input type="text" size="10" name="year"
463        value="2007" /></td>
464      <td style="border-style: none;"></td>
465    </tr>
466    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
467    <tr>
468      <td class="plainLabel" style="border-style: none;">Pubmed ID:</td>
469      <td class="input" style="border-style: none;"><input type="text" size="30" name="pubmedId"
470        value="11009762" /></td>
471      <td style="border-style: none;"></td>
472
473    </tr>
474
475    <!-- ------------------------------------------------------------------------------------------------------------------------------------------------ -->
476  </table>
477
478  <p>
479
480
481  <table align="center" class="noBorder" cellspacing="5"  cellpadding="5">
482  <tr class="noBorder">
483    <td id="next" width="50%" style="border-style: none;"><div class="buttons" onmouseover="this.className='buttons_hover';" onmouseout="this.className='buttons';" onclick="submit()"><div class="buttons_inner"><table  class="noBorder" cellspacing="0" cellpadding="0"><tr  class="noBorder"><td style="border-style: none;"><img src="/base/images/gonext.gif" border="0"></td><td style="border-style: none;">Next</td></tr></table></div></div></td>
484    <td id="close" width="50%" style="border-style: none;"><div class="buttons" onmouseover="this.className='buttons_hover';" onmouseout="this.className='buttons';" onclick="window.close()"><div class="buttons_inner"><table  class="noBorder" cellspacing="0" cellpadding="0"><tr  class="noBorder"><td style="border-style: none;"><img src="/base/images/cancel.gif" border="0"></td><td style="border-style: none;">Cancel</td></tr></table></div></div></td>  </tr>
485  </table>
486
487</form>
488
489</body>
490</html>
491
492
Note: See TracBrowser for help on using the repository browser.