diff options
Diffstat (limited to 'app/assets/javascripts/behaviors')
5 files changed, 50 insertions, 4 deletions
diff --git a/app/assets/javascripts/behaviors/autosize.js b/app/assets/javascripts/behaviors/autosize.js index f977a1e8a7b..dc8ae601961 100644 --- a/app/assets/javascripts/behaviors/autosize.js +++ b/app/assets/javascripts/behaviors/autosize.js @@ -1,7 +1,5 @@ /*= require jquery.ba-resize */ - - /*= require autosize */ (function() { diff --git a/app/assets/javascripts/behaviors/details_behavior.js b/app/assets/javascripts/behaviors/details_behavior.js index 3631d1b74ac..1df681a4816 100644 --- a/app/assets/javascripts/behaviors/details_behavior.js +++ b/app/assets/javascripts/behaviors/details_behavior.js @@ -5,6 +5,12 @@ container = $(this).closest(".js-details-container"); return container.toggleClass("open"); }); + // Show details content. Hides link after click. + // + // %div + // %a.js-details-expand + // %div.js-details-content + // return $("body").on("click", ".js-details-expand", function(e) { $(this).next('.js-details-content').removeClass("hide"); $(this).hide(); diff --git a/app/assets/javascripts/behaviors/quick_submit.js b/app/assets/javascripts/behaviors/quick_submit.js index 3527d0a95fc..54b7360ab41 100644 --- a/app/assets/javascripts/behaviors/quick_submit.js +++ b/app/assets/javascripts/behaviors/quick_submit.js @@ -1,6 +1,20 @@ - +// Quick Submit behavior +// +// When a child field of a form with a `js-quick-submit` class receives a +// "Meta+Enter" (Mac) or "Ctrl+Enter" (Linux/Windows) key combination, the form +// is submitted. +// /*= require extensions/jquery */ +// +// ### Example Markup +// +// <form action="/foo" class="js-quick-submit"> +// <input type="text" /> +// <textarea></textarea> +// <input type="submit" value="Submit" /> +// </form> +// (function() { var isMac, keyCodeIs; @@ -17,6 +31,7 @@ $(document).on('keydown.quick_submit', '.js-quick-submit', function(e) { var $form, $submit_button; + // Enter if (!keyCodeIs(e, 13)) { return; } @@ -33,8 +48,11 @@ return $form.submit(); }); + // If the user tabs to a submit button on a `js-quick-submit` form, display a + // tooltip to let them know they could've used the hotkey $(document).on('keyup.quick_submit', '.js-quick-submit input[type=submit], .js-quick-submit button[type=submit]', function(e) { var $this, title; + // Tab if (!keyCodeIs(e, 9)) { return; } diff --git a/app/assets/javascripts/behaviors/requires_input.js b/app/assets/javascripts/behaviors/requires_input.js index db0b36b24e9..894034bdd54 100644 --- a/app/assets/javascripts/behaviors/requires_input.js +++ b/app/assets/javascripts/behaviors/requires_input.js @@ -1,6 +1,18 @@ - +// Requires Input behavior +// +// When called on a form with input fields with the `required` attribute, the +// form's submit button will be disabled until all required fields have values. +// /*= require extensions/jquery */ +// +// ### Example Markup +// +// <form class="js-requires-input"> +// <input type="text" required="required"> +// <input type="submit" value="Submit"> +// </form> +// (function() { $.fn.requiresInput = function() { var $button, $form, fieldSelector, requireInput, required; @@ -11,14 +23,17 @@ requireInput = function() { var values; values = _.map($(fieldSelector, $form), function(field) { + // Collect the input values of *all* required fields return field.value; }); + // Disable the button if any required fields are empty if (values.length && _.any(values, _.isEmpty)) { return $button.disable(); } else { return $button.enable(); } }; + // Set initial button state requireInput(); return $form.on('change input', fieldSelector, requireInput); }; @@ -27,6 +42,8 @@ var $form, hideOrShowHelpBlock; $form = $('form.js-requires-input'); $form.requiresInput(); + // Hide or Show the help block when creating a new project + // based on the option selected hideOrShowHelpBlock = function(form) { var selected; selected = $('.js-select-namespace option:selected'); diff --git a/app/assets/javascripts/behaviors/toggler_behavior.js b/app/assets/javascripts/behaviors/toggler_behavior.js index 5467e3edc69..a6ce378d67a 100644 --- a/app/assets/javascripts/behaviors/toggler_behavior.js +++ b/app/assets/javascripts/behaviors/toggler_behavior.js @@ -1,5 +1,12 @@ (function(w) { $(function() { + // Toggle button. Show/hide content inside parent container. + // Button does not change visibility. If button has icon - it changes chevron style. + // + // %div.js-toggle-container + // %a.js-toggle-button + // %div.js-toggle-content + // $('body').on('click', '.js-toggle-button', function(e) { e.preventDefault(); $(this) |