# HG changeset patch
# User lain
# Date 1693405278 0
# Node ID 7e3085fc60c110e1b3fd6879953c5472b4441896
# Parent  b58b229c4cbffbe5e2bccc1557f78e52b89cc378
 master branch Updating
diff -r b58b229c4cbf -r 7e3085fc60c1 README.md
--- a/README.md	Fri Mar 03 14:10:24 2023 +0000
+++ b/README.md	Wed Aug 30 14:21:18 2023 +0000
@@ -5,7 +5,7 @@
 --------
 
  * **@name**: MS2PF
- * **@version**: 1.1.0
+ * **@version**: 1.2.1
  * **@authors**: Lain Pavot (PFEM - INRAE - MetaboHUB)
  * **@maintainers**: Lain Pavot (PFEM - INRAE - MetaboHUB)
  * **@init date**: 2022, November
diff -r b58b229c4cbf -r 7e3085fc60c1 add-one-spectrum-index.js
--- a/add-one-spectrum-index.js	Fri Mar 03 14:10:24 2023 +0000
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,2584 +0,0 @@
-
-var token = "{{ PF_TOKEN_PLACEHOLDER }}" ;
-if ({{ TAB_INDEX_PLACEHOLDER }} == 1) {
-}
-
-context_{{ TAB_INDEX_PLACEHOLDER }} = {
-  prefix: "#accordion-{{ TAB_INDEX_PLACEHOLDER }} ",
-  name: "Context[{{ TAB_INDEX_PLACEHOLDER }}]",
-  produce_json: {{ PRODUCE_JSON_PLACEHOLDER }},
-  DEFAULT_MS_PEAK_VALUES: {{ MS_PEAK_VALUES_PLACEHOLDER }},
-  DEFAULT_DATA: {{ DEFAULT_DATA }},
-  modeEditSpectrum: false,
-  isSeparationFlowRateInit: false,
-  isMSpeaksInit: false,
-  isLC: false,
-  isGC: false,
-  isIC: false,
-  hot_LC_SFG: null ,
-  hot_MS_Peaks: null,
-  hot_RCC_ADDED: null,
-  jsonSpectrumType: null,
-  isJsonSpectrumTypeComplete: false,
-  jsonSample: null,
-  isJsonSampleComplete: false,
-  isJsonRCCaddedComplete: false,
-  jsonChromato: null,
-  isJsonChromatoComplete: false,
-  jsonAnalyzer: null,
-  isJsonAnalyzerComplete: false,
-  jsonPeaksList: [],
-  isJsonPeaksListComplete: false,
-  jsonOtherMetadata: null,
-  isJsonOtherMetadataComplete: false,
-  jsonMolIonization: null,
-  jsonMolIonBeam: null,
-  cptPeakListTab: 0,
-  jsonAnalyzerAcquisition: [],
-  idMetadataMap: {},
-  listOfViewableSpectra: [],
-  singlePick: true,
-  multiPickLine: -1,
-  subjects: [],
-  fitlerSearchLoadlCpd: 5,
-  inchikey: null,
-  initialized: false,
-  selected_ion_index: null,
-  lock: {
-    precursor_ion: false
-  },
-
-  sent_json: null,
-
-  init: function() {
-
-    var self = this ;
-
-    $(document).ready(() => self.on_ready());
-    $(document).ready(function() {
-      console.log("adding click on open_tab_{{ TAB_INDEX_PLACEHOLDER }}.") ;
-      var activate_tab = function() {
-        if (self.initialized) {
-          return ;
-        }
-        self.auto_set_spec_type() ;
-      }
-      if (self.is_ref()) {
-        $("#open_tab_{{ TAB_INDEX_PLACEHOLDER }}").click(activate_tab) ;
-      }
-      if ({{ TAB_INDEX_PLACEHOLDER }} == 1) {
-        activate_tab() ;
-      }
-    }) ;
-
-    return (self) ;
-
-  },
-
-  on_ready: function() {
-    var self = this ;
-
-    $(self.prefix+".pickChemicalCompound").click(self.pickChemicalCompound);
-    $(self.prefix+".add1spectrum").change(
-      function(){self.add1spectrum_change_handler(this)}
-    )
-    self.attach_search() ;
-    self.add_date_check() ;
-    self.populate_selects() ;
-    self.add_change_handlers() ;
-  },
-
-  populate_selects: function() {
-    var self = this ;
-    var choose_in_list ;
-
-    choose_in_list = `
-      
-        choose in list…
-       
-    ` ;
-    $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
-    $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
-    $("#add1spectrum-chromatoLC-separationSolvA-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
-    $("#add1spectrum-chromatoLC-separationSolvB-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
-    $("#add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
-    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-methods.json", self.populate_lc_methods) ;
-    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-columns.json", self.populate_lc_columns) ;
-    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-solvents.json", self.populate_lc_solvents) ;
-    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-ms-ionization-methods.json", self.populate_ms_ionization) ;
-    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lcms-solvents.json", self.populate_lcms_solvents) ;
-    self.resetFromColors();
-  },
-
-  attach_search: function() {
-    var self = this ;
-
-    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").bind("keypress", function(e) {
-      var code = e.keyCode || e.which;
-      if (code == 13) {
-        self.searchLocalCompound();
-      }
-    });
-    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").typeahead({
-      source: function(query, process) {
-        return self.searchAjax();
-      }
-    });
-  },
-
-  add_date_check: function() {
-    var self = this ;
-
-    $("#add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}").focusout(function() {
-      var element = $(this) ;
-      self.rm_warning(element);
-      self.rm_success(element) ;
-      if (element.val() == "") {
-        element.parent().addClass("has-warning");
-      } else {
-        element.parent().addClass("has-success");
-      }
-    });
-  },
-
-  populate_lc_methods: function(data) {
-    // load data from json
-    $.each(data.methods,function() {
-      if (this.name !== undefined) {
-        if (this.value !== undefined) {
-          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            `${this.name} `
-          );
-        } else {
-          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            `${this.name} `
-          );
-        }
-      }
-    });
-  },
-
-  populate_lc_columns: function(data) {
-    // load data from json
-    $.each(data.columns, function() {
-      $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").append(
-        `${this.name} `
-      );
-    });
-    $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").append(
-      'Other '
-    );
-  },
-
-  populate_lc_solvents: function(data) {
-    // load data from json
-    $.each(data.solvents, function() {
-      $("#add1spectrum-chromatoLC-separationSolvA-{{ TAB_INDEX_PLACEHOLDER }}").append(
-        `${this.name} `
-      );
-      $("#add1spectrum-chromatoLC-separationSolvB-{{ TAB_INDEX_PLACEHOLDER }}").append(
-        `${this.name} `
-      );
-    });
-  },
-
-  populate_ms_ionization: function(data) {
-    // load data from json
-    $.each(data.methods,function() {
-      if (this.name !==undefined) {
-        if (this.value !==undefined) {
-          $("#add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            `${this.name} `
-          );
-          $("#add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            `${this.name} `
-          );
-        } else {
-          $("#add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            `${this.name} `
-          );
-          $("#add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            `${this.name} `
-          );
-        }
-      }
-    });
-  },
-
-  populate_lcms_solvents: function(data) {
-    // load data from json
-    $.each(data.solvents, function () {
-      $("#add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}").append(
-        `${this.name} `
-      );
-    });
-  },
-
-  add_change_handlers: function() {
-    var self = this ;
-
-    $("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").on("change", function() {
-      var v = $("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      $(self.prefix + ".add1spectrum-ionTrap").hide();
-      if (v == "beam") {
-      } else if (v == "trap") {
-        $(self.prefix + ".add1spectrum-ionTrap").show();
-      }
-    }) ;
-    $("#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}").on("change", function() {
-      var v = $("#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      $(self.prefix + ".disabled-if-ms-in-msms").attr(
-        "disabled",
-        (v == "ms2" || v == "ms3")
-      ) ;
-      $(self.prefix + ".enabled-if-ms-in-msms").attr(
-        "disabled",
-        !(v == "ms2" || v == "ms3")
-      ) ;
-      $(self.prefix + ".hidden-if-ms-in-msms").css(
-        "display",
-        !(v == "ms2" || v == "ms3") ? "none" : ""
-      ) ;
-    }) ;
-  },
-
-  is_mix: function() {
-    return this.DEFAULT_DATA["sample_type"] == "compound-mix" ;
-  },
-
-  is_ref: function() {
-    return this.DEFAULT_DATA["sample_type"] == "compound-ref" ;
-  },
-
-  is_ms: function() {
-    return this.DEFAULT_DATA["spectrum_type"] == "LC_MS" ;
-  },
-
-  is_ms2: function() {
-    return this.DEFAULT_DATA["spectrum_type"] == "LC_MSMS" ;
-  },
-
-  is_other_in_mix() {
-    return this.is_mix() && {{ TAB_INDEX_PLACEHOLDER }} > 1 ;
-  },
-
-  hide: function(id) {
-    if (typeof id == Array) {
-      return (id.forEach(hide)) ;
-    }
-    $(id).hide()
-  },
-
-  rm_success: function(element) {
-    return (this.rm_parent_class(element, "has-success"))
-  },
-  rm_error: function(element) {
-    return (this.rm_parent_class(element, "has-error"))
-  },
-  rm_warning: function(element) {
-    return (this.rm_parent_class(element, "has-warning"))
-  },
-  set_success: function(element) {
-    return (this.set_parent_class(element, "has-success"))
-  },
-  set_error: function(element) {
-    return (this.set_parent_class(element, "has-error"))
-  },
-  set_warning: function(element) {
-    return (this.set_parent_class(element, "has-warning"))
-  },
-  rm_parent_class: function(element, cls) {
-    var parent ;
-
-    if ((parent = element.parent()) == null) {
-      return false ;
-    }
-    return this.rm_class(parent, cls) ;
-  },
-  set_parent_class: function(element, cls) {
-    var parent ;
-
-    if ((parent = element.parent()) == null) {
-      return false ;
-    }
-    return this.set_class(parent, cls) ;
-  },
-  rm_class: function(element, cls) {
-    if (element.hasClass(cls)) {
-      element.removeClass(cls) ;
-      return true ;
-    }
-    return false ;
-  },
-  set_class: function(element, cls) {
-    if (element.hasClass(cls)) {
-      return false ;
-    }
-    element.addClass(cls) ;
-    return true ;
-  },
-  is_success: function(element) {
-    return (this.parent_has_class(element, "has-success"))
-  },
-  is_warning: function(element) {
-    return (this.parent_has_class(element, "has-warning"))
-  },
-  is_error: function(element) {
-    return (this.parent_has_class(element, "has-error"))
-  },
-  is_optional: function(element) {
-    return (element.hasClass("is-optional"))
-  },
-  is_mandatory: function(element) {
-    return (element.hasClass("is-mandatory"))
-  },
-  parent_has_class: function(element, cls) {
-    var parent ;
-
-    if ((parent = element.parent()) == null) {
-      return false ;
-    }
-    return (parent.hasClass(cls)) ;
-  },
-
-  add1spectrum_change_handler: function(element) {
-    var self = this ;
-    var idElem ;
-    var valElem ;
-    var isSuccess ;
-    var isWarning ;
-    var isError ;
-    var isOptional ;
-    var isMandatory ;
-
-    element = $(element) ;
-    idElem = element.attr("id") ;
-    valElem = element.val();
-    console.log(`Change handler called for [${idElem}]=${valElem}`) ;
-    if (idElem.split("-").slice(0, -1).join("-") == "add1spectrum-peaksMS-msPrecursorIon") {
-      var index = idElem.split("-")[3] - 1 ;
-      all_contexts[index].sync_precursor_ion() ;
-      if (all_contexts[index].hot_MS_Peaks != null) {
-        all_contexts[index].hot_MS_Peaks.render()
-      }
-    }
-    isSuccess = self.is_success(element);
-    isWarning = self.is_warning(element);
-    isError = self.is_error(element);
-    isOptional = self.is_optional(element);
-    isMandatory = self.is_mandatory(element);
-
-    switch(idElem) {
-    case "add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}":
-      if (valElem == "compound-ref") {
-        $("#add1spectrum-sample-type-compound-ref-{{ TAB_INDEX_PLACEHOLDER }}").show();
-        $("#add1spectrum-sample-type-compound-mix-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-sample-type-rcc-added-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-      } else if (valElem == "compound-mix") {
-        $("#add1spectrum-sample-type-compound-mix-{{ TAB_INDEX_PLACEHOLDER }}").show();
-        $("#add1spectrum-sample-type-compound-ref-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-sample-type-rcc-added-{{ TAB_INDEX_PLACEHOLDER }}").show();
-        self.handsontableRefChemCpdAdded(null);
-      }
-      break;
-    case "add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}":
-      self.resetElemColor("add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}");
-      if (valElem == "" || valElem == null || valElem != "other" ) {
-        self.disableElem("add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}");
-      } else {
-        self.enableElem("add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}");
-      }
-      break;
-    case "add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}":
-      self.fulfillLCdata(valElem);
-      break;
-    case "add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}":
-      if ($("#add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}").val() != null) {
-        $($("#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }} option")[1]).attr("disabled", false);
-      }
-      break;
-    case "add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}":
-      if ($("#add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}").val() != null) {
-        $($("#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }} option")[2]).attr("disabled", false);
-      }
-      break;
-    }
-    if ((isMandatory || isOptional) && (valElem == "" || valElem == null)) {
-      if (isSuccess) {
-        self.rm_success(element) ;
-      } else if (isWarning) {
-        self.rm_warning(element) ;
-      } else if (isError) {
-        self.rm_error(element) ;
-      }
-      if (isMandatory) {
-        self.set_error(element) ;
-      } else {
-        self.set_warning(element) ;
-      }
-    }
-    if (isMandatory && (valElem != "" && valElem != null)) {
-      if (isError) {
-        self.rm_error(element) ;
-      }
-      self.set_success(element) ;
-    } else if (isOptional && valElem != "") {
-      if (isWarning) {
-        self.rm_warning(element) ;
-      }
-      self.set_success(element) ;
-    }
-    if (element.parent().children("input").size() == 2) {
-      if (isMandatory) {
-        if (isSuccess) {
-          self.rm_success(element) ;
-        } else if (isWarning) {
-          self.rm_warning(element) ;
-        } else if (isError) {
-          self.rm_error(element) ;
-        }
-        if (element.parent().children("input").toArray().some(
-          (el) => $(el).val() === null || $(el).val() === ""
-        )) {
-          self.set_error(element) ;
-        } else {
-          eslf.set_success(element) ;
-        }
-      } else if (isOptional) {
-        isSuccess = self.is_success(element);
-        isWarning = self.is_warning(element);
-        isError = self.is_error(element);
-        if (isSuccess) {
-          self.rm_success(element)
-        } else if (isWarning) {
-          self.rm_warning(element) ;
-        } else if (isError) {
-          self.rm_error(element) ;
-        }
-        if (element.parent().children("input").toArray().some(
-          (el) => ($(el).val() == null || $(el).val() == "")
-        )) {
-          self.set_warning(element) ;
-        } else {
-          self.set_success(element) ;
-        }
-      }
-    }
-    if (element.hasClass("one-or-more")) {
-      // get parent class
-      isSuccess = self.is_success(element);
-      isWarning = self.is_warning(element);
-      isError = self.is_error(element);
-      // reset class
-      if (isSuccess) {
-        self.rm_success(element) ;
-      } else if (isWarning) {
-        self.rm_warning(element) ;
-      } else if (isError) {
-        self.rm_error(element) ;
-      }
-      isTmpSuccess = false;
-      $.each(element.parent().children("input"), function(id, child){
-        if ($(child).val() != null && $(child).val() != "") {
-          isTmpSuccess = true;
-        }
-      });
-      $.each(element.parent().children("select"), function(id, child){
-        if ($(child).val() != null && $(child).val() != "") {
-          isTmpSuccess = true;
-        }
-      });
-      // end parkour
-      element.parent().addClass(
-        isTmpSuccess ? "has-success" : "has-error"
-      );
-    }
-    // CHECK IF OK STEP 2
-    if (element.hasClass("add1spectrum-sampleForm")) {
-      var isBtnStep2OK = true;
-      $.each($(self.prefix + ".add1spectrum-sampleForm"), (id, elem) => {
-        if (self.is_error($(elem)) && $(elem).is(":visible")) {
-          isBtnStep2OK = false;
-        }
-      });
-      if (isBtnStep2OK) {
-        self.rm_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.set_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-      } else {
-        self.set_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.rm_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-      }
-    }
-    // CHECK IF OK STEP 3 - LC
-    if (
-      element.hasClass("add1spectrum-chromatoLCForm")
-      && $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
-    ) {
-      var isBtnStep3OK = true;
-      $.each($(self.prefix+".add1spectrum-chromatoLCForm"), (id, elem) => {
-        if (self.is_error($(elem)) && $(elem).is(":visible"))
-          isBtnStep3OK = false;
-      });
-      if (isBtnStep3OK) {
-        self.rm_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.set_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-      } else {
-        self.set_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.rm_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-      }
-    }
-    // TODO CHECK IF OK STEP 3 - GC
-    // CHECK IF OK STEP 4 - MS ANALYZER
-    if (
-      element.hasClass("add1spectrum-analyzerMSForm")
-      && $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
-    ) {
-      var isBtnStep4OK = true;
-      $.each($(self.prefix+".add1spectrum-analyzerMSForm"), (id, elem) => {
-        if (self.is_error($(elem)) && $(elem).is(":visible"))
-          isBtnStep4OK = false;
-      });
-      if (isBtnStep4OK) {
-        self.rm_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.set_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-      } else {
-        self.set_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.rm_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-      }
-    }
-    // CHECK IF OK STEP 5 - PEAKS
-    if (
-      element.hasClass("add1spectrum-peaksMSForm-peaklist")
-      && $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
-    ) {
-      var isBtnStep5OK = true;
-      $.each($(self.prefix+".add1spectrum-peaksMSForm-peaklist"), (id, elem) => {
-        if (self.is_error($(elem)) && $(elem).is(":visible"))
-          isBtnStep5OK = false;
-      });
-      if (isBtnStep5OK && (self.is_ms() || self.a_ion_parent_is_selected())) {
-        self.rm_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.set_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-      } else {
-        self.set_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-        self.rm_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-        $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-      }
-    }
-    // CHECK IF OK STEP 6 - OTHER DATA
-    if (
-      element.hasClass("add1spectrum-otherForm")
-      && $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
-    ) {
-      self.checkIfEnableSubmit() ;
-    }
-  },
-
-  a_ion_parent_is_selected: function() {
-    return (this.get_selected_parent_ion_index() !== null) ;
-  },
-
-  get_selected_parent_ion_index: function() {
-    if (this.hot_MS_Peaks == undefined) {
-      return null ;
-    }
-    var data = this.hot_MS_Peaks.getData() ;
-    for (var i = 0 ; i < data.length ; i += 1) {
-      if (data[i][7] === "true" || data[i][7] === true) {
-        return i ;
-      }
-    }
-    return null ;
-  },
-
-  auto_set_spec_type: function() {
-    console.log("auto_set_spec_type...") ;
-    var self = this ;
-    var id = `#set_${self.DEFAULT_DATA["spectrum_type"]}_spectrum_button` ;
-    var element = $(self.prefix + id) ;
-    if (element.length) {
-      element.click() ;
-      console.log(`auto_set_spec_type to ${self.DEFAULT_DATA["spectrum_type"]} ok.`)
-    } else {
-      console.log(element)
-      console.log("Failed!")
-    }
-    if (self.DEFAULT_DATA["sample_type"]) {
-      self.auto_set_sample_type(self) ;
-    }
-  },
-
-  auto_set_sample_type: function() {
-    console.log("auto_set_sample_type...") ;
-    var self = this ;
-    var id = "#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}" ;
-    var element = $(id) ;
-    if (element.length) {
-      element.val(self.DEFAULT_DATA["sample_type"]).change() ;
-      console.log(`auto_set_sample_type to ${self.DEFAULT_DATA["sample_type"]} ok.`) ;
-      if (self.DEFAULT_DATA["sample_type"] == "compound-ref") {
-        $("#add1spectrum-sample-mixSolvent-{{ TAB_INDEX_PLACEHOLDER }}").val(
-          "H2O/ethanol (75/25)"
-        ).change() ;
-      }
-    } else {
-      console.log(element)
-      console.log("Failed!")
-    }
-    if (self.DEFAULT_DATA["inchikey"]) {
-      setTimeout(() => self.auto_set_inchikey(self), 1000) ;
-    }
-  },
-
-  auto_set_inchikey: function() {
-    console.log("auto_set_inchikey...") ;
-    var self = this ;
-    var id ;
-    var element ;
-    if (self.is_ref()) {
-      id = "#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}:text" ;
-      element = $(id) ;
-      if (element.length) {
-        console.log(`auto_set_inchikey to ${self.DEFAULT_DATA["inchikey"]} ok.`)
-        element.val(self.DEFAULT_DATA["inchikey"]).change() ;
-        console.log(`Inchikey set!`) ;
-      } else {
-        console.log(element)
-        console.log("Failed!")
-      }
-    } else {
-      for (var index = 0 ; index < all_contexts.length ; index += 1) {
-        var inchikey = all_contexts[index].DEFAULT_DATA["inchikey"] ;
-        id = `#container_RCC_ADDED-1 tbody:nth(0) tr:nth(${index}) td:nth(1)` ;
-        element = $(id) ;
-        if (element.length) {
-          console.log(`auto_set_inchikey to ${inchikey} ok.`)
-          self.hot_RCC_ADDED.setDataAtCell(index, 1, inchikey) ;
-          element.innerHTML = inchikey ;
-          element.change() ;
-          console.log(element) ;
-          console.log(`Inchikey set!`) ;
-        } else {
-          console.log(element)
-          console.log("Failed!")
-        }
-      }
-      console.log(self.hot_RCC_ADDED)
-      self.hot_RCC_ADDED.render() ;
-    }
-    $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").click() ;
-    if (self.DEFAULT_DATA["method"]) {
-      setTimeout(() => self.auto_set_method(self), 1000) ;
-    }
-  },
-
-  auto_set_method: function() {
-    console.log("auto_set_method...") ;
-    var self = this ;
-    var id = "#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}" ;
-    var element = $(id) ;
-    element.length && element.val(self.DEFAULT_DATA["method"]).change() ;
-    $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").click() ;
-    setTimeout(() => {
-      (() => {
-        $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").click() ;
-        console.log(`auto_set_method to ${self.DEFAULT_DATA["method"]} ok.`)
-        if (self.DEFAULT_DATA["scan_type"]) {
-          setTimeout(() => self.auto_set_scan_type(self), 1000) ;
-        }
-      })(self)
-    }, 1000) ;
-  },
-
-  auto_set_scan_type: function() {
-    console.log("auto_set_scan_type...") ;
-    var self = this ;
-    var id = "#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}" ;
-    var element = $(id) ;
-    if (element.length) {
-      element.val(self.DEFAULT_DATA["scan_type"]).change() ;
-      console.log(`auto_set_scan_type to ${self.DEFAULT_DATA["scan_type"]} ok.`)
-    } else {
-      console.log("Failed!")
-    }
-    if (self.DEFAULT_DATA["polarity"]) {
-      self.auto_set_polarity(self) ;
-    }
-  },
-
-  auto_set_polarity: function() {
-    console.log("auto_set_polarity...") ;
-    var self = this ;
-    var id = "#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }}" ;
-    var element = $(id) ;
-    if (element.length) {
-      element.val(self.DEFAULT_DATA["polarity"]).change() ;
-      console.log(`auto_set_polarity to ${self.DEFAULT_DATA["polarity"]} ok.`)
-    } else {
-      console.log("Failed!")
-    }
-    if (self.DEFAULT_DATA["resolution"]) {
-      self.auto_set_resolution(self) ;
-    }
-  },
-
-  auto_set_resolution: function() {
-    console.log("auto_set_resolution...") ;
-    var self = this ;
-    var id = "#add1spectrum-peaksMS-resolution-{{ TAB_INDEX_PLACEHOLDER }}" ;
-    var element = $(id) ;
-    if (element.length) {
-      element.val(self.DEFAULT_DATA["resolution"]).change() ;
-      console.log(`auto_set_resolution to ${self.DEFAULT_DATA["resolution"]} ok.`)
-    } else {
-      console.log("Failed!")
-    }
-    if (self.DEFAULT_DATA["next"] || true) {
-      setTimeout(() => self.finish_initialized(self), 1000) ;
-    }
-  },
-
-  finish_initialized: function() {
-    var self = this ;
-    if (ctx() === self) {
-      self.initialized = true ;
-    }
-  },
-
-  //USED IN HTML
-  updateLCMSspectraViewer: function() {
-    var self = this ;
-    var tab_no ;
-    console.log(`Updating spectral view for tab {{ TAB_INDEX_PLACEHOLDER }}`) ;
-    // reset current viewer
-    $("#containter-lcms-spectrum-preview-{{ TAB_INDEX_PLACEHOLDER }}").empty();
-    // reset data.
-
-    if (self.is_mix()) {
-      tab_no = 1 ;
-    } else {
-      tab_no = {{ TAB_INDEX_PLACEHOLDER }} ;
-    }
-    var range_from = $(`#add1spectrum-peaksMS-rangeFrom-${tab_no}`) ;
-    if ((spectrumMinPPM = Number(range_from.val())) == "") {
-      spectrumMinPPM = 10000;
-    }
-    var range_to = $(`#add1spectrum-peaksMS-rangeTo-${tab_no}`) ;
-    if ((spectrumMaxPPM = Number(range_to.val())) == "") {
-      spectrumMaxPPM = 0;
-    }
-    maxGraph = 0;
-    var localData = [];
-    var localDataAnnot = [];
-    // gather new data
-    // TODO switch tab in function of technic
-    $.each(self.hot_MS_Peaks.getData(), function() {
-      if(this[0] != undefined && this[0] != "") {
-        var x = (Number(this[0]));
-        var y = Number(this[2]);
-        var a = this[6];
-        localData.push([(x-0.000001),-150]);
-        localData.push([(x+0.000001),-150]);
-        localData.push([x,y]);
-        localDataAnnot[x] = a;
-        if (x < spectrumMinPPM) {
-          spectrumMinPPM = x;
-        }
-        if (x > spectrumMaxPPM) {
-          spectrumMaxPPM = x;
-        }
-        if (y > maxGraph) {
-          maxGraph = y;
-        }
-      }
-    });
-    
-    // build new one
-    spectrumMinPPM = spectrumMinPPM - (0.1 * spectrumMinPPM);
-    spectrumMaxPPM = spectrumMaxPPM + (0.1 * spectrumMaxPPM);
-    maxGraph = maxGraph + (0.1 * maxGraph);
-    localData.sort();
-    console.log(localData)
-    // build graph
-    $("#containter-lcms-spectrum-preview-{{ TAB_INDEX_PLACEHOLDER }}").highcharts({
-      chart: {
-        zoomType: "x",
-        spacingRight: 10,
-        spacingLeft: 10,
-        type: "scatter"
-      },
-      title: {
-        text: "Spectrum Preview",
-        useHTML: true
-      },
-      subtitle: {
-        text: (
-          document.ontouchstart === undefined
-          ? "Select area"
-          : "Pinch the chart to zoom in"
-        )
-      },
-      xAxis: {
-        type: "number",
-        title: {text: "m/z"},
-        min: spectrumMinPPM,
-        max: spectrumMaxPPM,
-        labels: {
-          formatter: function() {
-            return (Math.abs(this.value) + "");
-          }
-        }
-      },
-      yAxis: {
-        title: {text: "Relative Intensity (%)"},
-        min: 0,
-        max: maxGraph
-      },
-      tooltip: {
-        crosshairs: true,
-        formatter: function() {
-          var compo = "";
-          return (
-            "" + this.series.name
-            + " 
-            
-              × 
-               
-            
-                unable to load pre-filled data!
-          
-        `);
-      }
-    });
-  },
-
-  //USED HERE
-  resetFromColors: function() {
-
-    var self = this ;
-    $.each($(self.prefix+".add1spectrum"), function(id, elem) {
-      element = $(elem)
-      self.rm_success(element) ;
-      self.rm_warning(element) ;
-      self.rm_error(element) ;
-      if ($(elem).hasClass("is-mandatory") &&  ($(elem).val() == "" || $(elem).val() == null)) {
-        self.set_error($(elem)) ;
-      }
-      if ($(elem).hasClass("is-optional") &&  ($(elem).val() == "" || $(elem).val() == null)) {
-        self.set_warning($(elem)) ;
-      }
-      if ($(elem).val() != "" && $(elem).val() != null) {
-        self.set_success($(elem)) ;
-      }
-    });
-    $.each($(self.prefix+"button.switchStep"), function(id, elem) {
-      if (!$(this).hasClass("btn-disabled")) {
-        $(this).addClass("btn-disabled");
-      }
-      if ($(this).hasClass("btn-primary")) {
-        $(this).removeClass("btn-primary");
-      }
-      $(this).prop("disabled", true);
-    });
-
-    // peak list: no data to check
-    $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("btn-disabled");
-    $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").addClass("btn-primary");
-    $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-
-    $("#add1spectrum-other-author-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-    $("#add1spectrum-other-validator-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-    $("#add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-    $("#add1spectrum-other-owner-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-    $("#add1spectrum-other-fileName-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-    $("#add1spectrum-other-fileSize-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-  },
-
-  //USED IN HTML
-  switchToStep: function(step) {
-
-    var self = this ;
-    switch(step) {
-      case 2:
-        // hide after step 2 / alt step 2
-        $("#add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        if ($("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
-          $("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-        }
-        if (self.is_ms()) {
-          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").empty();
-          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            'choose in list… '
-          );
-          $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-methods.json", function(data) {
-            // load data from json
-            $.each(data.methods,function() {
-              if (this.name !== undefined) {
-                if (this.value !== undefined) {
-                  $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-                    `${this.name} `
-                  );
-                } else {
-                  $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-                    `${this.name} `
-                  );
-                }
-              }
-            });
-          });
-        } else if (self.is_ms2()) {
-          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").empty();
-          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-            'choose in list… '
-          );
-          $.getJSON(
-            "{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-msms-methods.json",
-            function(data) {
-              // load data from json
-              $.each(data.methods, function() {
-                if (this.name !== undefined) {
-                  if (this.value !== undefined) {
-                    $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-                      `${this.name} `
-                    );
-                  } else {
-                    $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
-                      `${this.name} `
-                    );
-                  }
-                }
-              });
-            }
-          );
-        }
-        // check panel to show
-        if (self.isLC) {
-          $("#add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}").show();
-          $("#linkActivateStep2-lc-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
-          var sign = $("#step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}") ;
-          self.rm_class(sign, "fa-check-circle") && self.set_class(sign, "fa-question-circle") ;
-          if (!self.isSeparationFlowRateInit) {
-            self.handsontableSeparationFlowRate(null);
-            self.isSeparationFlowRateInit = true;
-          }
-        } else if (self.isGC) {
-          $("#add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}").show();
-          $("#linkActivateStep2-gc-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
-          var sign = $("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}") ;
-          sign.removeClass("fa-check-circle").addClass("fa-question-circle");
-          if ($("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
-          }
-        } else if (self.isIC) {
-          $("#add1spectrum-chromatographyData-IC-{{ TAB_INDEX_PLACEHOLDER }}").show();
-          $("#linkActivateStep2-ic-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
-          if ($("#step2-ic-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
-            $("#step2-ic-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
-          }
-        }
-        break;
-      case 3:
-        // hide after step 3 / alt step 3
-        $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        // step 2 ok 
-        if ($("#step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
-          $("#step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-        }
-        if ($("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
-          $("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-        }
-        // check panel to show
-        if (self.is_ms() || self.is_ms2()) {
-          $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").show();
-          $("#linkActivateStep3-ms-{{ TAB_INDEX_PLACEHOLDER }}").trigger('click');
-          // debug display
-          [
-            "add1spectrum-analyzserMS-sprayGazFlow-pos",
-            "add1spectrum-analyzserMS-sprayGazFlow-neg",
-            "add1spectrum-analyzserMS-vaporizerGazFlow-pos",
-            "add1spectrum-analyzserMS-vaporizerGazFlow-neg",
-            "add1spectrum-analyzserMS-vaporizerTemperature-pos",
-            "add1spectrum-analyzserMS-vaporizerTemperature-neg",
-            "add1spectrum-analyzserMS-sourceGazFlow-pos",
-            "add1spectrum-analyzserMS-sourceGazFlow-neg",
-            "add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-pos",
-            "add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-neg",
-            "add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-pos",
-            "add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-neg"
-          ].forEach((id) => {
-            var element = $(`#id-{{ TAB_INDEX_PLACEHOLDER }}`)
-            element.height(element.parent().children("span").height())
-          })
-          if ($("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
-            $("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
-          }
-          // MSMS only
-          $(self.prefix+".enable-if-ms").attr("disabled", !self.is_ms());
-          $(self.prefix+".enable-if-msms").attr("disabled", !self.is_ms2());
-        }
-        // avoid display bug
-        $("#add1spectrum-analyzer-ms-instrument-{{ TAB_INDEX_PLACEHOLDER }}").change();
-        break;
-      case 4:
-        // hide after step 4 / alt step 4
-        $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        // step 3 ok 
-        if ($("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
-          $("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-        }
-        if (self.is_ms() || self.is_ms2()) {
-          $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").show();
-          $("#linkActivateStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
-          if ($("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
-            $("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
-          }
-          // LC MS
-          if (!self.isMSpeaksInit) {
-            console.log(`self.is_mix(): ${self.is_mix()}`)
-            if (self.is_mix()) {
-              all_contexts.forEach((context, index) => {
-                context.handsontableMSpeaks(null) ;
-                context.updateLCMSspectraViewer() ;
-                context.isMSpeaksInit = true;
-                $(context.prefix+".add1spectrum-peaksMSForm-peaklist-reset").val("").change();
-              })
-            } else {
-              self.handsontableMSpeaks(null);
-              self.isMSpeaksInit = true;
-              $(self.prefix+".add1spectrum-peaksMSForm-peaklist-reset").val("").change();
-            }
-          }
-        }
-        // show ms tab
-        setTimeout(() => $("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click"), 250);
-        $("#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}").change();
-        break;
-      case 5:
-        // hide after step 5 / alt step 5
-        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        // step 4 ok 
-        if ($("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
-          $("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-        }
-        if ($("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
-          $("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
-        }
-        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").show();
-        $("#linkActivateStep5-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
-        // reset step 6 button
-        self.checkIfEnableSubmit();
-        $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        $("#import1SpectrumResults-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-        break;
-      case 6:
-        self.postOneSpectrumFrom();
-        self.cptPeakListTab++;
-        break;
-      case 7:
-      self.dumpOneSpectrumFrom();
-      break;
-    }
-  },
-
-  //USED HERE
-  resetElemColor: function(idElem) {
-
-    var self = this ;
-    if ($(`#${idElem}`).parent().hasClass("has-success")) {
-      $(`#${idElem}`).parent().removeClass("has-success") ;
-    }
-    if ($(`#${idElem}`).parent().hasClass("has-warning")) {
-      $(`#${idElem}`).parent().removeClass("has-warning") ;
-    }
-    if ($(`#${idElem}`).parent().hasClass("has-error")) {
-      $(`#${idElem}`).parent().removeClass("has-error") ;
-    }
-  },
-
-  //USED HERE
-  disableElem: function(idElem) {
-
-    var self = this ;
-    $(`#${idElem}`).prop("disabled", true) ;
-    $(`#${idElem}`).val("") ;
-    if ($(`#${idElem}`).hasClass("is-mandatory")) {
-      $(`#${idElem}`).removeClass("is-mandatory") ;
-    }
-  },
-
-  //USED HERE
-  enableElem: function(idElem) {
-
-    var self = this ;
-    $(`#${idElem}`).prop("disabled", false) ;
-    $(`#${idElem}`).parent().addClass("has-error") ;
-    if (!$(`#${idElem}`).hasClass("is-mandatory")) {
-      $(`#${idElem}`).addClass("is-mandatory") ;
-    }
-  },
-
-  //USED HERE
-  checkIfEnableSubmit: function() {
-
-    var self = this ;
-    var isBtnStep6OK = true;
-    $.each($(self.prefix+".add1spectrum-otherForm"), (id, elem) => {
-      if (self.is_error($(elem)) && $(elem).is(":visible")) {
-        isBtnStep6OK = false;
-      }
-    });
-    if (isBtnStep6OK) {
-      self.rm_class($("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-      self.set_class($("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-      $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-      self.rm_class($("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
-      self.set_class($("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
-      $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
-    } else {
-      if (!$("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-disabled")) {
-        $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").addClass("btn-disabled");
-      }
-      if ($("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-primary")) {
-        $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("btn-primary");
-      }
-      $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-      if (!$("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-disabled")) {
-        $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").addClass("btn-disabled");
-      }
-      if ($("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-primary")) {
-        $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("btn-primary");
-      }
-      $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-    }
-  },
-
-  //USED IN HTML
-  addOneSpectrum: function(type) {
-
-    var self = this ;
-     // unlock
-    $(self.prefix+".add1spectrum-sampleForm").prop("disabled", false);
-    $(self.prefix+".add1spectrum-chromatoLCForm").prop("disabled", false);
-    $(self.prefix+".add1spectrum-analyzerMSForm").prop("disabled", false);
-    $(self.prefix+".add1spectrum-otherForm").prop("disabled", false);
-    $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").change();
-    // reset
-    self.isLC = false;
-    self.isGC = false;
-    self.isIC = false;
-    $("#alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    // hide in all steps
-    $(self.prefix+".opt-ms").hide();
-    $(self.prefix+".opt-msms").hide();
-    // hide step 2
-    $("#add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-    $("#add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-    // hide step 3
-    $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-    $(self.prefix+".add1spectrum-ionTrap").hide();
-    // hide step 4
-    $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-    // hide step 5
-    $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-    // reset field step 1
-    $("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").val("");
-    $(self.prefix+".add1spectrum-sample-type-panel").hide();
-    $(self.prefix+".add1spectrum-sampleForm").val("");
-    $("#sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    // reset field step 2
-    $(self.prefix+".add1spectrum-chromatoLCForm").val("");
-    // reset field step 3
-    $(self.prefix+".add1spectrum-analyzerMSForm").val("");
-    // reset field step 4
-    // reset peak lists / all tabs
-    self.isSeparationFlowRateInit = false;
-    self.isMSpeaksInit = false;
-    $(self.prefix+".handsontable").html("");
-    // reset field step 5 => NO!
-    // set icon
-    $("#step0sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-    if ($("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
-      $("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
-    }
-    // collapse step 0 / uncollaspe step 1
-    $("#linkActivateStep1-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
-    // show step 1 content
-    $("#add1spectrum-sampleData-{{ TAB_INDEX_PLACEHOLDER }}").show();
-    switch(type) {
-    case 1:
-      // TODO GC-MS stuff
-      self.isGC = true;
-      break;
-    case 2:
-      // LC-MS stuff
-      self.isLC = true;
-      $(self.prefix+".opt-ms").show();
-      break;
-    case 5:
-      // LC-MSMS stuff
-      self.isLC = true;
-      $(self.prefix+".opt-ms").show();
-      $(self.prefix+".opt-msms").show();
-      break;
-    case 6:
-      // IC-MS stuff
-      self.isIC = true;
-      $(self.prefix+".opt-ms").show();
-      break;
-    case 7:
-      // IC-MSMS stuff
-      self.isIC = true;
-      $(self.prefix+".opt-ms").show();
-      $(self.prefix+".opt-msms").show();
-      break;
-    }
-    self.resetFromColors();
-    // reset json obj to submit form
-    self.jsonSpectrumType = null;
-    self.isJsonSpectrumTypeComplete = false;
-    self.jsonSample = null;
-    self.isJsonSampleComplete = false;
-    self.isJsonRCCaddedComplete = false;
-    self.jsonChromato = null;
-    self.isJsonChromatoComplete = false;
-    self.jsonAnalyzer = null;
-    self.isJsonAnalyzerComplete = false;
-    self.jsonPeaksList = [];
-    self.isJsonPeaksListComplete = false;
-    self.jsonOtherMetadata = null;
-    self.isJsonOtherMetadataComplete = false;
-    
-    self.cptPeakListTab = 0;
-    self.jsonAnalyzerAcquisition = [];
-    self.idMetadataMap = {}
-    self.listOfViewableSpectra = [];
-    
-    // spec MS
-    self.jsonMolIonization = null;
-    
-    // spec MSMS
-    self.jsonMolIonBeam = null;
-    
-    // try load cpd
-    if (self.inchikey !== null) {
-      self.loadJSCompound(self.inchikey);
-    }
-  },
-
-  //USED HERE
-  loadJSCompound: function(inchikey) {
-    var self = this ;
-    
-    $("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").val("compound-ref");
-    $("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").change();
-    $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val(inchikey);
-    $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").change();
-    if (inchidata[inchikey] !== null) {
-      return (set_inchi_data(inchidata[inchikey]), {{ TAB_INDEX_PLACEHOLDER }}) ;
-    }
-    $.ajax({
-      type: "get",
-      url: "{{ PF_URL_PLACEHOLDER }}/webapp/get-cpd-data",
-      data: "inchikey="+inchikey,
-      dataType: "json",
-      success: function(data) {
-        if (data.success) {
-          set_inchi_data(data) ;
-        }
-      },
-      error : function(data) {
-      }
-    }).always(function() {
-    });
-  },
-
-  //USED HERE
-  handsontableSeparationFlowRate: function(data) {
-    var self = this ;
-
-    // reset
-    $("#container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    // init
-    var data_LC_SFG;
-    if (data==null) {
-      data_LC_SFG = [
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-       [ "", "", "" ],
-     ];
-    } else {
-      data_LC_SFG = data;
-    }
-    
-    var container_LC_SFG = document.getElementById("container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}");
-    self.hot_LC_SFG = new Handsontable(container_LC_SFG, {
-      data : data_LC_SFG,
-      minSpareRows : 1,
-      colHeaders : true,
-      colHeaders: ["time (min)", "solv. A (%)", "solv. B (%)"],
-      contextMenu : false
-    });
-    Handsontable.Dom.addEvent(document.body, "click", function(e) {
-      var element = e.target || e.srcElement;
-      if (element.nodeName == "BUTTON"&& element.name == "dump") {
-        var name = element.getAttribute("data-dump");
-        var instance = element.getAttribute("data-instance");
-        self.hot_LC_SFG = window[instance];
-        console.log("data of " + name, self.hot_LC_SFG.getData());
-      }
-    });
-    $("#container_LC_SFG table.htCore-{{ TAB_INDEX_PLACEHOLDER }}").css("width","100%");
-  },
-
-  //USED HERE
-  handsontableMSpeaks: function(data) {
-    console.log("handsontableMSpeaks")
-    console.log(data)
-    var self = this ;
-    var data_MS_Peaks ;
-    var container_MS_Peaks ;
-
-    if (data != null) {
-      data_MS_Peaks = data;
-    } else {
-      data_MS_Peaks = JSON.parse(JSON.stringify(self.DEFAULT_MS_PEAK_VALUES));
-    }
-    $("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    container_MS_Peaks = document.getElementById(
-      "container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}"
-    );
-    var colHeaders = [
-      "m/z", "absolute intensity", "relative intensity (%)", "delta (ppm)",
-      "composition", "attribution", "Validated"
-    ]
-    var columns = [
-      {type: "numeric", format: "0.0000"},
-      {type: "numeric", format: "0.00"},
-      {type: "numeric", format: "0.00"},
-      {type: "numeric", format: "0.0000"},
-      {type: "text"},
-      {type: "text"},
-      {type: "checkbox"}
-    ] ;
-    if (self.is_ms2()) {
-      colHeaders.push("Parent ion") ;
-      columns.push({type: "checkbox"}) ;
-    }
-    self.hot_MS_Peaks = new Handsontable(container_MS_Peaks, {
-      data: data_MS_Peaks,
-      minSpareRows: 1,
-      colHeaders: true,
-      colHeaders: colHeaders,
-      contextMenu: false,
-      maxRows: data_MS_Peaks.length,
-      minRows: data_MS_Peaks.length,
-      columns: columns,
-      afterChange: function(changes) {
-        if (self.lock.precursor_ion) {
-          return ;
-        }
-        self.lock.precursor_ion = true ;
-        try {
-          changes?.forEach(([row, prop, old, value]) => {
-            var data ;
-            var precursor_ion ;
-
-            var data = self.hot_MS_Peaks.getData() ;
-            if (prop !== 7 || value !== true || data === undefined) {
-              return ;
-            }
-            for (var i = 0; i < data.length ; i += 1) {
-              data[i][7] = false ;
-            }
-            data[row][7] = true ;
-            precursor_ion = $(`#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}`) ;
-            console.log(`setting preco ion to ${data[row][0]}`) ;
-            precursor_ion.val(data[row][0]) ;
-            precursor_ion.change() ;
-            self.hot_MS_Peaks.render() ;
-          })
-        } finally {
-          self.lock.precursor_ion = false ;
-        }
-      }
-    });
-    Handsontable.Dom.addEvent(document.body, "click", (e) => {
-      var element ;
-      var name ;
-      var instance ;
-
-      element = e.target || e.srcElement ;
-      if (element.nodeName == "BUTTON" && element.name == "dump") {
-        name = element.getAttribute("data-dump") ;
-        instance = element.getAttribute("data-instance") ;
-        self.hot_MS_Peaks = window[instance] ;
-        console.log("data of " + name, self.hot_MS_Peaks.getData()) ;
-      }
-    }) ;
-
-    $("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }} table.htCore").css(
-      "width","100%"
-    ) ;
-    if (self.is_ms2()) {
-      setTimeout(() => self.select_precursor_ion(), 200) ;
-    }
-  },
-
-  change_tab: function() {
-    var self = this ;
-    setTimeout(() => self.auto_select_ion_parent(), 1000) ;
-  },
-
-  auto_select_ion_parent: function() {
-    var self = this ;
-    if (!self.a_ion_parent_is_selected()) {
-      setTimeout(() => self.select_precursor_ion(), 1000) ;
-    }
-  },
-
-  select_precursor_ion: function() {
-    var self = this ;
-    var data ;
-    var precuirsor_ion ;
-
-    if (self.hot_MS_Peaks == null) {
-      return setTimeout(() => self.select_precursor_ion(), 200) ;
-    }
-    console.log("Selecting ion preco for tab {{ TAB_INDEX_PLACEHOLDER }}")
-    data = self.hot_MS_Peaks.getData() ;
-    for (var i = 0 ; i < data.length ; i += 1) {
-      if (data[i][5] === "[M+H]+" || data[i][5] === "[M+H]-") {
-          precursor_ion = $("#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}") ;
-          console.log(precursor_ion)
-          precursor_ion.val(data[i][0]) ;
-          precursor_ion.change() ;
-          return ;
-      }
-    }
-  },
-
-  sync_precursor_ion: function() {
-    var self = this ;
-    var data ;
-
-    if (self.lock.precursor_ion || self.hot_MS_Peaks == undefined) {
-      return ;
-    }
-    self.lock.precursor_ion = true ;
-    console.log("Syncing precursor ion")
-    var val = $("#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}").val() ;
-    var data = self.hot_MS_Peaks.getData() ;
-    for (var i = 0; i < data.length ; i += 1) {
-      if (Math.abs(data[i][0] - val) < 0.0001) {
-        for (var j = 0; j < data.length ; j += 1) {
-          data[j][7] = false ;
-        }
-        data[i][7] = true ;
-        self.hot_MS_Peaks.render() ;
-        return ;
-      }
-    }
-    self.lock.precursor_ion = false ;
-  },
-
-  // USED HERE
-  handsontableRefChemCpdAdded: function(data) {
-    var self = this ;
-    // reset
-    $("#container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    $("#sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    // init
-    var data_RCC_ADDED, colHeaderData, container_RCC_ADDED;
-
-    colHeaderData = [
-      {data: "common name", type: "text"},
-      {data: "InChIKey ", type: "text"},
-      {data: "composition", renderer: lightgrayRenderer},
-      {data: "concentration (µg/ml) ", type: "text"},
-      {data: "exact mass", renderer: lightgrayRenderer},
-      {data: "(M+H)+ or (M-H)-", renderer: lightgrayRenderer}
-    ] ;
-    
-    if (data == null) {
-      data_RCC_ADDED = [
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-        [ "", "", "","", "", "" ],
-      ];
-    } else {
-      container_RCC_ADDED = data;
-    }
-
-    container_RCC_ADDED = document.getElementById("container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}");
-    self.hot_RCC_ADDED = new Handsontable(container_RCC_ADDED, {
-      data: data_RCC_ADDED,
-      minSpareRows : 1,
-      colHeaders : true,
-      colHeaders: [
-        "common name",
-        "InChIKey ",
-        "composition",
-        "concentration (µg/ml) ",
-        "exact mass",
-        "(M+H)+ or (M-H)-"
-      ],
-      contextMenu : false,
-      columns: colHeaderData
-    });
-    function bindDumpButton_RCC_ADDED() {
-      Handsontable.Dom.addEvent(document.body, "click", (e) => {
-        var element = e.target || e.srcElement;
-        if (element.nodeName == "BUTTON"&& element.name == "dump") {
-          var name = element.getAttribute("data-dump");
-          var instance = element.getAttribute("data-instance");
-          self.hot_RCC_ADDED = window[instance];
-          console.log("data of " + name, self.hot_RCC_ADDED.getData());
-        }
-      });
-    }
-    bindDumpButton_RCC_ADDED();
-    $("#container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }} table.htCore").css("width","100%");
-    // celect cell
-    self.hot_RCC_ADDED.selectCell(0, 0);
-    // add select listener
-    self.hot_RCC_ADDED.addHook("afterSelection", (r, c) => self.hookSelection(r, c));
-  },
-
-  //USED HERE
-  hookSelection: function(r, c) {
-    var self = this ;
-    if (c == 0 || c == 1 || c == 2) 
-      self.pickChemicalCompound4Mix(r);
-  },
-
-  //USED HERE
-  postOneSpectrumFrom: function() {
-    var self = this ;
-    $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").show();
-
-    // II - form data -> json object
-    self.loadFomDataIntoJsonObjects();
-    // II.A - check if json object complete
-    var alertMsg = self.getFormErrorMessage();
-    
-    if (alertMsg != "") {
-      $("#alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}").html(alertMsg);
-      $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-      return false;
-    }
-    // all OK: lock!
-    // lock sample
-    $(self.prefix+".add1spectrum-sampleForm").prop("disabled", true);
-    // lock chromato
-    $(self.prefix+".add1spectrum-chromatoLCForm").prop("disabled", true);
-    if (!$("#container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}").is(":empty")) {
-      self.hot_LC_SFG.updateSettings({
-        cells: function(row, col, prop) {
-          var cellProperties = {};
-          cellProperties.readOnly = true;
-          return cellProperties;
-        }
-      });
-    }
-    if (!$("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}").is(":empty")) {
-      self.hot_MS_Peaks.updateSettings({
-        cells: function(row, col, prop) {
-          var cellProperties = {};
-          cellProperties.readOnly = true;
-          return cellProperties;
-        }
-      });
-    }
-    if (!$("#container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}").is(":empty")) {
-      self.hot_RCC_ADDED.updateSettings({
-        cells: function(row, col, prop) {
-          var cellProperties = {};
-          cellProperties.readOnly = true;
-          return cellProperties;
-        }
-      });
-      self.hot_RCC_ADDED.removeHook(
-        "afterSelection",
-        (r, c) => self.hookSelection(r, c)
-      );
-    }
-
-    // lock analyzer
-    $(self.prefix+".add1spectrum-analyzerMSForm").prop("disabled", true);
-    // lock other metadata field
-    $(self.prefix+".add1spectrum-otherForm").prop("disabled", true);
-    // lock switch btn
-    $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-    $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-    $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
-    self.postSpectrumToServer() ;
-  },
-
-  postSpectrumToServer: function(jsonData, tab_index) {
-    var self = this ;
-    var base_peakdata ;
-    var new_peakdata ;
-    var is_ms2 = self.is_ms2() ;
-
-    if (self.is_mix()) {
-      if ({{ TAB_INDEX_PLACEHOLDER }} != 1) {
-        return ;
-      }
-      jsonData = self.gatherJsonObjects() ;
-      all_mix_data = Object.assign({}, jsonData) ;
-      all_mix_data["peaklists"] = [] ;
-      base_peakdata = Object.assign({}, jsonData["peaklists"][0]) ;
-      base_peakdata["msms_ms_precursor_ion"] = undefined ;
-      all_contexts.forEach((context, index) => {
-        new_peakdata = Object.assign({}, base_peakdata) ;
-        context.loadFomDataIntoJsonObjects()
-        if (is_ms2) {
-          new_peakdata["precursor_ion"] = context.jsonPeaksList["msms_ms_precursor_ion"]["m/z"] ;
-        }
-        new_peakdata["peaklist"] = context.jsonPeaksList["peaklist"] ;
-        all_mix_data["peaklists"].push(new_peakdata)
-      })
-    }
-    // II.B - rebuild json full object (with all metadata or just id if already in base)
-    if (jsonData == null) {
-      jsonData = self.gatherJsonObjects();
-    }
-    // II.C - add id metadata (if exist)
-    var json_array = [] ;
-    if (!tab_index) {
-      tab_index = {{ TAB_INDEX_PLACEHOLDER }} ;
-    }
-    json_array[tab_index-1] = jsonData ;
-    
-    // III - post json object
-    // III.A - success
-    self.sent_json = jsonData ;
-    console.warn(
-      "This data has been validated without going through the internal server!"
-    )
-    if ($("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
-      $("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
-    }
-    if ($("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-spinner")) {
-      $("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-spinner fa-spin").addClass("fa-check-circle");
-    }
-    $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").hide();
-    $("#alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}").html(`
-      
-        
-          × 
-          
-             
-         
-        
-            Spectrum ready to be sent!
-      
-    `);
-    return true;
-  },
-
-  //USED HERE
-  loadFomDataIntoJsonObjects: function() {
-    var self = this ;
-    // I - Spectrum type
-    self.isJsonSpectrumTypeComplete = false ;
-    if (self.isGC && self.is_ms()) {
-      self.jsonSpectrumType = "gc-ms" ;
-    } else if (self.isLC && self.is_ms()) {
-      self.jsonSpectrumType = "lc-ms" ;
-    } else if (self.isLC && self.is_ms2()) {
-      self.jsonSpectrumType = "lc-msms" ;
-    } else if (self.isGC && self.is_ms()) {
-      self.jsonSpectrumType = "ic-ms" ;
-    } else if (self.isLC && self.is_ms()) {
-      self.jsonSpectrumType = "ic-msms" ;
-    }
-    if (self.jsonSpectrumType != null && self.jsonSpectrumType != "") {
-      self.isJsonSpectrumTypeComplete = true;
-    }
-    
-    // II - Sample
-    self.isJsonSampleComplete = true;
-    self.isJsonRCCaddedComplete = true;
-    self.jsonSample = {};
-
-    switch($("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").val()) {
-    // II.A - chemical lib. compound
-    case "compound-ref":
-      if ($("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val() == "") {
-        return false;
-      }
-      self.jsonSample["sample_type"] = "reference-chemical-compound";
-      self.jsonSample["inchikey"] = $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      self.jsonSample["concentration"] = $("#add1spectrum-sample-concentration-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      if (self.is_ms()) {
-        self.jsonSample["solvent"] = $("#add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      }
-      self.isJsonSampleComplete = true;
-      break;
-      // II.B - chemical lib. compound mix
-    case "compound-mix": 
-      // solvent
-      self.jsonSample["solvent"] = $("#add1spectrum-sample-mixSolvent-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      // cpd added
-      self.jsonSample.inchikeys_list = self.getRCCADDED();
-      self.jsonSample.concentrations_list = self.getRCCADDEDConcentration();
-      if (self.jsonSample.inchikeys_list.length == 0 && !self.is_other_in_mix()) {
-        self.isJsonRCCaddedComplete = false;
-        console.log(`isJsonRCCaddedComplete: false`)
-        return false;
-      }
-      self.isJsonSampleComplete = true;
-      break;
-    default:
-      if (!self.is_other_in_mix()) {
-        return false;
-      } 
-    }
-
-    // III - Chromato
-    self.isJsonChromatoComplete = true;
-    self.jsonChromato = {};
-    
-    // III.A - no chromato
-    // nope?
-
-    // III.B - GC  
-    if (self.isGC) {
-      self.isJsonChromatoComplete = false;
-      // TODO
-    }
-
-    // III.C - LC
-    if (self.isLC) {
-      self.isJsonChromatoComplete = true;
-      self.jsonChromato = {};
-      // check error
-      $.each($(self.prefix+".add1spectrum-chromatoLCForm").parent(), function() {
-        if ($(this).hasClass("has-error"))
-          self.isJsonChromatoComplete = false;
-      });
-      if (
-        !self.isJsonChromatoComplete
-        && !self.is_other_in_mix()
-      ) {
-        console.log(`isJsonChromatoComplete: false`)
-        return false;
-      }
-      var id = `#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}` ;
-      self.jsonChromato["method"] = $(`${id} option:selected`).text();
-      [
-        ["column_constructor", "colConstructor"],
-        ["column_constructor_other", "colConstructorOther"],
-        ["column_name", "colName"],
-        ["column_length", "colLength"],
-        ["column_diameter", "colDiameter"],
-        ["particule_size", "colParticuleSize"],
-        ["column_temperature", "colTemperature"],
-        ["mode", "LCMode"],
-        ["separation_flow_rate", "separationFlowRate"],
-        ["solvent_a", "separationSolvA"],
-        ["solvent_a_ph", "separationSolvApH"],
-        ["solvent_b", "separationSolvB"],
-        ["solvent_b_ph", "separationSolvBApH"]
-      ].forEach((field) => {
-        id = `#add1spectrum-chromatoLC-${field[1]}-{{ TAB_INDEX_PLACEHOLDER }}` ;
-        self.jsonChromato[field[0]] = $(id).val();
-      })
-      // fulfill json object
-      
-      jsonSFG = [];
-      var formatData = {
-        time: [],
-        solvent_a_percent: [],
-        solvent_b_percent: []
-      };
-      $.each(self.hot_LC_SFG.getData(), function(){
-        if (this[0]!="") {
-          if (!isNaN(this[0]) && !isNaN(this[1]) && !isNaN(this[2])) {
-            formatData["time"].push(Number(this[0]));
-            formatData["solvent_a_percent"].push(Number(this[1]));
-            formatData["solvent_b_percent"].push(Number(this[2]));
-          }
-        }
-      });
-      self.jsonChromato.separation_flow_gradient = formatData;
-    }
-
-    // III.D - IC  
-    if (self.isIC) {
-      self.isJsonChromatoComplete = false;
-      // TODO
-    }
-
-    // IV - Analyzer
-    self.isJsonAnalyzerComplete = true;
-    self.isJsonAnalyzer = {};
-    // IV.A - MS
-    if (self.is_ms() || self.is_ms2()) {
-      self.isJsonAnalyzerComplete = true;
-      self.jsonAnalyzer = {};
-      // check error
-      $.each($(self.prefix+".add1spectrum-analyzerMSForm").parent(), function(){
-        if ($(this).hasClass("has-error"))
-          self.isJsonAnalyzerComplete = false;
-      });
-      if (
-        !self.isJsonAnalyzerComplete
-        && !self.is_other_in_mix()
-      ) {
-        console.log(`isJsonAnalyzerComplete: false`)
-        return false;
-      }
-      
-      // fulfill json object
-      self.jsonAnalyzer["instrument_name"] = $("#add1spectrum-analyzer-ms-instrument-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      self.jsonAnalyzer["instrument_model"] = $("#add1spectrum-analyzer-ms-model-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      self.jsonAnalyzer["instrument_brand"] = $("#add1spectrum-analyzer-ms-model-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      self.jsonAnalyzer["ion_analyzer_type"] = $("#add1spectrum-analyzer-ms-ionAnalyzerType-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      
-      if (self.is_ms2()) {
-        // MSMS ion BEAM or TRAP
-        self.jsonMolIonBeam = {}
-        var jsonIonTrapBeam = {
-          ion_gas: $("#add1spectrum-ionTrapBeam-ionGas-{{ TAB_INDEX_PLACEHOLDER }}").val(),
-          ion_pressure_value: $("#add1spectrum-ionTrapBeam-ionGasPressureValue-{{ TAB_INDEX_PLACEHOLDER }}").val(),
-          ion_pressure_unit: $("#add1spectrum-ionTrapBeam-ionGasPressureUnit-{{ TAB_INDEX_PLACEHOLDER }}").val()
-        } ;
-        var key = null ;
-        if ($("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").val() == "trap") {
-          // sp
-          jsonIonTrapBeam["ion_freq_shift"] = $("#add1spectrum-ionTrapBeam-ionFrequencyShift-{{ TAB_INDEX_PLACEHOLDER }}").val();
-          jsonIonTrapBeam["ion_number"] = $("#add1spectrum-ionTrapBeam-ionNumber-{{ TAB_INDEX_PLACEHOLDER }}").val();
-          key = "ion_trap" ;
-        } else if ($("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").val() == "beam") {
-          key = "ion_beam_storage" ;
-        }
-        if (key !== null) {
-          self.jsonMolIonBeam[key] = jsonIonTrapBeam;
-        }
-      }
-      
-      self.jsonMolIonization = {};
-      var json_mode ;
-      ["pos", "neg"].forEach((kind) => {
-        json_mode = {} ;
-        [
-          ["ionisation_method", "ionizationMethod"],
-          ["spray_gaz_flow", "sprayGazFlow"],
-          ["vaporizer_gaz_flow", "vaporizerGazFlow"],
-          ["vaporizer_temperature", "vaporizerTemperature"],
-          ["source_gaz_flow", "sourceGazFlow"],
-          ["transfer_tube_or_capillary_temperature", "ionTransferTubeTemperatureOrTransferCapillaryTemperature"],
-          ["high_voltage", "highVoltageOrCoronaVoltage"]
-        ].forEach((field) => {
-          var id = `#add1spectrum-analyzserMS-${field[1]}-${kind}-{{ TAB_INDEX_PLACEHOLDER }}` ;
-          json_mode[field[0]] = $(id).val() ;
-        })
-        self.jsonMolIonization[`mode_${kind}`] = json_mode ;
-      })
-    }
-
-    // IV.B - NMR
-    if (self.is_ms() || self.is_ms2()) {
-      self.isJsonPeaksListComplete = false;
-      // init
-      var peaklist = [];
-      var peakdata = {};
-      var spectrumData = {};
-      // peaklist
-      var ms_peak_data = self.hot_MS_Peaks.getData();
-      $.each(ms_peak_data, function(index) {
-        var data = ms_peak_data[index] ;
-        var formatData = {};
-        if (
-          data[0] != ""
-          && !isNaN(data[0])
-            // && !isNaN(data[2])
-          && (data[6] === "true" || data[6] === true)
-        ) {
-          peaklist.push({
-            mz: Number(data[0]),
-            RI: Number(data[2]),
-            deltaPPM: Number(data[3]),
-            composition: (data[4]),
-            attribution: (data[5])
-          });
-          self.isJsonPeaksListComplete = true;
-        }
-      });
-      // peak list data
-      peakdata["ms_lvl"] = $("#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["polarity"] = $("#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["resolution"] = $("#add1spectrum-peaksMS-resolution-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["curation"] = $("#add1spectrum-peaksMS-curation-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["mz_range_from"] = $("#add1spectrum-peaksMS-rangeFrom-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["mz_range_to"] = $("#add1spectrum-peaksMS-rangeTo-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["rt_abs_from"] = $("#add1spectrum-peaksMS-rtMinFrom-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["rt_abs_to"] = $("#add1spectrum-peaksMS-rtMinTo-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["rt_solv_from"] = $("#add1spectrum-peaksMS-rtSolvFrom-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["rt_solv_to"] = $("#add1spectrum-peaksMS-rtSolvTo-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      peakdata["resolution_FWHM"] = $("#add1spectrum-analyzer-ms-resolutionFWHM-{{ TAB_INDEX_PLACEHOLDER }}").val();
-      if (self.is_ms2()) {
-        var data = self.hot_MS_Peaks.getData() ;
-        if (data.length != 0) {
-          var selected_ion = self.get_selected_parent_ion_index() ;
-          peakdata["msms_ms_precursor_ion"] = {
-            "m/z": data[selected_ion][0],
-            "abs_intensity": data[selected_ion][1],
-            "rel_intensity": data[selected_ion][2],
-            "attribution": data[selected_ion][5]
-          } ;
-        }
-      }
-      peakdata["peaklist"] = peaklist;
-      self.jsonPeaksList = peakdata;
-    }
-    
-    self.isJsonOtherMetadataComplete = true;
-    self.jsonOtherMetadata = {};
-    // check error
-    $.each($(self.prefix+".add1spectrum-otherForm").parent(), function(){
-      if ($(this).hasClass("has-error"))
-        self.isJsonOtherMetadataComplete = false;
-    });
-    if (!self.isJsonOtherMetadataComplete && !self.is_other_in_mix()) {
-      console.log(`isJsonOtherMetadataComplete: false`)
-      return false;
-    }
-    self.jsonOtherMetadata["data_authors"] =  $("#add1spectrum-other-author-{{ TAB_INDEX_PLACEHOLDER }}").val();
-    self.jsonOtherMetadata["data_validator"] =  $("#add1spectrum-other-validator-{{ TAB_INDEX_PLACEHOLDER }}").val();;
-    self.jsonOtherMetadata["acquisition_date"] =  $("#add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}").val();
-    if (!self.jsonOtherMetadata["acquisition_date"]) {
-      self.jsonOtherMetadata["acquisition_date"] = null ;
-    }
-    self.jsonOtherMetadata["data_ownership"] =  $("#add1spectrum-other-owner-{{ TAB_INDEX_PLACEHOLDER }}").val();
-    self.jsonOtherMetadata["raw_file_name"] =  $("#add1spectrum-other-fileName-{{ TAB_INDEX_PLACEHOLDER }}").val();
-    self.jsonOtherMetadata["raw_file_size"] =  $("#add1spectrum-other-fileSize-{{ TAB_INDEX_PLACEHOLDER }}").val();
-    return true;
-  },
-
-  //USED HERE
-  getFormErrorMessage: function() {
-    var self = this ;
-    var alertMsg = "";
-    if (!self.isJsonSpectrumTypeComplete) {
-      alertMsg = `
-      
-        
-          × 
-          
-             
-         
-        
-            Error processing spectrum type!
-      
` ;
-    } else if (!self.isJsonSampleComplete) {
-      alertMsg = `
-      ` ;
-    } else if (!self.isJsonRCCaddedComplete) {
-      alertMsg = `
-      
-        
-          × 
-          
-             
-         
-        
-            Pease enter at least ONE compound in mix into sample section!
-        
-        
Go to this section 
-      
-        
-          × 
-          
-             
-         
-        
-            Missing data in chromatography section!
-      ` ;
-      if (self.is_ms()) {
-        alertMsg += `
-        
-        
Go to this section `;
-      }
-      alertMsg += ' 
-        
-          × 
-          
-             
-         
-        
-            Missing peaklist!
-      ` ;
-      if (self.is_ms()) {
-        alertMsg += `
-        
-        
Go to this section `;
-      }
-      alertMsg += ' 
-              
-                × 
-                
-                   
-               
-              
-                  Select precursor ion in all peak lists!
-            
-          `
-        }
-      }
-    }
-    // TODO other
-    return alertMsg;
-  },
-
-  //USED HERE
-  gatherJsonObjects: function() {
-    var self = this ;
-    var jsonData = {};
-    if (self.is_mix()) {
-      jsonData["sample_type"] = "mix_of_reference_chemical_compounds" ;
-    } else {
-      jsonData["sample_type"] = "reference_chemical_compound" ;
-    }
-    jsonData["spectrum_type"] = self.jsonSpectrumType.toUpperCase().replaceAll("-", "");
-    jsonData["sample"] = self.jsonSample;
-    if (self.isLC) {
-      jsonData["chromatography"] = self.jsonChromato;
-    } else if (self.isGC) {
-      jsonData["chromatography"] = self.jsonChromato;
-    } else if (self.isIC) {
-      jsonData["chromatography"] = self.jsonChromato;
-    } 
-    if (self.is_ms()) {
-      jsonData["analyzer"] = self.jsonAnalyzer;
-      var molecule_ionization = self.jsonMolIonization;
-      jsonData["ionization_mode_positive"] = molecule_ionization["mode_pos"] ;
-      jsonData["ionization_mode_negative"] = molecule_ionization["mode_neg"] ;
-      jsonData["peaklists"] = [self.jsonPeaksList] ;
-    } else if (self.is_ms2()) {
-      jsonData["analyzer"] = self.jsonAnalyzer;
-      var molecule_ionization = self.jsonMolIonization;
-      jsonData["ionization_mode_positive"] = molecule_ionization["mode_pos"] ;
-      jsonData["ionization_mode_negative"] = molecule_ionization["mode_neg"] ;
-      if (self.jsonMolIonBeam != null) {
-        jsonData["ion_beam_storage"] = self.jsonMolIonBeam["ion_beam_storage"];
-      }
-      jsonData["peaklists"] = [self.jsonPeaksList] ;
-    }
-    jsonData["other_metadata"] = self.jsonOtherMetadata;
-    return jsonData;
-  },
-
-  //USED IN HTML
-  pickChemicalCompound: function() {
-    var self = this ;
-    self.singlePick = true;
-    $("#modalPickCompound-{{ TAB_INDEX_PLACEHOLDER }}").modal("show");
-    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").focus();
-  },
-
-  //USED HERE
-  pickChemicalCompound4Mix: function(rowNumber) {
-    var self = this ;
-    self.singlePick = false;
-    self.multiPickLine = rowNumber;
-    $("#modalPickCompound-{{ TAB_INDEX_PLACEHOLDER }}").modal("show");
-    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").focus();
-  },
-
-  //USED HERE
-  searchAjax: function() {
-    var self = this ;
-    var results ;
-    var rawQuery = $('#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}').val();
-    if (rawQuery.length > 2) {
-      return [] ;
-    }
-    results = [] ;
-    $.ajax({ 
-        type: "post",
-        url: "{{ PF_URL_PLACEHOLDER }}/webapp/search",
-        dataType: "json",
-        async: false,
-        data: "query=" + $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").val(),
-        success: function(json) {
-          if (json.success) {
-            $.each(json.compoundNames, function(){
-              results.push(this.name) ;
-            }) ; 
-            $.each(json.compounds, function(){
-              if (this.inChIKey.indexOf(rawQuery)) {
-                results.push(this.inChIKey) ;
-              }
-            }) ;
-          }
-      },
-      error : function(xhr) {
-        self.subjects = [] ;
-        console.log(xhr) ;
-      }
-    }) ;
-    return results ;
-  },
-
-  //USED HERE
-  searchLocalCompound: function() {
-    var self = this ;
-    $("#load-step-1-{{ TAB_INDEX_PLACEHOLDER }}").show();
-    $.ajax({ 
-      type: "get",
-      url: "{{ PF_URL_PLACEHOLDER }}/rest/v2/compounds",
-      async: true,
-      data: "limit=1&query=" + $('#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}').val() + "&query_filter=" + self.fitlerSearchLoadlCpd+"&token={{ PF_TOKEN_PLACEHOLDER }}",
-      success: function(data) {
-        data = data[0] ;
-        var id = parseInt(data["id"]) ;
-        var name = data["name"] ;
-        var inchikey = data["inchikey"] ;
-        var inchi = data["inchi"] ;
-        data = `
-    
-      
-        
-          
-            
-            
-            
-            
-           
-         
-        
-          
-            
-              ${name}  
-              ${inchikey} 
-             
-            ${data["exactMass"]} 
-            ${data["formula"]} 
-            
-               
-             
-         
-      
-    
* 
-    <` + "script" + ` type="text/javascript">
-    $("#tabPickCpd-{{ TAB_INDEX_PLACEHOLDER }}").tablesorter();
-    $.each($(self.prefix+".compoundFormula"), function(id, elem) {
-      var rawFromula = $(elem).text();
-      var formatedFormula = rawFromula;
-      try {
-        $.each($.unique( rawFromula.match(/\d+/g)), function(keyF, valF) {
-          var re = new RegExp(valF,"g");
-          formatedFormula = formatedFormula.replace(re, "
" + valF + " ");
-        });
-      } catch (e){}
-      formatedFormula = formatedFormula.replace("
", "");
-      $(elem).html(formatedFormula);
-    });
-    $.each($(self.prefix+".compoundMass"), function(id, elem) {
-      var exactMass = parseFloat( $(elem).text());
-      exactMass = roundNumber(exactMass,7)
-      $(elem).html(exactMass);
-    });
-    ` + "script" + `>
-
-       InChIKey " in this && this["InChIKey "]!= undefined && this["InChIKey "] != "") {
-        jsonRCC_ADDED.push(this["InChIKey "]);
-      }
-    });
-    return jsonRCC_ADDED;
-  },
-
-  //USED HERE
-  getRCCADDEDConcentration: function() {
-    var self = this ;
-    jsonRCC_ADDED = [];
-    $.each(self.hot_RCC_ADDED.getData(), function(){
-      var formatData = {};
-      if ("InChIKey " in this && this["InChIKey "]!= undefined && this["InChIKey "] != "") {
-        jsonRCC_ADDED.push(this["concentration (µg/ml) "]);
-      }
-    });
-    return jsonRCC_ADDED;
-  },
-
-  //USED IN HTML
-  clearLine: function() {
-    var self = this ;
-    // restet form
-    setTimeout(function(){
-      $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").val("");
-      $("#ok-step-1-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    }, 200);
-    $(self.prefix+"img.mixRCCadd"+self.multiPickLine).remove();
-    if (self.singlePick) {
-      $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val("");
-      $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").change();
-      $("#add1spectrum-sample-inchi-{{ TAB_INDEX_PLACEHOLDER }}").val("");
-      $("#add1spectrum-sample-inchi-{{ TAB_INDEX_PLACEHOLDER }}").change();
-      $("#add1spectrum-sample-commonName-{{ TAB_INDEX_PLACEHOLDER }}").val("");
-      $("#add1spectrum-sample-commonName-{{ TAB_INDEX_PLACEHOLDER }}").change();
-      $("#sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}").html("");
-    } else if (self.multiPickLine >= 0) {
-      for(var i = 0 ; i < 6 ; i += 1) {
-        self.hot_RCC_ADDED.setDataAtCell(self.multiPickLine, i, "");
-      }
-    }
-  },
-
-  exit: function() {
-    $.ajax({type: "get", url: "/quit", async: true, success: ()=>window.close()});
-  },
-
-} ;
-
-$.ajax({
-  type: "get",
-  url: "{{ PF_URL_PLACEHOLDER }}/webapp/get-cpd-data?token={{ PF_TOKEN_PLACEHOLDER }}",
-  data: "inchikey=" + "{{ INCHIKEY_PLACEHOLDER }}",
-  dataType: "json",
-  success: function(data) {
-    if (data.success) {
-      var self = context_{{ TAB_INDEX_PLACEHOLDER }} ;
-      console.log(`inchikey {{ INCHIKEY_PLACEHOLDER }} found!!`)
-      inchidata["{{ INCHIKEY_PLACEHOLDER }}"] = data ;
-      self.init() ;
-      self.fitlerSearchLoadlCpd = 5;
-      self.inchikey = null;
-      all_contexts.push(self) ;
-    } else {
-      no_success(
-        {{ TAB_INDEX_PLACEHOLDER }},
-        "{{ INCHIKEY_PLACEHOLDER }}",
-        {{ DEFAULT_DATA }}["name"]
-      ) ;
-    }
-  },
-  error : function(data) {
-    no_success(
-      {{ TAB_INDEX_PLACEHOLDER }},
-      "{{ INCHIKEY_PLACEHOLDER }}",
-      {{ DEFAULT_DATA }}["name"]
-    ) ;
-  }
-}).always(() => null);
diff -r b58b229c4cbf -r 7e3085fc60c1 common.js
--- a/common.js	Fri Mar 03 14:10:24 2023 +0000
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,195 +0,0 @@
-
-this.ctx = () => context;
-var all_contexts = [] ;
-var inchidata = {} ;
-var all_mix_data = {} ;
-function no_success(tab_index, inchi, data) {
-  console.log(`inchikey ${inchi} not found...`) ;
-  console.log(`disabling ${data} ...`)
-  disable_tab(
-    tab_index,
-    "red",
-    "This compound has not been found on peakforest"
-  ) ;
-}
-
-function disable_tab(tab_index, color, title) {
-  var element = $(`#open_tab_${tab_index}`) ;
-  element.attr("disabled", "disabled").off("click");
-  element.attr("onclick", null) ;
-  element.attr("title", title) ;
-  element.attr("data-toggle", null) ;
-  element.attr("href", null) ;
-  element.css("color", color) ;
-  element.css("cursor", "not-allowed") ;
-}
-
-function send_everything_to_peakforest(url, token) {
-  var bundles ;
-  if (context.is_mix()) {
-    bundles = [all_mix_data] ;
-  } else {
-    bundles = create_dataset_bundles() ;
-  }
-  bundles.forEach((bundle, index) => {
-    console.log(bundle)
-    $.ajax({
-      type: "post",
-      url: `${url}/rest/v2/spectrum?token=${token}`,
-      data: JSON.stringify(bundle),
-      contentType: "application/json"
-    })
-  })
-  // console.log(bundles)
-}
-
-function create_dataset_bundles() {
-  var bundles = [] ;
-  var data ;
-  all_contexts.forEach((context, index) => {
-    if ((data = context.sent_json) === null) {
-      return ;
-    }
-    if (bundles.length === 0) {
-      // console.log("First metadata!")
-      return bundles.push(data) ;
-    }
-    if (merge_in_bundle(bundles, data)) {
-      // console.log("Merged!")
-    } else {
-      // console.log("New metadata!")
-    }
-  }) ;
-  return bundles ;
-}
-
-function merge_in_bundle(bundles, data) {
-  for(var i = 0 ; i < bundles.length ; i += 1) {
-    if (
-      identical(bundles[i]["sample"], data["sample"])
-      && identical(bundles[i]["chromatography"], data["chromatography"])
-      && identical(bundles[i]["analyzer"], data["analyzer"])
-      && identical(bundles[i]["ionization_mode_positive"], data["ionization_mode_positive"])
-      && identical(bundles[i]["ionization_mode_negative"], data["ionization_mode_negative"])
-      && identical(bundles[i]["other_metadata"], data["other_metadata"])
-    ) {
-      bundles[i]["peaklists"].push(data["peaklists"][0]) ;
-      return true ;
-    } else {
-      continue ;
-      console.log(
-        "sample: "
-        + identical(bundles[i]["sample"], data["sample"])
-      )
-      console.log(
-        "chromatography: "
-        + identical(bundles[i]["chromatography"], data["chromatography"])
-      )
-      console.log(
-        "analyzer: "
-        + identical(bundles[i]["analyzer"], data["analyzer"])
-      )
-      console.log(
-        "ionization_mode_positive: "
-        + identical(bundles[i]["ionization_mode_positive"], data["ionization_mode_positive"])
-      )
-      console.log(
-        "ionization_mode_negative: "
-        + identical(bundles[i]["ionization_mode_negative"], data["ionization_mode_negative"])
-      )
-      console.log(
-        "other_metadata: "
-        + identical(bundles[i]["other_metadata"], data["other_metadata"])
-      )
-    }
-  }
-  bundles.push(data) ;
-  return false ;
-}
-
-function identical(left, right) {
-  if (typeof left !== typeof right) {
-    return false ;
-  }
-  if (left === null) {
-    return right === null ;
-  }
-  if (right === null) {
-    return left === null ;
-  }
-  switch (typeof left) {
-    case "array":
-      return identical_array(left, right) ;
-      break ;
-    case "object":
-      return identical_object(left, right) ;
-      break ;
-    default:
-      break ;
-  }
-  return (left === right)
-}
-
-function identical_array(left, right) {
-  if (right.length !== left.length) {
-    return false ;
-  }
-  for(var i = 0 ; i < left.length ; i += 1) {
-    if (!identical(left[i], right[i])) {
-      return false ;
-    }
-  }
-  return true ;
-}
-
-function identical_object(left, right) {
-  var left_keys ;
-
-  if (!(
-    share_keys(left, right)
-    && share_keys(right, left)
-  )) {
-    return true ;
-  }
-  left_keys = Object.keys(left) ;
-  for (var i = 0 ; i < left_keys.length ; i += 1){
-    if (!identical(left[left_keys[i]], right[left_keys[i]])) {
-      return false ;
-    }
-  }
-  return true ;
-}
-
-function share_keys(left, right) {
-  var left_keys ;
-  var right_keys ;
-
-  left_keys = Object.keys(left) ;
-  right_keys = Object.keys(right) ;
-  for(var i = 0 ; i < left_keys.length ; i += 1) {
-    if (!right_keys.includes(left_keys[i])) {
-      return false ;
-    }
-  }
-  return true ;
-}
-
-var set_inchi_data = function(data, tab_index) {
-  inchidata[data.inchikey] = data ;
-  $(`#add1spectrum-sample-inchi-${tab_index}`).val(data.inchi);
-  $(`#add1spectrum-sample-inchi-${tab_index}`).change();
-  $(`#add1spectrum-sample-commonName-${tab_index}`).val(data.name);
-  $(`#add1spectrum-sample-commonName-${tab_index}`).change();
-  $(`#sample-bonus-display-${tab_index}`).html(
-    `
-                      
-                        
-                        
-                          
-                            Precursor ion (M/Z) 
-                             
-                          
-                        
-                      
-                    
-              
-                
-                  
-                  
-                    
-                      
-                  
-                
-                
-                  
-                  
-                    
-                      
-                        
-                          
-                            
-                              
-                                Sample Type  
-                                
-                                  choose in list… 
-                                  Ref. Chemical Compound 
-                                 
-                              
-                            
-                            
-                              
-                              
-                                
-                                  
Reference compound added 
-                                
-                                
-                              
-                            
-                          
-                        
-                        
-                      
-                      
-                    
-                  
-                
-                
-                  
-                  
-                    
-                      
-                        
-                          
-                            
-                              
Chromatography Param. 
-                            
-                            
-                              
-                                Method  
-                                
-                              
-                              
-                                Column constructor  
-                                choose in list… Agilent Alltech Cil cluzeau Daicel Hypersil Interchim Macherey nagel Merck Phenomenex Shiseido Supelco (sigma-aldrich) Thermo Vydac Waters YMC Other 
-                              
-                                Column constructor (other)  
-                                
-                              
-                                Column name  
-                                
-                              
-                                Column length (mm)  
-                                
-                              
-                                Column diameter (mm)  
-                                
-                              
-                                Particule size (µm)  
-                                
-                              
-                                Column temperature (°C)  
-                                
-                              
-                                LC mode  
-                                
-                                  choose in list… 
-                                  Gradient 
-                                  Isocratic 
-                                 
-                              
-                              
-                                Separation flow rate (µL/min)  
-                                
-                              
-                                Separation solvent A  
-                                choose in list… 5% ACN + 0.1% FA in H2O 10% ACN + 0.1% FA in H2O 10mM (NH4)2CO3 / ACN (20/80) (v/v) Acetonitrile Acetonitrile + 0.1% Formic Acid H2O + 0.1% Formic Acid H2O, ammonium carbonate 10 mM, pH10.5 H2O, ammonium acetate 2.5 mM H2O / CH3OH / CH3CO2H (95/5/0.1) Methanol Methanol / H2O (1/1) Methanol / H2O (1/1), 0.1% FA Methanol / CH3CO2H (100/0.1) Methanol / ACN (60/40) ammonium acetate 2.5 mM 
-                              
-                                pH solvent A (if acqueous solvant)  
-                                
-                              
-                                Separation solvent B  
-                                choose in list… 5% ACN + 0.1% FA in H2O 10% ACN + 0.1% FA in H2O 10mM (NH4)2CO3 / ACN (20/80) (v/v) Acetonitrile Acetonitrile + 0.1% Formic Acid H2O + 0.1% Formic Acid H2O, ammonium carbonate 10 mM, pH10.5 H2O, ammonium acetate 2.5 mM H2O / CH3OH / CH3CO2H (95/5/0.1) Methanol Methanol / H2O (1/1) Methanol / H2O (1/1), 0.1% FA Methanol / CH3CO2H (100/0.1) Methanol / ACN (60/40) ammonium acetate 2.5 mM 
-                              
-                                pH solvent B (if acqueous solvant)  
-                                
-                            
-                          
-                        
-                        
-                          
-                            
-                              
Separation flow gradient 
-                            
-                            
-                          
-                        
-                      
-                      
-                    
-                  
-                
-                
-                
-                  
-                  
-                    
-                      
-                        
-                          
-                          
-                            
-                              
Analyzer 
-                            
-                            
-                              
-                                Instrument  
-                                
-                              
-                                Model  
-                                
-                              
-                            
-                          
-                        
-                        
-                          
-                          
-                            
-                              
Molecule Ionization 
-                            
-                            
-                          
-                        
-                        
-                          
-                          
-                            
-                              
Ion Storage / Ion Beam 
-                            
-                            
-                              
-                                Type (storage / beam)   
-                                
-                                  choose in list… 
-                                  Ion Trap 
-                                  Ion Beam 
-                                 
-                              
-                              
-                                
-                                  Ion storage: Ion Trap (IT) and ICR.
-                                   
-                              
-                              
-                                Gas   
-                                
-                                  He 
-                                  N2 
-                                  Ar 
-                                 
-                              
-                              
-                                Gas pressure  
-                                
-                                  choose in list… 
-                                  mbar 
-                                  a.u. 
-                                 
-                              
-                              
-                                Frequency Shift (KHz)   
-                                
-                              
-                                Ion Number (AGC or ICC)   
-                                
-                            
-                          
-                        
-                      
-                      
-                    
-                  
-                
-                
-                  
-                  
-                    
-                      
-                        
-                          scan type  
-                          
-                            choose in list… 
-                            ms 
-                            ms2 
-                            
-                           
-                        
-                        
-                          polarity  
-                          
-                            choose in list… 
-                            positive 
-                            negative 
-                           
-                        
-                        
-                          resolution  
-                          
-                            choose in list… 
-                            low 
-                            high 
-                           
-                        
-                        
-                          curation  
-                          
-                            no curation 
-                            Peaks RI > 1% 
-                            Top 50 peaks 
-                            Top 20 peaks 
-                            Top 10 peaks 
-                            Similar chromatographic profile 
-                           
-                        
-                      
-                      
-                      
-                        
-
-                        
-                          Isolation mode   
-                          
-                            choose in list… 
-                            IT 
-                            Q 
-                            TOF 
-                            ICR 
-                           
-                        
-                        
-                          Isolation window   
-                          
-                        
-                          qz isolation / activation (no unit)   
-                          
-                        
-                          Activation time (ms)   
-                          
-                        
-                          Mode   
-                          
-                            choose in list… 
-                            HCD 
-                            CID 
-                            ECD 
-                            ETD 
-                           
-                        
-
-                        
-                          Frag. energy   
-                          
-                      
-                      
-                      
-                      
-                        
-                          
-                          
-                          
-                            
-                              
-                                
-
-                                
-                                  Precursor ion (M/Z)  
-                                  
-                              
-                            
-                            
-                          
-                        
-                      
-                      
-                        
-                          check 
-                          
-                        
 
-                      
-                    
-                  
-                
-                
-                  
-                  
-                    
-                      
-                      
-                        
-                          
-                          
-                          
-                          
-                          
-                             
-                        
-                        
-                      
-                      
-                    
-                  
-                
-              
-              
-              
-              
-            
-              
-                
-                  
-                  
-                    
-                      Compound Name 
-                      
-                        
-                           
-                       
-                    
-                    
-                      
-                    
-                    
-                  
-                  
-                
-              
-            
-    1.1.0 
-    
-        
-    
-     
-    
-        alpha 
-            nightly 
-            metabohub 
-        
-        LC-MS 
-            LC-MSMS 
-            GC-MS 
-        
-
-        Compound Ref 
-            Compound Mix 
-        
-        positive 
-            negative 
-            neutral 
-        
-         
-
-    
-
-     
- 
\ No newline at end of file
diff -r b58b229c4cbf -r 7e3085fc60c1 meta-compound-mix.html
--- a/meta-compound-mix.html	Fri Mar 03 14:10:24 2023 +0000
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,1272 +0,0 @@
-
-
-  
-    PeakForest MetaboHub 
-    
-      
-        Close MS2PF 
-      
-      
-        
-          
-            
-              
-              
-                
-                  
-              
-            
-            
-              
-              
-                
-                  
-                    
-                      
-                        
-                          
-                            
-                              Sample Type
-                             
-                            
-                              choose in list… 
-                              
-                                Mix of Ref. Chemical Compound
-                               
-                             
-                          
-                        
-                        
-                          
-                            
-                              solvent 
-                              
-                                choose in list… 
-                                H2O/ethanol (75/25) 
-                               
-                            
-                          
-                          
-                            
-                              
Reference compound added 
-                            
-                            
-                          
-                        
-                      
-                    
-                    
-                  
-                  
-                
-              
-            
-            
-              
-              
-                
-                  
-                    
-                      
-                        
-                          
Chromatography Param. 
-                        
-                        
-                          
-                            Method 
-                            
-                          
-                          
-                            Column constructor 
-                            
-                              choose in list… 
-                          
-                             
-                          
-                          
-                            Column constructor (other) 
-                            
-                          
-                            Column name 
-                            
-                          
-                            Column length (mm) 
-                            
-                          
-                            Column diameter (mm) 
-                            
-                          
-                            Particule size (µm) 
-                            
-                          
-                            Column temperature (°C) 
-                            
-                          
-                            LC mode 
-                            
-                              choose in list… 
-                              Gradient 
-                              Isocratic 
-                             
-                          
-                          
-                            Separation flow rate (µL/min) 
-                            
-                          
-                            Separation solvent A 
-                            
-                              choose in list… 
-                              
-                             
-                          
-                          
-                            pH solvent A (if acqueous solvant) 
-                            
-                          
-                            Separation solvent B 
-                            
-                            
-                             
-                          
-                          
-                            pH solvent B (if acqueous solvant) 
-                            
-                        
-                      
-                    
-                    
-                      
-                        
-                          
Separation flow gradient 
-                        
-                        
-                      
-                    
-                  
-                  
-                
-              
-            
-            
-            
-              
-              
-                
-                  
-                    
-                      
-                      
-                        
-                          
Analyzer 
-                        
-                        
-                          
-                            Instrument 
-                            
-                          
-                            Model 
-                            
-                          
-                        
-                      
-                    
-                    
-                      
-                      
-                        
-                          
Molecule Ionization 
-                        
-                        
-                      
-                    
-                    
-                      
-                      
-                        
-                          
Ion Storage / Ion Beam 
-                        
-                        
-                          
-                            Type (storage / beam)  
-                            
-                              choose in list… 
-                              Ion Trap 
-                              Ion Beam 
-                             
-                          
-                          
-                            
-                              Ion storage: Ion Trap (IT) and ICR.
-                               
-                          
-                          
-                            Gas  
-                            
-                              He 
-                              N2 
-                              Ar 
-                             
-                          
-                          
-                            Gas pressure 
-                            
-                              choose in list… 
-                              mbar 
-                              a.u. 
-                             
-                          
-                          
-                            Frequency Shift (KHz)  
-                            
-                          
-                            Ion Number (AGC or ICC)  
-                            
-                        
-                      
-                    
-                  
-                  
-                
-              
-            
-            
-              
-              
-                
-                  
-                    
-                      scan type 
-                      
-                        choose in list… 
-                        ms 
-                        ms2 
-                        
-                       
-                    
-                    
-                      polarity 
-                      
-                        choose in list… 
-                        positive 
-                        negative 
-                       
-                    
-                    
-                      resolution 
-                      
-                        choose in list… 
-                        low 
-                        high 
-                       
-                    
-                    
-                      curation 
-                      
-                        no curation 
-                        Peaks RI > 1% 
-                        Top 50 peaks 
-                        Top 20 peaks 
-                        Top 10 peaks 
-                        Similar chromatographic profile 
-                       
-                    
-                  
-                  
-                  
-                    
-                    
-                      
-                        Isolation mode  
-                      
-                        choose in list… 
-                        IT 
-                        Q 
-                        TOF 
-                        ICR 
-                       
-                    
-                    
-                      
-                        Isolation window  
-                      
-                    
-                      qz isolation / activation (no unit)  
-                      
-                    
-                      Activation time (ms)  
-                      
-                    
-                      
-                        Mode  
-                      
-                        choose in list… 
-                        HCD 
-                        CID 
-                        ECD 
-                        ETD 
-                       
-                    
-
-                    
-                      
-                        Frag. energy  
-                      
-                  
-                  
-                  
-                    
-                      
-                        retention time (% solvant) from / to 
-                       
-                      
-                    
 
-                    
 
-                  
-                  
-                    
-                      {{ TAB_LIST_PLACEHOLDER }}
-                     
-                    
-                      {{ ADD_SPECTRUM_FORM }}
-                    
-                  
-                  
-                    
-                      check 
-                      
-                    
 
-                  
-                
-              
-            
-
-
-            
-              
-              
-                
-                  
-                  
-                    
-                      
-                      
-                         
-                      
-                      
-                        
-                           
-                        
-                           
-                       
-                    
-                    
-                      
-                  
-                  
-                
-              
-            
-            
-            
-            
-            
-              
-                
-                  
-                  
-                    
-                      Compound Name 
-                      
-                        
-                           
-                       
-                    
-                    
-                      
-                    
-                    
-                  
-                  
-                
-              
-            
-            
-          
-        
-      
-      
-        
-           
-        
-          Close MS2PF
-         
-      
-      
-      
-    
-      
-     
-    
-    
-    {{ EMBED_JS }}
-    
-  
-
\ No newline at end of file
diff -r b58b229c4cbf -r 7e3085fc60c1 meta-compound-ref.html
--- a/meta-compound-ref.html	Fri Mar 03 14:10:24 2023 +0000
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,112 +0,0 @@
-
-
-  
-    PeakForest MetaboHub 
-    
-        
-          Close MS2PF 
-        
-        
-          
-            {{ TAB_LIST_PLACEHOLDER }}
-           
-          
-            {{ ADD_SPECTRUM_FORM }}
-          
-        
-        
-          
-             
-          Close MS2PF 
-        
-        
-        
-      
-      
-     
-    
-    
-    {{ EMBED_JS }}
-    
-  
-
\ No newline at end of file
diff -r b58b229c4cbf -r 7e3085fc60c1 ms2pf_it.xml
--- a/ms2pf_it.xml	Fri Mar 03 14:10:24 2023 +0000
+++ b/ms2pf_it.xml	Wed Aug 30 14:21:18 2023 +0000
@@ -1,44 +1,148 @@
 
-    
-        adds you MS spectrum to peakforest.
-     
-    
-        0 
-        macros.xml 
-     
-    
-        python 
-        pyyaml 
-     
-    
-        
-            8000 
-            / 
-         
-     
-    
+  
+    adds you MS spectrum to peakforest.
+   
+  
+    1.2.1 
+    0 
+   
+  
+    quay.io/pfem/ms2peakforest:@TOOL_VERSION@ 
+   
+  
+    
+      8000 
+      / 
+     
+   
+  
 
-     
-    
-@MS2PF_COMMON_CMD@
-     
-    
-         
-    
-        
-            do_output_json 
-         
-     
-    
-     
+   
+  
+   
+  
+    alpha 
+        nightly 
+        metabohub 
+    
+    LC-MS 
+        LC-MSMS 
+        GC-MS 
+    
+
+    Compound Ref 
+      Compound Mix 
+    
+    positive 
+      negative 
+      neutral 
+    
+    
+   
+  
+    
+      do_output_json 
+     
+   
+  
+   
     
 
-     
+  
  
diff -r b58b229c4cbf -r 7e3085fc60c1 server.py
--- a/server.py	Fri Mar 03 14:10:24 2023 +0000
+++ b/server.py	Wed Aug 30 14:21:18 2023 +0000
@@ -40,21 +40,22 @@
   "theo_mass": "",
   "delta_ppm": "ppm",
   "rdbequiv": "",
-  "composition": "",
-  "attribution": "fragment",
+  "composition": "fragment",
+  "attribution": "composition",
 }
 
 MS_2_SNOOP_HEADER = {
   "name": str,
   "inchikey": str,
-  "composition": str,
+  # "composition": str,
+  "composition": lambda *args:"",
   "fragment": str,
   "fragment_mz": str,
   "ppm": str,
   "fileid": str,
   "correlation": str,
-  "abs_intensity": lambda x:float(x) * 100,
-  "rel_intensity": lambda x:float(x) * 100,
+  "abs_intensity": lambda x:float(x), # * 100,
+  "rel_intensity": lambda x:float(x) * 100 if x != "" else "",
   "valid_corelation": str
 }
 
@@ -233,7 +234,7 @@
       method: "default is {{ defaults.method }}"
     meta:
       author: Lain Pavot
-      version: 1.1.0
+      version: 1.2.0
     shortcuts:
       help: h
       ## will autogenerate -i for input and -m for method
@@ -422,13 +423,11 @@
   config.placeholders[ADD_SPECTRUM_FORM] = ""
   config.placeholders[EMBED_JS_PLACEHOLDER] = ""
   config.placeholders[TAB_LIST_PLACEHOLDER] = ""
-  config.placeholders["DEFAULT_MIN_MZ"] = "50"
-  config.placeholders["DEFAULT_MAX_MZ"] = "500"
+  # config.placeholders["DEFAULT_MIN_MZ"] = "50"
+  # config.placeholders["DEFAULT_MAX_MZ"] = "500"
   config.placeholders["DEFAULT_RESOLUTION_LOW"] = ""
   config.placeholders["DEFAULT_RESOLUTION_HIGH"] = "selected=\"selected\""
   config.placeholders["DEFAULT_RESOLUTION_UNSET"] = ""
-  config.placeholders["DEFAULT_MIN_RT"] = "0.9"
-  config.placeholders["DEFAULT_MAX_RT"] = "1.4"
   return config
 
 def parse_parameters(config):
@@ -458,6 +457,9 @@
       + '\n'.join(parameters.errors)
     )
 
+  parameters.placeholders["DEFAULT_MIN_RT"] = str(arguments.rt_min)
+  parameters.placeholders["DEFAULT_MAX_RT"] = str(arguments.rt_max)
+
   if arguments.sample_type == COMPOUND_MIX:
     parameters["form_template"] = os.path.join(
       parameters["root_dir"],
@@ -467,7 +469,7 @@
       parameters["root_dir"],
       parameters.templates.main_mix
     )
-  elif arguments.sample_type == COMPOUND_REF:
+  else: # elif arguments.sample_type == COMPOUND_REF:
     parameters["form_template"] = os.path.join(
       parameters["root_dir"],
       parameters.templates.form_ref
@@ -566,6 +568,7 @@
       arguments["method"] = "cf_pfem_urine_qtof"
     else:
       arguments["method"] = "cf_pfem_urine_method1_qtof-msms"
+      arguments["method"] = "toulouse-metatoul-agromix__ft-esi__msms"
   if arguments["sample_type"] == COMPOUND_MIX:
     check_mix_compound_files(parameters)
   more_info_in_logs(parameters)
@@ -579,11 +582,14 @@
       for metadata in arguments.raw_metadata
     ]
   except ValueError:
-    parameters.logger.error(
-      "Metadata/file names does not start with `[0-9]+-[0-9]+_.*` . "
-      "This is necessary in the case of compounds mix."
-    )
-    sys.exit(-1)
+    ## file does not start with `[0-9]+-[0-9]+_.*`: probably
+    ## a ms2snoop file.
+    return
+    # parameters.logger.error(
+    #   "Metadata/file names does not start with `[0-9]+-[0-9]+_.*` . "
+    #   "This is necessary in the case of compounds mix."
+    # )
+    # sys.exit(-1)
   runs, samples = zip(*numbarz)
   if not all(runs[0] == i for i in runs[1:]):
     parameters.logger.error(
@@ -806,8 +812,8 @@
           ms_data["abs_intensity"],
           ms_data["rel_intensity"],
           ms_data["ppm"],
+          ms_data["fragment"],
           ms_data["composition"],
-          ms_data["fragment"],
           str(ms_data["valid_corelation"] == "TRUE").lower(),
           "true" if ms_data.get("correlation") == "1" else "false"
         )
@@ -827,11 +833,10 @@
   adds the compound to the tab list,
   creates the js file for this tab
   """
-  if len([x for x in ms_peak_table if x.split(", ")[7] == "\"true\""]) > 1:
-    for i in range(len(ms_peak_table)):
-      ms_peak_table[i] = ", ".join(
-        ms_peak_table[i].split(", ")[:-1] + [", \"false\""]
-      )
+  ignore_multiple_parent_ion(ms_peak_table)
+  determine_min_max_mz(ms_peak_table)
+  guess_relative_intensities(ms_peak_table)
+  accept_all_fragments_if_all_false(ms_peak_table)
   config.placeholders[MS_PEAK_VALUES_PLACEHOLDER] = f"""[
     {','.join('['+line+']' for line in ms_peak_table)}
   ]"""
@@ -853,6 +858,64 @@
   if index == 1:
     config.placeholders[ACTIVE_TAB_PLACEHOLDER] = ""
 
+def determine_min_max_mz(ms_peak_table):
+  mz_list = [
+    float(ms_peak_table[i].split(", ")[0].strip("\""))
+    for i in range(len(ms_peak_table))
+  ]
+  config.placeholders["DEFAULT_MIN_MZ"] = str(min(mz_list))
+  config.placeholders["DEFAULT_MAX_MZ"] = str(max(mz_list))
+
+def guess_relative_intensities(ms_peak_table):
+  if all(
+    ms_peak_table[i].split(", ")[2].strip("\"") == ""
+    for i in range(len(ms_peak_table))
+  ):
+    absolute_intensities = [
+      float(ms_peak_table[i].split(", ")[1].strip("\""))
+      for i in range(len(ms_peak_table))
+    ]
+    greatest = float(max(absolute_intensities))
+    relative_intensities = [
+      intensity / greatest * 100
+      for intensity in absolute_intensities
+    ]
+    replace_ms_table_value(ms_peak_table, 2, relative_intensities)
+
+def ignore_multiple_parent_ion(ms_peak_table):
+  if len([
+    None for x in ms_peak_table
+    if x.split(", ")[7].strip("\"") == "true"
+  ]) > 1:
+    ## if more than one is the precursor, then none is the precursor
+    replace_ms_table_value(ms_peak_table, 7, "\"false\"")
+
+def accept_all_fragments_if_all_false(ms_peak_table):
+  if all(
+    ms_peak_table[i].split(", ")[6].strip("\"") == "false"
+    for i in range(len(ms_peak_table))
+  ):
+    replace_ms_table_value(ms_peak_table, 6, "true")
+
+def replace_ms_table_value(ms_peak_table, index, value, sep=", "):
+  length = len(ms_peak_table)
+  if not isinstance(value, list):
+    if isinstance(value, str):
+      value = [value.join('""')] * length
+    else:
+      value = [str(value)] * length
+  if not isinstance(value[0], str):
+    value = [str(x) for x in value]
+  count = ms_peak_table[0].count(sep)
+  endindex = count - index
+  neg_endindex = -endindex
+  for i in range(length):
+    ms_peak_table[i] = sep.join((
+      *ms_peak_table[i].split(sep, index)[:index],
+      value[i],
+      *ms_peak_table[i].rsplit(sep, endindex)[neg_endindex:]
+    ))
+
 def fragnot_extractor(config, *line):
   """
   Fragnot processor - extracts one fragnot line of content and
@@ -862,7 +925,7 @@
     FRAGNOT_HEADER[header]: line[i].strip()
     for i, header in enumerate(FRAGNOT_HEADER)
   }
-  fragnot_data["composition"] = "unknown"
+  # fragnot_data["composition"] = "unknown"
   fragnot_data["valid_corelation"] = config.arguments.validation
   return fragnot_data
 
@@ -923,7 +986,7 @@
   else:
     gen_dir = tempfile.gettempdir()
     config.workdir.tmp_dir = gen_dir
-  shutil.copy(os.path.join(config["root_dir"], "common.js"), gen_dir)
+  shutil.copy(os.path.join(config["root_dir"], "src", "common.js"), gen_dir)
   config.logger.info(f"Outputs will be generated in {config.workdir.tmp_dir}")
   return gen_dir
 
@@ -941,11 +1004,13 @@
     def do_POST(self):
       content_length = int(self.headers.get("Content-Length"))
       json_bytes = self.rfile.read(content_length).decode("utf-8")
-      json_list = json.loads(json_bytes)
-      for i, obj in enumerate(json_list):
-        print(obj)
-        if obj:
-          config["json_result"][i] = obj
+      # json_list = json.loads(json_bytes)
+      # for i, obj in enumerate(json_list):
+      #   print(obj)
+      #   if obj:
+      #     config["json_result"][i] = obj
+      json_obj = json.loads(json_bytes)
+      config["json_result"][json_obj["index"]] = json_obj["object"]
       save_json(config)
       self.send_head()
       self.wfile.write(json_bytes.encode("utf-8"))
@@ -974,7 +1039,7 @@
   """
   prepare and runs the server, with the handler for the given directory
   """
-  ip, port = config.network.ip, config.network.port
+  ip, port = config.arguments.ip, int(config.arguments.port)
   config.logger.debug(f"IP and port: {ip}:{port}")
   socketserver.TCPServer.allow_reuse_address = True
   config.logger.debug(f"Allow reuse adress.")
@@ -1066,6 +1131,10 @@
   logger.info("...")
 
 if __name__ == "__main__":
+  print(os.listdir("test-data"))
+
+  if not os.path.exists("config.yml"):
+    shutil.copy("config.default.yml", "config.yml")
 
   base_config = parse_config()
   config = parse_parameters(base_config)
@@ -1075,6 +1144,12 @@
   """
   arguments = config.arguments
 
+  if arguments.pid:
+    print(arguments.pid)
+    with open(arguments.pid, "w") as pid_file:
+      pid_file.write(str(os.getpid()))
+    atexit.register(lambda:os.unlink(arguments.pid))
+
   config.logger.info(f"Starting MS2PF from {os.getcwd()}")
 
   gen_dir = prepare_workplace(config)
diff -r b58b229c4cbf -r 7e3085fc60c1 src/add-one-spectrum-index.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/add-one-spectrum-index.js	Wed Aug 30 14:21:18 2023 +0000
@@ -0,0 +1,2627 @@
+
+var token = "{{ PF_TOKEN_PLACEHOLDER }}" ;
+if ({{ TAB_INDEX_PLACEHOLDER }} == 1) {
+}
+
+context_{{ TAB_INDEX_PLACEHOLDER }} = {
+  prefix: "#accordion-{{ TAB_INDEX_PLACEHOLDER }} ",
+  name: "Context[{{ TAB_INDEX_PLACEHOLDER }}]",
+  produce_json: {{ PRODUCE_JSON_PLACEHOLDER }},
+  DEFAULT_MS_PEAK_VALUES: {{ MS_PEAK_VALUES_PLACEHOLDER }},
+  DEFAULT_DATA: {{ DEFAULT_DATA }},
+  peakforest_url: "{{ PF_URL_PLACEHOLDER }}",
+  tab_index: "{{ TAB_INDEX_PLACEHOLDER }}",
+  modeEditSpectrum: false,
+  isSeparationFlowRateInit: false,
+  isMSpeaksInit: false,
+  isLC: false,
+  isGC: false,
+  isIC: false,
+  hot_LC_SFG: null ,
+  hot_MS_Peaks: null,
+  hot_RCC_ADDED: null,
+  jsonSpectrumType: null,
+  isJsonSpectrumTypeComplete: false,
+  jsonSample: null,
+  isJsonSampleComplete: false,
+  isJsonRCCaddedComplete: false,
+  jsonChromato: null,
+  isJsonChromatoComplete: false,
+  jsonAnalyzer: null,
+  isJsonAnalyzerComplete: false,
+  jsonPeaksList: [],
+  isJsonPeaksListComplete: false,
+  jsonOtherMetadata: null,
+  isJsonOtherMetadataComplete: false,
+  jsonMolIonization: null,
+  jsonMolIonBeam: null,
+  cptPeakListTab: 0,
+  jsonAnalyzerAcquisition: [],
+  idMetadataMap: {},
+  listOfViewableSpectra: [],
+  singlePick: true,
+  multiPickLine: -1,
+  subjects: [],
+  fitlerSearchLoadlCpd: 5,
+  inchikey: null,
+  initialized: false,
+  selected_ion_index: null,
+  lock: {
+    precursor_ion: false
+  },
+
+  sent_json: null,
+
+  init: function() {
+
+    var self = this ;
+
+    $(document).ready(() => self.on_ready());
+    $(document).ready(function() {
+      console.log("adding click on open_tab_{{ TAB_INDEX_PLACEHOLDER }}.") ;
+      var activate_tab = function() {
+        if (self.initialized) {
+          return ;
+        }
+        self.auto_set_spec_type() ;
+      }
+      if (self.is_ref()) {
+        $("#open_tab_{{ TAB_INDEX_PLACEHOLDER }}").click(activate_tab) ;
+      }
+      if ({{ TAB_INDEX_PLACEHOLDER }} == 1) {
+        activate_tab() ;
+      }
+    }) ;
+
+    return (self) ;
+
+  },
+
+  on_ready: function() {
+    var self = this ;
+
+    $(self.prefix+".pickChemicalCompound").click(self.pickChemicalCompound);
+    $(self.prefix+".add1spectrum").change(
+      function(){self.add1spectrum_change_handler(this)}
+    )
+    self.attach_search() ;
+    self.add_date_check() ;
+    self.populate_selects() ;
+    self.add_change_handlers() ;
+    self.show_hide_ms_ms2_fields() ;
+  },
+
+  populate_selects: function() {
+    var self = this ;
+    var choose_in_list ;
+
+    choose_in_list = `
+      
+        choose in list…
+       
+    ` ;
+    $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
+    $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
+    $("#add1spectrum-chromatoLC-separationSolvA-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
+    $("#add1spectrum-chromatoLC-separationSolvB-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
+    $("#add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}").append(choose_in_list) ;
+    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-methods.json", self.populate_lc_methods) ;
+    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-columns.json", self.populate_lc_columns) ;
+    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-solvents.json", self.populate_lc_solvents) ;
+    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-ms-ionization-methods.json", self.populate_ms_ionization) ;
+    $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lcms-solvents.json", self.populate_lcms_solvents) ;
+    self.resetFromColors();
+  },
+
+  attach_search: function() {
+    var self = this ;
+
+    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").bind("keypress", function(e) {
+      var code = e.keyCode || e.which;
+      if (code == 13) {
+        self.searchLocalCompound();
+      }
+    });
+    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").typeahead({
+      source: function(query, process) {
+        return self.searchAjax();
+      }
+    });
+  },
+
+  add_date_check: function() {
+    var self = this ;
+
+    $("#add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}").focusout(function() {
+      var element = $(this) ;
+      self.rm_warning(element);
+      self.rm_success(element) ;
+      if (element.val() == "") {
+        element.parent().addClass("has-warning");
+      } else {
+        element.parent().addClass("has-success");
+      }
+    });
+  },
+
+  populate_lc_methods: function(data) {
+    // load data from json
+    $.each(data.methods,function() {
+      if (this.name !== undefined) {
+        if (this.value !== undefined) {
+          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            `${this.name} `
+          );
+        } else {
+          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            `${this.name} `
+          );
+        }
+      }
+    });
+  },
+
+  populate_lc_columns: function(data) {
+    // load data from json
+    $.each(data.columns, function() {
+      $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").append(
+        `${this.name} `
+      );
+    });
+    $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").append(
+      'Other '
+    );
+  },
+
+  populate_lc_solvents: function(data) {
+    // load data from json
+    $.each(data.solvents, function() {
+      $("#add1spectrum-chromatoLC-separationSolvA-{{ TAB_INDEX_PLACEHOLDER }}").append(
+        `${this.name} `
+      );
+      $("#add1spectrum-chromatoLC-separationSolvB-{{ TAB_INDEX_PLACEHOLDER }}").append(
+        `${this.name} `
+      );
+    });
+  },
+
+  populate_ms_ionization: function(data) {
+    // load data from json
+    $.each(data.methods,function() {
+      if (this.name !==undefined) {
+        if (this.value !==undefined) {
+          $("#add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            `${this.name} `
+          );
+          $("#add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            `${this.name} `
+          );
+        } else {
+          $("#add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            `${this.name} `
+          );
+          $("#add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            `${this.name} `
+          );
+        }
+      }
+    });
+  },
+
+  populate_lcms_solvents: function(data) {
+    // load data from json
+    $.each(data.solvents, function () {
+      $("#add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}").append(
+        `${this.name} `
+      );
+    });
+  },
+
+  add_change_handlers: function() {
+    var self = this ;
+
+    $("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").on("change", function() {
+      var v = $("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      $(self.prefix + ".add1spectrum-ionTrap").hide();
+      if (v == "beam") {
+      } else if (v == "trap") {
+        $(self.prefix + ".add1spectrum-ionTrap").show();
+      }
+    }) ;
+  },
+
+  show_hide_ms_ms2_fields: function() {
+    var self = this ;
+    $(self.prefix + " .disabled-if-ms").attr("disabled", self.is_ms())
+    $(self.prefix + " .disabled-if-msms").attr("disabled", self.is_ms2())
+    $(self.prefix + " .disabled-if-ms2").attr("disabled", self.is_ms2())
+    if (self.is_ms()) {
+      self.hide(self.prefix + " .hidden-if-ms") ;
+    }
+    if (self.is_ms2()) {
+      self.hide(self.prefix + " .hidden-if-msms") ;
+      self.hide(self.prefix + " .hidden-if-ms2") ;
+    }
+  },
+
+  is_mix: function() {
+    return this.DEFAULT_DATA["sample_type"] == "compound-mix" ;
+  },
+
+  is_ref: function() {
+    return this.DEFAULT_DATA["sample_type"] == "compound-ref" ;
+  },
+
+  is_ms: function() {
+    return this.DEFAULT_DATA["spectrum_type"] == "LC_MS" ;
+  },
+
+  is_ms2: function() {
+    return this.DEFAULT_DATA["spectrum_type"] == "LC_MSMS" ;
+  },
+
+  is_other_in_mix() {
+    return this.is_mix() && {{ TAB_INDEX_PLACEHOLDER }} > 1 ;
+  },
+
+  hide: function(id) {
+    if (typeof id == Array) {
+      return (id.forEach(hide)) ;
+    }
+    $(id).hide()
+  },
+
+  rm_success: function(element) {
+    return (this.rm_parent_class(element, "has-success"))
+  },
+  rm_error: function(element) {
+    return (this.rm_parent_class(element, "has-error"))
+  },
+  rm_warning: function(element) {
+    return (this.rm_parent_class(element, "has-warning"))
+  },
+  set_success: function(element) {
+    return (this.set_parent_class(element, "has-success"))
+  },
+  set_error: function(element) {
+    return (this.set_parent_class(element, "has-error"))
+  },
+  set_warning: function(element) {
+    return (this.set_parent_class(element, "has-warning"))
+  },
+  rm_parent_class: function(element, cls) {
+    var parent ;
+
+    if ((parent = element.parent()) == null) {
+      return false ;
+    }
+    return this.rm_class(parent, cls) ;
+  },
+  set_parent_class: function(element, cls) {
+    var parent ;
+
+    if ((parent = element.parent()) == null) {
+      return false ;
+    }
+    return this.set_class(parent, cls) ;
+  },
+  rm_class: function(element, cls) {
+    if (element.hasClass(cls)) {
+      element.removeClass(cls) ;
+      return true ;
+    }
+    return false ;
+  },
+  set_class: function(element, cls) {
+    if (element.hasClass(cls)) {
+      return false ;
+    }
+    element.addClass(cls) ;
+    return true ;
+  },
+  is_success: function(element) {
+    return (this.parent_has_class(element, "has-success"))
+  },
+  is_warning: function(element) {
+    return (this.parent_has_class(element, "has-warning"))
+  },
+  is_error: function(element) {
+    return (this.parent_has_class(element, "has-error"))
+  },
+  is_optional: function(element) {
+    return (element.hasClass("is-optional"))
+  },
+  is_mandatory: function(element) {
+    return (element.hasClass("is-mandatory"))
+  },
+  parent_has_class: function(element, cls) {
+    var parent ;
+
+    if ((parent = element.parent()) == null) {
+      return false ;
+    }
+    return (parent.hasClass(cls)) ;
+  },
+
+  add1spectrum_change_handler: function(element) {
+    var self = this ;
+    var idElem ;
+    var valElem ;
+    var isSuccess ;
+    var isWarning ;
+    var isError ;
+    var isOptional ;
+    var isMandatory ;
+
+    element = $(element) ;
+    idElem = element.attr("id") ;
+    valElem = element.val();
+    console.log(`Change handler called for [${idElem}]=${valElem}`) ;
+    if (idElem.split("-").slice(0, -1).join("-") == "add1spectrum-peaksMS-msPrecursorIon") {
+      var index = idElem.split("-")[3] - 1 ;
+      if (all_contexts[index] !== null && all_contexts[index] !== undefined) {
+        all_contexts[index].sync_precursor_ion() ;
+        if (all_contexts[index].hot_MS_Peaks != null) {
+          all_contexts[index].hot_MS_Peaks.render()
+        }
+      }
+    }
+    isSuccess = self.is_success(element);
+    isWarning = self.is_warning(element);
+    isError = self.is_error(element);
+    isOptional = self.is_optional(element);
+    isMandatory = self.is_mandatory(element);
+
+    switch(idElem) {
+    case "add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}":
+      if (valElem == "compound-ref") {
+        $("#add1spectrum-sample-type-compound-ref-{{ TAB_INDEX_PLACEHOLDER }}").show();
+        $("#add1spectrum-sample-type-compound-mix-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-sample-type-rcc-added-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+      } else if (valElem == "compound-mix") {
+        $("#add1spectrum-sample-type-compound-mix-{{ TAB_INDEX_PLACEHOLDER }}").show();
+        $("#add1spectrum-sample-type-compound-ref-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-sample-type-rcc-added-{{ TAB_INDEX_PLACEHOLDER }}").show();
+        self.handsontableRefChemCpdAdded(null);
+      }
+      break;
+    case "add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}":
+      self.resetElemColor("add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}");
+      if (valElem == "" || valElem == null || valElem != "other" ) {
+        self.disableElem("add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}");
+      } else {
+        self.enableElem("add1spectrum-chromatoLC-colConstructorOther-{{ TAB_INDEX_PLACEHOLDER }}");
+      }
+      break;
+    case "add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}":
+      self.fulfillLCdata(valElem);
+      break;
+    case "add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}":
+      if ($("#add1spectrum-analyzserMS-ionizationMethod-pos-{{ TAB_INDEX_PLACEHOLDER }}").val() != null) {
+        $($("#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }} option")[1]).attr("disabled", false);
+      }
+      break;
+    case "add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}":
+      if ($("#add1spectrum-analyzserMS-ionizationMethod-neg-{{ TAB_INDEX_PLACEHOLDER }}").val() != null) {
+        $($("#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }} option")[2]).attr("disabled", false);
+      }
+      break;
+    }
+    if ((isMandatory || isOptional) && (valElem == "" || valElem == null)) {
+      if (isSuccess) {
+        self.rm_success(element) ;
+      } else if (isWarning) {
+        self.rm_warning(element) ;
+      } else if (isError) {
+        self.rm_error(element) ;
+      }
+      if (isMandatory) {
+        self.set_error(element) ;
+      } else {
+        self.set_warning(element) ;
+      }
+    }
+    if (isMandatory && (valElem != "" && valElem != null)) {
+      if (isError) {
+        self.rm_error(element) ;
+      }
+      self.set_success(element) ;
+    } else if (isOptional && valElem != "") {
+      if (isWarning) {
+        self.rm_warning(element) ;
+      }
+      self.set_success(element) ;
+    }
+    if (element.parent().children("input").size() == 2) {
+      if (isMandatory) {
+        if (isSuccess) {
+          self.rm_success(element) ;
+        } else if (isWarning) {
+          self.rm_warning(element) ;
+        } else if (isError) {
+          self.rm_error(element) ;
+        }
+        if (element.parent().children("input").toArray().some(
+          (el) => $(el).val() === null || $(el).val() === ""
+        )) {
+          self.set_error(element) ;
+        } else {
+          self.set_success(element) ;
+        }
+      } else if (isOptional) {
+        isSuccess = self.is_success(element);
+        isWarning = self.is_warning(element);
+        isError = self.is_error(element);
+        if (isSuccess) {
+          self.rm_success(element)
+        } else if (isWarning) {
+          self.rm_warning(element) ;
+        } else if (isError) {
+          self.rm_error(element) ;
+        }
+        if (element.parent().children("input").toArray().some(
+          (el) => ($(el).val() == null || $(el).val() == "")
+        )) {
+          self.set_warning(element) ;
+        } else {
+          self.set_success(element) ;
+        }
+      }
+    }
+    if (element.hasClass("one-or-more")) {
+      // get parent class
+      isSuccess = self.is_success(element);
+      isWarning = self.is_warning(element);
+      isError = self.is_error(element);
+      // reset class
+      if (isSuccess) {
+        self.rm_success(element) ;
+      } else if (isWarning) {
+        self.rm_warning(element) ;
+      } else if (isError) {
+        self.rm_error(element) ;
+      }
+      isTmpSuccess = false;
+      $.each(element.parent().children("input"), function(id, child){
+        if ($(child).val() != null && $(child).val() != "") {
+          isTmpSuccess = true;
+        }
+      });
+      $.each(element.parent().children("select"), function(id, child){
+        if ($(child).val() != null && $(child).val() != "") {
+          isTmpSuccess = true;
+        }
+      });
+      // end parkour
+      element.parent().addClass(
+        isTmpSuccess ? "has-success" : "has-error"
+      );
+    }
+    // CHECK IF OK STEP 2
+    if (element.hasClass("add1spectrum-sampleForm")) {
+      var isBtnStep2OK = true;
+      $.each($(self.prefix + ".add1spectrum-sampleForm"), (id, elem) => {
+        if (self.is_error($(elem)) && $(elem).is(":visible")) {
+          isBtnStep2OK = false;
+        }
+      });
+      if (isBtnStep2OK) {
+        self.rm_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.set_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+      } else {
+        self.set_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.rm_class($("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+      }
+    }
+    // CHECK IF OK STEP 3 - LC
+    if (
+      element.hasClass("add1spectrum-chromatoLCForm")
+      && $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
+    ) {
+      var isBtnStep3OK = true;
+      $.each($(self.prefix+".add1spectrum-chromatoLCForm"), (id, elem) => {
+        if (self.is_error($(elem)) && $(elem).is(":visible"))
+          isBtnStep3OK = false;
+      });
+      if (isBtnStep3OK) {
+        self.rm_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.set_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+      } else {
+        self.set_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.rm_class($("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+      }
+    }
+    // TODO CHECK IF OK STEP 3 - GC
+    // CHECK IF OK STEP 4 - MS ANALYZER
+    if (
+      element.hasClass("add1spectrum-analyzerMSForm")
+      && $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
+    ) {
+      var isBtnStep4OK = true;
+      $.each($(self.prefix+".add1spectrum-analyzerMSForm"), (id, elem) => {
+        if (self.is_error($(elem)) && $(elem).is(":visible"))
+          isBtnStep4OK = false;
+      });
+      if (isBtnStep4OK) {
+        self.rm_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.set_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+      } else {
+        self.set_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.rm_class($("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+      }
+    }
+    // CHECK IF OK STEP 5 - PEAKS
+    if (
+      element.hasClass("add1spectrum-peaksMSForm-peaklist")
+      && $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
+    ) {
+      var isBtnStep5OK = true;
+      $.each($(self.prefix+".add1spectrum-peaksMSForm-peaklist"), (id, elem) => {
+        if (self.is_error($(elem)) && $(elem).is(":visible"))
+          isBtnStep5OK = false;
+      });
+      if (isBtnStep5OK && (self.is_ms() || self.a_ion_parent_is_selected())) {
+        self.rm_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.set_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+      } else {
+        self.set_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+        self.rm_class($("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+        $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+      }
+    }
+    // CHECK IF OK STEP 6 - OTHER DATA
+    if (
+      element.hasClass("add1spectrum-otherForm")
+      && $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").is(":visible")
+    ) {
+      self.checkIfEnableSubmit() ;
+    }
+  },
+
+  a_ion_parent_is_selected: function() {
+    return (this.get_selected_parent_ion_mz() !== null) ;
+  },
+
+  get_selected_parent_ion_index: function() {
+    var curent_mz = this.get_selected_parent_ion_mz() ;
+    if (curent_mz === null) {
+      return null;
+    }
+    if (this.hot_MS_Peaks == undefined) {
+      return null ;
+    }
+    var data = this.hot_MS_Peaks.getData() ;
+    for (var i = 0 ; i < data.length ; i += 1) {
+      if (Math.abs(data[i][0] - curent_mz) < 0.0001) {
+        return i ;
+      }
+    }
+    return null ;
+  },
+
+  get_selected_parent_ion_mz: function() {
+    return $(
+      "#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}"
+    ).val() || null ;
+  },
+
+  auto_set_spec_type: function() {
+    console.log("auto_set_spec_type...") ;
+    var self = this ;
+    var id = `#set_${self.DEFAULT_DATA["spectrum_type"]}_spectrum_button` ;
+    var element = $(self.prefix + id) ;
+    if (element.length) {
+      element.click() ;
+      console.log(`auto_set_spec_type to ${self.DEFAULT_DATA["spectrum_type"]} ok.`)
+    } else {
+      console.log(element)
+      console.log("Failed!")
+    }
+    if (self.DEFAULT_DATA["sample_type"]) {
+      self.auto_set_sample_type(self) ;
+    }
+  },
+
+  auto_set_sample_type: function() {
+    console.log("auto_set_sample_type...") ;
+    var self = this ;
+    var id = "#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}" ;
+    var element = $(id) ;
+    if (element.length) {
+      element.val(self.DEFAULT_DATA["sample_type"]).change() ;
+      console.log(`auto_set_sample_type to ${self.DEFAULT_DATA["sample_type"]} ok.`) ;
+      if (self.DEFAULT_DATA["sample_type"] == "compound-ref") {
+        $("#add1spectrum-sample-mixSolvent-{{ TAB_INDEX_PLACEHOLDER }}").val(
+          "H2O/ethanol (75/25)"
+        ).change() ;
+      }
+    } else {
+      console.log(element)
+      console.log("Failed!")
+    }
+    if (self.DEFAULT_DATA["inchikey"]) {
+      setTimeout(() => self.auto_set_inchikey(self), 1000) ;
+    }
+  },
+
+  auto_set_inchikey: function() {
+    console.log("auto_set_inchikey...") ;
+    var self = this ;
+    var id ;
+    var element ;
+    self.inchikey = self.DEFAULT_DATA["inchikey"] ;
+    if (self.is_ref()) {
+      id = "#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}:text" ;
+      element = $(id) ;
+      if (element.length) {
+        console.log(`auto_set_inchikey to ${self.inchikey} ok.`)
+        element.val(self.inchikey).change() ;
+        console.log(`Inchikey set!`) ;
+      } else {
+        console.log(element)
+        console.log("Failed!")
+      }
+    } else {
+      for (var index = 0 ; index < all_contexts.length ; index += 1) {
+        if (all_contexts[index] === null || all_contexts[index] === undefined) {
+          continue;
+        }
+        var inchikey = all_contexts[index].DEFAULT_DATA["inchikey"] ;
+        id = `#container_RCC_ADDED-1 tbody:nth(0) tr:nth(${index}) td:nth(1)` ;
+        element = $(id) ;
+        if (element.length) {
+          console.log(`auto_set_inchikey to ${inchikey} ok.`)
+          self.hot_RCC_ADDED.setDataAtCell(index, 1, inchikey) ;
+          element.innerHTML = inchikey ;
+          element.change() ;
+          console.log(element) ;
+          console.log(`Inchikey set!`) ;
+        } else {
+          console.log(element)
+          console.log("Failed!")
+        }
+      }
+      console.log(self.hot_RCC_ADDED)
+      self.hot_RCC_ADDED.render() ;
+    }
+    $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").click() ;
+    if (self.DEFAULT_DATA["method"]) {
+      setTimeout(() => self.auto_set_method(self), 1000) ;
+    }
+  },
+
+  auto_set_method: function() {
+    console.log("auto_set_method...") ;
+    var self = this ;
+    var id = "#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}" ;
+    var element = $(id) ;
+    element.length && element.val(self.DEFAULT_DATA["method"]).change() ;
+    $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").click() ;
+    setTimeout(() => {
+      (() => {
+        $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").click() ;
+        console.log(`auto_set_method to ${self.DEFAULT_DATA["method"]} ok.`)
+        if (self.DEFAULT_DATA["scan_type"]) {
+
+          // The scan type needs to be skipped, as it is already defined
+          // at build-time
+          // The code is kept for future modifications of this behavior
+          setTimeout(() => self.auto_set_scan_type(self, skip = true), 1000) ;
+        }
+      })(self)
+    }, 1000) ;
+  },
+
+  auto_set_scan_type: function(skip = false) {
+    var self = this ;
+    if (!skip) {
+      console.log("auto_set_scan_type...") ;
+      var id = "#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}" ;
+      var element = $(id) ;
+      if (element.length) {
+        element.val(self.DEFAULT_DATA["scan_type"]).change() ;
+        console.log(`auto_set_scan_type to ${self.DEFAULT_DATA["scan_type"]} ok.`)
+      } else {
+        console.log("Failed!")
+      }
+    }
+    if (self.DEFAULT_DATA["polarity"]) {
+      self.auto_set_polarity(self) ;
+    }
+  },
+
+  auto_set_polarity: function() {
+    console.log("auto_set_polarity...") ;
+    var self = this ;
+    var id = "#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }}" ;
+    var element = $(id) ;
+    if (element.length) {
+      element.val(self.DEFAULT_DATA["polarity"]).change() ;
+      console.log(`auto_set_polarity to ${self.DEFAULT_DATA["polarity"]} ok.`)
+    } else {
+      console.log("Failed!")
+    }
+    if (self.DEFAULT_DATA["resolution"]) {
+      self.auto_set_resolution(self) ;
+    }
+  },
+
+  auto_set_resolution: function() {
+    console.log("auto_set_resolution...") ;
+    var self = this ;
+    var id = "#add1spectrum-peaksMS-resolution-{{ TAB_INDEX_PLACEHOLDER }}" ;
+    var element = $(id) ;
+    if (element.length) {
+      element.val(self.DEFAULT_DATA["resolution"]).change() ;
+      console.log(`auto_set_resolution to ${self.DEFAULT_DATA["resolution"]} ok.`)
+    } else {
+      console.log("Failed!")
+    }
+    if (self.DEFAULT_DATA["next"] || true) {
+      setTimeout(() => self.finish_initialized(self), 1000) ;
+    }
+  },
+
+  finish_initialized: function() {
+    var self = this ;
+    if (ctx() === self) {
+      self.initialized = true ;
+    }
+  },
+
+  //USED IN HTML
+  updateLCMSspectraViewer: function() {
+    var self = this ;
+    var tab_no ;
+    console.log(`Updating spectral view for tab {{ TAB_INDEX_PLACEHOLDER }}`) ;
+    // reset current viewer
+    $("#containter-lcms-spectrum-preview-{{ TAB_INDEX_PLACEHOLDER }}").empty();
+    // reset data.
+
+    if (self.is_mix()) {
+      tab_no = 1 ;
+    } else {
+      tab_no = {{ TAB_INDEX_PLACEHOLDER }} ;
+    }
+    var range_from = $(`#add1spectrum-peaksMS-rangeFrom-${tab_no}`) ;
+    if ((spectrumMinPPM = Number(range_from.val())) == "") {
+      spectrumMinPPM = 10000;
+    }
+    var range_to = $(`#add1spectrum-peaksMS-rangeTo-${tab_no}`) ;
+    if ((spectrumMaxPPM = Number(range_to.val())) == "") {
+      spectrumMaxPPM = 0;
+    }
+    maxGraph = 0;
+    var localData = [];
+    var localDataAnnot = [];
+    // gather new data
+    // TODO switch tab in function of technic
+    $.each(self.hot_MS_Peaks.getData(), function() {
+      if(this[0] != undefined && this[0] != "") {
+        var x = (Number(this[0]));
+        var y = Number(this[2]);
+        var a = this[6];
+        localData.push([(x-0.000001),-150]);
+        localData.push([(x+0.000001),-150]);
+        localData.push([x,y]);
+        localDataAnnot[x] = a;
+        if (x < spectrumMinPPM) {
+          spectrumMinPPM = x;
+        }
+        if (x > spectrumMaxPPM) {
+          spectrumMaxPPM = x;
+        }
+        if (y > maxGraph) {
+          maxGraph = y;
+        }
+      }
+    });
+    
+    // build new one
+    spectrumMinPPM = spectrumMinPPM - (0.1 * spectrumMinPPM);
+    spectrumMaxPPM = spectrumMaxPPM + (0.1 * spectrumMaxPPM);
+    maxGraph = maxGraph + (0.1 * maxGraph);
+    localData.sort();
+    console.log(localData)
+    // build graph
+    $("#containter-lcms-spectrum-preview-{{ TAB_INDEX_PLACEHOLDER }}").highcharts({
+      chart: {
+        zoomType: "x",
+        spacingRight: 10,
+        spacingLeft: 10,
+        type: "scatter"
+      },
+      title: {
+        text: "Spectrum Preview",
+        useHTML: true
+      },
+      subtitle: {
+        text: (
+          document.ontouchstart === undefined
+          ? "Select area"
+          : "Pinch the chart to zoom in"
+        )
+      },
+      xAxis: {
+        type: "number",
+        title: {text: "m/z"},
+        min: spectrumMinPPM,
+        max: spectrumMaxPPM,
+        labels: {
+          formatter: function() {
+            return (Math.abs(this.value) + "");
+          }
+        }
+      },
+      yAxis: {
+        title: {text: "Relative Intensity (%)"},
+        min: 0,
+        max: maxGraph
+      },
+      tooltip: {
+        crosshairs: true,
+        formatter: function() {
+          var compo = "";
+          return (
+            "" + this.series.name
+            + " 
+            
+              × 
+               
+            
+                unable to load pre-filled data!
+          
+        `);
+      }
+    });
+  },
+
+  //USED HERE
+  resetFromColors: function() {
+
+    var self = this ;
+    $.each($(self.prefix+".add1spectrum"), function(id, elem) {
+      element = $(elem)
+      self.rm_success(element) ;
+      self.rm_warning(element) ;
+      self.rm_error(element) ;
+      if ($(elem).hasClass("is-mandatory") &&  ($(elem).val() == "" || $(elem).val() == null)) {
+        self.set_error($(elem)) ;
+      }
+      if ($(elem).hasClass("is-optional") &&  ($(elem).val() == "" || $(elem).val() == null)) {
+        self.set_warning($(elem)) ;
+      }
+      if ($(elem).val() != "" && $(elem).val() != null) {
+        self.set_success($(elem)) ;
+      }
+    });
+    $.each($(self.prefix+"button.switchStep"), function(id, elem) {
+      if (!$(this).hasClass("btn-disabled")) {
+        $(this).addClass("btn-disabled");
+      }
+      if ($(this).hasClass("btn-primary")) {
+        $(this).removeClass("btn-primary");
+      }
+      $(this).prop("disabled", true);
+    });
+
+    // peak list: no data to check
+    $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("btn-disabled");
+    $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").addClass("btn-primary");
+    $("#btnSwitch-gotoStep5-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+
+    $("#add1spectrum-other-author-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+    $("#add1spectrum-other-validator-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+    $("#add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+    $("#add1spectrum-other-owner-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+    $("#add1spectrum-other-fileName-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+    $("#add1spectrum-other-fileSize-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+  },
+
+  //USED IN HTML
+  switchToStep: function(step) {
+
+    var self = this ;
+    switch(step) {
+      case 2:
+        // hide after step 2 / alt step 2
+        $("#add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        if ($("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
+          $("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+        }
+        if (self.is_ms()) {
+          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").empty();
+          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            'choose in list… '
+          );
+          $.getJSON("{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-methods.json", function(data) {
+            // load data from json
+            $.each(data.methods,function() {
+              if (this.name !== undefined) {
+                if (this.value !== undefined) {
+                  $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+                    `${this.name} `
+                  );
+                } else {
+                  $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+                    `${this.name} `
+                  );
+                }
+              }
+            });
+          });
+        } else if (self.is_ms2()) {
+          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").empty();
+          $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+            'choose in list… '
+          );
+          $.getJSON(
+            "{{ PF_URL_PLACEHOLDER }}/webapp/resources/json/list-lc-msms-methods.json",
+            function(data) {
+              // load data from json
+              $.each(data.methods, function() {
+                if (this.name !== undefined) {
+                  if (this.value !== undefined) {
+                    $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+                      `${this.name} `
+                    );
+                  } else {
+                    $("#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}").append(
+                      `${this.name} `
+                    );
+                  }
+                }
+              });
+            }
+          );
+        }
+        // check panel to show
+        if (self.isLC) {
+          $("#add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}").show();
+          $("#linkActivateStep2-lc-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
+          var sign = $("#step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}") ;
+          self.rm_class(sign, "fa-check-circle") && self.set_class(sign, "fa-question-circle") ;
+          if (!self.isSeparationFlowRateInit) {
+            self.handsontableSeparationFlowRate(null);
+            self.isSeparationFlowRateInit = true;
+          }
+        } else if (self.isGC) {
+          $("#add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}").show();
+          $("#linkActivateStep2-gc-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
+          var sign = $("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}") ;
+          sign.removeClass("fa-check-circle").addClass("fa-question-circle");
+          if ($("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
+          }
+        } else if (self.isIC) {
+          $("#add1spectrum-chromatographyData-IC-{{ TAB_INDEX_PLACEHOLDER }}").show();
+          $("#linkActivateStep2-ic-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
+          if ($("#step2-ic-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
+            $("#step2-ic-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
+          }
+        }
+        break;
+      case 3:
+        // hide after step 3 / alt step 3
+        $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        // step 2 ok 
+        if ($("#step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
+          $("#step2-lc-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+        }
+        if ($("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
+          $("#step2-gc-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+        }
+        // check panel to show
+        if (self.is_ms() || self.is_ms2()) {
+          $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").show();
+          $("#linkActivateStep3-ms-{{ TAB_INDEX_PLACEHOLDER }}").trigger('click');
+          // debug display
+          [
+            "add1spectrum-analyzserMS-sprayGazFlow-pos",
+            "add1spectrum-analyzserMS-sprayGazFlow-neg",
+            "add1spectrum-analyzserMS-vaporizerGazFlow-pos",
+            "add1spectrum-analyzserMS-vaporizerGazFlow-neg",
+            "add1spectrum-analyzserMS-vaporizerTemperature-pos",
+            "add1spectrum-analyzserMS-vaporizerTemperature-neg",
+            "add1spectrum-analyzserMS-sourceGazFlow-pos",
+            "add1spectrum-analyzserMS-sourceGazFlow-neg",
+            "add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-pos",
+            "add1spectrum-analyzserMS-ionTransferTubeTemperatureOrTransferCapillaryTemperature-neg",
+            "add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-pos",
+            "add1spectrum-analyzserMS-highVoltageOrCoronaVoltage-neg"
+          ].forEach((id) => {
+            var element = $(`#id-{{ TAB_INDEX_PLACEHOLDER }}`)
+            element.height(element.parent().children("span").height())
+          })
+          if ($("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
+            $("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
+          }
+          // MSMS only
+          $(self.prefix+".enable-if-ms").attr("disabled", !self.is_ms());
+          $(self.prefix+".enable-if-msms").attr("disabled", !self.is_ms2());
+        }
+        // avoid display bug
+        $("#add1spectrum-analyzer-ms-instrument-{{ TAB_INDEX_PLACEHOLDER }}").change();
+        break;
+      case 4:
+        // hide after step 4 / alt step 4
+        $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        // step 3 ok 
+        if ($("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
+          $("#step3-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+        }
+        if (self.is_ms() || self.is_ms2()) {
+          $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").show();
+          $("#linkActivateStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
+          if ($("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
+            $("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
+          }
+          // LC MS
+          if (!self.isMSpeaksInit) {
+            console.log(`self.is_mix(): ${self.is_mix()}`)
+            if (self.is_mix()) {
+              all_contexts.forEach((context, index) => {
+                if (context === null) {
+                  return;
+                }
+                context.handsontableMSpeaks(null) ;
+                context.updateLCMSspectraViewer() ;
+                context.isMSpeaksInit = true;
+                $(context.prefix+".add1spectrum-peaksMSForm-peaklist-reset").val("").change();
+              })
+            } else {
+              self.handsontableMSpeaks(null);
+              self.isMSpeaksInit = true;
+              $(self.prefix+".add1spectrum-peaksMSForm-peaklist-reset").val("").change();
+            }
+          }
+        }
+        // show ms tab
+        setTimeout(() => $("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click"), 250);
+        $("#add1spectrum-peaksMS-msLevel-{{ TAB_INDEX_PLACEHOLDER }}").change();
+        break;
+      case 5:
+        // hide after step 5 / alt step 5
+        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        // step 4 ok 
+        if ($("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
+          $("#step4-ms-sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+        }
+        if ($("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
+          $("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
+        }
+        $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").show();
+        $("#linkActivateStep5-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
+        // reset step 6 button
+        self.checkIfEnableSubmit();
+        $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        $("#import1SpectrumResults-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+        break;
+      case 6:
+        self.postOneSpectrumFrom();
+        self.cptPeakListTab++;
+        break;
+      case 7:
+      self.dumpOneSpectrumFrom();
+      break;
+    }
+  },
+
+  //USED HERE
+  resetElemColor: function(idElem) {
+
+    var self = this ;
+    if ($(`#${idElem}`).parent().hasClass("has-success")) {
+      $(`#${idElem}`).parent().removeClass("has-success") ;
+    }
+    if ($(`#${idElem}`).parent().hasClass("has-warning")) {
+      $(`#${idElem}`).parent().removeClass("has-warning") ;
+    }
+    if ($(`#${idElem}`).parent().hasClass("has-error")) {
+      $(`#${idElem}`).parent().removeClass("has-error") ;
+    }
+  },
+
+  //USED HERE
+  disableElem: function(idElem) {
+
+    var self = this ;
+    $(`#${idElem}`).prop("disabled", true) ;
+    $(`#${idElem}`).val("") ;
+    if ($(`#${idElem}`).hasClass("is-mandatory")) {
+      $(`#${idElem}`).removeClass("is-mandatory") ;
+    }
+  },
+
+  //USED HERE
+  enableElem: function(idElem) {
+
+    var self = this ;
+    $(`#${idElem}`).prop("disabled", false) ;
+    $(`#${idElem}`).parent().addClass("has-error") ;
+    if (!$(`#${idElem}`).hasClass("is-mandatory")) {
+      $(`#${idElem}`).addClass("is-mandatory") ;
+    }
+  },
+
+  //USED HERE
+  checkIfEnableSubmit: function() {
+
+    var self = this ;
+    var isBtnStep6OK = true;
+    $.each($(self.prefix+".add1spectrum-otherForm"), (id, elem) => {
+      if (self.is_error($(elem)) && $(elem).is(":visible")) {
+        isBtnStep6OK = false;
+      }
+    });
+    if (isBtnStep6OK) {
+      self.rm_class($("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+      self.set_class($("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+      $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+      self.rm_class($("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-disabled") ;
+      self.set_class($("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}"), "btn-primary") ;
+      $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", false);
+    } else {
+      if (!$("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-disabled")) {
+        $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").addClass("btn-disabled");
+      }
+      if ($("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-primary")) {
+        $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("btn-primary");
+      }
+      $("#btnSwitch-gotoStep6-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+      if (!$("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-disabled")) {
+        $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").addClass("btn-disabled");
+      }
+      if ($("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("btn-primary")) {
+        $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("btn-primary");
+      }
+      $("#btnSwitch-gotoStep7-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+    }
+  },
+
+  //USED IN HTML
+  addOneSpectrum: function(type) {
+
+    var self = this ;
+     // unlock
+    $(self.prefix+".add1spectrum-sampleForm").prop("disabled", false);
+    $(self.prefix+".add1spectrum-chromatoLCForm").prop("disabled", false);
+    $(self.prefix+".add1spectrum-analyzerMSForm").prop("disabled", false);
+    $(self.prefix+".add1spectrum-otherForm").prop("disabled", false);
+    $("#add1spectrum-chromatoLC-colConstructor-{{ TAB_INDEX_PLACEHOLDER }}").change();
+    // reset
+    self.isLC = false;
+    self.isGC = false;
+    self.isIC = false;
+    $("#alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    // hide in all steps
+    $(self.prefix+".opt-ms").hide();
+    $(self.prefix+".opt-msms").hide();
+    // hide step 2
+    $("#add1spectrum-chromatographyData-LC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+    $("#add1spectrum-chromatographyData-GC-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+    // hide step 3
+    $("#add1spectrum-analyserData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+    $(self.prefix+".add1spectrum-ionTrap").hide();
+    // hide step 4
+    $("#add1spectrum-peaksData-MS-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+    // hide step 5
+    $("#add1spectrum-otherData-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+    // reset field step 1
+    $("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").val("");
+    $(self.prefix+".add1spectrum-sample-type-panel").hide();
+    $(self.prefix+".add1spectrum-sampleForm").val("");
+    $("#sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    // reset field step 2
+    $(self.prefix+".add1spectrum-chromatoLCForm").val("");
+    // reset field step 3
+    $(self.prefix+".add1spectrum-analyzerMSForm").val("");
+    // reset field step 4
+    // reset peak lists / all tabs
+    self.isSeparationFlowRateInit = false;
+    self.isMSpeaksInit = false;
+    $(self.prefix+".handsontable").html("");
+    // reset field step 5 => NO!
+    // set icon
+    $("#step0sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+    if ($("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-check-circle")) {
+      $("#step1sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-check-circle").addClass("fa-question-circle");
+    }
+    // collapse step 0 / uncollaspe step 1
+    $("#linkActivateStep1-{{ TAB_INDEX_PLACEHOLDER }}").trigger("click");
+    // show step 1 content
+    $("#add1spectrum-sampleData-{{ TAB_INDEX_PLACEHOLDER }}").show();
+    switch(type) {
+    case 1:
+      // TODO GC-MS stuff
+      self.isGC = true;
+      break;
+    case 2:
+      // LC-MS stuff
+      self.isLC = true;
+      $(self.prefix+".opt-ms").show();
+      break;
+    case 5:
+      // LC-MSMS stuff
+      self.isLC = true;
+      $(self.prefix+".opt-ms").show();
+      $(self.prefix+".opt-msms").show();
+      break;
+    case 6:
+      // IC-MS stuff
+      self.isIC = true;
+      $(self.prefix+".opt-ms").show();
+      break;
+    case 7:
+      // IC-MSMS stuff
+      self.isIC = true;
+      $(self.prefix+".opt-ms").show();
+      $(self.prefix+".opt-msms").show();
+      break;
+    }
+    self.resetFromColors();
+    // reset json obj to submit form
+    self.jsonSpectrumType = null;
+    self.isJsonSpectrumTypeComplete = false;
+    self.jsonSample = null;
+    self.isJsonSampleComplete = false;
+    self.isJsonRCCaddedComplete = false;
+    self.jsonChromato = null;
+    self.isJsonChromatoComplete = false;
+    self.jsonAnalyzer = null;
+    self.isJsonAnalyzerComplete = false;
+    self.jsonPeaksList = [];
+    self.isJsonPeaksListComplete = false;
+    self.jsonOtherMetadata = null;
+    self.isJsonOtherMetadataComplete = false;
+    
+    self.cptPeakListTab = 0;
+    self.jsonAnalyzerAcquisition = [];
+    self.idMetadataMap = {}
+    self.listOfViewableSpectra = [];
+    
+    // spec MS
+    self.jsonMolIonization = null;
+    
+    // spec MSMS
+    self.jsonMolIonBeam = null;
+    
+    // try load cpd
+    if (self.inchikey !== null) {
+      self.loadJSCompound(self.inchikey);
+    }
+  },
+
+  //USED HERE
+  loadJSCompound: function(inchikey) {
+    var self = this ;
+    
+    $("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").val("compound-ref");
+    $("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").change();
+    $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val(inchikey);
+    $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").change();
+    if (inchidata[inchikey] !== null) {
+      return (set_inchi_data(inchidata[inchikey]), {{ TAB_INDEX_PLACEHOLDER }}) ;
+    }
+    $.ajax({
+      type: "get",
+      url: "{{ PF_URL_PLACEHOLDER }}/webapp/get-cpd-data",
+      data: "inchikey="+inchikey,
+      dataType: "json",
+      success: function(data) {
+        if (data.success) {
+          set_inchi_data(data) ;
+        }
+      },
+      error : function(data) {
+      }
+    }).always(function() {
+    });
+  },
+
+  //USED HERE
+  handsontableSeparationFlowRate: function(data) {
+    var self = this ;
+
+    // reset
+    $("#container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    // init
+    var data_LC_SFG;
+    if (data==null) {
+      data_LC_SFG = [
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+       [ "", "", "" ],
+     ];
+    } else {
+      data_LC_SFG = data;
+    }
+    
+    var container_LC_SFG = document.getElementById("container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}");
+    self.hot_LC_SFG = new Handsontable(container_LC_SFG, {
+      data : data_LC_SFG,
+      minSpareRows : 1,
+      colHeaders : true,
+      colHeaders: ["time (min)", "solv. A (%)", "solv. B (%)"],
+      contextMenu : false
+    });
+    Handsontable.Dom.addEvent(document.body, "click", function(e) {
+      var element = e.target || e.srcElement;
+      if (element.nodeName == "BUTTON"&& element.name == "dump") {
+        var name = element.getAttribute("data-dump");
+        var instance = element.getAttribute("data-instance");
+        self.hot_LC_SFG = window[instance];
+        console.log("data of " + name, self.hot_LC_SFG.getData());
+      }
+    });
+    $("#container_LC_SFG table.htCore-{{ TAB_INDEX_PLACEHOLDER }}").css("width","100%");
+  },
+
+  //USED HERE
+  handsontableMSpeaks: function(data) {
+    console.log("handsontableMSpeaks")
+    console.log(data)
+    var self = this ;
+    var data_MS_Peaks ;
+    var container_MS_Peaks ;
+
+    if (data != null) {
+      data_MS_Peaks = data;
+    } else {
+      data_MS_Peaks = JSON.parse(JSON.stringify(self.DEFAULT_MS_PEAK_VALUES));
+    }
+    $("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    container_MS_Peaks = document.getElementById(
+      "container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}"
+    );
+    var colHeaders = [
+      "m/z", "absolute intensity", "relative intensity (%)", "delta (ppm)",
+      "composition", "attribution", "Validated"
+    ]
+    var columns = [
+      {type: "numeric", format: "0.0000"},
+      {type: "numeric", format: "0.00"},
+      {type: "numeric", format: "0.00"},
+      {type: "numeric", format: "0.0000"},
+      {type: "text"},
+      {type: "text"},
+      {type: "checkbox"}
+    ] ;
+    if (self.is_ms2()) {
+      colHeaders.push("Parent ion") ;
+      columns.push({type: "checkbox"}) ;
+    }
+    self.hot_MS_Peaks = new Handsontable(container_MS_Peaks, {
+      data: data_MS_Peaks,
+      minSpareRows: 1,
+      colHeaders: true,
+      colHeaders: colHeaders,
+      contextMenu: false,
+      maxRows: data_MS_Peaks.length,
+      minRows: data_MS_Peaks.length,
+      columns: columns,
+      afterChange: function(changes) {
+        if (self.lock.precursor_ion) {
+          return ;
+        }
+        self.lock.precursor_ion = true ;
+        try {
+          changes?.forEach(([row, prop, old, value]) => {
+            var data ;
+            var precursor_ion ;
+
+            var data = self.hot_MS_Peaks.getData() ;
+            if (prop !== 7 || value !== true || data === undefined) {
+              return ;
+            }
+            for (var i = 0; i < data.length ; i += 1) {
+              data[i][7] = false ;
+            }
+            data[row][7] = true ;
+            precursor_ion = $(`#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}`) ;
+            console.log(`setting preco ion to ${data[row][0]}`) ;
+            precursor_ion.val(data[row][0]) ;
+            precursor_ion.change() ;
+            self.hot_MS_Peaks.render() ;
+          })
+        } finally {
+          self.lock.precursor_ion = false ;
+        }
+      }
+    });
+    Handsontable.Dom.addEvent(document.body, "click", (e) => {
+      var element ;
+      var name ;
+      var instance ;
+
+      element = e.target || e.srcElement ;
+      if (element.nodeName == "BUTTON" && element.name == "dump") {
+        name = element.getAttribute("data-dump") ;
+        instance = element.getAttribute("data-instance") ;
+        self.hot_MS_Peaks = window[instance] ;
+        console.log("data of " + name, self.hot_MS_Peaks.getData()) ;
+      }
+    }) ;
+
+    $("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }} table.htCore").css(
+      "width","100%"
+    ) ;
+    if (self.is_ms2()) {
+      setTimeout(() => self.select_precursor_ion(), 200) ;
+    }
+  },
+
+  change_tab: function() {
+    var self = this ;
+    setTimeout(() => self.auto_select_ion_parent(), 1000) ;
+  },
+
+  auto_select_ion_parent: function() {
+    var self = this ;
+    if (!self.a_ion_parent_is_selected()) {
+      setTimeout(() => self.select_precursor_ion(), 1000) ;
+    }
+  },
+
+  select_precursor_ion: function() {
+    var self = this ;
+    var data ;
+    var precuirsor_ion ;
+
+    if (self.hot_MS_Peaks == null) {
+      return setTimeout(() => self.select_precursor_ion(), 200) ;
+    }
+    console.log("Selecting ion preco for tab {{ TAB_INDEX_PLACEHOLDER }}")
+    data = self.hot_MS_Peaks.getData() ;
+    for (var i = 0 ; i < data.length ; i += 1) {
+      if (data[i][5] === "[M+H]+" || data[i][5] === "[M+H]-" || data[i][2] == 100.0) {
+          precursor_ion = $("#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}") ;
+          precursor_ion.val(data[i][0]) ;
+          precursor_ion.change() ;
+          return ;
+      }
+    }
+  },
+
+  sync_precursor_ion: function() {
+    var self = this ;
+    var data ;
+
+    if (self.lock.precursor_ion || self.hot_MS_Peaks == undefined) {
+      return ;
+    }
+    self.lock.precursor_ion = true ;
+    console.log("Syncing precursor ion")
+    var val = $("#add1spectrum-peaksMS-msPrecursorIon-{{ TAB_INDEX_PLACEHOLDER }}").val() ;
+    var data = self.hot_MS_Peaks.getData() ;
+    for (var i = 0; i < data.length ; i += 1) {
+      if (Math.abs(data[i][0] - val) < 0.0001) {
+        for (var j = 0; j < data.length ; j += 1) {
+          data[j][7] = false ;
+        }
+        data[i][7] = true ;
+        self.hot_MS_Peaks.render() ;
+        return ;
+      }
+    }
+    self.lock.precursor_ion = false ;
+  },
+
+  // USED HERE
+  handsontableRefChemCpdAdded: function(data) {
+    var self = this ;
+    // reset
+    $("#container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    $("#sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    // init
+    var data_RCC_ADDED, colHeaderData, container_RCC_ADDED;
+
+    colHeaderData = [
+      {data: "common name", type: "text"},
+      {data: "InChIKey ", type: "text"},
+      {data: "composition", renderer: lightgrayRenderer},
+      {data: "concentration (µg/ml) ", type: "text"},
+      {data: "exact mass", renderer: lightgrayRenderer},
+      {data: "(M+H)+ or (M-H)-", renderer: lightgrayRenderer}
+    ] ;
+    
+    if (data == null) {
+      data_RCC_ADDED = [
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+        [ "", "", "","", "", "" ],
+      ];
+    } else {
+      container_RCC_ADDED = data;
+    }
+
+    container_RCC_ADDED = document.getElementById("container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}");
+    self.hot_RCC_ADDED = new Handsontable(container_RCC_ADDED, {
+      data: data_RCC_ADDED,
+      minSpareRows : 1,
+      colHeaders : true,
+      colHeaders: [
+        "common name",
+        "InChIKey ",
+        "composition",
+        "concentration (µg/ml) ",
+        "exact mass",
+        "(M+H)+ or (M-H)-"
+      ],
+      contextMenu : false,
+      columns: colHeaderData
+    });
+    function bindDumpButton_RCC_ADDED() {
+      Handsontable.Dom.addEvent(document.body, "click", (e) => {
+        var element = e.target || e.srcElement;
+        if (element.nodeName == "BUTTON"&& element.name == "dump") {
+          var name = element.getAttribute("data-dump");
+          var instance = element.getAttribute("data-instance");
+          self.hot_RCC_ADDED = window[instance];
+          console.log("data of " + name, self.hot_RCC_ADDED.getData());
+        }
+      });
+    }
+    bindDumpButton_RCC_ADDED();
+    $("#container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }} table.htCore").css("width","100%");
+    // celect cell
+    self.hot_RCC_ADDED.selectCell(0, 0);
+    // add select listener
+    self.hot_RCC_ADDED.addHook("afterSelection", (r, c) => self.hookSelection(r, c));
+  },
+
+  //USED HERE
+  hookSelection: function(r, c) {
+    var self = this ;
+    if (c == 0 || c == 1 || c == 2) 
+      self.pickChemicalCompound4Mix(r);
+  },
+
+  //USED HERE
+  postOneSpectrumFrom: function() {
+    var self = this ;
+    $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").show();
+
+    // II - form data -> json object
+    self.loadFomDataIntoJsonObjects();
+    // II.A - check if json object complete
+    var alertMsg = self.getFormErrorMessage();
+    
+    if (alertMsg != "") {
+      $("#alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}").html(alertMsg);
+      $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+      return false;
+    }
+    // all OK: lock!
+    // lock sample
+    $(self.prefix+".add1spectrum-sampleForm").prop("disabled", true);
+    // lock chromato
+    $(self.prefix+".add1spectrum-chromatoLCForm").prop("disabled", true);
+    if (!$("#container_LC_SFG-{{ TAB_INDEX_PLACEHOLDER }}").is(":empty")) {
+      self.hot_LC_SFG.updateSettings({
+        cells: function(row, col, prop) {
+          var cellProperties = {};
+          cellProperties.readOnly = true;
+          return cellProperties;
+        }
+      });
+    }
+    if (!$("#container_MS_Peaks-{{ TAB_INDEX_PLACEHOLDER }}").is(":empty")) {
+      self.hot_MS_Peaks.updateSettings({
+        cells: function(row, col, prop) {
+          var cellProperties = {};
+          cellProperties.readOnly = true;
+          return cellProperties;
+        }
+      });
+    }
+    if (!$("#container_RCC_ADDED-{{ TAB_INDEX_PLACEHOLDER }}").is(":empty")) {
+      self.hot_RCC_ADDED.updateSettings({
+        cells: function(row, col, prop) {
+          var cellProperties = {};
+          cellProperties.readOnly = true;
+          return cellProperties;
+        }
+      });
+      self.hot_RCC_ADDED.removeHook(
+        "afterSelection",
+        (r, c) => self.hookSelection(r, c)
+      );
+    }
+
+    // lock analyzer
+    $(self.prefix+".add1spectrum-analyzerMSForm").prop("disabled", true);
+    // lock other metadata field
+    $(self.prefix+".add1spectrum-otherForm").prop("disabled", true);
+    // lock switch btn
+    $("#btnSwitch-gotoStep2-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+    $("#btnSwitch-gotoStep3-lc-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+    $("#btnSwitch-gotoStep4-ms-{{ TAB_INDEX_PLACEHOLDER }}").prop("disabled", true);
+    self.postSpectrumToServer() ;
+  },
+
+  postSpectrumToServer: function(jsonData, tab_index) {
+    var self = this ;
+    var base_peakdata ;
+    var new_peakdata ;
+    var is_ms2 = self.is_ms2() ;
+
+    if (self.is_mix()) {
+      if ({{ TAB_INDEX_PLACEHOLDER }} != 1) {
+        return ;
+      }
+      jsonData = self.gatherJsonObjects() ;
+      all_mix_data = Object.assign({}, jsonData) ;
+      all_mix_data["peaklists"] = [] ;
+      base_peakdata = Object.assign({}, jsonData["peaklists"][0]) ;
+      all_contexts.forEach((context, index) => {
+        if (context === null) {
+          return;
+        }
+        new_peakdata = Object.assign({}, base_peakdata) ;
+        context.loadFomDataIntoJsonObjects()
+        if (is_ms2) {
+          new_peakdata["precursor_ion"] = context.jsonPeaksList["precursor_ion"] ;
+        }
+        new_peakdata["peaklist"] = context.jsonPeaksList["peaklist"] ;
+        all_mix_data["peaklists"].push(new_peakdata)
+      })
+    }
+    // II.B - rebuild json full object (with all metadata or just id if already in base)
+    if (jsonData == null) {
+      jsonData = self.gatherJsonObjects();
+    }
+    // II.C - add id metadata (if exist)
+    var json_array = [] ;
+    if (!tab_index) {
+      tab_index = {{ TAB_INDEX_PLACEHOLDER }} ;
+    }
+    json_array[tab_index-1] = jsonData ;
+    
+    // III - post json object
+    // III.A - success
+    self.sent_json = jsonData ;
+    console.warn(
+      "This data has been validated without going through the internal server!"
+    )
+    if ($("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-question-circle")) {
+      $("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-question-circle").addClass("fa-check-circle");
+    }
+    if ($("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").hasClass("fa-spinner")) {
+      $("#step5sign-{{ TAB_INDEX_PLACEHOLDER }}").removeClass("fa-spinner fa-spin").addClass("fa-check-circle");
+    }
+    $("#import1SpectrumLoadingBare-{{ TAB_INDEX_PLACEHOLDER }}").hide();
+    $("#alertBoxSubmitSpectrum-{{ TAB_INDEX_PLACEHOLDER }}").html(`
+      
+        
+          × 
+          
+             
+         
+        
+            Spectrum ready to be sent!
+      
+    `);
+    return true;
+  },
+
+  //USED HERE
+  loadFomDataIntoJsonObjects: function() {
+    var self = this ;
+    // I - Spectrum type
+    self.isJsonSpectrumTypeComplete = false ;
+    if (self.isGC && self.is_ms()) {
+      self.jsonSpectrumType = "gc-ms" ;
+    } else if (self.isLC && self.is_ms()) {
+      self.jsonSpectrumType = "lc-ms" ;
+    } else if (self.isLC && self.is_ms2()) {
+      self.jsonSpectrumType = "lc-msms" ;
+    } else if (self.isGC && self.is_ms()) {
+      self.jsonSpectrumType = "ic-ms" ;
+    } else if (self.isLC && self.is_ms()) {
+      self.jsonSpectrumType = "ic-msms" ;
+    }
+    if (self.jsonSpectrumType != null && self.jsonSpectrumType != "") {
+      self.isJsonSpectrumTypeComplete = true;
+    }
+    
+    // II - Sample
+    self.isJsonSampleComplete = true;
+    self.isJsonRCCaddedComplete = true;
+    self.jsonSample = {};
+
+    switch($("#add1spectrum-sample-type-{{ TAB_INDEX_PLACEHOLDER }}").val()) {
+    // II.A - chemical lib. compound
+    case "compound-ref":
+      if ($("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val() == "") {
+        return false;
+      }
+      self.jsonSample["sample_type"] = "reference-chemical-compound";
+      self.jsonSample["inchikey"] = $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      self.jsonSample["concentration"] = $("#add1spectrum-sample-concentration-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      if (self.is_ms()) {
+        self.jsonSample["solvent"] = $("#add1spectrum-sample-lcmsSolvent-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      }
+      self.isJsonSampleComplete = true;
+      break;
+      // II.B - chemical lib. compound mix
+    case "compound-mix": 
+      // solvent
+      self.jsonSample["solvent"] = $("#add1spectrum-sample-mixSolvent-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      // cpd added
+      self.jsonSample.inchikeys_list = self.getRCCADDED();
+      self.jsonSample.concentrations_list = self.getRCCADDEDConcentration();
+      if (self.jsonSample.inchikeys_list.length == 0 && !self.is_other_in_mix()) {
+        self.isJsonRCCaddedComplete = false;
+        console.log(`isJsonRCCaddedComplete: false`)
+        return false;
+      }
+      self.isJsonSampleComplete = true;
+      break;
+    default:
+      if (!self.is_other_in_mix()) {
+        return false;
+      } 
+    }
+
+    // III - Chromato
+    self.isJsonChromatoComplete = true;
+    self.jsonChromato = {};
+    
+    // III.A - no chromato
+    // nope?
+
+    // III.B - GC  
+    if (self.isGC) {
+      self.isJsonChromatoComplete = false;
+      // TODO
+    }
+
+    // III.C - LC
+    if (self.isLC) {
+      self.isJsonChromatoComplete = true;
+      self.jsonChromato = {};
+      // check error
+      $.each($(self.prefix+".add1spectrum-chromatoLCForm").parent(), function() {
+        if ($(this).hasClass("has-error"))
+          self.isJsonChromatoComplete = false;
+      });
+      if (
+        !self.isJsonChromatoComplete
+        && !self.is_other_in_mix()
+      ) {
+        console.log(`isJsonChromatoComplete: false`)
+        return false;
+      }
+      var id = `#add1spectrum-chromatoLC-method-{{ TAB_INDEX_PLACEHOLDER }}` ;
+      self.jsonChromato["method"] = $(`${id} option:selected`).text();
+      [
+        ["column_constructor", "colConstructor"],
+        ["column_constructor_other", "colConstructorOther"],
+        ["column_name", "colName"],
+        ["column_length", "colLength"],
+        ["column_diameter", "colDiameter"],
+        ["particule_size", "colParticuleSize"],
+        ["column_temperature", "colTemperature"],
+        ["mode", "LCMode"],
+        ["separation_flow_rate", "separationFlowRate"],
+        ["solvent_a", "separationSolvA"],
+        ["solvent_a_ph", "separationSolvApH"],
+        ["solvent_b", "separationSolvB"],
+        ["solvent_b_ph", "separationSolvBApH"]
+      ].forEach((field) => {
+        id = `#add1spectrum-chromatoLC-${field[1]}-{{ TAB_INDEX_PLACEHOLDER }}` ;
+        self.jsonChromato[field[0]] = $(id).val();
+      })
+      // fulfill json object
+      
+      jsonSFG = [];
+      var formatData = {
+        time: [],
+        solvent_a_percent: [],
+        solvent_b_percent: []
+      };
+      var uniq_times = [] ;
+      $.each(self.hot_LC_SFG.getData(), function() {
+        var time = this[0] ;
+        if (time != "" && time !== null) {
+          if (
+            !isNaN(time)
+            && !isNaN(this[1])
+            && !isNaN(this[2])
+            && ! (time in uniq_times)
+          ) {
+            formatData["time"].push(Number(time));
+            formatData["solvent_a_percent"].push(Number(this[1]));
+            formatData["solvent_b_percent"].push(Number(this[2]));
+            uniq_times.push(time) ;
+          }
+        }
+      });
+      self.jsonChromato.separation_flow_gradient = formatData;
+    }
+
+    // III.D - IC  
+    if (self.isIC) {
+      self.isJsonChromatoComplete = false;
+      // TODO
+    }
+
+    // IV - Analyzer
+    self.isJsonAnalyzerComplete = true;
+    self.isJsonAnalyzer = {};
+    // IV.A - MS
+    if (self.is_ms() || self.is_ms2()) {
+      self.isJsonAnalyzerComplete = true;
+      self.jsonAnalyzer = {};
+      // check error
+      $.each($(self.prefix+".add1spectrum-analyzerMSForm").parent(), function(){
+        if ($(this).hasClass("has-error"))
+          self.isJsonAnalyzerComplete = false;
+      });
+      if (
+        !self.isJsonAnalyzerComplete
+        && !self.is_other_in_mix()
+      ) {
+        console.log(`isJsonAnalyzerComplete: false`)
+        return false;
+      }
+      
+      // fulfill json object
+      self.jsonAnalyzer["instrument_name"] = $("#add1spectrum-analyzer-ms-instrument-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      self.jsonAnalyzer["instrument_model"] = $("#add1spectrum-analyzer-ms-model-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      self.jsonAnalyzer["instrument_brand"] = $("#add1spectrum-analyzer-ms-model-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      self.jsonAnalyzer["ion_analyzer_type"] = $("#add1spectrum-analyzer-ms-ionAnalyzerType-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      
+      if (self.is_ms2()) {
+        // MSMS ion BEAM or TRAP
+        self.jsonMolIonBeam = {}
+        var jsonIonTrapBeam = {
+          ion_gas: $("#add1spectrum-ionTrapBeam-ionGas-{{ TAB_INDEX_PLACEHOLDER }}").val(),
+          ion_pressure_value: $("#add1spectrum-ionTrapBeam-ionGasPressureValue-{{ TAB_INDEX_PLACEHOLDER }}").val(),
+          ion_pressure_unit: $("#add1spectrum-ionTrapBeam-ionGasPressureUnit-{{ TAB_INDEX_PLACEHOLDER }}").val()
+        } ;
+        var key = null ;
+        if ($("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").val() == "trap") {
+          // sp
+          jsonIonTrapBeam["ion_freq_shift"] = $("#add1spectrum-ionTrapBeam-ionFrequencyShift-{{ TAB_INDEX_PLACEHOLDER }}").val();
+          jsonIonTrapBeam["ion_number"] = $("#add1spectrum-ionTrapBeam-ionNumber-{{ TAB_INDEX_PLACEHOLDER }}").val();
+          key = "ion_trap" ;
+        } else if ($("#add1spectrum-ionTrapBeam-type-{{ TAB_INDEX_PLACEHOLDER }}").val() == "beam") {
+          key = "ion_beam_storage" ;
+        }
+        if (key !== null) {
+          self.jsonMolIonBeam[key] = jsonIonTrapBeam;
+        }
+      }
+      
+      self.jsonMolIonization = {};
+      var json_mode ;
+      ["pos", "neg"].forEach((kind) => {
+        json_mode = {} ;
+        [
+          ["ionisation_method", "ionizationMethod"],
+          ["spray_gas_flow", "sprayGazFlow"],
+          ["vaporizer_gas_flow", "vaporizerGazFlow"],
+          ["vaporizer_temperature", "vaporizerTemperature"],
+          ["source_gas_flow", "sourceGazFlow"],
+          ["transfer_tube_or_capillary_temperature", "ionTransferTubeTemperatureOrTransferCapillaryTemperature"],
+          ["high_voltage", "highVoltageOrCoronaVoltage"]
+        ].forEach((field) => {
+          var id = `#add1spectrum-analyzserMS-${field[1]}-${kind}-{{ TAB_INDEX_PLACEHOLDER }}` ;
+          json_mode[field[0]] = $(id).val() ;
+        })
+        self.jsonMolIonization[`mode_${kind}`] = json_mode ;
+      })
+    }
+
+    // IV.B - NMR
+    if (self.is_ms() || self.is_ms2()) {
+      self.isJsonPeaksListComplete = false;
+      // init
+      var peaklist = [];
+      var peakdata = {};
+      var spectrumData = {};
+      // peaklist
+      var ms_peak_data = self.hot_MS_Peaks.getData();
+      $.each(ms_peak_data, function(index) {
+        var data = ms_peak_data[index] ;
+        var formatData = {};
+        if (
+          data[0] != ""
+          && !isNaN(data[0])
+            // && !isNaN(data[2])
+          && (data[6] === "true" || data[6] === true)
+        ) {
+          peaklist.push({
+            mz: Number(data[0]),
+            ri: Number(data[2]),
+            delta_ppm: Number(data[3]),
+            composition: (data[4]),
+            annotation: (data[5])
+          });
+          self.isJsonPeaksListComplete = true;
+        }
+      });
+      // peak list data
+      peakdata["scan_type"] = (
+        self.is_ms2() ? "ms2" : "ms"
+      );
+      peakdata["polarity"] = $("#add1spectrum-peaksMS-polarity-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["resolution"] = $("#add1spectrum-peaksMS-resolution-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["curation"] = $("#add1spectrum-peaksMS-curation-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["mz_from"] = $("#add1spectrum-peaksMS-rangeFrom-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["mz_to"] = $("#add1spectrum-peaksMS-rangeTo-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["retention_min_time_from"] = $("#add1spectrum-peaksMS-rtMinFrom-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["retention_min_time_to"] = $("#add1spectrum-peaksMS-rtMinTo-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["rt_solv_from"] = $("#add1spectrum-peaksMS-rtSolvFrom-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["rt_solv_to"] = $("#add1spectrum-peaksMS-rtSolvTo-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      peakdata["resolution_FWHM"] = $("#add1spectrum-analyzer-ms-resolutionFWHM-{{ TAB_INDEX_PLACEHOLDER }}").val();
+      if (self.is_ms2()) {
+        var data = self.hot_MS_Peaks.getData() ;
+        if (data.length != 0) {
+          var selected_ion = self.get_selected_parent_ion_index() ;
+          if (selected_ion !== null) {
+            peakdata["precursor_ion"] = data[selected_ion][0] ;
+            peakdata["precursor_spectrum_id"] = null ;
+          } else {
+            peakdata["precursor_ion"] = self.get_selected_parent_ion_mz() ;
+            peakdata["precursor_spectrum_id"] = null ;
+          }
+        }
+      }
+      peakdata["peaklist"] = peaklist;
+      self.jsonPeaksList = peakdata;
+    }
+    
+    self.isJsonOtherMetadataComplete = true;
+    self.jsonOtherMetadata = {};
+    // check error
+    $.each($(self.prefix+".add1spectrum-otherForm").parent(), function(){
+      if ($(this).hasClass("has-error"))
+        self.isJsonOtherMetadataComplete = false;
+    });
+    if (!self.isJsonOtherMetadataComplete && !self.is_other_in_mix()) {
+      console.log(`isJsonOtherMetadataComplete: false`)
+      return false;
+    }
+    self.jsonOtherMetadata["data_authors"] =  $("#add1spectrum-other-author-{{ TAB_INDEX_PLACEHOLDER }}").val();
+    self.jsonOtherMetadata["data_validator"] =  $("#add1spectrum-other-validator-{{ TAB_INDEX_PLACEHOLDER }}").val();;
+    self.jsonOtherMetadata["acquisition_date"] =  $("#add1spectrum-other-date-{{ TAB_INDEX_PLACEHOLDER }}").val();
+    if (!self.jsonOtherMetadata["acquisition_date"]) {
+      self.jsonOtherMetadata["acquisition_date"] = null ;
+    }
+    self.jsonOtherMetadata["data_ownership"] =  $("#add1spectrum-other-owner-{{ TAB_INDEX_PLACEHOLDER }}").val();
+    self.jsonOtherMetadata["raw_file_name"] =  $("#add1spectrum-other-fileName-{{ TAB_INDEX_PLACEHOLDER }}").val();
+    self.jsonOtherMetadata["raw_file_size"] =  $("#add1spectrum-other-fileSize-{{ TAB_INDEX_PLACEHOLDER }}").val();
+    return true;
+  },
+
+  //USED HERE
+  getFormErrorMessage: function() {
+    var self = this ;
+    var alertMsg = "";
+    if (!self.isJsonSpectrumTypeComplete) {
+      alertMsg = `
+      
+        
+          × 
+          
+             
+         
+        
+            Error processing spectrum type!
+      
` ;
+    } else if (!self.isJsonSampleComplete) {
+      alertMsg = `
+      ` ;
+    } else if (!self.isJsonRCCaddedComplete) {
+      alertMsg = `
+      
+        
+          × 
+          
+             
+         
+        
+            Pease enter at least ONE compound in mix into sample section!
+        
+        
Go to this section 
+      
+        
+          × 
+          
+             
+         
+        
+            Missing data in chromatography section!
+      ` ;
+      if (self.is_ms()) {
+        alertMsg += `
+        
+        
Go to this section `;
+      }
+      alertMsg += ' 
+        
+          × 
+          
+             
+         
+        
+            Missing peaklist!
+      ` ;
+      if (self.is_ms()) {
+        alertMsg += `
+        
+        
Go to this section `;
+      }
+      alertMsg += ' 
+              
+                × 
+                
+                   
+               
+              
+                  Select precursor ion in all peak lists!
+            
+          `
+        }
+      }
+    }
+    // TODO other
+    return alertMsg;
+  },
+
+  //USED HERE
+  gatherJsonObjects: function() {
+    var self = this ;
+    var jsonData = {};
+    if (self.is_mix()) {
+      jsonData["sample_type"] = "mix_of_reference_chemical_compounds" ;
+    } else {
+      jsonData["sample_type"] = "reference_chemical_compound" ;
+    }
+    jsonData["spectrum_type"] = self.jsonSpectrumType.toUpperCase().replaceAll("-", "");
+    jsonData["sample"] = self.jsonSample;
+    if (self.isLC) {
+      jsonData["chromatography"] = self.jsonChromato;
+    } else if (self.isGC) {
+      jsonData["chromatography"] = self.jsonChromato;
+    } else if (self.isIC) {
+      jsonData["chromatography"] = self.jsonChromato;
+    } 
+    if (self.is_ms()) {
+      jsonData["analyzer"] = self.jsonAnalyzer;
+      var molecule_ionization = self.jsonMolIonization;
+      jsonData["ionization_mode_positive"] = molecule_ionization["mode_pos"] ;
+      jsonData["ionization_mode_negative"] = molecule_ionization["mode_neg"] ;
+      jsonData["peaklists"] = [self.jsonPeaksList] ;
+    } else if (self.is_ms2()) {
+      jsonData["analyzer"] = self.jsonAnalyzer;
+      var molecule_ionization = self.jsonMolIonization;
+      jsonData["ionization_mode_positive"] = molecule_ionization["mode_pos"] ;
+      jsonData["ionization_mode_negative"] = molecule_ionization["mode_neg"] ;
+      if (self.jsonMolIonBeam != null) {
+        jsonData["ion_beam_storage"] = self.jsonMolIonBeam["ion_beam_storage"];
+      }
+      jsonData["peaklists"] = [self.jsonPeaksList] ;
+    }
+    jsonData["other_metadata"] = self.jsonOtherMetadata;
+    return jsonData;
+  },
+
+  //USED IN HTML
+  pickChemicalCompound: function() {
+    var self = this ;
+    self.singlePick = true;
+    $("#modalPickCompound-{{ TAB_INDEX_PLACEHOLDER }}").modal("show");
+    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").focus();
+  },
+
+  //USED HERE
+  pickChemicalCompound4Mix: function(rowNumber) {
+    var self = this ;
+    self.singlePick = false;
+    self.multiPickLine = rowNumber;
+    $("#modalPickCompound-{{ TAB_INDEX_PLACEHOLDER }}").modal("show");
+    $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").focus();
+  },
+
+  //USED HERE
+  searchAjax: function() {
+    var self = this ;
+    var results ;
+    var rawQuery = $('#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}').val();
+    if (rawQuery.length > 2) {
+      return [] ;
+    }
+    results = [] ;
+    $.ajax({ 
+        type: "post",
+        url: "{{ PF_URL_PLACEHOLDER }}/webapp/search",
+        dataType: "json",
+        async: false,
+        data: "query=" + $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").val(),
+        success: function(json) {
+          if (json.success) {
+            $.each(json.compoundNames, function(){
+              results.push(this.name) ;
+            }) ; 
+            $.each(json.compounds, function(){
+              if (this.inChIKey.indexOf(rawQuery)) {
+                results.push(this.inChIKey) ;
+              }
+            }) ;
+          }
+      },
+      error : function(xhr) {
+        self.subjects = [] ;
+        console.log(xhr) ;
+      }
+    }) ;
+    return results ;
+  },
+
+  //USED HERE
+  searchLocalCompound: function() {
+    var self = this ;
+    $("#load-step-1-{{ TAB_INDEX_PLACEHOLDER }}").show();
+    $.ajax({ 
+      type: "get",
+      url: "{{ PF_URL_PLACEHOLDER }}/rest/v2/compounds",
+      async: true,
+      data: "limit=1&query=" + $('#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}').val() + "&query_filter=" + self.fitlerSearchLoadlCpd+"&token={{ PF_TOKEN_PLACEHOLDER }}",
+      success: function(data) {
+        data = data[0] ;
+        var id = parseInt(data["id"]) ;
+        var name = data["name"] ;
+        var inchikey = data["inchikey"] ;
+        var inchi = data["inchi"] ;
+        data = `
+    
+      
+        
+          
+            
+            
+            
+            
+           
+         
+        
+          
+            
+              ${name}  
+              ${inchikey} 
+             
+            ${data["exactMass"]} 
+            ${data["formula"]} 
+            
+               
+             
+         
+      
+    
* 
+    <` + "script" + ` type="text/javascript">
+    $("#tabPickCpd-{{ TAB_INDEX_PLACEHOLDER }}").tablesorter();
+    $.each($(self.prefix+".compoundFormula"), function(id, elem) {
+      var rawFromula = $(elem).text();
+      var formatedFormula = rawFromula;
+      try {
+        $.each($.unique( rawFromula.match(/\d+/g)), function(keyF, valF) {
+          var re = new RegExp(valF,"g");
+          formatedFormula = formatedFormula.replace(re, "
" + valF + " ");
+        });
+      } catch (e){}
+      formatedFormula = formatedFormula.replace("
", "");
+      $(elem).html(formatedFormula);
+    });
+    $.each($(self.prefix+".compoundMass"), function(id, elem) {
+      var exactMass = parseFloat( $(elem).text());
+      exactMass = roundNumber(exactMass,7)
+      $(elem).html(exactMass);
+    });
+    ` + "script" + `>
+
+       InChIKey " in this && this["InChIKey "]!= undefined && this["InChIKey "] != "") {
+        jsonRCC_ADDED.push(this["InChIKey "]);
+      }
+    });
+    return jsonRCC_ADDED;
+  },
+
+  //USED HERE
+  getRCCADDEDConcentration: function() {
+    var self = this ;
+    jsonRCC_ADDED = [];
+    $.each(self.hot_RCC_ADDED.getData(), function(){
+      var formatData = {};
+      if ("InChIKey " in this && this["InChIKey "]!= undefined && this["InChIKey "] != "") {
+        jsonRCC_ADDED.push(this["concentration (µg/ml) "]);
+      }
+    });
+    return jsonRCC_ADDED;
+  },
+
+  //USED IN HTML
+  clearLine: function() {
+    var self = this ;
+    // restet form
+    setTimeout(function(){
+      $("#add-one-cc-s1-value-{{ TAB_INDEX_PLACEHOLDER }}").val("");
+      $("#ok-step-1-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    }, 200);
+    $(self.prefix+"img.mixRCCadd"+self.multiPickLine).remove();
+    if (self.singlePick) {
+      $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").val("");
+      $("#add1spectrum-sample-inchikey-{{ TAB_INDEX_PLACEHOLDER }}").change();
+      $("#add1spectrum-sample-inchi-{{ TAB_INDEX_PLACEHOLDER }}").val("");
+      $("#add1spectrum-sample-inchi-{{ TAB_INDEX_PLACEHOLDER }}").change();
+      $("#add1spectrum-sample-commonName-{{ TAB_INDEX_PLACEHOLDER }}").val("");
+      $("#add1spectrum-sample-commonName-{{ TAB_INDEX_PLACEHOLDER }}").change();
+      $("#sample-bonus-display-{{ TAB_INDEX_PLACEHOLDER }}").html("");
+    } else if (self.multiPickLine >= 0) {
+      for(var i = 0 ; i < 6 ; i += 1) {
+        self.hot_RCC_ADDED.setDataAtCell(self.multiPickLine, i, "");
+      }
+    }
+  },
+
+  exit: function() {
+    $.ajax({type: "get", url: "/quit", async: true, success: ()=>window.close()});
+  },
+
+} ;
+
+$.ajax({
+  type: "get",
+  url: "{{ PF_URL_PLACEHOLDER }}/webapp/get-cpd-data?token={{ PF_TOKEN_PLACEHOLDER }}",
+  data: "inchikey=" + "{{ INCHIKEY_PLACEHOLDER }}",
+  dataType: "json",
+  success: function(data) {
+    if (data.success) {
+      var self = context_{{ TAB_INDEX_PLACEHOLDER }} ;
+      console.log(`inchikey {{ INCHIKEY_PLACEHOLDER }} found!!`)
+      inchidata["{{ INCHIKEY_PLACEHOLDER }}"] = data ;
+      self.init() ;
+      self.fitlerSearchLoadlCpd = 5;
+      self.inchikey = null;
+      all_contexts[{{ TAB_INDEX_PLACEHOLDER }}] = self ;
+    } else {
+      no_success(
+        {{ TAB_INDEX_PLACEHOLDER }},
+        "{{ INCHIKEY_PLACEHOLDER }}",
+        {{ DEFAULT_DATA }}["name"]
+      ) ;
+      all_contexts[{{ TAB_INDEX_PLACEHOLDER }}] = null ;
+    }
+  },
+  error : function(data) {
+    no_success(
+      {{ TAB_INDEX_PLACEHOLDER }},
+      "{{ INCHIKEY_PLACEHOLDER }}",
+      {{ DEFAULT_DATA }}["name"]
+    ) ;
+    all_contexts[{{ TAB_INDEX_PLACEHOLDER }}] = null ;
+  }
+}).always(() => null);
diff -r b58b229c4cbf -r 7e3085fc60c1 src/common.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/common.js	Wed Aug 30 14:21:18 2023 +0000
@@ -0,0 +1,304 @@
+
+this.ctx = () => context;
+var all_contexts = [] ;
+var inchidata = {} ;
+var all_mix_data = {} ;
+var already_sent_data = {} ;
+
+function no_success(tab_index, inchi, data) {
+  console.log(`inchikey ${inchi} not found...`) ;
+  console.log(`disabling ${data} ...`)
+  disable_tab(
+    tab_index,
+    "red",
+    "This compound has not been found on peakforest"
+  ) ;
+}
+
+function disable_tab(tab_index, color, title) {
+  var element = $(`#open_tab_${tab_index}`) ;
+  element.attr("disabled", "disabled").off("click");
+  element.attr("onclick", null) ;
+  element.attr("title", title) ;
+  element.attr("data-toggle", null) ;
+  element.attr("href", null) ;
+  element.css("color", color) ;
+  element.css("cursor", "not-allowed") ;
+}
+
+function successfull_send_to_pf(bundle, json, index) {
+  for (var i = 0 ; i < all_contexts.length ; i += 1) {
+    if (all_contexts[i] === null || all_contexts[i] === undefined) {
+      continue ;
+    }
+    if (all_contexts[i].inchikey == bundle["sample"]["inchikey"]) {
+      disable_tab(
+        all_contexts[i].tab_index,
+        "green",
+        "This compound has already been sent to peakforest"
+      )
+    }
+  }
+  if (already_sent_data[index] == null) {
+    already_sent_data[index] = [] ;
+  }
+  json.forEach((id) => {
+    already_sent_data[index].push(id)
+    $("#send_buttons_div").prepend(`
+    
+      
+        
+          
+            × 
+            
+               
+           
+          
+              Spectrum has been sent:
+          
${id} 
+        
+      
+    
+    
+      
+        
+          × 
+          
+             
+         
+        
+            Spectrum has not been sent!
+      
+    
+  
+      
+        
+          
+            × 
+            
+               
+           
+          
+              Spectrum has already been sent:
+          
${id} 
+        
+      
+    
+                      
+                        
+                        
+                          
+                            Precursor ion (M/Z) 
+                             
+                          
+                        
+                      
+                    
+              
+                
+                  
+                  
+                    
+                      
+                  
+                
+                
+                  
+                  
+                    
+                      
+                        
+                          
+                            
+                              
+                                Sample Type  
+                                
+                                  choose in list… 
+                                  Ref. Chemical Compound 
+                                 
+                              
+                            
+                            
+                              
+                              
+                                
+                                  
Reference compound added 
+                                
+                                
+                              
+                            
+                          
+                        
+                        
+                      
+                      
+                    
+                  
+                
+                
+                  
+                  
+                    
+                      
+                        
+                          
+                            
+                              
Chromatography Param. 
+                            
+                            
+                              
+                                Method  
+                                
+                              
+                              
+                                Column constructor  
+                                choose in list… Agilent Alltech Cil cluzeau Daicel Hypersil Interchim Macherey nagel Merck Phenomenex Shiseido Supelco (sigma-aldrich) Thermo Vydac Waters YMC Other 
+                              
+                                Column constructor (other)  
+                                
+                              
+                                Column name  
+                                
+                              
+                                Column length (mm)  
+                                
+                              
+                                Column diameter (mm)  
+                                
+                              
+                                Particule size (µm)  
+                                
+                              
+                                Column temperature (°C)  
+                                
+                              
+                                LC mode  
+                                
+                                  choose in list… 
+                                  Gradient 
+                                  Isocratic 
+                                 
+                              
+                              
+                                Separation flow rate (µL/min)  
+                                
+                              
+                                Separation solvent A  
+                                choose in list… 5% ACN + 0.1% FA in H2O 10% ACN + 0.1% FA in H2O 10mM (NH4)2CO3 / ACN (20/80) (v/v) Acetonitrile Acetonitrile + 0.1% Formic Acid H2O + 0.1% Formic Acid H2O, ammonium carbonate 10 mM, pH10.5 H2O, ammonium acetate 2.5 mM H2O / CH3OH / CH3CO2H (95/5/0.1) Methanol Methanol / H2O (1/1) Methanol / H2O (1/1), 0.1% FA Methanol / CH3CO2H (100/0.1) Methanol / ACN (60/40) ammonium acetate 2.5 mM 
+                              
+                                pH solvent A (if acqueous solvant)  
+                                
+                              
+                                Separation solvent B  
+                                choose in list… 5% ACN + 0.1% FA in H2O 10% ACN + 0.1% FA in H2O 10mM (NH4)2CO3 / ACN (20/80) (v/v) Acetonitrile Acetonitrile + 0.1% Formic Acid H2O + 0.1% Formic Acid H2O, ammonium carbonate 10 mM, pH10.5 H2O, ammonium acetate 2.5 mM H2O / CH3OH / CH3CO2H (95/5/0.1) Methanol Methanol / H2O (1/1) Methanol / H2O (1/1), 0.1% FA Methanol / CH3CO2H (100/0.1) Methanol / ACN (60/40) ammonium acetate 2.5 mM 
+                              
+                                pH solvent B (if acqueous solvant)  
+                                
+                            
+                          
+                        
+                        
+                          
+                            
+                              
Separation flow gradient 
+                            
+                            
+                          
+                        
+                      
+                      
+                    
+                  
+                
+                
+                
+                  
+                  
+                    
+                      
+                        
+                          
+                          
+                            
+                              
Analyzer 
+                            
+                            
+                              
+                                Instrument  
+                                
+                              
+                                Model  
+                                
+                              
+                            
+                          
+                        
+                        
+                          
+                          
+                            
+                              
Molecule Ionization 
+                            
+                            
+                          
+                        
+                        
+                          
+                          
+                            
+                              
Ion Storage / Ion Beam 
+                            
+                            
+                              
+                                Type (storage / beam)   
+                                
+                                  choose in list… 
+                                  Ion Trap 
+                                  Ion Beam 
+                                 
+                              
+                              
+                                
+                                  Ion storage: Ion Trap (IT) and ICR.
+                                   
+                              
+                              
+                                Gas   
+                                
+                                  He 
+                                  N2 
+                                  Ar 
+                                 
+                              
+                              
+                                Gas pressure  
+                                
+                                  choose in list… 
+                                  mbar 
+                                  a.u. 
+                                 
+                              
+                              
+                                Frequency Shift (KHz)   
+                                
+                              
+                                Ion Number (AGC or ICC)   
+                                
+                            
+                          
+                        
+                      
+                      
+                    
+                  
+                
+                
+                  
+                  
+                    
+                      
+                          
+                        
+                          polarity  
+                          
+                            choose in list… 
+                            positive 
+                            negative 
+                           
+                        
+                        
+                          resolution  
+                          
+                            choose in list… 
+                            low 
+                            high 
+                           
+                        
+                        
+                          curation  
+                          
+                            no curation 
+                            Peaks RI > 1% 
+                            Top 50 peaks 
+                            Top 20 peaks 
+                            Top 10 peaks 
+                            Similar chromatographic profile 
+                           
+                        
+                      
+                      
+                      
+                        
+
+                        
+                          Isolation mode   
+                          
+                            choose in list… 
+                            IT 
+                            Q 
+                            TOF 
+                            ICR 
+                           
+                        
+                        
+                          Isolation window   
+                          
+                        
+                          qz isolation / activation (no unit)   
+                          
+                        
+                          Activation time (ms)   
+                          
+                        
+                          Mode   
+                          
+                            choose in list… 
+                            HCD 
+                            CID 
+                            ECD 
+                            ETD 
+                           
+                        
+
+                        
+                          Frag. energy   
+                          
+                      
+                      
+                      
+                      
+                        
+                          
+                          
+                          
+                            
+                              
+                                
+
+                                
+                                  Precursor ion (M/Z)  
+                                  
+                              
+                            
+                            
+                          
+                        
+                      
+                      
+                        
+                          check 
+                          
+                        
 
+                      
+                    
+                  
+                
+                
+                  
+                  
+                    
+                      
+                      
+                        
+                          
+                          
+                          
+                          
+                          
+                             
+                        
+                        
+                      
+                      
+                    
+                  
+                
+              
+              
+              
+              
+            
+              
+                
+                  
+                  
+                    
+                      Compound Name 
+                      
+                        
+                           
+                       
+                    
+                    
+                      
+                    
+                    
+                  
+                  
+                
+              
+            
PeakForest MetaboHub 
+    
+      
+        Close MS2PF 
+      
+      
+        
+          
+            
+              
+              
+                
+                  
+              
+            
+            
+              
+              
+                
+                  
+                    
+                      
+                        
+                          
+                            
+                              Sample Type
+                             
+                            
+                              choose in list… 
+                              
+                                Mix of Ref. Chemical Compound
+                               
+                             
+                          
+                        
+                        
+                          
+                            
+                              solvent 
+                              
+                                choose in list… 
+                                H2O/ethanol (75/25) 
+                               
+                            
+                          
+                          
+                            
+                              
Reference compound added 
+                            
+                            
+                          
+                        
+                      
+                    
+                    
+                  
+                  
+                
+              
+            
+            
+              
+              
+                
+                  
+                    
+                      
+                        
+                          
Chromatography Param. 
+                        
+                        
+                          
+                            Method 
+                            
+                          
+                          
+                            Column constructor 
+                            
+                              choose in list… 
+                             
+                          
+                          
+                            Column constructor (other) 
+                            
+                          
+                            Column name 
+                            
+                          
+                            Column length (mm) 
+                            
+                          
+                            Column diameter (mm) 
+                            
+                          
+                            Particule size (µm) 
+                            
+                          
+                            Column temperature (°C) 
+                            
+                          
+                            LC mode 
+                            
+                              choose in list… 
+                              Gradient 
+                              Isocratic 
+                             
+                          
+                          
+                            Separation flow rate (µL/min) 
+                            
+                          
+                            Separation solvent A 
+                            
+                              choose in list… 
+                             
+                          
+                          
+                            pH solvent A (if acqueous solvant) 
+                            
+                          
+                            Separation solvent B 
+                            
+                             
+                          
+                          
+                            pH solvent B (if acqueous solvant) 
+                            
+                        
+                      
+                    
+                    
+                      
+                        
+                          
Separation flow gradient 
+                        
+                        
+                      
+                    
+                  
+                  
+                
+              
+            
+            
+            
+              
+              
+                
+                  
+                    
+                      
+                      
+                        
+                          
Analyzer 
+                        
+                        
+                          
+                            Instrument 
+                            
+                          
+                            Model 
+                            
+                          
+                        
+                      
+                    
+                    
+                      
+                      
+                        
+                          
Molecule Ionization 
+                        
+                        
+                      
+                    
+                    
+                      
+                      
+                        
+                          
Ion Storage / Ion Beam 
+                        
+                        
+                          
+                            Type (storage / beam)  
+                            
+                              choose in list… 
+                              Ion Trap 
+                              Ion Beam 
+                             
+                          
+                          
+                            
+                              Ion storage: Ion Trap (IT) and ICR.
+                               
+                          
+                          
+                            Gas  
+                            
+                              He 
+                              N2 
+                              Ar 
+                             
+                          
+                          
+                            Gas pressure 
+                            
+                              choose in list… 
+                              mbar 
+                              a.u. 
+                             
+                          
+                          
+                            Frequency Shift (KHz)  
+                            
+                          
+                            Ion Number (AGC or ICC)  
+                            
+                        
+                      
+                    
+                  
+                  
+                
+              
+            
+            
+              
+              
+                
+                  
+
+                    
+                      polarity 
+                      
+                        choose in list… 
+                        positive 
+                        negative 
+                       
+                    
+                    
+                      resolution 
+                      
+                        choose in list… 
+                        low 
+                        high 
+                       
+                    
+                    
+                      curation 
+                      
+                        no curation 
+                        Peaks RI > 1% 
+                        Top 50 peaks 
+                        Top 20 peaks 
+                        Top 10 peaks 
+                        Similar chromatographic profile 
+                       
+                    
+                  
+                  
+                  
+                    
+                    
+                      
+                        Isolation mode  
+                      
+                        choose in list… 
+                        IT 
+                        Q 
+                        TOF 
+                        ICR 
+                       
+                    
+                    
+                      
+                        Isolation window  
+                      
+                    
+                      qz isolation / activation (no unit)  
+                      
+                    
+                      Activation time (ms)  
+                      
+                    
+                      
+                        Mode  
+                      
+                        choose in list… 
+                        HCD 
+                        CID 
+                        ECD 
+                        ETD 
+                       
+                    
+
+                    
+                      
+                        Frag. energy  
+                      
+                  
+                  
+                  
+                    
+                      
+                        retention time (% solvant) from / to 
+                       
+                      
+                    
 
+                    
 
+                  
+                  
+                    
+                      
+                        {{ TAB_LIST_PLACEHOLDER }}
+                       
+                      
+                        {{ ADD_SPECTRUM_FORM }}
+                      
+                    
+                  
+                  
+                    
+                      check 
+                      
+                    
 
+                  
+                
+              
+            
+
+
+            
+              
+              
+                
+                  
+                  
+                    
+                      
+                      
+                         
+                      
+                      
+                        
+                           
+                        
+                           
+                       
+                    
+                    
+                      
+                  
+                  
+                
+              
+            
+            
+            
+            
+            
+              
+                
+                  
+                  
+                    
+                      Compound Name 
+                      
+                        
+                           
+                       
+                    
+                    
+                      
+                    
+                    
+                  
+                  
+                
+              
+            
+            
+          
+        
+      
+      
+        
+           
+        
+          Close MS2PF
+         
+      
+      
+      
+    
+      
+     
+    
+    
+    {{ EMBED_JS }}
+    
+  
+
\ No newline at end of file
diff -r b58b229c4cbf -r 7e3085fc60c1 src/meta-compound-ref.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/meta-compound-ref.html	Wed Aug 30 14:21:18 2023 +0000
@@ -0,0 +1,112 @@
+
+
+  
+    PeakForest MetaboHub 
+    
+        
+          Close MS2PF 
+        
+        
+          
+            {{ TAB_LIST_PLACEHOLDER }}
+           
+          
+            {{ ADD_SPECTRUM_FORM }}
+          
+        
+        
+          
+             
+          Close MS2PF 
+        
+        
+        
+      
+      
+     
+    
+    
+    {{ EMBED_JS }}
+    
+  
+
\ No newline at end of file
diff -r b58b229c4cbf -r 7e3085fc60c1 src/tab_list.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/tab_list.html	Wed Aug 30 14:21:18 2023 +0000
@@ -0,0 +1,14 @@
+            
+              
+                 
+             
diff -r b58b229c4cbf -r 7e3085fc60c1 tab_list.html
--- a/tab_list.html	Fri Mar 03 14:10:24 2023 +0000
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,14 +0,0 @@
-            
-              
-                 
-