Skip to content

Commit

Permalink
Merge 055b385 into 6253f95
Browse files Browse the repository at this point in the history
  • Loading branch information
@AmandaBirmingham
AmandaBirmingham committed Jun 15, 2020
2 parents 6253f95 + 055b385 commit 008ab91
Show file tree
Hide file tree
Showing 9 changed files with 120 additions and 107 deletions.
33 changes: 27 additions & 6 deletions microsetta_private_api/static/input_util.js
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,36 @@

function preclude_whitespace(selector)
{
<!--https://stackoverflow.com/questions/12010275/strip-white-spaces-on-input-->
function preclude_whitespace(selector) {
// https://stackoverflow.com/questions/12010275/strip-white-spaces-on-input
$(selector).bind('input', function(){
$(this).val(function(_, v){
return v.replace(/\s+/g, '');
});
});
}

// Disable implicit submission for the form with the input name (NOT id).
// While implicit submission is strongly recommended by the HTML
// standards for accessibility purposes, it is causing confusion
// and premature form submission for our user base
function preventImplicitSubmission(form_name){
let implicit_sub_input_types = ["text", "search", "url", "tel", "email", "password", "date", "month", "week", "time",
"datetime-local", "number"];
let partial_selector = 'form[name ="' + form_name + '"] input[type="';
$.each(implicit_sub_input_types, function(index, value) {
let input_elements = $(partial_selector + value + '"]');

// for each input element of the given type in form, disable submit on pressing Enter
// by making the keydown event return false on presses of that key
input_elements.each(function() {
$(this).keydown(function (e) {
if (e.keyCode === 13) {
e.preventDefault();
return false;
}
});
});
});
}

function replicate_text(input_selector, destination_selector)
{
$(input_selector).bind('input', function(){
Expand All @@ -19,8 +41,7 @@ function replicate_text(input_selector, destination_selector)
});
}

function select_class(input_selector, destination_selector, input_to_class)
{
function select_class(input_selector, destination_selector, input_to_class) {
$(input_selector).change(function(){
$(this).val(function(_, v){
$(destination_selector).removeClass()
Expand Down
4 changes: 4 additions & 0 deletions microsetta_private_api/static/vue_survey_form.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,3 +40,7 @@ var vm = new Vue({
}
},
});

// This CANNOT be done in $(document).ready() on the page containing the vue form because
// the vue form is not created until after point :(
preventImplicitSubmission("survey_form");
11 changes: 5 additions & 6 deletions microsetta_private_api/templates/account_details.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,15 @@
{% set show_breadcrumbs = True %}
{% set show_logout = True %}
{% block head %}
<script src="/static/vendor/js/jquery-3.4.1.min.js"></script>
<script src="/static/vendor/js/jquery.validate.min.js"></script>
<script>
// Wait for the DOM to be ready
$(function() {
preclude_whitespace("#kit_name")
$(document).ready(function(){
let form_name = 'acct_form';
preventImplicitSubmission(form_name);
preclude_whitespace("#kit_name");
// Initialize form validation on the registration form.
// It has the name attribute "registration"
$("form[name='acct_form']").validate({
$("form[name='" + form_name + "']").validate({
// Specify validation rules
rules: {
// The key name on the left side is the name attribute
Expand Down
17 changes: 0 additions & 17 deletions microsetta_private_api/templates/account_overview.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,23 +5,6 @@
{% block head %}
<script src="/static/vendor/js/jquery-3.4.1.min.js"></script>
<script src="/static/vendor/js/jquery.validate.min.js"></script>
<script>
$(document).ready(function() {
// Initialize form validation
$("form[name='new_source_form']").validate({
// Specify validation rules
rules: {
// The key name on the left side is the name attribute
// of an input field. Validation rules are defined
// on the right side
// TODO: Nothing here keeps someone from e.g. naming all their sources "Bob", etc
source_name: "required",
source_type: "required"
}
});
});
</script>
{% endblock %}
{% block breadcrumb %}
<li class="breadcrumb-item active" aria-current="page">Account</li>
Expand Down
6 changes: 5 additions & 1 deletion microsetta_private_api/templates/create_nonhuman_source.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,11 @@
{% set page_title = "Create Non-human Source" %}
{% set show_breadcrumbs = True %}
{% block head %}

<script>
$(document).ready(function(){
preventImplicitSubmission("new_source_form");
});
</script>
{% endblock %}
{% block content %}
<div class="container">
Expand Down
66 changes: 35 additions & 31 deletions microsetta_private_api/templates/sample.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,30 +11,34 @@
<script type="text/javascript" src="/static/vendor/js/jquery.timepicker.min.js"></script>

<script>
$( function() {
$( "#sample_date" ).datepicker({
onClose: function() {
$(this).valid();
}});
$(document).ready(function(){
let form_name = 'sample_form';
preventImplicitSubmission(form_name);
$( "#sample_time" ).timepicker({
timeFormat: 'h:mm p',
interval: 30,
{% if sample.sample_time == "" %}
defaultTime: 'now',
{% else %}
defaultTime: '{{ sample.sample_time }}',
{% endif %}
startTime: '8',
dynamic: false,
dropdown: true,
scrollbar: true,
change: function() {
$(this).valid();
}
});
$("#sample_date" ).datepicker({
onClose: function() {
$(this).valid();
}
});
$( "#sample_time" ).timepicker({
timeFormat: 'h:mm p',
interval: 30,
{% if sample.sample_time == "" %}
defaultTime: 'now',
{% else %}
defaultTime: '{{ sample.sample_time }}',
{% endif %}
startTime: '8',
dynamic: false,
dropdown: true,
scrollbar: true,
change: function() {
$(this).valid();
}
});
$("form[name='sample_form']").validate({
$("form[name='" + form_name + "']").validate({
// don't automatically move into the Date field
// as that triggers the pop up and it's annoying
focusInvalid: false,
Expand All @@ -56,12 +60,12 @@
}
});
{% if not is_environmental %}
// https://github.com/jquery-validation/jquery-validation/issues/1872#issuecomment-257874743
$('#sample_site').on('change', function(){
$("form[name='sample_form']").validate().element('select');
});
{% endif %}
{% if not is_environmental %}
// https://github.com/jquery-validation/jquery-validation/issues/1872#issuecomment-257874743
$('#sample_site').on('change', function(){
$("form[name='" + form_name + "']").validate().element('select');
});
{% endif %}
});
</script>
{% endblock %}
Expand Down Expand Up @@ -129,11 +133,11 @@
{% endif %}

<div class="form-group">
<label for="sample_notes" name="sample_notes_label">Notes</label>
<label for="sample_notes" id="sample_notes_label">Notes</label>
<div class="col-sm-10">
<textarea class="form-control" id="sample_notes" name="sample_notes" rows=3>{{ sample.sample_notes |e}}</textarea>
</div>

</div>
</div>
<button type="submit" class="btn btn-primary">Update</button>
</form>
</div>
Expand Down
23 changes: 11 additions & 12 deletions microsetta_private_api/templates/sitebase.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,26 +4,25 @@
<meta charset="utf-8"/>
<title>Microsetta {{page_title}}</title>

<link rel="stylesheet" href="/static/vendor/bootstrap-4.4.1-dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="/static/css/minimal_interface.css" />
<style>
{% if admin_mode %}
body {
padding-top: 50px;
margin: 2%;
}
{% endif %}
</style>

<!-- jquery must be enabled before bootstrap for collapsible functionality -->
<script src="/static/vendor/js/jquery-3.4.1.min.js"></script>
<script src="/static/vendor/js/jquery.validate.min.js"></script>
<script src="/static/vendor/bootstrap-4.4.1-dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/static/vendor/bootstrap-4.4.1-dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="/static/css/minimal_interface.css" />
<script src="/static/input_util.js"></script>

{%block head%}
{%endblock%}


<style>
{% if admin_mode %}
body {
padding-top: 50px;
margin: 2%;
}
{% endif %}
</style>
</head>
<body>
{% if admin_mode %}
Expand Down
6 changes: 4 additions & 2 deletions microsetta_private_api/templates/source.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,9 +75,11 @@
// Wait for the DOM to be ready
$(document).ready(function(){
preclude_whitespace('#kit_name')
let form_name = 'list_kit_form';
preventImplicitSubmission(form_name);
preclude_whitespace('#kit_name');
let kit_validation_setup_func = make_kit_validation_setup_func('list_kit_form', kitSubmitHandler);
let kit_validation_setup_func = make_kit_validation_setup_func(form_name, kitSubmitHandler);
kit_validation_setup_func()
});
</script>
Expand Down
61 changes: 29 additions & 32 deletions microsetta_private_api/templates/survey.jinja2
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,16 +49,14 @@
return false;
}
function set_triggers(model, field)
{
if ('triggered_by' in field && field.triggered_by !== null && field.triggered_by.length > 0)
{
field.visible = function()
{
visible = false
for (var entry of field.triggered_by)
visible |= (model[entry['q_id']] === entry['response'])
return visible
function set_triggers(model, field) {
if ('triggered_by' in field && field.triggered_by !== null && field.triggered_by.length > 0) {
field.visible = function() {
let visible = false;
for (let entry of field.triggered_by) {
visible |= (model[entry['q_id']] === entry['response']);
}
return visible;
}
}
}
Expand All @@ -70,37 +68,36 @@
{% block content %}
<div class="panel panel-default">
<div class="panel-body">
<form id="survey_form">
<form id="survey_form" name="survey_form">
<vue-form-generator :schema="schema" :model="model" :options="formOptions"></vue-form-generator>
</form>
</div>
</div>

<script type="text/javascript">
var survey_model = {}
var survey_schema={{survey_schema|tojson}}
var survey_model = {};
var survey_schema= {{survey_schema|tojson}} ;
if (survey_schema.fields !== null)
for (var field of survey_schema.fields)
{
set_triggers(survey_model, field)
if (survey_schema.fields !== null) {
for (let field of survey_schema.fields) {
set_triggers(survey_model, field)
}
for (let group of survey_schema.groups) {
for (let field of group.fields) {
set_triggers(survey_model, field)
}
}
}
for (var group of survey_schema.groups)
for (var field of group.fields)
{
set_triggers(survey_model, field)
}
last_group = survey_schema.groups[survey_schema.groups.length-1]
last_group.fields.push(
{
buttonText: "Submit Survey",
type: "submit",
validateBeforeSubmit: true,
onSubmit: function(){
return postSurvey();
}
});
last_group = survey_schema.groups[survey_schema.groups.length-1];
last_group.fields.push({
buttonText: "Submit Survey",
type: "submit",
validateBeforeSubmit: true,
onSubmit: function(){
return postSurvey();
}
});
</script>
<script type="text/javascript" src="/static/vue_survey_form.js"></script>
{% endblock %}

0 comments on commit 008ab91

Please sign in to comment.