1
|
1 <!doctype HTML>
|
|
2 <html lang="en">
|
|
3 <head>
|
|
4 <meta charset="utf-8">
|
|
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6 <meta name="author" content="MetaboHUB">
|
|
7 <link rel="icon" type="image/ico" href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/ico/favicon.ico">
|
|
8 <title>PeakForest MetaboHub</title>
|
|
9 <meta name="keywords" content="spectral database, mass spectrometry, nmr, lc-ms, gc-ms, chemical, metabolomic, compound, library">
|
|
10 <meta name="description" content="PeakForest is a spectral data portal for Metabolomics community. It provides storage and annotation services for metabolic profils of biological matrix. It relies on the wide range of complementary methods using UPLC-(API)HRMS, GC-QToF, and NMR.">
|
|
11 <style>.file-input-wrapper { overflow: hidden; position: relative; cursor: pointer; z-index: 1; }.file-input-wrapper input[type=file], .file-input-wrapper input[type=file]:focus, .file-input-wrapper input[type=file]:hover { position: absolute; top: 0; left: 0; cursor: pointer; opacity: 0; filter: alpha(opacity=0); z-index: 99; outline: 0; }.file-input-name { margin-left: 8px; }</style>
|
|
12 <link href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/css/bootstrap.min.css" rel="stylesheet">
|
|
13 <link href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/css/sb-admin.min.css" rel="stylesheet">
|
|
14 <link rel="stylesheet" href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/font-awesome/css/font-awesome.min.css">
|
|
15 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/jquery.min.js"></script>
|
|
16 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/bootstrap.min.js"></script>
|
|
17 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/bootstrap-typeahead.min.js"></script>
|
|
18 <link href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/css/bootstrap-select.min.css" media="screen" rel="stylesheet" type="text/css">
|
|
19 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/bootstrap-select.min.js" type="text/javascript"></script>
|
|
20 <link href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/css/bootstrap-datepicker.min.css" media="screen" rel="stylesheet" type="text/css">
|
|
21 <script type="text/javascript" src="/common.js"></script>
|
|
22 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
|
|
23 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/jquery.tmpl.min.js" type="text/javascript"></script>
|
|
24 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/highcharts/js/highcharts.min.js"></script>
|
|
25 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/highcharts/js/modules/exporting.min.js"></script>
|
|
26 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/highcharts/js/themes/grid.min.js"></script>
|
|
27 <link href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/css/bootstrap.overwrite.min.css" rel="stylesheet" media="screen">
|
|
28 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/peakforest.min.js"></script>
|
|
29 <script type="text/javascript" src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/tablesorter/jquery.tablesorter.min.js"></script>
|
|
30 <script type="text/javascript" src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/tablesorter/tables.min.js"></script>
|
|
31 <link rel="stylesheet" href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/nmrpro/specdraw.min.css" type="text/css">
|
|
32 <meta name="viewport" content="width=device-width, initial-scale=1">
|
|
33 </head>
|
|
34 <body>
|
|
35 <div id="page-wrapper" class="peakforest-main-wrapper">
|
|
36 <div>
|
|
37 <button class="btn btn-validate" onclick="ctx().exit()">Close MS2PF</button>
|
|
38 </div>
|
|
39 <div class="row" style="margin-bottom: 50px;">
|
|
40 <div id="add-spectrum">
|
|
41 <div class="panel-group" id="accordion-{{ TAB_INDEX_PLACEHOLDER }}">
|
|
42 <div class="panel panel-default">
|
|
43 <div class="panel-heading panel-success">
|
|
44 <h4 class="panel-title">
|
|
45 <a
|
|
46 data-toggle="collapse"
|
|
47 data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
48 href="#step0-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
49 >
|
|
50 Spectrum Type
|
|
51 <i
|
|
52 id="step0sign-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
53 class="fa fa-question-circle"
|
|
54 ></i>
|
|
55 </a>
|
|
56 </h4>
|
|
57 </div>
|
|
58 <div
|
|
59 id="step0-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
60 class="panel-collapse collapse in"
|
|
61 >
|
|
62 <div class="panel-bodỵ">
|
|
63 <button
|
|
64 class="btn btn-disabled"
|
|
65 disabled="disabled"><i
|
|
66 class="fa fa-plus-circle"
|
|
67 ></i> GC-MS spectrum</button>
|
|
68 <button
|
|
69 id="set_LC_MS_spectrum_button"
|
|
70 class="btn btn-primary"
|
|
71 onclick="ctx().addOneSpectrum(2);"><i
|
|
72 class="fa fa-plus-circle"
|
|
73 ></i> LC-MS spectrum</button>
|
|
74 <button
|
|
75 id="set_LC_MSMS_spectrum_button"
|
|
76 class="btn btn-primary"
|
|
77 onclick="ctx().addOneSpectrum(5);"><i
|
|
78 class="fa fa-plus-circle"
|
|
79 ></i> LC-MSMS spectrum</button>
|
|
80 </div>
|
|
81 </div>
|
|
82 </div>
|
|
83 <div
|
|
84 id="add1spectrum-sampleData-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
85 class="panel panel-default"
|
|
86 style="display: none;">
|
|
87 <div
|
|
88 class="panel-heading panel-success">
|
|
89 <h4
|
|
90 class="panel-title">
|
|
91 <a
|
|
92 id="linkActivateStep1-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
93 data-toggle="collapse"
|
|
94 data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
95 href="#step1-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
96 >
|
|
97 Sample Type
|
|
98 <i
|
|
99 id="step1sign-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
100 class="fa fa-question-circle"
|
|
101 ></i>
|
|
102 </a>
|
|
103 </h4>
|
|
104 </div>
|
|
105 <div
|
|
106 id="step1-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
107 class="panel-collapse collapse"
|
|
108 >
|
|
109 <div class="panel-bodỵ">
|
|
110 <div class="col-lg-12">
|
|
111 <div class="col-lg-8">
|
|
112 <div class="panel panel-default">
|
|
113 <div class="panel-heading">
|
|
114 <div class="form-group input-group has-error">
|
|
115 <span class="input-group-addon">
|
|
116 Sample Type
|
|
117 </span>
|
|
118 <select
|
|
119 id="add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
120 class="form-control add1spectrum add1spectrum-sampleForm is-mandatory">
|
|
121 <option
|
|
122 value=""
|
|
123 selected="selected"
|
|
124 disabled="disabled">choose in list…</option>
|
|
125 <option value="compound-mix">
|
|
126 Mix of Ref. Chemical Compound
|
|
127 </option>
|
|
128 </select>
|
|
129 </div>
|
|
130 </div>
|
|
131 <div class="panel-bodỵ">
|
|
132 <div
|
|
133 id="add1spectrum-sample-type-compound-mix-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
134 class="add1spectrum-sample-type-panel"
|
|
135 style="display:none;">
|
|
136 <div class="form-group input-group has-warning">
|
|
137 <span class="input-group-addon">solvent</span>
|
|
138 <select
|
|
139 id="add1spectrum-sample-mixSolvent-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
140 class="form-control add1spectrum add1spectrum-sampleForm is-optional"
|
|
141 >
|
|
142 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
143 <option value="H2O/ethanol (75/25)">H2O/ethanol (75/25)</option>
|
|
144 </select>
|
|
145 </div>
|
|
146 </div>
|
|
147 <div
|
|
148 id="add1spectrum-sample-type-rcc-added-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
149 class="panel panel-default add1spectrum-sample-type-panel"
|
|
150 style="display:none"
|
|
151 >
|
|
152 <div class="panel-heading">
|
|
153 <h3 class="panel-title">Reference compound added</h3>
|
|
154 </div>
|
|
155 <div class="panel-bodỵ" style="padding: 0px;">
|
|
156 <div
|
|
157 id="container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
158 class="handsontable"
|
|
159 ></div>
|
|
160 </div>
|
|
161 </div>
|
|
162 </div>
|
|
163 </div>
|
|
164 </div>
|
|
165 <div class="col-lg-4">
|
|
166 <div id="sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}"></div>
|
|
167
|
|
168 </div>
|
|
169 </div>
|
|
170 <div class="col-lg-12">
|
|
171 <div class="col-lg-8">
|
|
172 <br>
|
|
173 <button
|
|
174 id="btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
175 onclick="ctx().switchToStep(2)"
|
|
176 class="btn btn-disabled switchStep"
|
|
177 disabled=""
|
|
178 >
|
|
179 <i class="fa fa-arrow-circle-down"></i> Next!
|
|
180 </button>
|
|
181 </div>
|
|
182 <div class="col-lg-4"> </div>
|
|
183 </div>
|
|
184 </div>
|
|
185 </div>
|
|
186 </div>
|
|
187 <div
|
|
188 id="add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
189 class="panel panel-default"
|
|
190 style="display: none;"
|
|
191 >
|
|
192 <div class="panel-heading panel-success">
|
|
193 <h4 class="panel-title">
|
|
194 <a
|
|
195 id="linkActivateStep2-lc-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
196 data-toggle="collapse"
|
|
197 data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
198 href="#step2-lc-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
199 >
|
|
200 Liquid Chromatography
|
|
201 <i
|
|
202 id="step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
203 class="fa fa-question-circle"
|
|
204 ></i>
|
|
205 </a>
|
|
206 </h4>
|
|
207 </div>
|
|
208 <div
|
|
209 id="step2-lc-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
210 class="panel-collapse collapse"
|
|
211 >
|
|
212 <div class="panel-bodỵ">
|
|
213 <div class="col-lg-12">
|
|
214 <div class="col-lg-6">
|
|
215 <div class="panel panel-default">
|
|
216 <div class="panel-heading">
|
|
217 <h3 class="panel-title">Chromatography Param.</h3>
|
|
218 </div>
|
|
219 <div class="panel-bodỵ">
|
|
220 <div class="form-group input-group has-error">
|
|
221 <span class="input-group-addon">Method</span>
|
|
222 <select
|
|
223 id="add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
224 class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"
|
|
225 ></select>
|
|
226 </div>
|
|
227 <div id="alertBoxSelectTemplate-{{ TAB_INDEX_PLACEHOLDER }}"></div>
|
|
228 <div class="form-group input-group has-error">
|
|
229 <span class="input-group-addon">Column constructor</span>
|
|
230 <select
|
|
231 id="add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
232 class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"
|
|
233 >
|
|
234 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
235 </select>
|
|
236 </div>
|
|
237 <div class="form-group input-group ">
|
|
238 <span class="input-group-addon">Column constructor (other)</span>
|
|
239 <input id="add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm" disabled="disabled" placeholder="e.g. HAL 9000">
|
|
240 </div>
|
|
241 <div class="form-group input-group has-warning">
|
|
242 <span class="input-group-addon">Column name</span>
|
|
243 <input id="add1spectrum-chromatoLC-colName-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. UPLC HSS T3">
|
|
244 </div>
|
|
245 <div class="form-group input-group has-error">
|
|
246 <span class="input-group-addon">Column length (mm)</span>
|
|
247 <input id="add1spectrum-chromatoLC-colLength-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory" placeholder="e.g. 150">
|
|
248 </div>
|
|
249 <div class="form-group input-group has-error">
|
|
250 <span class="input-group-addon">Column diameter (mm)</span>
|
|
251 <input id="add1spectrum-chromatoLC-colDiameter-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory" placeholder="e.g. 2.1">
|
|
252 </div>
|
|
253 <div class="form-group input-group has-error">
|
|
254 <span class="input-group-addon">Particule size (µm)</span>
|
|
255 <input id="add1spectrum-chromatoLC-colParticuleSize-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory" placeholder="e.g. 1.8">
|
|
256 </div>
|
|
257 <div class="form-group input-group has-warning">
|
|
258 <span class="input-group-addon">Column temperature (°C)</span>
|
|
259 <input id="add1spectrum-chromatoLC-colTemperature-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 30">
|
|
260 </div>
|
|
261 <div class="form-group input-group has-error">
|
|
262 <span class="input-group-addon">LC mode</span>
|
|
263 <select id="add1spectrum-chromatoLC-LCMode-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory">
|
|
264 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
265 <option value="Gradient">Gradient</option>
|
|
266 <option value="Isocratic">Isocratic</option>
|
|
267 </select>
|
|
268 </div>
|
|
269 <div class="form-group input-group has-warning">
|
|
270 <span class="input-group-addon">Separation flow rate (µL/min)</span>
|
|
271 <input id="add1spectrum-chromatoLC-separationFlowRate-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 400">
|
|
272 </div>
|
|
273 <div class="form-group input-group has-error">
|
|
274 <span class="input-group-addon">Separation solvent A</span>
|
|
275 <select
|
|
276 id="add1spectrum-chromatoLC-separationSolvA-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
277 class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"
|
|
278 >
|
|
279 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
280 </select>
|
|
281 </div>
|
|
282 <div class="form-group input-group has-warning">
|
|
283 <span class="input-group-addon">pH solvent A (if acqueous solvant)</span>
|
|
284 <input id="add1spectrum-chromatoLC-separationSolvApH-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 7.0">
|
|
285 </div>
|
|
286 <div class="form-group input-group has-error">
|
|
287 <span class="input-group-addon">Separation solvent B</span>
|
|
288 <select
|
|
289 id="add1spectrum-chromatoLC-separationSolvB-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
290 class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"
|
|
291 >
|
|
292 </select>
|
|
293 </div>
|
|
294 <div class="form-group input-group has-warning">
|
|
295 <span class="input-group-addon">pH solvent B (if acqueous solvant)</span>
|
|
296 <input id="add1spectrum-chromatoLC-separationSolvBApH-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 7.0">
|
|
297 </div>
|
|
298 </div>
|
|
299 </div>
|
|
300 </div>
|
|
301 <div class="col-lg-6">
|
|
302 <div class="panel panel-default">
|
|
303 <div class="panel-heading">
|
|
304 <h3 class="panel-title">Separation flow gradient</h3>
|
|
305 </div>
|
|
306 <div class="panel-bodỵ" style="padding: 0px;">
|
|
307 <div id="container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}" class="handsontable"></div>
|
|
308 </div>
|
|
309 </div>
|
|
310 </div>
|
|
311 </div>
|
|
312 <div class="col-lg-12">
|
|
313 <div class="col-lg-8">
|
|
314 <br>
|
|
315 <button id="btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(3);" class="btn btn-disabled switchStep" disabled=""><i class="fa fa-arrow-circle-down"></i> Next!</button>
|
|
316 </div>
|
|
317 <div class="col-lg-4"> </div>
|
|
318 </div>
|
|
319 </div>
|
|
320 </div>
|
|
321 </div>
|
|
322 <div id="add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
|
|
323 <div class="panel-heading panel-success">
|
|
324 <h4 class="panel-title">
|
|
325 <a id="linkActivateStep2-gc-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step2-gc-{{ TAB_INDEX_PLACEHOLDER }}">
|
|
326 Gaz Chromatography <i id="step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
|
|
327 </a>
|
|
328 </h4>
|
|
329 </div>
|
|
330 <div id="step2-gc-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
|
|
331 <div class="panel-bodỵ">
|
|
332 <div class="col-lg-12">
|
|
333 <div class="col-lg-6">
|
|
334 i <3 GC
|
|
335 </div>
|
|
336 <div class="col-lg-6"> </div>
|
|
337 </div>
|
|
338 <div class="col-lg-12">
|
|
339 <div class="col-lg-8">
|
|
340 <br>
|
|
341 <button id="btnSwitch-gotoStep3-gc-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(3);" class="btn btn-disabled switchStep" disabled=""><i class="fa fa-arrow-circle-down"></i> Next!</button>
|
|
342 </div>
|
|
343 <div class="col-lg-4"> </div>
|
|
344 </div>
|
|
345 </div>
|
|
346 </div>
|
|
347 </div>
|
|
348 <div id="add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
|
|
349 <div class="panel-heading panel-success">
|
|
350 <h4 class="panel-title">
|
|
351 <a id="linkActivateStep3-ms-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step3-ms-{{ TAB_INDEX_PLACEHOLDER }}">
|
|
352 MS Analyzer <i id="step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
|
|
353 </a>
|
|
354 </h4>
|
|
355 </div>
|
|
356 <div id="step3-ms-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
|
|
357 <div class="panel-bodỵ">
|
|
358 <div class="col-lg-12">
|
|
359 <div class="col-lg-6">
|
|
360 <br>
|
|
361 <div class="panel panel-default">
|
|
362 <div class="panel-heading">
|
|
363 <h3 class="panel-title">Analyzer</h3>
|
|
364 </div>
|
|
365 <div class="panel-bodỵ">
|
|
366 <div class="form-group input-group has-error">
|
|
367 <span class="input-group-addon">Instrument</span>
|
|
368 <input id="add1spectrum-analyzer-ms-instrument-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory" placeholder="e.g. Q-TOF; LTQ - Orbitrap">
|
|
369 </div>
|
|
370 <div class="form-group input-group has-warning">
|
|
371 <span class="input-group-addon">Model</span>
|
|
372 <input id="add1spectrum-analyzer-ms-model-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. QToF micro (Micromass Waters); XL; Impact II; ...">
|
|
373 </div>
|
|
374 <div class="form-group">
|
|
375 <div class="form-group input-group has-error">
|
|
376 <span class="input-group-addon">Ion analyzer Type</span>
|
|
377 <input id="add1spectrum-analyzer-ms-ionAnalyzerType-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory" placeholder="e.g. QTOF; QQQ; ...">
|
|
378 </div>
|
|
379 <p class="help-block">
|
|
380 <small>
|
|
381 Ion analyzer types are "B", "E", "FT" (include other types using FT like FTICR or Orbitrap), "IT", "Q", "TOF" (e.g.: "QTOF", "QQQ", "EB", "ITFT");
|
|
382 for further informations please refer to <a target="_BLANK" href="https://github.com/MassBank/MassBank-web/blob/main/Documentation/MassBankRecordFormat.md#212-record_title">MassBank Record documentation</a>.
|
|
383 </small>
|
|
384 </p>
|
|
385 </div>
|
|
386 </div>
|
|
387 </div>
|
|
388 </div>
|
|
389 <div class="col-lg-6">
|
|
390 <br>
|
|
391 <div class="panel panel-default">
|
|
392 <div class="panel-heading">
|
|
393 <h3 class="panel-title">Molecule Ionization</h3>
|
|
394 </div>
|
|
395 <div class="panel-bodỵ">
|
|
396 <div class="form-group input-group has-error">
|
|
397 <span class="input-group-addon">Ionization method <small>(POS/NEG)</small></span>
|
|
398 <select
|
|
399 id="add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
400 style="max-width: 50%;"
|
|
401 class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory one-or-more"
|
|
402 >
|
|
403 </select>
|
|
404 <select
|
|
405 id="add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
406 style="max-width: 50%;"
|
|
407 class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory one-or-more"
|
|
408 >
|
|
409 </select>
|
|
410 </div>
|
|
411 <div class="form-group input-group has-warning">
|
|
412 <span class="input-group-addon">
|
|
413 Spray (needle) gaz flow <br><small>(arbitrary in Xcalibur, POS/NEG)</small>
|
|
414 </span>
|
|
415 <input
|
|
416 id="add1spectrum-analyzserMS-sprayGazFlow-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
417 style="max-width: 50%;"
|
|
418 type="text"
|
|
419 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
420 placeholder="e.g. 40 (POS)"
|
|
421 >
|
|
422 <input
|
|
423 id="add1spectrum-analyzserMS-sprayGazFlow-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
424 style="max-width: 50%;"
|
|
425 type="text"
|
|
426 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
427 placeholder="e.g. 20 (NEG)"
|
|
428 >
|
|
429 </div>
|
|
430 <div class="form-group input-group has-warning">
|
|
431 <span class="input-group-addon">
|
|
432 Vaporizer gaz flow <br><small>(arbitrary in Xcalibur, POS/NEG)</small>
|
|
433 </span>
|
|
434 <input
|
|
435 id="add1spectrum-analyzserMS-vaporizerGazFlow-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
436 style="max-width: 50%;"
|
|
437 type="text"
|
|
438 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
439 placeholder="e.g. 10 (POS)"
|
|
440 />
|
|
441 <input
|
|
442 id="add1spectrum-analyzserMS-vaporizerGazFlow-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
443 style="max-width: 50%;"
|
|
444 type="text"
|
|
445 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
446 placeholder="e.g. 5 (NEG)"
|
|
447 />
|
|
448 </div>
|
|
449 <div class="form-group input-group has-warning">
|
|
450 <span class="input-group-addon">
|
|
451 Vaporizer temperature <br><small>(°C, POS/NEG)</small>
|
|
452 </span>
|
|
453 <input
|
|
454 id="add1spectrum-analyzserMS-vaporizerTemperature-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
455 style="max-width: 50%;"
|
|
456 type="text"
|
|
457 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
458 placeholder="e.g. 330 (POS)"
|
|
459 />
|
|
460 <input
|
|
461 id="add1spectrum-analyzserMS-vaporizerTemperature-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
462 style="max-width: 50%;"
|
|
463 type="text"
|
|
464 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
465 placeholder="e.g. 330 (NEG)"
|
|
466 />
|
|
467 </div>
|
|
468 <div class="form-group input-group has-warning">
|
|
469 <span class="input-group-addon">
|
|
470 Source gaz flow <br><small>(arbitrary in Xcalibur, POS/NEG)</small>
|
|
471 </span>
|
|
472 <input
|
|
473 id="add1spectrum-analyzserMS-sourceGazFlow-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
474 style="max-width: 50%;"
|
|
475 type="text"
|
|
476 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
477 placeholder="e.g. 40 (POS)"
|
|
478 />
|
|
479 <input
|
|
480 id="add1spectrum-analyzserMS-sourceGazFlow-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
481 style="max-width: 50%;"
|
|
482 type="text"
|
|
483 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
484 placeholder="e.g. 40 (NEG)"
|
|
485 />
|
|
486 </div>
|
|
487 <div class="form-group input-group has-warning">
|
|
488 <span class="input-group-addon">
|
|
489 Ion transfer tube temperature <br> Transfer capillary temperature <small>(°C, POS/NEG)</small>
|
|
490 </span>
|
|
491 <input
|
|
492 id="add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
493 style="max-width: 50%;"
|
|
494 type="text"
|
|
495 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
496 placeholder="e.g. 350 (POS)"
|
|
497 />
|
|
498 <input
|
|
499 id="add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
500 style="max-width: 50%;"
|
|
501 type="text"
|
|
502 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
503 placeholder="e.g. 350 (NEG)"
|
|
504 />
|
|
505 </div>
|
|
506 <div class="form-group input-group has-warning">
|
|
507 <span class="input-group-addon">
|
|
508 High voltage (ESI) <br> Corona voltage (APCI) <small>(in kV, POS/NEG)</small>
|
|
509 </span>
|
|
510 <input
|
|
511 id="add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-pos-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
512 style="max-width: 50%;"
|
|
513 type="text"
|
|
514 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
515 placeholder="e.g. 3.5 (POS)"
|
|
516 />
|
|
517 <input
|
|
518 id="add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-neg-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
519 style="max-width: 50%;"
|
|
520 type="text"
|
|
521 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
522 placeholder="e.g. 2.8 (NEG)"
|
|
523 />
|
|
524 </div>
|
|
525 </div>
|
|
526 </div>
|
|
527 </div>
|
|
528 <div class="col-lg-6 opt-msms">
|
|
529 <br>
|
|
530 <div class="panel panel-default">
|
|
531 <div class="panel-heading">
|
|
532 <h3 class="panel-title">Ion Storage / Ion Beam</h3>
|
|
533 </div>
|
|
534 <div class="panel-bodỵ">
|
|
535 <div class="form-group input-group has-warning">
|
|
536 <span class="input-group-addon">Type <small>(storage / beam)</small></span>
|
|
537 <select id="add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional one-or-more">
|
|
538 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
539 <option value="trap">Ion Trap</option>
|
|
540 <option value="beam">Ion Beam</option>
|
|
541 </select>
|
|
542 </div>
|
|
543 <p class="help-block">
|
|
544 <small>
|
|
545 Ion storage: Ion Trap (IT) and ICR.
|
|
546 <br>Ion beam: Q or H collision Cell (QQQ, QQIT, QQ/TOF, Fusion).
|
|
547 </small>
|
|
548 </p>
|
|
549 <div class="form-group input-group has-success">
|
|
550 <span class="input-group-addon">Gas </span>
|
|
551 <select id="add1spectrum-ionTrapBeam-ionGas-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional ">
|
|
552 <option value="He">He</option>
|
|
553 <option value="N2">N2</option>
|
|
554 <option value="Ar">Ar</option>
|
|
555 </select>
|
|
556 </div>
|
|
557 <div class="form-group input-group has-warning">
|
|
558 <span class="input-group-addon">Gas pressure</span>
|
|
559 <input
|
|
560 id="add1spectrum-ionTrapBeam-ionGasPressureValue-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
561 type="text"
|
|
562 style="max-width: 50%;"
|
|
563 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
564 />
|
|
565 <select
|
|
566 id="add1spectrum-ionTrapBeam-ionGasPressureUnit-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
567 style="max-width: 50%;"
|
|
568 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
569 >
|
|
570 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
571 <option value="mbar">mbar</option>
|
|
572 <option value="au">a.u.</option>
|
|
573 </select>
|
|
574 </div>
|
|
575 <div class="form-group input-group add1spectrum-ionTrap has-warning">
|
|
576 <span class="input-group-addon">Frequency Shift <small>(KHz)</small></span>
|
|
577 <input
|
|
578 id="add1spectrum-ionTrapBeam-ionFrequencyShift-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
579 type="text"
|
|
580 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
581 placeholder="e.g.: ..."
|
|
582 />
|
|
583 </div>
|
|
584 <div class="form-group input-group add1spectrum-ionTrap has-warning">
|
|
585 <span class="input-group-addon">Ion Number <small>(AGC or ICC)</small></span>
|
|
586 <input
|
|
587 id="add1spectrum-ionTrapBeam-ionNumber-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
588 type="text"
|
|
589 class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional"
|
|
590 placeholder="e.g.: ..."
|
|
591 />
|
|
592 </div>
|
|
593 </div>
|
|
594 </div>
|
|
595 </div>
|
|
596 </div>
|
|
597 <div class="col-lg-12">
|
|
598 <div class="col-lg-8">
|
|
599 <br>
|
|
600 <button
|
|
601 id="btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
602 onclick="ctx().switchToStep(4);"
|
|
603 class="btn btn-disabled switchStep"
|
|
604 disabled=""
|
|
605 >
|
|
606 <i class="fa fa-arrow-circle-down"></i> Next!
|
|
607 </button>
|
|
608 </div>
|
|
609 <div class="col-lg-4"> </div>
|
|
610 </div>
|
|
611 </div>
|
|
612 </div>
|
|
613 </div>
|
|
614 <div
|
|
615 id="add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
616 class="panel panel-default"
|
|
617 style="display: none;"
|
|
618 >
|
|
619 <div class="panel-heading panel-success">
|
|
620 <h4 class="panel-title">
|
|
621 <a
|
|
622 id="linkActivateStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
623 data-toggle="collapse"
|
|
624 data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
625 href="#step4-ms-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
626 >
|
|
627 MS Peaks
|
|
628 <i
|
|
629 id="step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
630 class="fa fa-question-circle"
|
|
631 ></i>
|
|
632 </a>
|
|
633 </h4>
|
|
634 </div>
|
|
635 <div id="step4-ms-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
|
|
636 <div class="panel-bodỵ">
|
|
637 <div class="col-lg-12">
|
|
638 <!--
|
|
639 <div class="form-group input-group col-lg-3 has-success">
|
|
640 <span class="input-group-addon">scan type</span>
|
|
641 <select
|
|
642 style="width: 150px;"
|
|
643 id="add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
644 class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-mandatory"
|
|
645 >
|
|
646 <option value="" disabled="disabled">choose in list…</option>
|
|
647 <option class="enable-if-ms" value="ms" disabled="disabled" selected="selected">ms</option>
|
|
648 <option class="enable-if-msms" value="ms2" disabled="disabled">ms2</option>
|
|
649 </select>
|
|
650 </div>
|
|
651 -->
|
|
652 <div class="form-group input-group col-lg-3 has-error">
|
|
653 <span class="input-group-addon">polarity</span>
|
|
654 <select
|
|
655 style="width: 150px;"
|
|
656 id="add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
657 class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-mandatory"
|
|
658 >
|
|
659 <option value="" selected="selected" disabled="disabled">choose in list…</option>
|
|
660 <option value="positive" disabled="disabled">positive</option>
|
|
661 <option value="negative" disabled="disabled">negative</option>
|
|
662 </select>
|
|
663 </div>
|
|
664 <div class="form-group input-group col-lg-3 has-error">
|
|
665 <span class="input-group-addon">resolution</span>
|
|
666 <select
|
|
667 style="width: 150px;"
|
|
668 id="add1spectrum-peaksMS-resolution-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
669 class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-mandatory"
|
|
670 >
|
|
671 <option value="" disabled="disabled">choose in list…</option>
|
|
672 <option value="low">low</option>
|
|
673 <option selected="selected" value="high">high</option>
|
|
674 </select>
|
|
675 </div>
|
|
676 <div class="form-group input-group col-lg-3 has-success">
|
|
677 <span class="input-group-addon">curation</span>
|
|
678 <select
|
|
679 style="width: 150px;"
|
|
680 id="add1spectrum-peaksMS-curation-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
681 class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-optional"
|
|
682 >
|
|
683 <option value="no_curation" selected="selected">no curation</option>
|
|
684 <option value="peaks_RI_sup_1percent">Peaks RI > 1%</option>
|
|
685 <option value="top_50_peaks">Top 50 peaks</option>
|
|
686 <option value="top_20_peaks">Top 20 peaks</option>
|
|
687 <option value="top_10_peaks">Top 10 peaks</option>
|
|
688 <option value="similar_chromatographic_profile">Similar chromatographic profile</option>
|
|
689 </select>
|
|
690 </div>
|
|
691 </div>
|
|
692 <br>
|
|
693 <div class="col-lg-12 opt-msms">
|
|
694 <hr>
|
|
695 <div class="form-group input-group col-lg-4 has-success">
|
|
696 <span class="input-group-addon">
|
|
697 Isolation mode <i class="fa fa-question-circle" title="IT / Q / TOF / ICR"></i>
|
|
698 </span>
|
|
699 <select
|
|
700 id="add1spectrum-peaksMS-isolationMode-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
701 class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm is-optional add1spectrum-peaksMSForm-peaklist-reset"
|
|
702 >
|
|
703 <option value="" disabled="disabled">choose in list…</option>
|
|
704 <option value="IT">IT</option>
|
|
705 <option value="Q">Q</option>
|
|
706 <option value="TOF">TOF</option>
|
|
707 <option value="ICR">ICR</option>
|
|
708 </select>
|
|
709 </div>
|
|
710 <div class="form-group input-group col-lg-4 has-warning">
|
|
711 <span class="input-group-addon">
|
|
712 Isolation window <i class="fa fa-question-circle" title="(+ / - value)"></i>
|
|
713 </span>
|
|
714 <input
|
|
715 id="add1spectrum-peaksMS-isolationWindow-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
716 type="text"
|
|
717 class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional add1spectrum-peaksMSForm-peaklist-reset"
|
|
718 placeholder="e.g. ..."
|
|
719 />
|
|
720 </div>
|
|
721 <div class="form-group input-group col-lg-4 has-warning">
|
|
722 <span class="input-group-addon">qz isolation / activation <i class="fa fa-question-circle" title="if IT"></i> <small>(no unit)</small></span>
|
|
723 <input
|
|
724 id="add1spectrum-peaksMS-qzIsolation-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
725 type="text"
|
|
726 class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional add1spectrum-peaksMSForm-peaklist-reset"
|
|
727 placeholder="e.g. ..."
|
|
728 />
|
|
729 </div>
|
|
730 <div class="form-group input-group col-lg-4 has-warning">
|
|
731 <span class="input-group-addon">Activation time <i class="fa fa-question-circle" title="if FT-ICR (SORI-CID) or IT"></i> <small>(ms)</small></span>
|
|
732 <input
|
|
733 id="add1spectrum-peaksMS-activationTime-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
734 type="text"
|
|
735 class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional add1spectrum-peaksMSForm-peaklist-reset"
|
|
736 placeholder="e.g. ..."
|
|
737 />
|
|
738 </div>
|
|
739 <div class="form-group input-group col-lg-4 has-success">
|
|
740 <span class="input-group-addon">
|
|
741 Mode <i class="fa fa-question-circle" title="HCD / CID / ECD /ETD"></i>
|
|
742 </span>
|
|
743 <select
|
|
744 id="add1spectrum-peaksMS-mode-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
745 class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm is-optional"
|
|
746 >
|
|
747 <option value="" disabled="disabled">choose in list…</option>
|
|
748 <option value="HCD">HCD</option>
|
|
749 <option value="CID">CID</option>
|
|
750 <option value="ECD">ECD</option>
|
|
751 <option value="ETD">ETD</option>
|
|
752 </select>
|
|
753 </div>
|
|
754
|
|
755 <div class="form-group input-group col-lg-4 has-warning">
|
|
756 <span class="input-group-addon">
|
|
757 Frag. energy <i class="fa fa-question-circle" title="without unit"></i>
|
|
758 </span>
|
|
759 <input
|
|
760 id="add1spectrum-peaksMS-frag-nrj-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
761 type="text"
|
|
762 class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional"
|
|
763 placeholder="e.g. ..."
|
|
764 >
|
|
765 </div>
|
|
766 </div>
|
|
767 <div class="col-lg-12">
|
|
768 <div class="form-group input-group col-lg-4 has-warning">
|
|
769 <span class="input-group-addon">
|
|
770 Resolution FWHM <small>(resolution@mass)</small>
|
|
771 </span>
|
|
772 <input
|
|
773 id="add1spectrum-analyzer-ms-resolutionFWHM-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
774 type="text"
|
|
775 class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional"
|
|
776 placeholder="e.g. 6500@1000"
|
|
777 />
|
|
778 </div>
|
|
779 <div class="form-group input-group col-lg-4 has-error">
|
|
780 <span class="input-group-addon">
|
|
781 m/z range <small>(ppm) from / to</small>
|
|
782 </span>
|
|
783 <input
|
|
784 style="width: 100px;"
|
|
785 id="add1spectrum-peaksMS-rangeFrom-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
786 type="text"
|
|
787 class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory"
|
|
788 placeholder="50"
|
|
789 value="{{ DEFAULT_MIN_MZ }}"
|
|
790 />
|
|
791 <input
|
|
792 style="width: 100px;"
|
|
793 id="add1spectrum-peaksMS-rangeTo-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
794 type="text"
|
|
795 class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory"
|
|
796 placeholder="500"
|
|
797 value="{{ DEFAULT_MAX_MZ }}"
|
|
798 />
|
|
799 </div>
|
|
800 <div class="form-group input-group col-lg-4 has-error">
|
|
801 <span class="input-group-addon">
|
|
802 retention time (min) <small>from / to</small>
|
|
803 </span>
|
|
804 <input
|
|
805 style="width: 100px;"
|
|
806 id="add1spectrum-peaksMS-rtMinFrom-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
807 type="text"
|
|
808 class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory"
|
|
809 placeholder="0.9"
|
|
810 value="{{ DEFAULT_MIN_RT }}"
|
|
811 />
|
|
812 <input
|
|
813 style="width: 100px;"
|
|
814 id="add1spectrum-peaksMS-rtMinTo-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
815 type="text"
|
|
816 class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory"
|
|
817 placeholder="1.4"
|
|
818 value="{{ DEFAULT_MAX_RT }}"
|
|
819 />
|
|
820 </div>
|
|
821 </div>
|
|
822 <div class="col-lg-12">
|
|
823 <div class="form-group input-group col-lg-4 has-warning">
|
|
824 <span class="input-group-addon">
|
|
825 retention time (% solvant) <small>from / to</small>
|
|
826 </span>
|
|
827 <input
|
|
828 style="width: 100px;"
|
|
829 id="add1spectrum-peaksMS-rtSolvFrom-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
830 type="text"
|
|
831 class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-optional"
|
|
832 placeholder="??"
|
|
833 />
|
|
834 <input
|
|
835 style="width: 100px;"
|
|
836 id="add1spectrum-peaksMS-rtSolvTo-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
837 type="text"
|
|
838 class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-optional"
|
|
839 placeholder="??"
|
|
840 />
|
|
841 </div>
|
|
842 <div class="col-lg-4"> </div>
|
|
843 <div class="col-lg-4"> </div>
|
|
844 </div>
|
|
845 <div class="col-lg-12">
|
|
846 <div>
|
|
847 <ul
|
|
848 class="col-lg-12 nav nav-tabs"
|
|
849 style="
|
|
850 margin-bottom: 15px;
|
|
851 float:left;
|
|
852 height:42px;
|
|
853 margin-left:20px;"
|
|
854 >
|
|
855 {{ TAB_LIST_PLACEHOLDER }}
|
|
856 </ul>
|
|
857 <div class="tab-content" style="float: left;">
|
|
858 {{ ADD_SPECTRUM_FORM }}
|
|
859 </div>
|
|
860 </div>
|
|
861 </div>
|
|
862 <div class="col-lg-12">
|
|
863 <div class="col-lg-8">
|
|
864 <button
|
|
865 class="btn btn-success add1spectrum"
|
|
866 onclick="$('#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}').change()"
|
|
867 >check</button>
|
|
868 <button
|
|
869 id="btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
870 onclick="$('#open_tab_1').click();setTimeout(()=>ctx().switchToStep(5), 100);"
|
|
871 class="btn switchStep btn-primary"
|
|
872 ><i class="fa fa-arrow-circle-down"></i> Next!</button>
|
|
873 <br>
|
|
874 <br>
|
|
875 </div>
|
|
876 <div class="col-lg-4"> </div>
|
|
877 </div>
|
|
878 </div>
|
|
879 </div>
|
|
880 </div>
|
|
881
|
|
882
|
|
883 <div
|
|
884 id="add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
885 class="panel panel-default"
|
|
886 style="display: none;"
|
|
887 >
|
|
888 <div class="panel-heading panel-success">
|
|
889 <h4 class="panel-title">
|
|
890 <a id="linkActivateStep5-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step5-{{ TAB_INDEX_PLACEHOLDER }}">
|
|
891 Other <i id="step5sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
|
|
892 </a>
|
|
893 </h4>
|
|
894 </div>
|
|
895 <div id="step5-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
|
|
896 <div class="panel-bodỵ">
|
|
897 <div class="col-lg-12">
|
|
898 <div class="col-lg-6">
|
|
899 <div class="panel panel-default">
|
|
900 <div class="panel-heading">
|
|
901 <h3 class="panel-title">Ownership</h3>
|
|
902 </div>
|
|
903 <div class="panel-bodỵ">
|
|
904 <div class="form-group input-group has-error">
|
|
905 <span class="input-group-addon">data author(s)</span>
|
|
906 <input
|
|
907 id="add1spectrum-other-author-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
908 type="text"
|
|
909 class="form-control add1spectrum add1spectrum-otherForm is-mandatory"
|
|
910 placeholder="enter your lab. / plateforme name"
|
|
911 value=""
|
|
912 />
|
|
913 </div>
|
|
914 <div class="form-group input-group has-warning">
|
|
915 <span class="input-group-addon">data validator(s)</span>
|
|
916 <input
|
|
917 id="add1spectrum-other-validator-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
918 type="text"
|
|
919 class="form-control add1spectrum add1spectrum-otherForm is-optional"
|
|
920 placeholder="name of the personne who checked all data in this file"
|
|
921 />
|
|
922 </div>
|
|
923 <div class="form-group input-group has-warning">
|
|
924 <span class="input-group-addon">acquisition date</span>
|
|
925 <input
|
|
926 id="add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
927 data-date-format="yyyy-mm-dd"
|
|
928 type="text"
|
|
929 class="form-control add1spectrum add1spectrum-otherForm datepicker is-optional"
|
|
930 value=""
|
|
931 placeholder="2022-11-04"
|
|
932 />
|
|
933 </div>
|
|
934 <div class="form-group input-group has-warning">
|
|
935 <span class="input-group-addon">data ownership</span>
|
|
936 <input
|
|
937 id="add1spectrum-other-owner-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
938 type="text"
|
|
939 class="form-control add1spectrum add1spectrum-otherForm is-optional"
|
|
940 placeholder="enter your lab. / plateforme name & sample provider;"
|
|
941 />
|
|
942 </div>
|
|
943 </div>
|
|
944 </div>
|
|
945 </div>
|
|
946 <div class="col-lg-6">
|
|
947 <div class="panel panel-default">
|
|
948 <div class="panel-heading">
|
|
949 <h3 class="panel-title">Raw File</h3>
|
|
950 </div>
|
|
951 <div class="panel-bodỵ">
|
|
952 <div class="form-group input-group has-warning">
|
|
953 <span class="input-group-addon">raw file name</span>
|
|
954 <input
|
|
955 id="add1spectrum-other-fileName-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
956 type="text"
|
|
957 class="form-control add1spectrum add1spectrum-otherForm is-optional"
|
|
958 placeholder="needed to retrieve file later"
|
|
959 />
|
|
960 </div>
|
|
961 <div class="form-group input-group has-warning">
|
|
962 <span class="input-group-addon">raw file size (Ko)</span>
|
|
963 <input
|
|
964 id="add1spectrum-other-fileSize-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
965 type="text"
|
|
966 class="form-control add1spectrum add1spectrum-otherForm is-optional"
|
|
967 placeholder="optional, to check if the file is correct"
|
|
968 />
|
|
969 </div>
|
|
970 </div>
|
|
971 </div>
|
|
972 </div>
|
|
973 </div>
|
|
974 <div class="col-lg-12">
|
|
975 <div class="col-lg-8">
|
|
976 <br>
|
|
977 <button
|
|
978 id="btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
979 onclick="ctx().switchToStep(6);"
|
|
980 class="btn btn-disabled switchStep"
|
|
981 disabled=""
|
|
982 >
|
|
983 <i class="fa fa-arrow-circle-right"></i> Validate this compound/mix!
|
|
984 </button>
|
|
985 <span
|
|
986 id="import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
987 style="display: none;"><img
|
|
988 src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/img/ajax-loader.gif"
|
|
989 title="please wait"
|
|
990 ></span>
|
|
991 <span
|
|
992 id="import1SpectrumResults-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
993 style="display: none;"
|
|
994 >
|
|
995 <button
|
|
996 id="btnSwitch-view-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
997 data-toggle="modal"
|
|
998 data-target="#modalShowSpectra-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
999 class="btn btn-success"
|
|
1000 >
|
|
1001 <i class="fa fa-eye"></i> View spectrum
|
|
1002 </button>
|
|
1003 <button
|
|
1004 id="btnSwitch-returntoStep3-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1005 onclick="ctx().switchToStep(3);"
|
|
1006 class="btn btn-primary"
|
|
1007 >
|
|
1008 <i class="fa fa-arrow-circle-up"></i> Add new peaklist!
|
|
1009 </button>
|
|
1010 </span>
|
|
1011 </div>
|
|
1012 <div class="col-lg-4">
|
|
1013 <br>
|
|
1014 <br>
|
|
1015 <br>
|
|
1016 </div>
|
|
1017 </div>
|
|
1018 <div class="col-lg-12">
|
|
1019 <div class="col-lg-8">
|
|
1020 <div
|
|
1021 id="alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1022 class="col-lg-6"
|
|
1023 ></div>
|
|
1024 </div>
|
|
1025 <div class="col-lg-4"> </div>
|
|
1026 </div>
|
|
1027 </div>
|
|
1028 </div>
|
|
1029 </div>
|
|
1030 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/handsontable/dist/handsontable.full.min.js"></script>
|
|
1031 <link
|
|
1032 rel="stylesheet"
|
|
1033 media="screen"
|
|
1034 href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/handsontable/dist/handsontable.full.min.css"
|
|
1035 >
|
|
1036 <link
|
|
1037 rel="stylesheet"
|
|
1038 media="screen"
|
|
1039 href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/handsontable/bootstrap/handsontable.bootstrap.min.css"
|
|
1040 >
|
|
1041 <div
|
|
1042 class="modal"
|
|
1043 id="modalPickCompound-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1044 tabindex="-1"
|
|
1045 role="dialog"
|
|
1046 aria-labelledby="modalPickCompoundLabel-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1047 aria-hidden="true"
|
|
1048 >
|
|
1049 <div class="modal-dialog">
|
|
1050 <div class="modal-content">
|
|
1051 <div class="modal-header">
|
|
1052 <button
|
|
1053 type="button"
|
|
1054 class="close"
|
|
1055 data-dismiss="modal"
|
|
1056 aria-hidden="true"
|
|
1057 >×</button>
|
|
1058 <h4
|
|
1059 class="modal-title"
|
|
1060 id="modalPickCompoundLabel-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1061 >
|
|
1062 Pick a compound
|
|
1063 </h4>
|
|
1064 </div>
|
|
1065 <div class="modal-body">
|
|
1066 <div class="form-group input-group">
|
|
1067 <span class="input-group-addon">Compound Name</span>
|
|
1068 <input
|
|
1069 id="add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1070 class="form-control"
|
|
1071 placeholder="e.g. Caffeine"
|
|
1072 type="text"
|
|
1073 />
|
|
1074 <span class="input-group-btn">
|
|
1075 <button
|
|
1076 class="btn btn-default"
|
|
1077 type="button"
|
|
1078 onclick="ctx().searchLocalCompound();"
|
|
1079 >
|
|
1080 <i class="fa fa-search"></i>
|
|
1081 </button>
|
|
1082 </span>
|
|
1083 </div>
|
|
1084 <div id="load-step-1-{{ TAB_INDEX_PLACEHOLDER }}" style="display: none;">
|
|
1085 <img src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/img/ajax-loader.gif" title="please wait">
|
|
1086 </div>
|
|
1087 <div
|
|
1088 id="ok-step-1-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1089 style="overflow: auto; max-height: 300px;"
|
|
1090 ></div>
|
|
1091 </div>
|
|
1092 <div class="modal-footer">
|
|
1093 <button
|
|
1094 type="button"
|
|
1095 class="btn btn-danger"
|
|
1096 data-dismiss="modal"
|
|
1097 onclick="ctx().clearLine()"
|
|
1098 >
|
|
1099 <i class="fa fa-eraser"></i> Clear
|
|
1100 </button>
|
|
1101 <button
|
|
1102 type="button"
|
|
1103 class="btn btn-default"
|
|
1104 data-dismiss="modal"
|
|
1105 >Fermer</button>
|
|
1106 </div>
|
|
1107 </div>
|
|
1108 </div>
|
|
1109 </div>
|
|
1110 <div
|
|
1111 class="modal "
|
|
1112 id="modalShowSpectra-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1113 tabindex="-1"
|
|
1114 role="dialog"
|
|
1115 aria-labelledby="modalShowSpectraLabel-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1116 aria-hidden="true"
|
|
1117 >
|
|
1118 <div class="modal-dialog">
|
|
1119 <div class="modal-content">
|
|
1120 <div class="modal-header">
|
|
1121 <button
|
|
1122 type="button"
|
|
1123 class="close"
|
|
1124 data-dismiss="modal"
|
|
1125 aria-hidden="true"
|
|
1126 >×</button>
|
|
1127 <h4
|
|
1128 class="modal-title"
|
|
1129 id="modalShowSpectraLabel-{{ TAB_INDEX_PLACEHOLDER }}"
|
|
1130 >Modal title</h4>
|
|
1131 </div>
|
|
1132 <div class="modal-body">
|
|
1133 <div class="te"></div>
|
|
1134 </div>
|
|
1135 <div class="modal-footer">
|
|
1136 </div>
|
|
1137 </div>
|
|
1138 </div>
|
|
1139 </div>
|
|
1140 </div>
|
|
1141 </div>
|
|
1142 </div>
|
|
1143 <div id="send_buttons_div">
|
|
1144 <button
|
|
1145 onclick="send_everything_to_peakforest('{{ PF_URL_PLACEHOLDER }}', '{{ PF_TOKEN_PLACEHOLDER }}')"
|
|
1146 class="btn btn-success"
|
|
1147 >
|
|
1148 <i class="fa fa-arrow-circle-right"></i>
|
|
1149 Send everything to peakforest!
|
|
1150 </button>
|
|
1151 <button class="btn btn-validate" onclick="ctx().exit()">
|
|
1152 Close MS2PF
|
|
1153 </button>
|
|
1154 </div>
|
|
1155 <script
|
|
1156 type="text/javascript"
|
|
1157 src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/jqueryform/2.8/jquery.form.min.js"
|
|
1158 ></script>
|
|
1159 <script
|
|
1160 src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/js/md5.min.js"
|
|
1161 ></script>
|
|
1162 </div>
|
|
1163 <nav class="navbar navbar-default navbar-fixed-bottom navbar-inverse navbar-main" role="navigation">
|
|
1164 <div class="navbar-header navbar-inverse footer">
|
|
1165 <ul id="ul-info-footer" class="nav navbar-nav">
|
|
1166 <li class="li-info-footer"><a id="linkcontact" href="mailto:contact@peakforest.org?subject=%5Babout%20peakforest%20webapp%5D">Contact</a></li>
|
|
1167 <li class="li-info-footer">
|
|
1168 <a id="about-peakforest" href="about-peakforest" data-toggle="modal" data-target="#modalAbout">À propos</a>
|
|
1169 </li>
|
|
1170 <li class="li-info-footer">
|
|
1171 <a href="https://peakforest.org/mypeakforest" target="_blank">Ma PeakForest</a>
|
|
1172 </li>
|
|
1173 <li class="li-info-footer">
|
|
1174 <a href="http://metabohub.fr" target="_blank">metaboHUB</a>
|
|
1175 </li>
|
|
1176 </ul>
|
|
1177 </div>
|
|
1178 </nav>
|
|
1179 <div
|
|
1180 class="modal"
|
|
1181 id="modalAbout"
|
|
1182 tabindex="-1"
|
|
1183 role="dialog"
|
|
1184 aria-labelledby="modalAboutLabel"
|
|
1185 aria-hidden="true"
|
|
1186 >
|
|
1187 <div class="modal-dialog">
|
|
1188 <div class="modal-content">
|
|
1189 <div class="modal-header">
|
|
1190 <button
|
|
1191 type="button"
|
|
1192 class="close"
|
|
1193 data-dismiss="modal"
|
|
1194 aria-hidden="true"
|
|
1195 >×</button>
|
|
1196 <h4 class="modal-title" id="modalAboutLabel">À propos de la Base de Données PeakForest</h4>
|
|
1197 </div>
|
|
1198 <div class="modal-body">
|
|
1199 <div class="te"></div>
|
|
1200 </div>
|
|
1201 <div class="modal-footer">
|
|
1202 </div>
|
|
1203 </div>
|
|
1204 </div>
|
|
1205 </div>
|
|
1206 <div
|
|
1207 class="modal"
|
|
1208 id="modalMyPeakForest"
|
|
1209 tabindex="-1"
|
|
1210 role="dialog"
|
|
1211 aria-labelledby="modalMyPFLabel"
|
|
1212 aria-hidden="true"
|
|
1213 >
|
|
1214 <div class="modal-dialog">
|
|
1215 <div class="modal-content">
|
|
1216 <div class="modal-header">
|
|
1217 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
1218 <h4 class="modal-title" id="modalAboutLabel">Ma base de Données PeakForest</h4>
|
|
1219 </div>
|
|
1220 <div class="modal-body">
|
|
1221 <div class="te"></div>
|
|
1222 </div>
|
|
1223 <div class="modal-footer">
|
|
1224 </div>
|
|
1225 </div>
|
|
1226 </div>
|
|
1227 </div>
|
|
1228 {{ EMBED_JS }}
|
|
1229 <script type="text/javascript">context = context_1 ;</script>
|
|
1230 </body>
|
|
1231 </html> |