Datasets
Models
Diff of
/qiita_pet/templates/edit_study.html
[000000]
..
[879b32]
Switch to side-by-side view
--- a +++ b/qiita_pet/templates/edit_study.html @@ -0,0 +1,242 @@ +{% extends sitebase.html %} +{% block head %} +<script type = "text/javascript" + src = "{% raw qiita_config.portal_dir %}/static/vendor/js/jquery.validate.min.js"> +</script> +<style> + .custom-combobox { + position: relative; + display: inline-block; + } + .custom-combobox-toggle { + position: absolute; + top: 0; + bottom: 0; + margin-left: -1px; + padding: 0; + } + .custom-combobox-input { + margin: 0; + padding: 5px 10px; + } +</style> + +<script> +$(document).ready(function() { + $("#new_person_div").hide(); + $( "#{{creation_form.principal_investigator.id}}" ).chosen({ + allow_single_deselect: true + }); + $( "#{{creation_form.lab_person.id}}" ).chosen({ + allow_single_deselect: true + }); + + $("#study_title").on("keyup", function() { + var title = $(this).val(); + // removing any duplicated whitespaces + title = title.replace(/ +(?= )/g, ''); + //remove all utf-8 encoded characters that are not also printable ASCII characters. + title = title.replace(/[^\x20-\x7E]+/g, ""); + // removing white spaces from the front of the text + $(this).val(title.trimLeft()); + }); + + $("#new_person_name").on("keyup", function() { + var npn = $(this).val(); + // removing any duplicated whitespaces + npn = npn.replace(/ +(?= )/g, ''); + //remove all utf-8 encoded characters that are not also printable ASCII characters. + npn = npn.replace(/[^\x20-\x7E]+/g, ""); + // removing white spaces from the front of the text + $(this).val(npn.trimLeft()); + }); + + $("#create_study").validate({ + ignore: "", + submitHandler: function (form) { + //from http://stackoverflow.com/a/18265708 + // let's disable the inputs for the duration of the ajax request + $("#create_study_submit").prop('disabled', true); + + // fire off ajax the request + request = $.ajax({ + type: "GET", + url: '{% raw qiita_config.portal_dir %}/check_study/', + data: {study_title: $("#study_title")[0].value.trim() {% if study %}, old_study_title: "{% raw study.title.replace('"', '\\"') %}"{% end %} } + }); + + // callback handler that will be called on success + request.done(function (response, textStatus, jqXHR) { + if (response == 'True') { + form.submit(); + } + else { + var title = $("#study_title")[0].value.trim(); + $("#create_study_submit").prop('disabled', false); + $("#messagespan").text("Study '" + title + "' already exists! Please choose a different name."); + alert($("#messagespan").text()); + $("#study_title").val(title) + } + }); + + // callback handler that will be called on failure + request.fail(function (jqXHR, textStatus, errorThrown) { + // log the error to the console + console.error( + "The following error occured: " + textStatus, errorThrown); + $("#create_study_submit").prop('disabled', false); + }); + }, + rules:{ +{% for idx, form_item in enumerate(creation_form, start=1) %} + {% if form_item.flags.required %} + {{form_item.name}}: {required:true}, + {% end %} +{% end %} + }, + messages: { +{% for idx, form_item in enumerate(creation_form, start=1) %} + {% if form_item.flags.required %} + {{form_item.name}}: '{{form_item.label.text}} is required', + {% end %} +{% end %} + }, + errorLabelContainer: "#errorspan", + wrapper: "li", + }); + + $('#{{creation_form.principal_investigator.id}}').on('change', function(e) { + $("#create_study").validate().element("#{{creation_form.principal_investigator.id}}"); + }); +}); + +counter = -1; + +function add_new_person(name, affiliation, email, phone, address) { + if (name.value == '') { + $("#new_person_name").focus(); + return false; + }; + if (affiliation.value == '') { + $("#new_person_affiliation").focus(); + return false; + }; + if (email.value == '') { + $("#new_person_email").focus(); + return false; + }; + + var new_element = '<option value="'+counter+'" "selected">' + name.value + ', ' + affiliation.value + '</option>'; + + $("#{{creation_form.principal_investigator.id}}").append(new_element); + $("#{{creation_form.lab_person.id}}" ).append(new_element); + $("#{{creation_form.principal_investigator.id}}").trigger("chosen:updated"); + $("#{{creation_form.lab_person.id}}" ).trigger("chosen:updated"); + $("#new_person_div").hide(400); + + $("#create_study").append('<input type="hidden" name="new_people_names" value="' + name.value + '">'); + $("#create_study").append('<input type="hidden" name="new_people_affiliations" value="' + affiliation.value + '">'); + $("#create_study").append('<input type="hidden" name="new_people_emails" value="' + email.value + '">'); + $("#create_study").append('<input type="hidden" name="new_people_phones" value="' + phone.value + '">'); + $("#create_study").append('<input type="hidden" name="new_people_addresses" value="' + address.value + '">'); + + counter -= 1; +}; + +{% if study %} +function cancel_edition(){ + if (confirm("Are you sure you want to go to the study description page? None of the changes will be stored")){ + window.location.href = "{% raw qiita_config.portal_dir %}/study/description/{{study.id}}"; + } +} +{% end %} + +</script> + +{% end %} + +{% block content %} +<h1>{% if study %}Edit study (ID: {{study.id}}) {% else %}Create a new Study{%end%}</h1> +<hr/> +<h3>If you are planning to load a study with data already present in NCBI SRA or EBI ENA, please complete <a target="_blank" href="https://docs.google.com/forms/d/1SIq_JNWai7cZ2wwjD8xZpTab7qBifLKu3TZm2B363CE/edit?ts=5fbe8c0b&gxids=7628">this form</a> as we may be able to assist. +<hr/> +<h3> + <font color="red">*</font> = Required Field +</h3> +<span id="errorspan" name="errorspan" style="color: red"></span> +<span id="messagespan" name="messagespan" style="color: red"></span> +<br /> +<form id="create_study" name="create_study" action={%if study%}'{% raw qiita_config.portal_dir %}/study/edit/{{study.id}}'{%else%}'{% raw qiita_config.portal_dir %}/study/create/'{%end%} method="POST"> +<table> +{% for idx, form_item in enumerate(creation_form, start=1) %} + {% set kwargs = {'tabindex': idx, 'class_': 'form-control'} %} + {% set additional_info = form_item.description %} + {# form-item-specific rendering #} + {% if form_item.label.text == 'Environmental Packages' %} + {% set kwargs['size'] = len(form_item.choices) %} + {% set additional_info = 'You can select multiple entries by control-clicking (mac: command-clicking)' %} + {% elif form_item.label.text == 'Principal Investigator'%} + {% set kwargs['class_'] = kwargs['class_'] + ' chzn-select' %} + <tr> + <td></td> + <td><b>Can't find the person you're looking for? <a href="#bot" onclick='$("#new_person_div").show(400); return false;'>Add a person</a></b></td> + </tr> + <tr> + <td></td> + <td> + <div name="new_person_div" id="new_person_div"> + <table> + <tr> + <td><b>Name:</b><br><font size=1>Names may only contain ASCII characters </font></td> + <td><input type="text" id="new_person_name" name="new_person_name" class="form-control"></td> + <td><h4> <font color="red">*</font></h4></td> + </tr> + <td><b>Affiliation:</b></td> + <td><input type="text" id="new_person_affiliation" name="new_person_affiliation" class="form-control"></td> + <td><h4> <font color="red">*</font></h4></td> + </tr> + <tr> + <td><b>E-mail Address:</b></td> + <td><input type="text" id="new_person_email" name="new_person_email" class="form-control"></td> + <td><h4> <font color="red">*</font></h4></td> + </tr> + <tr> + <td><b>Phone:</b></td> + <td><input type="text" id="new_person_phone" name="new_person_phone" class="form-control"></td> + </tr> + <tr> + <td><b>Address:</b></td> + <td><input type="text" id="new_person_address" name="new_person_address" class="form-control"></td> + </tr> + <tr> + <td> + <table> + <tr> + <td><input value="Add Person" type="button" class="btn btn-link" onclick='add_new_person(create_study.new_person_name, create_study.new_person_affiliation, create_study.new_person_email, create_study.new_person_phone, create_study.new_person_address);'></td> + <td><input value="Cancel" type="button" class="btn btn-link" onclick='$("#new_person_div").hide(400); return true;'></td> + </tr> + </table> + </td> + </tr> + </table> + </div> + </td> + {% elif form_item.label.text == 'Study Title'%} + {% set additional_info = 'Study titles may only contain ASCII characters' %} + {% end %} + <tr> + <td width="20%">{% raw form_item.label %} <br /> <small>{{additional_info}}</small></td> + <td width="30%">{% raw form_item(**kwargs) %}</td> + <td width="50%">{% if form_item.flags.required %}<font color="red"><h4> *</h4></font>{% end %}</td> + </tr> +{% end %} + </tr> + <tr> + <td> + <a name="bot"><input type='submit' id="create_study_submit" class='btn btn-success' value="{%if study%}Update{%else%}Create{%end%} Study"> + {%if study%} <input type='button' id="cancel_form" class='btn btn-default' value="Cancel" onclick="cancel_edition()">{%end%} + </td> + </tr> +</table> +</form> +{% end %}