Mercurial > repos > lain > ms_to_peakforest_it

comparison src/compound-ref.html @ 1:7e3085fc60c1 draft default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
master branch Updating
author lain
date Wed, 30 Aug 2023 14:21:18 +0000
parents
children
comparison
equal deleted inserted replaced
0:b58b229c4cbf 1:7e3085fc60c1
1 <div class="tab-pane fade {{ ACTIVE_TAB_PLACEHOLDER }} in" id="tab-index-{{ TAB_INDEX_PLACEHOLDER }}">
2 <div class="panel-group" id="accordion-{{ TAB_INDEX_PLACEHOLDER }}">
3 <div class="panel panel-default">
4 <div class="panel-heading panel-success">
5 <h4 class="panel-title">
6 <a data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step0-{{ TAB_INDEX_PLACEHOLDER }}">
7 Spectrum Type <i id="step0sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
8 </a>
9 </h4>
10 </div>
11 <div id="step0-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse in">
12 <div class="panel-body">
13 <button class="btn btn-disabled" disabled="disabled"><i class="fa fa-plus-circle"></i> GC-MS spectrum</button>
14 <button id="set_LC_MS_spectrum_button" class="btn btn-primary" onclick="ctx().addOneSpectrum(2);"><i class="fa fa-plus-circle"></i> LC-MS spectrum</button>
15 <button id="set_LC_MSMS_spectrum_button" class="btn btn-primary" onclick="ctx().addOneSpectrum(5);"><i class="fa fa-plus-circle"></i> LC-MSMS spectrum</button>
16 </div>
17 </div>
18 </div>
19 <div id="add1spectrum-sampleData-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
20 <div class="panel-heading panel-success">
21 <h4 class="panel-title">
22 <a id="linkActivateStep1-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step1-{{ TAB_INDEX_PLACEHOLDER }}">
23 Sample Type <i id="step1sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
24 </a>
25 </h4>
26 </div>
27 <div id="step1-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
28 <div class="panel-body">
29 <div class="col-lg-12">
30 <div class="col-lg-8">
31 <div class="panel panel-default">
32 <div class="panel-heading">
33 <div class="form-group input-group has-error">
34 <span class="input-group-addon">Sample Type</span>
35 <select id="add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-sampleForm is-mandatory">
36 <option value="" selected="selected" disabled="disabled">choose in list…</option>
37 <option value="compound-ref">Ref. Chemical Compound</option>
38 </select>
39 </div>
40 </div>
41 <div class="panel-body">
42 <div id="add1spectrum-sample-type-compound-ref-{{ TAB_INDEX_PLACEHOLDER }}" class="add1spectrum-sample-type-panel" style="display:none;">
43 <div class="form-group input-group has-error">
44 <span class="input-group-addon">InChIKey</span>
45 <input id="add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="pickChemicalCompound form-control add1spectrum add1spectrum-sampleForm is-mandatory" placeholder="e.g. RYYVLZVUVIJVGH-UHFFFAOYSA-N">
46 <span class="input-group-btn">
47 <button class="btn btn-default" type="button" onclick="ctx().pickChemicalCompound();">
48 <i class="fa fa-search"></i>
49 </button>
50 </span>
51 </div>
52 <div class="form-group input-group has-warning">
53 <span class="input-group-addon">concentration <small>(mmol/L)</small></span>
54 <input id="add1spectrum-sample-concentration-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-sampleForm is-optional" placeholder="42">
55 </div>
56 <div class="form-group input-group opt-ms has-warning" style="display: none;">
57 <span class="input-group-addon">solvent</span>
58 <select id="add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-sampleForm is-optional"><option value="" selected="selected" disabled="disabled">choose in list…</option><option value="none" class="">none</option><option value="H2O" class="">H2O</option><option value="3/5 in H2O + 0.1% AF/ ACN + 0.1% AF (50/50, V/V)" class="">3/5 in H2O + 0.1% AF/ ACN + 0.1% AF (50/50, V/V)</option><option value="ACN/H2O (1/1, V/V)" class="">ACN/H2O (1/1, v/v)</option><option value="CH3OH/H2O (1/1, V/V)" class="">CH3OH/H2O (1/1, v/v)</option><option value="H2O/ACN (40/60)" class="">H2O/ACN (40/60)</option><option value="H2O/ACN (95/5)" class="">H2O/ACN (95/5)</option><option value="H20+0.1% FORMIC ACID / ACN+0.1% FORMIC ACID (50/50, V/V)" class="">H20+0.1% Formic Acid / ACN+0.1% Formic Acid (50/50, V/V)</option></select>
59 </div>
60 <div class="form-group input-group has-warning">
61 <span class="input-group-addon">InChI</span>
62 <input id="add1spectrum-sample-inchi-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="pickChemicalCompound form-control add1spectrum add1spectrum-sampleForm is-optional" placeholder="e.g. InChI=1S/C8H10N4O2/c1-10-4-9-6-5(10)7(13)12(3)8(14)11(6)2/h4H,1-3H3">
63 </div>
64 <div class="form-group input-group has-warning">
65 <span class="input-group-addon">Molecule common name</span>
66 <input id="add1spectrum-sample-commonName-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="pickChemicalCompound form-control add1spectrum add1spectrum-sampleForm is-optional" placeholder="e.g. Caffeine">
67 </div>
68 </div>
69 <div id="add1spectrum-sample-type-rcc-added-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default add1spectrum-sample-type-panel" style="display:none;">
70 <div class="panel-heading">
71 <h3 class="panel-title">Reference compound added</h3>
72 </div>
73 <div class="panel-body" style="padding: 0px;">
74 <div id="container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}" class="handsontable"></div>
75 </div>
76 </div>
77 </div>
78 </div>
79 </div>
80 <div class="col-lg-4">
81 <div id="sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}"></div>
82 &nbsp;
83 </div>
84 </div>
85 <div class="col-lg-12">
86 <div class="col-lg-8">
87 <br>
88 <button id="btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(2);" class="btn btn-disabled switchStep" disabled=""><i class="fa fa-arrow-circle-down"></i> Next!</button>
89 </div>
90 <div class="col-lg-4">&nbsp;</div>
91 </div>
92 </div>
93 </div>
94 </div>
95 <div id="add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
96 <div class="panel-heading panel-success">
97 <h4 class="panel-title">
98 <a id="linkActivateStep2-lc-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step2-lc-{{ TAB_INDEX_PLACEHOLDER }}">
99 Liquid Chromatography <i id="step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
100 </a>
101 </h4>
102 </div>
103 <div id="step2-lc-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
104 <div class="panel-body">
105 <div class="col-lg-12">
106 <div class="col-lg-6">
107 <div class="panel panel-default">
108 <div class="panel-heading">
109 <h3 class="panel-title">Chromatography Param.</h3>
110 </div>
111 <div class="panel-body">
112 <div class="form-group input-group has-error">
113 <span class="input-group-addon">Method</span>
114 <select
115 id="add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}"
116 class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"
117 ></select>
118 </div>
119 <div id="alertBoxSelectTemplate-{{ TAB_INDEX_PLACEHOLDER }}"></div>
120 <div class="form-group input-group has-error">
121 <span class="input-group-addon">Column constructor</span>
122 <select id="add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"><option value="" selected="selected" disabled="disabled">choose in list…</option><option value="Agilent">Agilent</option><option value="alltech">Alltech</option><option value="CIL cluzeau">Cil cluzeau</option><option value="Daicel">Daicel</option><option value="Hypersil">Hypersil</option><option value="Interchim">Interchim</option><option value="Macherey nagel">Macherey nagel</option><option value="Merck">Merck</option><option value="Phenomenex">Phenomenex</option><option value="Shiseido">Shiseido</option><option value="Supelco (sigma-aldrich)">Supelco (sigma-aldrich)</option><option value="Thermo">Thermo</option><option value="Vydac">Vydac</option><option value="Waters">Waters</option><option value="YMC">YMC</option><option value="other">Other</option></select>
123 </div>
124 <div class="form-group input-group ">
125 <span class="input-group-addon">Column constructor (other)</span>
126 <input id="add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm" disabled="disabled" placeholder="e.g. HAL 9000">
127 </div>
128 <div class="form-group input-group has-warning">
129 <span class="input-group-addon">Column name</span>
130 <input id="add1spectrum-chromatoLC-colName-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. UPLC HSS T3">
131 </div>
132 <div class="form-group input-group has-error">
133 <span class="input-group-addon">Column length (mm)</span>
134 <input id="add1spectrum-chromatoLC-colLength-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory" placeholder="e.g. 150">
135 </div>
136 <div class="form-group input-group has-error">
137 <span class="input-group-addon">Column diameter (mm)</span>
138 <input id="add1spectrum-chromatoLC-colDiameter-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory" placeholder="e.g. 2.1">
139 </div>
140 <div class="form-group input-group has-error">
141 <span class="input-group-addon">Particule size (µm)</span>
142 <input id="add1spectrum-chromatoLC-colParticuleSize-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory" placeholder="e.g. 1.8">
143 </div>
144 <div class="form-group input-group has-warning">
145 <span class="input-group-addon">Column temperature (°C)</span>
146 <input id="add1spectrum-chromatoLC-colTemperature-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 30">
147 </div>
148 <div class="form-group input-group has-error">
149 <span class="input-group-addon">LC mode</span>
150 <select id="add1spectrum-chromatoLC-LCMode-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory">
151 <option value="" selected="selected" disabled="disabled">choose in list…</option>
152 <option value="Gradient">Gradient</option>
153 <option value="Isocratic">Isocratic</option>
154 </select>
155 </div>
156 <div class="form-group input-group has-warning">
157 <span class="input-group-addon">Separation flow rate (µL/min)</span>
158 <input id="add1spectrum-chromatoLC-separationFlowRate-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 400">
159 </div>
160 <div class="form-group input-group has-error">
161 <span class="input-group-addon">Separation solvent A</span>
162 <select id="add1spectrum-chromatoLC-separationSolvA-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"><option value="" selected="selected" disabled="disabled">choose in list…</option><option value="5% ACN + 0.1% FA in H2O">5% ACN + 0.1% FA in H2O</option><option value="10% ACN + 0.1% FA in H2O">10% ACN + 0.1% FA in H2O</option><option value="10mM (NH4)2CO3 / ACN (20/80) (v/v)">10mM (NH4)2CO3 / ACN (20/80) (v/v)</option><option value="Acetonitrile">Acetonitrile</option><option value="Acetonitrile + 0.1% Formic Acid">Acetonitrile + 0.1% Formic Acid</option><option value="H2O + 0.1% Formic Acid">H2O + 0.1% Formic Acid</option><option value="H2O, ammonium carbonate 10 mM, pH10.5">H2O, ammonium carbonate 10 mM, pH10.5</option><option value="H2O, ammonium acetate 2.5 mM">H2O, ammonium acetate 2.5 mM</option><option value="H2O / CH3OH / CH3CO2H (95/5/0.1)">H2O / CH3OH / CH3CO2H (95/5/0.1)</option><option value="Methanol">Methanol</option><option value="Methanol / H2O (1/1)">Methanol / H2O (1/1)</option><option value="Methanol / H2O (1/1), 0.1% FA">Methanol / H2O (1/1), 0.1% FA</option><option value="Methanol / CH3CO2H (100/0.1)">Methanol / CH3CO2H (100/0.1)</option><option value="Methanol / ACN (60/40) ammonium acetate 2.5 mM">Methanol / ACN (60/40) ammonium acetate 2.5 mM</option></select>
163 </div>
164 <div class="form-group input-group has-warning">
165 <span class="input-group-addon">pH solvent A (if acqueous solvant)</span>
166 <input id="add1spectrum-chromatoLC-separationSolvApH-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 7.0">
167 </div>
168 <div class="form-group input-group has-error">
169 <span class="input-group-addon">Separation solvent B</span>
170 <select id="add1spectrum-chromatoLC-separationSolvB-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-chromatoLCForm is-mandatory"><option value="" selected="selected" disabled="disabled">choose in list…</option><option value="5% ACN + 0.1% FA in H2O">5% ACN + 0.1% FA in H2O</option><option value="10% ACN + 0.1% FA in H2O">10% ACN + 0.1% FA in H2O</option><option value="10mM (NH4)2CO3 / ACN (20/80) (v/v)">10mM (NH4)2CO3 / ACN (20/80) (v/v)</option><option value="Acetonitrile">Acetonitrile</option><option value="Acetonitrile + 0.1% Formic Acid">Acetonitrile + 0.1% Formic Acid</option><option value="H2O + 0.1% Formic Acid">H2O + 0.1% Formic Acid</option><option value="H2O, ammonium carbonate 10 mM, pH10.5">H2O, ammonium carbonate 10 mM, pH10.5</option><option value="H2O, ammonium acetate 2.5 mM">H2O, ammonium acetate 2.5 mM</option><option value="H2O / CH3OH / CH3CO2H (95/5/0.1)">H2O / CH3OH / CH3CO2H (95/5/0.1)</option><option value="Methanol">Methanol</option><option value="Methanol / H2O (1/1)">Methanol / H2O (1/1)</option><option value="Methanol / H2O (1/1), 0.1% FA">Methanol / H2O (1/1), 0.1% FA</option><option value="Methanol / CH3CO2H (100/0.1)">Methanol / CH3CO2H (100/0.1)</option><option value="Methanol / ACN (60/40) ammonium acetate 2.5 mM">Methanol / ACN (60/40) ammonium acetate 2.5 mM</option></select>
171 </div>
172 <div class="form-group input-group has-warning">
173 <span class="input-group-addon">pH solvent B (if acqueous solvant)</span>
174 <input id="add1spectrum-chromatoLC-separationSolvBApH-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-chromatoLCForm is-optional" placeholder="e.g. 7.0">
175 </div>
176 </div>
177 </div>
178 </div>
179 <div class="col-lg-6">
180 <div class="panel panel-default">
181 <div class="panel-heading">
182 <h3 class="panel-title">Separation flow gradient</h3>
183 </div>
184 <div class="panel-body" style="padding: 0px;">
185 <div id="container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}" class="handsontable"></div>
186 </div>
187 </div>
188 </div>
189 </div>
190 <div class="col-lg-12">
191 <div class="col-lg-8">
192 <br>
193 <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>
194 </div>
195 <div class="col-lg-4">&nbsp;</div>
196 </div>
197 </div>
198 </div>
199 </div>
200 <div id="add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
201 <div class="panel-heading panel-success">
202 <h4 class="panel-title">
203 <a id="linkActivateStep2-gc-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step2-gc-{{ TAB_INDEX_PLACEHOLDER }}">
204 Gaz Chromatography <i id="step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
205 </a>
206 </h4>
207 </div>
208 <div id="step2-gc-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
209 <div class="panel-body">
210 <div class="col-lg-12">
211 <div class="col-lg-6">
212 i &lt;3 GC
213 </div>
214 <div class="col-lg-6">&nbsp;</div>
215 </div>
216 <div class="col-lg-12">
217 <div class="col-lg-8">
218 <br>
219 <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>
220 </div>
221 <div class="col-lg-4">&nbsp;</div>
222 </div>
223 </div>
224 </div>
225 </div>
226 <div id="add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
227 <div class="panel-heading panel-success">
228 <h4 class="panel-title">
229 <a id="linkActivateStep3-ms-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step3-ms-{{ TAB_INDEX_PLACEHOLDER }}">
230 MS Analyzer <i id="step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
231 </a>
232 </h4>
233 </div>
234 <div id="step3-ms-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
235 <div class="panel-body">
236 <div class="col-lg-12">
237 <div class="col-lg-6">
238 <br>
239 <div class="panel panel-default">
240 <div class="panel-heading">
241 <h3 class="panel-title">Analyzer</h3>
242 </div>
243 <div class="panel-body">
244 <div class="form-group input-group has-error">
245 <span class="input-group-addon">Instrument</span>
246 <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">
247 </div>
248 <div class="form-group input-group has-warning">
249 <span class="input-group-addon">Model</span>
250 <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; ...">
251 </div>
252 <div class="form-group">
253 <div class="form-group input-group has-error">
254 <span class="input-group-addon">Ion analyzer Type</span>
255 <input id="add1spectrum-analyzer-ms-ionAnalyzerType-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory" placeholder="e.g. QTOF; QQQ; ...">
256 </div>
257 <p class="help-block">
258 <small>
259 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");
260 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>.
261 </small>
262 </p>
263 </div>
264 </div>
265 </div>
266 </div>
267 <div class="col-lg-6">
268 <br>
269 <div class="panel panel-default">
270 <div class="panel-heading">
271 <h3 class="panel-title">Molecule Ionization</h3>
272 </div>
273 <div class="panel-body">
274 <div class="form-group input-group has-error">
275 <span class="input-group-addon">Ionization method <small>(POS/NEG)</small></span>
276 <select id="add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory one-or-more">
277 <option value="" selected="selected" disabled="disabled">choose in list… (POS)</option>
278 <option value="ACPI">ACPI</option><option value="APPI">APPI</option><option value="EI">EI</option><option value="ESI">ESI</option><option value="FAB">FAB</option><option value="MALDI">MALDI</option></select>
279 <select id="add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" class="form-control add1spectrum add1spectrum-analyzerMSForm is-mandatory one-or-more">
280 <option value="" selected="selected" disabled="disabled">choose in list… (NEG)</option>
281 <option value="ACPI">ACPI</option><option value="APPI">APPI</option><option value="EI">EI</option><option value="ESI">ESI</option><option value="FAB">FAB</option><option value="MALDI">MALDI</option></select>
282 </div>
283 <div class="form-group input-group has-warning">
284 <span class="input-group-addon">Spray (needle) gaz flow <br><small>(arbitrary in Xcalibur, POS/NEG)</small></span>
285 <input id="add1spectrum-analyzserMS-sprayGazFlow-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 40 (POS)">
286 <input id="add1spectrum-analyzserMS-sprayGazFlow-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 20 (NEG)">
287 </div>
288 <div class="form-group input-group has-warning">
289 <span class="input-group-addon">Vaporizer gaz flow <br><small>(arbitrary in Xcalibur, POS/NEG)</small></span>
290 <input id="add1spectrum-analyzserMS-vaporizerGazFlow-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 10 (POS)">
291 <input id="add1spectrum-analyzserMS-vaporizerGazFlow-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 5 (NEG)">
292 </div>
293 <div class="form-group input-group has-warning">
294 <span class="input-group-addon">Vaporizer temperature <br><small>(°C, POS/NEG)</small></span>
295 <input id="add1spectrum-analyzserMS-vaporizerTemperature-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 330 (POS)">
296 <input id="add1spectrum-analyzserMS-vaporizerTemperature-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 330 (NEG)">
297 </div>
298 <div class="form-group input-group has-warning">
299 <span class="input-group-addon">Source gaz flow <br><small>(arbitrary in Xcalibur, POS/NEG)</small></span>
300 <input id="add1spectrum-analyzserMS-sourceGazFlow-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 40 (POS)">
301 <input id="add1spectrum-analyzserMS-sourceGazFlow-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 40 (NEG)">
302 </div>
303 <div class="form-group input-group has-warning">
304 <span class="input-group-addon">Ion transfer tube temperature <br> Transfer capillary temperature <small>(°C, POS/NEG)</small></span>
305 <input id="add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 350 (POS)">
306 <input id="add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 350 (NEG)">
307 </div>
308 <div class="form-group input-group has-warning">
309 <span class="input-group-addon">High voltage (ESI) <br> Corona voltage (APCI) <small>(in kV, POS/NEG)</small></span>
310 <input id="add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-pos-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 3.5 (POS)">
311 <input id="add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-neg-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g. 2.8 (NEG)">
312 </div>
313 </div>
314 </div>
315 </div>
316 <div class="col-lg-6 opt-msms">
317 <br>
318 <div class="panel panel-default">
319 <div class="panel-heading">
320 <h3 class="panel-title">Ion Storage / Ion Beam</h3>
321 </div>
322 <div class="panel-body">
323 <div class="form-group input-group has-warning">
324 <span class="input-group-addon">Type <small>(storage / beam)</small></span>
325 <select id="add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional one-or-more">
326 <option value="" selected="selected" disabled="disabled">choose in list…</option>
327 <option value="trap">Ion Trap</option>
328 <option value="beam">Ion Beam</option>
329 </select>
330 </div>
331 <p class="help-block">
332 <small>
333 Ion storage: Ion Trap (IT) and ICR.
334 <br>Ion beam: Q or H collision Cell (QQQ, QQIT, QQ/TOF, Fusion).
335 </small>
336 </p>
337 <div class="form-group input-group has-success">
338 <span class="input-group-addon">Gas </span>
339 <select id="add1spectrum-ionTrapBeam-ionGas-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional ">
340 <option value="He">He</option>
341 <option value="N2">N2</option>
342 <option value="Ar">Ar</option>
343 </select>
344 </div>
345 <div class="form-group input-group has-warning">
346 <span class="input-group-addon">Gas pressure</span>
347 <input id="add1spectrum-ionTrapBeam-ionGasPressureValue-{{ TAB_INDEX_PLACEHOLDER }}" type="text" style="max-width: 50%;" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional ">
348 <select id="add1spectrum-ionTrapBeam-ionGasPressureUnit-{{ TAB_INDEX_PLACEHOLDER }}" style="max-width: 50%;" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional ">
349 <option value="" selected="selected" disabled="disabled">choose in list…</option>
350 <option value="mbar">mbar</option>
351 <option value="au">a.u.</option>
352 </select>
353 </div>
354 <div class="form-group input-group add1spectrum-ionTrap has-warning">
355 <span class="input-group-addon">Frequency Shift <small>(KHz)</small></span>
356 <input id="add1spectrum-ionTrapBeam-ionFrequencyShift-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g.: ...">
357 </div>
358 <div class="form-group input-group add1spectrum-ionTrap has-warning">
359 <span class="input-group-addon">Ion Number <small>(AGC or ICC)</small></span>
360 <input id="add1spectrum-ionTrapBeam-ionNumber-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-analyzerMSForm is-optional" placeholder="e.g.: ...">
361 </div>
362 </div>
363 </div>
364 </div>
365 </div>
366 <div class="col-lg-12">
367 <div class="col-lg-8">
368 <br>
369 <button id="btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(4);" class="btn btn-disabled switchStep" disabled=""><i class="fa fa-arrow-circle-down"></i> Next!</button>
370 </div>
371 <div class="col-lg-4">&nbsp;</div>
372 </div>
373 </div>
374 </div>
375 </div>
376 <div id="add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
377 <div class="panel-heading panel-success">
378 <h4 class="panel-title">
379 <a id="linkActivateStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step4-ms-{{ TAB_INDEX_PLACEHOLDER }}">
380 MS Peaks <i id="step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
381 </a>
382 </h4>
383 </div>
384 <div id="step4-ms-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
385 <div class="panel-body">
386 <div class="col-lg-12">
387 <!--
388 <div class="form-group input-group col-lg-3 has-success">
389 <span class="input-group-addon">scan type</span>
390 <select style="width: 150px;" id="add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-mandatory">
391 <option value="" disabled="disabled">choose in list…</option>
392 <option class="enable-if-ms" value="ms" selected="selected">ms</option>
393 <option class="enable-if-msms" value="ms2">ms2</option>
394 </select>
395 </div>
396 -->
397 <div class="form-group input-group col-lg-3 has-error">
398 <span class="input-group-addon">polarity</span>
399 <select style="width: 150px;" id="add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-mandatory">
400 <option value="" selected="selected" disabled="disabled">choose in list…</option>
401 <option value="positive">positive</option>
402 <option value="negative">negative</option>
403 </select>
404 </div>
405 <div class="form-group input-group col-lg-3 has-error">
406 <span class="input-group-addon">resolution</span>
407 <select style="width: 150px;" id="add1spectrum-peaksMS-resolution-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-mandatory">
408 <option value="" disabled="disabled">choose in list…</option>
409 <option value="low">low</option>
410 <option selected="selected" value="high">high</option>
411 </select>
412 </div>
413 <div class="form-group input-group col-lg-3 has-success">
414 <span class="input-group-addon">curation</span>
415 <select style="width: 150px;" id="add1spectrum-peaksMS-curation-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-optional">
416 <option value="no_curation" selected="selected">no curation</option>
417 <option value="peaks_RI_sup_1percent">Peaks RI &gt; 1%</option>
418 <option value="top_50_peaks">Top 50 peaks</option>
419 <option value="top_20_peaks">Top 20 peaks</option>
420 <option value="top_10_peaks">Top 10 peaks</option>
421 <option value="similar_chromatographic_profile">Similar chromatographic profile</option>
422 </select>
423 </div>
424 </div>
425 <br>
426 <div class="col-lg-12 opt-msms">
427 <hr><!--
428 <div class="form-group input-group col-lg-4 has-warning">
429 <span class="input-group-addon">precursor spectrum</span>
430 <select style="width: 150px;" id="add1spectrum-peaksMS-msPrecursor-{{ TAB_INDEX_PLACEHOLDER }}" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm-peaklist-reset add1spectrum-peaksMSForm is-optional">
431 <option value="" disabled="disabled">choose in list…</option>
432 </select>
433 </div> -->
434
435 <div class="form-group input-group col-lg-4 has-success">
436 <span class="input-group-addon">Isolation mode <i class="fa fa-question-circle" title="IT / Q / TOF / ICR"></i></span>
437 <select id="add1spectrum-peaksMS-isolationMode-{{ TAB_INDEX_PLACEHOLDER }}" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm is-optional add1spectrum-peaksMSForm-peaklist-reset">
438 <option value="" disabled="disabled">choose in list…</option>
439 <option value="IT">IT</option>
440 <option value="Q">Q</option>
441 <option value="TOF">TOF</option>
442 <option value="ICR">ICR</option>
443 </select>
444 </div>
445 <div class="form-group input-group col-lg-4 has-warning">
446 <span class="input-group-addon">Isolation window <i class="fa fa-question-circle" title="(+ / - value)"></i></span>
447 <input id="add1spectrum-peaksMS-isolationWindow-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional add1spectrum-peaksMSForm-peaklist-reset" placeholder="e.g. ...">
448 </div>
449 <div class="form-group input-group col-lg-4 has-warning">
450 <span class="input-group-addon">qz isolation / activation <i class="fa fa-question-circle" title="if IT"></i> <small>(no unit)</small></span>
451 <input id="add1spectrum-peaksMS-qzIsolation-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional add1spectrum-peaksMSForm-peaklist-reset" placeholder="e.g. ...">
452 </div>
453 <div class="form-group input-group col-lg-4 has-warning">
454 <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>
455 <input id="add1spectrum-peaksMS-activationTime-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional add1spectrum-peaksMSForm-peaklist-reset" placeholder="e.g. ...">
456 </div>
457 <div class="form-group input-group col-lg-4 has-success">
458 <span class="input-group-addon">Mode <i class="fa fa-question-circle" title="HCD / CID / ECD /ETD"></i></span>
459 <select id="add1spectrum-peaksMS-mode-{{ TAB_INDEX_PLACEHOLDER }}" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist add1spectrum-peaksMSForm is-optional ">
460 <option value="" disabled="disabled">choose in list…</option>
461 <option value="HCD">HCD</option>
462 <option value="CID">CID</option>
463 <option value="ECD">ECD</option>
464 <option value="ETD">ETD</option>
465 </select>
466 </div>
467
468 <div class="form-group input-group col-lg-4 has-warning">
469 <span class="input-group-addon">Frag. energy <i class="fa fa-question-circle" title="without unit"></i> </span>
470 <input id="add1spectrum-peaksMS-frag-nrj-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="disabled-if-ms form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional" placeholder="e.g. ...">
471 </div>
472 </div>
473 <div class="col-lg-12">
474 <div class="form-group input-group col-lg-4 has-warning">
475 <span class="input-group-addon">Resolution FWHM <small>(resolution@mass)</small></span>
476 <input id="add1spectrum-analyzer-ms-resolutionFWHM-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-optional" placeholder="e.g. 6500@1000">
477 </div>
478 <div class="form-group input-group col-lg-4 has-error">
479 <span class="input-group-addon">m/z range <small>(ppm) from / to</small></span>
480 <input style="width: 100px;" id="add1spectrum-peaksMS-rangeFrom-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory" placeholder="50" value="{{ DEFAULT_MIN_MZ }}">
481 <input style="width: 100px;" id="add1spectrum-peaksMS-rangeTo-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory" placeholder="500" value="{{ DEFAULT_MAX_MZ }}">
482 </div>
483 <div class="form-group input-group col-lg-4 has-error">
484 <span class="input-group-addon">retention time (min) <small>from / to</small></span>
485 <input style="width: 100px;" id="add1spectrum-peaksMS-rtMinFrom-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory" placeholder="0.9" value="{{ DEFAULT_MIN_RT }}">
486 <input style="width: 100px;" id="add1spectrum-peaksMS-rtMinTo-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-mandatory" placeholder="1.4" value="{{ DEFAULT_MAX_RT }}">
487 </div>
488 </div>
489 <div class="col-lg-12">
490 <div class="form-group input-group col-lg-4 has-warning">
491 <span class="input-group-addon">retention time (% solvant) <small>from / to</small></span>
492 <input style="width: 100px;" id="add1spectrum-peaksMS-rtSolvFrom-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-optional" placeholder="??">
493 <input style="width: 100px;" id="add1spectrum-peaksMS-rtSolvTo-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum-peaksMSForm-peaklist add1spectrum is-optional" placeholder="??">
494 </div>
495 <div class="col-lg-4">&nbsp;</div>
496 </div>
497 <div class="col-lg-12">
498 <div class="col-lg-11">
499 <br>
500 <ul class="nav nav-tabs" style="margin-bottom: 15px;">
501 <li class="active"><a id="link-spectrum-peaklist-lcms-{{ TAB_INDEX_PLACEHOLDER }}" href="#spectrum-peaklist-lcms-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="tab"><i class="fa fa-table"></i> Peak List</a></li>
502 <li class=""><a id="link-spectrum-preview-lcms-{{ TAB_INDEX_PLACEHOLDER }}" href="#spectrum-preview-lcms-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().updateLCMSspectraViewer()" data-toggle="tab"><i class="fa fa-bar-chart-o"></i> Spectrum Preview</a></li>
503 </ul>
504 <div id="spectrum-signal-data-lcms-{{ TAB_INDEX_PLACEHOLDER }}" class="tab-content" style="">
505 <div class="tab-pane fade active in" id="spectrum-peaklist-lcms-{{ TAB_INDEX_PLACEHOLDER }}">
506 <div class="panel-body" style="padding: 0px;">
507 <div id="container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}" class="handsontable col-lg-6" style="display: inline-block;"></div>
508
509 <div class="form-group input-group col-lg-3 has-warning hidden-if-ms">
510 <span class="input-group-addon">Precursor ion <small>(M/Z)</small><i class="fa fa-question-circle" title="2 digits of precision."></i></span>
511 <input id="add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-peaksMSForm-peaklist is-mandatory add1spectrum-peaksMSForm-peaklist-reset displayed-if-msms" placeholder="e.g. 123.45">
512 </div>
513 </div>
514 </div>
515 <div class="tab-pane fade" id="spectrum-preview-lcms-{{ TAB_INDEX_PLACEHOLDER }}">
516 <div id="containter-lcms-spectrum-preview-{{ TAB_INDEX_PLACEHOLDER }}" style="width: 80%;"></div>
517 </div>
518 </div>
519 </div>
520 </div>
521 <div class="col-lg-12">
522 <div class="col-lg-8">
523 <button class="btn btn-success" onclick="$('#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}').change()">check</button>
524 <button id="btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(5);" class="btn switchStep btn-primary"><i class="fa fa-arrow-circle-down"></i> Next!</button>
525 <br>
526 <br>
527 </div>
528 <div class="col-lg-4">&nbsp;</div>
529 </div>
530 </div>
531 </div>
532 </div>
533 <div id="add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}" class="panel panel-default" style="display: none;">
534 <div class="panel-heading panel-success">
535 <h4 class="panel-title">
536 <a id="linkActivateStep5-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="collapse" data-parent="#accordion-{{ TAB_INDEX_PLACEHOLDER }}" href="#step5-{{ TAB_INDEX_PLACEHOLDER }}">
537 Other <i id="step5sign-{{ TAB_INDEX_PLACEHOLDER }}" class="fa fa-question-circle"></i>
538 </a>
539 </h4>
540 </div>
541 <div id="step5-{{ TAB_INDEX_PLACEHOLDER }}" class="panel-collapse collapse">
542 <div class="panel-body">
543 <div class="col-lg-12">
544 <div class="col-lg-6">
545 <div class="panel panel-default">
546 <div class="panel-heading">
547 <h3 class="panel-title">Ownership</h3>
548 </div>
549 <div class="panel-body">
550 <div class="form-group input-group has-error">
551 <span class="input-group-addon">data author(s)</span>
552 <input id="add1spectrum-other-author-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-otherForm is-mandatory" placeholder="enter your lab. / plateforme name" value="">
553 </div>
554 <div class="form-group input-group has-warning">
555 <span class="input-group-addon">data validator(s)</span>
556 <input id="add1spectrum-other-validator-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-otherForm is-optional" placeholder="name of the personne who checked all data in this file">
557 </div>
558 <div class="form-group input-group has-warning">
559 <span class="input-group-addon">acquisition date</span>
560 <input id="add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}" data-date-format="yyyy-mm-dd" type="text" class="form-control add1spectrum add1spectrum-otherForm datepicker is-optional" value="" placeholder="2022-11-04">
561 </div>
562 <div class="form-group input-group has-warning">
563 <span class="input-group-addon">data ownership</span>
564 <input id="add1spectrum-other-owner-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-otherForm is-optional" placeholder="enter your lab. / plateforme name &amp; sample provider;">
565 </div>
566 </div>
567 </div>
568 </div>
569 <div class="col-lg-6">
570 <div class="panel panel-default">
571 <div class="panel-heading">
572 <h3 class="panel-title">Raw File</h3>
573 </div>
574 <div class="panel-body">
575 <div class="form-group input-group has-warning">
576 <span class="input-group-addon">raw file name</span>
577 <input id="add1spectrum-other-fileName-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-otherForm is-optional" placeholder="needed to retrieve file later">
578 </div>
579 <div class="form-group input-group has-warning">
580 <span class="input-group-addon">raw file size (Ko)</span>
581 <input id="add1spectrum-other-fileSize-{{ TAB_INDEX_PLACEHOLDER }}" type="text" class="form-control add1spectrum add1spectrum-otherForm is-optional" placeholder="optional, to check if the file is correct">
582 </div>
583 </div>
584 </div>
585 </div>
586 </div>
587 <div class="col-lg-12">
588 <div class="col-lg-8">
589 <br>
590 <button id="btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(6);" class="btn btn-disabled switchStep" disabled=""><i class="fa fa-arrow-circle-right"></i> Validate this compound/mix!</button>
591 <!-- <button onclick="enable_tab({{ TAB_INDEX_PLACEHOLDER }})" class="btn btn-success">
592 <i class="fa fa-arrow-circle-right"></i>Modify this compound/mix!
593 </button> -->
594 <span id="import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}" style="display: none;"><img src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/img/ajax-loader.gif" title="please wait"></span>
595 <span id="import1SpectrumResults-{{ TAB_INDEX_PLACEHOLDER }}" style="display: none;">
596 <button id="btnSwitch-view-{{ TAB_INDEX_PLACEHOLDER }}" data-toggle="modal" data-target="#modalShowSpectra-{{ TAB_INDEX_PLACEHOLDER }}" class="btn btn-success"><i class="fa fa-eye"></i> View spectrum</button>
597 <button id="btnSwitch-returntoStep3-{{ TAB_INDEX_PLACEHOLDER }}" onclick="ctx().switchToStep(3);" class="btn btn-primary"><i class="fa fa-arrow-circle-up"></i> Add new peaklist!</button>
598 </span>
599 </div>
600 <div class="col-lg-4"><br><br><br></div>
601 </div>
602 <div class="col-lg-12">
603 <div class="col-lg-8">
604 <div id="alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}" class="col-lg-6"></div>
605 </div>
606 <div class="col-lg-4">&nbsp;</div>
607 </div>
608 </div>
609 </div>
610 </div>
611 </div>
612 <script src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/handsontable/dist/handsontable.full.min.js"></script>
613 <link rel="stylesheet" media="screen" href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/handsontable/dist/handsontable.full.min.css">
614 <link rel="stylesheet" media="screen" href="{{ PF_URL_PLACEHOLDER }}/webapp/resources/handsontable/bootstrap/handsontable.bootstrap.min.css">
615 </div>
616 <div class="modal" id="modalPickCompound-{{ TAB_INDEX_PLACEHOLDER }}" tabindex="-1" role="dialog" aria-labelledby="modalPickCompoundLabel-{{ TAB_INDEX_PLACEHOLDER }}" aria-hidden="true">
617 <div class="modal-dialog">
618 <div class="modal-content">
619 <div class="modal-header">
620 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
621 <h4 class="modal-title" id="modalPickCompoundLabel-{{ TAB_INDEX_PLACEHOLDER }}">Pick a compound</h4>
622 </div>
623 <div class="modal-body">
624 <div class="form-group input-group">
625 <span class="input-group-addon">Compound Name</span>
626 <input id="add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}" class="form-control" placeholder="e.g. Caffeine" type="text">
627 <span class="input-group-btn">
628 <button class="btn btn-default" type="button" onclick="ctx().searchLocalCompound();">
629 <i class="fa fa-search"></i>
630 </button>
631 </span>
632 </div>
633 <div id="load-step-1-{{ TAB_INDEX_PLACEHOLDER }}" style="display: none;">
634 <img src="{{ PF_URL_PLACEHOLDER }}/webapp/resources/img/ajax-loader.gif" title="please wait">
635 </div>
636 <div id="ok-step-1-{{ TAB_INDEX_PLACEHOLDER }}" style="overflow: auto; max-height: 300px;"></div>
637 </div>
638 <div class="modal-footer">
639 <button type="button" class="btn btn-danger" data-dismiss="modal" onclick="ctx().clearLine()">
640 <i class="fa fa-eraser"></i> Clear
641 </button>
642 <button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>
643 </div>
644 </div>
645 </div>
646 </div>
647 <div class="modal " id="modalShowSpectra-{{ TAB_INDEX_PLACEHOLDER }}" tabindex="-1" role="dialog" aria-labelledby="modalShowSpectraLabel-{{ TAB_INDEX_PLACEHOLDER }}" aria-hidden="true">
648 <div class="modal-dialog">
649 <div class="modal-content">
650 <div class="modal-header">
651 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
652 <h4 class="modal-title" id="modalShowSpectraLabel-{{ TAB_INDEX_PLACEHOLDER }}">Modal title</h4>
653 </div>
654 <div class="modal-body">
655 <div class="te"></div>
656 </div>
657 <div class="modal-footer">
658 </div>
659 </div>
660 </div>
661 </div>