芝麻web文件管理V1.00
编辑当前文件:/home2/sdektunc/.trash/cepali/lib/form/form.js
/** * This file contains JS functionality required by mforms and is included automatically * when required. */ // Namespace for the form bits and bobs M.form = M.form || {}; if (typeof M.form.dependencyManager === 'undefined') { var dependencyManager = function() { dependencyManager.superclass.constructor.apply(this, arguments); }; Y.extend(dependencyManager, Y.Base, { _locks: null, _hides: null, _dirty: null, _nameCollections: null, _fileinputs: null, initializer: function() { // Setup initial values for complex properties. this._locks = {}; this._hides = {}; this._dirty = {}; // Setup event handlers. Y.Object.each(this.get('dependencies'), function(value, i) { var elements = this.elementsByName(i); elements.each(function(node) { var nodeName = node.get('nodeName').toUpperCase(); if (nodeName == 'INPUT') { if (node.getAttribute('type').match(/^(button|submit|radio|checkbox)$/)) { node.on('click', this.updateEventDependencies, this); } else { node.on('blur', this.updateEventDependencies, this); } node.on('change', this.updateEventDependencies, this); } else if (nodeName == 'SELECT') { node.on('change', this.updateEventDependencies, this); } else { node.on('click', this.updateEventDependencies, this); node.on('blur', this.updateEventDependencies, this); node.on('change', this.updateEventDependencies, this); } }, this); }, this); // Handle the reset button. this.get('form').get('elements').each(function(input) { if (input.getAttribute('type') == 'reset') { input.on('click', function() { this.get('form').reset(); this.updateAllDependencies(); }, this); } }, this); this.updateAllDependencies(); }, /** * Initializes the mapping from element name to YUI NodeList */ initElementsByName: function() { var names = {}; // Form elements with a given name. var allnames = {}; // Form elements AND outer elements for groups with a given name. // Collect element names. Y.Object.each(this.get('dependencies'), function(conditions, i) { names[i] = new Y.NodeList(); allnames[i] = new Y.NodeList(); for (var condition in conditions) { for (var value in conditions[condition]) { for (var hide in conditions[condition][value]) { for (var ei in conditions[condition][value][hide]) { names[conditions[condition][value][hide][ei]] = new Y.NodeList(); allnames[conditions[condition][value][hide][ei]] = new Y.NodeList(); } } } } }); // Locate elements for each name. this.get('form').get('elements').each(function(node) { var name = node.getAttribute('name'); if (({}).hasOwnProperty.call(names, name)) { names[name].push(node); allnames[name].push(node); } }); // Locate any groups with the given name. this.get('form').all('.fitem').each(function(node) { var name = node.getData('groupname'); if (name && ({}).hasOwnProperty.call(allnames, name)) { allnames[name].push(node); } }); this._nameCollections = {names: names, allnames: allnames}; }, /** * Gets all elements in the form by their name and returns * a YUI NodeList * * @param {String} name The form element name. * @param {Boolean} includeGroups (optional - default false) Should the outer element for groups be included? * @return {Y.NodeList} */ elementsByName: function(name, includeGroups) { if (includeGroups === undefined) { includeGroups = false; } var collection = (includeGroups ? 'allnames' : 'names'); if (!this._nameCollections) { this.initElementsByName(); } if (!({}).hasOwnProperty.call(this._nameCollections[collection], name)) { return new Y.NodeList(); } return this._nameCollections[collection][name]; }, /** * Checks the dependencies the form has an makes any changes to the * form that are required. * * 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} dependon The form element name to check dependencies against. * @return {Boolean} */ checkDependencies: function(e, dependon) { var dependencies = this.get('dependencies'), tohide = {}, tolock = {}, condition, value, isHide, lock, hide, checkfunction, result, elements; if (!({}).hasOwnProperty.call(dependencies, dependon)) { return true; } elements = this.elementsByName(dependon); for (condition in dependencies[dependon]) { for (value in dependencies[dependon][condition]) { for (isHide in dependencies[dependon][condition][value]) { checkfunction = '_dependency' + condition[0].toUpperCase() + condition.slice(1); if (Y.Lang.isFunction(this[checkfunction])) { result = this[checkfunction].apply(this, [elements, value, (isHide === "1"), e]); } else { result = this._dependencyDefault(elements, value, (isHide === "1"), e); } lock = result.lock || false; hide = result.hide || false; for (var ei in dependencies[dependon][condition][value][isHide]) { var eltolock = dependencies[dependon][condition][value][isHide][ei]; if (({}).hasOwnProperty.call(tohide, eltolock)) { tohide[eltolock] = tohide[eltolock] || hide; } else { tohide[eltolock] = hide; } if (({}).hasOwnProperty.call(tolock, eltolock)) { tolock[eltolock] = tolock[eltolock] || lock; } else { tolock[eltolock] = lock; } } } } } for (var el in tolock) { var needsupdate = false; if (!({}).hasOwnProperty.call(this._locks, el)) { this._locks[el] = {}; } if (({}).hasOwnProperty.call(tolock, el) && tolock[el]) { if (!({}).hasOwnProperty.call(this._locks[el], dependon) || this._locks[el][dependon]) { this._locks[el][dependon] = true; needsupdate = true; } } else if (({}).hasOwnProperty.call(this._locks[el], dependon) && this._locks[el][dependon]) { delete this._locks[el][dependon]; needsupdate = true; } if (!({}).hasOwnProperty.call(this._hides, el)) { this._hides[el] = {}; } if (({}).hasOwnProperty.call(tohide, el) && tohide[el]) { if (!({}).hasOwnProperty.call(this._hides[el], dependon) || this._hides[el][dependon]) { this._hides[el][dependon] = true; needsupdate = true; } } else if (({}).hasOwnProperty.call(this._hides[el], dependon) && this._hides[el][dependon]) { delete this._hides[el][dependon]; needsupdate = true; } if (needsupdate) { this._dirty[el] = true; } } return true; }, /** * Update all dependencies in form */ updateAllDependencies: function() { Y.Object.each(this.get('dependencies'), function(value, name) { this.checkDependencies(null, name); }, this); this.updateForm(); }, /** * Update dependencies associated with event * * @param {Event} e The event. */ updateEventDependencies: function(e) { var el = e.target.getAttribute('name'); this.checkDependencies(e, el); this.updateForm(); }, /** * Flush pending changes to the form */ updateForm: function() { var el; for (el in this._dirty) { if (({}).hasOwnProperty.call(this._locks, el)) { this._disableElement(el, !Y.Object.isEmpty(this._locks[el])); } if (({}).hasOwnProperty.call(this._hides, el)) { this._hideElement(el, !Y.Object.isEmpty(this._hides[el])); } } this._dirty = {}; }, /** * 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. */ _disableElement: function(name, disabled) { var els = this.elementsByName(name), filepicker = this.isFilePicker(name), editors = this.get('form').all('.fitem [data-fieldtype="editor"] textarea[name="' + name + '[text]"]'); els.each(function(node) { if (disabled) { node.setAttribute('disabled', 'disabled'); } else { node.removeAttribute('disabled'); } // Extra code to disable filepicker or filemanager form elements if (filepicker) { var fitem = node.ancestor('.fitem'); if (fitem) { if (disabled) { fitem.addClass('disabled'); } else { fitem.removeClass('disabled'); } } } }); editors.each(function(editor) { if (disabled) { editor.setAttribute('readonly', 'readonly'); } else { editor.removeAttribute('readonly', 'readonly'); } editor.getDOMNode().dispatchEvent(new Event('form:editorUpdated')); }); }, /** * Hides or shows all form elements with the given name. * * @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, true); els.each(function(node) { var e = node.ancestor('.fitem', true); var label = null, id = null; if (e) { // Cope with differences between clean and boost themes. if (e.hasClass('fitem_fgroup')) { // Items within groups are not wrapped in div.fitem in theme_clean, so // we need to hide the input, not the div.fitem. e = node; } if (hidden) { e.setAttribute('hidden', 'hidden'); } else { e.removeAttribute('hidden'); } e.setStyles({ display: (hidden) ? 'none' : '' }); // Hide/unhide the label as well. id = node.get('id'); if (id) { label = Y.all('label[for="' + id + '"]'); if (label) { if (hidden) { label.setAttribute('hidden', 'hidden'); } else { label.removeAttribute('hidden'); } label.setStyles({ display: (hidden) ? 'none' : '' }); } } } }); }, /** * Is the form element inside a filepicker or filemanager? * * @param {String} el The form element name. * @return {Boolean} */ isFilePicker: function(el) { if (!this._fileinputs) { var fileinputs = {}; var selector = '.fitem [data-fieldtype="filepicker"] input,.fitem [data-fieldtype="filemanager"] input'; var els = this.get('form').all(selector); els.each(function(node) { fileinputs[node.getAttribute('name')] = true; }); this._fileinputs = fileinputs; } if (({}).hasOwnProperty.call(this._fileinputs, el)) { return this._fileinputs[el] || false; } return false; }, _dependencyNotchecked: function(elements, value, isHide) { var lock = false; 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) { return; } lock = lock || !Y.Node.getDOMNode(this).checked; }); return { lock: lock, hide: isHide ? lock : false }; }, _dependencyChecked: function(elements, value, isHide) { var lock = false; 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) { return; } lock = lock || Y.Node.getDOMNode(this).checked; }); return { lock: lock, hide: isHide ? lock : false }; }, _dependencyNoitemselected: function(elements, value, isHide) { var lock = false; elements.each(function() { lock = lock || this.get('selectedIndex') == -1; }); return { lock: lock, hide: isHide ? lock : false }; }, _dependencyEq: function(elements, value, isHide) { var lock = false; var hiddenVal = false; var options, v, selected, values; 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()) { // This is the hidden input that is part of an advcheckbox. hiddenVal = (this.get('value') == value); return; } else if (this.getAttribute('type').toLowerCase() == 'checkbox' && !Y.Node.getDOMNode(this).checked) { lock = lock || hiddenVal; return; } if (this.getAttribute('class').toLowerCase() == 'filepickerhidden') { // Check for filepicker status. var elementname = this.getAttribute('name'); if (elementname && M.form_filepicker.instances[elementname].fileadded) { lock = false; } else { lock = true; } } else if (this.get('nodeName').toUpperCase() === 'SELECT' && this.get('multiple') === true) { // Multiple selects can have one or more value assigned. A pipe (|) is used as a value separator // when multiple values have to be selected at the same time. values = value.split('|'); selected = []; options = this.get('options'); options.each(function() { if (this.get('selected')) { selected[selected.length] = this.get('value'); } }); if (selected.length > 0 && selected.length === values.length) { for (var i in selected) { v = selected[i]; if (values.indexOf(v) > -1) { lock = true; } else { lock = false; return; } } } else { lock = false; } } else { lock = lock || this.get('value') == value; } }); return { lock: lock, hide: isHide ? lock : false }; }, /** * Lock the given field if the field value is in the given set of values. * * @param {Array} elements * @param {String} values Single value or pipe (|) separated values when multiple * @returns {{lock: boolean, hide: boolean}} * @private */ _dependencyIn: function(elements, values, isHide) { // 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 hiddenVal = false; var options, v, selected, value; 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()) { // This is the hidden input that is part of an advcheckbox. hiddenVal = (values.indexOf(this.get('value')) > -1); return; } else if (this.getAttribute('type').toLowerCase() == 'checkbox' && !Y.Node.getDOMNode(this).checked) { lock = lock || hiddenVal; return; } if (this.getAttribute('class').toLowerCase() == 'filepickerhidden') { // Check for filepicker status. var elementname = this.getAttribute('name'); if (elementname && M.form_filepicker.instances[elementname].fileadded) { lock = false; } else { lock = true; } } else if (this.get('nodeName').toUpperCase() === 'SELECT' && this.get('multiple') === true) { // Multiple selects can have one or more value assigned. selected = []; options = this.get('options'); options.each(function() { if (this.get('selected')) { selected[selected.length] = this.get('value'); } }); if (selected.length > 0 && selected.length === values.length) { for (var i in selected) { v = selected[i]; if (values.indexOf(v) > -1) { lock = true; } else { lock = false; return; } } } else { lock = false; } } else { value = this.get('value'); lock = lock || (values.indexOf(value) > -1); } }); return { lock: lock, hide: isHide ? lock : false }; }, _dependencyHide: function(elements, value) { return { lock: false, hide: true }; }, _dependencyDefault: function(elements, value, isHide) { var lock = false, hiddenVal = false, values ; elements.each(function() { var selected; 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()) { // This is the hidden input that is part of an advcheckbox. hiddenVal = (this.get('value') != value); return; } else if (this.getAttribute('type').toLowerCase() == 'checkbox' && !Y.Node.getDOMNode(this).checked) { lock = lock || hiddenVal; return; } // Check for filepicker status. if (this.getAttribute('class').toLowerCase() == 'filepickerhidden') { var elementname = this.getAttribute('name'); if (elementname && M.form_filepicker.instances[elementname].fileadded) { lock = true; } else { lock = false; } } else if (this.get('nodeName').toUpperCase() === 'SELECT' && this.get('multiple') === true) { // Multiple selects can have one or more value assigned. A pipe (|) is used as a value separator // when multiple values have to be selected at the same time. values = value.split('|'); selected = []; this.get('options').each(function() { if (this.get('selected')) { selected[selected.length] = this.get('value'); } }); if (selected.length > 0 && selected.length === values.length) { for (var i in selected) { if (values.indexOf(selected[i]) > -1) { lock = false; } else { lock = true; return; } } } else { lock = true; } } else { lock = lock || this.get('value') != value; } }); return { lock: lock, hide: isHide ? lock : false }; } }, { NAME: 'mform-dependency-manager', ATTRS: { form: { setter: function(value) { return Y.one('#' + value); }, value: null }, dependencies: { value: {} } } }); M.form.dependencyManager = dependencyManager; } /** * Stores a list of the dependencyManager for each form on the page. */ 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) { // If the dependencies isn't an array or object we don't want to // know about it if (!Y.Lang.isArray(dependencies) && !Y.Lang.isObject(dependencies)) { return false; } /** * Fixes an issue with YUI's processing method of form.elements property * in Internet Explorer. * http://yuilibrary.com/projects/yui3/ticket/2528030 */ Y.Node.ATTRS.elements = { getter: function() { return Y.all(new Y.Array(this._node.elements, 0, true)); } }; M.form.dependencyManagers[formid] = new M.form.dependencyManager({form: formid, dependencies: dependencies}); return M.form.dependencyManagers[formid]; }; /** * 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) { M.form.dependencyManagers[formid].updateAllDependencies(); } };