From e40dd1cdcdf2fb699a59a45c09fc81cabd95cb23 Mon Sep 17 00:00:00 2001 From: "Eloy Lafuente (stronk7)" Date: Tue, 21 Jun 2016 23:37:59 +0200 Subject: [PATCH] MDL-54778 form: Make it all js style (eslint) compliant The changes in this commit should not be problematic, just: - different whitespace. - some docs. - 1 variable to camelCase. And then, less trivial, but safe enough IMO: - a change to camelCase some identifiers and their calculation. --- lib/form/form.js | 123 ++++++++++++++++++++++++++--------------------- 1 file changed, 68 insertions(+), 55 deletions(-) diff --git a/lib/form/form.js b/lib/form/form.js index f1d95c9c0b6..268fba2143c 100644 --- a/lib/form/form.js +++ b/lib/form/form.js @@ -26,7 +26,7 @@ if (typeof M.form.dependencyManager === 'undefined') { // Setup event handlers. Y.Object.each(this.get('dependencies'), function(value, i) { var elements = this.elementsByName(i); - elements.each(function(node){ + elements.each(function(node) { var nodeName = node.get('nodeName').toUpperCase(); if (nodeName == 'INPUT') { if (node.getAttribute('type').match(/^(button|submit|radio|checkbox)$/)) { @@ -46,9 +46,9 @@ if (typeof M.form.dependencyManager === 'undefined') { }, this); // Handle the reset button. - this.get('form').get('elements').each(function(input){ + this.get('form').get('elements').each(function(input) { if (input.getAttribute('type') == 'reset') { - input.on('click', function(){ + input.on('click', function() { this.get('form').reset(); this.updateAllDependencies(); }, this); @@ -77,7 +77,7 @@ if (typeof M.form.dependencyManager === 'undefined') { }); // Locate elements for each name. - this.get('form').get('elements').each(function(node){ + this.get('form').get('elements').each(function(node) { var name = node.getAttribute('name'); if (({}).hasOwnProperty.call(names, name)) { names[name].push(node); @@ -90,7 +90,7 @@ if (typeof M.form.dependencyManager === 'undefined') { * Gets all elements in the form by their name and returns * a YUI NodeList * - * @param {string} name The form element name. + * @param {String} name The form element name. * @return {Y.NodeList} */ elementsByName: function(name) { @@ -107,11 +107,12 @@ if (typeof M.form.dependencyManager === 'undefined') { * Checks the dependencies the form has an makes any changes to the * form that are required. * - * Changes are made by functions title _dependency_{dependencytype} + * Changes are made by functions title _dependency{Dependencytype} * and more can easily be introduced by defining further functions. * * @param {EventFacade | null} e The event, if any. - * @param {string} name The form element name to check dependencies against. + * @param {String} dependon The form element name to check dependencies against. + * @return {Boolean} */ checkDependencies: function(e, dependon) { var dependencies = this.get('dependencies'), @@ -125,11 +126,11 @@ if (typeof M.form.dependencyManager === 'undefined') { elements = this.elementsByName(dependon); for (condition in dependencies[dependon]) { for (value in dependencies[dependon][condition]) { - checkfunction = '_dependency_'+condition; + checkfunction = '_dependency' + condition[0].toUpperCase() + condition.slice(1); if (Y.Lang.isFunction(this[checkfunction])) { result = this[checkfunction].apply(this, [elements, value, e]); } else { - result = this._dependency_default(elements, value, e); + result = this._dependencyDefault(elements, value, e); } lock = result.lock || false; hide = result.hide || false; @@ -224,13 +225,13 @@ if (typeof M.form.dependencyManager === 'undefined') { /** * Disables or enables all form elements with the given name * - * @param {string} name The form element name. - * @param {boolean} disabled True to disable, false to enable. + * @param {String} name The form element name. + * @param {Boolean} disabled True to disable, false to enable. */ _disableElement: function(name, disabled) { var els = this.elementsByName(name); var filepicker = this.isFilePicker(name); - els.each(function(node){ + els.each(function(node) { if (disabled) { node.setAttribute('disabled', 'disabled'); } else { @@ -241,7 +242,7 @@ if (typeof M.form.dependencyManager === 'undefined') { if (filepicker) { var fitem = node.ancestor('.fitem'); if (fitem) { - if (disabled){ + if (disabled) { fitem.addClass('disabled'); } else { fitem.removeClass('disabled'); @@ -253,16 +254,16 @@ if (typeof M.form.dependencyManager === 'undefined') { /** * Hides or shows all form elements with the given name. * - * @param {string} name The form element name. - * @param {boolean} disabled True to hide, false to show. + * @param {String} name The form element name. + * @param {Boolean} hidden True to hide, false to show. */ _hideElement: function(name, hidden) { var els = this.elementsByName(name); - els.each(function(node){ + els.each(function(node) { var e = node.ancestor('.fitem'); if (e) { e.setStyles({ - display: (hidden)?'none':'' + display: (hidden) ? 'none' : '' }); } }); @@ -270,14 +271,14 @@ if (typeof M.form.dependencyManager === 'undefined') { /** * Is the form element inside a filepicker or filemanager? * - * @param {string} el The form element name. - * @return {boolean} + * @param {String} el The form element name. + * @return {Boolean} */ isFilePicker: function(el) { if (!this._fileinputs) { var fileinputs = {}; var els = this.get('form').all('.fitem.fitem_ffilepicker input,.fitem.fitem_ffilemanager input'); - els.each(function(node){ + els.each(function(node) { fileinputs[node.getAttribute('name')] = true; }); this._fileinputs = fileinputs; @@ -289,14 +290,15 @@ if (typeof M.form.dependencyManager === 'undefined') { return false; }, - _dependency_notchecked: function(elements, value) { + _dependencyNotchecked: function(elements, value) { var lock = false; - elements.each(function(){ - if (this.getAttribute('type').toLowerCase()=='hidden' && !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { + elements.each(function() { + if (this.getAttribute('type').toLowerCase() == 'hidden' && + !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { // This is the hidden input that is part of an advcheckbox. return; } - if (this.getAttribute('type').toLowerCase()=='radio' && this.get('value') != value) { + if (this.getAttribute('type').toLowerCase() == 'radio' && this.get('value') != value) { return; } lock = lock || !Y.Node.getDOMNode(this).checked; @@ -306,14 +308,15 @@ if (typeof M.form.dependencyManager === 'undefined') { hide: false }; }, - _dependency_checked: function(elements, value) { + _dependencyChecked: function(elements, value) { var lock = false; - elements.each(function(){ - if (this.getAttribute('type').toLowerCase()=='hidden' && !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { + elements.each(function() { + if (this.getAttribute('type').toLowerCase() == 'hidden' && + !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { // This is the hidden input that is part of an advcheckbox. return; } - if (this.getAttribute('type').toLowerCase()=='radio' && this.get('value') != value) { + if (this.getAttribute('type').toLowerCase() == 'radio' && this.get('value') != value) { return; } lock = lock || Y.Node.getDOMNode(this).checked; @@ -323,9 +326,9 @@ if (typeof M.form.dependencyManager === 'undefined') { hide: false }; }, - _dependency_noitemselected: function(elements, value) { + _dependencyNoitemselected: function(elements, value) { var lock = false; - elements.each(function(){ + elements.each(function() { lock = lock || this.get('selectedIndex') == -1; }); return { @@ -333,19 +336,20 @@ if (typeof M.form.dependencyManager === 'undefined') { hide: false }; }, - _dependency_eq: function(elements, value) { + _dependencyEq: function(elements, value) { var lock = false; - var hidden_val = false; + var hiddenVal = false; var options, v, selected, values; - elements.each(function(){ - if (this.getAttribute('type').toLowerCase()=='radio' && !Y.Node.getDOMNode(this).checked) { + elements.each(function() { + if (this.getAttribute('type').toLowerCase() == 'radio' && !Y.Node.getDOMNode(this).checked) { return; - } else if (this.getAttribute('type').toLowerCase() == 'hidden' && !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { + } else if (this.getAttribute('type').toLowerCase() == 'hidden' && + !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { // This is the hidden input that is part of an advcheckbox. - hidden_val = (this.get('value') == value); + hiddenVal = (this.get('value') == value); return; } else if (this.getAttribute('type').toLowerCase() == 'checkbox' && !Y.Node.getDOMNode(this).checked) { - lock = lock || hidden_val; + lock = lock || hiddenVal; return; } if (this.getAttribute('class').toLowerCase() == 'filepickerhidden') { @@ -392,27 +396,28 @@ if (typeof M.form.dependencyManager === 'undefined') { /** * Lock the given field if the field value is in the given set of values. * - * @param elements - * @param values + * @param {Array} elements + * @param {String} values Single value or pipe (|) separated values when multiple * @returns {{lock: boolean, hide: boolean}} * @private */ - _dependency_in: function(elements, values) { + _dependencyIn: function(elements, values) { // A pipe (|) is used as a value separator // when multiple values have to be passed on at the same time. values = values.split('|'); var lock = false; - var hidden_val = false; + var hiddenVal = false; var options, v, selected, value; - elements.each(function(){ - if (this.getAttribute('type').toLowerCase()=='radio' && !Y.Node.getDOMNode(this).checked) { + elements.each(function() { + if (this.getAttribute('type').toLowerCase() == 'radio' && !Y.Node.getDOMNode(this).checked) { return; - } else if (this.getAttribute('type').toLowerCase() == 'hidden' && !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { + } else if (this.getAttribute('type').toLowerCase() == 'hidden' && + !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { // This is the hidden input that is part of an advcheckbox. - hidden_val = (values.indexOf(this.get('value')) > -1); + hiddenVal = (values.indexOf(this.get('value')) > -1); return; } else if (this.getAttribute('type').toLowerCase() == 'checkbox' && !Y.Node.getDOMNode(this).checked) { - lock = lock || hidden_val; + lock = lock || hiddenVal; return; } if (this.getAttribute('class').toLowerCase() == 'filepickerhidden') { @@ -455,30 +460,31 @@ if (typeof M.form.dependencyManager === 'undefined') { hide: false }; }, - _dependency_hide: function(elements, value) { + _dependencyHide: function(elements, value) { return { lock: false, hide: true }; }, - _dependency_default: function(elements, value, ev) { + _dependencyDefault: function(elements, value, ev) { var lock = false, - hidden_val = false, + hiddenVal = false, values ; - elements.each(function(){ + elements.each(function() { var selected; - if (this.getAttribute('type').toLowerCase()=='radio' && !Y.Node.getDOMNode(this).checked) { + if (this.getAttribute('type').toLowerCase() == 'radio' && !Y.Node.getDOMNode(this).checked) { return; - } else if (this.getAttribute('type').toLowerCase() == 'hidden' && !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { + } else if (this.getAttribute('type').toLowerCase() == 'hidden' && + !this.siblings('input[type=checkbox][name="' + this.get('name') + '"]').isEmpty()) { // This is the hidden input that is part of an advcheckbox. - hidden_val = (this.get('value') != value); + hiddenVal = (this.get('value') != value); return; } else if (this.getAttribute('type').toLowerCase() == 'checkbox' && !Y.Node.getDOMNode(this).checked) { - lock = lock || hidden_val; + lock = lock || hiddenVal; return; } - //check for filepicker status + // Check for filepicker status. if (this.getAttribute('class').toLowerCase() == 'filepickerhidden') { var elementname = this.getAttribute('name'); if (elementname && M.form_filepicker.instances[elementname].fileadded) { @@ -543,6 +549,11 @@ M.form.dependencyManagers = {}; /** * Initialises a manager for a forms dependencies. * This should happen once per form. + * + * @param {YUI} Y YUI3 instance + * @param {String} formid ID of the form + * @param {Array} dependencies array + * @return {M.form.dependencyManager} */ M.form.initFormDependencies = function(Y, formid, dependencies) { @@ -571,6 +582,8 @@ M.form.initFormDependencies = function(Y, formid, dependencies) { * Update the state of a form. You need to call this after, for example, changing * the state of some of the form input elements in your own code, in order that * things like the disableIf state of elements can be updated. + * + * @param {String} formid ID of the form */ M.form.updateFormState = function(formid) { if (formid in M.form.dependencyManagers) { -- 2.36.1