Files
enviPy-bayer/templates/modals/collections/new_model_modal.html
2025-06-23 20:13:54 +02:00

202 lines
11 KiB
HTML

<div class="modal fade" tabindex="-1" id="new_model_modal" role="dialog" aria-labelledby="new_model_modal"
aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">&times;</span>
<span class="sr-only">Close</span>
</button>
<h4 class="modal-title">New Model</h4>
</div>
<div class="modal-body">
<form id="new_model_form" accept-charset="UTF-8" action="{{ meta.current_package.url }}/model"
data-remote="true" method="post">
{% csrf_token %}
<div class="jumbotron">Create a new Model to
limit the number of degradation products in the
prediction. You just need to set a name and the packages
you want the object to be based on. If you want to use the
default options suggested by us, simply click Submit,
otherwise click Advanced Options.
</div>
<label for="name">Name</label>
<input id="name" name="model-name" class="form-control" placeholder="Name"/>
<label for="description">Description</label>
<input id="description" name="model-description" class="form-control"
placeholder="Description"/>
<label for="model-type">Model Type</label>
<select id="model-type" name="model-type" class="form-control" data-width='100%'>
<option disabled selected>Select Model Type</option>
{% for k, v in model_types.items %}
<option value="{{ v }}">{{ k }}</option>
{% endfor %}
</select>
<!-- ML Based Form-->
<div id="ml-relative-reasoning-specific-form">
<!-- Rule Packages -->
<label>Rule Packages</label><br>
<select id="ml-relative-reasoning-rule-packages" name="ml-relative-reasoning-rule-packages"
data-actions-box='true' class="form-control" multiple data-width='100%'>
<option disabled>Reviewed Packages</option>
{% for obj in meta.readable_packages %}
{% if obj.reviewed %}
<option value="{{ obj.url }}">{{ obj.name }}</option>
{% endif %}
{% endfor %}
<option disabled>Unreviewed Packages</option>
{% for obj in meta.readable_packages %}
{% if not obj.reviewed %}
<option value="{{ obj.url }}">{{ obj.name }}</option>
{% endif %}
{% endfor %}
</select>
<!-- Data Packages -->
<label>Data Packages</label><br>
<select id="ml-relative-reasoning-data-packages" name="ml-relative-reasoning-data-packages"
data-actions-box='true' class="form-control" multiple data-width='100%'>
<option disabled>Reviewed Packages</option>
{% for obj in meta.readable_packages %}
{% if obj.reviewed %}
<option value="{{ obj.url }}">{{ obj.name }}</option>
{% endif %}
{% endfor %}
<option disabled>Unreviewed Packages</option>
{% for obj in meta.readable_packages %}
{% if not obj.reviewed %}
<option value="{{ obj.url }}">{{ obj.name }}</option>
{% endif %}
{% endfor %}
</select>
<!-- Fingerprinter -->
<label for="ml-relative-reasoning-fingerprinter">Fingerprinter</label>
<select id="ml-relative-reasoning-fingerprinter" name="ml-relative-reasoning-fingerprinter"
class="form-control">
<option value="MACCS" selected>MACCS Fingerprinter</option>
</select>
{% if 'plugins' in meta.enabled_features %}
<!-- Property Plugins go here -->
<label for="ml-relative-reasoning-additional-fingerprinter">Fingerprinter</label>
<select id="ml-relative-reasoning-additional-fingerprinter"
name="ml-relative-reasoning-additional-fingerprinter"
class="form-control">
</select>
{% endif %}
<label for="ml-relative-reasoning-threshold">Threshold</label>
<input type="number" min="0" , max="1" step="0.05" value="0.5"
id="ml-relative-reasoning-threshold"
name="ml-relative-reasoning-threshold" class="form-control">
<!-- Evaluation -->
<label>Evaluation Packages</label><br>
<select id="ml-relative-reasoning-evaluation-packages" name="ml-relative-reasoning-evaluation-packages"
data-actions-box='true' class="form-control" multiple data-width='100%'>
<option disabled>Reviewed Packages</option>
{% for obj in meta.readable_packages %}
{% if obj.reviewed %}
<option value="{{ obj.url }}">{{ obj.name }}</option>
{% endif %}
{% endfor %}
<option disabled>Unreviewed Packages</option>
{% for obj in meta.readable_packages %}
{% if not obj.reviewed %}
<option value="{{ obj.url }}">{{ obj.name }}</option>
{% endif %}
{% endfor %}
</select>
</div>
<!-- Rule Based Based Form-->
<div id="rule-based-relative-reasoning-specific-form">
</div>
<!-- EnviFormer-->
<div id="enviformer-specific-form">
<label for="enviformer-threshold">Threshold</label>
<input type="number" min="0" , max="1" step="0.05" value="0.5" id="enviformer-threshold"
name="enviformer-threshold" class="form-control">
</div>
{% if 'applicability_domain' in enabled_features %}
<div class="modal-body hide" data-step="3" data-title="Advanced Options II">
<div class="jumbotron">Selection of parameter values for the Applicability Domain process.
Number of Neighbours refers to a requirement on the minimum number of compounds from the
training
dataset that has at least one triggered transformation rule that is common with the compound
being
analyzed.
Reliability Threshold is a requirement on the average tanimoto distance to the set number of
"nearest neighbours" (Number of neighbours with the smallest tanimoto distances).
Local Compatibility Threshold is a requirement on the average F1 score determined from the
number of
nearest neighbours, using their respective precision and recall values computed from the
agreement
between their observed and triggered rules.
You can learn more about it in our wiki!
</div>
<!-- Use AD? -->
<div class="checkbox">
<label>
<input type="checkbox" id="buildAD" name="buildAD">Also build an Applicability Domain?
</label>
</div>
<!-- Num Neighbours -->
<label for="adK">Number of Neighbours</label>
<input id="adK" name="adK" type="number" class="form-control" value="5" step="1" min="0"
max="10">
<!-- F1 Threshold -->
<label for="localCompatibilityThreshold">Local Compatibility Threshold</label>
<input id="localCompatibilityThreshold" name="localCompatibilityThreshold" type="number"
class="form-control" value="0.5" step="0.01" min="0" max="1">
<!-- Percentile Threshold -->
<label for="reliabilityThreshold">Reliability Threshold</label>
<input id="reliabilityThreshold" name="reliabilityThreshold" type="number" class="form-control"
value="0.5" step="0.01" min="0" max="1">
</div>
{% endif %}
</form>
</div>
<div class="modal-footer">
<a id="new_model_modal_form_submit" class="btn btn-primary" href="#">Submit</a>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
<script>
$(function() {
// Initially hide all "specific" forms
$("div[id$='-specific-form']").each( function() {
$(this).hide();
});
$("#ml-relative-reasoning-rule-packages").selectpicker();
$("#ml-relative-reasoning-data-packages").selectpicker();
$("#ml-relative-reasoning-evaluation-packages").selectpicker();
// On change hide all and show only selected
$("#model-type").change(function() {
$("div[id$='-specific-form']").each( function() {
$(this).hide();
});
val = $('option:selected', this).val();
$("#" + val + "-specific-form").show();
});
$('#new_model_modal_form_submit').on('click', function(e){
e.preventDefault();
$('#new_model_form').submit();
});
});
</script>